open-index/open-npm huggingface dataset:
npm package: @samht/sveltekit-google-maps
Description: Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
Latest version: 0.0.7

# create-svelte

Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).

Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

## Developing

Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:

```bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open
```

Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.

## Building

To build your library:

```bash
npm run package
```

To create a production version of your showcase app:

```bash
npm run build
```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

## Publishing

Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).

To publish your library to [npm](https://www.npmjs.com):

```bash
npm publish
```
npm package: @samhuk/data-filter
Description: A Javascript data filter package with PostgreSQL support.
Latest version: 1.1.1

# data-filter

A package for creating data filters with conversion to an SQL WHERE clause and JSON representation.

data-filter supports both inline values and numbered parameters (as part of a prepared statement).

## Usage

`npm i @samhuk/data-filter`

Simple, single-node filter

```typescript
import { createDataFilter } from '@samhuk/data-filter'
import { Operator, DataFilterLogic } from '@samhuk/data-filter/types'

const df1 = createDataFilter({
  field: 'username',
  op: Operator.EQUALS,
  val: 'bob',
})
console.log(df1.toSql()) // { sql: (username = $1), values: ['bob'] }
console.log(df1.toSql({ useParameters: false })) // (username = 'bob')
```

Complex, nested filter:

```typescript
import { createDataFilter } from '@samhuk/data-filter'
import { Operator, DataFilterLogic } from '@samhuk/data-filter/types'

const df2 = createDataFilter({
  logic: DataFilterLogic.AND,
  nodes: [
    { field: 'id', op: Operator.IN, val: [1, 2, 3] },
    {
      logic: DataFilterLogic.OR,
      nodes: [
        { field: 'email_v1', op: Operator.NOT_EQUALS, val: null },
        { field: 'email_v2', op: Operator.NOT_EQUALS, val: null },
      ],
    },
    { field: 'date_deleted', op: Operator.NOT_EQUALS, val: 'null' },
  ],
})
console.log(df2.toSql({ indentation: 2 }))
```

Merging filters (using `df1` and `df2` from above):

```typescript
import { joinDataFilters } from '@samhuk/data-filter'
df1.addAnd({ field: 'bar', op: Operator.NOT_EQUALS, val: 'b' })
df1.addOr(df2.value)
const df3 = joinDataFilters(DataFilterLogic.AND, df1, df2)
```

See the JSDocs for more information on the available operators and other options.

## Development

`npm i`

`npm start` - Start a hot reloading tsc build.

`npm run check` - Run linting, unit tests, and tsc build.
npm package: @samhuk/data-query
Description: Data query package with SQL and URL conversions
Latest version: 1.2.3

# data-query

A package for creating data queries with paging, sorting, and filtering, with URL and SQL conversion.

## Usage

`npm i @samhuk/data-query`

```typescript
import { createDataQuery } from '@samhuk/data-query'
import { Operator, DataFilterLogic } from '@samhuk/data-filter/types'

const dq = createDataQuery({
  page: 5,
  pageSize: 10,
  sorting: [{ field: 'user_id', dir: 'asc' }],
  filter: {
    field: 'date_deleted',
    op: '!=',
    val: null,
  }
})

// Convert to/from SQL and URL params
const sql = dq.toSql()
const urlParams = dq.toUrlParams()
const urlParamsString = dq.toUrlParamsString()
const dq1FromUrlParams = createDataQuery().fromUrlParams(urlParams)

// Update parts of the data query
dq1FromUrlParams.updatePage(6).updatePageSize(11)
```

See the JSDocs for more information on the available options and other capabilities.

## Development

`npm i`

`npm start` - Start a hot reloading tsc build.

`npm run check` - Run linting, unit tests, and tsc build.
npm package: @samhuk/data-table
Description: A vanilla JS data table UI component
Latest version: 1.0.3

# data-table

A vanilla JS data table UI component. This shows a list of data as rows and columns, with a paginator to navigate pages of the data.

![sc1](img/sc1.png)

## Usage

`npm i @samhuk/data-table`

```typescript
import { createDataTable } from '@samhuk/data-table'

const element = document.createElement('div')

const createTestData = (q: DataTableQuery) => {
  const testData: any[] = []
  const start = (q.page - 1) * q.pageSize
  for (let i = start; i < start + q.pageSize; i += 1)
    testData.push({ uuid: i.toString(), field1: Math.random(), field2: Math.round(Math.random() * 100) })
  return testData
}

const dataTable = createDataTable({
  // Provide mock connector to supply test data
  connector: {
    getData: options => {
      // Artificial 0.5s delay
      setTimeout(() => {
        options.onComplete({
          data: createTestData(options.query),
          totalRowCount: 100
        })
      }, 500)
    }
  },
  tableOptions: {
    columnOrdering: ['field1', 'field2'],
    columnOptionsDict: {
      field1: {
        fieldName: 'field1'
      },
      field2: {
        fieldName: 'field2'
      }
    }
  },
  paginatorOptions: {
    page: 1,
    itemCount: 100,
    pageSize: 20,
    pageSizeOptions: [20, 50, 100, 500],
  }
})

element.appendChild(dataTable.rendered.element)
```

### Importing Styles

There are two main ways the styles of the component can be imported into another project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
  ```typescript
  // Import the scss entrypoint file from the src
  import 'node_modules/@samhuk/data-table/src/component/styles/index.scss'
  // Import the css bundle file
  import 'node_modules/@samhuk/data-table/dist/styles.css'
  ```
2. `@import` the scss entrypoint file into your scss file.
  ```scss
  @import '~@samhuk/data-table/src/component/styles/index.scss';
  ```
npm package: @samhuk/number-input
Description: A vanilla JS number input UI component
Latest version: 1.0.3

# number-input

A vanilla JS number input component.

![sc1](./img/sc1.png)

## Usage

`npm i @samhuk/number-input`

```typescript
import { createNumberInput } from '@samhuk/number-input'

const element = document.createElement('div')

// Create table with 3 column and 3 rows of data
const numberInput = createNumberInput({
  label: 'Page size',
  page: 1,
  min: 1,
  max: 10,
  step: 1,
})

element.appendChild(numberInput.rendered.element)
```

### Importing Styles

There are two main ways of importing the styles for the component into your project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
    ```typescript
    // Import the scss entrypoint file from the src
    import 'node_modules/@samhuk/number-input/src/component/styles/index.scss'
    // Import the css bundle file
    import 'node_modules/@samhuk/number-input/dist/styles.css'
    ```
2. `@import` the scss entrypoint file into your scss file.
    ```scss
    @import '~@samhuk/number-input/src/component/styles/index.scss';
    ```

## Development Deployment

One must have node and npm installed. Get node from [nodejs.org](https://nodejs.org/en/download/).

Run `npm i`

Run `npm start`

Try navigating to localhost:4001.
npm package: @samhuk/paginator
Description: Vanilla JS paginator UI component
Latest version: 1.0.3

# paginator

A vanilla JS paginator UI component.

![sc1](img/sc1.png)

## Usage

`npm i @samhuk/paginator`

```typescript
import { createPaginator } from '@samhuk/paginator'

const element = document.createElement('div')

const paginator = createPaginator({
  page: 1,
  itemCount: 50,
  pageSize: 20,
  pageSizeOptions: [20, 50, 100, 500],
})

element.appendChild(paginator.rendered.element)
```

### Importing Styles

There are two main ways the styles of the component can be imported into another project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
  ```typescript
  // Import the scss entrypoint file from the src
  import 'node_modules/@samhuk/paginator/src/component/styles/index.scss'
  // Import the css bundle file
  import 'node_modules/@samhuk/paginator/dist/styles.css'
  ```
2. `@import` the scss entrypoint file into your scss file.
  ```scss
  @import '~@samhuk/paginator/src/component/styles/index.scss';
  ```
npm package: @samhuk/parse-json
Description: CJS fork of parse-json
Author: Sam Hughes
Latest version: 1.0.0

<h1 align="center">parse-json</h1>
<p align="center">
  <em>Fork of parse-json</em>
</p>

<p align="center">
  <a href="https://img.shields.io/badge/License-MIT-green.svg" target="_blank">
    <img src="https://img.shields.io/badge/License-MIT-green.svg" alt="license" />
  </a>
  <a href="https://badge.fury.io/js/@samhuk/parse-json.svg" target="_blank">
    <img src="https://badge.fury.io/js/@samhuk/parse-json.svg" alt="npm version" />
  </a>
</p>

## Overview

This is a fork of [parse-json](https://github.com/sindresorhus/parse-json) that integrates Typescript and is bundled to CJS format for distribution.
npm package: @samhuk/select
Description: A vanilla JS select UI Component
Latest version: 1.0.5

# select

A vanilla JS select UI component.

![sc1](img/sc1.png)

## Usage

`npm i @samhuk/select`

```typescript
import { createSelect } from '@samhuk/select'

const element = document.createElement('div')

const select = createSelect({
  initialValue: 'America',
  initialOptionDataList: [
    { uuid: '1', value: 'america', displayName: 'America' },
    { uuid: '2', value: 'united-kingdom', displayName: 'UK' },
    { uuid: '3', value: 'france', displayName: 'France' },
    { uuid: '4', value: 'spain', displayName: 'Spain' },
    { uuid: '5', value: 'germany', displayName: 'Germany' }
  ],
  unavailableValueHandling: UnavailableValueHandling.ALLOW,
  label: 'Country of Origin',
})

element.appendChild(select.rendered.element)
```

### Importing Styles

There are two main ways the styles of the component can be imported into another project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
  ```typescript
  // Import the scss entrypoint file from the src
  import 'node_modules/@samhuk/select/src/component/styles/index.scss'
  // Import the css bundle file
  import 'node_modules/@samhuk/select/dist/styles.css'
  ```
2. `@import` the scss entrypoint file into your scss file.
  ```scss
  @import '~@samhuk/select/src/component/styles/index.scss';
  ```
npm package: @samhuk/table
Description: A vanilla JS data table UI component
Author: samhuk
Latest version: 1.0.14

# table

A vanilla JS data table component.

![sc1](./img/sc1.png)

## Usage

`npm i @samhuk/table`

Basic usage (default column options, no custom configuration, etc.):

```typescript
import { createTable } from '@samhuk/table'

const element = document.createElement('div')

// Create table with 3 column and 3 rows of data
const table = createTable({
  columnOrdering: ['A', 'B', 'C'],
  initialData: [
    { a: 1, b: 2, c: 3 },
    { a: 4, b: 5, c: 6 }
    { a: 7, b: 8, c: 9 }
  ]
})

element.appendChild(table.rendered.element)
```

### Importing Styles

There are two main ways of importing the styles for the component into your project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
    ```typescript
    // Import the scss entrypoint file from the src
    import 'node_modules/@samhuk/table/src/component/styles/index.scss'
    // Import the css bundle file
    import 'node_modules/@samhuk/table/dist/styles.css'
    ```
2. `@import` the scss entrypoint file into your scss file.
    ```scss
    @import '~@samhuk/table/src/component/styles/index.scss';
    ```

## Features

* Column sorting
* Column filter button
* Column resizing
* Footer row
* Row grouping (with group header row)
* Customizable row and cell rendering
* More

## Development Deployment

One must have node and npm installed. Get node from [nodejs.org](https://nodejs.org/en/download/).

Run `npm i`

Run `npm start`

Try navigating to localhost:4001.
npm package: @samhuk/text-input
Description: A vanilla JS text input UI component
Latest version: 1.0.4

# text-input

A vanilla JS text input UI component.

![sc1](img/sc1.png)

## Usage

`npm i @samhuk/text-input`

```typescript
import { createTextInput } from '@samhuk/text-input'

const element = document.createElement('div')

const textInput = createTextInput({
  label: 'User Name',
  initialValue: '',
})

element.appendChild(textInput.rendered.element)
```

### Importing Styles

There are two main ways the styles of the component can be imported into another project. One can either:

1. `import` the scss entrypoint or css bundle file into your .ts or .js file. This is supported by all the main bundlers out there like webpack and esbuild as long as you have the required loader/plugin for scss or css files configured.
  ```typescript
  // Import the scss entrypoint file from the src
  import 'node_modules/@samhuk/text-input/src/component/styles/index.scss'
  // Import the css bundle file
  import 'node_modules/@samhuk/text-input/dist/styles.css'
  ```
2. `@import` the scss entrypoint file into your scss file.
  ```scss
  @import '~@samhuk/text-input/src/component/styles/index.scss';
  ```
npm package: @samhuk/type-helpers
Description: Useful Common Typescript Types
Latest version: 1.0.3

<h1 align="center">type-helpers</h1>
<p align="center">
  <em>Useful Common Typescript Types</em>
</p>

<p align="center">
  <a href="https://img.shields.io/badge/License-MIT-green.svg" target="_blank">
    <img src="https://img.shields.io/badge/License-MIT-green.svg" alt="license" />
  </a>
  <a href="https://badge.fury.io/js/@samhuk/type-helpers.svg" target="_blank">
    <img src="https://badge.fury.io/js/{{npm-package-name}}.svg" alt="npm version" />
  </a>
</p>

## Overview

This package provides some useful common Typescript types.

## Usage Overview

This section shows simple usage examples for some of the types.

`OmitTyped` - type-enforced version of Typescript's built-in `Omit`.

```typescript
import { OmitTyped } from '@samhuk/type-helpers'

type A = { foo: string, bar: string, fizz: string, buzz: string }
type B = OmitTyped<A, 'fizz'> // OK
type C = OmitTyped<A, 'notAProp'> // tsc error
```

`IsAny` - determines if a type is explicitly `any` or not.

```typescript
import { IsAny } from '@samhuk/type-helpers'

type A = IsAny<any> // true
type B = IsAny<1> // false
```

`DictValues` - converts a dictionary type to a union of it's values.

```typescript
import { DictValues } from '@samhuk/type-helpers'

type A = { a: 1, b: 2, c: 3, d: 4 }
type B = DictValues<A> // 1 | 2 | 3 | 4
```

`StringKeysOf` - converts a dictionary type to a union of it's keys, ensuring that they are all strings. This is useful because `keyof` will tell typescript that your union will be values of `string`, `number`, or `symbol`, which is quite often not what you want.

```typescript
import { StringKeysOf } from '@samhuk/type-helpers'

type A = { a: 1, b: 2, c: 3, d: 4 }
type B = StringKeysOf<A> // 'a' | 'b' | 'c' | 'd'
```

## Development

Contributions are welcome! See [./contributing/development.md](./contributing/development.md).

---

*Package generated from [ts-npm-package-template](https://github.com/samhuk/ts-npm-package-template)*
npm package: @sami616/components
Description: A component library
Latest version: 0.0.16
Deprecated: this package has been deprecated

# Component library

## Scripts

### Storybook specific

`start-sb`: Starts storybook in dev mode on `localhost:9001`

`build-sb`: Builds storybook into an out dir of `storybook-static`

### Library specific

`watch-lib`: Rebuilds the component library in watch mode into an our dir of `lib` (helpful for when using npm link)

`build-lib`: Builds the component library once into an our dir of `lib`

`publish-lib`: Build the component library once and publishes to npm
npm package: @sami7786/opencode-image-proxy
Description: OpenCode plugin that proxies images through a vision-capable model, enabling image-incapable models to "see"
Latest version: 1.0.6

# opencode-image-proxy

OpenCode plugin that proxies images through a vision-capable model, enabling image-incapable models to "see" pasted images.

## Installation

### From npm
Add this to opencode config (typically in: `~/.config/opencode/opencode.json`)
```json
{
  "$schema": "https://opencode.ai/config.json",
    "plugin": [
      "@sami7786/opencode-image-proxy@latest"
    ]
}
```

## How It Works

1. Checks if the current model is in the "imageIncapableModels" list as configured
2. **If image-incapable**: Automatically sends images to a vision-capable model for analysis, then replaces the image with a text description
3. **If image-capable**: Images pass through natively with no transformation

All model calls use OpenCode's existing authentication - no separate API keys needed.

## Configuration

Create `~/.config/opencode/opencode-image-proxy.json` (or `$XDG_CONFIG_HOME/opencode/opencode-image-proxy.json`)

<i> To see available models, run: ```opencode models``` </i>

default config:
```json
{
  "imageIncapableModels": [
    "zai-coding-plan/glm-4.5",
    "zai-coding-plan/glm-4.5-air",
    "zai-coding-plan/glm-4.5-flash",
    "zai-coding-plan/glm-4.6",
    "zai-coding-plan/glm-4.7",
    "zai-coding-plan/glm-4.7-flash",
    "zai-coding-plan/glm-5"
  ],
  "imageReaderModel": {
    "providerID": "opencode",
    "modelID": "kimi-k2.5-free"
  },
  "analysisPrompt": "The user has pasted an image into their chat. Describe what you see as if you are directly observing the image. Be thorough but concise. Include:\n- All visible elements (objects, text, UI elements, people, etc.)\n- Exact transcription of any text\n- The context and purpose of the image\n- Any relevant technical details\n\nDescribe it naturally, as if explaining to someone what you're looking at right now."
}
```

- `imageIncapableModels` — Models that you want to enable the proxy for.
- `imageReaderModel` — Any vision-capable model in your OpenCode setup.
- `analysisPrompt` — System prompt for image analysis.

### Behavior

| Model | Result |
|-------|--------|
| In image-incapable list | Images proxied through vision model, replaced with descriptions |
| NOT in list | Images pass through natively |

## Example Output

```
[User pasted image: screenshot.png]
This is a terminal window showing a Node.js error. The error message reads:
"TypeError: Cannot read property 'map' of undefined" at line 42 in app.js.
The stack trace below shows the error originated in the UserList component...
```

## Requirements

- The configured `imageReaderModel` must be available and authenticated in OpenCode
- The vision model must support image input

## Building

```bash
npm install
npm run build
```

## License

MIT
npm package: @samialdury/config
Description: Common configuration for often used tools
Author: Sami Al-Dury
Latest version: 6.6.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# `@samialdury/config`

> [!WARNING]
> This package and repository are deprecated and no longer maintained.

[![CI status](https://github.com/samialdury/config/actions/workflows/ci.yml/badge.svg)](https://github.com/samialdury/config/actions/workflows/ci.yml)
[![license](https://img.shields.io/github/license/samialdury/config)](LICENSE)
[![npm version](https://img.shields.io/npm/v/%40samialdury/config)](https://www.npmjs.com/package/@samialdury/config)

Common configuration for often used tools.

- [Prettier](src/prettier/config.ts)
- [ESLint](src/eslint/config.ts)
- [commitlint](src/commitlint/config.ts)
- [lint-staged](src/lint-staged/config.ts)
- [semantic-release](src/semantic-release/config.ts)

## Installation

```sh
pnpm i -D -E @samialdury/config prettier eslint husky @commitlint/cli lint-staged semantic-release
```

## Usage

```js
// prettier.config.cjs

const { prettier } = require('@samialdury/config')

module.exports = prettier.config(options)
```

```js
// eslint.config.js

import { eslint } from '@samialdury/config'

export default [...eslint.config(options)]
```

```js
// commitlint.config.cjs

const { commitlint } = require('@samialdury/config')

module.exports = commitlint.config(options)
```

```js
// lint-staged.config.cjs

const { lintStaged } = require('@samialdury/config')

module.exports = lintStaged.config(options)
```

```js
// release.config.cjs

const { semanticRelease } = require('@samialdury/config')

module.exports = semanticRelease.config(options)
```

## License

[MIT](LICENSE)