@canvasengine/presets 2.0.0-beta.2 → 2.0.0-beta.21

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.
@@ -0,0 +1,112 @@
1
+ import * as canvasengine from 'canvasengine';
2
+
3
+ interface BarProps {
4
+ backgroundColor?: string;
5
+ foregroundColor?: string;
6
+ value: number;
7
+ maxValue: number;
8
+ width: number;
9
+ height: number;
10
+ border?: any;
11
+ innerMargin?: number;
12
+ borderRadius?: number;
13
+ }
14
+ declare function Bar(opts: BarProps): canvasengine.Element<canvasengine.ComponentInstance>;
15
+
16
+ declare function Particle(options: any): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
17
+
18
+ declare function LightSpot(opts: any): canvasengine.Element<canvasengine.ComponentInstance>;
19
+ declare function NightAmbiant(props: any): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
20
+
21
+ interface JoystickChangeEvent {
22
+ angle: number;
23
+ direction: Direction;
24
+ power: number;
25
+ }
26
+ declare enum Direction {
27
+ LEFT = "left",
28
+ TOP = "top",
29
+ BOTTOM = "bottom",
30
+ RIGHT = "right",
31
+ TOP_LEFT = "top_left",
32
+ TOP_RIGHT = "top_right",
33
+ BOTTOM_LEFT = "bottom_left",
34
+ BOTTOM_RIGHT = "bottom_right"
35
+ }
36
+ interface JoystickSettings {
37
+ outer?: string;
38
+ inner?: string;
39
+ outerScale?: {
40
+ x: number;
41
+ y: number;
42
+ };
43
+ innerScale?: {
44
+ x: number;
45
+ y: number;
46
+ };
47
+ onChange?: (data: JoystickChangeEvent) => void;
48
+ onStart?: () => void;
49
+ onEnd?: () => void;
50
+ }
51
+ declare function Joystick(opts?: JoystickSettings): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
52
+
53
+ declare function TiledMap(props: any): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
54
+
55
+ /**
56
+ * Weather Effect Component
57
+ *
58
+ * Creates a realistic rain effect using WebGL shaders with customizable parameters.
59
+ * The effect simulates raindrops falling with wind influence, density control, and speed adjustment.
60
+ *
61
+ * ## Design
62
+ *
63
+ * The component uses a fragment shader to generate procedural rain drops with:
64
+ * - **Procedural generation**: Each raindrop is generated using hash functions for randomness
65
+ * - **Wind simulation**: Raindrops are affected by wind direction and strength as they fall
66
+ * - **Density control**: Number of visible raindrops can be adjusted
67
+ * - **Speed variation**: Each drop has slightly different falling speed for realism
68
+ * - **Visual styling**: Zelda-inspired rain appearance with proper fade effects
69
+ *
70
+ * @param {Object} options - Configuration options for the weather effect
71
+ * @param {number} [options.speed=0.5] - Rain falling speed (0.1 = slow, 2.0 = fast)
72
+ * @param {number} [options.windDirection=0.0] - Wind direction (-1.0 = left, 1.0 = right)
73
+ * @param {number} [options.windStrength=0.2] - Wind strength (0.0 = no wind, 1.0 = strong)
74
+ * @param {number} [options.density=180.0] - Rain density (number of raindrops, 50-400)
75
+ * @param {Array<number>} [options.resolution=[1000, 1000]] - Screen resolution for proper scaling
76
+ *
77
+ * @example
78
+ * ```jsx
79
+ * // Basic usage with default settings
80
+ * <Weather />
81
+ *
82
+ * // Customized heavy rain with strong wind
83
+ * <Weather
84
+ * speed={1.5}
85
+ * windDirection={0.8}
86
+ * windStrength={0.6}
87
+ * density={300}
88
+ * />
89
+ *
90
+ * // Light drizzle
91
+ * <Weather
92
+ * speed={0.2}
93
+ * density={80}
94
+ * windStrength={0.1}
95
+ * />
96
+ *
97
+ * // Using signals for dynamic control
98
+ * const rainSpeed = signal(0.5);
99
+ * const windDir = signal(0.0);
100
+ *
101
+ * <Weather
102
+ * speed={rainSpeed}
103
+ * windDirection={windDir}
104
+ * />
105
+ * ```
106
+ *
107
+ * @returns {JSX.Element} A mesh component with the weather shader effect
108
+ */
109
+ declare const WeatherEffect: (options: any) => canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
110
+ declare const Weather: (options: any) => canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
111
+
112
+ export { Bar, Direction, Joystick, type JoystickChangeEvent, type JoystickSettings, LightSpot, NightAmbiant, Particle, TiledMap, Weather, WeatherEffect };