@raex-ui/particle-scatter 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +41 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# @raex-ui/particle-scatter
|
|
2
|
+
|
|
3
|
+
Firefly dots scatter and reform into digits using spring physics. Each of the 35 dots (7×5 grid) animates independently with staggered delays.
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
## Install
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install @raex-ui/particle-scatter
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Usage
|
|
14
|
+
|
|
15
|
+
```tsx
|
|
16
|
+
import { ParticleScatter } from "@raex-ui/particle-scatter";
|
|
17
|
+
|
|
18
|
+
function MyComponent() {
|
|
19
|
+
const [digit, setDigit] = useState(0);
|
|
20
|
+
return <ParticleScatter value={digit} size={64} />;
|
|
21
|
+
}
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## Props
|
|
25
|
+
|
|
26
|
+
| Prop | Type | Description |
|
|
27
|
+
|------|------|-------------|
|
|
28
|
+
| `value` | `number` | Digit to display (0–9) |
|
|
29
|
+
| `size` | `number` | Width in pixels. Height is automatically 1.5× width. |
|
|
30
|
+
|
|
31
|
+
## Peer Dependencies
|
|
32
|
+
|
|
33
|
+
- `react` >=18
|
|
34
|
+
- `react-dom` >=18
|
|
35
|
+
- `framer-motion` >=10
|
|
36
|
+
|
|
37
|
+
No Tailwind CSS required.
|
|
38
|
+
|
|
39
|
+
## License
|
|
40
|
+
|
|
41
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@raex-ui/particle-scatter",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Firefly dots scatter and reform into digits using spring physics. Animated digit transition component for React.",
|
|
5
5
|
"main": "dist/index.cjs",
|
|
6
6
|
"module": "dist/index.js",
|