use-scroll-animate 8.0.0 → 8.1.0
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/CHANGELOG.md +15 -0
- package/dist/components/fx-festival.cjs +121 -0
- package/dist/components/fx-festival.cjs.map +1 -0
- package/dist/components/fx-festival.d.cts +69 -0
- package/dist/components/fx-festival.d.ts +69 -0
- package/dist/components/fx-festival.js +117 -0
- package/dist/components/fx-festival.js.map +1 -0
- package/dist/components/fx2.cjs +6 -0
- package/dist/components/fx2.cjs.map +1 -1
- package/dist/components/fx2.d.cts +26 -1
- package/dist/components/fx2.d.ts +26 -1
- package/dist/components/fx2.js +5 -1
- package/dist/components/fx2.js.map +1 -1
- package/dist/components/widgets.cjs +265 -143
- package/dist/components/widgets.cjs.map +1 -1
- package/dist/components/widgets.d.cts +37 -2
- package/dist/components/widgets.d.ts +37 -2
- package/dist/components/widgets.js +263 -144
- package/dist/components/widgets.js.map +1 -1
- package/dist/widgets.umd.js +1 -1
- package/dist/widgets.umd.js.map +1 -1
- package/docs/ROADMAP.md +1 -1
- package/docs/components.md +19 -0
- package/package.json +21 -1
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [8.1.0] - 2026-10-08
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
- **2 new components (8.1)** in `motionary/components/widgets` (also in `dist/widgets.umd.js`):
|
|
14
|
+
- `<usa-red-envelope>` — Lunar New Year red envelope (红包): tap / Enter / Space → the flap swings open, the card slides out with `amount` counting up (`currency`, default ¥) and gold coins pop out; `message` (恭喜发财), `from`, `opened`; `open()`, `close()`, `opened`; `usa:open` { amount }.
|
|
15
|
+
- `<usa-festival-banner theme="lunar | xmas | halloween | fireworks">` — announcement banner with an ambient festive scene behind its text (lanterns + sparkles, lights + snow, bats + moon, rockets), animating only while on screen; `dismissible` → close button (`usa:dismiss`), `label`; `FESTIVAL_THEMES`.
|
|
16
|
+
- **Festival packs — `motionary/fx/festival`** (= `motionary/components/fx-festival`, `registerFestivalPack()`, also in `registerEffectPacks()`): `firework-burst` (attention), `lantern-rise` (enter), `xmas-snow` (loop), `spooky-float` (attention). `sparkVectors()`.
|
|
17
|
+
- Showcase: 4 new gallery cards with copyable code, live demos and live Store thumbnails; Animation Store 335 → 339 items.
|
|
18
|
+
|
|
19
|
+
### Fixed
|
|
20
|
+
- Store live thumbnails (`showcase/thumb.js`): the CDN fallback still pointed at `motionary@7` after 8.0 → `motionary@8`.
|
|
21
|
+
|
|
22
|
+
### Accessibility
|
|
23
|
+
- Red envelope is a real `<button aria-expanded>` with a descriptive label; the amount is announced through a polite live region. Banner: labelled `region`, decorations `aria-hidden`, real dismiss button. Reduced motion: envelope opens without swing / slide / count / coins, the banner scene is static, `firework-burst` / `spooky-float` do nothing, `xmas-snow` is skipped, `lantern-rise` fades in.
|
|
24
|
+
|
|
10
25
|
## [8.0.0] - 2026-10-08
|
|
11
26
|
|
|
12
27
|
### ⚠️ Breaking
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var registry = require('../chunks/registry-BVklOepd.cjs');
|
|
4
|
+
require('../chunks/base-DoRUZBy-.cjs');
|
|
5
|
+
|
|
6
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
7
|
+
function sparkVectors(n, radius, seed = 1) {
|
|
8
|
+
let s = seed;
|
|
9
|
+
const rnd = () => ((s = (s * 9301 + 49297) % 233280) / 233280);
|
|
10
|
+
return Array.from({ length: n }, (_, i) => {
|
|
11
|
+
const a = (i / n) * Math.PI * 2 + (rnd() - 0.5) * 0.3;
|
|
12
|
+
const r = radius * (0.7 + rnd() * 0.3);
|
|
13
|
+
return { x: Math.round(Math.cos(a) * r), y: Math.round(Math.sin(a) * r) };
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
const layer = (el, ctx) => {
|
|
17
|
+
if (getComputedStyle(el).position === 'static') {
|
|
18
|
+
const prev = el.style.position;
|
|
19
|
+
el.style.position = 'relative';
|
|
20
|
+
ctx.onCleanup(() => (el.style.position = prev));
|
|
21
|
+
}
|
|
22
|
+
const l = document.createElement('span');
|
|
23
|
+
l.setAttribute('aria-hidden', 'true');
|
|
24
|
+
Object.assign(l.style, { position: 'absolute', inset: '0', pointerEvents: 'none', overflow: 'visible' });
|
|
25
|
+
el.appendChild(l);
|
|
26
|
+
ctx.onCleanup(() => l.remove());
|
|
27
|
+
return l;
|
|
28
|
+
};
|
|
29
|
+
const dot = (parent, css, text = '') => {
|
|
30
|
+
const d = document.createElement('span');
|
|
31
|
+
d.textContent = text;
|
|
32
|
+
Object.assign(d.style, { position: 'absolute', left: '50%', top: '50%', ...css });
|
|
33
|
+
parent.appendChild(d);
|
|
34
|
+
return d;
|
|
35
|
+
};
|
|
36
|
+
const FESTIVAL_FX = [
|
|
37
|
+
{
|
|
38
|
+
name: 'firework-burst',
|
|
39
|
+
kind: 'attention',
|
|
40
|
+
description: 'Rockets of sparks burst out of the element in festive colours (`bursts`, `colors`).',
|
|
41
|
+
defaults: { bursts: 3, colors: '#f43f5e,#f59e0b,#22d3ee,#a855f7,#facc15', duration: 900 },
|
|
42
|
+
run: (el, o, ctx) => {
|
|
43
|
+
if (ctx.reduced)
|
|
44
|
+
return;
|
|
45
|
+
const l = layer(el, ctx);
|
|
46
|
+
const colors = String(o.colors).split(',');
|
|
47
|
+
const r = el.getBoundingClientRect();
|
|
48
|
+
const runs = [];
|
|
49
|
+
const n = Math.max(1, Math.min(6, Number(o.bursts) || 3));
|
|
50
|
+
for (let b = 0; b < n; b++) {
|
|
51
|
+
const cx = (b - (n - 1) / 2) * Math.min(60, (r.width || 120) / n);
|
|
52
|
+
const cy = -((r.height || 60) * 0.25) - (b % 2) * 18;
|
|
53
|
+
const col = colors[b % colors.length];
|
|
54
|
+
sparkVectors(14, 46 + b * 6, b + 3).forEach((v) => {
|
|
55
|
+
const s = dot(l, { width: '5px', height: '5px', marginLeft: '-2.5px', marginTop: '-2.5px', borderRadius: '50%', background: col, boxShadow: `0 0 6px ${col}` });
|
|
56
|
+
const a = ctx.animate(s, [{ transform: `translate(${cx}px,${cy + 40}px) scale(.4)`, opacity: 0 }, { transform: `translate(${cx}px,${cy}px) scale(1)`, opacity: 1, offset: 0.25 }, { transform: `translate(${cx + v.x}px,${cy + v.y + 18}px) scale(.3)`, opacity: 0 }], { duration: o.duration, delay: b * 220, easing: 'cubic-bezier(.2,.7,.3,1)', fill: 'backwards' });
|
|
57
|
+
runs.push(a ? a.finished.then(() => s.remove(), () => s.remove()) : Promise.resolve(s.remove()));
|
|
58
|
+
});
|
|
59
|
+
}
|
|
60
|
+
return Promise.all(runs).then(() => l.remove());
|
|
61
|
+
},
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
name: 'lantern-rise',
|
|
65
|
+
kind: 'enter',
|
|
66
|
+
description: 'The element floats up and sways in like a Lunar New Year lantern (`sway` degrees).',
|
|
67
|
+
defaults: { sway: 8, duration: 1400 },
|
|
68
|
+
run: (el, o, ctx) => {
|
|
69
|
+
if (ctx.reduced)
|
|
70
|
+
return ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);
|
|
71
|
+
const w = Number(o.sway) || 8;
|
|
72
|
+
return ctx
|
|
73
|
+
.animate(el, [{ transform: `translateY(60px) rotate(${-w}deg)`, opacity: 0, transformOrigin: '50% 0' }, { transform: `translateY(-6px) rotate(${w * 0.6}deg)`, opacity: 1, offset: 0.55, transformOrigin: '50% 0' }, { transform: `translateY(0) rotate(${-w * 0.3}deg)`, offset: 0.8, transformOrigin: '50% 0' }, { transform: 'none', opacity: 1, transformOrigin: '50% 0' }], { duration: o.duration, easing: 'ease-out', fill: 'backwards' })
|
|
74
|
+
?.finished.catch(() => undefined);
|
|
75
|
+
},
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
name: 'xmas-snow',
|
|
79
|
+
kind: 'loop',
|
|
80
|
+
description: 'Snowflakes drift down over the element until the cleanup runs (`flakes`).',
|
|
81
|
+
defaults: { flakes: 18, duration: 4000 },
|
|
82
|
+
run: (el, o, ctx) => {
|
|
83
|
+
const l = layer(el, ctx);
|
|
84
|
+
l.style.overflow = 'hidden';
|
|
85
|
+
const n = Math.max(4, Math.min(60, Number(o.flakes) || 18));
|
|
86
|
+
const anims = Array.from({ length: n }, (_, i) => {
|
|
87
|
+
const x = (i * 37) % 100;
|
|
88
|
+
const size = 8 + ((i * 7) % 9);
|
|
89
|
+
const f = dot(l, { left: `${x}%`, top: '-14px', fontSize: `${size}px`, color: '#fff', textShadow: '0 0 3px rgba(148,163,184,.9)', lineHeight: '1' }, '❄');
|
|
90
|
+
const drift = ((i % 5) - 2) * 12;
|
|
91
|
+
return ctx.animate(f, [{ transform: 'translate(0,0) rotate(0)' }, { transform: `translate(${drift}px, calc(${el.clientHeight || 160}px + 20px)) rotate(180deg)` }], { duration: o.duration * (0.7 + ((i * 13) % 6) / 10), delay: -((i * 331) % o.duration), iterations: Infinity, easing: 'linear' });
|
|
92
|
+
});
|
|
93
|
+
return () => {
|
|
94
|
+
anims.forEach((a) => a?.cancel());
|
|
95
|
+
l.remove();
|
|
96
|
+
};
|
|
97
|
+
},
|
|
98
|
+
},
|
|
99
|
+
{
|
|
100
|
+
name: 'spooky-float',
|
|
101
|
+
kind: 'attention',
|
|
102
|
+
description: 'The element wobbles, rises and flickers like a Halloween ghost (`cycles`).',
|
|
103
|
+
defaults: { cycles: 2, duration: 1200 },
|
|
104
|
+
run: (el, o, ctx) => {
|
|
105
|
+
if (ctx.reduced)
|
|
106
|
+
return;
|
|
107
|
+
return ctx
|
|
108
|
+
.animate(el, [{ transform: 'none', opacity: 1 }, { transform: 'translate(-4px,-10px) rotate(-4deg) skewX(3deg)', opacity: 0.55, offset: 0.3 }, { transform: 'translate(4px,-14px) rotate(4deg) skewX(-3deg)', opacity: 0.85, offset: 0.65 }, { transform: 'none', opacity: 1 }], { duration: o.duration, iterations: Math.max(1, Math.min(6, Number(o.cycles) || 2)), easing: 'ease-in-out' })
|
|
109
|
+
?.finished.catch(() => undefined);
|
|
110
|
+
},
|
|
111
|
+
},
|
|
112
|
+
];
|
|
113
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
114
|
+
function registerFestivalPack() {
|
|
115
|
+
registry.registerEffects(FESTIVAL_FX);
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
exports.FESTIVAL_FX = FESTIVAL_FX;
|
|
119
|
+
exports.registerFestivalPack = registerFestivalPack;
|
|
120
|
+
exports.sparkVectors = sparkVectors;
|
|
121
|
+
//# sourceMappingURL=fx-festival.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fx-festival.cjs","sources":["../../src/components/fx2/festival.ts"],"sourcesContent":["/**\n * 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):\n *\n * - `firework-burst` (attention) — rockets of sparks burst out of the element\n * in festive colours (`bursts`, `colors`).\n * - `lantern-rise` (enter) — the element floats up and sways in like a\n * Lunar New Year lantern (`sway`).\n * - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup\n * stops them (`flakes`).\n * - `spooky-float` (attention) — the element wobbles and fades like a\n * Halloween ghost (`cycles`).\n *\n * Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is\n * skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.\n */\nimport type { EffectContext, EffectDefinition } from '../fx/registry';\nimport { registerEffects } from '../fx/registry';\n\n/** Evenly spread spark directions with a little jitter (8.1). */\nexport function sparkVectors(n: number, radius: number, seed = 1): { x: number; y: number }[] {\n let s = seed;\n const rnd = () => ((s = (s * 9301 + 49297) % 233280) / 233280);\n return Array.from({ length: n }, (_, i) => {\n const a = (i / n) * Math.PI * 2 + (rnd() - 0.5) * 0.3;\n const r = radius * (0.7 + rnd() * 0.3);\n return { x: Math.round(Math.cos(a) * r), y: Math.round(Math.sin(a) * r) };\n });\n}\n\nconst layer = (el: HTMLElement, ctx: EffectContext) => {\n if (getComputedStyle(el).position === 'static') {\n const prev = el.style.position;\n el.style.position = 'relative';\n ctx.onCleanup(() => (el.style.position = prev));\n }\n const l = document.createElement('span');\n l.setAttribute('aria-hidden', 'true');\n Object.assign(l.style, { position: 'absolute', inset: '0', pointerEvents: 'none', overflow: 'visible' });\n el.appendChild(l);\n ctx.onCleanup(() => l.remove());\n return l;\n};\nconst dot = (parent: HTMLElement, css: Partial<CSSStyleDeclaration>, text = '') => {\n const d = document.createElement('span');\n d.textContent = text;\n Object.assign(d.style, { position: 'absolute', left: '50%', top: '50%', ...css });\n parent.appendChild(d);\n return d;\n};\n\nexport const FESTIVAL_FX: EffectDefinition[] = [\n {\n name: 'firework-burst',\n kind: 'attention',\n description: 'Rockets of sparks burst out of the element in festive colours (`bursts`, `colors`).',\n defaults: { bursts: 3, colors: '#f43f5e,#f59e0b,#22d3ee,#a855f7,#facc15', duration: 900 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n const l = layer(el, ctx);\n const colors = String(o.colors).split(',');\n const r = el.getBoundingClientRect();\n const runs: Promise<unknown>[] = [];\n const n = Math.max(1, Math.min(6, Number(o.bursts) || 3));\n for (let b = 0; b < n; b++) {\n const cx = (b - (n - 1) / 2) * Math.min(60, (r.width || 120) / n);\n const cy = -((r.height || 60) * 0.25) - (b % 2) * 18;\n const col = colors[b % colors.length];\n sparkVectors(14, 46 + b * 6, b + 3).forEach((v) => {\n const s = dot(l, { width: '5px', height: '5px', marginLeft: '-2.5px', marginTop: '-2.5px', borderRadius: '50%', background: col, boxShadow: `0 0 6px ${col}` });\n const a = ctx.animate(s, [{ transform: `translate(${cx}px,${cy + 40}px) scale(.4)`, opacity: 0 }, { transform: `translate(${cx}px,${cy}px) scale(1)`, opacity: 1, offset: 0.25 }, { transform: `translate(${cx + v.x}px,${cy + v.y + 18}px) scale(.3)`, opacity: 0 }], { duration: o.duration, delay: b * 220, easing: 'cubic-bezier(.2,.7,.3,1)', fill: 'backwards' });\n runs.push(a ? a.finished.then(() => s.remove(), () => s.remove()) : Promise.resolve(s.remove()));\n });\n }\n return Promise.all(runs).then(() => l.remove());\n },\n },\n {\n name: 'lantern-rise',\n kind: 'enter',\n description: 'The element floats up and sways in like a Lunar New Year lantern (`sway` degrees).',\n defaults: { sway: 8, duration: 1400 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);\n const w = Number(o.sway) || 8;\n return ctx\n .animate(el, [{ transform: `translateY(60px) rotate(${-w}deg)`, opacity: 0, transformOrigin: '50% 0' }, { transform: `translateY(-6px) rotate(${w * 0.6}deg)`, opacity: 1, offset: 0.55, transformOrigin: '50% 0' }, { transform: `translateY(0) rotate(${-w * 0.3}deg)`, offset: 0.8, transformOrigin: '50% 0' }, { transform: 'none', opacity: 1, transformOrigin: '50% 0' }], { duration: o.duration, easing: 'ease-out', fill: 'backwards' })\n ?.finished.catch(() => undefined);\n },\n },\n {\n name: 'xmas-snow',\n kind: 'loop',\n description: 'Snowflakes drift down over the element until the cleanup runs (`flakes`).',\n defaults: { flakes: 18, duration: 4000 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n const l = layer(el, ctx);\n l.style.overflow = 'hidden';\n const n = Math.max(4, Math.min(60, Number(o.flakes) || 18));\n const anims = Array.from({ length: n }, (_, i) => {\n const x = (i * 37) % 100;\n const size = 8 + ((i * 7) % 9);\n const f = dot(l, { left: `${x}%`, top: '-14px', fontSize: `${size}px`, color: '#fff', textShadow: '0 0 3px rgba(148,163,184,.9)', lineHeight: '1' }, '❄');\n const drift = ((i % 5) - 2) * 12;\n return ctx.animate(f, [{ transform: 'translate(0,0) rotate(0)' }, { transform: `translate(${drift}px, calc(${el.clientHeight || 160}px + 20px)) rotate(180deg)` }], { duration: o.duration * (0.7 + ((i * 13) % 6) / 10), delay: -((i * 331) % o.duration), iterations: Infinity, easing: 'linear' });\n });\n return () => {\n anims.forEach((a) => a?.cancel());\n l.remove();\n };\n },\n },\n {\n name: 'spooky-float',\n kind: 'attention',\n description: 'The element wobbles, rises and flickers like a Halloween ghost (`cycles`).',\n defaults: { cycles: 2, duration: 1200 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n return ctx\n .animate(el, [{ transform: 'none', opacity: 1 }, { transform: 'translate(-4px,-10px) rotate(-4deg) skewX(3deg)', opacity: 0.55, offset: 0.3 }, { transform: 'translate(4px,-14px) rotate(4deg) skewX(-3deg)', opacity: 0.85, offset: 0.65 }, { transform: 'none', opacity: 1 }], { duration: o.duration, iterations: Math.max(1, Math.min(6, Number(o.cycles) || 2)), easing: 'ease-in-out' })\n ?.finished.catch(() => undefined);\n },\n },\n];\n\n/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */\nexport function registerFestivalPack(): void {\n registerEffects(FESTIVAL_FX);\n}\n"],"names":["registerEffects"],"mappings":"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"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
type MotionSensitivity = 'full' | 'gentle' | 'minimal' | 'static';
|
|
2
|
+
type Cleanup = () => void;
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* 5.0 — unified plugin-style effect registration. Every effect (built-in or
|
|
6
|
+
* yours) is a plain object registered once and played the same way:
|
|
7
|
+
* `playEffect(el, name)`, `bindEffect(el, name, { trigger })` or
|
|
8
|
+
* `<usa-fx effect="name" trigger="click">`. Effects get a context that
|
|
9
|
+
* already applies reduced motion, motion sensitivity, intensity and the
|
|
10
|
+
* animation budget.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
declare const EFFECT_KINDS: readonly ["enter", "exit", "attention", "click", "hover", "card", "loop", "page", "background", "text", "cursor", "scroll"];
|
|
14
|
+
type EffectKind = (typeof EFFECT_KINDS)[number];
|
|
15
|
+
interface EffectContext {
|
|
16
|
+
/** Reduced motion applies (OS setting, `minimal` / `static` sensitivity). */
|
|
17
|
+
readonly reduced: boolean;
|
|
18
|
+
readonly sensitivity: MotionSensitivity;
|
|
19
|
+
/** The triggering event (pointer position for click effects), if any. */
|
|
20
|
+
readonly event?: Event;
|
|
21
|
+
/** `el.animate()` with the library's motion rules (may return `null`). */
|
|
22
|
+
animate(el: Element, keyframes: Keyframe[], options: KeyframeAnimationOptions): Animation | null;
|
|
23
|
+
/** Register teardown for long-running effects (loops, listeners). */
|
|
24
|
+
onCleanup(fn: Cleanup): void;
|
|
25
|
+
}
|
|
26
|
+
interface EffectDefinition<O extends Record<string, unknown> = Record<string, any>> {
|
|
27
|
+
/** Unique, kebab-case. */
|
|
28
|
+
name: string;
|
|
29
|
+
kind: EffectKind;
|
|
30
|
+
/** One line for docs and the gallery. */
|
|
31
|
+
description?: string;
|
|
32
|
+
/** Option defaults (merged under the caller's options). */
|
|
33
|
+
defaults?: Partial<O>;
|
|
34
|
+
/**
|
|
35
|
+
* Under reduced motion: `'skip'` (do nothing — default for loop, background
|
|
36
|
+
* and cursor effects) or `'run'` (run with `ctx.reduced === true`, the
|
|
37
|
+
* effect degrades itself — default for everything else).
|
|
38
|
+
*/
|
|
39
|
+
reduced?: 'skip' | 'run';
|
|
40
|
+
/** Play the effect. Return an Animation / Promise to be awaited, or a cleanup. */
|
|
41
|
+
run(el: HTMLElement, options: O, ctx: EffectContext): void | Cleanup | Animation | null | Promise<unknown>;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):
|
|
46
|
+
*
|
|
47
|
+
* - `firework-burst` (attention) — rockets of sparks burst out of the element
|
|
48
|
+
* in festive colours (`bursts`, `colors`).
|
|
49
|
+
* - `lantern-rise` (enter) — the element floats up and sways in like a
|
|
50
|
+
* Lunar New Year lantern (`sway`).
|
|
51
|
+
* - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup
|
|
52
|
+
* stops them (`flakes`).
|
|
53
|
+
* - `spooky-float` (attention) — the element wobbles and fades like a
|
|
54
|
+
* Halloween ghost (`cycles`).
|
|
55
|
+
*
|
|
56
|
+
* Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is
|
|
57
|
+
* skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.
|
|
58
|
+
*/
|
|
59
|
+
|
|
60
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
61
|
+
declare function sparkVectors(n: number, radius: number, seed?: number): {
|
|
62
|
+
x: number;
|
|
63
|
+
y: number;
|
|
64
|
+
}[];
|
|
65
|
+
declare const FESTIVAL_FX: EffectDefinition[];
|
|
66
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
67
|
+
declare function registerFestivalPack(): void;
|
|
68
|
+
|
|
69
|
+
export { FESTIVAL_FX, registerFestivalPack, sparkVectors };
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
type MotionSensitivity = 'full' | 'gentle' | 'minimal' | 'static';
|
|
2
|
+
type Cleanup = () => void;
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* 5.0 — unified plugin-style effect registration. Every effect (built-in or
|
|
6
|
+
* yours) is a plain object registered once and played the same way:
|
|
7
|
+
* `playEffect(el, name)`, `bindEffect(el, name, { trigger })` or
|
|
8
|
+
* `<usa-fx effect="name" trigger="click">`. Effects get a context that
|
|
9
|
+
* already applies reduced motion, motion sensitivity, intensity and the
|
|
10
|
+
* animation budget.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
declare const EFFECT_KINDS: readonly ["enter", "exit", "attention", "click", "hover", "card", "loop", "page", "background", "text", "cursor", "scroll"];
|
|
14
|
+
type EffectKind = (typeof EFFECT_KINDS)[number];
|
|
15
|
+
interface EffectContext {
|
|
16
|
+
/** Reduced motion applies (OS setting, `minimal` / `static` sensitivity). */
|
|
17
|
+
readonly reduced: boolean;
|
|
18
|
+
readonly sensitivity: MotionSensitivity;
|
|
19
|
+
/** The triggering event (pointer position for click effects), if any. */
|
|
20
|
+
readonly event?: Event;
|
|
21
|
+
/** `el.animate()` with the library's motion rules (may return `null`). */
|
|
22
|
+
animate(el: Element, keyframes: Keyframe[], options: KeyframeAnimationOptions): Animation | null;
|
|
23
|
+
/** Register teardown for long-running effects (loops, listeners). */
|
|
24
|
+
onCleanup(fn: Cleanup): void;
|
|
25
|
+
}
|
|
26
|
+
interface EffectDefinition<O extends Record<string, unknown> = Record<string, any>> {
|
|
27
|
+
/** Unique, kebab-case. */
|
|
28
|
+
name: string;
|
|
29
|
+
kind: EffectKind;
|
|
30
|
+
/** One line for docs and the gallery. */
|
|
31
|
+
description?: string;
|
|
32
|
+
/** Option defaults (merged under the caller's options). */
|
|
33
|
+
defaults?: Partial<O>;
|
|
34
|
+
/**
|
|
35
|
+
* Under reduced motion: `'skip'` (do nothing — default for loop, background
|
|
36
|
+
* and cursor effects) or `'run'` (run with `ctx.reduced === true`, the
|
|
37
|
+
* effect degrades itself — default for everything else).
|
|
38
|
+
*/
|
|
39
|
+
reduced?: 'skip' | 'run';
|
|
40
|
+
/** Play the effect. Return an Animation / Promise to be awaited, or a cleanup. */
|
|
41
|
+
run(el: HTMLElement, options: O, ctx: EffectContext): void | Cleanup | Animation | null | Promise<unknown>;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):
|
|
46
|
+
*
|
|
47
|
+
* - `firework-burst` (attention) — rockets of sparks burst out of the element
|
|
48
|
+
* in festive colours (`bursts`, `colors`).
|
|
49
|
+
* - `lantern-rise` (enter) — the element floats up and sways in like a
|
|
50
|
+
* Lunar New Year lantern (`sway`).
|
|
51
|
+
* - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup
|
|
52
|
+
* stops them (`flakes`).
|
|
53
|
+
* - `spooky-float` (attention) — the element wobbles and fades like a
|
|
54
|
+
* Halloween ghost (`cycles`).
|
|
55
|
+
*
|
|
56
|
+
* Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is
|
|
57
|
+
* skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.
|
|
58
|
+
*/
|
|
59
|
+
|
|
60
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
61
|
+
declare function sparkVectors(n: number, radius: number, seed?: number): {
|
|
62
|
+
x: number;
|
|
63
|
+
y: number;
|
|
64
|
+
}[];
|
|
65
|
+
declare const FESTIVAL_FX: EffectDefinition[];
|
|
66
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
67
|
+
declare function registerFestivalPack(): void;
|
|
68
|
+
|
|
69
|
+
export { FESTIVAL_FX, registerFestivalPack, sparkVectors };
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
import { registerEffects } from '../chunks/registry-CnO7ZVPK.js';
|
|
2
|
+
import '../chunks/base-CLuqlLfG.js';
|
|
3
|
+
|
|
4
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
5
|
+
function sparkVectors(n, radius, seed = 1) {
|
|
6
|
+
let s = seed;
|
|
7
|
+
const rnd = () => ((s = (s * 9301 + 49297) % 233280) / 233280);
|
|
8
|
+
return Array.from({ length: n }, (_, i) => {
|
|
9
|
+
const a = (i / n) * Math.PI * 2 + (rnd() - 0.5) * 0.3;
|
|
10
|
+
const r = radius * (0.7 + rnd() * 0.3);
|
|
11
|
+
return { x: Math.round(Math.cos(a) * r), y: Math.round(Math.sin(a) * r) };
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
const layer = (el, ctx) => {
|
|
15
|
+
if (getComputedStyle(el).position === 'static') {
|
|
16
|
+
const prev = el.style.position;
|
|
17
|
+
el.style.position = 'relative';
|
|
18
|
+
ctx.onCleanup(() => (el.style.position = prev));
|
|
19
|
+
}
|
|
20
|
+
const l = document.createElement('span');
|
|
21
|
+
l.setAttribute('aria-hidden', 'true');
|
|
22
|
+
Object.assign(l.style, { position: 'absolute', inset: '0', pointerEvents: 'none', overflow: 'visible' });
|
|
23
|
+
el.appendChild(l);
|
|
24
|
+
ctx.onCleanup(() => l.remove());
|
|
25
|
+
return l;
|
|
26
|
+
};
|
|
27
|
+
const dot = (parent, css, text = '') => {
|
|
28
|
+
const d = document.createElement('span');
|
|
29
|
+
d.textContent = text;
|
|
30
|
+
Object.assign(d.style, { position: 'absolute', left: '50%', top: '50%', ...css });
|
|
31
|
+
parent.appendChild(d);
|
|
32
|
+
return d;
|
|
33
|
+
};
|
|
34
|
+
const FESTIVAL_FX = [
|
|
35
|
+
{
|
|
36
|
+
name: 'firework-burst',
|
|
37
|
+
kind: 'attention',
|
|
38
|
+
description: 'Rockets of sparks burst out of the element in festive colours (`bursts`, `colors`).',
|
|
39
|
+
defaults: { bursts: 3, colors: '#f43f5e,#f59e0b,#22d3ee,#a855f7,#facc15', duration: 900 },
|
|
40
|
+
run: (el, o, ctx) => {
|
|
41
|
+
if (ctx.reduced)
|
|
42
|
+
return;
|
|
43
|
+
const l = layer(el, ctx);
|
|
44
|
+
const colors = String(o.colors).split(',');
|
|
45
|
+
const r = el.getBoundingClientRect();
|
|
46
|
+
const runs = [];
|
|
47
|
+
const n = Math.max(1, Math.min(6, Number(o.bursts) || 3));
|
|
48
|
+
for (let b = 0; b < n; b++) {
|
|
49
|
+
const cx = (b - (n - 1) / 2) * Math.min(60, (r.width || 120) / n);
|
|
50
|
+
const cy = -((r.height || 60) * 0.25) - (b % 2) * 18;
|
|
51
|
+
const col = colors[b % colors.length];
|
|
52
|
+
sparkVectors(14, 46 + b * 6, b + 3).forEach((v) => {
|
|
53
|
+
const s = dot(l, { width: '5px', height: '5px', marginLeft: '-2.5px', marginTop: '-2.5px', borderRadius: '50%', background: col, boxShadow: `0 0 6px ${col}` });
|
|
54
|
+
const a = ctx.animate(s, [{ transform: `translate(${cx}px,${cy + 40}px) scale(.4)`, opacity: 0 }, { transform: `translate(${cx}px,${cy}px) scale(1)`, opacity: 1, offset: 0.25 }, { transform: `translate(${cx + v.x}px,${cy + v.y + 18}px) scale(.3)`, opacity: 0 }], { duration: o.duration, delay: b * 220, easing: 'cubic-bezier(.2,.7,.3,1)', fill: 'backwards' });
|
|
55
|
+
runs.push(a ? a.finished.then(() => s.remove(), () => s.remove()) : Promise.resolve(s.remove()));
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
return Promise.all(runs).then(() => l.remove());
|
|
59
|
+
},
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
name: 'lantern-rise',
|
|
63
|
+
kind: 'enter',
|
|
64
|
+
description: 'The element floats up and sways in like a Lunar New Year lantern (`sway` degrees).',
|
|
65
|
+
defaults: { sway: 8, duration: 1400 },
|
|
66
|
+
run: (el, o, ctx) => {
|
|
67
|
+
if (ctx.reduced)
|
|
68
|
+
return ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);
|
|
69
|
+
const w = Number(o.sway) || 8;
|
|
70
|
+
return ctx
|
|
71
|
+
.animate(el, [{ transform: `translateY(60px) rotate(${-w}deg)`, opacity: 0, transformOrigin: '50% 0' }, { transform: `translateY(-6px) rotate(${w * 0.6}deg)`, opacity: 1, offset: 0.55, transformOrigin: '50% 0' }, { transform: `translateY(0) rotate(${-w * 0.3}deg)`, offset: 0.8, transformOrigin: '50% 0' }, { transform: 'none', opacity: 1, transformOrigin: '50% 0' }], { duration: o.duration, easing: 'ease-out', fill: 'backwards' })
|
|
72
|
+
?.finished.catch(() => undefined);
|
|
73
|
+
},
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
name: 'xmas-snow',
|
|
77
|
+
kind: 'loop',
|
|
78
|
+
description: 'Snowflakes drift down over the element until the cleanup runs (`flakes`).',
|
|
79
|
+
defaults: { flakes: 18, duration: 4000 },
|
|
80
|
+
run: (el, o, ctx) => {
|
|
81
|
+
const l = layer(el, ctx);
|
|
82
|
+
l.style.overflow = 'hidden';
|
|
83
|
+
const n = Math.max(4, Math.min(60, Number(o.flakes) || 18));
|
|
84
|
+
const anims = Array.from({ length: n }, (_, i) => {
|
|
85
|
+
const x = (i * 37) % 100;
|
|
86
|
+
const size = 8 + ((i * 7) % 9);
|
|
87
|
+
const f = dot(l, { left: `${x}%`, top: '-14px', fontSize: `${size}px`, color: '#fff', textShadow: '0 0 3px rgba(148,163,184,.9)', lineHeight: '1' }, '❄');
|
|
88
|
+
const drift = ((i % 5) - 2) * 12;
|
|
89
|
+
return ctx.animate(f, [{ transform: 'translate(0,0) rotate(0)' }, { transform: `translate(${drift}px, calc(${el.clientHeight || 160}px + 20px)) rotate(180deg)` }], { duration: o.duration * (0.7 + ((i * 13) % 6) / 10), delay: -((i * 331) % o.duration), iterations: Infinity, easing: 'linear' });
|
|
90
|
+
});
|
|
91
|
+
return () => {
|
|
92
|
+
anims.forEach((a) => a?.cancel());
|
|
93
|
+
l.remove();
|
|
94
|
+
};
|
|
95
|
+
},
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
name: 'spooky-float',
|
|
99
|
+
kind: 'attention',
|
|
100
|
+
description: 'The element wobbles, rises and flickers like a Halloween ghost (`cycles`).',
|
|
101
|
+
defaults: { cycles: 2, duration: 1200 },
|
|
102
|
+
run: (el, o, ctx) => {
|
|
103
|
+
if (ctx.reduced)
|
|
104
|
+
return;
|
|
105
|
+
return ctx
|
|
106
|
+
.animate(el, [{ transform: 'none', opacity: 1 }, { transform: 'translate(-4px,-10px) rotate(-4deg) skewX(3deg)', opacity: 0.55, offset: 0.3 }, { transform: 'translate(4px,-14px) rotate(4deg) skewX(-3deg)', opacity: 0.85, offset: 0.65 }, { transform: 'none', opacity: 1 }], { duration: o.duration, iterations: Math.max(1, Math.min(6, Number(o.cycles) || 2)), easing: 'ease-in-out' })
|
|
107
|
+
?.finished.catch(() => undefined);
|
|
108
|
+
},
|
|
109
|
+
},
|
|
110
|
+
];
|
|
111
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
112
|
+
function registerFestivalPack() {
|
|
113
|
+
registerEffects(FESTIVAL_FX);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
export { FESTIVAL_FX, registerFestivalPack, sparkVectors };
|
|
117
|
+
//# sourceMappingURL=fx-festival.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fx-festival.js","sources":["../../src/components/fx2/festival.ts"],"sourcesContent":["/**\n * 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):\n *\n * - `firework-burst` (attention) — rockets of sparks burst out of the element\n * in festive colours (`bursts`, `colors`).\n * - `lantern-rise` (enter) — the element floats up and sways in like a\n * Lunar New Year lantern (`sway`).\n * - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup\n * stops them (`flakes`).\n * - `spooky-float` (attention) — the element wobbles and fades like a\n * Halloween ghost (`cycles`).\n *\n * Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is\n * skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.\n */\nimport type { EffectContext, EffectDefinition } from '../fx/registry';\nimport { registerEffects } from '../fx/registry';\n\n/** Evenly spread spark directions with a little jitter (8.1). */\nexport function sparkVectors(n: number, radius: number, seed = 1): { x: number; y: number }[] {\n let s = seed;\n const rnd = () => ((s = (s * 9301 + 49297) % 233280) / 233280);\n return Array.from({ length: n }, (_, i) => {\n const a = (i / n) * Math.PI * 2 + (rnd() - 0.5) * 0.3;\n const r = radius * (0.7 + rnd() * 0.3);\n return { x: Math.round(Math.cos(a) * r), y: Math.round(Math.sin(a) * r) };\n });\n}\n\nconst layer = (el: HTMLElement, ctx: EffectContext) => {\n if (getComputedStyle(el).position === 'static') {\n const prev = el.style.position;\n el.style.position = 'relative';\n ctx.onCleanup(() => (el.style.position = prev));\n }\n const l = document.createElement('span');\n l.setAttribute('aria-hidden', 'true');\n Object.assign(l.style, { position: 'absolute', inset: '0', pointerEvents: 'none', overflow: 'visible' });\n el.appendChild(l);\n ctx.onCleanup(() => l.remove());\n return l;\n};\nconst dot = (parent: HTMLElement, css: Partial<CSSStyleDeclaration>, text = '') => {\n const d = document.createElement('span');\n d.textContent = text;\n Object.assign(d.style, { position: 'absolute', left: '50%', top: '50%', ...css });\n parent.appendChild(d);\n return d;\n};\n\nexport const FESTIVAL_FX: EffectDefinition[] = [\n {\n name: 'firework-burst',\n kind: 'attention',\n description: 'Rockets of sparks burst out of the element in festive colours (`bursts`, `colors`).',\n defaults: { bursts: 3, colors: '#f43f5e,#f59e0b,#22d3ee,#a855f7,#facc15', duration: 900 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n const l = layer(el, ctx);\n const colors = String(o.colors).split(',');\n const r = el.getBoundingClientRect();\n const runs: Promise<unknown>[] = [];\n const n = Math.max(1, Math.min(6, Number(o.bursts) || 3));\n for (let b = 0; b < n; b++) {\n const cx = (b - (n - 1) / 2) * Math.min(60, (r.width || 120) / n);\n const cy = -((r.height || 60) * 0.25) - (b % 2) * 18;\n const col = colors[b % colors.length];\n sparkVectors(14, 46 + b * 6, b + 3).forEach((v) => {\n const s = dot(l, { width: '5px', height: '5px', marginLeft: '-2.5px', marginTop: '-2.5px', borderRadius: '50%', background: col, boxShadow: `0 0 6px ${col}` });\n const a = ctx.animate(s, [{ transform: `translate(${cx}px,${cy + 40}px) scale(.4)`, opacity: 0 }, { transform: `translate(${cx}px,${cy}px) scale(1)`, opacity: 1, offset: 0.25 }, { transform: `translate(${cx + v.x}px,${cy + v.y + 18}px) scale(.3)`, opacity: 0 }], { duration: o.duration, delay: b * 220, easing: 'cubic-bezier(.2,.7,.3,1)', fill: 'backwards' });\n runs.push(a ? a.finished.then(() => s.remove(), () => s.remove()) : Promise.resolve(s.remove()));\n });\n }\n return Promise.all(runs).then(() => l.remove());\n },\n },\n {\n name: 'lantern-rise',\n kind: 'enter',\n description: 'The element floats up and sways in like a Lunar New Year lantern (`sway` degrees).',\n defaults: { sway: 8, duration: 1400 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);\n const w = Number(o.sway) || 8;\n return ctx\n .animate(el, [{ transform: `translateY(60px) rotate(${-w}deg)`, opacity: 0, transformOrigin: '50% 0' }, { transform: `translateY(-6px) rotate(${w * 0.6}deg)`, opacity: 1, offset: 0.55, transformOrigin: '50% 0' }, { transform: `translateY(0) rotate(${-w * 0.3}deg)`, offset: 0.8, transformOrigin: '50% 0' }, { transform: 'none', opacity: 1, transformOrigin: '50% 0' }], { duration: o.duration, easing: 'ease-out', fill: 'backwards' })\n ?.finished.catch(() => undefined);\n },\n },\n {\n name: 'xmas-snow',\n kind: 'loop',\n description: 'Snowflakes drift down over the element until the cleanup runs (`flakes`).',\n defaults: { flakes: 18, duration: 4000 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n const l = layer(el, ctx);\n l.style.overflow = 'hidden';\n const n = Math.max(4, Math.min(60, Number(o.flakes) || 18));\n const anims = Array.from({ length: n }, (_, i) => {\n const x = (i * 37) % 100;\n const size = 8 + ((i * 7) % 9);\n const f = dot(l, { left: `${x}%`, top: '-14px', fontSize: `${size}px`, color: '#fff', textShadow: '0 0 3px rgba(148,163,184,.9)', lineHeight: '1' }, '❄');\n const drift = ((i % 5) - 2) * 12;\n return ctx.animate(f, [{ transform: 'translate(0,0) rotate(0)' }, { transform: `translate(${drift}px, calc(${el.clientHeight || 160}px + 20px)) rotate(180deg)` }], { duration: o.duration * (0.7 + ((i * 13) % 6) / 10), delay: -((i * 331) % o.duration), iterations: Infinity, easing: 'linear' });\n });\n return () => {\n anims.forEach((a) => a?.cancel());\n l.remove();\n };\n },\n },\n {\n name: 'spooky-float',\n kind: 'attention',\n description: 'The element wobbles, rises and flickers like a Halloween ghost (`cycles`).',\n defaults: { cycles: 2, duration: 1200 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n return ctx\n .animate(el, [{ transform: 'none', opacity: 1 }, { transform: 'translate(-4px,-10px) rotate(-4deg) skewX(3deg)', opacity: 0.55, offset: 0.3 }, { transform: 'translate(4px,-14px) rotate(4deg) skewX(-3deg)', opacity: 0.85, offset: 0.65 }, { transform: 'none', opacity: 1 }], { duration: o.duration, iterations: Math.max(1, Math.min(6, Number(o.cycles) || 2)), easing: 'ease-in-out' })\n ?.finished.catch(() => undefined);\n },\n },\n];\n\n/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */\nexport function registerFestivalPack(): void {\n registerEffects(FESTIVAL_FX);\n}\n"],"names":[],"mappings":"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"}
|
package/dist/components/fx2.cjs
CHANGED
|
@@ -18,6 +18,7 @@ var components_fxGame = require('./fx-game.cjs');
|
|
|
18
18
|
var components_fxGeo = require('./fx-geo.cjs');
|
|
19
19
|
var components_fxForm = require('./fx-form.cjs');
|
|
20
20
|
var components_fxAi = require('./fx-ai.cjs');
|
|
21
|
+
var components_fxFestival = require('./fx-festival.cjs');
|
|
21
22
|
require('../chunks/registry-BVklOepd.cjs');
|
|
22
23
|
require('../chunks/base-DoRUZBy-.cjs');
|
|
23
24
|
require('../chunks/generative-BHIj-NU0.cjs');
|
|
@@ -43,6 +44,7 @@ const EFFECT_PACKS = {
|
|
|
43
44
|
geo: components_fxGeo.GEO_FX,
|
|
44
45
|
form: components_fxForm.FORM_FX,
|
|
45
46
|
ai: components_fxAi.AI_FX,
|
|
47
|
+
festival: components_fxFestival.FESTIVAL_FX,
|
|
46
48
|
};
|
|
47
49
|
/** Register every 6.x effect pack (idempotent). */
|
|
48
50
|
function registerEffectPacks() {
|
|
@@ -63,6 +65,7 @@ function registerEffectPacks() {
|
|
|
63
65
|
components_fxGeo.registerGeoPack();
|
|
64
66
|
components_fxForm.registerFormPack();
|
|
65
67
|
components_fxAi.registerAiPack();
|
|
68
|
+
components_fxFestival.registerFestivalPack();
|
|
66
69
|
}
|
|
67
70
|
|
|
68
71
|
exports.EFFECT_PACK_FORMAT = components_marketplace.EFFECT_PACK_FORMAT;
|
|
@@ -129,6 +132,9 @@ exports.shakeFrames = components_fxForm.shakeFrames;
|
|
|
129
132
|
exports.AI_FX = components_fxAi.AI_FX;
|
|
130
133
|
exports.registerAiPack = components_fxAi.registerAiPack;
|
|
131
134
|
exports.splitWords = components_fxAi.splitWords;
|
|
135
|
+
exports.FESTIVAL_FX = components_fxFestival.FESTIVAL_FX;
|
|
136
|
+
exports.registerFestivalPack = components_fxFestival.registerFestivalPack;
|
|
137
|
+
exports.sparkVectors = components_fxFestival.sparkVectors;
|
|
132
138
|
exports.EFFECT_PACKS = EFFECT_PACKS;
|
|
133
139
|
exports.registerEffectPacks = registerEffectPacks;
|
|
134
140
|
//# sourceMappingURL=fx2.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fx2.cjs","sources":["../../src/components/fx2/index.ts"],"sourcesContent":["/**\n * The 6.x effect packs, one entry each (`motionary/components/fx-gpu`, …) so\n * their size budgets stay separate. This module (`registerFx2()`) registers\n * them all — used by dist/widgets.umd.js and the showcase.\n */\nimport type { EffectDefinition } from '../fx/registry';\nexport { EFFECT_PACK_FORMAT, packManifest, validateManifest, loadEffectPack } from './manifest';\nexport type { EffectPackManifest } from './manifest';\nimport { GPU_FX, registerGpuPack } from './gpu';\nimport { TEXT3_FX, registerTextPack, splitChars } from './text3';\nimport { LIGHT_FX, registerLightPack, trackPointer } from './light';\nimport { DEPTH3_FX, register3dPack } from './depth3';\nimport { MORPH2_FX, registerMorphPack, samplePath, pointsToPath } from './morph2';\nimport { TRANSITIONS2_FX, registerTransitionsPack, pageTransition, crossDocumentTransitions } from './transitions2';\nimport { WEATHER_FX, registerWeatherPack, skyAt } from './weather';\nimport { PHYSICS2_FX, registerPhysicsPack, VerletWorld } from './physics2';\nimport { FOCUS_FX, registerFocusPack } from './focus';\nimport { MUSIC_FX, registerMusicPack, syntheticSample, musicSample } from './music';\nimport { CHART_FX, registerChartPack, parseFigure } from './chart';\nimport { SHOP_FX, registerShopPack, arcPath } from './shop';\nimport { SOCIAL_FX, registerSocialPack, fanAngles } from './social';\nimport { GAME_FX, registerGamePack, throwPath } from './game';\nimport { GEO_FX, registerGeoPack, routeLength } from './geo';\nimport { FORM_FX, registerFormPack, shakeFrames } from './form';\nimport { AI_FX, registerAiPack, splitWords } from './ai';\n\nexport { GPU_FX, registerGpuPack, TEXT3_FX, registerTextPack, splitChars };\nexport { shaderBackground, supportsWebGL2, fieldFallback, GLSL_HEAD } from './gl';\nexport { supportsWebGPU, glslToWgsl, wgslModule, webgpuBackground, WGSL_HEAD } from './webgpu';\nexport type { ShaderSpec } from './gl';\n\nexport { LIGHT_FX, registerLightPack, trackPointer };\n\nexport { DEPTH3_FX, register3dPack };\n\nexport { MORPH2_FX, registerMorphPack, samplePath, pointsToPath };\n\nexport { TRANSITIONS2_FX, registerTransitionsPack, pageTransition, crossDocumentTransitions };\n\nexport { WEATHER_FX, registerWeatherPack, skyAt };\n\nexport { PHYSICS2_FX, registerPhysicsPack, VerletWorld };\n\nexport { FOCUS_FX, registerFocusPack };\n\nexport { MUSIC_FX, registerMusicPack, syntheticSample, musicSample };\n\nexport { CHART_FX, registerChartPack, parseFigure };\n\nexport { SHOP_FX, registerShopPack, arcPath };\n\nexport { SOCIAL_FX, registerSocialPack, fanAngles };\n\nexport { GAME_FX, registerGamePack, throwPath };\n\nexport { GEO_FX, registerGeoPack, routeLength };\n\nexport { FORM_FX, registerFormPack, shakeFrames };\n\nexport { AI_FX, registerAiPack, splitWords };\n\n/** The 6.x effect packs by name. */\nexport const EFFECT_PACKS: Record<string, EffectDefinition[]> = {\n gpu: GPU_FX,\n text: TEXT3_FX,\n light: LIGHT_FX,\n depth: DEPTH3_FX,\n morph: MORPH2_FX,\n transitions: TRANSITIONS2_FX,\n weather: WEATHER_FX,\n physics: PHYSICS2_FX,\n focus: FOCUS_FX,\n music: MUSIC_FX,\n chart: CHART_FX,\n shop: SHOP_FX,\n social: SOCIAL_FX,\n game: GAME_FX,\n geo: GEO_FX,\n form: FORM_FX,\n ai: AI_FX,\n};\n\n/** Register every 6.x effect pack (idempotent). */\nexport function registerEffectPacks(): void {\n registerGpuPack();\n registerTextPack();\n registerLightPack();\n register3dPack();\n registerMorphPack();\n registerTransitionsPack();\n registerWeatherPack();\n registerPhysicsPack();\n registerFocusPack();\n registerMusicPack();\n registerChartPack();\n registerShopPack();\n registerSocialPack();\n registerGamePack();\n registerGeoPack();\n registerFormPack();\n registerAiPack();\n}\n\n\n"],"names":["GPU_FX","TEXT3_FX","LIGHT_FX","DEPTH3_FX","MORPH2_FX","TRANSITIONS2_FX","WEATHER_FX","PHYSICS2_FX","FOCUS_FX","MUSIC_FX","CHART_FX","SHOP_FX","SOCIAL_FX","GAME_FX","GEO_FX","FORM_FX","AI_FX","registerGpuPack","registerTextPack","registerLightPack","register3dPack","registerMorphPack","registerTransitionsPack","registerWeatherPack","registerPhysicsPack","registerFocusPack","registerMusicPack","registerChartPack","registerShopPack","registerSocialPack","registerGamePack","registerGeoPack","registerFormPack","registerAiPack"],"mappings":"
|
|
1
|
+
{"version":3,"file":"fx2.cjs","sources":["../../src/components/fx2/index.ts"],"sourcesContent":["/**\n * The 6.x effect packs, one entry each (`motionary/components/fx-gpu`, …) so\n * their size budgets stay separate. This module (`registerFx2()`) registers\n * them all — used by dist/widgets.umd.js and the showcase.\n */\nimport type { EffectDefinition } from '../fx/registry';\nexport { EFFECT_PACK_FORMAT, packManifest, validateManifest, loadEffectPack } from './manifest';\nexport type { EffectPackManifest } from './manifest';\nimport { GPU_FX, registerGpuPack } from './gpu';\nimport { TEXT3_FX, registerTextPack, splitChars } from './text3';\nimport { LIGHT_FX, registerLightPack, trackPointer } from './light';\nimport { DEPTH3_FX, register3dPack } from './depth3';\nimport { MORPH2_FX, registerMorphPack, samplePath, pointsToPath } from './morph2';\nimport { TRANSITIONS2_FX, registerTransitionsPack, pageTransition, crossDocumentTransitions } from './transitions2';\nimport { WEATHER_FX, registerWeatherPack, skyAt } from './weather';\nimport { PHYSICS2_FX, registerPhysicsPack, VerletWorld } from './physics2';\nimport { FOCUS_FX, registerFocusPack } from './focus';\nimport { MUSIC_FX, registerMusicPack, syntheticSample, musicSample } from './music';\nimport { CHART_FX, registerChartPack, parseFigure } from './chart';\nimport { SHOP_FX, registerShopPack, arcPath } from './shop';\nimport { SOCIAL_FX, registerSocialPack, fanAngles } from './social';\nimport { GAME_FX, registerGamePack, throwPath } from './game';\nimport { GEO_FX, registerGeoPack, routeLength } from './geo';\nimport { FORM_FX, registerFormPack, shakeFrames } from './form';\nimport { AI_FX, registerAiPack, splitWords } from './ai';\nimport { FESTIVAL_FX, registerFestivalPack, sparkVectors } from './festival';\n\nexport { GPU_FX, registerGpuPack, TEXT3_FX, registerTextPack, splitChars };\nexport { shaderBackground, supportsWebGL2, fieldFallback, GLSL_HEAD } from './gl';\nexport { supportsWebGPU, glslToWgsl, wgslModule, webgpuBackground, WGSL_HEAD } from './webgpu';\nexport type { ShaderSpec } from './gl';\n\nexport { LIGHT_FX, registerLightPack, trackPointer };\n\nexport { DEPTH3_FX, register3dPack };\n\nexport { MORPH2_FX, registerMorphPack, samplePath, pointsToPath };\n\nexport { TRANSITIONS2_FX, registerTransitionsPack, pageTransition, crossDocumentTransitions };\n\nexport { WEATHER_FX, registerWeatherPack, skyAt };\n\nexport { PHYSICS2_FX, registerPhysicsPack, VerletWorld };\n\nexport { FOCUS_FX, registerFocusPack };\n\nexport { MUSIC_FX, registerMusicPack, syntheticSample, musicSample };\n\nexport { CHART_FX, registerChartPack, parseFigure };\n\nexport { SHOP_FX, registerShopPack, arcPath };\n\nexport { SOCIAL_FX, registerSocialPack, fanAngles };\n\nexport { GAME_FX, registerGamePack, throwPath };\n\nexport { GEO_FX, registerGeoPack, routeLength };\n\nexport { FORM_FX, registerFormPack, shakeFrames };\n\nexport { AI_FX, registerAiPack, splitWords };\n\nexport { FESTIVAL_FX, registerFestivalPack, sparkVectors };\n\n/** The 6.x effect packs by name. */\nexport const EFFECT_PACKS: Record<string, EffectDefinition[]> = {\n gpu: GPU_FX,\n text: TEXT3_FX,\n light: LIGHT_FX,\n depth: DEPTH3_FX,\n morph: MORPH2_FX,\n transitions: TRANSITIONS2_FX,\n weather: WEATHER_FX,\n physics: PHYSICS2_FX,\n focus: FOCUS_FX,\n music: MUSIC_FX,\n chart: CHART_FX,\n shop: SHOP_FX,\n social: SOCIAL_FX,\n game: GAME_FX,\n geo: GEO_FX,\n form: FORM_FX,\n ai: AI_FX,\n festival: FESTIVAL_FX,\n};\n\n/** Register every 6.x effect pack (idempotent). */\nexport function registerEffectPacks(): void {\n registerGpuPack();\n registerTextPack();\n registerLightPack();\n register3dPack();\n registerMorphPack();\n registerTransitionsPack();\n registerWeatherPack();\n registerPhysicsPack();\n registerFocusPack();\n registerMusicPack();\n registerChartPack();\n registerShopPack();\n registerSocialPack();\n registerGamePack();\n registerGeoPack();\n registerFormPack();\n registerAiPack();\n registerFestivalPack();\n}\n\n\n"],"names":["GPU_FX","TEXT3_FX","LIGHT_FX","DEPTH3_FX","MORPH2_FX","TRANSITIONS2_FX","WEATHER_FX","PHYSICS2_FX","FOCUS_FX","MUSIC_FX","CHART_FX","SHOP_FX","SOCIAL_FX","GAME_FX","GEO_FX","FORM_FX","AI_FX","FESTIVAL_FX","registerGpuPack","registerTextPack","registerLightPack","register3dPack","registerMorphPack","registerTransitionsPack","registerWeatherPack","registerPhysicsPack","registerFocusPack","registerMusicPack","registerChartPack","registerShopPack","registerSocialPack","registerGamePack","registerGeoPack","registerFormPack","registerAiPack","registerFestivalPack"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAgEA;AACO,MAAM,YAAY,GAAuC;AAC9D,IAAA,GAAG,EAAEA,uBAAM;AACX,IAAA,IAAI,EAAEC,0BAAQ;AACd,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,KAAK,EAAEC,yBAAS;AAChB,IAAA,KAAK,EAAEC,4BAAS;AAChB,IAAA,WAAW,EAAEC,wCAAe;AAC5B,IAAA,OAAO,EAAEC,+BAAU;AACnB,IAAA,OAAO,EAAEC,gCAAW;AACpB,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,IAAI,EAAEC,yBAAO;AACb,IAAA,MAAM,EAAEC,6BAAS;AACjB,IAAA,IAAI,EAAEC,yBAAO;AACb,IAAA,GAAG,EAAEC,uBAAM;AACX,IAAA,IAAI,EAAEC,yBAAO;AACb,IAAA,EAAE,EAAEC,qBAAK;AACT,IAAA,QAAQ,EAAEC,iCAAW;;AAGvB;SACgB,mBAAmB,GAAA;AACjC,IAAAC,gCAAe,EAAE;AACjB,IAAAC,kCAAgB,EAAE;AAClB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,8BAAc,EAAE;AAChB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,gDAAuB,EAAE;AACzB,IAAAC,wCAAmB,EAAE;AACrB,IAAAC,wCAAmB,EAAE;AACrB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,kCAAgB,EAAE;AAClB,IAAAC,sCAAkB,EAAE;AACpB,IAAAC,kCAAgB,EAAE;AAClB,IAAAC,gCAAe,EAAE;AACjB,IAAAC,kCAAgB,EAAE;AAClB,IAAAC,8BAAc,EAAE;AAChB,IAAAC,0CAAoB,EAAE;AACxB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -585,6 +585,31 @@ declare const AI_FX: EffectDefinition[];
|
|
|
585
585
|
/** Register stream-text, thinking-glow, voice-wave and gen-skeleton (7.8). */
|
|
586
586
|
declare function registerAiPack(): void;
|
|
587
587
|
|
|
588
|
+
/**
|
|
589
|
+
* 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):
|
|
590
|
+
*
|
|
591
|
+
* - `firework-burst` (attention) — rockets of sparks burst out of the element
|
|
592
|
+
* in festive colours (`bursts`, `colors`).
|
|
593
|
+
* - `lantern-rise` (enter) — the element floats up and sways in like a
|
|
594
|
+
* Lunar New Year lantern (`sway`).
|
|
595
|
+
* - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup
|
|
596
|
+
* stops them (`flakes`).
|
|
597
|
+
* - `spooky-float` (attention) — the element wobbles and fades like a
|
|
598
|
+
* Halloween ghost (`cycles`).
|
|
599
|
+
*
|
|
600
|
+
* Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is
|
|
601
|
+
* skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.
|
|
602
|
+
*/
|
|
603
|
+
|
|
604
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
605
|
+
declare function sparkVectors(n: number, radius: number, seed?: number): {
|
|
606
|
+
x: number;
|
|
607
|
+
y: number;
|
|
608
|
+
}[];
|
|
609
|
+
declare const FESTIVAL_FX: EffectDefinition[];
|
|
610
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
611
|
+
declare function registerFestivalPack(): void;
|
|
612
|
+
|
|
588
613
|
/**
|
|
589
614
|
* 5.5 — generative backgrounds on Canvas 2D, registered through
|
|
590
615
|
* `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
|
|
@@ -694,5 +719,5 @@ declare const EFFECT_PACKS: Record<string, EffectDefinition[]>;
|
|
|
694
719
|
/** Register every 6.x effect pack (idempotent). */
|
|
695
720
|
declare function registerEffectPacks(): void;
|
|
696
721
|
|
|
697
|
-
export { AI_FX, CHART_FX, DEPTH3_FX, EFFECT_PACKS, EFFECT_PACK_FORMAT, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, PHYSICS2_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerPhysicsPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
722
|
+
export { AI_FX, CHART_FX, DEPTH3_FX, EFFECT_PACKS, EFFECT_PACK_FORMAT, FESTIVAL_FX, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, PHYSICS2_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerPhysicsPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
698
723
|
export type { EffectPackManifest, ShaderSpec };
|
package/dist/components/fx2.d.ts
CHANGED
|
@@ -585,6 +585,31 @@ declare const AI_FX: EffectDefinition[];
|
|
|
585
585
|
/** Register stream-text, thinking-glow, voice-wave and gen-skeleton (7.8). */
|
|
586
586
|
declare function registerAiPack(): void;
|
|
587
587
|
|
|
588
|
+
/**
|
|
589
|
+
* 8.1 — Festival packs (`motionary/fx/festival`, also `motionary/components/fx-festival`):
|
|
590
|
+
*
|
|
591
|
+
* - `firework-burst` (attention) — rockets of sparks burst out of the element
|
|
592
|
+
* in festive colours (`bursts`, `colors`).
|
|
593
|
+
* - `lantern-rise` (enter) — the element floats up and sways in like a
|
|
594
|
+
* Lunar New Year lantern (`sway`).
|
|
595
|
+
* - `xmas-snow` (loop) — snowflakes drift down over the element; the cleanup
|
|
596
|
+
* stops them (`flakes`).
|
|
597
|
+
* - `spooky-float` (attention) — the element wobbles and fades like a
|
|
598
|
+
* Halloween ghost (`cycles`).
|
|
599
|
+
*
|
|
600
|
+
* Reduced motion: firework-burst / spooky-float do nothing, xmas-snow is
|
|
601
|
+
* skipped, lantern-rise fades in. Particles are `aria-hidden` and removed.
|
|
602
|
+
*/
|
|
603
|
+
|
|
604
|
+
/** Evenly spread spark directions with a little jitter (8.1). */
|
|
605
|
+
declare function sparkVectors(n: number, radius: number, seed?: number): {
|
|
606
|
+
x: number;
|
|
607
|
+
y: number;
|
|
608
|
+
}[];
|
|
609
|
+
declare const FESTIVAL_FX: EffectDefinition[];
|
|
610
|
+
/** Register firework-burst, lantern-rise, xmas-snow and spooky-float (8.1). */
|
|
611
|
+
declare function registerFestivalPack(): void;
|
|
612
|
+
|
|
588
613
|
/**
|
|
589
614
|
* 5.5 — generative backgrounds on Canvas 2D, registered through
|
|
590
615
|
* `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
|
|
@@ -694,5 +719,5 @@ declare const EFFECT_PACKS: Record<string, EffectDefinition[]>;
|
|
|
694
719
|
/** Register every 6.x effect pack (idempotent). */
|
|
695
720
|
declare function registerEffectPacks(): void;
|
|
696
721
|
|
|
697
|
-
export { AI_FX, CHART_FX, DEPTH3_FX, EFFECT_PACKS, EFFECT_PACK_FORMAT, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, PHYSICS2_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerPhysicsPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
722
|
+
export { AI_FX, CHART_FX, DEPTH3_FX, EFFECT_PACKS, EFFECT_PACK_FORMAT, FESTIVAL_FX, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, PHYSICS2_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerPhysicsPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
698
723
|
export type { EffectPackManifest, ShaderSpec };
|