open-index/open-npm huggingface dataset:
npm package: @herb-tools/browser
Description: WebAssembly-based HTML-aware ERB parser for browsers.
Latest version: 0.9.5

# Herb for Browser Usage

**Package**: [`@herb-tools/browser`](https://www.npmjs.com/package/@herb-tools/browser)

---

WebAssembly-based HTML-aware ERB parser for browsers.

## Building

Run `nx build browser` to build the library.

## Running unit tests

Run `nx test browser` to execute the unit tests via [Vitest](https://vitest.dev/).
npm package: @herb-tools/config
Description: Shared configuration utilities for Herb tools
Latest version: 0.9.5

# Herb Configuration

**Package**: [`@herb-tools/config`](https://www.npmjs.com/package/@herb-tools/config)

---

Shared configuration utilities for Herb. Provides a unified way to load, validate, and manage configuration across the Herb ecosystem including the linter, formatter, and language server.

## Installation

:::code-group
```shell [npm]
npm add @herb-tools/config
```

```shell [pnpm]
pnpm add @herb-tools/config
```

```shell [yarn]
yarn add @herb-tools/config
```

```shell [bun]
bun add @herb-tools/config
```
:::

## Usage

### `.herb.yml`

The configuration is stored in a `.herb.yml` file in the project root:

```yaml [.herb.yml]
version: 0.9.5

linter:
  enabled: true
  rules:
    erb-no-extra-newline:
      enabled: false

formatter:
  enabled: true
  indentWidth: 2
  maxLineLength: 120
```

## Configuration Hierarchy

The Herb tools follow this configuration priority:

1. **Project configuration** (`.herb.yml` file) - Highest priority
2. **Editor settings** (VS Code workspace/user settings)
3. **Default settings** - Fallback when no other configuration exists

This allows teams to share consistent settings via `.herb.yml` while still allowing individual developer preferences when no project configuration exists.
npm package: @herb-tools/core
Description: Core module exporting shared interfaces, AST node definitions, and common utilities for Herb
Latest version: 0.9.5

# Herb Core

**Package**: [`@herb-tools/core`](https://www.npmjs.com/package/@herb-tools/core)

---

Core module exporting shared interfaces, AST node definitions, and common utilities for Herb (no direct parsing functionality).

## Installation

:::code-group
```shell [npm]
npm add @herb-tools/core
```

```shell [pnpm]
pnpm add @herb-tools/core
```

```shell [yarn]
yarn add @herb-tools/core
```

```shell [bun]
bun add @herb-tools/core
```
:::
npm package: @herb-tools/dev-tools
Description: Development tools for visual debugging in HTML+ERB templates
Latest version: 0.9.5

# Herb Dev Tools

**Package**: [`@herb-tools/dev-tools`](https://www.npmjs.com/package/@herb-tools/dev-tools)

---

Development tools for visual debugging in HTML+ERB templates. Provides a browser-based interface for inspecting ERB expressions, template boundaries, and more debugging information.

## Installation

```bash
npm install @herb-tools/dev-tools

# or

yarn add @herb-tools/dev-tools
```
npm package: @herb-tools/highlighter
Description: Syntax highlighter and diagnostic renderer for HTML+ERB templates.
Latest version: 0.9.5

# Herb Highlighter

**Package:** [`@herb-tools/highlighter`](https://www.npmjs.com/package/@herb-tools/highlighter)

---

Syntax highlighter, code snippet renderer, and diagnostic renderer for HTML+ERB templates with terminal color support.

## Installation

:::code-group

```shell [npm]
npm add @herb-tools/highlighter
```

```shell [pnpm]
pnpm add @herb-tools/highlighter
```

```shell [yarn]
yarn add @herb-tools/highlighter
```

```shell [bun]
bun add @herb-tools/highlighter
```

:::

#### CLI Usage

```bash
# Highlight a file
herb-highlight app/views/users/show.html.erb

# Highlight a file with a theme
herb-highlight app/views/users/show.html.erb --theme=tokyo-night

# Highlight a file with a custom theme
herb-highlight app/views/users/show.html.erb --theme=path/to/theme.json

# Focus on line 10
herb-highlight app/views/users/show.html.erb --focus=10

# Focus on line 10 and show 3 lines before/after
herb-highlight app/views/users/show.html.erb --focus=10 --context-lines=3
```

## Usage

```typescript
import { Herb } from "@herb-tools/node-wasm"
import { Highlighter } from "@herb-tools/highlighter"

const highlighter = new Highlighter("default", Herb)

await highlighter.initialize()

highlighter.highlight(
  "filename.html.erb",
  "<% if true %><span>true</span><% end %>",
)
```

## Configuration Options

```typescript
interface HighlightOptions {
  diagnostics?: Diagnostic[]
  splitDiagnostics?: boolean
  contextLines?: number
  focusLine?: number
  showLineNumbers?: boolean
}
```
npm package: @herb-tools/node
Description: Native Node.js addon for HTML-aware ERB parsing using Herb.
Latest version: 0.9.5

# Herb for Node.js

**Package**: [`@herb-tools/node`](https://www.npmjs.com/package/@herb-tools/node)

---

Native Node.js addon for HTML-aware ERB parsing using Herb.

## Building

Run `nx build node` to build the library.

## Running unit tests

Run `nx test node` to execute the unit tests via [Vitest](https://vitest.dev/).
npm package: @herb-tools/node-wasm
Description: WebAssembly-based HTML-aware ERB parser for Node.js.
Latest version: 0.9.5

# Herb for Node.js (via WebAssembly)

**Package**: [`@herb-tools/node-wasm`](https://www.npmjs.com/package/@herb-tools/node-wasm)

---

WebAssembly-based HTML-aware ERB parser for Node.js.

## Building

Run `nx build node-wasm` to build the library.

## Running unit tests

Run `nx test node-wasm` to execute the unit tests via [Vitest](https://vitest.dev/).
npm package: @herb-tools/printer
Description: AST printer infrastructure and lossless reconstruction tool for HTML+ERB templates
Latest version: 0.9.5

# Herb Syntax Tree Printer

**Package:** [`@herb-tools/printer`](https://www.npmjs.com/package/@herb-tools/printer)

---

AST printer infrastructure for lossless HTML+ERB reconstruction and AST-to-source code conversion for the Herb Parser Syntax Tree.

## Installation

:::code-group
```shell [npm]
npm add @herb-tools/printer
```

```shell [pnpm]
pnpm add @herb-tools/printer
```

```shell [yarn]
yarn add @herb-tools/printer
```

```shell [bun]
bun add @herb-tools/printer
```
:::

### Usage

#### IdentityPrinter (Provides lossless reconstruction of the original source)

For lossless reconstruction of the original source:

```javascript
import { IdentityPrinter } from '@herb-tools/printer'
import { Herb } from '@herb-tools/node-wasm'

await Herb.load()

const parseResult = Herb.parse(
  '<div class="hello" >  Hello  </div>',
  { track_whitespace: true }
)

const printer = new IdentityPrinter()
const output = printer.print(parseResult.value)

// output === '<div class="hello" >  Hello  </div>' (exact preservation)
```

#### Custom Printers

Create custom printers by extending the base `Printer` class and override specific visitors for custom behavior:

```typescript
import { Printer } from "@herb-tools/printer"
import { HTMLAttributeNode } from "@herb-tools/core"

class CustomPrinter extends Printer {
  protected write(content: string) {
    super.write(content.toUpperCase())
  }

  protected visitHTMLAttributeNode(node: HTMLAttributeNode) {
    // do nothing to strip attributes
  }
}
```

and then printing the result using `print`

```js
import { Herb } from "@herb-tools/node-wasm"

await Herb.load()

const parseResult = Herb.parse(
  '<div class="hello">  Hello  </div>',
  { track_whitespace: true }
)

const printer = new CustomPrinter()
const output = printer.print(parseResult.value)

// output === '<div >  HELLO  </div>'
```

#### Print Options

The printer supports options to control how nodes are printed:

```typescript
import { IdentityPrinter, DEFAULT_PRINT_OPTIONS } from "@herb-tools/printer"
import type { PrintOptions } from "@herb-tools/printer"

const printer = new IdentityPrinter()

// Will throw error if node has parse errors (default behavior)
const output1 = printer.print(nodeWithErrors)

// Will print the node despite parse errors
const output2 = printer.print(nodeWithErrors, { ignoreErrors: true })
```

When `ignoreErrors` is `false` (default), the printer will throw an error if you attempt to print a node that contains parse errors. Set `ignoreErrors` to `true` to print nodes with errors, which can be useful for debugging or partial AST reconstruction.

:::warning Important
The Printer expects the source to be parsed using the `track_whitespace: true` parser option for accurate source reconstruction.
:::

#### CLI Usage

```bash
# Basic round-trip printing
herb-print input.html.erb > output.html.erb

# Verify parser accuracy
herb-print input.html.erb --verify

# Show parsing statistics
herb-print input.html.erb --stats
```
npm package: @herbart-editor/code
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart/code`

> TODO: description

## Usage

```
import code from '@herbart-editor/code';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/core
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/core`

> 为 herbart 项目使用的编辑器提供核心

支持的功能有：

- 自定义样式
- 提供序列化和反序列化的的功能
- 基于整个编辑功能提供不同体系下的插件拓展

网页编辑器按照功能分布为：

- 编辑主体
- 支持编辑的工具

其中编辑主体按照实际的主体又可以分为：

## Usage

```
import core from '@herbart-editor/core';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/formula
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/formula`

> TODO: description

## Usage

```
import formula from '@herbart-editor/formula';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/heading
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/heading`

> TODO: description

## Usage

```
import heading from '@herbart-editor/heading';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/image
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/image`

> TODO: description

## Usage

```
import image from '@herbart-editor/image';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/insertpannel
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/insertPannel`

> TODO: description

## Usage

```
import insertPannel from '@herbart-editor/insertPannel';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/list
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/list`

> TODO: description

## Usage

```
import list from '@herbart-editor/list';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/paragraph
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/paragraph`

> TODO: description

## Usage

```
import paragraph from '@herbart-editor/paragraph';

// TODO: DEMONSTRATE API
```
npm package: @herbart-editor/quote
Description: Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth i
Author: “ncqwer”
Latest version: 0.0.4

# `@herbart-editor/quote`

> TODO: description

## Usage

```
import quote from '@herbart-editor/quote';

// TODO: DEMONSTRATE API
```
npm package: @herbcaudill/base-x
Description: Fast base encoding/decoding of any given alphabet
Author: Daniel Cousens
Latest version: 4.0.6

# base-x

Fast base encoding / decoding of any given alphabet using bitcoin style leading zero compression.

**WARNING:** This module is **NOT RFC3548** compliant, it cannot be used for base16 (hex), base32, or base64 encoding in a standards compliant manner.

## Example

Base58

```javascript
import { basex } from 'base-x'
var BASE58 = '123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz'
var bs58 = basex(BASE58)

var decoded = bs58.decode('5Kd3NBUAdUnhyzenEwVLy9pBKxSwXvE9FMPyR4UKZvpe6E3AgLr')

console.log(decoded)
// => <Buffer 80 ed db dc 11 68 f1 da ea db d3 e4 4c 1e 3f 8f 5a 28 4c 20 29 f7 8a d2 6a f9 85 83 a4 99 de 5b 19>

console.log(bs58.encode(decoded))
// => 5Kd3NBUAdUnhyzenEwVLy9pBKxSwXvE9FMPyR4UKZvpe6E3AgLr
```

### Alphabets

See below for a list of commonly recognized alphabets, and their respective base.

| base | alphabet                                                              | export    |
| ---- | --------------------------------------------------------------------- | --------- |
| 2    | `01`                                                                  | `base2`   |
| 8    | `01234567`                                                            | `base8`   |
| 11   | `0123456789a`                                                         | `base11`  |
| 16   | `0123456789abcdef`                                                    | `base16`  |
| 32   | `0123456789ABCDEFGHJKMNPQRSTVWXYZ`                                    | `base32`  |
| 32   | `ybndrfg8ejkmcpqxot1uwisza345h769` (z-base-32)                        | `basez32` |
| 36   | `0123456789abcdefghijklmnopqrstuvwxyz`                                | `base36`  |
| 58   | `123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz`          | `base58`  |
| 62   | `0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ`      | `base62`  |
| 64   | `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/`    | `base64`  |
| 67   | `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_.!~` | `base67`  |

For convenience, these are exported with the names shown above. For example, the above code could be written as follows:

```javascript
import { bs58 } from 'base-x'

var decoded = bs58.decode('5Kd3NBUAdUnhyzenEwVLy9pBKxSwXvE9FMPyR4UKZvpe6E3AgLr')

console.log(decoded)
// => <Buffer 80 ed db dc 11 68 f1 da ea db d3 e4 4c 1e 3f 8f 5a 28 4c 20 29 f7 8a d2 6a f9 85 83 a4 99 de 5b 19>

console.log(bs58.encode(decoded))
// => 5Kd3NBUAdUnhyzenEwVLy9pBKxSwXvE9FMPyR4UKZvpe6E3AgLr
```

## LICENSE [MIT](LICENSE)

Adapted from https://github.com/cryptocoinjs/base-x
npm package: @herbcaudill/easy-api-key
Description: Password-encrypt API keys and secrets for bundling with your app
Author: Herb Caudill
Latest version: 0.2.0

# @herbcaudill/easy-api-key

Password-encrypt API keys and secrets for bundling with your app. Decryption happens entirely in the browser using the Web Crypto API.

## Use case

You want to ship an app that needs an API key, but you don't want to:

- Expose the raw API key in your source code
- Set up a backend proxy just to hide the key
- Require users to obtain their own API key

With this package, you encrypt your API key with a password, bundle the encrypted data with your app, and users enter the password to decrypt it at runtime.

## Installation

```bash
pnpm add @herbcaudill/easy-api-key
```

## Usage

### 1. Encrypt your secret

Use the CLI to encrypt your API key:

```bash
# Interactive mode
npx easy-api-key -o src/encrypted-key.json

# Or pipe the secret
echo "sk-ant-api03-xxx" | npx easy-api-key -p mypassword -o src/encrypted-key.json
```

This creates a JSON file like:

```json
{
  "salt": "base64...",
  "iv": "base64...",
  "ciphertext": "base64..."
}
```

### 2. Decrypt in your app

```typescript
import { decryptSecret, type EncryptedData } from "@herbcaudill/easy-api-key"
import encryptedKey from "./encrypted-key.json"

const apiKey = await decryptSecret(password, encryptedKey as EncryptedData)
```

### Programmatic encryption (Node.js)

```typescript
import { encryptSecret } from "@herbcaudill/easy-api-key/node"
import fs from "fs"

const encrypted = encryptSecret("my-api-key", "password123")
fs.writeFileSync("encrypted.json", JSON.stringify(encrypted, null, 2))
```

## CLI options

```
Usage: easy-api-key [options]

Options:
  -o, --output <file>    Write encrypted data to file (default: stdout)
  -p, --password <pass>  Use this password (otherwise prompts)
  -h, --help             Show this help message
```

## Security

- **Encryption**: AES-256-GCM (authenticated encryption)
- **Key derivation**: PBKDF2 with SHA-256, 100,000 iterations
- **No server required**: Decryption happens entirely in the browser using the Web Crypto API

The encrypted data is safe to commit to your repo. Without the password, the secret cannot be recovered.

**Note**: Once decrypted, your app will typically store the API key in memory or localStorage for the session. Consider the security implications for your specific use case.

## Bundler configuration

The encrypted JSON file needs to be importable. Most bundlers (Vite, webpack, etc.) support JSON imports out of the box.

For TypeScript, you may need to add to your `tsconfig.json`:

```json
{
  "compilerOptions": {
    "resolveJsonModule": true
  }
}
```

## License

MIT
npm package: @herbcaudill/eventemitter42
Description: Stripped-down TypeScript/ESM eventemitter with strong typing.
Author: herb@devresults.com
Latest version: 0.3.3

# EventEmitter42

This is a Typescript/ESM adaptation of [eventemitter3](https://github.com/primus/eventemitter3).

The motivation behind this is that I often use a pattern of awaiting for a promisified event, and
[neither me nor the internet](https://stackoverflow.com/questions/77814862/is-it-possible-to-strongly-type-the-return-value-of-this-function) could get strong typing on the result of that promise.

```ts
type TestEvents = {
  foo: (payload: { bar: string }) => void
}

const testEmitter = new EventEmitter<TestEvents>()

const { bar } = await eventPromise(testEmitter, 'foo')
// error: Property 'bar' does not exist on type 'unknown'.
```

As a bonus this library includes that `eventPromise` function.

```ts
const { bar } = await eventPromise(testEmitter, 'foo')
// ✅ bar is `string`
```

## Differences

I left out some eventemitter3 features that I've never used:

- Prefixed event names
- Passing context to a listener
- `eventNames`, `listeners` and `listenerCount` methods

With eventemitter3, you have various options for defining event listener signatures. In this
library, event types can only be expressed as a map of function signatures:

```ts
const testEmitter = new EventEmitter<{
  foo: (p: string) => void
  bar: (p: number) => void
}>()

// won't work:

const no = new EventEmitter<'data'>() ❌
const nope = new EventEmitter<{foo: string; bar: number}>() ❌


```

## Installation

```bash
$ pnpm add @herbcaudill/eventemitter42
```

## Usage

```js
import { EventEmitter, eventPromise } from '@herbcaudill/eventemitter42'

class MyEmitter extends EventEmitter<TestEvents> {
  doSomething() {
    this.emit('foo', 'here is a payload')
  }

  doSomethingElse() {
    this.emit('bar', 42)
  }
}

const emitter = new MyEmitter()

emitter.on('foo', p => {
  console.log(p) // 'here is a payload'
})

emitter.doSomething()

setTimeout(() => emitter.doSomethingElse(), 1000)

const result = await eventPromise(emitter, 'bar')
console.log(result) // '42' (after a second)
```
npm package: @herbcaudill/scrabble-words
Description: Parsed Scrabble word lists (CSW21 and NWL2018) with definitions
Author: Herb Caudill
Latest version: 1.0.2

# @herbcaudill/scrabble-words

Parsed Scrabble word lists with definitions and metadata.

## Dictionaries

- **CSW21** - Collins Scrabble Words (279,077 words, ~30MB)
- **NWL2018** - North American Word List (192,111 words, ~16MB)

## Installation

```bash
npm install @herbcaudill/scrabble-words
```

## Usage

```typescript
import csw from "@herbcaudill/scrabble-words/csw21"
import nwl from "@herbcaudill/scrabble-words/nwl2018"

// Find a word
const word = csw.find(w => w.word === "QUIXOTIC")

console.log(word)
// {
//   word: "QUIXOTIC",
//   definitions: [{
//     text: "extravagantly chivalrous",
//     partOfSpeech: "adj"
//   }]
// }
```

## Types

```typescript
type Word = {
  word: string
  definitions: Definition[]
  crossRef?: CrossRef
}

type Definition = {
  text: string
  partOfSpeech: string
  forms?: string[]        // e.g. ["CATS"] or ["JUMPED", "JUMPING", "JUMPS"]
  alsoSpelled?: string[]  // alternative spellings
  note?: string           // e.g. "Hawaiian", "obsolete"
}

type CrossRef = {
  word: string           // base word this is a form of
  partOfSpeech: string
}
```

## Data source

Word lists are parsed from the [scrabblewords](https://github.com/scrabblewords/scrabblewords) repository.

## License

MIT
npm package: @herbcaudill/tscpaths
Description: Replace absolute paths to relative paths after typescript compilation
Author: Joon Ho Cho
Latest version: 0.0.17

> This is a fork of [joonhocho/tscpaths](https://github.com/joonhocho/tscpaths) that adds the --silent option.

# tscpaths

Replace absolute paths to relative paths after typescript compilation (tsc) during compile-time.

[![npm version](https://badge.fury.io/js/%40herbcaudill%2Ftscpaths.svg)](https://badge.fury.io/js/@herbcaudill/tscpaths)
[![Dependency Status](https://david-dm.org/herbcaudill/tscpaths.svg)](https://david-dm.org/herbcaudill/tscpaths)
[![License](http://img.shields.io/:license-mit-blue.svg)](http://doge.mit-license.org)

## Comparison to [tsconfig-paths](https://github.com/dividab/tsconfig-paths)

\+ Compile time (no runtime dependencies)

## Getting Started

First, install tscpaths as devDependency using npm or yarn.

```sh
npm install --save-dev @herbcaudill/tscpaths
# or
yarn add -D @herbcaudill/tscpaths
```

## Add it to your postbuild script in package.json

```json
"scripts": {
  "build": "tsc --project tsconfig.json",
  "postbuild": "tscpaths -p tsconfig.json -s ./src -o ./out --silent",
}
```

### Options

| flag         | description                                        |
| ------------ | -------------------------------------------------- |
| -p --project | project configuration file (tsconfig.json)         |
| -s --src     | source code root directory                         |
| -o --out     | output directory of transpiled code (tsc --outDir) |
| --silent     | silence the console output                         |

You need to provide -s (--src) and -o (--out), because it's hard to predict source and output paths based on tsconfig.json.
npm package: @herberthe/button-card-devkit
Description: Devkit for Home Assistant Custom button card development
Author: HerbertHe
Latest version: 0.0.2

# @herberthe/button-card-devkit

Devkit for Home Assistant Custom button card development

The package is forked from [custom-cards/button-card](https://github.com/custom-cards/button-card) and exports the functions & type definations.

## Get Started

```shell
npm install @herberthe/button-card-devkit
```

## LICENSE

MIT &copy; Herbert He 2023
MIT &copy; Alexandre Garcia 2018
npm package: @herberthe/fetch-stream
Description: A JavaScript library for fetching stream data.
Author: Herbert He
Latest version: 1.0.1

# fetch-stream

[![version](https://img.shields.io/npm/v/@herberthe/fetch-stream.svg)](https://www.npmjs.com/package/@herberthe/fetch-stream)
[![download](https://img.shields.io/npm/dm/@herberthe/fetch-stream.svg)](https://www.npmjs.com/package/@herberthe/fetch-stream)

A JavaScript library for fetching stream data.

## Install

```bash
npm install @herberthe/fetch-stream
```

## Usage

```javascript
import { FetchStream } from "@herberthe/fetch-stream"
const fetchStream = new FetchStream({
    preset: "text",
    timeout: 5000,
    onProcess: (val) => {
        document.getElementById(
            "content"
        ).innerHTML += `<div>${val}<div>`
    },
    onDone: () => {
        console.log("Done!")
    },
    onError: (err) => {
        alert(err)
    },
})

fetchStream.createFetchRequest("/mock")
```

## Options

| Option    | Required | Type                           | Default     | Description                                                        |
| --------- | -------- | ------------------------------ | ----------- | ------------------------------------------------------------------ |
| preset    | No       | `"text"`                       | `undefined` | preset decoder                                                     |
| timeout   | No       | `number` or `-1`               | `undefined` | timeout in milliseconds(if the value is `-1`, it means no timeout) |
| decoder   | No       | `<T>(value?: Uint8Array) => T` | `undefined` | custom decoder                                                     |
| onProcess | No       | `(value: T) => void`           | `undefined` | callback function for processing each chunk of data                |
| onDone    | No       | `() => void`                   | `undefined` | callback function when all data is processed                       |
| onError   | No       | `(error: Error) => void`       | `undefined` | callback function when an error occurs                             |
| onAbort   | No       | `() => void`                   | `undefined` | callback function when the request is aborted                      |
| onTimeout | No       | `() => void`                   | `undefined` | callback function when the request times out                       |

## Methods

| Method                                                   | Description             |
| -------------------------------------------------------- | ----------------------- |
| `createFetchRequest(url: string, options?: RequestInit)` | create a fetch request  |
| `abort()`                                                | abort the fetch request |

## License

MIT &copy; Herbert He
npm package: @herberthe/log-monitor
Description: > 日志监控库
Latest version: 0.0.9

# log-monitor

> 日志监控库

[简体中文](./README.CN.md) | [English](./README.md)

## 安装

```bash
npm i @herberthe/log-monitor
# or yarn
yarn add @herberthe/log-monitor
```

## 使用方法

```ts
const { LogMonitor } = require("@herberthe/log-monitor")
const monitor = new LogMonitor(options)
console.log(monitor.export())
```
npm package: @herberthe/log-monitor-server
Description: 日志监控服务端
Author: HerbertHe
Latest version: 0.0.1

# log-monitor-server

日志监控服务端

## Thanks

|                      Vite                       |                     React                      |                      Rollup                       |                      Tailwindcss                       |                      Postcss                       |
| :---------------------------------------------: | :--------------------------------------------: | :-----------------------------------------------: | :----------------------------------------------------: | :------------------------------------------------: |
| <img src="./public/imgs/vite.svg" width="40" /> | <img src="./public/imgs/react.svg" width="40"> | <img src="./public/imgs/rollup.png" width="40" /> | <img src="./public/imgs/tailwindcss.png" width="40" /> | <img src="./public/imgs/postcss.png" width="40" /> |
npm package: @herberthe/react-await
Description: Await Component for handling asynchronous data renderding for React
Author: HerbertHe
Latest version: 1.0.2

# @herberthe/react-await

[![version](https://img.shields.io/npm/v/@herberthe/react-await.svg)](https://www.npmjs.com/package/@herberthe/react-await)
[![download](https://img.shields.io/npm/dm/@herberthe/react-await.svg)](https://www.npmjs.com/package/@herberthe/react-await)
[![cnpmVersion](https://cnpmjs.org/badge/v/@herberthe/react-await.svg)](https://cnpmjs.org/package/@herberthe/react-await)
[![cnpmDownload](https://cnpmjs.org/badge/d/@herberthe/react-await.svg)](https://cnpmjs.org/package/@herberthe/react-await)

一个根据Promise数据渲染的组件库, 灵感来源于[Svelte Await Blocks](https://svelte.dev/tutorial/await-blocks)

> 大多的web应用程序需要在某些点处理异步数据。Svelte使用*await*标记promises的数据, 使这个过程更加简单

[简体中文](./README.CN.md) | [English](./README.md)

## 安装依赖

```bash
npm i @herberthe/react-await
# or yarn
yarn add @herberthe/react-await
```

## 使用方法

```tsx
import { FC, useEffect, useState } from "react"
import { Await, Then, Catch } from "@herberthe/react-await"

const App: FC = () => {
    const [promise, setPromise] = useState<Promise<unknown>>()
    useEffect(() => {
        const prom = new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve("Data Here!")
            }, 2000)
        })
        setPromise(prom)
    }, [])
    return (
        <Await promise={promise}>
            {/* 在此写入pending时的代码 */}
            <Then>
                {/* 在此写入resolve时的代码 */}
            </Then>
            <Catch>
                {/* 在此写入reject时的代码 */}
            </Catch>
        </Await>
    )
}

export default App
```

> 需要注意的是, `Then`组件不可省略, 而`Catch`组件如果你知道promise不会reject的话, 可以省略。

## 获取数据和错误

本库以深度为**1**向`Then`和`Catch`的所有子组件(字符串类型除外)分别注入不同的props属性`props.awaitvalue`和`props.awaiterror`, 您可以通过自定义组件的方式拿到数据

```tsx
interface ICustomResolveProps {
    awaitvalue: any
}

const CustomResolve: FC<ICustomResolveProps> = ({ awaitvalue }) => <h1>{awaitvalue}</h1>

interface ICustomRejectProps {
    awaiterror: any
}

const CustomReject: FC<ICustomRejectProps> = ({ awaiterror }) => <h1>{awaiterror}</h1>

const App: FC = () => {
    const [promise, setPromise] = useState<Promise<unknown>>()
    useEffect(() => {
        const prom = new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve("Data Here!")
            }, 2000)
        })
        setPromise(prom)
    }, [])
    return (
        <Await promise={promise}>
            <h1>pending~</h1>
            <p>waiting for values~</p>
            <Then>
                <CustomResolve />
            </Then>
            <Catch>
                <CustomReject />
            </Catch>
        </Await>
    )
}
```
npm package: @herberthtk/react-native-animated-hearts
Description: Smooth animated heart reactions component for react-native
Author: Herbert Kavuma
Latest version: 0.1.4

# react-native-animated-hearts

Smooth animated heart reactions

## Installation

```sh
npm install react-native-animated-hearts
```

## Usage


```js
import { useRef } from 'react';
import { View, StyleSheet, Button } from 'react-native';
import HeartAnimation, {
  type HeartAnimationRef,
} from 'react-native-animated-hearts';

export default function App() {
  const heartAnimationRef = useRef<HeartAnimationRef>(null);

  // Trigger the heart animation
  const handleButtonPress = () => {
    heartAnimationRef.current?.triggerAnimation();
  };

  return (
    <View style={styles.container}>
      <HeartAnimation ref={heartAnimationRef} />
      {/* Button to trigger animation */}
      <Button title="Trigger Heart Animation" onPress={handleButtonPress} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    // justifyContent: 'center',
    // alignItems: 'center',
    backgroundColor: '#fff',
  },
});

```


## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @herbhq/object-multiplex
Description: Simple stream multiplexing for `objectMode`.
Latest version: 0.1.0

# @rabby-wallet/object-multiplex

Simple stream multiplexing for `objectMode`.

## Usage

```js
// create multiplexer
const mux = new ObjMultiplex();

// setup substreams
const streamA = mux.createStream("hello");
const streamB = mux.createStream("world");

// pipe over transport (and back)
mux.pipe(transport).pipe(mux);

// send values over the substreams
streamA.write({ thisIsAn: "object" });
streamA.write(123);

// or pipe together normally
streamB.pipe(evilAiBrain).pipe(streamB);
```

## Contributing

### Setup

- Install [Node.js](https://nodejs.org) version 18
  - If you are using [nvm](https://github.com/creationix/nvm#installation) (recommended) running `nvm use` will automatically choose the right node version for you.
- Install [Yarn v1](https://yarnpkg.com/en/docs/install)
- Run `yarn setup` to install dependencies and run any requried post-install scripts
  - **Warning:** Do not use the `yarn` / `yarn install` command directly. Use `yarn setup` instead. The normal install command will skip required post-install scripts, leaving your development environment in an invalid state.

### Testing and Linting

Run `yarn test` to run the tests once.

Run `yarn lint` to run the linter, or run `yarn lint:fix` to run the linter and fix any automatically fixable issues.
npm package: @herbowicz/react-scripts
Description: Configuration and scripts for Create React App.
Latest version: 1.1.5

# react-scripts

This package includes scripts and configuration used by [Create React App](https://github.com/facebookincubator/create-react-app).<br>
Please refer to its documentation:

* [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
* [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
npm package: @herbsjs/herbs
Description: A domain-first framework. Code your domain and your infrastructure will follow
Author: Jhonathan de Souza Soares
Latest version: 2.1.0

 <p align="center"><img src="https://raw.githubusercontent.com/herbsjs/herbs/main/docs/logo.png" height="220"></p>

# [![CI](https://github.com/herbsjs/herbs/actions/workflows/ci.yml/badge.svg)](https://github.com/herbsjs/herbs/actions/workflows/ci.yml) Herbsjs

Library that unify all core librarys from herbsjs

### Installing
```
  $ npm install @herbsjs/herbs
```

### Using


#### (ES6 module syntax)

``` javascript

import herbs from '@herbsjs/herbs'
const {usecase, step, Ok, Err, entity, field, validate, errorCodes ,checker} = herbs

```

#### (CommonJS syntax)

``` javascript

const { usecase, step, Ok, Err, entity, field, validate, errorCodes ,checker } = require('@herbsjs/herbs')

```

Please visit out website for more information: https://herbsjs.org


### Any doubts?

Please visit our [issues](https://github.com/herbsjs/herbs/issues/new/choose) or chat with us in: [Herbs discord](https://discord.gg/e3cQ66KDv5)


### Contribute

Come with us to make an awesome *herbs*.

Now, if you do not have technical knowledge and also have intend to help us, do not feel shy, [click here](https://discord.gg/e3cQ66KDv5) to chat with us and collaborate their ideas, the contribution may be a criticism or a compliment (why not?)

If you would like to help contribute to this repository, please see [CONTRIBUTING](https://github.com/herbsjs/herbs/blob/main/.github/CONTRIBUTING.md)


### License

**Herbs** is released under the
[MIT license](https://github.com/herbsjs/herbs/blob/main/LICENSE).
npm package: @herbsjs/herbs2repl
Description: Herbs REPL
Author: David Lojudice Sb
Latest version: 1.0.5

# herbs2repl
Herbs REPL

![Herbs REPL](./doc/render1607020056527.gif)

### Installing
```
    $ npm install @herbsjs/herbs2repl
```

### Using

`src/domain/usecases/_uclist.js`:
```javascript
module.exports = (injection) => {
    return [
        { usecase: require('./createItem').createItem(injection), tags: { group: 'Items' } },
        { usecase: require('./updateItem').updateItem(injection), tags: { group: 'Items' } },
        ...
     ]
}
```

`src/infra/repl/index.js`:
```javascript
const usecases = require('../../domain/usecases/_uclist')
const repl = require('@herbsjs/herbs2repl')

const main = async (injection) => {

    // list of all use cases, initialized
    const ucs = usecases(injection)

    // your user for the REPL session
    const user = {
        canAddItem: true, canCreateList: true, canDeteleList: false,
        canGetLists: true, canUpdateItem: true, canUpdateList: true
    }

    repl(ucs, user, {groupBy: "group"})
}

main().then()
```

Then run on your terminal:

     $ node ./src/infra/repl