open-index/open-npm huggingface dataset:
npm package: @pinser/lit-observe
Description: @pinser/lit-observe is a lit-html library for to display observables like rxjs or redux.
Author: Marc Buils
Latest version: 0.1.2

# @pinser/lit-observe

@pinser/lit-observe is a lit-html library for to display observables like rxjs or redux.

It tested with :

- [rxjs](https://rxjs.dev/): Reactive Extensions Library for JavaScript
- [lit](https://lit.dev/): Simple. Fast. Web Components.
- [aframe-element](https://github.com/pinserworld/pinser/tree/master/libs/utils/aframe-element): Simple library for building fast, lightweight web components for 3D development.

Code inspired from https://lit.dev/docs/templates/custom-directives/

## Installation

Use the package manager [npm](https://www.npmjs.com/package/@pinser/lit-observe) to install lit-observe.

```bash
npm install @pinser/lit-observe
```

## Usage

### Simple usage

```typescript
import { observe } from '@pinser/lit-observe';
import { of } from 'rxjs';

// ...
title$ = of('Hello World');

render() {
  return html`
<h1>${observe(this.title$)}</h1>
  `;
}
```

### With callback

```typescript
import { observe } from '@pinser/lit-observe';
import { of } from 'rxjs';

// ...
list$ = of([
  { title: 'todo 1' },
  { title: 'todo 2' },
]);

render() {
  return html`
<ul>
  ${observe(this.list$, (list) => list.map((item) => html`
    <li>${item.title}</li>
  `))}
</ul>
  `;
}
```

## Example

### Todo-list with rxjs

- Demo: 
https://lit-observe-rxjs-example.herokuapp.com/
- Source code: 
https://github.com/pinserworld/pinser/tree/master/apps/lit-observe-demo/src/app/app.element.ts

![Todo-list with rxjs](./docs/lit-observe/assets/example-todolist.png)

### Tictactoe with @pinser/aframe-element & rxjs

- Demo: 
https://aframe-element-demo.herokuapp.com/
- Source code: 
https://github.com/pinserworld/pinser/tree/master/libs/utils/aframe-element/blob/master/apps/demo/src/app/app.element.ts

![aframe-element example tictactoe](./docs/lit-observe/assets/example-tictactoe.png)

## Building

Run `nx build utils-lit-observe` to build the library.

## Running unit tests

Run `nx test utils-lit-observe` to execute the unit tests via [Jest](https://jestjs.io).

## Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @pinser/tic-tac-toe
Description: This library was generated with [Nx](https://nx.dev).
Author: Marc Buils
Latest version: 0.1.0

# widgets-tic-tac-toe

This library was generated with [Nx](https://nx.dev).

## Building

Run `nx build widgets-tic-tac-toe` to build the library.

## Running unit tests

Run `nx test widgets-tic-tac-toe` to execute the unit tests via [Jest](https://jestjs.io).
npm package: @pinset/cultivation
Description: Mushroom cultivation domain types for the Pinset platform
Author: Pinset Platform
Latest version: 0.1.1

# @pinset/cultivation

Mushroom cultivation domain types for the Pinset platform.

## Installation

```bash
npm install @pinset/cultivation
```

## Usage

```typescript
import { Species, Strain, GrowCycle, CultivationProfile } from '@pinset/cultivation'
import { schemas } from '@pinset/cultivation'

// Use types
const strain: Strain = {
  id: 'strain_gt',
  speciesId: 'species_psilocybe_cubensis',
  name: 'Golden Teacher',
  abbreviation: 'GT'
}

// Runtime validation with Zod schemas
const result = schemas.StrainSchema.parse(strain)
```

## What's Included

### Types

- **Taxonomy**: `Species`, `Strain`, `InoculantMetadata`, `SpawnMetadata`
- **Environment**: `CultivationProfile`, `StageConfig`, `EnvironmentTargets`
- **Grow Cycles**: `GrowCycle`, `FlushOutcome`, `GrowOutcome`
- **Events**: `GrowEvent`, `ObservationEvent`, `HarvestEvent`
- **Rules**: `ParameterRule`, `Condition`, `Action`

### Schemas

All types include corresponding Zod schemas for runtime validation.

## License

MIT
npm package: @pinset/tokens
Description: Design system tokens for Pinset platform
Latest version: 0.1.3

# @pinset/tokens

Design system tokens for Pinset platform applications. CSS custom properties with four themes.

## Installation

```bash
npm install @pinset/tokens
```

## Usage

### All Themes

```css
@import '@pinset/tokens';
```

### Single Theme

```css
@import '@pinset/tokens/themes/classic';
```

## Available Themes

| Theme | Description | Default Mode |
|-------|-------------|--------------|
| `classic` | Bold primaries, high contrast, functional design | Light |
| `earth` | Warm, earthy, natural tones | Light |
| `ocean` | Blue-focused, clean, gallery aesthetic | Light |
| `forest` | Dark organic, natural accents | Dark |

## Token Reference

All themes provide these CSS custom properties:

### Primary Colors
```css
--color-primary-50 through --color-primary-900
```

### Accent Colors
```css
--color-accent-50 through --color-accent-900
```

### Semantic Colors
```css
--color-success
--color-warning
--color-danger
```

### Surface Colors
```css
--color-background
--color-surface
--color-surface-raised
--color-border
```

### Text Colors
```css
--color-text
--color-text-muted
--color-text-inverted
```

## Theme Switching

Themes use `data-theme` attribute and `.dark`/`.light` classes:

```html
<!-- Classic light (default) -->
<html data-theme="classic">

<!-- Classic dark -->
<html data-theme="classic" class="dark">

<!-- Ocean theme -->
<html data-theme="ocean">

<!-- Forest (dark by default) -->
<html data-theme="forest">

<!-- Forest light variant -->
<html data-theme="forest" class="light">
```

## Extending for App-Specific Tokens

Apps can extend the base tokens with domain-specific colors:

```css
/* app-specific-tokens.css */
:root {
  /* Therapy app mood colors */
  --color-mood-excellent: 34 197 94;
  --color-mood-good: 132 204 22;
  --color-mood-neutral: 250 204 21;
}
```

## License

MIT
npm package: @pinset/tsconfig
Description: Shared TypeScript configuration for Pinset platform
Latest version: 0.1.1

# @pinset/tsconfig

Shared TypeScript configurations for Pinset platform applications.

## Installation

```bash
npm install -D @pinset/tsconfig
```

## Available Configs

### Base (`@pinset/tsconfig`)

```json
{
  "extends": "@pinset/tsconfig",
  "compilerOptions": {
    "outDir": "dist",
    "rootDir": "src"
  },
  "include": ["src"]
}
```

### React (`@pinset/tsconfig/react`)

```json
{
  "extends": "@pinset/tsconfig/react",
  "include": ["src"]
}
```

### Node (`@pinset/tsconfig/node`)

```json
{
  "extends": "@pinset/tsconfig/node",
  "compilerOptions": {
    "outDir": "dist",
    "rootDir": "src"
  },
  "include": ["src"]
}
```

## License

MIT
npm package: @pinset/ui
Description: Themeable React component library for Pinset platform
Latest version: 0.1.7

# @pinset/ui

Themeable React component library for Pinset platform applications.

## Installation

```bash
npm install @pinset/ui @pinset/tokens
```

## Usage

```tsx
import { ThemeProvider, Button, Card, CardBody, Badge } from '@pinset/ui'
import '@pinset/tokens'           // Design tokens
import '@pinset/ui/styles.css'    // Component styles

function App() {
  return (
    <ThemeProvider>
      <Card>
        <CardBody>
          <Badge variant="success">Active</Badge>
          <Button>Click me</Button>
        </CardBody>
      </Card>
    </ThemeProvider>
  )
}
```

## Components

### Layout
- `Card`, `CardHeader`, `CardBody`, `CardTitle`

### Form
- `Button` - primary, secondary, accent, danger, ghost
- `Input` - Text input with label and error
- `Textarea` - Multi-line text input
- `Select` - Dropdown select

### Feedback
- `Badge` - default, primary, accent, success, warning, error
- `Modal` - Dialog overlay

### Theme
- `ThemeProvider` - Theme context provider
- `ThemeSwitcher` - Theme and color mode picker
- `ThemeSwitcherCompact` - Compact color mode toggle
- `useTheme` - Hook for accessing theme context

## Themes

Available themes from `@pinset/tokens`:

| Theme | Description |
|-------|-------------|
| `classic` | Bold primaries, high contrast |
| `earth` | Warm, earthy tones |
| `ocean` | Blue-focused, clean aesthetic |
| `forest` | Dark organic, natural accents |

### Custom Storage Key

```tsx
<ThemeProvider storageKeyPrefix="myapp">
  {/* Uses 'myapp-theme' and 'myapp-color-mode' in localStorage */}
</ThemeProvider>
```

## License

MIT
npm package: @pint3swap/eslint-config-pint
Description: Eslint config for PintSwap
Author: RabbitDoge
Latest version: 1.2.0

# eslint-config-pint

Pint Eslint config with:

- Airbnb config
- Typescript
- Prettier

## Usage

```
npx install-peerdeps --dev @pint3swap-libs/eslint-config-pint
```

Add `"extends": "@pint3swap-libs/eslint-config-pint"` to your eslint config file.