use-scroll-animate 8.3.0 → 8.5.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 +33 -0
- package/dist/components/fx-cyber.cjs +140 -0
- package/dist/components/fx-cyber.cjs.map +1 -0
- package/dist/components/fx-cyber.d.cts +66 -0
- package/dist/components/fx-cyber.d.ts +66 -0
- package/dist/components/fx-cyber.js +136 -0
- package/dist/components/fx-cyber.js.map +1 -0
- package/dist/components/fx-paper.cjs +108 -0
- package/dist/components/fx-paper.cjs.map +1 -0
- package/dist/components/fx-paper.d.cts +68 -0
- package/dist/components/fx-paper.d.ts +68 -0
- package/dist/components/fx-paper.js +103 -0
- package/dist/components/fx-paper.js.map +1 -0
- package/dist/components/fx2.cjs +13 -0
- package/dist/components/fx2.cjs.map +1 -1
- package/dist/components/fx2.d.cts +47 -1
- package/dist/components/fx2.d.ts +47 -1
- package/dist/components/fx2.js +9 -1
- package/dist/components/fx2.js.map +1 -1
- package/dist/components/widgets.cjs +478 -162
- package/dist/components/widgets.cjs.map +1 -1
- package/dist/components/widgets.d.cts +71 -2
- package/dist/components/widgets.d.ts +71 -2
- package/dist/components/widgets.js +474 -163
- 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 +2 -2
- package/docs/components.md +44 -0
- package/package.json +41 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fx-paper.cjs","sources":["../../src/components/fx2/paper.ts"],"sourcesContent":["/**\n * 8.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):\n *\n * - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,\n * top flap first, with a soft crease shadow (`folds`).\n * - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a\n * slightly wobbly pencil, one after another (`duration`, `stagger`).\n * - `watercolor` (enter) — the element bleeds in like wet watercolour:\n * blurred, saturated, spreading from the middle, then dries (`duration`).\n * - `crumple` (attention) — the element scrunches like crumpled paper and\n * springs back flat.\n *\n * Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the\n * drawing, crumple does nothing.\n */\nimport type { EffectContext, EffectDefinition } from '../fx/registry';\nimport { registerEffects } from '../fx/registry';\n\n/** A deterministic PRNG in [0, 1) from a seed (8.5). */\nexport function paperRandom(seed: number): () => number {\n let s = Math.abs(Math.round(seed * 1000)) % 233280 || 11;\n return () => (s = (s * 9301 + 49297) % 233280) / 233280;\n}\n\n/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */\nexport function roughLine(x1: number, y1: number, x2: number, y2: number, seed = 1, amp = 1.5): string {\n const r = paperRandom(seed);\n const j = () => (r() - 0.5) * 2 * amp;\n const mx = (x1 + x2) / 2 + j() * 1.5;\n const my = (y1 + y2) / 2 + j() * 1.5;\n const f = (n: number) => Math.round(n * 10) / 10;\n return `M${f(x1 + j())} ${f(y1 + j())} Q${f(mx)} ${f(my)} ${f(x2 + j())} ${f(y2 + j())}`;\n}\n\nconst fade = (el: HTMLElement, ctx: EffectContext) => ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);\n\nexport const PAPER_FX: EffectDefinition[] = [\n {\n name: 'paper-unfold',\n kind: 'enter',\n description: 'The element unfolds like a folded sheet of paper, with a soft crease shadow (`folds`).',\n defaults: { duration: 900, folds: 2 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return fade(el, ctx);\n const n = Math.max(1, Math.min(4, Math.round(Number(o.folds) || 2)));\n const frames: Keyframe[] = [{ transform: 'perspective(800px) rotateX(-90deg)', opacity: 0, filter: 'brightness(.7)', offset: 0 }];\n for (let i = 1; i <= n; i++) frames.push({ transform: `perspective(800px) rotateX(${i % 2 ? 25 : -12}deg) scaleY(${(0.5 + (0.5 * i) / (n + 1)).toFixed(2)})`, opacity: 1, filter: 'brightness(.85)', offset: (i / (n + 1)) * 0.9 });\n frames.push({ transform: 'none', opacity: 1, filter: 'none', offset: 1 });\n const prev = el.style.transformOrigin;\n el.style.transformOrigin = 'top center';\n ctx.onCleanup(() => (el.style.transformOrigin = prev));\n return ctx.animate(el, frames, { duration: o.duration, easing: 'ease-out', fill: 'backwards' })?.finished.catch(() => undefined);\n },\n },\n {\n name: 'pencil-sketch',\n kind: 'enter',\n description: 'SVG strokes inside are sketched in with a slightly wobbly pencil, one after another (`duration`, `stagger`).',\n defaults: { duration: 700, stagger: 120 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n const strokes = Array.from(el.querySelectorAll<SVGGeometryElement>('path, line, polyline, rect, circle, ellipse'));\n const runs = strokes.map((p, i) => {\n let len = 200;\n try {\n len = p.getTotalLength?.() || 200;\n } catch {\n /* not rendered */\n }\n const prev = p.style.strokeDasharray;\n p.style.strokeDasharray = `${len}`;\n ctx.onCleanup(() => (p.style.strokeDasharray = prev));\n return ctx.animate(p, [{ strokeDashoffset: `${len}`, transform: 'translate(0.6px,-0.4px)' }, { transform: 'translate(-0.5px,0.5px)', offset: 0.5 }, { strokeDashoffset: '0', transform: 'none' }], { duration: o.duration, delay: i * (Number(o.stagger) || 0), easing: 'cubic-bezier(.5,.1,.4,1)', fill: 'backwards' })?.finished.catch(() => undefined);\n });\n return Promise.all(runs).then(() => undefined);\n },\n },\n {\n name: 'watercolor',\n kind: 'enter',\n description: 'The element bleeds in like wet watercolour — blurred and saturated, spreading from the middle — then dries (`duration`).',\n defaults: { duration: 1400 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return fade(el, ctx);\n return ctx.animate(\n el,\n [\n { opacity: 0, filter: 'blur(10px) saturate(2.2)', clipPath: 'circle(8% at 50% 50%)' },\n { opacity: 0.9, filter: 'blur(4px) saturate(1.8)', clipPath: 'circle(55% at 48% 52%)', offset: 0.5 },\n { opacity: 1, filter: 'blur(0) saturate(1)', clipPath: 'circle(150% at 50% 50%)' },\n ],\n { duration: o.duration, easing: 'ease-out', fill: 'backwards' }\n )?.finished.catch(() => undefined);\n },\n },\n {\n name: 'crumple',\n kind: 'attention',\n description: 'The element scrunches like crumpled paper and springs back flat.',\n defaults: { duration: 700 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n return ctx.animate(\n el,\n [\n { transform: 'none' },\n { transform: 'scale(.82,.9) rotate(-4deg) skewX(6deg)', filter: 'brightness(.9)', offset: 0.3 },\n { transform: 'scale(.9,.8) rotate(3deg) skewY(-5deg)', offset: 0.5 },\n { transform: 'scale(1.04) rotate(-1deg)', filter: 'none', offset: 0.8 },\n { transform: 'none' },\n ],\n { duration: o.duration, easing: 'ease-in-out' }\n )?.finished.catch(() => undefined);\n },\n },\n];\n\n/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */\nexport function registerPaperPack(): void {\n registerEffects(PAPER_FX);\n}\n"],"names":["registerEffects"],"mappings":"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"}
|
|
@@ -0,0 +1,68 @@
|
|
|
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.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):
|
|
46
|
+
*
|
|
47
|
+
* - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,
|
|
48
|
+
* top flap first, with a soft crease shadow (`folds`).
|
|
49
|
+
* - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a
|
|
50
|
+
* slightly wobbly pencil, one after another (`duration`, `stagger`).
|
|
51
|
+
* - `watercolor` (enter) — the element bleeds in like wet watercolour:
|
|
52
|
+
* blurred, saturated, spreading from the middle, then dries (`duration`).
|
|
53
|
+
* - `crumple` (attention) — the element scrunches like crumpled paper and
|
|
54
|
+
* springs back flat.
|
|
55
|
+
*
|
|
56
|
+
* Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the
|
|
57
|
+
* drawing, crumple does nothing.
|
|
58
|
+
*/
|
|
59
|
+
|
|
60
|
+
/** A deterministic PRNG in [0, 1) from a seed (8.5). */
|
|
61
|
+
declare function paperRandom(seed: number): () => number;
|
|
62
|
+
/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */
|
|
63
|
+
declare function roughLine(x1: number, y1: number, x2: number, y2: number, seed?: number, amp?: number): string;
|
|
64
|
+
declare const PAPER_FX: EffectDefinition[];
|
|
65
|
+
/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */
|
|
66
|
+
declare function registerPaperPack(): void;
|
|
67
|
+
|
|
68
|
+
export { PAPER_FX, paperRandom, registerPaperPack, roughLine };
|
|
@@ -0,0 +1,68 @@
|
|
|
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.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):
|
|
46
|
+
*
|
|
47
|
+
* - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,
|
|
48
|
+
* top flap first, with a soft crease shadow (`folds`).
|
|
49
|
+
* - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a
|
|
50
|
+
* slightly wobbly pencil, one after another (`duration`, `stagger`).
|
|
51
|
+
* - `watercolor` (enter) — the element bleeds in like wet watercolour:
|
|
52
|
+
* blurred, saturated, spreading from the middle, then dries (`duration`).
|
|
53
|
+
* - `crumple` (attention) — the element scrunches like crumpled paper and
|
|
54
|
+
* springs back flat.
|
|
55
|
+
*
|
|
56
|
+
* Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the
|
|
57
|
+
* drawing, crumple does nothing.
|
|
58
|
+
*/
|
|
59
|
+
|
|
60
|
+
/** A deterministic PRNG in [0, 1) from a seed (8.5). */
|
|
61
|
+
declare function paperRandom(seed: number): () => number;
|
|
62
|
+
/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */
|
|
63
|
+
declare function roughLine(x1: number, y1: number, x2: number, y2: number, seed?: number, amp?: number): string;
|
|
64
|
+
declare const PAPER_FX: EffectDefinition[];
|
|
65
|
+
/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */
|
|
66
|
+
declare function registerPaperPack(): void;
|
|
67
|
+
|
|
68
|
+
export { PAPER_FX, paperRandom, registerPaperPack, roughLine };
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
import { registerEffects } from '../chunks/registry-CnO7ZVPK.js';
|
|
2
|
+
import '../chunks/base-CLuqlLfG.js';
|
|
3
|
+
|
|
4
|
+
/** A deterministic PRNG in [0, 1) from a seed (8.5). */
|
|
5
|
+
function paperRandom(seed) {
|
|
6
|
+
let s = Math.abs(Math.round(seed * 1000)) % 233280 || 11;
|
|
7
|
+
return () => (s = (s * 9301 + 49297) % 233280) / 233280;
|
|
8
|
+
}
|
|
9
|
+
/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */
|
|
10
|
+
function roughLine(x1, y1, x2, y2, seed = 1, amp = 1.5) {
|
|
11
|
+
const r = paperRandom(seed);
|
|
12
|
+
const j = () => (r() - 0.5) * 2 * amp;
|
|
13
|
+
const mx = (x1 + x2) / 2 + j() * 1.5;
|
|
14
|
+
const my = (y1 + y2) / 2 + j() * 1.5;
|
|
15
|
+
const f = (n) => Math.round(n * 10) / 10;
|
|
16
|
+
return `M${f(x1 + j())} ${f(y1 + j())} Q${f(mx)} ${f(my)} ${f(x2 + j())} ${f(y2 + j())}`;
|
|
17
|
+
}
|
|
18
|
+
const fade = (el, ctx) => ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);
|
|
19
|
+
const PAPER_FX = [
|
|
20
|
+
{
|
|
21
|
+
name: 'paper-unfold',
|
|
22
|
+
kind: 'enter',
|
|
23
|
+
description: 'The element unfolds like a folded sheet of paper, with a soft crease shadow (`folds`).',
|
|
24
|
+
defaults: { duration: 900, folds: 2 },
|
|
25
|
+
run: (el, o, ctx) => {
|
|
26
|
+
if (ctx.reduced)
|
|
27
|
+
return fade(el, ctx);
|
|
28
|
+
const n = Math.max(1, Math.min(4, Math.round(Number(o.folds) || 2)));
|
|
29
|
+
const frames = [{ transform: 'perspective(800px) rotateX(-90deg)', opacity: 0, filter: 'brightness(.7)', offset: 0 }];
|
|
30
|
+
for (let i = 1; i <= n; i++)
|
|
31
|
+
frames.push({ transform: `perspective(800px) rotateX(${i % 2 ? 25 : -12}deg) scaleY(${(0.5 + (0.5 * i) / (n + 1)).toFixed(2)})`, opacity: 1, filter: 'brightness(.85)', offset: (i / (n + 1)) * 0.9 });
|
|
32
|
+
frames.push({ transform: 'none', opacity: 1, filter: 'none', offset: 1 });
|
|
33
|
+
const prev = el.style.transformOrigin;
|
|
34
|
+
el.style.transformOrigin = 'top center';
|
|
35
|
+
ctx.onCleanup(() => (el.style.transformOrigin = prev));
|
|
36
|
+
return ctx.animate(el, frames, { duration: o.duration, easing: 'ease-out', fill: 'backwards' })?.finished.catch(() => undefined);
|
|
37
|
+
},
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
name: 'pencil-sketch',
|
|
41
|
+
kind: 'enter',
|
|
42
|
+
description: 'SVG strokes inside are sketched in with a slightly wobbly pencil, one after another (`duration`, `stagger`).',
|
|
43
|
+
defaults: { duration: 700, stagger: 120 },
|
|
44
|
+
run: (el, o, ctx) => {
|
|
45
|
+
if (ctx.reduced)
|
|
46
|
+
return;
|
|
47
|
+
const strokes = Array.from(el.querySelectorAll('path, line, polyline, rect, circle, ellipse'));
|
|
48
|
+
const runs = strokes.map((p, i) => {
|
|
49
|
+
let len = 200;
|
|
50
|
+
try {
|
|
51
|
+
len = p.getTotalLength?.() || 200;
|
|
52
|
+
}
|
|
53
|
+
catch {
|
|
54
|
+
/* not rendered */
|
|
55
|
+
}
|
|
56
|
+
const prev = p.style.strokeDasharray;
|
|
57
|
+
p.style.strokeDasharray = `${len}`;
|
|
58
|
+
ctx.onCleanup(() => (p.style.strokeDasharray = prev));
|
|
59
|
+
return ctx.animate(p, [{ strokeDashoffset: `${len}`, transform: 'translate(0.6px,-0.4px)' }, { transform: 'translate(-0.5px,0.5px)', offset: 0.5 }, { strokeDashoffset: '0', transform: 'none' }], { duration: o.duration, delay: i * (Number(o.stagger) || 0), easing: 'cubic-bezier(.5,.1,.4,1)', fill: 'backwards' })?.finished.catch(() => undefined);
|
|
60
|
+
});
|
|
61
|
+
return Promise.all(runs).then(() => undefined);
|
|
62
|
+
},
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
name: 'watercolor',
|
|
66
|
+
kind: 'enter',
|
|
67
|
+
description: 'The element bleeds in like wet watercolour — blurred and saturated, spreading from the middle — then dries (`duration`).',
|
|
68
|
+
defaults: { duration: 1400 },
|
|
69
|
+
run: (el, o, ctx) => {
|
|
70
|
+
if (ctx.reduced)
|
|
71
|
+
return fade(el, ctx);
|
|
72
|
+
return ctx.animate(el, [
|
|
73
|
+
{ opacity: 0, filter: 'blur(10px) saturate(2.2)', clipPath: 'circle(8% at 50% 50%)' },
|
|
74
|
+
{ opacity: 0.9, filter: 'blur(4px) saturate(1.8)', clipPath: 'circle(55% at 48% 52%)', offset: 0.5 },
|
|
75
|
+
{ opacity: 1, filter: 'blur(0) saturate(1)', clipPath: 'circle(150% at 50% 50%)' },
|
|
76
|
+
], { duration: o.duration, easing: 'ease-out', fill: 'backwards' })?.finished.catch(() => undefined);
|
|
77
|
+
},
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
name: 'crumple',
|
|
81
|
+
kind: 'attention',
|
|
82
|
+
description: 'The element scrunches like crumpled paper and springs back flat.',
|
|
83
|
+
defaults: { duration: 700 },
|
|
84
|
+
run: (el, o, ctx) => {
|
|
85
|
+
if (ctx.reduced)
|
|
86
|
+
return;
|
|
87
|
+
return ctx.animate(el, [
|
|
88
|
+
{ transform: 'none' },
|
|
89
|
+
{ transform: 'scale(.82,.9) rotate(-4deg) skewX(6deg)', filter: 'brightness(.9)', offset: 0.3 },
|
|
90
|
+
{ transform: 'scale(.9,.8) rotate(3deg) skewY(-5deg)', offset: 0.5 },
|
|
91
|
+
{ transform: 'scale(1.04) rotate(-1deg)', filter: 'none', offset: 0.8 },
|
|
92
|
+
{ transform: 'none' },
|
|
93
|
+
], { duration: o.duration, easing: 'ease-in-out' })?.finished.catch(() => undefined);
|
|
94
|
+
},
|
|
95
|
+
},
|
|
96
|
+
];
|
|
97
|
+
/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */
|
|
98
|
+
function registerPaperPack() {
|
|
99
|
+
registerEffects(PAPER_FX);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export { PAPER_FX, paperRandom, registerPaperPack, roughLine };
|
|
103
|
+
//# sourceMappingURL=fx-paper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fx-paper.js","sources":["../../src/components/fx2/paper.ts"],"sourcesContent":["/**\n * 8.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):\n *\n * - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,\n * top flap first, with a soft crease shadow (`folds`).\n * - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a\n * slightly wobbly pencil, one after another (`duration`, `stagger`).\n * - `watercolor` (enter) — the element bleeds in like wet watercolour:\n * blurred, saturated, spreading from the middle, then dries (`duration`).\n * - `crumple` (attention) — the element scrunches like crumpled paper and\n * springs back flat.\n *\n * Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the\n * drawing, crumple does nothing.\n */\nimport type { EffectContext, EffectDefinition } from '../fx/registry';\nimport { registerEffects } from '../fx/registry';\n\n/** A deterministic PRNG in [0, 1) from a seed (8.5). */\nexport function paperRandom(seed: number): () => number {\n let s = Math.abs(Math.round(seed * 1000)) % 233280 || 11;\n return () => (s = (s * 9301 + 49297) % 233280) / 233280;\n}\n\n/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */\nexport function roughLine(x1: number, y1: number, x2: number, y2: number, seed = 1, amp = 1.5): string {\n const r = paperRandom(seed);\n const j = () => (r() - 0.5) * 2 * amp;\n const mx = (x1 + x2) / 2 + j() * 1.5;\n const my = (y1 + y2) / 2 + j() * 1.5;\n const f = (n: number) => Math.round(n * 10) / 10;\n return `M${f(x1 + j())} ${f(y1 + j())} Q${f(mx)} ${f(my)} ${f(x2 + j())} ${f(y2 + j())}`;\n}\n\nconst fade = (el: HTMLElement, ctx: EffectContext) => ctx.animate(el, [{ opacity: 0 }, { opacity: 1 }], { duration: 250 })?.finished.catch(() => undefined);\n\nexport const PAPER_FX: EffectDefinition[] = [\n {\n name: 'paper-unfold',\n kind: 'enter',\n description: 'The element unfolds like a folded sheet of paper, with a soft crease shadow (`folds`).',\n defaults: { duration: 900, folds: 2 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return fade(el, ctx);\n const n = Math.max(1, Math.min(4, Math.round(Number(o.folds) || 2)));\n const frames: Keyframe[] = [{ transform: 'perspective(800px) rotateX(-90deg)', opacity: 0, filter: 'brightness(.7)', offset: 0 }];\n for (let i = 1; i <= n; i++) frames.push({ transform: `perspective(800px) rotateX(${i % 2 ? 25 : -12}deg) scaleY(${(0.5 + (0.5 * i) / (n + 1)).toFixed(2)})`, opacity: 1, filter: 'brightness(.85)', offset: (i / (n + 1)) * 0.9 });\n frames.push({ transform: 'none', opacity: 1, filter: 'none', offset: 1 });\n const prev = el.style.transformOrigin;\n el.style.transformOrigin = 'top center';\n ctx.onCleanup(() => (el.style.transformOrigin = prev));\n return ctx.animate(el, frames, { duration: o.duration, easing: 'ease-out', fill: 'backwards' })?.finished.catch(() => undefined);\n },\n },\n {\n name: 'pencil-sketch',\n kind: 'enter',\n description: 'SVG strokes inside are sketched in with a slightly wobbly pencil, one after another (`duration`, `stagger`).',\n defaults: { duration: 700, stagger: 120 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n const strokes = Array.from(el.querySelectorAll<SVGGeometryElement>('path, line, polyline, rect, circle, ellipse'));\n const runs = strokes.map((p, i) => {\n let len = 200;\n try {\n len = p.getTotalLength?.() || 200;\n } catch {\n /* not rendered */\n }\n const prev = p.style.strokeDasharray;\n p.style.strokeDasharray = `${len}`;\n ctx.onCleanup(() => (p.style.strokeDasharray = prev));\n return ctx.animate(p, [{ strokeDashoffset: `${len}`, transform: 'translate(0.6px,-0.4px)' }, { transform: 'translate(-0.5px,0.5px)', offset: 0.5 }, { strokeDashoffset: '0', transform: 'none' }], { duration: o.duration, delay: i * (Number(o.stagger) || 0), easing: 'cubic-bezier(.5,.1,.4,1)', fill: 'backwards' })?.finished.catch(() => undefined);\n });\n return Promise.all(runs).then(() => undefined);\n },\n },\n {\n name: 'watercolor',\n kind: 'enter',\n description: 'The element bleeds in like wet watercolour — blurred and saturated, spreading from the middle — then dries (`duration`).',\n defaults: { duration: 1400 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return fade(el, ctx);\n return ctx.animate(\n el,\n [\n { opacity: 0, filter: 'blur(10px) saturate(2.2)', clipPath: 'circle(8% at 50% 50%)' },\n { opacity: 0.9, filter: 'blur(4px) saturate(1.8)', clipPath: 'circle(55% at 48% 52%)', offset: 0.5 },\n { opacity: 1, filter: 'blur(0) saturate(1)', clipPath: 'circle(150% at 50% 50%)' },\n ],\n { duration: o.duration, easing: 'ease-out', fill: 'backwards' }\n )?.finished.catch(() => undefined);\n },\n },\n {\n name: 'crumple',\n kind: 'attention',\n description: 'The element scrunches like crumpled paper and springs back flat.',\n defaults: { duration: 700 },\n run: (el: HTMLElement, o: any, ctx: EffectContext) => {\n if (ctx.reduced) return;\n return ctx.animate(\n el,\n [\n { transform: 'none' },\n { transform: 'scale(.82,.9) rotate(-4deg) skewX(6deg)', filter: 'brightness(.9)', offset: 0.3 },\n { transform: 'scale(.9,.8) rotate(3deg) skewY(-5deg)', offset: 0.5 },\n { transform: 'scale(1.04) rotate(-1deg)', filter: 'none', offset: 0.8 },\n { transform: 'none' },\n ],\n { duration: o.duration, easing: 'ease-in-out' }\n )?.finished.catch(() => undefined);\n },\n },\n];\n\n/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */\nexport function registerPaperPack(): void {\n registerEffects(PAPER_FX);\n}\n"],"names":[],"mappings":";;;AAkBA;AACM,SAAU,WAAW,CAAC,IAAY,EAAA;AACtC,IAAA,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,GAAG,MAAM,IAAI,EAAE;AACxD,IAAA,OAAO,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,KAAK,IAAI,MAAM,IAAI,MAAM;AACzD;AAEA;SACgB,SAAS,CAAC,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,EAAA;AAC3F,IAAA,MAAM,CAAC,GAAG,WAAW,CAAC,IAAI,CAAC;AAC3B,IAAA,MAAM,CAAC,GAAG,MAAM,CAAC,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG;AACrC,IAAA,MAAM,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,GAAG;AACpC,IAAA,MAAM,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,GAAG;AACpC,IAAA,MAAM,CAAC,GAAG,CAAC,CAAS,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE;AAChD,IAAA,OAAO,IAAI,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAA,CAAA,EAAI,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAA,EAAA,EAAK,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAA,CAAA,EAAI,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAA,CAAA,EAAI,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EAAE;AAC1F;AAEA,MAAM,IAAI,GAAG,CAAC,EAAe,EAAE,GAAkB,KAAK,GAAG,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,SAAS,CAAC;AAEpJ,MAAM,QAAQ,GAAuB;AAC1C,IAAA;AACE,QAAA,IAAI,EAAE,cAAc;AACpB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,WAAW,EAAE,wFAAwF;QACrG,QAAQ,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE;QACrC,GAAG,EAAE,CAAC,EAAe,EAAE,CAAM,EAAE,GAAkB,KAAI;YACnD,IAAI,GAAG,CAAC,OAAO;AAAE,gBAAA,OAAO,IAAI,CAAC,EAAE,EAAE,GAAG,CAAC;AACrC,YAAA,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YACpE,MAAM,MAAM,GAAe,CAAC,EAAE,SAAS,EAAE,oCAAoC,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;YACjI,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AAAE,gBAAA,MAAM,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,CAAA,2BAAA,EAA8B,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,GAAG,CAAA,YAAA,EAAe,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA,CAAA,CAAG,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,iBAAiB,EAAE,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,EAAE,CAAC;YACnO,MAAM,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;AACzE,YAAA,MAAM,IAAI,GAAG,EAAE,CAAC,KAAK,CAAC,eAAe;AACrC,YAAA,EAAE,CAAC,KAAK,CAAC,eAAe,GAAG,YAAY;AACvC,YAAA,GAAG,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;AACtD,YAAA,OAAO,GAAG,CAAC,OAAO,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,SAAS,CAAC;QAClI,CAAC;AACF,KAAA;AACD,IAAA;AACE,QAAA,IAAI,EAAE,eAAe;AACrB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,WAAW,EAAE,8GAA8G;QAC3H,QAAQ,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE;QACzC,GAAG,EAAE,CAAC,EAAe,EAAE,CAAM,EAAE,GAAkB,KAAI;YACnD,IAAI,GAAG,CAAC,OAAO;gBAAE;AACjB,YAAA,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAqB,6CAA6C,CAAC,CAAC;YAClH,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAI;gBAChC,IAAI,GAAG,GAAG,GAAG;AACb,gBAAA,IAAI;oBACF,GAAG,GAAG,CAAC,CAAC,cAAc,IAAI,IAAI,GAAG;gBACnC;AAAE,gBAAA,MAAM;;gBAER;AACA,gBAAA,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,eAAe;gBACpC,CAAC,CAAC,KAAK,CAAC,eAAe,GAAG,CAAA,EAAG,GAAG,EAAE;AAClC,gBAAA,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;AACrD,gBAAA,OAAO,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,gBAAgB,EAAE,GAAG,GAAG,CAAA,CAAE,EAAE,SAAS,EAAE,yBAAyB,EAAE,EAAE,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,EAAE,gBAAgB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,0BAA0B,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,SAAS,CAAC;AAC3V,YAAA,CAAC,CAAC;AACF,YAAA,OAAO,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM,SAAS,CAAC;QAChD,CAAC;AACF,KAAA;AACD,IAAA;AACE,QAAA,IAAI,EAAE,YAAY;AAClB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,WAAW,EAAE,0HAA0H;AACvI,QAAA,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;QAC5B,GAAG,EAAE,CAAC,EAAe,EAAE,CAAM,EAAE,GAAkB,KAAI;YACnD,IAAI,GAAG,CAAC,OAAO;AAAE,gBAAA,OAAO,IAAI,CAAC,EAAE,EAAE,GAAG,CAAC;AACrC,YAAA,OAAO,GAAG,CAAC,OAAO,CAChB,EAAE,EACF;gBACE,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,0BAA0B,EAAE,QAAQ,EAAE,uBAAuB,EAAE;AACrF,gBAAA,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,yBAAyB,EAAE,QAAQ,EAAE,wBAAwB,EAAE,MAAM,EAAE,GAAG,EAAE;gBACpG,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,qBAAqB,EAAE,QAAQ,EAAE,yBAAyB,EAAE;aACnF,EACD,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,CAChE,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,SAAS,CAAC;QACpC,CAAC;AACF,KAAA;AACD,IAAA;AACE,QAAA,IAAI,EAAE,SAAS;AACf,QAAA,IAAI,EAAE,WAAW;AACjB,QAAA,WAAW,EAAE,kEAAkE;AAC/E,QAAA,QAAQ,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QAC3B,GAAG,EAAE,CAAC,EAAe,EAAE,CAAM,EAAE,GAAkB,KAAI;YACnD,IAAI,GAAG,CAAC,OAAO;gBAAE;AACjB,YAAA,OAAO,GAAG,CAAC,OAAO,CAChB,EAAE,EACF;gBACE,EAAE,SAAS,EAAE,MAAM,EAAE;gBACrB,EAAE,SAAS,EAAE,yCAAyC,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,EAAE,GAAG,EAAE;AAC/F,gBAAA,EAAE,SAAS,EAAE,wCAAwC,EAAE,MAAM,EAAE,GAAG,EAAE;gBACpE,EAAE,SAAS,EAAE,2BAA2B,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE;gBACvE,EAAE,SAAS,EAAE,MAAM,EAAE;aACtB,EACD,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,CAChD,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,SAAS,CAAC;QACpC,CAAC;AACF,KAAA;;AAGH;SACgB,iBAAiB,GAAA;IAC/B,eAAe,CAAC,QAAQ,CAAC;AAC3B;;;;"}
|
package/dist/components/fx2.cjs
CHANGED
|
@@ -21,6 +21,8 @@ var components_fxAi = require('./fx-ai.cjs');
|
|
|
21
21
|
var components_fxFestival = require('./fx-festival.cjs');
|
|
22
22
|
var components_fxRetro = require('./fx-retro.cjs');
|
|
23
23
|
var components_fxOrganic = require('./fx-organic.cjs');
|
|
24
|
+
var components_fxCyber = require('./fx-cyber.cjs');
|
|
25
|
+
var components_fxPaper = require('./fx-paper.cjs');
|
|
24
26
|
require('../chunks/registry-BVklOepd.cjs');
|
|
25
27
|
require('../chunks/base-DoRUZBy-.cjs');
|
|
26
28
|
require('../chunks/generative-BHIj-NU0.cjs');
|
|
@@ -49,6 +51,8 @@ const EFFECT_PACKS = {
|
|
|
49
51
|
festival: components_fxFestival.FESTIVAL_FX,
|
|
50
52
|
retro: components_fxRetro.RETRO_FX,
|
|
51
53
|
organic: components_fxOrganic.ORGANIC_FX,
|
|
54
|
+
cyber: components_fxCyber.CYBER_FX,
|
|
55
|
+
paper: components_fxPaper.PAPER_FX,
|
|
52
56
|
};
|
|
53
57
|
/** Register every 6.x effect pack (idempotent). */
|
|
54
58
|
function registerEffectPacks() {
|
|
@@ -72,6 +76,8 @@ function registerEffectPacks() {
|
|
|
72
76
|
components_fxFestival.registerFestivalPack();
|
|
73
77
|
components_fxRetro.registerRetroPack();
|
|
74
78
|
components_fxOrganic.registerOrganicPack();
|
|
79
|
+
components_fxCyber.registerCyberPack();
|
|
80
|
+
components_fxPaper.registerPaperPack();
|
|
75
81
|
}
|
|
76
82
|
|
|
77
83
|
exports.EFFECT_PACK_FORMAT = components_marketplace.EFFECT_PACK_FORMAT;
|
|
@@ -147,6 +153,13 @@ exports.registerRetroPack = components_fxRetro.registerRetroPack;
|
|
|
147
153
|
exports.ORGANIC_FX = components_fxOrganic.ORGANIC_FX;
|
|
148
154
|
exports.blobRadius = components_fxOrganic.blobRadius;
|
|
149
155
|
exports.registerOrganicPack = components_fxOrganic.registerOrganicPack;
|
|
156
|
+
exports.CYBER_FX = components_fxCyber.CYBER_FX;
|
|
157
|
+
exports.decodeFrame = components_fxCyber.decodeFrame;
|
|
158
|
+
exports.registerCyberPack = components_fxCyber.registerCyberPack;
|
|
159
|
+
exports.PAPER_FX = components_fxPaper.PAPER_FX;
|
|
160
|
+
exports.paperRandom = components_fxPaper.paperRandom;
|
|
161
|
+
exports.registerPaperPack = components_fxPaper.registerPaperPack;
|
|
162
|
+
exports.roughLine = components_fxPaper.roughLine;
|
|
150
163
|
exports.EFFECT_PACKS = EFFECT_PACKS;
|
|
151
164
|
exports.registerEffectPacks = registerEffectPacks;
|
|
152
165
|
//# 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';\nimport { FESTIVAL_FX, registerFestivalPack, sparkVectors } from './festival';\nimport { RETRO_FX, registerRetroPack, pixelSteps } from './retro2';\nimport { ORGANIC_FX, registerOrganicPack, blobRadius } from './organic';\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\nexport { RETRO_FX, registerRetroPack, pixelSteps };\n\nexport { ORGANIC_FX, registerOrganicPack, blobRadius };\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 retro: RETRO_FX,\n organic: ORGANIC_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 registerRetroPack();\n registerOrganicPack();\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","RETRO_FX","ORGANIC_FX","registerGpuPack","registerTextPack","registerLightPack","register3dPack","registerMorphPack","registerTransitionsPack","registerWeatherPack","registerPhysicsPack","registerFocusPack","registerMusicPack","registerChartPack","registerShopPack","registerSocialPack","registerGamePack","registerGeoPack","registerFormPack","registerAiPack","registerFestivalPack","registerRetroPack","registerOrganicPack"],"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';\nimport { RETRO_FX, registerRetroPack, pixelSteps } from './retro2';\nimport { ORGANIC_FX, registerOrganicPack, blobRadius } from './organic';\nimport { CYBER_FX, registerCyberPack, decodeFrame } from './cyber';\nimport { PAPER_FX, registerPaperPack, roughLine, paperRandom } from './paper';\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\nexport { RETRO_FX, registerRetroPack, pixelSteps };\n\nexport { ORGANIC_FX, registerOrganicPack, blobRadius };\n\nexport { CYBER_FX, registerCyberPack, decodeFrame };\n\nexport { PAPER_FX, registerPaperPack, roughLine, paperRandom };\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 retro: RETRO_FX,\n organic: ORGANIC_FX,\n cyber: CYBER_FX,\n paper: PAPER_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 registerRetroPack();\n registerOrganicPack();\n registerCyberPack();\n registerPaperPack();\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","RETRO_FX","ORGANIC_FX","CYBER_FX","PAPER_FX","registerGpuPack","registerTextPack","registerLightPack","register3dPack","registerMorphPack","registerTransitionsPack","registerWeatherPack","registerPhysicsPack","registerFocusPack","registerMusicPack","registerChartPack","registerShopPack","registerSocialPack","registerGamePack","registerGeoPack","registerFormPack","registerAiPack","registerFestivalPack","registerRetroPack","registerOrganicPack","registerCyberPack","registerPaperPack"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4EA;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;AACrB,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,OAAO,EAAEC,+BAAU;AACnB,IAAA,KAAK,EAAEC,2BAAQ;AACf,IAAA,KAAK,EAAEC,2BAAQ;;AAGjB;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;AACtB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,wCAAmB,EAAE;AACrB,IAAAC,oCAAiB,EAAE;AACnB,IAAAC,oCAAiB,EAAE;AACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -654,6 +654,52 @@ declare const ORGANIC_FX: EffectDefinition[];
|
|
|
654
654
|
/** Register vine-grow, bloom, water-drop and breathe (8.3). */
|
|
655
655
|
declare function registerOrganicPack(): void;
|
|
656
656
|
|
|
657
|
+
/**
|
|
658
|
+
* 8.4 — Cyber / sci-fi pack (`motionary/fx/cyber`, also `motionary/components/fx-cyber`):
|
|
659
|
+
*
|
|
660
|
+
* - `hud-frame` (enter) — corner brackets draw in around the element and a
|
|
661
|
+
* scan bar sweeps across it, like a HUD locking on (`color`).
|
|
662
|
+
* - `scanline-sweep` (attention) — a bright horizontal scanline runs down
|
|
663
|
+
* the element (`color`, `passes`).
|
|
664
|
+
* - `hologram` (loop) — a flickering, translucent cyan hologram look with
|
|
665
|
+
* drifting scan bands; the cleanup restores the element (`color`).
|
|
666
|
+
* - `data-decode` (enter) — the text resolves from random glyphs to the real
|
|
667
|
+
* characters, left to right (`speed`).
|
|
668
|
+
*
|
|
669
|
+
* Reduced motion: hud-frame / data-decode just show, scanline-sweep does
|
|
670
|
+
* nothing, hologram is skipped. Overlays are `aria-hidden` and removed.
|
|
671
|
+
*/
|
|
672
|
+
|
|
673
|
+
/** The `k`-th frame of decoding `text` over `n` frames: resolved prefix + random glyphs (8.4). */
|
|
674
|
+
declare function decodeFrame(text: string, k: number, n: number, rnd?: () => number): string;
|
|
675
|
+
declare const CYBER_FX: EffectDefinition[];
|
|
676
|
+
/** Register hud-frame, scanline-sweep, hologram and data-decode (8.4). */
|
|
677
|
+
declare function registerCyberPack(): void;
|
|
678
|
+
|
|
679
|
+
/**
|
|
680
|
+
* 8.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):
|
|
681
|
+
*
|
|
682
|
+
* - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,
|
|
683
|
+
* top flap first, with a soft crease shadow (`folds`).
|
|
684
|
+
* - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a
|
|
685
|
+
* slightly wobbly pencil, one after another (`duration`, `stagger`).
|
|
686
|
+
* - `watercolor` (enter) — the element bleeds in like wet watercolour:
|
|
687
|
+
* blurred, saturated, spreading from the middle, then dries (`duration`).
|
|
688
|
+
* - `crumple` (attention) — the element scrunches like crumpled paper and
|
|
689
|
+
* springs back flat.
|
|
690
|
+
*
|
|
691
|
+
* Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the
|
|
692
|
+
* drawing, crumple does nothing.
|
|
693
|
+
*/
|
|
694
|
+
|
|
695
|
+
/** A deterministic PRNG in [0, 1) from a seed (8.5). */
|
|
696
|
+
declare function paperRandom(seed: number): () => number;
|
|
697
|
+
/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */
|
|
698
|
+
declare function roughLine(x1: number, y1: number, x2: number, y2: number, seed?: number, amp?: number): string;
|
|
699
|
+
declare const PAPER_FX: EffectDefinition[];
|
|
700
|
+
/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */
|
|
701
|
+
declare function registerPaperPack(): void;
|
|
702
|
+
|
|
657
703
|
/**
|
|
658
704
|
* 5.5 — generative backgrounds on Canvas 2D, registered through
|
|
659
705
|
* `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
|
|
@@ -763,5 +809,5 @@ declare const EFFECT_PACKS: Record<string, EffectDefinition[]>;
|
|
|
763
809
|
/** Register every 6.x effect pack (idempotent). */
|
|
764
810
|
declare function registerEffectPacks(): void;
|
|
765
811
|
|
|
766
|
-
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, ORGANIC_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, blobRadius, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pixelSteps, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
812
|
+
export { AI_FX, CHART_FX, CYBER_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, ORGANIC_FX, PAPER_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, blobRadius, crossDocumentTransitions, decodeFrame, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, paperRandom, parseFigure, pixelSteps, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerCyberPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPaperPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, roughLine, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
767
813
|
export type { EffectPackManifest, ShaderSpec };
|
package/dist/components/fx2.d.ts
CHANGED
|
@@ -654,6 +654,52 @@ declare const ORGANIC_FX: EffectDefinition[];
|
|
|
654
654
|
/** Register vine-grow, bloom, water-drop and breathe (8.3). */
|
|
655
655
|
declare function registerOrganicPack(): void;
|
|
656
656
|
|
|
657
|
+
/**
|
|
658
|
+
* 8.4 — Cyber / sci-fi pack (`motionary/fx/cyber`, also `motionary/components/fx-cyber`):
|
|
659
|
+
*
|
|
660
|
+
* - `hud-frame` (enter) — corner brackets draw in around the element and a
|
|
661
|
+
* scan bar sweeps across it, like a HUD locking on (`color`).
|
|
662
|
+
* - `scanline-sweep` (attention) — a bright horizontal scanline runs down
|
|
663
|
+
* the element (`color`, `passes`).
|
|
664
|
+
* - `hologram` (loop) — a flickering, translucent cyan hologram look with
|
|
665
|
+
* drifting scan bands; the cleanup restores the element (`color`).
|
|
666
|
+
* - `data-decode` (enter) — the text resolves from random glyphs to the real
|
|
667
|
+
* characters, left to right (`speed`).
|
|
668
|
+
*
|
|
669
|
+
* Reduced motion: hud-frame / data-decode just show, scanline-sweep does
|
|
670
|
+
* nothing, hologram is skipped. Overlays are `aria-hidden` and removed.
|
|
671
|
+
*/
|
|
672
|
+
|
|
673
|
+
/** The `k`-th frame of decoding `text` over `n` frames: resolved prefix + random glyphs (8.4). */
|
|
674
|
+
declare function decodeFrame(text: string, k: number, n: number, rnd?: () => number): string;
|
|
675
|
+
declare const CYBER_FX: EffectDefinition[];
|
|
676
|
+
/** Register hud-frame, scanline-sweep, hologram and data-decode (8.4). */
|
|
677
|
+
declare function registerCyberPack(): void;
|
|
678
|
+
|
|
679
|
+
/**
|
|
680
|
+
* 8.5 — Paper & hand-drawn pack (`motionary/fx/paper`, also `motionary/components/fx-paper`):
|
|
681
|
+
*
|
|
682
|
+
* - `paper-unfold` (enter) — the element unfolds like a folded sheet of paper,
|
|
683
|
+
* top flap first, with a soft crease shadow (`folds`).
|
|
684
|
+
* - `pencil-sketch` (enter) — SVG strokes inside are sketched in with a
|
|
685
|
+
* slightly wobbly pencil, one after another (`duration`, `stagger`).
|
|
686
|
+
* - `watercolor` (enter) — the element bleeds in like wet watercolour:
|
|
687
|
+
* blurred, saturated, spreading from the middle, then dries (`duration`).
|
|
688
|
+
* - `crumple` (attention) — the element scrunches like crumpled paper and
|
|
689
|
+
* springs back flat.
|
|
690
|
+
*
|
|
691
|
+
* Reduced motion: paper-unfold / watercolor fade in, pencil-sketch shows the
|
|
692
|
+
* drawing, crumple does nothing.
|
|
693
|
+
*/
|
|
694
|
+
|
|
695
|
+
/** A deterministic PRNG in [0, 1) from a seed (8.5). */
|
|
696
|
+
declare function paperRandom(seed: number): () => number;
|
|
697
|
+
/** A hand-drawn SVG path from (x1,y1) to (x2,y2): a slightly bowed, wobbly line (8.5). */
|
|
698
|
+
declare function roughLine(x1: number, y1: number, x2: number, y2: number, seed?: number, amp?: number): string;
|
|
699
|
+
declare const PAPER_FX: EffectDefinition[];
|
|
700
|
+
/** Register paper-unfold, pencil-sketch, watercolor and crumple (8.5). */
|
|
701
|
+
declare function registerPaperPack(): void;
|
|
702
|
+
|
|
657
703
|
/**
|
|
658
704
|
* 5.5 — generative backgrounds on Canvas 2D, registered through
|
|
659
705
|
* `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
|
|
@@ -763,5 +809,5 @@ declare const EFFECT_PACKS: Record<string, EffectDefinition[]>;
|
|
|
763
809
|
/** Register every 6.x effect pack (idempotent). */
|
|
764
810
|
declare function registerEffectPacks(): void;
|
|
765
811
|
|
|
766
|
-
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, ORGANIC_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, blobRadius, crossDocumentTransitions, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, parseFigure, pixelSteps, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
812
|
+
export { AI_FX, CHART_FX, CYBER_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, ORGANIC_FX, PAPER_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, VerletWorld, WEATHER_FX, WGSL_HEAD, arcPath, blobRadius, crossDocumentTransitions, decodeFrame, fanAngles, fieldFallback, glslToWgsl, loadEffectPack, musicSample, packManifest, pageTransition, paperRandom, parseFigure, pixelSteps, pointsToPath, register3dPack, registerAiPack, registerChartPack, registerCyberPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPaperPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack, roughLine, routeLength, samplePath, shaderBackground, shakeFrames, skyAt, sparkVectors, splitChars, splitWords, supportsWebGL2, supportsWebGPU, syntheticSample, throwPath, trackPointer, validateManifest, webgpuBackground, wgslModule };
|
|
767
813
|
export type { EffectPackManifest, ShaderSpec };
|
package/dist/components/fx2.js
CHANGED
|
@@ -37,6 +37,10 @@ import { RETRO_FX, registerRetroPack } from './fx-retro.js';
|
|
|
37
37
|
export { pixelSteps } from './fx-retro.js';
|
|
38
38
|
import { ORGANIC_FX, registerOrganicPack } from './fx-organic.js';
|
|
39
39
|
export { blobRadius } from './fx-organic.js';
|
|
40
|
+
import { CYBER_FX, registerCyberPack } from './fx-cyber.js';
|
|
41
|
+
export { decodeFrame } from './fx-cyber.js';
|
|
42
|
+
import { PAPER_FX, registerPaperPack } from './fx-paper.js';
|
|
43
|
+
export { paperRandom, roughLine } from './fx-paper.js';
|
|
40
44
|
import '../chunks/registry-CnO7ZVPK.js';
|
|
41
45
|
import '../chunks/base-CLuqlLfG.js';
|
|
42
46
|
import '../chunks/generative-2LhxG5BJ.js';
|
|
@@ -65,6 +69,8 @@ const EFFECT_PACKS = {
|
|
|
65
69
|
festival: FESTIVAL_FX,
|
|
66
70
|
retro: RETRO_FX,
|
|
67
71
|
organic: ORGANIC_FX,
|
|
72
|
+
cyber: CYBER_FX,
|
|
73
|
+
paper: PAPER_FX,
|
|
68
74
|
};
|
|
69
75
|
/** Register every 6.x effect pack (idempotent). */
|
|
70
76
|
function registerEffectPacks() {
|
|
@@ -88,7 +94,9 @@ function registerEffectPacks() {
|
|
|
88
94
|
registerFestivalPack();
|
|
89
95
|
registerRetroPack();
|
|
90
96
|
registerOrganicPack();
|
|
97
|
+
registerCyberPack();
|
|
98
|
+
registerPaperPack();
|
|
91
99
|
}
|
|
92
100
|
|
|
93
|
-
export { AI_FX, CHART_FX, DEPTH3_FX, EFFECT_PACKS, FESTIVAL_FX, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, ORGANIC_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, WEATHER_FX, register3dPack, registerAiPack, registerChartPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack };
|
|
101
|
+
export { AI_FX, CHART_FX, CYBER_FX, DEPTH3_FX, EFFECT_PACKS, FESTIVAL_FX, FOCUS_FX, FORM_FX, GAME_FX, GEO_FX, GPU_FX, LIGHT_FX, MORPH2_FX, MUSIC_FX, ORGANIC_FX, PAPER_FX, PHYSICS2_FX, RETRO_FX, SHOP_FX, SOCIAL_FX, TEXT3_FX, TRANSITIONS2_FX, WEATHER_FX, register3dPack, registerAiPack, registerChartPack, registerCyberPack, registerEffectPacks, registerFestivalPack, registerFocusPack, registerFormPack, registerGamePack, registerGeoPack, registerGpuPack, registerLightPack, registerMorphPack, registerMusicPack, registerOrganicPack, registerPaperPack, registerPhysicsPack, registerRetroPack, registerShopPack, registerSocialPack, registerTextPack, registerTransitionsPack, registerWeatherPack };
|
|
94
102
|
//# sourceMappingURL=fx2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fx2.js","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';\nimport { RETRO_FX, registerRetroPack, pixelSteps } from './retro2';\nimport { ORGANIC_FX, registerOrganicPack, blobRadius } from './organic';\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\nexport { RETRO_FX, registerRetroPack, pixelSteps };\n\nexport { ORGANIC_FX, registerOrganicPack, blobRadius };\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 retro: RETRO_FX,\n organic: ORGANIC_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 registerRetroPack();\n registerOrganicPack();\n}\n\n\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"fx2.js","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';\nimport { RETRO_FX, registerRetroPack, pixelSteps } from './retro2';\nimport { ORGANIC_FX, registerOrganicPack, blobRadius } from './organic';\nimport { CYBER_FX, registerCyberPack, decodeFrame } from './cyber';\nimport { PAPER_FX, registerPaperPack, roughLine, paperRandom } from './paper';\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\nexport { RETRO_FX, registerRetroPack, pixelSteps };\n\nexport { ORGANIC_FX, registerOrganicPack, blobRadius };\n\nexport { CYBER_FX, registerCyberPack, decodeFrame };\n\nexport { PAPER_FX, registerPaperPack, roughLine, paperRandom };\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 retro: RETRO_FX,\n organic: ORGANIC_FX,\n cyber: CYBER_FX,\n paper: PAPER_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 registerRetroPack();\n registerOrganicPack();\n registerCyberPack();\n registerPaperPack();\n}\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4EA;AACO,MAAM,YAAY,GAAuC;AAC9D,IAAA,GAAG,EAAE,MAAM;AACX,IAAA,IAAI,EAAE,QAAQ;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,WAAW,EAAE,eAAe;AAC5B,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,IAAI,EAAE,OAAO;AACb,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,IAAI,EAAE,OAAO;AACb,IAAA,GAAG,EAAE,MAAM;AACX,IAAA,IAAI,EAAE,OAAO;AACb,IAAA,EAAE,EAAE,KAAK;AACT,IAAA,QAAQ,EAAE,WAAW;AACrB,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;;AAGjB;SACgB,mBAAmB,GAAA;AACjC,IAAA,eAAe,EAAE;AACjB,IAAA,gBAAgB,EAAE;AAClB,IAAA,iBAAiB,EAAE;AACnB,IAAA,cAAc,EAAE;AAChB,IAAA,iBAAiB,EAAE;AACnB,IAAA,uBAAuB,EAAE;AACzB,IAAA,mBAAmB,EAAE;AACrB,IAAA,mBAAmB,EAAE;AACrB,IAAA,iBAAiB,EAAE;AACnB,IAAA,iBAAiB,EAAE;AACnB,IAAA,iBAAiB,EAAE;AACnB,IAAA,gBAAgB,EAAE;AAClB,IAAA,kBAAkB,EAAE;AACpB,IAAA,gBAAgB,EAAE;AAClB,IAAA,eAAe,EAAE;AACjB,IAAA,gBAAgB,EAAE;AAClB,IAAA,cAAc,EAAE;AAChB,IAAA,oBAAoB,EAAE;AACtB,IAAA,iBAAiB,EAAE;AACnB,IAAA,mBAAmB,EAAE;AACrB,IAAA,iBAAiB,EAAE;AACnB,IAAA,iBAAiB,EAAE;AACrB;;;;"}
|