use-scroll-animate 6.6.0 → 6.7.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.
Files changed (40) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/chunks/{gpu-EjV49FQk.js → gpu-CsP2ZB3x.js} +2 -2
  3. package/dist/chunks/{gpu-EjV49FQk.js.map → gpu-CsP2ZB3x.js.map} +1 -1
  4. package/dist/chunks/{registry-Bu5NrAyA.js → registry-D23neB4M.js} +2 -2
  5. package/dist/chunks/{registry-Bu5NrAyA.js.map → registry-D23neB4M.js.map} +1 -1
  6. package/dist/components/angular.js +1 -1
  7. package/dist/components/effects.js +1 -1
  8. package/dist/components/fx-3d.js +1 -1
  9. package/dist/components/fx-gpu.js +2 -2
  10. package/dist/components/fx-light.js +1 -1
  11. package/dist/components/fx-morph.js +1 -1
  12. package/dist/components/fx-text.js +1 -1
  13. package/dist/components/fx-transitions.cjs +249 -0
  14. package/dist/components/fx-transitions.cjs.map +1 -0
  15. package/dist/components/fx-transitions.d.cts +77 -0
  16. package/dist/components/fx-transitions.d.ts +77 -0
  17. package/dist/components/fx-transitions.js +244 -0
  18. package/dist/components/fx-transitions.js.map +1 -0
  19. package/dist/components/fx.js +2 -2
  20. package/dist/components/fx2.cjs +7 -0
  21. package/dist/components/fx2.cjs.map +1 -1
  22. package/dist/components/fx2.d.cts +34 -1
  23. package/dist/components/fx2.d.ts +34 -1
  24. package/dist/components/fx2.js +8 -4
  25. package/dist/components/fx2.js.map +1 -1
  26. package/dist/components/solid.js +1 -1
  27. package/dist/components/svelte.js +1 -1
  28. package/dist/components/vue.js +1 -1
  29. package/dist/components/widgets.cjs +458 -37
  30. package/dist/components/widgets.cjs.map +1 -1
  31. package/dist/components/widgets.d.cts +72 -2
  32. package/dist/components/widgets.d.ts +72 -2
  33. package/dist/components/widgets.js +452 -38
  34. package/dist/components/widgets.js.map +1 -1
  35. package/dist/components.js +1 -1
  36. package/dist/widgets.umd.js +1 -1
  37. package/dist/widgets.umd.js.map +1 -1
  38. package/docs/ROADMAP.md +1 -1
  39. package/docs/components.md +23 -0
  40. package/package.json +11 -1
@@ -164,6 +164,39 @@ declare const MORPH2_FX: EffectDefinition[];
164
164
  /** Register the 6.6 morph & SVG pack (idempotent). */
165
165
  declare function registerMorphEffects2(): void;
166
166
 
167
+ /**
168
+ * 6.7 — Transitions 2.0 (`motionary/components/fx-transitions`), registered
169
+ * through `registerEffect()` (kind `page`; option `mode: 'in' | 'out'`):
170
+ *
171
+ * - `ripple-dissolve` — a circle with a ripple ring grows from the pointer
172
+ * (or `x` / `y` 0–1) and reveals / hides the element.
173
+ * - `shatter` — the element breaks into shards that fly apart (out) or
174
+ * fly together (in).
175
+ * - `mosaic-flip` — a grid of tiles flips over in a diagonal wave.
176
+ * - `liquid-wipe` — a wavy liquid edge sweeps across.
177
+ * - `page-curl` — the element turns like a page around its left edge.
178
+ * - `camera-dolly` — a dolly zoom: scale + depth blur + fade.
179
+ *
180
+ * `pageTransition(update, effect)` runs a DOM update inside the View
181
+ * Transitions API (when available) and plays the effect on the new snapshot;
182
+ * without the API it runs `update()` and plays the effect on `target`.
183
+ * `crossDocumentTransitions(effect)` opts an MPA into cross-document view
184
+ * transitions (`@view-transition { navigation: auto }`) with the same look.
185
+ * Reduced motion: plain short fades.
186
+ */
187
+
188
+ declare const TRANSITIONS2_FX: EffectDefinition[];
189
+ /**
190
+ * Run `update` (a DOM change) as a transition: inside `document.startViewTransition`
191
+ * when supported (the new snapshot plays `effect`), otherwise `update()` then the
192
+ * effect on `target` (default `document.body`'s first element).
193
+ */
194
+ declare function pageTransition(update: () => void | Promise<void>, effect?: string, options?: Record<string, unknown>, target?: HTMLElement): Promise<void>;
195
+ /** Opt a multi-page site into cross-document view transitions with an effect's look. Returns a remover. */
196
+ declare function crossDocumentTransitions(effect?: string, duration?: number): () => void;
197
+ /** Register the 6.7 transitions pack (idempotent). */
198
+ declare function registerTransitionEffects2(): void;
199
+
167
200
  /**
168
201
  * 5.5 — generative backgrounds on Canvas 2D, registered through
169
202
  * `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
@@ -236,5 +269,5 @@ declare const FX2_PACKS: Record<string, EffectDefinition[]>;
236
269
  /** Register every 6.x pack (idempotent). */
237
270
  declare function registerFx2(): void;
238
271
 
239
- export { DEPTH3_FX, FX2_PACKS, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, fieldFallback, pointsToPath, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3, samplePath, shaderBackground, splitChars, supportsWebGL2, trackPointer };
272
+ export { DEPTH3_FX, FX2_PACKS, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, TRANSITIONS2_FX, crossDocumentTransitions, fieldFallback, pageTransition, pointsToPath, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3, registerTransitionEffects2, samplePath, shaderBackground, splitChars, supportsWebGL2, trackPointer };
240
273
  export type { ShaderSpec };
@@ -164,6 +164,39 @@ declare const MORPH2_FX: EffectDefinition[];
164
164
  /** Register the 6.6 morph & SVG pack (idempotent). */
165
165
  declare function registerMorphEffects2(): void;
166
166
 
167
+ /**
168
+ * 6.7 — Transitions 2.0 (`motionary/components/fx-transitions`), registered
169
+ * through `registerEffect()` (kind `page`; option `mode: 'in' | 'out'`):
170
+ *
171
+ * - `ripple-dissolve` — a circle with a ripple ring grows from the pointer
172
+ * (or `x` / `y` 0–1) and reveals / hides the element.
173
+ * - `shatter` — the element breaks into shards that fly apart (out) or
174
+ * fly together (in).
175
+ * - `mosaic-flip` — a grid of tiles flips over in a diagonal wave.
176
+ * - `liquid-wipe` — a wavy liquid edge sweeps across.
177
+ * - `page-curl` — the element turns like a page around its left edge.
178
+ * - `camera-dolly` — a dolly zoom: scale + depth blur + fade.
179
+ *
180
+ * `pageTransition(update, effect)` runs a DOM update inside the View
181
+ * Transitions API (when available) and plays the effect on the new snapshot;
182
+ * without the API it runs `update()` and plays the effect on `target`.
183
+ * `crossDocumentTransitions(effect)` opts an MPA into cross-document view
184
+ * transitions (`@view-transition { navigation: auto }`) with the same look.
185
+ * Reduced motion: plain short fades.
186
+ */
187
+
188
+ declare const TRANSITIONS2_FX: EffectDefinition[];
189
+ /**
190
+ * Run `update` (a DOM change) as a transition: inside `document.startViewTransition`
191
+ * when supported (the new snapshot plays `effect`), otherwise `update()` then the
192
+ * effect on `target` (default `document.body`'s first element).
193
+ */
194
+ declare function pageTransition(update: () => void | Promise<void>, effect?: string, options?: Record<string, unknown>, target?: HTMLElement): Promise<void>;
195
+ /** Opt a multi-page site into cross-document view transitions with an effect's look. Returns a remover. */
196
+ declare function crossDocumentTransitions(effect?: string, duration?: number): () => void;
197
+ /** Register the 6.7 transitions pack (idempotent). */
198
+ declare function registerTransitionEffects2(): void;
199
+
167
200
  /**
168
201
  * 5.5 — generative backgrounds on Canvas 2D, registered through
169
202
  * `registerEffect()` (kind `background`): `flow-field`, `voronoi`,
@@ -236,5 +269,5 @@ declare const FX2_PACKS: Record<string, EffectDefinition[]>;
236
269
  /** Register every 6.x pack (idempotent). */
237
270
  declare function registerFx2(): void;
238
271
 
239
- export { DEPTH3_FX, FX2_PACKS, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, fieldFallback, pointsToPath, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3, samplePath, shaderBackground, splitChars, supportsWebGL2, trackPointer };
272
+ export { DEPTH3_FX, FX2_PACKS, GLSL_HEAD, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, TRANSITIONS2_FX, crossDocumentTransitions, fieldFallback, pageTransition, pointsToPath, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3, registerTransitionEffects2, samplePath, shaderBackground, splitChars, supportsWebGL2, trackPointer };
240
273
  export type { ShaderSpec };
@@ -1,5 +1,5 @@
1
- import { G as GPU_FX, r as registerGpuEffects } from '../chunks/gpu-EjV49FQk.js';
2
- export { a as GLSL_HEAD, f as fieldFallback, s as shaderBackground, b as supportsWebGL2 } from '../chunks/gpu-EjV49FQk.js';
1
+ import { G as GPU_FX, r as registerGpuEffects } from '../chunks/gpu-CsP2ZB3x.js';
2
+ export { a as GLSL_HEAD, f as fieldFallback, s as shaderBackground, b as supportsWebGL2 } from '../chunks/gpu-CsP2ZB3x.js';
3
3
  import { TEXT3_FX, registerTextEffects3 } from './fx-text.js';
4
4
  export { splitChars } from './fx-text.js';
5
5
  import { LIGHT_FX, registerLightEffects } from './fx-light.js';
@@ -7,7 +7,9 @@ export { trackPointer } from './fx-light.js';
7
7
  import { DEPTH3_FX, register3dEffects } from './fx-3d.js';
8
8
  import { MORPH2_FX, registerMorphEffects2 } from './fx-morph.js';
9
9
  export { pointsToPath, samplePath } from './fx-morph.js';
10
- import '../chunks/registry-Bu5NrAyA.js';
10
+ import { TRANSITIONS2_FX, registerTransitionEffects2 } from './fx-transitions.js';
11
+ export { crossDocumentTransitions, pageTransition } from './fx-transitions.js';
12
+ import '../chunks/registry-D23neB4M.js';
11
13
  import '../chunks/base-DchG4q_S.js';
12
14
  import '../chunks/generative-2LhxG5BJ.js';
13
15
  import '../chunks/shared-CkKHWrtJ.js';
@@ -19,6 +21,7 @@ const FX2_PACKS = {
19
21
  light: LIGHT_FX,
20
22
  depth: DEPTH3_FX,
21
23
  morph: MORPH2_FX,
24
+ transitions: TRANSITIONS2_FX,
22
25
  };
23
26
  /** Register every 6.x pack (idempotent). */
24
27
  function registerFx2() {
@@ -27,7 +30,8 @@ function registerFx2() {
27
30
  registerLightEffects();
28
31
  register3dEffects();
29
32
  registerMorphEffects2();
33
+ registerTransitionEffects2();
30
34
  }
31
35
 
32
- export { DEPTH3_FX, FX2_PACKS, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3 };
36
+ export { DEPTH3_FX, FX2_PACKS, GPU_FX, LIGHT_FX, MORPH2_FX, TEXT3_FX, TRANSITIONS2_FX, register3dEffects, registerFx2, registerGpuEffects, registerLightEffects, registerMorphEffects2, registerTextEffects3, registerTransitionEffects2 };
33
37
  //# 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';\nimport { GPU_FX, registerGpuEffects } from './gpu';\nimport { TEXT3_FX, registerTextEffects3, splitChars } from './text3';\nimport { LIGHT_FX, registerLightEffects, trackPointer } from './light';\nimport { DEPTH3_FX, register3dEffects } from './depth3';\nimport { MORPH2_FX, registerMorphEffects2, samplePath, pointsToPath } from './morph2';\n\nexport { GPU_FX, registerGpuEffects, TEXT3_FX, registerTextEffects3, splitChars };\nexport { shaderBackground, supportsWebGL2, fieldFallback, GLSL_HEAD } from './gl';\nexport type { ShaderSpec } from './gl';\n\nexport { LIGHT_FX, registerLightEffects, trackPointer };\n\nexport { DEPTH3_FX, register3dEffects };\n\nexport { MORPH2_FX, registerMorphEffects2, samplePath, pointsToPath };\n\n/** The 6.x effect packs by name. */\nexport const FX2_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};\n\n/** Register every 6.x pack (idempotent). */\nexport function registerFx2(): void {\n registerGpuEffects();\n registerTextEffects3();\n registerLightEffects();\n register3dEffects();\n registerMorphEffects2();\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAsBA;AACO,MAAM,SAAS,GAAuC;AAC3D,IAAA,GAAG,EAAE,MAAM;AACX,IAAA,IAAI,EAAE,QAAQ;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,KAAK,EAAE,SAAS;;AAGlB;SACgB,WAAW,GAAA;AACzB,IAAA,kBAAkB,EAAE;AACpB,IAAA,oBAAoB,EAAE;AACtB,IAAA,oBAAoB,EAAE;AACtB,IAAA,iBAAiB,EAAE;AACnB,IAAA,qBAAqB,EAAE;AACzB;;;;"}
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';\nimport { GPU_FX, registerGpuEffects } from './gpu';\nimport { TEXT3_FX, registerTextEffects3, splitChars } from './text3';\nimport { LIGHT_FX, registerLightEffects, trackPointer } from './light';\nimport { DEPTH3_FX, register3dEffects } from './depth3';\nimport { MORPH2_FX, registerMorphEffects2, samplePath, pointsToPath } from './morph2';\nimport { TRANSITIONS2_FX, registerTransitionEffects2, pageTransition, crossDocumentTransitions } from './transitions2';\n\nexport { GPU_FX, registerGpuEffects, TEXT3_FX, registerTextEffects3, splitChars };\nexport { shaderBackground, supportsWebGL2, fieldFallback, GLSL_HEAD } from './gl';\nexport type { ShaderSpec } from './gl';\n\nexport { LIGHT_FX, registerLightEffects, trackPointer };\n\nexport { DEPTH3_FX, register3dEffects };\n\nexport { MORPH2_FX, registerMorphEffects2, samplePath, pointsToPath };\n\nexport { TRANSITIONS2_FX, registerTransitionEffects2, pageTransition, crossDocumentTransitions };\n\n/** The 6.x effect packs by name. */\nexport const FX2_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};\n\n/** Register every 6.x pack (idempotent). */\nexport function registerFx2(): void {\n registerGpuEffects();\n registerTextEffects3();\n registerLightEffects();\n register3dEffects();\n registerMorphEffects2();\n registerTransitionEffects2();\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAyBA;AACO,MAAM,SAAS,GAAuC;AAC3D,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;;AAG9B;SACgB,WAAW,GAAA;AACzB,IAAA,kBAAkB,EAAE;AACpB,IAAA,oBAAoB,EAAE;AACtB,IAAA,oBAAoB,EAAE;AACtB,IAAA,iBAAiB,EAAE;AACnB,IAAA,qBAAqB,EAAE;AACvB,IAAA,0BAA0B,EAAE;AAC9B;;;;"}
@@ -28,7 +28,7 @@ import './depth.js';
28
28
  import './layout.js';
29
29
  import './packs.js';
30
30
  import './fx.js';
31
- import '../chunks/registry-Bu5NrAyA.js';
31
+ import '../chunks/registry-D23neB4M.js';
32
32
  import './a11y.js';
33
33
  import '../chunks/index-tags-DucKMQr_.js';
34
34
  import './perf.js';
@@ -27,7 +27,7 @@ import './depth.js';
27
27
  import './layout.js';
28
28
  import './packs.js';
29
29
  import './fx.js';
30
- import '../chunks/registry-Bu5NrAyA.js';
30
+ import '../chunks/registry-D23neB4M.js';
31
31
  import './a11y.js';
32
32
  import '../chunks/index-tags-DucKMQr_.js';
33
33
  import './perf.js';
@@ -25,7 +25,7 @@ import './depth.js';
25
25
  import './layout.js';
26
26
  import './packs.js';
27
27
  import './fx.js';
28
- import '../chunks/registry-Bu5NrAyA.js';
28
+ import '../chunks/registry-D23neB4M.js';
29
29
  import './a11y.js';
30
30
  import '../chunks/index-tags-DucKMQr_.js';
31
31
  import './perf.js';