own-the-canvas 1.0.7 → 1.0.8

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 CHANGED
@@ -54,14 +54,14 @@ All components accept a `preset` prop for instant themed defaults — override a
54
54
 
55
55
  ### DragonCursor
56
56
 
57
- A sinuous dragon body that trails your cursor in real time. Segments, wings, optional fire breath — all configurable.
57
+ A sinuous dragon body that trails your cursor in real time. Segments, wings, optional fire breath, and a background star field with optional per-star glow halos — all configurable.
58
58
 
59
59
  **Presets:** `default · emerald · inferno · void · ice`
60
60
 
61
61
  ```tsx
62
62
  import { DragonCursor } from "own-the-canvas";
63
63
 
64
- <DragonCursor preset="inferno" segmentCount={24} showFire wingSpan={70} />
64
+ <DragonCursor preset="inferno" segmentCount={24} showFire wingSpan={70} starCount={80} glowingStars />
65
65
  ```
66
66
 
67
67
  | Prop | Type | Default | Description |
@@ -71,6 +71,10 @@ import { DragonCursor } from "own-the-canvas";
71
71
  | `wingSpan` | `number` | `60` | Wing span in px |
72
72
  | `showFire` | `boolean` | `false` | Enable fire breath |
73
73
  | `followSpeed` | `number` | `0.15` | Cursor follow lerp speed |
74
+ | `starCount` | `number` | `60` | Number of background stars |
75
+ | `starColor` | `string` | `"#ffffff"` | Star color |
76
+ | `glowingStars` | `boolean` | `false` | Layered halo glow on ~28% of stars |
77
+ | `starGlowBlur` | `number` | `8` | Glow blur radius for glowing stars |
74
78
 
75
79
  ---
76
80
 
@@ -221,14 +225,14 @@ import { BubbleUniverse } from "own-the-canvas";
221
225
 
222
226
  ### Rain
223
227
 
224
- Falling rain streaks with sinusoidal wind drift and splash particles on ground impact. Great as a layered overlay.
228
+ Falling rain streaks with sinusoidal wind drift, splash particles on ground impact, and a background star field with optional glow halos. Great as a layered overlay.
225
229
 
226
230
  **Presets:** `default · storm · drizzle · neon · golden`
227
231
 
228
232
  ```tsx
229
233
  import { Rain } from "own-the-canvas";
230
234
 
231
- <Rain preset="storm" dropCount={400} wind={0.6} showSplashes />
235
+ <Rain preset="storm" dropCount={400} wind={0.6} showSplashes starCount={60} glowingStars />
232
236
  ```
233
237
 
234
238
  | Prop | Type | Default | Description |
@@ -238,6 +242,10 @@ import { Rain } from "own-the-canvas";
238
242
  | `wind` | `number` | `0.3` | Horizontal wind drift |
239
243
  | `dropColor` | `string` | `"#000000"` | Drop stroke color |
240
244
  | `showSplashes` | `boolean` | `true` | Splash particles on impact |
245
+ | `starCount` | `number` | `60` | Number of background stars |
246
+ | `starColor` | `string` | `"#ffffff"` | Star color |
247
+ | `glowingStars` | `boolean` | `false` | Layered halo glow on ~28% of stars |
248
+ | `starGlowBlur` | `number` | `8` | Glow blur radius for glowing stars |
241
249
 
242
250
  ---
243
251
 
@@ -24,6 +24,14 @@ export interface BlackHoleProps extends BaseCanvasProps {
24
24
  speed?: number;
25
25
  /** Cursor shifts the singularity position (default: true) */
26
26
  interactive?: boolean;
27
+ /** Number of background stars (default: 0) */
28
+ starCount?: number;
29
+ /** Star color (default: "#ffffff") */
30
+ starColor?: string;
31
+ /** Enable glow on some stars (default: false) */
32
+ glowingStars?: boolean;
33
+ /** Glow blur radius for glowing stars (default: 8) */
34
+ starGlowBlur?: number;
27
35
  /** Named preset */
28
36
  preset?: BlackHolePreset | string;
29
37
  }
@@ -12,5 +12,9 @@ export interface UseBlackHoleOptions {
12
12
  lensing: boolean;
13
13
  speed: number;
14
14
  interactive: boolean;
15
+ starCount: number;
16
+ starColor: string;
17
+ glowingStars: boolean;
18
+ starGlowBlur: number;
15
19
  }
16
20
  export declare function useBlackHole(canvasRef: RefObject<HTMLCanvasElement | null>, options: UseBlackHoleOptions): void;
@@ -22,6 +22,14 @@ export interface DragonCursorProps extends BaseCanvasProps {
22
22
  showFire?: boolean;
23
23
  /** Dragon follows cursor (default: true) */
24
24
  interactive?: boolean;
25
+ /** Number of background stars (default: 0) */
26
+ starCount?: number;
27
+ /** Star color (default: "#ffffff") */
28
+ starColor?: string;
29
+ /** Enable glow on some stars (default: false) */
30
+ glowingStars?: boolean;
31
+ /** Glow blur radius for glowing stars (default: 8) */
32
+ starGlowBlur?: number;
25
33
  /** Named preset */
26
34
  preset?: DragonCursorPreset | string;
27
35
  }
@@ -11,5 +11,9 @@ export interface UseDragonCursorOptions {
11
11
  wingSpan: number;
12
12
  showFire: boolean;
13
13
  interactive: boolean;
14
+ starCount: number;
15
+ starColor: string;
16
+ glowingStars: boolean;
17
+ starGlowBlur: number;
14
18
  }
15
19
  export declare function useDragonCursor(canvasRef: RefObject<HTMLCanvasElement | null>, options: UseDragonCursorOptions): void;
@@ -30,6 +30,14 @@ export interface FireworksProps extends BaseCanvasProps {
30
30
  backgroundColor?: string;
31
31
  /** Shell upward speed (default: 12) */
32
32
  shellSpeed?: number;
33
+ /** Number of background stars (default: 0) */
34
+ starCount?: number;
35
+ /** Star color (default: "#ffffff") */
36
+ starColor?: string;
37
+ /** Enable glow on some stars (default: false) */
38
+ glowingStars?: boolean;
39
+ /** Glow blur radius for glowing stars (default: 8) */
40
+ starGlowBlur?: number;
33
41
  /** Named preset */
34
42
  preset?: FireworksPreset | string;
35
43
  }
@@ -15,6 +15,10 @@ export interface UseFireworksOptions {
15
15
  glowBlur: number;
16
16
  backgroundColor: string;
17
17
  shellSpeed: number;
18
+ starCount: number;
19
+ starColor: string;
20
+ glowingStars: boolean;
21
+ starGlowBlur: number;
18
22
  }
19
23
  export declare function useFireworks(canvasRef: RefObject<HTMLCanvasElement | null>, options: UseFireworksOptions): {
20
24
  launch: (x?: number) => void;
@@ -33,6 +33,12 @@ export interface FlowFieldProps extends BaseCanvasProps {
33
33
  timeSpeed?: number;
34
34
  /** Add curl noise component for more swirling flow (default: false) */
35
35
  curl?: boolean;
36
+ /** Mouse cursor attracts nearby particles (default: false) */
37
+ interactive?: boolean;
38
+ /** Radius in px around cursor that attracts particles (default: 100) */
39
+ attractRadius?: number;
40
+ /** Attraction force strength (default: 3) */
41
+ attractStrength?: number;
36
42
  /** Named preset: "default" | "neon" | "ocean" | "lava" | "forest" | "monochrome" */
37
43
  preset?: FlowFieldPreset | string;
38
44
  }
@@ -12,5 +12,8 @@ export interface UseFlowFieldOptions {
12
12
  animated: boolean;
13
13
  timeSpeed: number;
14
14
  curl: boolean;
15
+ interactive: boolean;
16
+ attractRadius: number;
17
+ attractStrength: number;
15
18
  }
16
19
  export declare function useFlowField(canvasRef: RefObject<HTMLCanvasElement | null>, options: UseFlowFieldOptions): void;
@@ -24,6 +24,14 @@ export interface RainProps extends BaseCanvasProps {
24
24
  showSplashes?: boolean;
25
25
  /** Canvas background color. (default: "#ffffff") */
26
26
  backgroundColor?: string;
27
+ /** Number of background stars (default: 0) */
28
+ starCount?: number;
29
+ /** Star color (default: "#ffffff") */
30
+ starColor?: string;
31
+ /** Enable glow on some stars (default: false) */
32
+ glowingStars?: boolean;
33
+ /** Glow blur radius for glowing stars (default: 8) */
34
+ starGlowBlur?: number;
27
35
  /** Named preset. */
28
36
  preset?: RainPreset | string;
29
37
  }
@@ -12,5 +12,9 @@ export interface UseRainOptions {
12
12
  splashColor: string;
13
13
  showSplashes: boolean;
14
14
  backgroundColor: string;
15
+ starCount: number;
16
+ starColor: string;
17
+ glowingStars: boolean;
18
+ starGlowBlur: number;
15
19
  }
16
20
  export declare function useRain(canvasRef: RefObject<HTMLCanvasElement | null>, options: UseRainOptions): void;