use-scroll-animate 4.3.0 → 4.4.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/chunks/{base-BPG5zvex.js → base-BtJDNCB6.js} +45 -5
- package/dist/chunks/base-BtJDNCB6.js.map +1 -0
- package/dist/chunks/{base-CXx7jZ-o.cjs → base-DE2yzxE7.cjs} +47 -4
- package/dist/chunks/base-DE2yzxE7.cjs.map +1 -0
- package/dist/chunks/{core-BRIIoKeS.cjs → core-BC9S2osy.cjs} +2 -2
- package/dist/chunks/{core-BRIIoKeS.cjs.map → core-BC9S2osy.cjs.map} +1 -1
- package/dist/chunks/{core-IaorbTdu.cjs → core-DPYjLqA0.cjs} +2 -2
- package/dist/chunks/{core-IaorbTdu.cjs.map → core-DPYjLqA0.cjs.map} +1 -1
- package/dist/chunks/{core-LkGRmgES.js → core-DS1nrx5L.js} +2 -2
- package/dist/chunks/{core-LkGRmgES.js.map → core-DS1nrx5L.js.map} +1 -1
- package/dist/chunks/{core-eXX8rB_b.js → core-DX6pdOoY.js} +2 -2
- package/dist/chunks/{core-eXX8rB_b.js.map → core-DX6pdOoY.js.map} +1 -1
- package/dist/chunks/{spring-BziPsW3r.js → spring-CxRz49Wk.js} +2 -2
- package/dist/chunks/{spring-BziPsW3r.js.map → spring-CxRz49Wk.js.map} +1 -1
- package/dist/chunks/{spring-2OTnYCzm.cjs → spring-hsmgd7ml.cjs} +2 -2
- package/dist/chunks/{spring-2OTnYCzm.cjs.map → spring-hsmgd7ml.cjs.map} +1 -1
- package/dist/chunks/{variants-BNIrn4ch.cjs → variants-CM2zaG8v.cjs} +2 -2
- package/dist/chunks/{variants-BNIrn4ch.cjs.map → variants-CM2zaG8v.cjs.map} +1 -1
- package/dist/chunks/{variants-BVYMcxRv.js → variants-dD6SbUMR.js} +2 -2
- package/dist/chunks/{variants-BVYMcxRv.js.map → variants-dD6SbUMR.js.map} +1 -1
- package/dist/components/a11y.cjs +239 -0
- package/dist/components/a11y.cjs.map +1 -0
- package/dist/components/a11y.d.cts +120 -0
- package/dist/components/a11y.d.ts +120 -0
- package/dist/components/a11y.js +224 -0
- package/dist/components/a11y.js.map +1 -0
- package/dist/components/angular.cjs +6 -5
- package/dist/components/angular.cjs.map +1 -1
- package/dist/components/angular.js +6 -5
- package/dist/components/angular.js.map +1 -1
- package/dist/components/background.cjs +2 -2
- package/dist/components/background.d.cts +10 -0
- package/dist/components/background.d.ts +10 -0
- package/dist/components/background.js +3 -3
- package/dist/components/cards.cjs +2 -2
- package/dist/components/cards.d.cts +10 -0
- package/dist/components/cards.d.ts +10 -0
- package/dist/components/cards.js +3 -3
- package/dist/components/click.cjs +2 -2
- package/dist/components/click.d.cts +10 -0
- package/dist/components/click.d.ts +10 -0
- package/dist/components/click.js +3 -3
- package/dist/components/depth.cjs +3 -3
- package/dist/components/depth.d.cts +10 -0
- package/dist/components/depth.d.ts +10 -0
- package/dist/components/depth.js +4 -4
- package/dist/components/feedback.cjs +1 -1
- package/dist/components/feedback.d.cts +10 -0
- package/dist/components/feedback.d.ts +10 -0
- package/dist/components/feedback.js +2 -2
- package/dist/components/gesture.cjs +3 -3
- package/dist/components/gesture.d.cts +10 -0
- package/dist/components/gesture.d.ts +10 -0
- package/dist/components/gesture.js +5 -5
- package/dist/components/interaction.cjs +1 -1
- package/dist/components/interaction.d.cts +10 -0
- package/dist/components/interaction.d.ts +10 -0
- package/dist/components/interaction.js +2 -2
- package/dist/components/layout.cjs +1 -1
- package/dist/components/layout.d.cts +10 -0
- package/dist/components/layout.d.ts +10 -0
- package/dist/components/layout.js +2 -2
- package/dist/components/packs.cjs +1 -1
- package/dist/components/packs.d.cts +10 -0
- package/dist/components/packs.d.ts +10 -0
- package/dist/components/packs.js +2 -2
- package/dist/components/page.cjs +6 -3
- package/dist/components/page.cjs.map +1 -1
- package/dist/components/page.d.cts +10 -0
- package/dist/components/page.d.ts +10 -0
- package/dist/components/page.js +7 -4
- package/dist/components/page.js.map +1 -1
- package/dist/components/physics.cjs +2 -2
- package/dist/components/physics.d.cts +10 -0
- package/dist/components/physics.d.ts +10 -0
- package/dist/components/physics.js +4 -4
- package/dist/components/reveal.cjs +1 -1
- package/dist/components/reveal.d.cts +10 -0
- package/dist/components/reveal.d.ts +10 -0
- package/dist/components/reveal.js +2 -2
- package/dist/components/solid.cjs +6 -5
- package/dist/components/solid.cjs.map +1 -1
- package/dist/components/solid.js +6 -5
- package/dist/components/solid.js.map +1 -1
- package/dist/components/svelte.cjs +6 -5
- package/dist/components/svelte.cjs.map +1 -1
- package/dist/components/svelte.js +6 -5
- package/dist/components/svelte.js.map +1 -1
- package/dist/components/svg.cjs +1 -1
- package/dist/components/svg.d.cts +10 -0
- package/dist/components/svg.d.ts +10 -0
- package/dist/components/svg.js +2 -2
- package/dist/components/text.cjs +2 -2
- package/dist/components/text.d.cts +10 -0
- package/dist/components/text.d.ts +10 -0
- package/dist/components/text.js +3 -3
- package/dist/components/timeline.cjs +2 -2
- package/dist/components/timeline.d.cts +10 -0
- package/dist/components/timeline.d.ts +10 -0
- package/dist/components/timeline.js +4 -4
- package/dist/components/transitions.cjs +1 -1
- package/dist/components/transitions.d.cts +10 -0
- package/dist/components/transitions.d.ts +10 -0
- package/dist/components/transitions.js +2 -2
- package/dist/components/ui.cjs +3 -3
- package/dist/components/ui.d.cts +10 -0
- package/dist/components/ui.d.ts +10 -0
- package/dist/components/ui.js +5 -5
- package/dist/components/vue.cjs +6 -5
- package/dist/components/vue.cjs.map +1 -1
- package/dist/components/vue.js +6 -5
- package/dist/components/vue.js.map +1 -1
- package/dist/components/webgl.cjs +1 -1
- package/dist/components/webgl.d.cts +10 -0
- package/dist/components/webgl.d.ts +10 -0
- package/dist/components/webgl.js +2 -2
- package/dist/components.cjs +21 -5
- package/dist/components.cjs.map +1 -1
- package/dist/components.d.cts +105 -2
- package/dist/components.d.ts +105 -2
- package/dist/components.js +8 -7
- package/dist/components.js.map +1 -1
- package/dist/components.umd.js +2 -2
- package/dist/components.umd.js.map +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.js +2 -2
- package/dist/index.umd.js.map +1 -1
- package/docs/ROADMAP.md +1 -1
- package/docs/accessibility.md +28 -0
- package/package.json +11 -1
- package/dist/chunks/base-BPG5zvex.js.map +0 -1
- package/dist/chunks/base-CXx7jZ-o.cjs.map +0 -1
package/dist/components.cjs
CHANGED
|
@@ -18,13 +18,14 @@ var components_webgl = require('./components/webgl.cjs');
|
|
|
18
18
|
var components_depth = require('./components/depth.cjs');
|
|
19
19
|
var components_layout = require('./components/layout.cjs');
|
|
20
20
|
var components_packs = require('./components/packs.cjs');
|
|
21
|
-
var variants = require('./chunks/variants-
|
|
22
|
-
var base = require('./chunks/base-
|
|
21
|
+
var variants = require('./chunks/variants-CM2zaG8v.cjs');
|
|
22
|
+
var base = require('./chunks/base-DE2yzxE7.cjs');
|
|
23
23
|
var components_tokens = require('./components/tokens.cjs');
|
|
24
|
+
var components_a11y = require('./components/a11y.cjs');
|
|
24
25
|
var indexTags = require('./chunks/index-tags-BQh_uGqH.cjs');
|
|
25
|
-
var spring = require('./chunks/spring-
|
|
26
|
-
var core = require('./chunks/core-
|
|
27
|
-
var core$1 = require('./chunks/core-
|
|
26
|
+
var spring = require('./chunks/spring-hsmgd7ml.cjs');
|
|
27
|
+
var core = require('./chunks/core-BC9S2osy.cjs');
|
|
28
|
+
var core$1 = require('./chunks/core-DPYjLqA0.cjs');
|
|
28
29
|
|
|
29
30
|
/**
|
|
30
31
|
* use-scroll-animate/components
|
|
@@ -247,8 +248,11 @@ exports.VARIANTS = variants.VARIANTS;
|
|
|
247
248
|
exports.adoptVariants = variants.adoptVariants;
|
|
248
249
|
exports.setVariant = variants.setVariant;
|
|
249
250
|
exports.MOTION_SCALE = base.MOTION_SCALE;
|
|
251
|
+
exports.MOTION_SENSITIVITY_LEVELS = base.MOTION_SENSITIVITY_LEVELS;
|
|
252
|
+
exports.adaptKeyframes = base.adaptKeyframes;
|
|
250
253
|
exports.configureComponents = base.configureComponents;
|
|
251
254
|
exports.getMotionIntensity = base.getMotionIntensity;
|
|
255
|
+
exports.getMotionSensitivity = base.getMotionSensitivity;
|
|
252
256
|
exports.prefersReducedMotion = base.prefersReducedMotion;
|
|
253
257
|
exports.MOTION_TOKENS = components_tokens.MOTION_TOKENS;
|
|
254
258
|
exports.applyMotionTokens = components_tokens.applyMotionTokens;
|
|
@@ -264,6 +268,18 @@ exports.parseDuration = components_tokens.parseDuration;
|
|
|
264
268
|
exports.parseEasing = components_tokens.parseEasing;
|
|
265
269
|
exports.resolveDurationToken = components_tokens.resolveDurationToken;
|
|
266
270
|
exports.resolveEasingToken = components_tokens.resolveEasingToken;
|
|
271
|
+
exports.ALL_TAGS = components_a11y.ALL_TAGS;
|
|
272
|
+
exports.LIVE_REGION_IDS = components_a11y.LIVE_REGION_IDS;
|
|
273
|
+
exports.MOTION_SENSITIVITY = components_a11y.MOTION_SENSITIVITY;
|
|
274
|
+
exports.SENSITIVITY_CSS = components_a11y.SENSITIVITY_CSS;
|
|
275
|
+
exports.STATIC_ALTERNATIVES = components_a11y.STATIC_ALTERNATIVES;
|
|
276
|
+
exports.announce = components_a11y.announce;
|
|
277
|
+
exports.auditMotionA11y = components_a11y.auditMotionA11y;
|
|
278
|
+
exports.liveRegion = components_a11y.liveRegion;
|
|
279
|
+
exports.motionAllowed = components_a11y.motionAllowed;
|
|
280
|
+
exports.restoreMotionSensitivity = components_a11y.restoreMotionSensitivity;
|
|
281
|
+
exports.setMotionSensitivity = components_a11y.setMotionSensitivity;
|
|
282
|
+
exports.staticAlternative = components_a11y.staticAlternative;
|
|
267
283
|
exports.COMPONENT_CATEGORIES = indexTags.COMPONENT_CATEGORIES;
|
|
268
284
|
exports.SPRING_PRESETS = spring.SPRING_PRESETS;
|
|
269
285
|
exports.createSpring = spring.createSpring;
|
package/dist/components.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components.cjs","sources":["../src/components/index.ts"],"sourcesContent":["/**\n * use-scroll-animate/components\n *\n * Framework-agnostic, dependency-free animated UI components built on\n * Custom Elements + CSS + the Web Animations API. They run in any browser\n * and in Windows desktop apps that render with a web view: Electron, Tauri\n * (WebView2), WinUI 3 / WPF / WinForms with WebView2, and installed PWAs.\n *\n * ```js\n * import { defineComponents } from 'use-scroll-animate/components';\n * defineComponents(); // registers every <usa-*> element\n * // or only what you use (tree-shakable):\n * import { defineTypewriter } from 'use-scroll-animate/components/text';\n * ```\n *\n * Importing has no side effects and is SSR-safe; nothing is registered\n * until a `define*()` function runs in a browser.\n *\n * @license MIT\n */\nimport { defineRevealComponents } from './reveal/index';\nimport { defineTextComponents } from './text/index';\nimport { defineInteractionComponents } from './interaction/index';\nimport { defineFeedbackComponents } from './feedback/index';\nimport { defineBackgroundComponents } from './background/index';\nimport { defineTransitionComponents } from './transitions/index';\nimport { definePhysicsComponents } from './physics/index';\nimport { defineCardComponents } from './cards/index';\nimport { defineClickComponents } from './click/index';\nimport { defineUiComponents } from './ui/index';\nimport { definePageComponents } from './page/index';\nimport { defineTimelineComponents } from './timeline/index';\nimport { defineGestureComponents } from './gesture/index';\nimport { defineSvgComponents } from './svg/index';\nimport { defineWebglComponents } from './webgl/index';\nimport { defineDepthComponents } from './depth/index';\nimport { defineLayoutComponents } from './layout/index';\nimport { definePacksComponents } from './packs/index';\nimport { adoptVariants } from './ui/variants';\nimport { canDefine } from './base';\n\nexport * from './reveal/index';\nexport * from './text/index';\nexport * from './interaction/index';\nexport * from './feedback/index';\nexport * from './background/index';\nexport * from './transitions/index';\nexport * from './physics/index';\nexport * from './cards/index';\nexport * from './click/index';\nexport * from './ui/index';\nexport * from './page/index';\nexport * from './timeline/index';\nexport * from './gesture/index';\nexport * from './svg/index';\nexport * from './webgl/index';\nexport * from './depth/index';\nexport * from './layout/index';\nexport * from './packs/index';\nexport * from './tokens/index';\n\nexport { COMPONENT_CATEGORIES } from './index-tags';\nexport type { ComponentCategory } from './index-tags';\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst BY_CATEGORY: Record<ComponentCategory, () => void> = {\n reveal: defineRevealComponents,\n text: defineTextComponents,\n interaction: defineInteractionComponents,\n feedback: defineFeedbackComponents,\n background: defineBackgroundComponents,\n transitions: defineTransitionComponents,\n physics: definePhysicsComponents,\n cards: defineCardComponents,\n click: defineClickComponents,\n ui: defineUiComponents,\n page: definePageComponents,\n timeline: defineTimelineComponents,\n gesture: defineGestureComponents,\n svg: defineSvgComponents,\n webgl: defineWebglComponents,\n depth: defineDepthComponents,\n layout: defineLayoutComponents,\n packs: definePacksComponents,\n};\n\n/**\n * Register every `<usa-*>` component (or only the given categories).\n * Safe to call more than once and on the server (no-op without DOM).\n */\nexport function defineComponents(categories?: ComponentCategory[]): void {\n if (canDefine()) adoptVariants();\n (categories || (Object.keys(BY_CATEGORY) as ComponentCategory[])).forEach((c) => BY_CATEGORY[c]?.());\n}\n"],"names":["defineRevealComponents","defineTextComponents","defineInteractionComponents","defineFeedbackComponents","defineBackgroundComponents","defineTransitionComponents","definePhysicsComponents","defineCardComponents","defineClickComponents","defineUiComponents","definePageComponents","defineTimelineComponents","defineGestureComponents","defineSvgComponents","defineWebglComponents","defineDepthComponents","defineLayoutComponents","definePacksComponents","canDefine","adoptVariants"],"mappings":"
|
|
1
|
+
{"version":3,"file":"components.cjs","sources":["../src/components/index.ts"],"sourcesContent":["/**\n * use-scroll-animate/components\n *\n * Framework-agnostic, dependency-free animated UI components built on\n * Custom Elements + CSS + the Web Animations API. They run in any browser\n * and in Windows desktop apps that render with a web view: Electron, Tauri\n * (WebView2), WinUI 3 / WPF / WinForms with WebView2, and installed PWAs.\n *\n * ```js\n * import { defineComponents } from 'use-scroll-animate/components';\n * defineComponents(); // registers every <usa-*> element\n * // or only what you use (tree-shakable):\n * import { defineTypewriter } from 'use-scroll-animate/components/text';\n * ```\n *\n * Importing has no side effects and is SSR-safe; nothing is registered\n * until a `define*()` function runs in a browser.\n *\n * @license MIT\n */\nimport { defineRevealComponents } from './reveal/index';\nimport { defineTextComponents } from './text/index';\nimport { defineInteractionComponents } from './interaction/index';\nimport { defineFeedbackComponents } from './feedback/index';\nimport { defineBackgroundComponents } from './background/index';\nimport { defineTransitionComponents } from './transitions/index';\nimport { definePhysicsComponents } from './physics/index';\nimport { defineCardComponents } from './cards/index';\nimport { defineClickComponents } from './click/index';\nimport { defineUiComponents } from './ui/index';\nimport { definePageComponents } from './page/index';\nimport { defineTimelineComponents } from './timeline/index';\nimport { defineGestureComponents } from './gesture/index';\nimport { defineSvgComponents } from './svg/index';\nimport { defineWebglComponents } from './webgl/index';\nimport { defineDepthComponents } from './depth/index';\nimport { defineLayoutComponents } from './layout/index';\nimport { definePacksComponents } from './packs/index';\nimport { adoptVariants } from './ui/variants';\nimport { canDefine } from './base';\n\nexport * from './reveal/index';\nexport * from './text/index';\nexport * from './interaction/index';\nexport * from './feedback/index';\nexport * from './background/index';\nexport * from './transitions/index';\nexport * from './physics/index';\nexport * from './cards/index';\nexport * from './click/index';\nexport * from './ui/index';\nexport * from './page/index';\nexport * from './timeline/index';\nexport * from './gesture/index';\nexport * from './svg/index';\nexport * from './webgl/index';\nexport * from './depth/index';\nexport * from './layout/index';\nexport * from './packs/index';\nexport * from './tokens/index';\nexport * from './a11y/index';\n\nexport { COMPONENT_CATEGORIES } from './index-tags';\nexport type { ComponentCategory } from './index-tags';\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst BY_CATEGORY: Record<ComponentCategory, () => void> = {\n reveal: defineRevealComponents,\n text: defineTextComponents,\n interaction: defineInteractionComponents,\n feedback: defineFeedbackComponents,\n background: defineBackgroundComponents,\n transitions: defineTransitionComponents,\n physics: definePhysicsComponents,\n cards: defineCardComponents,\n click: defineClickComponents,\n ui: defineUiComponents,\n page: definePageComponents,\n timeline: defineTimelineComponents,\n gesture: defineGestureComponents,\n svg: defineSvgComponents,\n webgl: defineWebglComponents,\n depth: defineDepthComponents,\n layout: defineLayoutComponents,\n packs: definePacksComponents,\n};\n\n/**\n * Register every `<usa-*>` component (or only the given categories).\n * Safe to call more than once and on the server (no-op without DOM).\n */\nexport function defineComponents(categories?: ComponentCategory[]): void {\n if (canDefine()) adoptVariants();\n (categories || (Object.keys(BY_CATEGORY) as ComponentCategory[])).forEach((c) => BY_CATEGORY[c]?.());\n}\n"],"names":["defineRevealComponents","defineTextComponents","defineInteractionComponents","defineFeedbackComponents","defineBackgroundComponents","defineTransitionComponents","definePhysicsComponents","defineCardComponents","defineClickComponents","defineUiComponents","definePageComponents","defineTimelineComponents","defineGestureComponents","defineSvgComponents","defineWebglComponents","defineDepthComponents","defineLayoutComponents","definePacksComponents","canDefine","adoptVariants"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;AAmBG;AA+CH,MAAM,WAAW,GAA0C;AACzD,IAAA,MAAM,EAAEA,wCAAsB;AAC9B,IAAA,IAAI,EAAEC,oCAAoB;AAC1B,IAAA,WAAW,EAAEC,kDAA2B;AACxC,IAAA,QAAQ,EAAEC,4CAAwB;AAClC,IAAA,UAAU,EAAEC,gDAA0B;AACtC,IAAA,WAAW,EAAEC,iDAA0B;AACvC,IAAA,OAAO,EAAEC,0CAAuB;AAChC,IAAA,KAAK,EAAEC,qCAAoB;AAC3B,IAAA,KAAK,EAAEC,sCAAqB;AAC5B,IAAA,EAAE,EAAEC,gCAAkB;AACtB,IAAA,IAAI,EAAEC,oCAAoB;AAC1B,IAAA,QAAQ,EAAEC,4CAAwB;AAClC,IAAA,OAAO,EAAEC,0CAAuB;AAChC,IAAA,GAAG,EAAEC,kCAAmB;AACxB,IAAA,KAAK,EAAEC,sCAAqB;AAC5B,IAAA,KAAK,EAAEC,sCAAqB;AAC5B,IAAA,MAAM,EAAEC,wCAAsB;AAC9B,IAAA,KAAK,EAAEC,sCAAqB;CAC7B;AAED;;;AAGG;AACG,SAAU,gBAAgB,CAAC,UAAgC,EAAA;AAC/D,IAAA,IAAIC,cAAS,EAAE;AAAE,QAAAC,sBAAa,EAAE;IAChC,CAAC,UAAU,IAAK,MAAM,CAAC,IAAI,CAAC,WAAW,CAAyB,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC;AACtG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/components.d.cts
CHANGED
|
@@ -27,11 +27,30 @@ interface ComponentsConfig {
|
|
|
27
27
|
* 1.25) on `<html>` for your own CSS. See `setMotionIntensity()`.
|
|
28
28
|
*/
|
|
29
29
|
motionIntensity?: MotionIntensity;
|
|
30
|
+
/**
|
|
31
|
+
* Motion-sensitivity level (v4.4), finer than reduced motion:
|
|
32
|
+
* `'full'` (default) · `'gentle'` (no spins, zooms, skews or parallax —
|
|
33
|
+
* translations and fades only, safe for vestibular disorders) ·
|
|
34
|
+
* `'minimal'` (fades only; components use their reduced-motion variants) ·
|
|
35
|
+
* `'static'` (no animation: every component shows its static alternative).
|
|
36
|
+
* See `setMotionSensitivity()` in `use-scroll-animate/components/a11y`.
|
|
37
|
+
*/
|
|
38
|
+
motionSensitivity?: MotionSensitivity;
|
|
30
39
|
}
|
|
40
|
+
type MotionSensitivity = 'full' | 'gentle' | 'minimal' | 'static';
|
|
41
|
+
declare const MOTION_SENSITIVITY_LEVELS: readonly MotionSensitivity[];
|
|
31
42
|
type MotionIntensity = 'off' | 'low' | 'normal' | 'high';
|
|
32
43
|
declare const MOTION_SCALE: Record<MotionIntensity, number>;
|
|
33
44
|
/** Change global component settings (call before `define*()` for `injectStyles`). */
|
|
34
45
|
declare function configureComponents(options: ComponentsConfig): void;
|
|
46
|
+
/** The current motion-sensitivity level (v4.4). */
|
|
47
|
+
declare function getMotionSensitivity(): MotionSensitivity;
|
|
48
|
+
/**
|
|
49
|
+
* Adapt keyframes to the sensitivity level: `gentle` drops transforms that
|
|
50
|
+
* spin, zoom or skew (and 3D), `minimal` keeps opacity only, `static` keeps
|
|
51
|
+
* just the final frame. `full` returns them unchanged.
|
|
52
|
+
*/
|
|
53
|
+
declare function adaptKeyframes(frames: Keyframe[], level?: MotionSensitivity): Keyframe[];
|
|
35
54
|
/** The current global motion intensity. */
|
|
36
55
|
declare function getMotionIntensity(): MotionIntensity;
|
|
37
56
|
/** `true` when animations should be reduced (OS setting or `configureComponents`). */
|
|
@@ -2574,11 +2593,95 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
2574
2593
|
};
|
|
2575
2594
|
type ComponentCategory = keyof typeof COMPONENT_CATEGORIES;
|
|
2576
2595
|
|
|
2596
|
+
/**
|
|
2597
|
+
* use-scroll-animate/components/a11y — accessibility toolkit (4.4).
|
|
2598
|
+
*
|
|
2599
|
+
* - Motion-sensitivity levels: `setMotionSensitivity('full' | 'gentle' | 'minimal' | 'static')`.
|
|
2600
|
+
* - Static alternatives: what every component shows when motion is off, and
|
|
2601
|
+
* `staticAlternative(root)` to freeze any subtree at its final state.
|
|
2602
|
+
* - `aria-live` conventions: one shared polite and one assertive region,
|
|
2603
|
+
* `announce(message, { politeness })`.
|
|
2604
|
+
* - `auditMotionA11y(root)`: the rules the automated regression tests run
|
|
2605
|
+
* over every `<usa-*>` element — usable in your own tests too.
|
|
2606
|
+
*
|
|
2607
|
+
* ```ts
|
|
2608
|
+
* import { setMotionSensitivity, announce, auditMotionA11y } from 'use-scroll-animate/components/a11y';
|
|
2609
|
+
* setMotionSensitivity('gentle', true); // no spins / zooms / parallax, remembered
|
|
2610
|
+
* announce('3 items added to cart'); // polite live region
|
|
2611
|
+
* expect(auditMotionA11y(document.body).errors).toEqual([]);
|
|
2612
|
+
* ```
|
|
2613
|
+
*/
|
|
2614
|
+
|
|
2615
|
+
/** What each level allows, for docs and settings UIs. */
|
|
2616
|
+
declare const MOTION_SENSITIVITY: Record<MotionSensitivity, {
|
|
2617
|
+
en: string;
|
|
2618
|
+
zh: string;
|
|
2619
|
+
allows: string[];
|
|
2620
|
+
}>;
|
|
2621
|
+
/** CSS applied at the `static` / `minimal` / `gentle` levels (also stops your own CSS animations under `static`). */
|
|
2622
|
+
declare const SENSITIVITY_CSS: string;
|
|
2623
|
+
/**
|
|
2624
|
+
* Set the motion-sensitivity level for every `<usa-*>` component and the page:
|
|
2625
|
+
* sets `data-usa-sensitivity` on `<html>`, adapts component keyframes, and
|
|
2626
|
+
* with `persist` remembers the choice (`restoreMotionSensitivity()`).
|
|
2627
|
+
* Dispatches `usa:sensitivity` on `document`.
|
|
2628
|
+
*/
|
|
2629
|
+
declare function setMotionSensitivity(level: MotionSensitivity, persist?: boolean): void;
|
|
2630
|
+
/** Re-apply a persisted level (call early on page load). Returns the active level. */
|
|
2631
|
+
declare function restoreMotionSensitivity(): MotionSensitivity;
|
|
2632
|
+
/** `true` when the current level allows a kind of motion (`'rotate'`, `'parallax'`, `'loop'`…). */
|
|
2633
|
+
declare function motionAllowed(kind: string, level?: MotionSensitivity): boolean;
|
|
2634
|
+
/** The static alternative of each category: what its elements show without motion. */
|
|
2635
|
+
declare const STATIC_ALTERNATIVES: Record<ComponentCategory, string>;
|
|
2636
|
+
/**
|
|
2637
|
+
* Freeze a subtree at its static alternative: finishes running animations
|
|
2638
|
+
* (`finish()`, so content lands on its final state), marks the root with
|
|
2639
|
+
* `data-usa-static` and returns an undo that removes the mark.
|
|
2640
|
+
*/
|
|
2641
|
+
declare function staticAlternative(root: Element): () => void;
|
|
2642
|
+
type Politeness = 'polite' | 'assertive';
|
|
2643
|
+
/** The ids of the shared live regions. */
|
|
2644
|
+
declare const LIVE_REGION_IDS: Record<Politeness, string>;
|
|
2645
|
+
/** The shared live region (created once, visually hidden, `role="status"` / `role="alert"`). */
|
|
2646
|
+
declare function liveRegion(politeness?: Politeness): HTMLElement | null;
|
|
2647
|
+
/**
|
|
2648
|
+
* Announce a message through the shared live region. Conventions: `polite`
|
|
2649
|
+
* for results of the user's own actions (added, saved, copied), `assertive`
|
|
2650
|
+
* only for errors that block them. Identical messages within `dedupe` ms
|
|
2651
|
+
* (default 500) are dropped; the region is cleared first so repeats are read.
|
|
2652
|
+
*/
|
|
2653
|
+
declare function announce(message: string, options?: {
|
|
2654
|
+
politeness?: Politeness;
|
|
2655
|
+
dedupe?: number;
|
|
2656
|
+
}): boolean;
|
|
2657
|
+
interface A11yIssue {
|
|
2658
|
+
rule: string;
|
|
2659
|
+
level: 'error' | 'warning';
|
|
2660
|
+
element: Element;
|
|
2661
|
+
message: string;
|
|
2662
|
+
}
|
|
2663
|
+
/**
|
|
2664
|
+
* Check a subtree against the library's motion-a11y rules:
|
|
2665
|
+
* - `aria-hidden-focusable` (error): focusable content inside `aria-hidden`.
|
|
2666
|
+
* - `role-name` (error): a widget role without an accessible name.
|
|
2667
|
+
* - `range-value` (error): a slider / determinate progressbar without `aria-valuenow`.
|
|
2668
|
+
* - `img-alt` (error): an `<img>` without `alt`.
|
|
2669
|
+
* - `assertive-live` (warning): `aria-live="assertive"` outside `role="alert"`.
|
|
2670
|
+
* - `infinite-no-control` (warning, WCAG 2.2.2): an endless animation on a
|
|
2671
|
+
* page with no way to pause motion (`<usa-motion-switch>` or `[data-usa-pause]`).
|
|
2672
|
+
*/
|
|
2673
|
+
declare function auditMotionA11y(root: Element | Document): {
|
|
2674
|
+
errors: A11yIssue[];
|
|
2675
|
+
warnings: A11yIssue[];
|
|
2676
|
+
};
|
|
2677
|
+
/** Every `<usa-*>` tag, for sweeping audits. */
|
|
2678
|
+
declare const ALL_TAGS: string[];
|
|
2679
|
+
|
|
2577
2680
|
/**
|
|
2578
2681
|
* Register every `<usa-*>` component (or only the given categories).
|
|
2579
2682
|
* Safe to call more than once and on the server (no-op without DOM).
|
|
2580
2683
|
*/
|
|
2581
2684
|
declare function defineComponents(categories?: ComponentCategory[]): void;
|
|
2582
2685
|
|
|
2583
|
-
export { AMBIENT_EFFECTS, ANIM_ICONS, BUTTON_DEFORMS, CARD_EFFECTS, CLICK_EFFECTS, COMPONENT_CATEGORIES, CURSOR_MODES, JOINING_SCRIPT, MASK_SHAPES, MORPH_ICONS, MOTION_SCALE, MOTION_TOKENS, PACKS, PACK_PRIMITIVES, PAGE_EFFECTS, REVEAL_EFFECTS, SHADERS, SPINNER_VARIANTS, SPRING_EFFECTS, SPRING_PRESETS, TIMELINE_PRESETS, VARIANTS, adoptVariants, applyMotionTokens, applyPack, autoAnimate, burst, confetti, configureComponents, countUp, createSpring, defineAccordion, defineAcrylic, defineAmbient, defineAnimIcon, defineAurora, defineAutoAnimate, defineAutoSkeleton, defineAvatarStack, defineBackToTop, defineBackgroundComponents, defineBadge, defineBlobs, defineBottomSheet, defineButton, defineCard, defineCardComponents, defineCardStack, defineCarousel3d, defineCheck, defineCheckbox, defineClick, defineClickComponents, defineComponents, defineCounter, defineCube, defineCursor, defineDepth, defineDepthComponents, defineDialog, defineDistort, defineDotNetwork, defineDoubleTap, defineDraggable, defineDraw, defineDrawer, defineFab, defineFeedbackComponents, defineFullpage, defineGestureComponents, defineGlitch, defineGradientText, defineGrain, defineGridGlow, defineHandwriting, defineHold, defineIconMorph, defineInteractionComponents, defineLayoutComponents, defineLike, defineLiquid, defineLoadingBar, defineMagnetic, defineMarquee, defineMaskReveal, defineMasonry, defineMorph, defineMotionSwitch, defineNavbar, defineOverscroll, definePack, definePacksComponents, definePageComponents, defineParticles, definePhysicsComponents, definePinchZoom, definePopover, definePress, defineProgress, definePullRefresh, defineRating, defineReveal, defineRevealComponents, defineRipple, defineScramble, defineScrollHighlight, defineScrollProgress, defineScrolly, defineShader, defineShimmerText, defineSkeleton, defineSlider, defineSpinner, defineSplash, defineSplitText, defineSpotlight, defineSpring, defineStagger, defineStickyStack, defineSvgComponents, defineSwipeable, defineTabs, defineTextComponents, defineTextRotate, defineTilt, defineTimeline, defineTimelineComponents, defineToaster, defineToggle, defineTooltip, defineTransitionComponents, defineTypewriter, defineUiComponents, defineViewSwitch, defineWaterRipple, defineWaveText, defineWebglComponents, deviceTilt, drawLines, easeOutExpo, enableMpaTransitions, flip, flipFrames, fluentPreset, flyToCart, fragmentSource, gesture, getMotionIntensity, getMotionTokens, glQuad, graphemes, haptic, importMotionTokens, interpolatePath, linearEasing, loadingBar, masonryLayout, mergeMotionTokens, morphPath, morphTo, motionToken, motionTokensToCss, motionTokensToJSON, motionTokensToVars, motionVar, orientationToTilt, pageTransition, parseDuration, parseEasing, pathsCompatible, pinchScale, prefersReducedMotion, projectInertia, readScrollProgress, requestOrientationPermission, resolveDurationToken, resolveEasingToken, resolvePosition, resolveSpring, restoreMotionIntensity, revealKeyframes, rubberBand, scrambleFrame, scrollToTarget, setMotionIntensity, setVariant, shake, sharedTransition, smoothScroll, snapTo, splitOrder, splitText, splitTimeline, words as splitWords, spring, springEasing, springEffectKeyframes, springSamples, stepSpring, supportsLinearEasing, supportsNativeScrub, supportsOrientation, supportsViewTransitions, supportsWebGL, swipeDirection, themeTransition, timeline, toast, viewTransition };
|
|
2584
|
-
export type { AmbientEffect, AutoAnimateOptions, BurstOptions, ButtonDeform, ButtonShape, ButtonState, CardEffect, ClickEffect, ComponentCategory, ComponentsConfig, ConfettiOptions, CursorMode, DeepPartialTokens, DialogVariant, FlipOptions, FluentPresetOptions, GLQuad, GestureHandlers, GestureOptions, MorphOptions, MotionIntensity, MotionTokenGroup, MotionTokens, PackContext, PackName, PageEffect, PageTransitionOptions, PanState, PinchState, Placement, PressState, RevealEffect, ScrubHandle, ScrubOptions, SharedOptions, SmoothScrollOptions, SpinnerVariant, SplitBy, SplitFrom, SplitResult, SplitTextOptions, SplitTimelineOptions, SpringConfig, SpringEffect, SpringInput, SpringPreset, SpringToken, SpringValue, SpringValueOptions, SwipeDirection, SwipeState, TiltReading, Timeline, TimelineOptions, TimelinePosition, TimelineStepOptions, ToastHandle, ToastOptions, ToastType, UsaAccordionElement, UsaAcrylicElement, UsaAmbientElement, UsaAnimIconElement, UsaAuroraElement, UsaAutoAnimateElement, UsaAutoSkeletonElement, UsaAvatarStackElement, UsaBackToTopElement, UsaBadgeElement, UsaBlobsElement, UsaBottomSheetElement, UsaButtonElement, UsaCardElement, UsaCardStackElement, UsaCarousel3dElement, UsaCheckElement, UsaCheckboxElement, UsaClickElement, UsaCounterElement, UsaCubeElement, UsaCursorElement, UsaDepthElement, UsaDialogElement, UsaDotNetworkElement, UsaDoubleTapElement, UsaDraggableElement, UsaDrawElement, UsaDrawerElement, UsaElement, UsaFabElement, UsaFullpageElement, UsaGLElement, UsaGlitchElement, UsaGradientTextElement, UsaGrainElement, UsaGridGlowElement, UsaHandwritingElement, UsaHoldElement, UsaIconMorphElement, UsaLikeElement, UsaLoadingBarElement, UsaMagneticElement, UsaMarqueeElement, UsaMaskRevealElement, UsaMasonryElement, UsaMorphElement, UsaMotionSwitchElement, UsaNavbarElement, UsaOverscrollElement, UsaPackElement, UsaParticlesElement, UsaPinchZoomElement, UsaPopoverElement, UsaPressElement, UsaProgressElement, UsaPullRefreshElement, UsaRatingElement, UsaRevealElement, UsaRippleElement, UsaScrambleElement, UsaScrollHighlightElement, UsaScrollProgressElement, UsaScrollyElement, UsaShimmerTextElement, UsaSkeletonElement, UsaSliderElement, UsaSpinnerElement, UsaSplashElement, UsaSplitTextElement, UsaSpotlightElement, UsaSpringElement, UsaStaggerElement, UsaStickyStackElement, UsaSwipeableElement, UsaTabsElement, UsaTextRotateElement, UsaTiltElement, UsaTimelineElement, UsaToasterElement, UsaToggleElement, UsaTooltipElement, UsaTypewriterElement, UsaViewSwitchElement, UsaWaterRippleElement, UsaWaveTextElement, Variant, ViewTransitionOptions };
|
|
2686
|
+
export { ALL_TAGS, AMBIENT_EFFECTS, ANIM_ICONS, BUTTON_DEFORMS, CARD_EFFECTS, CLICK_EFFECTS, COMPONENT_CATEGORIES, CURSOR_MODES, JOINING_SCRIPT, LIVE_REGION_IDS, MASK_SHAPES, MORPH_ICONS, MOTION_SCALE, MOTION_SENSITIVITY, MOTION_SENSITIVITY_LEVELS, MOTION_TOKENS, PACKS, PACK_PRIMITIVES, PAGE_EFFECTS, REVEAL_EFFECTS, SENSITIVITY_CSS, SHADERS, SPINNER_VARIANTS, SPRING_EFFECTS, SPRING_PRESETS, STATIC_ALTERNATIVES, TIMELINE_PRESETS, VARIANTS, adaptKeyframes, adoptVariants, announce, applyMotionTokens, applyPack, auditMotionA11y, autoAnimate, burst, confetti, configureComponents, countUp, createSpring, defineAccordion, defineAcrylic, defineAmbient, defineAnimIcon, defineAurora, defineAutoAnimate, defineAutoSkeleton, defineAvatarStack, defineBackToTop, defineBackgroundComponents, defineBadge, defineBlobs, defineBottomSheet, defineButton, defineCard, defineCardComponents, defineCardStack, defineCarousel3d, defineCheck, defineCheckbox, defineClick, defineClickComponents, defineComponents, defineCounter, defineCube, defineCursor, defineDepth, defineDepthComponents, defineDialog, defineDistort, defineDotNetwork, defineDoubleTap, defineDraggable, defineDraw, defineDrawer, defineFab, defineFeedbackComponents, defineFullpage, defineGestureComponents, defineGlitch, defineGradientText, defineGrain, defineGridGlow, defineHandwriting, defineHold, defineIconMorph, defineInteractionComponents, defineLayoutComponents, defineLike, defineLiquid, defineLoadingBar, defineMagnetic, defineMarquee, defineMaskReveal, defineMasonry, defineMorph, defineMotionSwitch, defineNavbar, defineOverscroll, definePack, definePacksComponents, definePageComponents, defineParticles, definePhysicsComponents, definePinchZoom, definePopover, definePress, defineProgress, definePullRefresh, defineRating, defineReveal, defineRevealComponents, defineRipple, defineScramble, defineScrollHighlight, defineScrollProgress, defineScrolly, defineShader, defineShimmerText, defineSkeleton, defineSlider, defineSpinner, defineSplash, defineSplitText, defineSpotlight, defineSpring, defineStagger, defineStickyStack, defineSvgComponents, defineSwipeable, defineTabs, defineTextComponents, defineTextRotate, defineTilt, defineTimeline, defineTimelineComponents, defineToaster, defineToggle, defineTooltip, defineTransitionComponents, defineTypewriter, defineUiComponents, defineViewSwitch, defineWaterRipple, defineWaveText, defineWebglComponents, deviceTilt, drawLines, easeOutExpo, enableMpaTransitions, flip, flipFrames, fluentPreset, flyToCart, fragmentSource, gesture, getMotionIntensity, getMotionSensitivity, getMotionTokens, glQuad, graphemes, haptic, importMotionTokens, interpolatePath, linearEasing, liveRegion, loadingBar, masonryLayout, mergeMotionTokens, morphPath, morphTo, motionAllowed, motionToken, motionTokensToCss, motionTokensToJSON, motionTokensToVars, motionVar, orientationToTilt, pageTransition, parseDuration, parseEasing, pathsCompatible, pinchScale, prefersReducedMotion, projectInertia, readScrollProgress, requestOrientationPermission, resolveDurationToken, resolveEasingToken, resolvePosition, resolveSpring, restoreMotionIntensity, restoreMotionSensitivity, revealKeyframes, rubberBand, scrambleFrame, scrollToTarget, setMotionIntensity, setMotionSensitivity, setVariant, shake, sharedTransition, smoothScroll, snapTo, splitOrder, splitText, splitTimeline, words as splitWords, spring, springEasing, springEffectKeyframes, springSamples, staticAlternative, stepSpring, supportsLinearEasing, supportsNativeScrub, supportsOrientation, supportsViewTransitions, supportsWebGL, swipeDirection, themeTransition, timeline, toast, viewTransition };
|
|
2687
|
+
export type { A11yIssue, AmbientEffect, AutoAnimateOptions, BurstOptions, ButtonDeform, ButtonShape, ButtonState, CardEffect, ClickEffect, ComponentCategory, ComponentsConfig, ConfettiOptions, CursorMode, DeepPartialTokens, DialogVariant, FlipOptions, FluentPresetOptions, GLQuad, GestureHandlers, GestureOptions, MorphOptions, MotionIntensity, MotionSensitivity, MotionTokenGroup, MotionTokens, PackContext, PackName, PageEffect, PageTransitionOptions, PanState, PinchState, Placement, Politeness, PressState, RevealEffect, ScrubHandle, ScrubOptions, SharedOptions, SmoothScrollOptions, SpinnerVariant, SplitBy, SplitFrom, SplitResult, SplitTextOptions, SplitTimelineOptions, SpringConfig, SpringEffect, SpringInput, SpringPreset, SpringToken, SpringValue, SpringValueOptions, SwipeDirection, SwipeState, TiltReading, Timeline, TimelineOptions, TimelinePosition, TimelineStepOptions, ToastHandle, ToastOptions, ToastType, UsaAccordionElement, UsaAcrylicElement, UsaAmbientElement, UsaAnimIconElement, UsaAuroraElement, UsaAutoAnimateElement, UsaAutoSkeletonElement, UsaAvatarStackElement, UsaBackToTopElement, UsaBadgeElement, UsaBlobsElement, UsaBottomSheetElement, UsaButtonElement, UsaCardElement, UsaCardStackElement, UsaCarousel3dElement, UsaCheckElement, UsaCheckboxElement, UsaClickElement, UsaCounterElement, UsaCubeElement, UsaCursorElement, UsaDepthElement, UsaDialogElement, UsaDotNetworkElement, UsaDoubleTapElement, UsaDraggableElement, UsaDrawElement, UsaDrawerElement, UsaElement, UsaFabElement, UsaFullpageElement, UsaGLElement, UsaGlitchElement, UsaGradientTextElement, UsaGrainElement, UsaGridGlowElement, UsaHandwritingElement, UsaHoldElement, UsaIconMorphElement, UsaLikeElement, UsaLoadingBarElement, UsaMagneticElement, UsaMarqueeElement, UsaMaskRevealElement, UsaMasonryElement, UsaMorphElement, UsaMotionSwitchElement, UsaNavbarElement, UsaOverscrollElement, UsaPackElement, UsaParticlesElement, UsaPinchZoomElement, UsaPopoverElement, UsaPressElement, UsaProgressElement, UsaPullRefreshElement, UsaRatingElement, UsaRevealElement, UsaRippleElement, UsaScrambleElement, UsaScrollHighlightElement, UsaScrollProgressElement, UsaScrollyElement, UsaShimmerTextElement, UsaSkeletonElement, UsaSliderElement, UsaSpinnerElement, UsaSplashElement, UsaSplitTextElement, UsaSpotlightElement, UsaSpringElement, UsaStaggerElement, UsaStickyStackElement, UsaSwipeableElement, UsaTabsElement, UsaTextRotateElement, UsaTiltElement, UsaTimelineElement, UsaToasterElement, UsaToggleElement, UsaTooltipElement, UsaTypewriterElement, UsaViewSwitchElement, UsaWaterRippleElement, UsaWaveTextElement, Variant, ViewTransitionOptions };
|
package/dist/components.d.ts
CHANGED
|
@@ -27,11 +27,30 @@ interface ComponentsConfig {
|
|
|
27
27
|
* 1.25) on `<html>` for your own CSS. See `setMotionIntensity()`.
|
|
28
28
|
*/
|
|
29
29
|
motionIntensity?: MotionIntensity;
|
|
30
|
+
/**
|
|
31
|
+
* Motion-sensitivity level (v4.4), finer than reduced motion:
|
|
32
|
+
* `'full'` (default) · `'gentle'` (no spins, zooms, skews or parallax —
|
|
33
|
+
* translations and fades only, safe for vestibular disorders) ·
|
|
34
|
+
* `'minimal'` (fades only; components use their reduced-motion variants) ·
|
|
35
|
+
* `'static'` (no animation: every component shows its static alternative).
|
|
36
|
+
* See `setMotionSensitivity()` in `use-scroll-animate/components/a11y`.
|
|
37
|
+
*/
|
|
38
|
+
motionSensitivity?: MotionSensitivity;
|
|
30
39
|
}
|
|
40
|
+
type MotionSensitivity = 'full' | 'gentle' | 'minimal' | 'static';
|
|
41
|
+
declare const MOTION_SENSITIVITY_LEVELS: readonly MotionSensitivity[];
|
|
31
42
|
type MotionIntensity = 'off' | 'low' | 'normal' | 'high';
|
|
32
43
|
declare const MOTION_SCALE: Record<MotionIntensity, number>;
|
|
33
44
|
/** Change global component settings (call before `define*()` for `injectStyles`). */
|
|
34
45
|
declare function configureComponents(options: ComponentsConfig): void;
|
|
46
|
+
/** The current motion-sensitivity level (v4.4). */
|
|
47
|
+
declare function getMotionSensitivity(): MotionSensitivity;
|
|
48
|
+
/**
|
|
49
|
+
* Adapt keyframes to the sensitivity level: `gentle` drops transforms that
|
|
50
|
+
* spin, zoom or skew (and 3D), `minimal` keeps opacity only, `static` keeps
|
|
51
|
+
* just the final frame. `full` returns them unchanged.
|
|
52
|
+
*/
|
|
53
|
+
declare function adaptKeyframes(frames: Keyframe[], level?: MotionSensitivity): Keyframe[];
|
|
35
54
|
/** The current global motion intensity. */
|
|
36
55
|
declare function getMotionIntensity(): MotionIntensity;
|
|
37
56
|
/** `true` when animations should be reduced (OS setting or `configureComponents`). */
|
|
@@ -2574,11 +2593,95 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
2574
2593
|
};
|
|
2575
2594
|
type ComponentCategory = keyof typeof COMPONENT_CATEGORIES;
|
|
2576
2595
|
|
|
2596
|
+
/**
|
|
2597
|
+
* use-scroll-animate/components/a11y — accessibility toolkit (4.4).
|
|
2598
|
+
*
|
|
2599
|
+
* - Motion-sensitivity levels: `setMotionSensitivity('full' | 'gentle' | 'minimal' | 'static')`.
|
|
2600
|
+
* - Static alternatives: what every component shows when motion is off, and
|
|
2601
|
+
* `staticAlternative(root)` to freeze any subtree at its final state.
|
|
2602
|
+
* - `aria-live` conventions: one shared polite and one assertive region,
|
|
2603
|
+
* `announce(message, { politeness })`.
|
|
2604
|
+
* - `auditMotionA11y(root)`: the rules the automated regression tests run
|
|
2605
|
+
* over every `<usa-*>` element — usable in your own tests too.
|
|
2606
|
+
*
|
|
2607
|
+
* ```ts
|
|
2608
|
+
* import { setMotionSensitivity, announce, auditMotionA11y } from 'use-scroll-animate/components/a11y';
|
|
2609
|
+
* setMotionSensitivity('gentle', true); // no spins / zooms / parallax, remembered
|
|
2610
|
+
* announce('3 items added to cart'); // polite live region
|
|
2611
|
+
* expect(auditMotionA11y(document.body).errors).toEqual([]);
|
|
2612
|
+
* ```
|
|
2613
|
+
*/
|
|
2614
|
+
|
|
2615
|
+
/** What each level allows, for docs and settings UIs. */
|
|
2616
|
+
declare const MOTION_SENSITIVITY: Record<MotionSensitivity, {
|
|
2617
|
+
en: string;
|
|
2618
|
+
zh: string;
|
|
2619
|
+
allows: string[];
|
|
2620
|
+
}>;
|
|
2621
|
+
/** CSS applied at the `static` / `minimal` / `gentle` levels (also stops your own CSS animations under `static`). */
|
|
2622
|
+
declare const SENSITIVITY_CSS: string;
|
|
2623
|
+
/**
|
|
2624
|
+
* Set the motion-sensitivity level for every `<usa-*>` component and the page:
|
|
2625
|
+
* sets `data-usa-sensitivity` on `<html>`, adapts component keyframes, and
|
|
2626
|
+
* with `persist` remembers the choice (`restoreMotionSensitivity()`).
|
|
2627
|
+
* Dispatches `usa:sensitivity` on `document`.
|
|
2628
|
+
*/
|
|
2629
|
+
declare function setMotionSensitivity(level: MotionSensitivity, persist?: boolean): void;
|
|
2630
|
+
/** Re-apply a persisted level (call early on page load). Returns the active level. */
|
|
2631
|
+
declare function restoreMotionSensitivity(): MotionSensitivity;
|
|
2632
|
+
/** `true` when the current level allows a kind of motion (`'rotate'`, `'parallax'`, `'loop'`…). */
|
|
2633
|
+
declare function motionAllowed(kind: string, level?: MotionSensitivity): boolean;
|
|
2634
|
+
/** The static alternative of each category: what its elements show without motion. */
|
|
2635
|
+
declare const STATIC_ALTERNATIVES: Record<ComponentCategory, string>;
|
|
2636
|
+
/**
|
|
2637
|
+
* Freeze a subtree at its static alternative: finishes running animations
|
|
2638
|
+
* (`finish()`, so content lands on its final state), marks the root with
|
|
2639
|
+
* `data-usa-static` and returns an undo that removes the mark.
|
|
2640
|
+
*/
|
|
2641
|
+
declare function staticAlternative(root: Element): () => void;
|
|
2642
|
+
type Politeness = 'polite' | 'assertive';
|
|
2643
|
+
/** The ids of the shared live regions. */
|
|
2644
|
+
declare const LIVE_REGION_IDS: Record<Politeness, string>;
|
|
2645
|
+
/** The shared live region (created once, visually hidden, `role="status"` / `role="alert"`). */
|
|
2646
|
+
declare function liveRegion(politeness?: Politeness): HTMLElement | null;
|
|
2647
|
+
/**
|
|
2648
|
+
* Announce a message through the shared live region. Conventions: `polite`
|
|
2649
|
+
* for results of the user's own actions (added, saved, copied), `assertive`
|
|
2650
|
+
* only for errors that block them. Identical messages within `dedupe` ms
|
|
2651
|
+
* (default 500) are dropped; the region is cleared first so repeats are read.
|
|
2652
|
+
*/
|
|
2653
|
+
declare function announce(message: string, options?: {
|
|
2654
|
+
politeness?: Politeness;
|
|
2655
|
+
dedupe?: number;
|
|
2656
|
+
}): boolean;
|
|
2657
|
+
interface A11yIssue {
|
|
2658
|
+
rule: string;
|
|
2659
|
+
level: 'error' | 'warning';
|
|
2660
|
+
element: Element;
|
|
2661
|
+
message: string;
|
|
2662
|
+
}
|
|
2663
|
+
/**
|
|
2664
|
+
* Check a subtree against the library's motion-a11y rules:
|
|
2665
|
+
* - `aria-hidden-focusable` (error): focusable content inside `aria-hidden`.
|
|
2666
|
+
* - `role-name` (error): a widget role without an accessible name.
|
|
2667
|
+
* - `range-value` (error): a slider / determinate progressbar without `aria-valuenow`.
|
|
2668
|
+
* - `img-alt` (error): an `<img>` without `alt`.
|
|
2669
|
+
* - `assertive-live` (warning): `aria-live="assertive"` outside `role="alert"`.
|
|
2670
|
+
* - `infinite-no-control` (warning, WCAG 2.2.2): an endless animation on a
|
|
2671
|
+
* page with no way to pause motion (`<usa-motion-switch>` or `[data-usa-pause]`).
|
|
2672
|
+
*/
|
|
2673
|
+
declare function auditMotionA11y(root: Element | Document): {
|
|
2674
|
+
errors: A11yIssue[];
|
|
2675
|
+
warnings: A11yIssue[];
|
|
2676
|
+
};
|
|
2677
|
+
/** Every `<usa-*>` tag, for sweeping audits. */
|
|
2678
|
+
declare const ALL_TAGS: string[];
|
|
2679
|
+
|
|
2577
2680
|
/**
|
|
2578
2681
|
* Register every `<usa-*>` component (or only the given categories).
|
|
2579
2682
|
* Safe to call more than once and on the server (no-op without DOM).
|
|
2580
2683
|
*/
|
|
2581
2684
|
declare function defineComponents(categories?: ComponentCategory[]): void;
|
|
2582
2685
|
|
|
2583
|
-
export { AMBIENT_EFFECTS, ANIM_ICONS, BUTTON_DEFORMS, CARD_EFFECTS, CLICK_EFFECTS, COMPONENT_CATEGORIES, CURSOR_MODES, JOINING_SCRIPT, MASK_SHAPES, MORPH_ICONS, MOTION_SCALE, MOTION_TOKENS, PACKS, PACK_PRIMITIVES, PAGE_EFFECTS, REVEAL_EFFECTS, SHADERS, SPINNER_VARIANTS, SPRING_EFFECTS, SPRING_PRESETS, TIMELINE_PRESETS, VARIANTS, adoptVariants, applyMotionTokens, applyPack, autoAnimate, burst, confetti, configureComponents, countUp, createSpring, defineAccordion, defineAcrylic, defineAmbient, defineAnimIcon, defineAurora, defineAutoAnimate, defineAutoSkeleton, defineAvatarStack, defineBackToTop, defineBackgroundComponents, defineBadge, defineBlobs, defineBottomSheet, defineButton, defineCard, defineCardComponents, defineCardStack, defineCarousel3d, defineCheck, defineCheckbox, defineClick, defineClickComponents, defineComponents, defineCounter, defineCube, defineCursor, defineDepth, defineDepthComponents, defineDialog, defineDistort, defineDotNetwork, defineDoubleTap, defineDraggable, defineDraw, defineDrawer, defineFab, defineFeedbackComponents, defineFullpage, defineGestureComponents, defineGlitch, defineGradientText, defineGrain, defineGridGlow, defineHandwriting, defineHold, defineIconMorph, defineInteractionComponents, defineLayoutComponents, defineLike, defineLiquid, defineLoadingBar, defineMagnetic, defineMarquee, defineMaskReveal, defineMasonry, defineMorph, defineMotionSwitch, defineNavbar, defineOverscroll, definePack, definePacksComponents, definePageComponents, defineParticles, definePhysicsComponents, definePinchZoom, definePopover, definePress, defineProgress, definePullRefresh, defineRating, defineReveal, defineRevealComponents, defineRipple, defineScramble, defineScrollHighlight, defineScrollProgress, defineScrolly, defineShader, defineShimmerText, defineSkeleton, defineSlider, defineSpinner, defineSplash, defineSplitText, defineSpotlight, defineSpring, defineStagger, defineStickyStack, defineSvgComponents, defineSwipeable, defineTabs, defineTextComponents, defineTextRotate, defineTilt, defineTimeline, defineTimelineComponents, defineToaster, defineToggle, defineTooltip, defineTransitionComponents, defineTypewriter, defineUiComponents, defineViewSwitch, defineWaterRipple, defineWaveText, defineWebglComponents, deviceTilt, drawLines, easeOutExpo, enableMpaTransitions, flip, flipFrames, fluentPreset, flyToCart, fragmentSource, gesture, getMotionIntensity, getMotionTokens, glQuad, graphemes, haptic, importMotionTokens, interpolatePath, linearEasing, loadingBar, masonryLayout, mergeMotionTokens, morphPath, morphTo, motionToken, motionTokensToCss, motionTokensToJSON, motionTokensToVars, motionVar, orientationToTilt, pageTransition, parseDuration, parseEasing, pathsCompatible, pinchScale, prefersReducedMotion, projectInertia, readScrollProgress, requestOrientationPermission, resolveDurationToken, resolveEasingToken, resolvePosition, resolveSpring, restoreMotionIntensity, revealKeyframes, rubberBand, scrambleFrame, scrollToTarget, setMotionIntensity, setVariant, shake, sharedTransition, smoothScroll, snapTo, splitOrder, splitText, splitTimeline, words as splitWords, spring, springEasing, springEffectKeyframes, springSamples, stepSpring, supportsLinearEasing, supportsNativeScrub, supportsOrientation, supportsViewTransitions, supportsWebGL, swipeDirection, themeTransition, timeline, toast, viewTransition };
|
|
2584
|
-
export type { AmbientEffect, AutoAnimateOptions, BurstOptions, ButtonDeform, ButtonShape, ButtonState, CardEffect, ClickEffect, ComponentCategory, ComponentsConfig, ConfettiOptions, CursorMode, DeepPartialTokens, DialogVariant, FlipOptions, FluentPresetOptions, GLQuad, GestureHandlers, GestureOptions, MorphOptions, MotionIntensity, MotionTokenGroup, MotionTokens, PackContext, PackName, PageEffect, PageTransitionOptions, PanState, PinchState, Placement, PressState, RevealEffect, ScrubHandle, ScrubOptions, SharedOptions, SmoothScrollOptions, SpinnerVariant, SplitBy, SplitFrom, SplitResult, SplitTextOptions, SplitTimelineOptions, SpringConfig, SpringEffect, SpringInput, SpringPreset, SpringToken, SpringValue, SpringValueOptions, SwipeDirection, SwipeState, TiltReading, Timeline, TimelineOptions, TimelinePosition, TimelineStepOptions, ToastHandle, ToastOptions, ToastType, UsaAccordionElement, UsaAcrylicElement, UsaAmbientElement, UsaAnimIconElement, UsaAuroraElement, UsaAutoAnimateElement, UsaAutoSkeletonElement, UsaAvatarStackElement, UsaBackToTopElement, UsaBadgeElement, UsaBlobsElement, UsaBottomSheetElement, UsaButtonElement, UsaCardElement, UsaCardStackElement, UsaCarousel3dElement, UsaCheckElement, UsaCheckboxElement, UsaClickElement, UsaCounterElement, UsaCubeElement, UsaCursorElement, UsaDepthElement, UsaDialogElement, UsaDotNetworkElement, UsaDoubleTapElement, UsaDraggableElement, UsaDrawElement, UsaDrawerElement, UsaElement, UsaFabElement, UsaFullpageElement, UsaGLElement, UsaGlitchElement, UsaGradientTextElement, UsaGrainElement, UsaGridGlowElement, UsaHandwritingElement, UsaHoldElement, UsaIconMorphElement, UsaLikeElement, UsaLoadingBarElement, UsaMagneticElement, UsaMarqueeElement, UsaMaskRevealElement, UsaMasonryElement, UsaMorphElement, UsaMotionSwitchElement, UsaNavbarElement, UsaOverscrollElement, UsaPackElement, UsaParticlesElement, UsaPinchZoomElement, UsaPopoverElement, UsaPressElement, UsaProgressElement, UsaPullRefreshElement, UsaRatingElement, UsaRevealElement, UsaRippleElement, UsaScrambleElement, UsaScrollHighlightElement, UsaScrollProgressElement, UsaScrollyElement, UsaShimmerTextElement, UsaSkeletonElement, UsaSliderElement, UsaSpinnerElement, UsaSplashElement, UsaSplitTextElement, UsaSpotlightElement, UsaSpringElement, UsaStaggerElement, UsaStickyStackElement, UsaSwipeableElement, UsaTabsElement, UsaTextRotateElement, UsaTiltElement, UsaTimelineElement, UsaToasterElement, UsaToggleElement, UsaTooltipElement, UsaTypewriterElement, UsaViewSwitchElement, UsaWaterRippleElement, UsaWaveTextElement, Variant, ViewTransitionOptions };
|
|
2686
|
+
export { ALL_TAGS, AMBIENT_EFFECTS, ANIM_ICONS, BUTTON_DEFORMS, CARD_EFFECTS, CLICK_EFFECTS, COMPONENT_CATEGORIES, CURSOR_MODES, JOINING_SCRIPT, LIVE_REGION_IDS, MASK_SHAPES, MORPH_ICONS, MOTION_SCALE, MOTION_SENSITIVITY, MOTION_SENSITIVITY_LEVELS, MOTION_TOKENS, PACKS, PACK_PRIMITIVES, PAGE_EFFECTS, REVEAL_EFFECTS, SENSITIVITY_CSS, SHADERS, SPINNER_VARIANTS, SPRING_EFFECTS, SPRING_PRESETS, STATIC_ALTERNATIVES, TIMELINE_PRESETS, VARIANTS, adaptKeyframes, adoptVariants, announce, applyMotionTokens, applyPack, auditMotionA11y, autoAnimate, burst, confetti, configureComponents, countUp, createSpring, defineAccordion, defineAcrylic, defineAmbient, defineAnimIcon, defineAurora, defineAutoAnimate, defineAutoSkeleton, defineAvatarStack, defineBackToTop, defineBackgroundComponents, defineBadge, defineBlobs, defineBottomSheet, defineButton, defineCard, defineCardComponents, defineCardStack, defineCarousel3d, defineCheck, defineCheckbox, defineClick, defineClickComponents, defineComponents, defineCounter, defineCube, defineCursor, defineDepth, defineDepthComponents, defineDialog, defineDistort, defineDotNetwork, defineDoubleTap, defineDraggable, defineDraw, defineDrawer, defineFab, defineFeedbackComponents, defineFullpage, defineGestureComponents, defineGlitch, defineGradientText, defineGrain, defineGridGlow, defineHandwriting, defineHold, defineIconMorph, defineInteractionComponents, defineLayoutComponents, defineLike, defineLiquid, defineLoadingBar, defineMagnetic, defineMarquee, defineMaskReveal, defineMasonry, defineMorph, defineMotionSwitch, defineNavbar, defineOverscroll, definePack, definePacksComponents, definePageComponents, defineParticles, definePhysicsComponents, definePinchZoom, definePopover, definePress, defineProgress, definePullRefresh, defineRating, defineReveal, defineRevealComponents, defineRipple, defineScramble, defineScrollHighlight, defineScrollProgress, defineScrolly, defineShader, defineShimmerText, defineSkeleton, defineSlider, defineSpinner, defineSplash, defineSplitText, defineSpotlight, defineSpring, defineStagger, defineStickyStack, defineSvgComponents, defineSwipeable, defineTabs, defineTextComponents, defineTextRotate, defineTilt, defineTimeline, defineTimelineComponents, defineToaster, defineToggle, defineTooltip, defineTransitionComponents, defineTypewriter, defineUiComponents, defineViewSwitch, defineWaterRipple, defineWaveText, defineWebglComponents, deviceTilt, drawLines, easeOutExpo, enableMpaTransitions, flip, flipFrames, fluentPreset, flyToCart, fragmentSource, gesture, getMotionIntensity, getMotionSensitivity, getMotionTokens, glQuad, graphemes, haptic, importMotionTokens, interpolatePath, linearEasing, liveRegion, loadingBar, masonryLayout, mergeMotionTokens, morphPath, morphTo, motionAllowed, motionToken, motionTokensToCss, motionTokensToJSON, motionTokensToVars, motionVar, orientationToTilt, pageTransition, parseDuration, parseEasing, pathsCompatible, pinchScale, prefersReducedMotion, projectInertia, readScrollProgress, requestOrientationPermission, resolveDurationToken, resolveEasingToken, resolvePosition, resolveSpring, restoreMotionIntensity, restoreMotionSensitivity, revealKeyframes, rubberBand, scrambleFrame, scrollToTarget, setMotionIntensity, setMotionSensitivity, setVariant, shake, sharedTransition, smoothScroll, snapTo, splitOrder, splitText, splitTimeline, words as splitWords, spring, springEasing, springEffectKeyframes, springSamples, staticAlternative, stepSpring, supportsLinearEasing, supportsNativeScrub, supportsOrientation, supportsViewTransitions, supportsWebGL, swipeDirection, themeTransition, timeline, toast, viewTransition };
|
|
2687
|
+
export type { A11yIssue, AmbientEffect, AutoAnimateOptions, BurstOptions, ButtonDeform, ButtonShape, ButtonState, CardEffect, ClickEffect, ComponentCategory, ComponentsConfig, ConfettiOptions, CursorMode, DeepPartialTokens, DialogVariant, FlipOptions, FluentPresetOptions, GLQuad, GestureHandlers, GestureOptions, MorphOptions, MotionIntensity, MotionSensitivity, MotionTokenGroup, MotionTokens, PackContext, PackName, PageEffect, PageTransitionOptions, PanState, PinchState, Placement, Politeness, PressState, RevealEffect, ScrubHandle, ScrubOptions, SharedOptions, SmoothScrollOptions, SpinnerVariant, SplitBy, SplitFrom, SplitResult, SplitTextOptions, SplitTimelineOptions, SpringConfig, SpringEffect, SpringInput, SpringPreset, SpringToken, SpringValue, SpringValueOptions, SwipeDirection, SwipeState, TiltReading, Timeline, TimelineOptions, TimelinePosition, TimelineStepOptions, ToastHandle, ToastOptions, ToastType, UsaAccordionElement, UsaAcrylicElement, UsaAmbientElement, UsaAnimIconElement, UsaAuroraElement, UsaAutoAnimateElement, UsaAutoSkeletonElement, UsaAvatarStackElement, UsaBackToTopElement, UsaBadgeElement, UsaBlobsElement, UsaBottomSheetElement, UsaButtonElement, UsaCardElement, UsaCardStackElement, UsaCarousel3dElement, UsaCheckElement, UsaCheckboxElement, UsaClickElement, UsaCounterElement, UsaCubeElement, UsaCursorElement, UsaDepthElement, UsaDialogElement, UsaDotNetworkElement, UsaDoubleTapElement, UsaDraggableElement, UsaDrawElement, UsaDrawerElement, UsaElement, UsaFabElement, UsaFullpageElement, UsaGLElement, UsaGlitchElement, UsaGradientTextElement, UsaGrainElement, UsaGridGlowElement, UsaHandwritingElement, UsaHoldElement, UsaIconMorphElement, UsaLikeElement, UsaLoadingBarElement, UsaMagneticElement, UsaMarqueeElement, UsaMaskRevealElement, UsaMasonryElement, UsaMorphElement, UsaMotionSwitchElement, UsaNavbarElement, UsaOverscrollElement, UsaPackElement, UsaParticlesElement, UsaPinchZoomElement, UsaPopoverElement, UsaPressElement, UsaProgressElement, UsaPullRefreshElement, UsaRatingElement, UsaRevealElement, UsaRippleElement, UsaScrambleElement, UsaScrollHighlightElement, UsaScrollProgressElement, UsaScrollyElement, UsaShimmerTextElement, UsaSkeletonElement, UsaSliderElement, UsaSpinnerElement, UsaSplashElement, UsaSplitTextElement, UsaSpotlightElement, UsaSpringElement, UsaStaggerElement, UsaStickyStackElement, UsaSwipeableElement, UsaTabsElement, UsaTextRotateElement, UsaTiltElement, UsaTimelineElement, UsaToasterElement, UsaToggleElement, UsaTooltipElement, UsaTypewriterElement, UsaViewSwitchElement, UsaWaterRippleElement, UsaWaveTextElement, Variant, ViewTransitionOptions };
|
package/dist/components.js
CHANGED
|
@@ -34,15 +34,16 @@ import { defineLayoutComponents } from './components/layout.js';
|
|
|
34
34
|
export { autoAnimate, defineAutoAnimate, defineMasonry, flipFrames, masonryLayout, sharedTransition } from './components/layout.js';
|
|
35
35
|
import { definePacksComponents } from './components/packs.js';
|
|
36
36
|
export { PACKS, PACK_PRIMITIVES, applyPack, countUp, definePack, flyToCart } from './components/packs.js';
|
|
37
|
-
import { a as adoptVariants } from './chunks/variants-
|
|
38
|
-
export { V as VARIANTS, s as setVariant } from './chunks/variants-
|
|
39
|
-
import { c as canDefine } from './chunks/base-
|
|
40
|
-
export { M as MOTION_SCALE, a as configureComponents, g as getMotionIntensity, p as prefersReducedMotion } from './chunks/base-
|
|
37
|
+
import { a as adoptVariants } from './chunks/variants-dD6SbUMR.js';
|
|
38
|
+
export { V as VARIANTS, s as setVariant } from './chunks/variants-dD6SbUMR.js';
|
|
39
|
+
import { c as canDefine } from './chunks/base-BtJDNCB6.js';
|
|
40
|
+
export { M as MOTION_SCALE, a as MOTION_SENSITIVITY_LEVELS, b as adaptKeyframes, d as configureComponents, g as getMotionIntensity, e as getMotionSensitivity, p as prefersReducedMotion } from './chunks/base-BtJDNCB6.js';
|
|
41
41
|
export { MOTION_TOKENS, applyMotionTokens, getMotionTokens, importMotionTokens, mergeMotionTokens, motionToken, motionTokensToCss, motionTokensToJSON, motionTokensToVars, motionVar, parseDuration, parseEasing, resolveDurationToken, resolveEasingToken } from './components/tokens.js';
|
|
42
|
+
export { ALL_TAGS, LIVE_REGION_IDS, MOTION_SENSITIVITY, SENSITIVITY_CSS, STATIC_ALTERNATIVES, announce, auditMotionA11y, liveRegion, motionAllowed, restoreMotionSensitivity, setMotionSensitivity, staticAlternative } from './components/a11y.js';
|
|
42
43
|
export { C as COMPONENT_CATEGORIES } from './chunks/index-tags-43Xtd01A.js';
|
|
43
|
-
export { S as SPRING_PRESETS, c as createSpring, l as linearEasing, p as projectInertia, r as resolveSpring, a as rubberBand, s as snapTo, b as spring, d as springEasing, e as springSamples, f as stepSpring, g as supportsLinearEasing } from './chunks/spring-
|
|
44
|
-
export { T as TIMELINE_PRESETS, r as resolvePosition, s as supportsNativeScrub, t as timeline } from './chunks/core-
|
|
45
|
-
export { g as gesture, p as pinchScale, s as swipeDirection } from './chunks/core-
|
|
44
|
+
export { S as SPRING_PRESETS, c as createSpring, l as linearEasing, p as projectInertia, r as resolveSpring, a as rubberBand, s as snapTo, b as spring, d as springEasing, e as springSamples, f as stepSpring, g as supportsLinearEasing } from './chunks/spring-CxRz49Wk.js';
|
|
45
|
+
export { T as TIMELINE_PRESETS, r as resolvePosition, s as supportsNativeScrub, t as timeline } from './chunks/core-DS1nrx5L.js';
|
|
46
|
+
export { g as gesture, p as pinchScale, s as swipeDirection } from './chunks/core-DX6pdOoY.js';
|
|
46
47
|
|
|
47
48
|
/**
|
|
48
49
|
* use-scroll-animate/components
|
package/dist/components.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components.js","sources":["../src/components/index.ts"],"sourcesContent":["/**\n * use-scroll-animate/components\n *\n * Framework-agnostic, dependency-free animated UI components built on\n * Custom Elements + CSS + the Web Animations API. They run in any browser\n * and in Windows desktop apps that render with a web view: Electron, Tauri\n * (WebView2), WinUI 3 / WPF / WinForms with WebView2, and installed PWAs.\n *\n * ```js\n * import { defineComponents } from 'use-scroll-animate/components';\n * defineComponents(); // registers every <usa-*> element\n * // or only what you use (tree-shakable):\n * import { defineTypewriter } from 'use-scroll-animate/components/text';\n * ```\n *\n * Importing has no side effects and is SSR-safe; nothing is registered\n * until a `define*()` function runs in a browser.\n *\n * @license MIT\n */\nimport { defineRevealComponents } from './reveal/index';\nimport { defineTextComponents } from './text/index';\nimport { defineInteractionComponents } from './interaction/index';\nimport { defineFeedbackComponents } from './feedback/index';\nimport { defineBackgroundComponents } from './background/index';\nimport { defineTransitionComponents } from './transitions/index';\nimport { definePhysicsComponents } from './physics/index';\nimport { defineCardComponents } from './cards/index';\nimport { defineClickComponents } from './click/index';\nimport { defineUiComponents } from './ui/index';\nimport { definePageComponents } from './page/index';\nimport { defineTimelineComponents } from './timeline/index';\nimport { defineGestureComponents } from './gesture/index';\nimport { defineSvgComponents } from './svg/index';\nimport { defineWebglComponents } from './webgl/index';\nimport { defineDepthComponents } from './depth/index';\nimport { defineLayoutComponents } from './layout/index';\nimport { definePacksComponents } from './packs/index';\nimport { adoptVariants } from './ui/variants';\nimport { canDefine } from './base';\n\nexport * from './reveal/index';\nexport * from './text/index';\nexport * from './interaction/index';\nexport * from './feedback/index';\nexport * from './background/index';\nexport * from './transitions/index';\nexport * from './physics/index';\nexport * from './cards/index';\nexport * from './click/index';\nexport * from './ui/index';\nexport * from './page/index';\nexport * from './timeline/index';\nexport * from './gesture/index';\nexport * from './svg/index';\nexport * from './webgl/index';\nexport * from './depth/index';\nexport * from './layout/index';\nexport * from './packs/index';\nexport * from './tokens/index';\n\nexport { COMPONENT_CATEGORIES } from './index-tags';\nexport type { ComponentCategory } from './index-tags';\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst BY_CATEGORY: Record<ComponentCategory, () => void> = {\n reveal: defineRevealComponents,\n text: defineTextComponents,\n interaction: defineInteractionComponents,\n feedback: defineFeedbackComponents,\n background: defineBackgroundComponents,\n transitions: defineTransitionComponents,\n physics: definePhysicsComponents,\n cards: defineCardComponents,\n click: defineClickComponents,\n ui: defineUiComponents,\n page: definePageComponents,\n timeline: defineTimelineComponents,\n gesture: defineGestureComponents,\n svg: defineSvgComponents,\n webgl: defineWebglComponents,\n depth: defineDepthComponents,\n layout: defineLayoutComponents,\n packs: definePacksComponents,\n};\n\n/**\n * Register every `<usa-*>` component (or only the given categories).\n * Safe to call more than once and on the server (no-op without DOM).\n */\nexport function defineComponents(categories?: ComponentCategory[]): void {\n if (canDefine()) adoptVariants();\n (categories || (Object.keys(BY_CATEGORY) as ComponentCategory[])).forEach((c) => BY_CATEGORY[c]?.());\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"components.js","sources":["../src/components/index.ts"],"sourcesContent":["/**\n * use-scroll-animate/components\n *\n * Framework-agnostic, dependency-free animated UI components built on\n * Custom Elements + CSS + the Web Animations API. They run in any browser\n * and in Windows desktop apps that render with a web view: Electron, Tauri\n * (WebView2), WinUI 3 / WPF / WinForms with WebView2, and installed PWAs.\n *\n * ```js\n * import { defineComponents } from 'use-scroll-animate/components';\n * defineComponents(); // registers every <usa-*> element\n * // or only what you use (tree-shakable):\n * import { defineTypewriter } from 'use-scroll-animate/components/text';\n * ```\n *\n * Importing has no side effects and is SSR-safe; nothing is registered\n * until a `define*()` function runs in a browser.\n *\n * @license MIT\n */\nimport { defineRevealComponents } from './reveal/index';\nimport { defineTextComponents } from './text/index';\nimport { defineInteractionComponents } from './interaction/index';\nimport { defineFeedbackComponents } from './feedback/index';\nimport { defineBackgroundComponents } from './background/index';\nimport { defineTransitionComponents } from './transitions/index';\nimport { definePhysicsComponents } from './physics/index';\nimport { defineCardComponents } from './cards/index';\nimport { defineClickComponents } from './click/index';\nimport { defineUiComponents } from './ui/index';\nimport { definePageComponents } from './page/index';\nimport { defineTimelineComponents } from './timeline/index';\nimport { defineGestureComponents } from './gesture/index';\nimport { defineSvgComponents } from './svg/index';\nimport { defineWebglComponents } from './webgl/index';\nimport { defineDepthComponents } from './depth/index';\nimport { defineLayoutComponents } from './layout/index';\nimport { definePacksComponents } from './packs/index';\nimport { adoptVariants } from './ui/variants';\nimport { canDefine } from './base';\n\nexport * from './reveal/index';\nexport * from './text/index';\nexport * from './interaction/index';\nexport * from './feedback/index';\nexport * from './background/index';\nexport * from './transitions/index';\nexport * from './physics/index';\nexport * from './cards/index';\nexport * from './click/index';\nexport * from './ui/index';\nexport * from './page/index';\nexport * from './timeline/index';\nexport * from './gesture/index';\nexport * from './svg/index';\nexport * from './webgl/index';\nexport * from './depth/index';\nexport * from './layout/index';\nexport * from './packs/index';\nexport * from './tokens/index';\nexport * from './a11y/index';\n\nexport { COMPONENT_CATEGORIES } from './index-tags';\nexport type { ComponentCategory } from './index-tags';\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst BY_CATEGORY: Record<ComponentCategory, () => void> = {\n reveal: defineRevealComponents,\n text: defineTextComponents,\n interaction: defineInteractionComponents,\n feedback: defineFeedbackComponents,\n background: defineBackgroundComponents,\n transitions: defineTransitionComponents,\n physics: definePhysicsComponents,\n cards: defineCardComponents,\n click: defineClickComponents,\n ui: defineUiComponents,\n page: definePageComponents,\n timeline: defineTimelineComponents,\n gesture: defineGestureComponents,\n svg: defineSvgComponents,\n webgl: defineWebglComponents,\n depth: defineDepthComponents,\n layout: defineLayoutComponents,\n packs: definePacksComponents,\n};\n\n/**\n * Register every `<usa-*>` component (or only the given categories).\n * Safe to call more than once and on the server (no-op without DOM).\n */\nexport function defineComponents(categories?: ComponentCategory[]): void {\n if (canDefine()) adoptVariants();\n (categories || (Object.keys(BY_CATEGORY) as ComponentCategory[])).forEach((c) => BY_CATEGORY[c]?.());\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;AAmBG;AA+CH,MAAM,WAAW,GAA0C;AACzD,IAAA,MAAM,EAAE,sBAAsB;AAC9B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,WAAW,EAAE,2BAA2B;AACxC,IAAA,QAAQ,EAAE,wBAAwB;AAClC,IAAA,UAAU,EAAE,0BAA0B;AACtC,IAAA,WAAW,EAAE,0BAA0B;AACvC,IAAA,OAAO,EAAE,uBAAuB;AAChC,IAAA,KAAK,EAAE,oBAAoB;AAC3B,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,EAAE,EAAE,kBAAkB;AACtB,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,QAAQ,EAAE,wBAAwB;AAClC,IAAA,OAAO,EAAE,uBAAuB;AAChC,IAAA,GAAG,EAAE,mBAAmB;AACxB,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,MAAM,EAAE,sBAAsB;AAC9B,IAAA,KAAK,EAAE,qBAAqB;CAC7B;AAED;;;AAGG;AACG,SAAU,gBAAgB,CAAC,UAAgC,EAAA;AAC/D,IAAA,IAAI,SAAS,EAAE;AAAE,QAAA,aAAa,EAAE;IAChC,CAAC,UAAU,IAAK,MAAM,CAAC,IAAI,CAAC,WAAW,CAAyB,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC;AACtG;;;;"}
|