open-index/open-npm huggingface dataset:
npm package: @slooze_package/scx-tailgate
Description: Shared NestJS utilities for Slooze apps
Author: Slooze
Latest version: 1.0.73
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# scx-tailgate

# 📦 Publishing `@slooze_package/scx-tailgate`

This guide explains how to structure, build, and publish this TypeScript-based npm package.

---

## ✅ Folder Structure

```
project-root/
├── src/                # Source TypeScript files
│   └── index.ts        # Entry point
├── dist/               # Output directory after build
├── package.json
├── tsconfig.json
```

---

## ⚙️ tsconfig.json

Ensure your TypeScript configuration compiles from `src/` and outputs to `dist/`, including type declarations:

```json
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "CommonJS",
    "declaration": true,
    "outDir": "dist",
    "rootDir": "src",
    "strict": true,
    "esModuleInterop": true,
    "moduleResolution": "node",
    "skipLibCheck": true
  },
  "include": ["src"]
}
```

---

## 📄 package.json

Configure your package metadata and specify what should be included in the published package:

```json
{
  "name": "@slooze_package/scx-tailgate",
  "version": "1.0.47",
  "description": "Shared NestJS utilities for Slooze apps",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "files": [
    "dist",
    "src/alloy/"
  ],
  "scripts": {
    "build": "tsc"
  }
}
```

> ✅ Only files/folders listed in the `files` array will be published. Including `src/alloy/` allows sharing source if needed.

---

## 🏗️ Build the Package

Before publishing, compile the TypeScript:

```bash
npm run build
```

This will generate the `dist/` folder containing compiled JavaScript and `.d.ts` files.

---

## 🚀 Publish to npm

1. **Login to npm:**

   ```bash
   npm login
   ```

2. **Publish your scoped package:**

   ```bash
   npm publish --access public
   ```

> ⚠️ Scoped packages (like `@slooze_package/...`) must be published with `--access public` unless they’re private.

---

## 💡 Best Practices

- Keep all source code in the `src/` directory.
- Don’t commit `dist/` to Git, but make sure it exists when publishing.
- Use semantic versioning (`npm version patch|minor|major`) to manage releases.
- Always run `npm run build` before publishing.
- Validate your package before publishing using `npm pack`.

---
npm package: @slop-ai/angular
Description: SLOP integration for Angular 19+ — useSlop() with signals
Latest version: 0.1.0

# `@slop-ai/angular`

Angular 19+ integration for exposing signal-based component state to SLOP.

## Install

```bash
bun add @slop-ai/client @slop-ai/angular
```

## Quick start

```ts
import { Component, signal } from "@angular/core";
import { createSlop } from "@slop-ai/client";
import { action, useSlop } from "@slop-ai/angular";

const slop = createSlop({ id: "notes-app", name: "Notes App" });

@Component({
  selector: "app-notes",
  template: "",
})
export class NotesComponent {
  readonly notes = signal([{ id: "1", title: "Ship docs", pinned: false }]);

  constructor() {
    useSlop(slop, "notes", () => ({
      type: "collection",
      props: { count: this.notes().length },
      items: this.notes().map((note) => ({
        id: note.id,
        props: { title: note.title, pinned: note.pinned },
        actions: {
          toggle_pin: action(() => {
            this.notes.update((current) =>
              current.map((item) =>
                item.id === note.id ? { ...item, pinned: !item.pinned } : item,
              ),
            );
          }),
        },
      })),
    }));
  }
}
```

Call `useSlop()` inside an Angular 19+ injection context such as a constructor or field initializer.

## Documentation

- API reference: https://docs.slopai.dev/api/angular
- Angular guide: https://docs.slopai.dev/guides/angular
- Browser provider: https://docs.slopai.dev/api/client
npm package: @slop-ai/client
Description: SLOP browser provider — createSlop() + postMessage transport
Latest version: 0.1.0

# `@slop-ai/client`

Browser-side SLOP provider for SPAs and in-page integrations.

`@slop-ai/client` creates a provider that publishes state from a browser app. It uses `postMessage` discovery by default and can optionally open a WebSocket transport for desktop bridging or custom setups.

## Install

```bash
bun add @slop-ai/client
```

## Quick start

```ts
import { createSlop } from "@slop-ai/client";

export const slop = createSlop({
  id: "notes-app",
  name: "Notes App",
});

slop.register("notes", {
  type: "collection",
  props: { count: notes.length },
  items: notes.map((note) => ({
    id: note.id,
    props: { title: note.title, pinned: note.pinned },
  })),
});
```

## Optional transports

```ts
const slop = createSlop({
  id: "notes-app",
  name: "Notes App",
  transports: ["postmessage", "websocket"],
  websocketUrl: true,
});
```

`websocketUrl: true` uses the default desktop bridge URL, and `websocketUrl: "ws://..."` lets you point at a custom endpoint.

## Works with framework adapters

- React: `@slop-ai/react`
- Vue: `@slop-ai/vue`
- Solid: `@slop-ai/solid`
- Angular: `@slop-ai/angular`
- Svelte: `@slop-ai/svelte`

## Documentation

- API reference: https://docs.slopai.dev/api/client
- Vanilla guide: https://docs.slopai.dev/guides/vanilla
- React guide: https://docs.slopai.dev/guides/react
- Consumer SDK: https://docs.slopai.dev/api/consumer
npm package: @slop-ai/consumer
Description: SLOP consumer — connect to SLOP providers, subscribe to state, invoke actions
Latest version: 0.1.0

# `@slop-ai/consumer`

Consumer SDK for connecting to SLOP providers, mirroring state, and invoking actions.

Use it to build custom agents, testing tools, browser extensions, desktop apps, or protocol inspectors.

## Install

```bash
bun add @slop-ai/consumer
```

For browser-only bundles, use the browser-safe subpath:

```ts
import { SlopConsumer } from "@slop-ai/consumer/browser";
```

## Quick start

```ts
import { SlopConsumer, WebSocketClientTransport } from "@slop-ai/consumer";

const consumer = new SlopConsumer(
  new WebSocketClientTransport("ws://localhost:3000/slop"),
);

const hello = await consumer.connect();
const { id, snapshot } = await consumer.subscribe("/", -1);

console.log(hello.provider.name);
console.log(snapshot);

consumer.on("patch", (subscriptionId, ops, version) => {
  console.log(subscriptionId, ops, version);
});

await consumer.invoke("/todos", "create", { title: "Ship docs" });
console.log(consumer.getTree(id));
```

## Included utilities

- `StateMirror` for applying snapshots and patches
- `WebSocketClientTransport`, `PostMessageClientTransport`, and `NodeSocketClientTransport`
- `affordancesToTools()` and `formatTree()` for LLM integrations

## Documentation

- API reference: https://docs.slopai.dev/api/consumer
- Consumer guide: https://docs.slopai.dev/guides/consumer
- Go consumer docs: https://docs.slopai.dev/api/go
npm package: @slop-ai/core
Description: SLOP client library — let AI observe and interact with your app's state
Latest version: 0.1.0

# `@slop-ai/core`

Core types, descriptor helpers, and tree utilities for SLOP.

Use this package when you need the shared low-level building blocks. If you are instrumenting an app directly, you will usually pair it with [`@slop-ai/client`](https://docs.slopai.dev/api/client) or [`@slop-ai/server`](https://docs.slopai.dev/api/server).

## Install

```bash
bun add @slop-ai/core
```

## What it includes

- `pick`, `omit`, and `action` for building descriptors
- shared wire and descriptor types such as `NodeDescriptor`, `SlopNode`, and `Affordance`
- tree assembly and diff helpers for advanced integrations
- scaling helpers such as `prepareTree`, `truncateTree`, and `autoCompact`

## Example

```ts
import { action, pick } from "@slop-ai/core";

const taskNode = {
  type: "item",
  props: pick(task, ["title", "done", "priority"]),
  actions: {
    toggle: action(() => toggleTask(task.id)),
    rename: action({ title: "string" }, ({ title }) => renameTask(task.id, title)),
  },
};
```

## Documentation

- API reference: https://docs.slopai.dev/api/core
- Browser provider: https://docs.slopai.dev/api/client
- Server provider: https://docs.slopai.dev/api/server
- Protocol spec: https://docs.slopai.dev/spec/core/overview
npm package: @slop-ai/openclaw-plugin
Description: OpenClaw plugin for observing and controlling SLOP-enabled applications
Latest version: 0.1.0

# `@slop-ai/openclaw-plugin`

OpenClaw plugin for discovering and controlling SLOP-enabled apps.

The plugin watches local SLOP providers, subscribes to their trees, and exposes two OpenClaw tools:

- `connected_apps` to inspect connected providers and their available actions
- `app_action` to invoke an affordance on a provider

## Install

```bash
openclaw plugins install --link /path/to/slop/packages/typescript/openclaw-plugin
```

If your OpenClaw setup supports registry installation, use the package name:

```bash
openclaw plugins install @slop-ai/openclaw-plugin
```

## How provider discovery works

Providers register themselves in `~/.slop/providers/` with a descriptor like:

```json
{
  "id": "my-app",
  "name": "My App",
  "slop_version": "0.1",
  "transport": {
    "type": "unix",
    "path": "/tmp/slop/my-app.sock"
  },
  "capabilities": ["state", "patches", "affordances"]
}
```

The plugin connects to Unix socket and WebSocket providers automatically.

## Example

```text
connected_apps("kanban")
app_action("kanban", "/", "add_card", { column: "backlog", title: "Ship docs" })
```

## Documentation

- API reference: https://docs.slopai.dev/api/openclaw-plugin
- OpenClaw guide: https://docs.slopai.dev/guides-advanced/openclaw
- Consumer SDK: https://docs.slopai.dev/api/consumer
npm package: @slop-ai/react
Description: React hook for SLOP — useSlop() to expose component state to AI
Latest version: 0.1.0

# `@slop-ai/react`

React hook for exposing component state to SLOP.

## Install

```bash
bun add @slop-ai/client @slop-ai/react
```

## Quick start

```tsx
import { createSlop } from "@slop-ai/client";
import { action, useSlop } from "@slop-ai/react";

const slop = createSlop({ id: "notes-app", name: "Notes App" });

export function NotesList() {
  const [notes, setNotes] = useState([{ id: "1", title: "Ship docs", pinned: false }]);

  useSlop(slop, "notes", () => ({
    type: "collection",
    props: { count: notes.length },
    items: notes.map((note) => ({
      id: note.id,
      props: { title: note.title, pinned: note.pinned },
      actions: {
        toggle_pin: action(() =>
          setNotes((current) =>
            current.map((item) =>
              item.id === note.id ? { ...item, pinned: !item.pinned } : item,
            ),
          ),
        ),
      }
    })),
  }));

  return null;
}
```

`useSlop()` registers after commit, re-runs on every render, and unregisters on cleanup so action handlers always close over fresh component state.

## Documentation

- API reference: https://docs.slopai.dev/api/react
- React guide: https://docs.slopai.dev/guides/react
- Browser provider: https://docs.slopai.dev/api/client
npm package: @slop-ai/server
Description: SLOP server/native provider — createSlopServer() + WebSocket, Unix socket, stdio transports
Latest version: 0.1.0

# `@slop-ai/server`

Server-side and native-app SLOP provider for Node.js and Bun.

Use this package when your app owns the authoritative state on the server, in a desktop process, or inside a CLI tool.

## Install

```bash
bun add @slop-ai/server
```

## Quick start

```ts
import { createServer } from "node:http";
import { createSlopServer } from "@slop-ai/server";
import { attachSlop } from "@slop-ai/server/node";

const slop = createSlopServer({ id: "my-app", name: "My App" });

slop.register("todos", () => ({
  type: "collection",
  props: { count: getTodos().length },
  items: getTodos().map((todo) => ({
    id: todo.id,
    props: { title: todo.title, done: todo.done },
  })),
}));

const server = createServer();
attachSlop(slop, server, { path: "/slop" });
server.listen(3000);
```

## Transport exports

- `@slop-ai/server/node` for Node HTTP servers
- `@slop-ai/server/bun` for `Bun.serve`
- `@slop-ai/server/unix` for local Unix socket discovery
- `@slop-ai/server/stdio` for CLI and subprocess transports
- `@slop-ai/server/nitro` for Nitro WebSocket handlers
- `@slop-ai/server/vite` for Vite dev-server attachment

## Native and CLI example

```ts
import { createSlopServer } from "@slop-ai/server";
import { listenUnix } from "@slop-ai/server/unix";

const slop = createSlopServer({ id: "my-cli", name: "My CLI" });
slop.register("status", () => ({ type: "status", props: { ready: true } }));

listenUnix(slop, "/tmp/slop/my-cli.sock", { register: true });
```

## Documentation

- API reference: https://docs.slopai.dev/api/server
- Server and native apps guide: https://docs.slopai.dev/guides/server-apps
- TanStack Start adapter: https://docs.slopai.dev/api/tanstack-start
npm package: @slop-ai/solid
Description: SLOP integration for SolidJS — useSlop() primitive
Latest version: 0.1.0

# `@slop-ai/solid`

SolidJS primitive for exposing signal-driven state to SLOP.

## Install

```bash
bun add @slop-ai/client @slop-ai/solid
```

## Quick start

```tsx
import { createSignal } from "solid-js";
import { createSlop } from "@slop-ai/client";
import { action, useSlop } from "@slop-ai/solid";

const slop = createSlop({ id: "notes-app", name: "Notes App" });

export function NotesList() {
  const [notes] = createSignal([{ id: "1", title: "Ship docs", pinned: false }]);

  useSlop(slop, "notes", () => ({
    type: "collection",
    props: { count: notes().length },
    items: notes().map((note) => ({
      id: note.id,
      props: { title: note.title, pinned: note.pinned },
      actions: {
        toggle_pin: action(() =>
          setNotes((current) =>
            current.map((item) =>
              item.id === note.id ? { ...item, pinned: !item.pinned } : item,
            ),
          ),
        ),
      },
    })),
  }));

  return null;
}
```

`useSlop()` tracks Solid signals used inside the descriptor and re-registers automatically when they change.

## Documentation

- API reference: https://docs.slopai.dev/api/solid
- Solid guide: https://docs.slopai.dev/guides/solid
- Browser provider: https://docs.slopai.dev/api/client
npm package: @slop-ai/svelte
Description: SLOP integration for Svelte 5 — useSlop() rune-based composable
Latest version: 0.1.0

# `@slop-ai/svelte`

Svelte 5 composable for exposing rune-based state to SLOP.

## Install

```bash
bun add @slop-ai/client @slop-ai/svelte
```

## Quick start

```svelte
<script lang="ts">
  import { createSlop } from "@slop-ai/client";
  import { action, useSlop } from "@slop-ai/svelte";

  const slop = createSlop({ id: "notes-app", name: "Notes App" });
  let notes = $state([{ id: "1", title: "Ship docs", pinned: false }]);

  useSlop(slop, "notes", () => ({
    type: "collection",
    props: { count: notes.length },
    items: notes.map((note) => ({
      id: note.id,
      props: { title: note.title, pinned: note.pinned },
      actions: {
        toggle_pin: action(() => {
          notes = notes.map((item) =>
            item.id === note.id ? { ...item, pinned: !item.pinned } : item,
          );
        }),
      },
    })),
  }));
</script>
```

The published artifact is a `.svelte.ts` entrypoint so downstream Svelte tooling can keep compiling rune syntax correctly.

## Documentation

- API reference: https://docs.slopai.dev/api/svelte
- Svelte guide: https://docs.slopai.dev/guides/svelte
- Browser provider: https://docs.slopai.dev/api/client
npm package: @slop-ai/tanstack-start
Description: SLOP Layer 4 adapter for TanStack Start — server setup, UI sync, state composition
Latest version: 0.1.0

# `@slop-ai/tanstack-start`

Full-stack adapter for TanStack Start applications.

This package wires together server-owned SLOP state, browser-owned UI state, and automatic refresh after server mutations. The public provider stays on the server, while the browser UI tree is mounted under `ui`.

## Install

```bash
bun add @slop-ai/server @slop-ai/tanstack-start
```

## Quick start

```ts
// src/server/slop.ts
import { createSlopServer, sharedState } from "@slop-ai/tanstack-start/server";

const state = sharedState("my-app", { items: [] as string[] });

export const slop = createSlopServer({ id: "my-app", name: "My App" });

slop.register("items", () => ({
  type: "collection",
  props: { count: state.items.length },
  items: state.items.map((title, index) => ({
    id: String(index),
    props: { title },
  })),
}));
```

```tsx
// src/routes/__root.tsx
import { Outlet } from "@tanstack/react-router";
import { useSlopUI } from "@slop-ai/tanstack-start";

export function RootLayout() {
  useSlopUI();
  return <Outlet />;
}
```

```tsx
// any route component
import { useSlop } from "@slop-ai/tanstack-start";

useSlop("filters", {
  type: "status",
  props: { active: true },
});
```

## Server helpers

- `createSlopMiddleware()` for auto-refreshing after TanStack Start server functions
- `sharedState()` for Vite dev-server singleton state
- `createWebSocketHandler()` and `slopVitePlugin()` from `@slop-ai/tanstack-start/server`

## Documentation

- API reference: https://docs.slopai.dev/api/tanstack-start
- TanStack Start guide: https://docs.slopai.dev/guides/tanstack-start
- Server provider docs: https://docs.slopai.dev/api/server
npm package: @slop-ai/vue
Description: SLOP integration for Vue — useSlop() composable
Latest version: 0.1.0

# `@slop-ai/vue`

Vue composable for exposing reactive state to SLOP.

## Install

```bash
bun add @slop-ai/client @slop-ai/vue
```

## Quick start

```vue
<script setup lang="ts">
import { ref } from "vue";
import { createSlop } from "@slop-ai/client";
import { action, useSlop } from "@slop-ai/vue";

const slop = createSlop({ id: "notes-app", name: "Notes App" });
const notes = ref([{ id: "1", title: "Ship docs", pinned: false }]);

useSlop(slop, "notes", () => ({
  type: "collection",
  props: { count: notes.value.length },
  items: notes.value.map((note) => ({
    id: note.id,
    props: { title: note.title, pinned: note.pinned },
    actions: {
      toggle_pin: action(() => {
        notes.value = notes.value.map((item) =>
          item.id === note.id ? { ...item, pinned: !item.pinned } : item,
        );
      }),
    },
  })),
}));
</script>
```

The descriptor function is tracked reactively, and Vue proxies are unwrapped before the descriptor is sent to the transport layer.

## Documentation

- API reference: https://docs.slopai.dev/api/vue
- Vue guide: https://docs.slopai.dev/guides/vue
- Browser provider: https://docs.slopai.dev/api/client
npm package: @slope/bunyan-syslog
Description: Syslog Stream for Bunyan
Author: Mark Cavage
Latest version: 0.3.3

bunyan-syslog is a stream for [bunyan](https://github.com/trentm/node-bunyan)
that consumes `raw` records from bunyan and sends them to a syslog server.

# Installation

    npm install bunyan-syslog

# Usage

```javascript
var bunyan = require('bunyan');
var bsyslog = require('bunyan-syslog');

var log = bunyan.createLogger({
	name: 'foo',
	streams: [ {
		level: 'debug',
		type: 'raw',
		stream: bsyslog.createBunyanStream({
			type: 'sys',
			facility: bsyslog.local0,
			host: '192.168.0.1',
			port: 514
		})
	}]
});

log.debug({foo: 'bar'}, 'hello %s', 'world');
```
That's pretty much it.  You create a syslog stream, and point it at a syslog
server (UDP by default; you can force TCP by setting `type: tcp` in the
constructor); default is to use facility `user` and a syslog server on
`127.0.0.1:514`.  Note you *must* pass `type: 'raw'` to bunyan in the top-level
stream object or this won't work.

## Mappings

This module maps bunyan levels to syslog levels as follows:

```
+--------+--------+
| Bunyan | Syslog |
+--------+--------+
| fatal  | emerg  |
+--------+--------+
| error  | error  |
+--------+--------+
| warn   | warn   |
+--------+--------+
| info   | info   |
+--------+--------+
| *      | debug  |
+--------+--------+
```

# License

MIT.
npm package: @slopmachine/core
Description: The official Core / VanillaJS SDK for Slop Machine
Latest version: 0.1.20

# @slopmachine/core

The core logic and shared utilities for the Slop Machine SDK.

## Installation

```bash
npm install @slopmachine/core
# or
yarn add @slopmachine/core
# or
pnpm add @slopmachine/core
```

## Usage

This package provides the core functions and type definitions used by the Slop Machine framework integrations (like `@slopmachine/react` and `@slopmachine/svelte`).

## License

MIT
npm package: @slopmachine/react
Description: The official React SDK for Slop Machine
Author: Slop Machine
Latest version: 0.1.22

# @slopmachine/react

The official React SDK for Slop Machine. This package provides React components to easily integrate Slop Machine image generation into your applications.

## Installation

```bash
npm install @slopmachine/react
# or
yarn add @slopmachine/react
# or
pnpm add @slopmachine/react
```

## Demo

https://slopmachine-dev.github.io/slopmachine-sdk/demo-react/

## Usage

```tsx
import { SlopImage } from "@slopmachine/react";

function App() {
  return (
    <div style={{ width: "400px", height: "400px" }}>
      <SlopImage
        prompt="A cute cat drinking coffee in a {style} style"
        aspectRatio="1:1"
        variables={{ style: "anime" }}
      />
    </div>
  );
}

export default App;
```

## API / Props

### `SlopImage`

The `SlopImage` component inherits from standard `React.ImgHTMLAttributes<HTMLImageElement>` (excluding `src` and `alt`) and accepts the following additional props:

| Prop          | Type                     | Default      | Description                                             |
| :------------ | :----------------------- | :----------- | :------------------------------------------------------ |
| `prompt`      | `string`                 | **Required** | The prompt to use for image generation.                 |
| `aspectRatio` | `string`                 | `"1:1"`      | The aspect ratio of the image (e.g. `"16:9"`, `"1:1"`). |
| `variables`   | `Record<string, string>` | `{}`         | Variables to interpolate into the prompt.               |
| `model`       | `string`                 | `undefined`  | The AI model to use for generation.                     |
| `baseUrl`     | `string`                 | `undefined`  | Custom base URL for the Slop Machine API.               |

## License

MIT
npm package: @slopmachine/svelte
Description: The official Svelte SDK for Slop Machine
Latest version: 0.1.22

# @slopmachine/svelte

The official Svelte wrapper for Slop Machine. Easily integrate Slop Machine image generation into your Svelte 5 applications.

## Installation

```bash
npm install @slopmachine/svelte
# or
yarn add @slopmachine/svelte
# or
pnpm add @slopmachine/svelte
```

## Demo

https://slopmachine-dev.github.io/slopmachine-sdk/demo-svelte/

## Usage

```svelte
<script lang="ts">
  import { SlopImage } from "@slopmachine/svelte";
</script>

<div style="width: 400px; height: 400px;">
  <SlopImage
    prompt={"A cute dog wearing a hat in a {style} style"}
    aspectRatio="1:1"
    variables={{ style: "realistic" }}
  />
</div>
```

## API / Props

### `SlopImage`

The `SlopImage` component inherits standard HTML `<img>` attributes and accepts the following additional props:

| Prop          | Type                     | Default      | Description                                             |
| :------------ | :----------------------- | :----------- | :------------------------------------------------------ |
| `prompt`      | `string`                 | **Required** | The prompt to use for image generation.                 |
| `aspectRatio` | `string`                 | `"1:1"`      | The aspect ratio of the image (e.g. `"16:9"`, `"1:1"`). |
| `variables`   | `Record<string, string>` | `{}`         | Variables to interpolate into the prompt.               |
| `model`       | `string`                 | `undefined`  | The AI model to use for generation.                     |
| `baseUrl`     | `string`                 | `undefined`  | Custom base URL for the Slop Machine API.               |

## License

MIT
npm package: @slopus/beer
Description: Holdmybeer CLI bootstrap tool
Author: ex3ndr
Latest version: 0.1.7

# @slopus/beer

CLI package for **HoldMyBeer**.

## Command

- `beer`: open interactive workflow selection and run the selected workflow.
- logs are written to `<projectPath>/.beer/logs/beer-YYYY-MM-DD.log`.

## Runtime Requirements

- Node.js 22+ (published CLI runtime)
- Bun 1.3+ (development scripts)
- `gh` authenticated
- `pi` CLI installed/authenticated

## Development

```bash
bun install
bun run dev
bun run typecheck
bun run test
bun run build
bun run release
```
npm package: @slorber/docsearch-react
Description: React package for DocSearch, the best search experience for docs.
Author: Algolia, Inc.
Latest version: 4.0.1

# @docsearch/react

React package for [DocSearch](http://docsearch.algolia.com/), the best search experience for docs.

## Installation

```bash
yarn add @docsearch/react@4
# or
npm install @docsearch/react@4
```

If you don’t want to use a package manager, you can use a standalone endpoint:

```html
<script src="https://cdn.jsdelivr.net/npm/@docsearch/react@4"></script>
```

## Get started

DocSearch generates a fully accessible search box for you.

```jsx App.js
import { DocSearch } from '@docsearch/react';

import '@docsearch/css';

function App() {
  return (
    <DocSearch
      appId="YOUR_APP_ID"
      indexName="YOUR_INDEX_NAME"
      apiKey="YOUR_SEARCH_API_KEY"
    />
  );
}

export default App;
```

## Documentation

[Read documentation →](https://docsearch.algolia.com/docs/docsearch-v3)
npm package: @slorber/plugin-vercel-analytics
Description: Global vercel analytics plugin for Docusaurus.
Latest version: 3.0.0

# `@docusaurus/plugin-vercel-analytics`

[Vercel analytics](https://vercel.com/docs/analytics) plugin for Docusaurus.

## Usage

See [plugin-vercel-analytics documentation](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-vercel-analytics).
npm package: @slorber/remark-comment
Description: Remark plugin to support comments
Author: Lee Byron
Latest version: 1.0.0

# remark-comment

Parse HTML style comments as a different node type so it can be ignored during
serialization.

## Install and usage

```sh
npm install remark-comment
```

```js
import { unified } from 'unified'
import remarkParse from 'remark-parse'
import remarkComment from 'remark-comment'

unified().use(remarkParse).use(remarkComment)
```

For more help with unified, please see the docs for [unified] and [remark].

This package also exports its [micromark] and [mdast] plugins:

```js
import {
  comment,
  commentHtml,
  commentFromMarkdown,
  commentToMarkdown,
} from 'remark-comment'
```

**Options:**

The `remarkComment` and `commentFromMarkdown` functions take the options:

- `ast`: If true, a `{ type: "comment" }` node will be included in the
  resulting AST. This is useful if you want to do post-processing and stringify
  back to markdown. Default: `false`.

[unified]: https://unifiedjs.com/learn/guide/using-unified/
[remark]: https://unifiedjs.com/explore/package/remark-parse/
[micromark]: https://github.com/micromark/micromark
[mdast]: https://github.com/syntax-tree/mdast#extensions

## Example

```markdown
# This file

<!-- contains a comment -->

And a paragraph
```

Renders to:

```html
<h1>This file</h1>
<p>And a paragraph</p>
```

## Motivation

This package was created after realizing that MDX lacked support for HTML style
comments. When trying to migrate an existing collection of markdown files to
MDX, hitting syntax errors for HTML comments was a non-starter. Rather than go
modify all those files to use a (more awkward) JSX expression comment, I created
this plugin to add back this support.

However, I found this useful when used outside of MDX. Common markdown
interprets an HTML comment as an HTML block, and during serialization will pass
it directly through to the final HTML document. I typically do not want my
markdown comments appearing in my final HTML documents, and this plugin achieves
this effect.

## Caveats

This plugin must be added after MDX, otherwise you will see this error:

```
Unexpected character `!` (U+0021) before name, expected a character that can start a name, such as a letter, `$`, or `_` (note: to create a comment in MDX, use `{/* text */}`)
```

In a unified pipeline:

```js
unified().use(remarkMDX).use(remarkComment)
```

Unlike HTML, comments cannot be used within a JSX body. JSX is still JSX.
HTML comments must appear outside of JSX, use JSX style comments (`{/* comment */}`) inside of JSX.
npm package: @slorenzot/git-plugin-opencode
Description: Git tools plugin for OpenCode - provides git operations as tools for the AI agent
Author: slorenzot
Latest version: 0.0.2

# @slorenzot/git-plugin-opencode

Git tools plugin for OpenCode. Provides Git operations as tools for the AI agent.

## Installation

### From npm (once published)

Add to your `opencode.json` configuration:

```json
{
  "plugin": ["@slorenzot/git-plugin-opencode"]
}
```

### From GitHub

```json
{
  "plugin": ["github:slorenzot/git-plugin-opencode"]
}
```

Or for global installation, add to `~/.config/opencode/opencode.json`.

## Available Tools

| Tool           | Description                               |
| -------------- | ----------------------------------------- |
| `git_branch`   | Get the current branch name               |
| `git_branches` | List all branches (local and remote)      |
| `git_status`   | Show working tree status                  |
| `git_checkout` | Switch branches or create new ones        |
| `git_diff`     | Show changes between commits/working tree |
| `git_log`      | Show commit history                       |
| `git_commit`   | Create a new commit                       |
| `git_stash`    | Stash/unstash changes                     |
| `git_add`      | Stage files for commit                    |
| `git_reset`    | Unstage files or reset state              |
| `git_pull`     | Fetch and merge from remote               |
| `git_push`     | Push commits to remote                    |
| `git_fetch`    | Download objects from remote              |
| `git_merge`    | Merge branches                            |
| `git_rebase`   | Reapply commits on another base           |
| `git_remote`   | Manage remote repositories                |
| `git_tag`      | Create, list, or delete tags              |
| `git_show`     | Show commit/object details                |
| `git_blame`    | Show line-by-line authorship              |

## Usage Examples

Once installed, the AI agent can use these tools automatically:

**Check current branch:**

> "What branch am I on?"

**View recent commits:**

> "Show me the last 5 commits"

**Create a feature branch:**

> "Create a new branch called feature/login"

**Stage and commit changes:**

> "Add all changes and commit with message 'Fix login bug'"

**Push to remote:**

> "Push my changes to origin"

## Development

```bash
# Install dependencies
npm install

# Type check
npm run typecheck

# Build
npm run build
```

## Local Development

For local plugin development, you can use a file path:

```json
{
  "plugin": ["file://.opencode/plugins/git.ts"]
}
```

## License

MIT
npm package: @slorm/slorm
Description: A Slonik kind of ORM
Author: Nicolas Caous Fernandes
Latest version: 0.0.8

# Slorm

Slorm is a library consisting of a collection of classes and functions created to assist [slonik](https://github.com/gajus/slonik) users in creating and managing tables. Its name is the concatenation of "slonik" with "ORM".

It is heavily influenced by a python ORM named [peewee](https://github.com/coleifer/peewee).

### Installing

```
npm i @slorm/slorm
yarn add @slorm/slorm
```

## Is slorm an ORM?

No. But, it can be used to create one. In fact, I (the creator of this project) am a supporter of the idea that each project should have its own ORM, created especialy for the database requirements of each project. This is the true intent of slorm: a set of tools created for the pourpose of building an ORM with no constraints besides the postgres database.
npm package: @slosarek/acme-http-01-data
Description: Greenlock acme-http-01 base that uses @slosarek/greenlock-data-layer for data storage.
Author: mark@slosarek.com
Latest version: 1.0.1

# @slosarek/acme-http-01-data

Greenlock acme-http-01 base that uses @slosarek/greenlock-data-layer for data storage.

## Installation

```bash
npm install @slosarek/acme-http-01-data
```

## License
[MIT](https://choosealicense.com/licenses/mit/)
npm package: @slosarek/greenlock-data-layer
Description: MongoDB backend use for several greenlock libraries
Author: mark@slosarek.com
Latest version: 1.0.2

# @slosarek/greenlock-data-layer

Library used in custom greenlock libraries to consolidate MongoDB interactions.

## Installation

```bash
npm install @slosarek/greenlock-data-layer
```

## License
[MIT](https://choosealicense.com/licenses/mit/)
npm package: @slosarek/greenlock-manager-data
Description: Greenlack manager using a generic backend
Author: mark@slosarek.com
Latest version: 1.0.2

# @slosarek/greenlock-manager-data

Greenlock manager base that uses @slosarek/greenlock-data-layer for data storage.

## Installation

```bash
npm install @slosarek/greenlock-manager-data
```

## License
[MIT](https://choosealicense.com/licenses/mit/)
npm package: @slosarek/greenlock-store-data
Description: A greenlock store that uses a modifiable data storelibrary
Author: mark@slosarek.com
Latest version: 1.0.1

# @slosarek/greenlock-store-data

Greenlock store base that uses @slosarek/greenlock-data-layer for data storage.

## Installation

```bash
npm install @slosarek/greenlock-store-data
```

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @sloth-form/element-plus
Description: A Vue 3 component library for building forms with Element Plus.
Author: slothcode
Latest version: 1.0.1

# Sloth-Form

如树懒般慵懒的构建表单,简化表单创建流程.
基于Vue 3和Element Plus的表单生成器，让表单构建变得简单高效。

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

## 特性

- 🚀 **简单易用** - 使用JSON配置生成表单，无需手动编写重复代码
- 📦 **组件丰富** - 支持Element Plus的所有表单组件
- 🛠️ **灵活定制** - 支持自定义组件注册、丰富的插槽配置
- 🔍 **完整类型定义** - 使用TypeScript开发，提供完整类型提示
- 📱 **响应式布局** - 支持灵活的栅格布局

## 安装

```bash
# npm
npm install @sloth-form/element-plus

# yarn
yarn add @sloth-form/element-plus

# pnpm
pnpm add @sloth-form/element-plus
```

## 快速开始

```vue
<template>
  <Form v-model="formData" :items="formItems" />
</template>

<script setup lang="ts">
import { Form } from '@sloth-form/element-plus'
import { ref } from 'vue'

const formData = ref({})
const formItems = [
  {
    prop: 'name',
    label: '姓名',
    type: 'input',
    rules: [{ required: true, message: '请输入姓名', trigger: 'blur' }]
  },
  {
    prop: 'gender',
    label: '性别',
    type: 'select',
    options: [
      { label: '男', value: 'male' },
      { label: '女', value: 'female' }
    ]
  }
]
</script>
```

## 表单配置

### 表单项属性

| 属性        | 说明                         | 类型          | 默认值  |
| ----------- | ---------------------------- | ------------- | ------- |
| prop        | 表单域字段名                 | string        | -       |
| label       | 标签文本                     | string        | -       |
| type        | 表单项类型                   | string        | 'input' |
| span        | 栅格占据的列数               | number (1-24) | 24      |
| show        | 是否显示                     | boolean       | true    |
| value       | 默认值                       | any           | ''      |
| options     | 选项配置（用于select等组件） | Array         | []      |
| rules       | 校验规则                     | Array         | -       |
| attrs       | 传递给表单控件的属性         | Object        | {}      |
| itemSlots   | 表单项插槽                   | Object        | {}      |
| widgetSlots | 控件插槽                     | Object        | {}      |

### 表单实例方法

您可以通过ref获取表单实例，访问以下属性和方法：

- `formRef`: Element Plus的表单实例引用
- `formItemsRefs`: 所有表单项的实例引用
- `widgetRefs`: 所有表单控件的实例引用

## 自定义组件

```ts
import { formControllerManager } from '@sloth-form/element-plus'
import MyComponent from './MyComponent.vue'

// 注册自定义组件
formControllerManager.register('my-component', MyComponent)
```

## 开发贡献

```bash
# 安装依赖
pnpm install

# 开发模式
pnpm dev

# 构建库
pnpm build:lib

# 运行测试
pnpm test
```

## 许可证

[MIT](./LICENSE)
npm package: @slothfi/bank-sdk
Description: 🛠 An SDK for building applications on top of DeFimons  .
Latest version: 1.0.6

# Uniswap SDK

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![Actions Status](https://github.com/SlothFi/bank-sdk/workflows/CI/badge.svg)](https://github.com/SlothFi/bank-sdk)
[![npm version](https://img.shields.io/npm/v/@bank/sdk/latest.svg)](https://www.npmjs.com/package/@bank/sdk/v/latest)
[![npm bundle size (scoped version)](https://img.shields.io/bundlephobia/minzip/@slothfi/bank-sdk/latest.svg)](https://bundlephobia.com/result?p=@slothfi/bank-sdk@latest)

In-depth documentation on this SDK is available at [uniswap.org](https://uniswap.org/docs/v2/SDK/getting-started/).

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/SlothFi/bank-sdk.git
```

Move into the bank-sdk working directory

```sh
cd bank-sdk/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
yarn run v1.22.4
$ tsdx test
 PASS  test/constants.test.ts
 PASS  test/pair.test.ts
 PASS  test/fraction.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/trade.test.ts

Test Suites: 1 skipped, 6 passed, 6 of 7 total
Tests:       3 skipped, 82 passed, 85 total
Snapshots:   0 total
Time:        5.091s
Ran all test suites.
✨  Done in 6.61s.
```
npm package: @slothfi/bank-sdk-extra
Description: 🛠 A specific SDK/toolkit for building applications on top of Defimons.
Latest version: 1.0.1

# Bank SDK Extra

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![Actions Status](https://github.com/SlothFi/bank-sdk-extra/workflows/CI/badge.svg)](https://github.com/SlothFi/bank-sdk-extra)
[![npm version](https://img.shields.io/npm/v/@slothfi/bank-sdk-extra/latest.svg)](https://www.npmjs.com/package/@slothfi/bank-sdk-extra/v/latest)
[![npm bundle size (scoped version)](https://img.shields.io/bundlephobia/minzip/@slothfi/bank-sdk-extra/latest.svg)](https://bundlephobia.com/result?p=@slothfi/bank-sdk-extra@latest)

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/SlothFi/bank-sdk-extra.git
```

Move into the bank-sdk-extra working directory

```sh
cd bank-sdk-extra/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```
npm package: @slothking-online/slothking-diagram
Description: A slothking diagram
Latest version: 0.1.19

# How to use it

## Define spacebar menu actions

```jsx
let allCategories = [{
  name: 'middlewares',
  items: [
    {
      name: 'middleware',
      type: 'middleware',
      inputs: [
        {
          name: ''
        }
      ],
      outputs: [
        {
          name: ''
        }
      ]
    }
  ]
}]
```


```jsx
<Graph
  categories={allCategories}
/>
```

Now if you press spacebar when mouse is on the graph you get this menu, which creates nodes.

## Serialization of data
```jsx
<Graph
  categories={allCategories}
  serialize={(nodes, links) => {
  }}
/>
```
npm package: @slothkit/eslint-config
Description: eslint shareable configs
Author: MichaelTZ
Latest version: 1.3.0

![npm (scoped)](https://img.shields.io/npm/v/@slothkit/eslint-config)
![GitHub last commit](https://img.shields.io/github/last-commit/slothkit/eslint-config)
![npm](https://img.shields.io/npm/dt/@slothkit/eslint-config)

[中文文档](./README.zh_CN.md)

This package provides simplified and less strict validation rules based on Airbnb's eslint rules.

## Usage
1\. Install the dependency:

```
npm i -D @slothkit/eslint-config
```

2\. Modify your own eslint configuration based on `./.eslintrc.js`

3\. Choose the appropriate extension configuration based on the technology stack:

|Technology Stack|Extends|
|-|-|
|JavaScript|@slothkit/eslint-config/base|
|TypeScript|@slothkit/eslint-config/typescript|
|React|@slothkit/eslint-config/base and @slothkit/eslint-config/rules/react|
|TypeScript+React|@slothkit/eslint-config|
npm package: @slothswaps/blast-sdk
Description: 🛠 An SDK for building applications on blast of slothswaps.
Latest version: 1.0.2

# slothswaps/blast-sdk

Forked from the [Uniswap SDK](https://github.com/Uniswap/uniswap-v2-sdk).

You can refer to the Uniswap SDK documentation [uniswap.org](https://uniswap.org/docs/v2/SDK/getting-started/).

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/slothswaps/blast-sdk.git
```

Move into the blast-sdk working directory

```sh
cd blast-sdk/
```

Install dependencies

```sh
yarn
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
$ tsdx test
 PASS  test/fraction.test.ts
 PASS  test/pair.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/router.test.ts
 PASS  test/constants.test.ts
 PASS  test/trade.test.ts
 PASS  test/token.test.ts
 PASS  test/route.test.ts

Test Suites: 1 skipped, 9 passed, 9 of 10 total
Tests:       2 skipped, 124 passed, 126 total
Snapshots:   0 total
Time:        2.107s
Ran all test suites.
✨  Done in 5.90s.
```
npm package: @slotkitjs/types
Description: TypeScript type definitions for SlotKit plugin system
Author: liusnew
Latest version: 0.3.0

# @slotkitjs/types

TypeScript type definitions for the SlotKit plugin system.

## Overview

This package provides type-only exports for the SlotKit plugin system, allowing plugins to import type definitions without creating runtime dependencies on implementation code.

## Installation

```bash
npm install @slotkitjs/types
# or
pnpm add @slotkitjs/types
# or
yarn add @slotkitjs/types
```

## Usage

### Importing Service Contracts

```typescript
import type { IAuthService, IHttpClient } from '@slotkitjs/types/contracts'

// Use types without importing implementations
const authService = context.services.get<IAuthService>('IAuthService')
```

### Importing Event Types

```typescript
import type { AuthLoginEvent, AuthLogoutEvent } from '@slotkitjs/types/events'

// Type-safe event handling
context.events.on<AuthLoginEvent>('auth:login', (event) => {
  console.log('User logged in:', event.payload.userId)
})
```

### Importing Core Types

```typescript
import type {
  ServiceContainer,
  EventBus,
  ExtensionRegistry,
  PluginContext
} from '@slotkitjs/types/core'
```

## Package Structure

- `/contracts` - Service contract interfaces
- `/events` - Event type definitions
- `/core` - Core system type definitions

## Benefits

1. **No Runtime Dependencies**: Import types without bundling implementation code
2. **Type Safety**: Full TypeScript type checking across plugin boundaries
3. **Decoupling**: Plugins depend only on interfaces, not implementations
4. **Versioning**: Type definitions can be versioned independently

## License

MIT