open-index/open-npm huggingface dataset:
npm package: @raex-ui/flip-dot
Description: Cascading dot-flip grid that simulates a physical flip-dot display. Animated digit transition component for React.
Latest version: 0.1.1

# @raex-ui/flip-dot

A cascading dot-flip grid that simulates a physical flip-dot display. Dots flip with spring physics in a diagonal cascade pattern.

![flip-dot](https://raex-ui.vercel.app/components/flip-dot)

## Install

```bash
npm install @raex-ui/flip-dot
```

## Usage

```tsx
import { FlipDot } from "@raex-ui/flip-dot";

function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <FlipDot value={digit} size={64} />;
}
```

## Props

| Prop | Type | Description |
|------|------|-------------|
| `value` | `number` | Digit to display (0–9) |
| `size` | `number` | Width in pixels. Height is automatically 1.5× width. |

## Peer Dependencies

- `react` >=18
- `react-dom` >=18
- `framer-motion` >=10

No Tailwind CSS required.

## License

MIT
npm package: @raex-ui/ink-bloom
Description: Ink-in-water dissolve effect where digits bloom in with blur and scale. Animated digit transition component for React.
Latest version: 0.1.1

# @raex-ui/ink-bloom

An ink-in-water dissolve effect where digits bloom in with blur and scale, creating an organic morphing transition between values.

![ink-bloom](https://raex-ui.vercel.app/components/ink-bloom)

## Install

```bash
npm install @raex-ui/ink-bloom
```

## Usage

```tsx
import { InkBloom } from "@raex-ui/ink-bloom";

function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <InkBloom value={digit} size={64} />;
}
```

## Props

| Prop | Type | Description |
|------|------|-------------|
| `value` | `number` | Digit to display (0–9) |
| `size` | `number` | Width in pixels. Height is automatically 1.5× width. |

## Peer Dependencies

- `react` >=18
- `react-dom` >=18
- `framer-motion` >=10

No Tailwind CSS required.

## License

MIT
npm package: @raex-ui/particle-scatter
Description: Firefly dots scatter and reform into digits using spring physics. Animated digit transition component for React.
Latest version: 0.1.1

# @raex-ui/particle-scatter

Firefly dots scatter and reform into digits using spring physics. Each of the 35 dots (7×5 grid) animates independently with staggered delays.

![particle-scatter](https://raex-ui.vercel.app/components/particle-scatter)

## Install

```bash
npm install @raex-ui/particle-scatter
```

## Usage

```tsx
import { ParticleScatter } from "@raex-ui/particle-scatter";

function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <ParticleScatter value={digit} size={64} />;
}
```

## Props

| Prop | Type | Description |
|------|------|-------------|
| `value` | `number` | Digit to display (0–9) |
| `size` | `number` | Width in pixels. Height is automatically 1.5× width. |

## Peer Dependencies

- `react` >=18
- `react-dom` >=18
- `framer-motion` >=10

No Tailwind CSS required.

## License

MIT
npm package: @raex-ui/thread-unravel
Description: Single continuous stroke path that unravels and restitches to form each digit. Animated digit transition component for React.
Latest version: 0.1.1

# @raex-ui/thread-unravel

A single continuous stroke path that unravels and restitches to form each digit. Uses SVG stroke-dashoffset animation for a hand-drawn effect.

![thread-unravel](https://raex-ui.vercel.app/components/thread-unravel)

## Install

```bash
npm install @raex-ui/thread-unravel
```

## Usage

```tsx
import { ThreadUnravel } from "@raex-ui/thread-unravel";

function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <ThreadUnravel value={digit} size={64} />;
}
```

## Props

| Prop | Type | Description |
|------|------|-------------|
| `value` | `number` | Digit to display (0–9) |
| `size` | `number` | Width in pixels. Height is automatically 1.5× width. |

## Peer Dependencies

- `react` >=18
- `react-dom` >=18
- `framer-motion` >=10

No Tailwind CSS required.

## License

MIT