open-index/open-npm huggingface dataset:
npm package: @stiwi/pixelsrc-wasm
Description: WebAssembly build of pixelsrc pixel art renderer
Latest version: 0.2.0

# @pixelsrc/wasm

WebAssembly build of [pixelsrc](https://github.com/pixelsrc/pixelsrc) - a GenAI-native pixel art format and renderer.

## Installation

```bash
npm install @pixelsrc/wasm
```

## Usage (Browser)

```javascript
import init, { render_to_png, render_to_rgba, list_sprites } from '@pixelsrc/wasm';

// Initialize WASM module (required before first use)
await init();

// Define a sprite in pixelsrc JSONL format
const jsonl = `{"type":"sprite","name":"heart","palette":{"{_}":"#00000000","{r}":"#FF0000"},"grid":["{_}{r}{r}{_}{r}{r}{_}","{r}{r}{r}{r}{r}{r}{r}","{_}{r}{r}{r}{r}{r}{_}","{_}{_}{r}{r}{r}{_}{_}","{_}{_}{_}{r}{_}{_}{_}"]}`;

// Render to PNG bytes
const pngBytes = render_to_png(jsonl);

// Display in an <img> element
const blob = new Blob([pngBytes], { type: 'image/png' });
const url = URL.createObjectURL(blob);
document.getElementById('preview').src = url;

// Or render to RGBA for canvas
const result = render_to_rgba(jsonl);
const imageData = new ImageData(
  new Uint8ClampedArray(result.pixels),
  result.width,
  result.height
);
ctx.putImageData(imageData, 0, 0);

// List available sprites
const sprites = list_sprites(jsonl);
console.log('Sprites:', sprites);
```

## Usage (Node.js)

```javascript
import { readFileSync, writeFileSync } from 'fs';
import init, { render_to_png } from '@pixelsrc/wasm';

await init();

const jsonl = readFileSync('sprite.jsonl', 'utf8');
const pngBytes = render_to_png(jsonl);
writeFileSync('sprite.png', pngBytes);
```

## API

### `init(): Promise<void>`
Initialize the WASM module. Must be called before any other function.

### `render_to_png(jsonl: string, spriteName?: string): Uint8Array`
Render JSONL input to PNG bytes. Optionally specify which sprite to render.

### `render_to_rgba(jsonl: string, spriteName?: string): RenderResult`
Render to raw RGBA pixels. Returns an object with:
- `width: number` - Image width in pixels
- `height: number` - Image height in pixels
- `pixels: Uint8Array` - Raw RGBA pixel data
- `warnings: string[]` - Any rendering warnings

### `list_sprites(jsonl: string): string[]`
Get list of sprite and composition names in the input.

### `validate(jsonl: string): string[]`
Validate JSONL without rendering. Returns array of error/warning messages.

## pixelsrc Format

pixelsrc uses JSONL (JSON Lines) format. Each line is a self-contained JSON object:

```jsonl
{"type":"palette","name":"mono","colors":{"{_}":"#00000000","{on}":"#FFFFFF","{off}":"#000000"}}
{"type":"sprite","name":"checker","palette":"mono","grid":["{on}{off}{on}{off}","{off}{on}{off}{on}"]}
```

See the [full documentation](https://github.com/pixelsrc/pixelsrc) for more details.

## License

MIT
npm package: @stixx200/nx-remotecache-filesystem
Description: A task runner for [@nrwl/nx](https://nx.dev/) that uses an filesystem location as a remote cache.
Author: Markus Völk
Latest version: 0.1.1

# nx-remotecache-filesystem

A task runner for [@nrwl/nx](https://nx.dev/) that uses an filesystem location as a remote cache.

## Setup

```
npm install --save-dev @stixx200/nx-remotecache-filesystem
```

| Parameter      | Description                                                             | Environment Variable / .env  | `nx.json`       |
|----------------|-------------------------------------------------------------------------|------------------------------|-----------------|
| Cache Location | Target cache location                                                   | `NX_CACHE_FS_CACHE_LOCATION` | `cacheLocation` |
| Chmod          | Run chmod after creating the target cache file on it. Provide a number. | `NX_CACHE_FS_CHMOD`          | `chmod`         |
| Config File    | Provide a js file which exports a configuration.                        | -                            | `configFile`    |

```json
{
  "tasksRunnerOptions": {
    "default": {
      "runner": "nx-remotecache-filesystem",
      "options": {
        "cacheLocation": "/mnt/shared-cache",
        "chmod": 255
      }
    }
  }
}
```
npm package: @stjanis/ui-components
Description: simple react UI componets
Author: Janis Stipnieks
Latest version: 1.0.2

> Small ui react components library
> Built using: Rinse, React, repeat. A boilerplate to build a React component library.

## Development and Storybook

You can easily develop and interact with your components by using Storybook. To run the local server, simply run:

```bash
$ yarn i
$ yarn storybook
```

```bash
$ npm i -S ui-components
```

```bash
// In your component
import { Button } from 'ui-components';

// In your render function
<Button type="submit" onClick={this.submit}>Hello!</Button>
```

Navigate to [http://localhost:9001](http://localhost:9001) to view your stories. They should automatically update as you develop.

Storybook will pick up any story from the `stories.js` file in a component folder.

Rinse is currently using the latest technology available, so you may need to update your Node versions to latest to accomodate Babel 7 and Webpack 4.
npm package: @stjh-kun/basic-form-modal-block
Description: 基础表单弹窗区块
Latest version: 0.1.0

# basic-form-modal-block

简介：基础表单弹窗区块

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/basic-search-form-block
Description: 基础搜索表单区块
Latest version: 0.2.0

# basic-search-form-block

简介：基础搜索表单

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/basic-tree-table-block
Description: 基础树状表格区块
Latest version: 0.1.0

<!--
 * @Description: 
 * @Author: 邵志磊
 * @Date: 2024-02-06 10:49:28
 * @LastEditTime: 2024-02-06 11:02:49
 * @LastEditors: 邵志磊
-->
# basic-tree-table-block

简介：基础树状表格

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/multi-row-form-modal-block
Description: 多列表单弹窗区块
Latest version: 0.0.2

# multi-row-form-modal-block

简介：多列表单弹窗区块

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/search-tab-form-block
Description: 页签搜索表单
Latest version: 0.1.0

# search-tab-form-block

简介：页签搜索表单

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/sider-select-tree-block
Description: 侧边栏多选树型区块
Latest version: 0.2.2

# sider-select-tree-block

简介：侧边栏多选树型区块

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/sider-tab-tree-block
Description: 侧边栏多类树区块
Latest version: 0.1.0

# sider-tab-tree-block

简介：侧边栏多类树区块

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)
npm package: @stjh-kun/sider-tree-block
Description: 侧边栏树型区块
Latest version: 0.3.0

# basic-form-block

简介：基础表单

![截图](https://img.alicdn.com/tfs/TB13E09pMmTBuNjy1XbXXaMrVXa-2014-1148.png)