use-scroll-animate 4.2.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 +24 -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 +7 -6
- package/dist/components/angular.cjs.map +1 -1
- package/dist/components/angular.d.cts +80 -76
- package/dist/components/angular.d.ts +80 -76
- package/dist/components/angular.js +7 -6
- 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 +7 -6
- package/dist/components/solid.cjs.map +1 -1
- package/dist/components/solid.d.cts +80 -76
- package/dist/components/solid.d.ts +80 -76
- package/dist/components/solid.js +7 -6
- package/dist/components/solid.js.map +1 -1
- package/dist/components/svelte.cjs +7 -6
- package/dist/components/svelte.cjs.map +1 -1
- package/dist/components/svelte.d.cts +80 -76
- package/dist/components/svelte.d.ts +80 -76
- package/dist/components/svelte.js +7 -6
- 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 +284 -11
- package/dist/components/text.cjs.map +1 -1
- package/dist/components/text.d.cts +166 -3
- package/dist/components/text.d.ts +166 -3
- package/dist/components/text.js +280 -13
- package/dist/components/text.js.map +1 -1
- 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 +7 -6
- package/dist/components/vue.cjs.map +1 -1
- package/dist/components/vue.d.cts +80 -76
- package/dist/components/vue.d.ts +80 -76
- package/dist/components/vue.js +7 -6
- 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 +27 -5
- package/dist/components.cjs.map +1 -1
- package/dist/components.d.cts +289 -108
- package/dist/components.d.ts +289 -108
- package/dist/components.js +9 -8
- 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 +2 -2
- 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.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`). */
|
|
@@ -165,7 +184,11 @@ declare function defineTypewriter(tag?: string): CustomElementConstructor | unde
|
|
|
165
184
|
* them in a cascade (pure CSS animation per unit, transform / opacity /
|
|
166
185
|
* filter only). Words never break across lines.
|
|
167
186
|
*
|
|
168
|
-
*
|
|
187
|
+
* 4.3: `Intl.Segmenter`-aware (emoji, CJK words), Arabic-script words are
|
|
188
|
+
* never split below the word, `by="lines"` reveals line by line, and `from`
|
|
189
|
+
* (`start` · `end` · `center` · `edges` · `random`) sets the cascade order.
|
|
190
|
+
*
|
|
191
|
+
* Attributes: `by` (`chars` | `words` | `lines`, default `chars`), `effect`
|
|
169
192
|
* (`rise` | `fade` | `blur` | `flip` | `pop`, default `rise`), `stagger`
|
|
170
193
|
* (ms between units, 28 for chars / 70 for words), `duration` (ms, 620),
|
|
171
194
|
* `delay` (ms, 0), `trigger` (`view` | `load` | `manual`, default `view`),
|
|
@@ -292,6 +315,185 @@ interface UsaScrollHighlightElement extends UsaElement {
|
|
|
292
315
|
}
|
|
293
316
|
declare function defineScrollHighlight(tag?: string): CustomElementConstructor | undefined;
|
|
294
317
|
|
|
318
|
+
/**
|
|
319
|
+
* Where a step starts on a timeline:
|
|
320
|
+
* - a number: absolute time in ms
|
|
321
|
+
* - `'>'` (default): when the previous step ends · `'<'`: when it starts
|
|
322
|
+
* - `'+=200'` / `'-=200'`: after / overlapping the previous end
|
|
323
|
+
* - `'<+=100'`: 100ms after the previous step's start
|
|
324
|
+
* - `'intro'` / `'intro+=150'`: at (or relative to) a label
|
|
325
|
+
*/
|
|
326
|
+
type TimelinePosition = number | string;
|
|
327
|
+
interface TimelineStepOptions {
|
|
328
|
+
/** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
|
|
329
|
+
duration?: number | string;
|
|
330
|
+
/** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
|
|
331
|
+
easing?: string;
|
|
332
|
+
/** Start position, see `TimelinePosition`. */
|
|
333
|
+
at?: TimelinePosition;
|
|
334
|
+
/** ms between targets when the selector matches several elements. */
|
|
335
|
+
stagger?: number;
|
|
336
|
+
}
|
|
337
|
+
interface TimelineOptions {
|
|
338
|
+
/** Defaults for every step. */
|
|
339
|
+
defaults?: Pick<TimelineStepOptions, 'duration' | 'easing' | 'stagger'>;
|
|
340
|
+
/** Playback rate (1 = normal). */
|
|
341
|
+
speed?: number;
|
|
342
|
+
/** Called after `play()` reaches the end (or the start when reversed). */
|
|
343
|
+
onComplete?: () => void;
|
|
344
|
+
/** Called on every frame with progress 0–1. */
|
|
345
|
+
onUpdate?: (progress: number) => void;
|
|
346
|
+
}
|
|
347
|
+
interface ScrubOptions {
|
|
348
|
+
/** Scroll offset (px) before the source's top reaches the viewport bottom where progress starts (JS engine only). */
|
|
349
|
+
offset?: number;
|
|
350
|
+
/** Smoothing 0–1 (0 = immediate, default 0). Smoothing needs the JS engine. */
|
|
351
|
+
smooth?: number;
|
|
352
|
+
/**
|
|
353
|
+
* 4.1: which progress source drives the timeline.
|
|
354
|
+
* - `'view'` (default): `source` moving through the viewport (CSS `ViewTimeline`, range `cover`).
|
|
355
|
+
* - `'scroll'`: the scroll position of `source` itself (a scroll container; CSS `ScrollTimeline`).
|
|
356
|
+
*/
|
|
357
|
+
source?: 'view' | 'scroll';
|
|
358
|
+
/** 4.1: `'auto'` (default) uses the browser's native scroll-driven animations when available, `'js'` forces the fallback. */
|
|
359
|
+
engine?: 'auto' | 'native' | 'js';
|
|
360
|
+
/** 4.1: scroll axis, `'block'` (default) · `'inline'` · `'x'` · `'y'`. */
|
|
361
|
+
axis?: 'block' | 'inline' | 'x' | 'y';
|
|
362
|
+
}
|
|
363
|
+
/** The function `scrub()` returns: call it to stop. `native` tells which engine runs it. */
|
|
364
|
+
interface ScrubHandle {
|
|
365
|
+
(): void;
|
|
366
|
+
/** `true` when the browser's ScrollTimeline / ViewTimeline drives it (compositor, no JS per frame). */
|
|
367
|
+
readonly native: boolean;
|
|
368
|
+
}
|
|
369
|
+
/** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */
|
|
370
|
+
declare function supportsNativeScrub(source?: 'view' | 'scroll'): boolean;
|
|
371
|
+
interface Timeline {
|
|
372
|
+
/** Total length in ms. */
|
|
373
|
+
readonly duration: number;
|
|
374
|
+
/** Label positions in ms. */
|
|
375
|
+
readonly labels: Readonly<Record<string, number>>;
|
|
376
|
+
/** Current playhead in ms. */
|
|
377
|
+
readonly time: number;
|
|
378
|
+
/** Add a step: animate `target` with keyframes or a preset name (`fade-up`, `scale`…). */
|
|
379
|
+
to(target: string | Element | Element[] | NodeList, frames: Keyframe[] | string, options?: TimelineStepOptions): Timeline;
|
|
380
|
+
/** Name a position (default: the current end). */
|
|
381
|
+
label(name: string, at?: TimelinePosition): Timeline;
|
|
382
|
+
/** Run `fn` when the playhead passes `at`. */
|
|
383
|
+
call(fn: () => void, at?: TimelinePosition): Timeline;
|
|
384
|
+
/** Play forwards from the playhead (from 0 when at the end). Resolves at the end. */
|
|
385
|
+
play(from?: TimelinePosition): Promise<void>;
|
|
386
|
+
/** Play backwards to 0. */
|
|
387
|
+
reverse(): Promise<void>;
|
|
388
|
+
pause(): Timeline;
|
|
389
|
+
/** Jump to a time (ms) or label. */
|
|
390
|
+
seek(to: TimelinePosition): Timeline;
|
|
391
|
+
/** Get or set progress 0–1. */
|
|
392
|
+
progress(p?: number): number;
|
|
393
|
+
/**
|
|
394
|
+
* Tie progress to scroll: `source` moving through the viewport (or, with
|
|
395
|
+
* `{ source: 'scroll' }`, a scroll container's own position). Runs on native
|
|
396
|
+
* ScrollTimeline / ViewTimeline when available (and no `smooth`, `offset`,
|
|
397
|
+
* `call()` cues or `onUpdate` need JS), else on a rAF-throttled listener.
|
|
398
|
+
* Returns a stop function with a `native` flag.
|
|
399
|
+
*/
|
|
400
|
+
scrub(source: Element, options?: ScrubOptions): ScrubHandle;
|
|
401
|
+
/** Stop and drop every animation (elements keep their last frame). */
|
|
402
|
+
cancel(): void;
|
|
403
|
+
}
|
|
404
|
+
/** Keyframe presets usable by name in `to()` and `data-tl`. */
|
|
405
|
+
declare const TIMELINE_PRESETS: Record<string, Keyframe[]>;
|
|
406
|
+
/** Resolve a position against the previous step and labels (pure). */
|
|
407
|
+
declare function resolvePosition(pos: TimelinePosition | undefined, end: number, prevStart: number, labels?: Record<string, number>): number;
|
|
408
|
+
/**
|
|
409
|
+
* Choreograph animations on one clock: chain, overlap, label, seek, reverse and
|
|
410
|
+
* scrub them with scroll. Built on WAAPI (paused animations driven by one
|
|
411
|
+
* playhead); without WAAPI or under reduced motion it jumps to the end state.
|
|
412
|
+
*
|
|
413
|
+
* @example
|
|
414
|
+
* const tl = timeline({ defaults: { duration: 500 } })
|
|
415
|
+
* .to('.title', 'fade-up')
|
|
416
|
+
* .label('cards')
|
|
417
|
+
* .to('.card', 'scale', { stagger: 80, at: '-=200' })
|
|
418
|
+
* .to('.cta', [{ opacity: 0 }, { opacity: 1 }], { at: 'cards+=400' });
|
|
419
|
+
* tl.play(); // or tl.scrub(document.querySelector('.hero'))
|
|
420
|
+
*/
|
|
421
|
+
declare function timeline(options?: TimelineOptions): Timeline;
|
|
422
|
+
|
|
423
|
+
/**
|
|
424
|
+
* `splitText()` (4.3) — split an element's text into characters, words and / or
|
|
425
|
+
* lines, ready for per-unit choreography with `timeline()`.
|
|
426
|
+
*
|
|
427
|
+
* - Grapheme- and word-aware via `Intl.Segmenter` when available: emoji and
|
|
428
|
+
* combining marks stay whole; Chinese / Japanese / Korean text is split into
|
|
429
|
+
* real words (or one unit per character without `Segmenter`).
|
|
430
|
+
* - RTL aware: Arabic-script text (cursive, letters join) is never split
|
|
431
|
+
* below the word, so shaping is preserved; Hebrew and other RTL scripts
|
|
432
|
+
* split per character. Units stay in logical (reading) order.
|
|
433
|
+
* - Nested inline markup (`<em>`, `<a>`, `<br>`) is preserved.
|
|
434
|
+
* - Accessible: the original text stays available to assistive tech via a
|
|
435
|
+
* visually hidden copy; the split spans are `aria-hidden`.
|
|
436
|
+
*/
|
|
437
|
+
type SplitBy = 'char' | 'word' | 'line';
|
|
438
|
+
interface SplitTextOptions {
|
|
439
|
+
/** What to split into: `'char'`, `'word'`, `'line'` or several, e.g. `['word', 'line']`. Default `'char'` (words are always wrapped too). */
|
|
440
|
+
by?: SplitBy | SplitBy[] | string;
|
|
441
|
+
/** Locale for `Intl.Segmenter` (default: the element's `lang`, else the document's). */
|
|
442
|
+
locale?: string;
|
|
443
|
+
/** Class prefix (default `usa-split`): units get `usa-split-char` / `-word` / `-line`. */
|
|
444
|
+
className?: string;
|
|
445
|
+
}
|
|
446
|
+
interface SplitResult {
|
|
447
|
+
chars: HTMLElement[];
|
|
448
|
+
words: HTMLElement[];
|
|
449
|
+
lines: HTMLElement[];
|
|
450
|
+
/** `'rtl'` or `'ltr'` — the direction the split ran in. */
|
|
451
|
+
direction: 'ltr' | 'rtl';
|
|
452
|
+
/** Re-measure lines (call after a resize or font load). */
|
|
453
|
+
relayout(): HTMLElement[];
|
|
454
|
+
/** Restore the original markup. */
|
|
455
|
+
revert(): void;
|
|
456
|
+
}
|
|
457
|
+
/** Scripts whose letters join (splitting them would break shaping). */
|
|
458
|
+
declare const JOINING_SCRIPT: RegExp;
|
|
459
|
+
/** Grapheme clusters of `s` (emoji / combining marks stay whole). */
|
|
460
|
+
declare function graphemes(s: string, locale?: string): string[];
|
|
461
|
+
/**
|
|
462
|
+
* Word-ish tokens of `s`, whitespace kept as separate tokens. CJK text is
|
|
463
|
+
* segmented into words with `Intl.Segmenter`, or per character without it.
|
|
464
|
+
*/
|
|
465
|
+
declare function words(s: string, locale?: string): string[];
|
|
466
|
+
declare function splitText(el: HTMLElement, options?: SplitTextOptions): SplitResult;
|
|
467
|
+
type SplitFrom = 'start' | 'end' | 'center' | 'edges' | 'random';
|
|
468
|
+
/** Order indices `0…n-1` by choreography: from the start, end, center outwards, edges inwards, or random (seeded). */
|
|
469
|
+
declare function splitOrder(n: number, from?: SplitFrom, seed?: number): number[];
|
|
470
|
+
interface SplitTimelineOptions extends SplitTextOptions {
|
|
471
|
+
/** Which units to animate (default: the finest in `by`). */
|
|
472
|
+
unit?: 'char' | 'word' | 'line';
|
|
473
|
+
/** Timeline preset name or keyframes (default `'fade-up'`). */
|
|
474
|
+
preset?: string | Keyframe[];
|
|
475
|
+
/** ms between units (default 30 for chars, 80 for words, 140 for lines). */
|
|
476
|
+
stagger?: number;
|
|
477
|
+
/** Duration per unit in ms or a motion token name (default 500). */
|
|
478
|
+
duration?: number | string;
|
|
479
|
+
easing?: string;
|
|
480
|
+
/** Choreography order (default `'start'` — reading order, also for RTL). */
|
|
481
|
+
from?: SplitFrom;
|
|
482
|
+
}
|
|
483
|
+
/**
|
|
484
|
+
* Split `el` and build a `timeline()` with one step per unit — play it,
|
|
485
|
+
* `scrub()` it with scroll, `reverse()` or `seek()` it.
|
|
486
|
+
*
|
|
487
|
+
* ```ts
|
|
488
|
+
* const { timeline: tl } = splitTimeline(h1, { by: 'char', preset: 'blur', from: 'center' });
|
|
489
|
+
* tl.play();
|
|
490
|
+
* ```
|
|
491
|
+
*/
|
|
492
|
+
declare function splitTimeline(el: HTMLElement, options?: SplitTimelineOptions): {
|
|
493
|
+
split: SplitResult;
|
|
494
|
+
timeline: Timeline;
|
|
495
|
+
};
|
|
496
|
+
|
|
295
497
|
/**
|
|
296
498
|
* use-scroll-animate/components/text — text effects.
|
|
297
499
|
* `<usa-typewriter>`, `<usa-split-text>`, `<usa-scramble>`, `<usa-counter>`,
|
|
@@ -1747,111 +1949,6 @@ declare global {
|
|
|
1747
1949
|
}
|
|
1748
1950
|
}
|
|
1749
1951
|
|
|
1750
|
-
/**
|
|
1751
|
-
* Where a step starts on a timeline:
|
|
1752
|
-
* - a number: absolute time in ms
|
|
1753
|
-
* - `'>'` (default): when the previous step ends · `'<'`: when it starts
|
|
1754
|
-
* - `'+=200'` / `'-=200'`: after / overlapping the previous end
|
|
1755
|
-
* - `'<+=100'`: 100ms after the previous step's start
|
|
1756
|
-
* - `'intro'` / `'intro+=150'`: at (or relative to) a label
|
|
1757
|
-
*/
|
|
1758
|
-
type TimelinePosition = number | string;
|
|
1759
|
-
interface TimelineStepOptions {
|
|
1760
|
-
/** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
|
|
1761
|
-
duration?: number | string;
|
|
1762
|
-
/** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
|
|
1763
|
-
easing?: string;
|
|
1764
|
-
/** Start position, see `TimelinePosition`. */
|
|
1765
|
-
at?: TimelinePosition;
|
|
1766
|
-
/** ms between targets when the selector matches several elements. */
|
|
1767
|
-
stagger?: number;
|
|
1768
|
-
}
|
|
1769
|
-
interface TimelineOptions {
|
|
1770
|
-
/** Defaults for every step. */
|
|
1771
|
-
defaults?: Pick<TimelineStepOptions, 'duration' | 'easing' | 'stagger'>;
|
|
1772
|
-
/** Playback rate (1 = normal). */
|
|
1773
|
-
speed?: number;
|
|
1774
|
-
/** Called after `play()` reaches the end (or the start when reversed). */
|
|
1775
|
-
onComplete?: () => void;
|
|
1776
|
-
/** Called on every frame with progress 0–1. */
|
|
1777
|
-
onUpdate?: (progress: number) => void;
|
|
1778
|
-
}
|
|
1779
|
-
interface ScrubOptions {
|
|
1780
|
-
/** Scroll offset (px) before the source's top reaches the viewport bottom where progress starts (JS engine only). */
|
|
1781
|
-
offset?: number;
|
|
1782
|
-
/** Smoothing 0–1 (0 = immediate, default 0). Smoothing needs the JS engine. */
|
|
1783
|
-
smooth?: number;
|
|
1784
|
-
/**
|
|
1785
|
-
* 4.1: which progress source drives the timeline.
|
|
1786
|
-
* - `'view'` (default): `source` moving through the viewport (CSS `ViewTimeline`, range `cover`).
|
|
1787
|
-
* - `'scroll'`: the scroll position of `source` itself (a scroll container; CSS `ScrollTimeline`).
|
|
1788
|
-
*/
|
|
1789
|
-
source?: 'view' | 'scroll';
|
|
1790
|
-
/** 4.1: `'auto'` (default) uses the browser's native scroll-driven animations when available, `'js'` forces the fallback. */
|
|
1791
|
-
engine?: 'auto' | 'native' | 'js';
|
|
1792
|
-
/** 4.1: scroll axis, `'block'` (default) · `'inline'` · `'x'` · `'y'`. */
|
|
1793
|
-
axis?: 'block' | 'inline' | 'x' | 'y';
|
|
1794
|
-
}
|
|
1795
|
-
/** The function `scrub()` returns: call it to stop. `native` tells which engine runs it. */
|
|
1796
|
-
interface ScrubHandle {
|
|
1797
|
-
(): void;
|
|
1798
|
-
/** `true` when the browser's ScrollTimeline / ViewTimeline drives it (compositor, no JS per frame). */
|
|
1799
|
-
readonly native: boolean;
|
|
1800
|
-
}
|
|
1801
|
-
/** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */
|
|
1802
|
-
declare function supportsNativeScrub(source?: 'view' | 'scroll'): boolean;
|
|
1803
|
-
interface Timeline {
|
|
1804
|
-
/** Total length in ms. */
|
|
1805
|
-
readonly duration: number;
|
|
1806
|
-
/** Label positions in ms. */
|
|
1807
|
-
readonly labels: Readonly<Record<string, number>>;
|
|
1808
|
-
/** Current playhead in ms. */
|
|
1809
|
-
readonly time: number;
|
|
1810
|
-
/** Add a step: animate `target` with keyframes or a preset name (`fade-up`, `scale`…). */
|
|
1811
|
-
to(target: string | Element | Element[] | NodeList, frames: Keyframe[] | string, options?: TimelineStepOptions): Timeline;
|
|
1812
|
-
/** Name a position (default: the current end). */
|
|
1813
|
-
label(name: string, at?: TimelinePosition): Timeline;
|
|
1814
|
-
/** Run `fn` when the playhead passes `at`. */
|
|
1815
|
-
call(fn: () => void, at?: TimelinePosition): Timeline;
|
|
1816
|
-
/** Play forwards from the playhead (from 0 when at the end). Resolves at the end. */
|
|
1817
|
-
play(from?: TimelinePosition): Promise<void>;
|
|
1818
|
-
/** Play backwards to 0. */
|
|
1819
|
-
reverse(): Promise<void>;
|
|
1820
|
-
pause(): Timeline;
|
|
1821
|
-
/** Jump to a time (ms) or label. */
|
|
1822
|
-
seek(to: TimelinePosition): Timeline;
|
|
1823
|
-
/** Get or set progress 0–1. */
|
|
1824
|
-
progress(p?: number): number;
|
|
1825
|
-
/**
|
|
1826
|
-
* Tie progress to scroll: `source` moving through the viewport (or, with
|
|
1827
|
-
* `{ source: 'scroll' }`, a scroll container's own position). Runs on native
|
|
1828
|
-
* ScrollTimeline / ViewTimeline when available (and no `smooth`, `offset`,
|
|
1829
|
-
* `call()` cues or `onUpdate` need JS), else on a rAF-throttled listener.
|
|
1830
|
-
* Returns a stop function with a `native` flag.
|
|
1831
|
-
*/
|
|
1832
|
-
scrub(source: Element, options?: ScrubOptions): ScrubHandle;
|
|
1833
|
-
/** Stop and drop every animation (elements keep their last frame). */
|
|
1834
|
-
cancel(): void;
|
|
1835
|
-
}
|
|
1836
|
-
/** Keyframe presets usable by name in `to()` and `data-tl`. */
|
|
1837
|
-
declare const TIMELINE_PRESETS: Record<string, Keyframe[]>;
|
|
1838
|
-
/** Resolve a position against the previous step and labels (pure). */
|
|
1839
|
-
declare function resolvePosition(pos: TimelinePosition | undefined, end: number, prevStart: number, labels?: Record<string, number>): number;
|
|
1840
|
-
/**
|
|
1841
|
-
* Choreograph animations on one clock: chain, overlap, label, seek, reverse and
|
|
1842
|
-
* scrub them with scroll. Built on WAAPI (paused animations driven by one
|
|
1843
|
-
* playhead); without WAAPI or under reduced motion it jumps to the end state.
|
|
1844
|
-
*
|
|
1845
|
-
* @example
|
|
1846
|
-
* const tl = timeline({ defaults: { duration: 500 } })
|
|
1847
|
-
* .to('.title', 'fade-up')
|
|
1848
|
-
* .label('cards')
|
|
1849
|
-
* .to('.card', 'scale', { stagger: 80, at: '-=200' })
|
|
1850
|
-
* .to('.cta', [{ opacity: 0 }, { opacity: 1 }], { at: 'cards+=400' });
|
|
1851
|
-
* tl.play(); // or tl.scrub(document.querySelector('.hero'))
|
|
1852
|
-
*/
|
|
1853
|
-
declare function timeline(options?: TimelineOptions): Timeline;
|
|
1854
|
-
|
|
1855
1952
|
/**
|
|
1856
1953
|
* `<usa-timeline>` — declarative choreography. Every descendant with
|
|
1857
1954
|
* `data-tl="<preset>"` becomes a step, in document order; `data-at`
|
|
@@ -2496,11 +2593,95 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
2496
2593
|
};
|
|
2497
2594
|
type ComponentCategory = keyof typeof COMPONENT_CATEGORIES;
|
|
2498
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
|
+
|
|
2499
2680
|
/**
|
|
2500
2681
|
* Register every `<usa-*>` component (or only the given categories).
|
|
2501
2682
|
* Safe to call more than once and on the server (no-op without DOM).
|
|
2502
2683
|
*/
|
|
2503
2684
|
declare function defineComponents(categories?: ComponentCategory[]): void;
|
|
2504
2685
|
|
|
2505
|
-
export { AMBIENT_EFFECTS, ANIM_ICONS, BUTTON_DEFORMS, CARD_EFFECTS, CLICK_EFFECTS, COMPONENT_CATEGORIES, CURSOR_MODES, 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, 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, spring, springEasing, springEffectKeyframes, springSamples, stepSpring, supportsLinearEasing, supportsNativeScrub, supportsOrientation, supportsViewTransitions, supportsWebGL, swipeDirection, themeTransition, timeline, toast, viewTransition };
|
|
2506
|
-
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, 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 };
|