use-scroll-animate 3.7.0 → 3.9.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 +29 -0
- package/README.md +1 -0
- package/README_ja.md +1 -0
- package/README_zh.md +1 -0
- package/dist/chunks/{base-BpROOcey.js → base-BRIPyPtX.js} +11 -2
- package/dist/chunks/{base-BpROOcey.js.map → base-BRIPyPtX.js.map} +1 -1
- package/dist/chunks/{base-CXx7jZ-o.cjs → base-Dm6ee5ug.cjs} +11 -1
- package/dist/chunks/{base-CXx7jZ-o.cjs.map → base-Dm6ee5ug.cjs.map} +1 -1
- package/dist/chunks/bind-B_CTL6Qn.js +22 -0
- package/dist/chunks/bind-B_CTL6Qn.js.map +1 -0
- package/dist/chunks/bind-Ui43-n2d.cjs +25 -0
- package/dist/chunks/bind-Ui43-n2d.cjs.map +1 -0
- package/dist/chunks/{core-IaorbTdu.cjs → core-CHAtivHV.cjs} +2 -2
- package/dist/chunks/{core-IaorbTdu.cjs.map → core-CHAtivHV.cjs.map} +1 -1
- package/dist/chunks/{core-uxs3ETou.js → core-CYozf_E-.js} +2 -2
- package/dist/chunks/{core-uxs3ETou.js.map → core-CYozf_E-.js.map} +1 -1
- package/dist/chunks/{index-tags-BANJ-e4H.js → index-tags-BmQR17Sb.js} +2 -1
- package/dist/chunks/{index-tags-BANJ-e4H.js.map → index-tags-BmQR17Sb.js.map} +1 -1
- package/dist/chunks/{index-tags-wbuPiMR6.cjs → index-tags-DYYsgbba.cjs} +2 -1
- package/dist/chunks/{index-tags-wbuPiMR6.cjs.map → index-tags-DYYsgbba.cjs.map} +1 -1
- package/dist/chunks/{spring-2OTnYCzm.cjs → spring-Dp5BllPB.cjs} +2 -2
- package/dist/chunks/{spring-2OTnYCzm.cjs.map → spring-Dp5BllPB.cjs.map} +1 -1
- package/dist/chunks/{spring-C-fw7_9f.js → spring-UBPhrh1X.js} +2 -2
- package/dist/chunks/{spring-C-fw7_9f.js.map → spring-UBPhrh1X.js.map} +1 -1
- package/dist/chunks/{variants-CHe1VbSn.js → variants-DTypaOH3.js} +2 -2
- package/dist/chunks/{variants-CHe1VbSn.js.map → variants-DTypaOH3.js.map} +1 -1
- package/dist/chunks/{variants-BNIrn4ch.cjs → variants-_dC-ey6R.cjs} +2 -2
- package/dist/chunks/{variants-BNIrn4ch.cjs.map → variants-_dC-ey6R.cjs.map} +1 -1
- package/dist/components/angular.cjs +68 -0
- package/dist/components/angular.cjs.map +1 -0
- package/dist/components/angular.d.cts +1687 -0
- package/dist/components/angular.d.ts +1687 -0
- package/dist/components/angular.js +62 -0
- package/dist/components/angular.js.map +1 -0
- package/dist/components/background.cjs +2 -2
- package/dist/components/background.js +3 -3
- package/dist/components/cards.cjs +2 -2
- package/dist/components/cards.js +3 -3
- package/dist/components/click.cjs +2 -2
- package/dist/components/click.js +3 -3
- package/dist/components/depth.cjs +3 -3
- package/dist/components/depth.js +4 -4
- package/dist/components/feedback.cjs +1 -1
- package/dist/components/feedback.js +2 -2
- package/dist/components/gesture.cjs +3 -3
- package/dist/components/gesture.js +5 -5
- package/dist/components/interaction.cjs +1 -1
- package/dist/components/interaction.js +2 -2
- package/dist/components/jsx.d.cts +1 -0
- package/dist/components/jsx.d.ts +1 -0
- package/dist/components/layout.cjs +1 -1
- package/dist/components/layout.js +2 -2
- package/dist/components/lazy.cjs +2 -1
- package/dist/components/lazy.cjs.map +1 -1
- package/dist/components/lazy.d.cts +1 -0
- package/dist/components/lazy.d.ts +1 -0
- package/dist/components/lazy.js +2 -1
- package/dist/components/lazy.js.map +1 -1
- package/dist/components/packs.cjs +194 -0
- package/dist/components/packs.cjs.map +1 -0
- package/dist/components/packs.css +3 -0
- package/dist/components/packs.d.cts +107 -0
- package/dist/components/packs.d.ts +107 -0
- package/dist/components/packs.js +185 -0
- package/dist/components/packs.js.map +1 -0
- package/dist/components/page.cjs +2 -2
- package/dist/components/page.js +3 -3
- package/dist/components/physics.cjs +2 -2
- package/dist/components/physics.js +4 -4
- package/dist/components/react.cjs +1 -1
- package/dist/components/react.js +1 -1
- package/dist/components/reveal.cjs +1 -1
- package/dist/components/reveal.js +2 -2
- package/dist/components/solid.cjs +63 -0
- package/dist/components/solid.cjs.map +1 -0
- package/dist/components/solid.d.cts +1718 -0
- package/dist/components/solid.d.ts +1718 -0
- package/dist/components/solid.js +59 -0
- package/dist/components/solid.js.map +1 -0
- package/dist/components/svelte.cjs +60 -0
- package/dist/components/svelte.cjs.map +1 -0
- package/dist/components/svelte.d.cts +1686 -0
- package/dist/components/svelte.d.ts +1686 -0
- package/dist/components/svelte.js +56 -0
- package/dist/components/svelte.js.map +1 -0
- package/dist/components/svg.cjs +1 -1
- package/dist/components/svg.js +2 -2
- package/dist/components/text.cjs +1 -1
- package/dist/components/text.js +2 -2
- package/dist/components/timeline.cjs +1 -1
- package/dist/components/timeline.js +2 -2
- package/dist/components/transitions.cjs +5 -1
- package/dist/components/transitions.cjs.map +1 -1
- package/dist/components/transitions.d.cts +2 -0
- package/dist/components/transitions.d.ts +2 -0
- package/dist/components/transitions.js +6 -2
- package/dist/components/transitions.js.map +1 -1
- package/dist/components/ui.cjs +3 -3
- 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.d.cts +25 -0
- package/dist/components/vue.d.ts +25 -0
- 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.js +2 -2
- package/dist/components.cjs +14 -5
- package/dist/components.cjs.map +1 -1
- package/dist/components.css +1 -0
- package/dist/components.d.cts +65 -2
- package/dist/components.d.ts +65 -2
- package/dist/components.js +11 -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 +7 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +7 -0
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +2 -2
- package/dist/index.umd.js.map +1 -1
- package/docs/components.md +24 -0
- package/docs/frameworks-ssr.md +36 -0
- package/docs/hybrid-apps.md +130 -0
- package/docs/upgrading-4.md +65 -0
- package/package.json +43 -2
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { defineComponents } from '../components.js';
|
|
2
|
+
export { b as bindUsa, u as usaEventName } from '../chunks/bind-B_CTL6Qn.js';
|
|
3
|
+
import './reveal.js';
|
|
4
|
+
import '../chunks/base-BRIPyPtX.js';
|
|
5
|
+
import './text.js';
|
|
6
|
+
import './interaction.js';
|
|
7
|
+
import './feedback.js';
|
|
8
|
+
import './background.js';
|
|
9
|
+
import '../chunks/variants-DTypaOH3.js';
|
|
10
|
+
import './transitions.js';
|
|
11
|
+
import './physics.js';
|
|
12
|
+
import '../chunks/spring-UBPhrh1X.js';
|
|
13
|
+
import './cards.js';
|
|
14
|
+
import './click.js';
|
|
15
|
+
import './ui.js';
|
|
16
|
+
import './page.js';
|
|
17
|
+
import './timeline.js';
|
|
18
|
+
import './gesture.js';
|
|
19
|
+
import '../chunks/core-CYozf_E-.js';
|
|
20
|
+
import './svg.js';
|
|
21
|
+
import './webgl.js';
|
|
22
|
+
import './depth.js';
|
|
23
|
+
import './layout.js';
|
|
24
|
+
import './packs.js';
|
|
25
|
+
import '../chunks/index-tags-BmQR17Sb.js';
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* use-scroll-animate/components/angular — Angular integration (v3.8).
|
|
29
|
+
* Angular renders `<usa-*>` tags once the component (or NgModule) allows
|
|
30
|
+
* custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding
|
|
31
|
+
* `[checked]="on"` and event binding `(usa:change)="…"` then work as is.
|
|
32
|
+
* This entry is framework-free (no `@angular/*` import):
|
|
33
|
+
*
|
|
34
|
+
* ```ts
|
|
35
|
+
* import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';
|
|
36
|
+
* import { usaInitializer } from 'use-scroll-animate/components/angular';
|
|
37
|
+
*
|
|
38
|
+
* // app.config.ts
|
|
39
|
+
* providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]
|
|
40
|
+
*
|
|
41
|
+
* @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
42
|
+
* template: `<usa-toggle [checked]="on" (usa:change)="on = $any($event).detail.checked"></usa-toggle>` })
|
|
43
|
+
* ```
|
|
44
|
+
* `bindUsa(el, { props, on })` is available for directives that bind imperatively.
|
|
45
|
+
*/
|
|
46
|
+
/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */
|
|
47
|
+
function usaInitializer(categories) {
|
|
48
|
+
return () => () => {
|
|
49
|
+
if (typeof window !== 'undefined')
|
|
50
|
+
defineComponents(categories);
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */
|
|
54
|
+
function defineUsa(categories) {
|
|
55
|
+
if (typeof window !== 'undefined')
|
|
56
|
+
defineComponents(categories);
|
|
57
|
+
}
|
|
58
|
+
/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)="on = usaDetail($event).checked"`. */
|
|
59
|
+
const usaDetail = (e) => e.detail;
|
|
60
|
+
|
|
61
|
+
export { defineUsa, usaDetail, usaInitializer };
|
|
62
|
+
//# sourceMappingURL=angular.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"angular.js","sources":["../../src/components/frameworks/angular.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/angular — Angular integration (v3.8).\n * Angular renders `<usa-*>` tags once the component (or NgModule) allows\n * custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding\n * `[checked]=\"on\"` and event binding `(usa:change)=\"…\"` then work as is.\n * This entry is framework-free (no `@angular/*` import):\n *\n * ```ts\n * import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';\n * import { usaInitializer } from 'use-scroll-animate/components/angular';\n *\n * // app.config.ts\n * providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]\n *\n * @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],\n * template: `<usa-toggle [checked]=\"on\" (usa:change)=\"on = $any($event).detail.checked\"></usa-toggle>` })\n * ```\n * `bindUsa(el, { props, on })` is available for directives that bind imperatively.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */\nexport function usaInitializer(categories?: ComponentCategory[]): () => () => void {\n return () => () => {\n if (typeof window !== 'undefined') defineComponents(categories);\n };\n}\n\n/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)=\"on = usaDetail($event).checked\"`. */\nexport const usaDetail = <T = any>(e: Event): T => (e as CustomEvent<T>).detail;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAMH;AACM,SAAU,cAAc,CAAC,UAAgC,EAAA;AAC7D,IAAA,OAAO,MAAM,MAAK;QAChB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE,IAAA,CAAC;AACH;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;AAEA;AACO,MAAM,SAAS,GAAG,CAAU,CAAQ,KAAS,CAAoB,CAAC;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
4
|
-
var variants = require('../chunks/variants-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
|
+
var variants = require('../chunks/variants-_dC-ey6R.cjs');
|
|
5
5
|
|
|
6
6
|
var css$6 = "usa-aurora{position:relative;display:block;isolation:isolate;overflow:hidden}usa-aurora .usa-aurora-layer{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:var(--usa-aurora-opacity,0.7);overflow:hidden;contain:strict}usa-aurora .usa-aurora-layer i{position:absolute;display:block;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--c),transparent);will-change:transform;animation:usa-aurora-a var(--usa-aurora-speed,18s) ease-in-out infinite alternate}usa-aurora .usa-aurora-layer i:nth-child(1){left:-15%;top:-30%}usa-aurora .usa-aurora-layer i:nth-child(2){right:-20%;top:-10%;animation-name:usa-aurora-b;animation-duration:calc(var(--usa-aurora-speed,18s) * 1.3)}usa-aurora .usa-aurora-layer i:nth-child(3){left:10%;bottom:-45%;animation-name:usa-aurora-c;animation-duration:calc(var(--usa-aurora-speed,18s) * 0.9)}usa-aurora .usa-aurora-layer i:nth-child(4){right:0;bottom:-30%;width:50%;animation-name:usa-aurora-b;animation-direction:alternate-reverse}usa-aurora[paused] .usa-aurora-layer i,usa-aurora[data-offscreen] .usa-aurora-layer i{animation-play-state:paused}@keyframes usa-aurora-a{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(30%,20%,0) scale(1.25)}}@keyframes usa-aurora-b{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-35%,25%,0) scale(0.85)}}@keyframes usa-aurora-c{from{transform:translate3d(0,0,0) rotate(0deg) scale(1)}to{transform:translate3d(25%,-30%,0) rotate(40deg) scale(1.2)}}@media (prefers-reduced-motion:reduce){usa-aurora .usa-aurora-layer i,usa-grain .usa-grain-layer,usa-acrylic::after{animation:none !important}}";
|
|
7
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents } from '../chunks/base-
|
|
3
|
-
import { s as setVariant } from '../chunks/variants-
|
|
1
|
+
import { i as defineElement, e as caf, r as raf, f as adoptStyles, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents } from '../chunks/base-BRIPyPtX.js';
|
|
3
|
+
import { s as setVariant } from '../chunks/variants-DTypaOH3.js';
|
|
4
4
|
|
|
5
5
|
var css$6 = "usa-aurora{position:relative;display:block;isolation:isolate;overflow:hidden}usa-aurora .usa-aurora-layer{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:var(--usa-aurora-opacity,0.7);overflow:hidden;contain:strict}usa-aurora .usa-aurora-layer i{position:absolute;display:block;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--c),transparent);will-change:transform;animation:usa-aurora-a var(--usa-aurora-speed,18s) ease-in-out infinite alternate}usa-aurora .usa-aurora-layer i:nth-child(1){left:-15%;top:-30%}usa-aurora .usa-aurora-layer i:nth-child(2){right:-20%;top:-10%;animation-name:usa-aurora-b;animation-duration:calc(var(--usa-aurora-speed,18s) * 1.3)}usa-aurora .usa-aurora-layer i:nth-child(3){left:10%;bottom:-45%;animation-name:usa-aurora-c;animation-duration:calc(var(--usa-aurora-speed,18s) * 0.9)}usa-aurora .usa-aurora-layer i:nth-child(4){right:0;bottom:-30%;width:50%;animation-name:usa-aurora-b;animation-direction:alternate-reverse}usa-aurora[paused] .usa-aurora-layer i,usa-aurora[data-offscreen] .usa-aurora-layer i{animation-play-state:paused}@keyframes usa-aurora-a{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(30%,20%,0) scale(1.25)}}@keyframes usa-aurora-b{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-35%,25%,0) scale(0.85)}}@keyframes usa-aurora-c{from{transform:translate3d(0,0,0) rotate(0deg) scale(1)}to{transform:translate3d(25%,-30%,0) rotate(40deg) scale(1.2)}}@media (prefers-reduced-motion:reduce){usa-aurora .usa-aurora-layer i,usa-grain .usa-grain-layer,usa-acrylic::after{animation:none !important}}";
|
|
6
6
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
4
|
-
var spring = require('../chunks/spring-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
|
+
var spring = require('../chunks/spring-Dp5BllPB.cjs');
|
|
5
5
|
|
|
6
6
|
var css$3 = "usa-card{--usa-card-radius:18px;--usa-card-bg:var(--usa-surface,#1b1e27);--usa-card-glow:var(--usa-accent,#7c5cff);--usa-card-x:50%;--usa-card-y:50%;--usa-card-nx:0;--usa-card-ny:0;position:relative;display:block;border-radius:var(--usa-card-radius);isolation:isolate;-webkit-tap-highlight-color:transparent}usa-card:focus-visible{outline:2px solid var(--usa-card-glow);outline-offset:3px}usa-card[effect~=\"lift\"]{transition:transform 0.45s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.45s ease}usa-card[effect~=\"lift\"][data-hover],usa-card[effect~=\"lift\"]:focus-visible{transform:translateY(-6px) perspective(900px) rotateX(calc(var(--usa-card-ny) * -4deg)) rotateY(calc(var(--usa-card-nx) * 4deg));box-shadow:0 22px 44px -18px rgb(0 0 0 / 0.55)}usa-card[effect~=\"glass\"]{background:color-mix(in srgb,var(--usa-card-bg) 45%,transparent);border:1px solid rgb(255 255 255 / 0.16);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}usa-card[effect~=\"spotlight\"]::before,usa-card[effect~=\"border-glow\"]::after{content:\"\";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.3s ease}usa-card[effect~=\"spotlight\"]::before{z-index:-1;background:radial-gradient(260px circle at var(--usa-card-x) var(--usa-card-y),color-mix(in srgb,var(--usa-card-glow) 28%,transparent),transparent 70%)}usa-card[effect~=\"border-glow\"]::after{padding:1.5px;background:radial-gradient(180px circle at var(--usa-card-x) var(--usa-card-y),var(--usa-card-glow),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}usa-card[data-hover]::before,usa-card[data-hover]::after{opacity:1}@property --usa-card-angle{syntax:\"<angle>\";inherits:false;initial-value:0deg}usa-card[effect~=\"conic-border\"]{border:2px solid transparent;background:linear-gradient(var(--usa-card-bg),var(--usa-card-bg)) padding-box,conic-gradient(from var(--usa-card-angle),var(--usa-card-glow),#22d3ee,#f472b6,var(--usa-card-glow)) border-box;animation:usa-card-spin 4s linear infinite}@keyframes usa-card-spin{to{--usa-card-angle:360deg}}usa-card .usa-card-sheen{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}usa-card .usa-card-sheen::before{content:\"\";position:absolute;top:0;bottom:0;width:45%;left:-60%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgb(255 255 255 / 0.35),transparent)}usa-card[effect~=\"sheen\"]:hover .usa-card-sheen::before,usa-card[effect~=\"sheen\"]:focus-visible .usa-card-sheen::before{left:130%;transition:left 0.8s cubic-bezier(0.22,1,0.36,1)}usa-card .usa-card-holo{position:absolute;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:color-dodge;opacity:0.35;background:linear-gradient(115deg,transparent 20%,#ff7ad9 35%,#7af0ff 45%,#ffe27a 55%,transparent 70%) calc(var(--usa-card-x) * 1.4 - 20%) calc(var(--usa-card-y) * 1.4 - 20%) / 220% 220%;transition:opacity 0.3s ease}usa-card[data-hover] .usa-card-holo{opacity:0.7}usa-card[effect~=\"parallax-layers\"] [data-depth]{transition:transform 0.25s ease-out;will-change:transform}usa-card[effect~=\"flip\"]{perspective:1000px;display:grid}usa-card[effect~=\"flip\"]>[data-front],usa-card[effect~=\"flip\"]>[data-back]{grid-area:1 / 1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:inherit;transition:transform 0.7s cubic-bezier(0.34,1.3,0.64,1),opacity 0.3s ease}usa-card[effect~=\"flip\"]>[data-back]{transform:rotateY(180deg)}usa-card[effect~=\"flip\"][axis=\"x\"]>[data-back]{transform:rotateX(180deg)}usa-card[effect~=\"flip\"][flipped]>[data-front],usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-front]{transform:rotateY(-180deg)}usa-card[effect~=\"flip\"][flipped]>[data-back],usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-back]{transform:rotateY(0deg)}usa-card[effect~=\"flip\"][axis=\"x\"][flipped]>[data-front],usa-card[effect~=\"flip\"][axis=\"x\"]:not([trigger=\"click\"]):hover>[data-front]{transform:rotateX(180deg)}usa-card[effect~=\"flip\"][axis=\"x\"][flipped]>[data-back],usa-card[effect~=\"flip\"][axis=\"x\"]:not([trigger=\"click\"]):hover>[data-back]{transform:rotateX(0deg)}usa-card[effect~=\"flip\"][trigger=\"click\"]{cursor:pointer}usa-card[effect~=\"expand\"]{cursor:zoom-in}usa-card[effect~=\"expand\"]:not([expanded]) [data-detail]{display:none}usa-card[expanded]{position:fixed;inset:6vh max(4vw,calc(50vw - 420px));z-index:1000;overflow:auto;cursor:default;background:var(--usa-card-bg);box-shadow:0 30px 80px -20px rgb(0 0 0 / 0.6)}.usa-card-backdrop{position:fixed;inset:0;z-index:999;background:rgb(0 0 0 / 0.45)}@media (prefers-reduced-motion:reduce){usa-card,usa-card *,usa-card .usa-card-sheen::before{transition-duration:0.01ms !important;animation:none !important}usa-card[effect~=\"lift\"][data-hover]{transform:none}usa-card[effect~=\"flip\"]>[data-front],usa-card[effect~=\"flip\"]>[data-back]{transform:none !important}usa-card[effect~=\"flip\"][flipped]>[data-front],usa-card[effect~=\"flip\"]:not([flipped])>[data-back]{opacity:0;visibility:hidden}usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-front]{opacity:0;visibility:hidden}usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-back]{opacity:1;visibility:visible}}@media (prefers-reduced-transparency:reduce),(forced-colors:active){usa-card[effect~=\"glass\"]{background:var(--usa-card-bg);-webkit-backdrop-filter:none;backdrop-filter:none}}";
|
|
7
7
|
|
package/dist/components/cards.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-
|
|
3
|
-
import { d as springEasing, c as createSpring } from '../chunks/spring-
|
|
1
|
+
import { i as defineElement, r as raf, e as caf, h as EASE_OUT, b as clamp } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
3
|
+
import { d as springEasing, c as createSpring } from '../chunks/spring-UBPhrh1X.js';
|
|
4
4
|
|
|
5
5
|
var css$3 = "usa-card{--usa-card-radius:18px;--usa-card-bg:var(--usa-surface,#1b1e27);--usa-card-glow:var(--usa-accent,#7c5cff);--usa-card-x:50%;--usa-card-y:50%;--usa-card-nx:0;--usa-card-ny:0;position:relative;display:block;border-radius:var(--usa-card-radius);isolation:isolate;-webkit-tap-highlight-color:transparent}usa-card:focus-visible{outline:2px solid var(--usa-card-glow);outline-offset:3px}usa-card[effect~=\"lift\"]{transition:transform 0.45s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.45s ease}usa-card[effect~=\"lift\"][data-hover],usa-card[effect~=\"lift\"]:focus-visible{transform:translateY(-6px) perspective(900px) rotateX(calc(var(--usa-card-ny) * -4deg)) rotateY(calc(var(--usa-card-nx) * 4deg));box-shadow:0 22px 44px -18px rgb(0 0 0 / 0.55)}usa-card[effect~=\"glass\"]{background:color-mix(in srgb,var(--usa-card-bg) 45%,transparent);border:1px solid rgb(255 255 255 / 0.16);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}usa-card[effect~=\"spotlight\"]::before,usa-card[effect~=\"border-glow\"]::after{content:\"\";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.3s ease}usa-card[effect~=\"spotlight\"]::before{z-index:-1;background:radial-gradient(260px circle at var(--usa-card-x) var(--usa-card-y),color-mix(in srgb,var(--usa-card-glow) 28%,transparent),transparent 70%)}usa-card[effect~=\"border-glow\"]::after{padding:1.5px;background:radial-gradient(180px circle at var(--usa-card-x) var(--usa-card-y),var(--usa-card-glow),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}usa-card[data-hover]::before,usa-card[data-hover]::after{opacity:1}@property --usa-card-angle{syntax:\"<angle>\";inherits:false;initial-value:0deg}usa-card[effect~=\"conic-border\"]{border:2px solid transparent;background:linear-gradient(var(--usa-card-bg),var(--usa-card-bg)) padding-box,conic-gradient(from var(--usa-card-angle),var(--usa-card-glow),#22d3ee,#f472b6,var(--usa-card-glow)) border-box;animation:usa-card-spin 4s linear infinite}@keyframes usa-card-spin{to{--usa-card-angle:360deg}}usa-card .usa-card-sheen{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}usa-card .usa-card-sheen::before{content:\"\";position:absolute;top:0;bottom:0;width:45%;left:-60%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgb(255 255 255 / 0.35),transparent)}usa-card[effect~=\"sheen\"]:hover .usa-card-sheen::before,usa-card[effect~=\"sheen\"]:focus-visible .usa-card-sheen::before{left:130%;transition:left 0.8s cubic-bezier(0.22,1,0.36,1)}usa-card .usa-card-holo{position:absolute;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:color-dodge;opacity:0.35;background:linear-gradient(115deg,transparent 20%,#ff7ad9 35%,#7af0ff 45%,#ffe27a 55%,transparent 70%) calc(var(--usa-card-x) * 1.4 - 20%) calc(var(--usa-card-y) * 1.4 - 20%) / 220% 220%;transition:opacity 0.3s ease}usa-card[data-hover] .usa-card-holo{opacity:0.7}usa-card[effect~=\"parallax-layers\"] [data-depth]{transition:transform 0.25s ease-out;will-change:transform}usa-card[effect~=\"flip\"]{perspective:1000px;display:grid}usa-card[effect~=\"flip\"]>[data-front],usa-card[effect~=\"flip\"]>[data-back]{grid-area:1 / 1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:inherit;transition:transform 0.7s cubic-bezier(0.34,1.3,0.64,1),opacity 0.3s ease}usa-card[effect~=\"flip\"]>[data-back]{transform:rotateY(180deg)}usa-card[effect~=\"flip\"][axis=\"x\"]>[data-back]{transform:rotateX(180deg)}usa-card[effect~=\"flip\"][flipped]>[data-front],usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-front]{transform:rotateY(-180deg)}usa-card[effect~=\"flip\"][flipped]>[data-back],usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-back]{transform:rotateY(0deg)}usa-card[effect~=\"flip\"][axis=\"x\"][flipped]>[data-front],usa-card[effect~=\"flip\"][axis=\"x\"]:not([trigger=\"click\"]):hover>[data-front]{transform:rotateX(180deg)}usa-card[effect~=\"flip\"][axis=\"x\"][flipped]>[data-back],usa-card[effect~=\"flip\"][axis=\"x\"]:not([trigger=\"click\"]):hover>[data-back]{transform:rotateX(0deg)}usa-card[effect~=\"flip\"][trigger=\"click\"]{cursor:pointer}usa-card[effect~=\"expand\"]{cursor:zoom-in}usa-card[effect~=\"expand\"]:not([expanded]) [data-detail]{display:none}usa-card[expanded]{position:fixed;inset:6vh max(4vw,calc(50vw - 420px));z-index:1000;overflow:auto;cursor:default;background:var(--usa-card-bg);box-shadow:0 30px 80px -20px rgb(0 0 0 / 0.6)}.usa-card-backdrop{position:fixed;inset:0;z-index:999;background:rgb(0 0 0 / 0.45)}@media (prefers-reduced-motion:reduce){usa-card,usa-card *,usa-card .usa-card-sheen::before{transition-duration:0.01ms !important;animation:none !important}usa-card[effect~=\"lift\"][data-hover]{transform:none}usa-card[effect~=\"flip\"]>[data-front],usa-card[effect~=\"flip\"]>[data-back]{transform:none !important}usa-card[effect~=\"flip\"][flipped]>[data-front],usa-card[effect~=\"flip\"]:not([flipped])>[data-back]{opacity:0;visibility:hidden}usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-front]{opacity:0;visibility:hidden}usa-card[effect~=\"flip\"]:not([trigger=\"click\"]):hover>[data-back]{opacity:1;visibility:visible}}@media (prefers-reduced-transparency:reduce),(forced-colors:active){usa-card[effect~=\"glass\"]{background:var(--usa-card-bg);-webkit-backdrop-filter:none;backdrop-filter:none}}";
|
|
6
6
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
4
|
-
var spring = require('../chunks/spring-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
|
+
var spring = require('../chunks/spring-Dp5BllPB.cjs');
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* Click-effect helpers (v2.5): `burst()`, `confetti()`, `shake()`, `haptic()`.
|
package/dist/components/click.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { p as prefersReducedMotion,
|
|
2
|
-
export { a as configureComponents } from '../chunks/base-
|
|
3
|
-
import { d as springEasing, c as createSpring } from '../chunks/spring-
|
|
1
|
+
import { p as prefersReducedMotion, i as defineElement, h as EASE_OUT, b as clamp, e as caf, n as now, r as raf } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents } from '../chunks/base-BRIPyPtX.js';
|
|
3
|
+
import { d as springEasing, c as createSpring } from '../chunks/spring-UBPhrh1X.js';
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Click-effect helpers (v2.5): `burst()`, `confetti()`, `shake()`, `haptic()`.
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
4
|
-
var spring = require('../chunks/spring-
|
|
5
|
-
var core = require('../chunks/core-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
|
+
var spring = require('../chunks/spring-Dp5BllPB.cjs');
|
|
5
|
+
var core = require('../chunks/core-CHAtivHV.cjs');
|
|
6
6
|
|
|
7
7
|
var css = "usa-cube{--usa-cube-size:200px;display:block;width:var(--usa-cube-size);height:var(--usa-cube-size);perspective:var(--usa-cube-perspective,900px);touch-action:pan-y;user-select:none;-webkit-user-select:none;position:relative}usa-cube>[data-face]{position:absolute;inset:0;backface-visibility:hidden;transform:translateZ(calc(var(--usa-cube-size) / -2)) rotateX(var(--usa-cube-rx,0deg)) rotateY(var(--usa-cube-ry,0deg)) var(--usa-face) translateZ(calc(var(--usa-cube-size) / 2));transform-origin:50% 50%}usa-cube>[data-face=\"front\"]{--usa-face:rotateY(0deg)}usa-cube>[data-face=\"right\"]{--usa-face:rotateY(90deg)}usa-cube>[data-face=\"back\"]{--usa-face:rotateY(180deg)}usa-cube>[data-face=\"left\"]{--usa-face:rotateY(-90deg)}usa-cube>[data-face=\"top\"]{--usa-face:rotateX(90deg)}usa-cube>[data-face=\"bottom\"]{--usa-face:rotateX(-90deg)}usa-cube:focus-visible{outline:2px solid currentColor;outline-offset:6px}usa-depth{display:block;position:relative;perspective:1000px}usa-depth>*{transform:var(--usa-depth-rot,none);transform-style:preserve-3d}usa-depth [data-depth]{will-change:transform;transition:transform 0.12s linear}@media (prefers-reduced-motion:reduce){usa-depth [data-depth]{transform:none !important}}";
|
|
8
8
|
|
package/dist/components/depth.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-
|
|
3
|
-
import { c as createSpring } from '../chunks/spring-
|
|
4
|
-
import { g as gesture } from '../chunks/core-
|
|
1
|
+
import { i as defineElement, b as clamp, r as raf, e as caf } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
3
|
+
import { c as createSpring } from '../chunks/spring-UBPhrh1X.js';
|
|
4
|
+
import { g as gesture } from '../chunks/core-CYozf_E-.js';
|
|
5
5
|
|
|
6
6
|
var css = "usa-cube{--usa-cube-size:200px;display:block;width:var(--usa-cube-size);height:var(--usa-cube-size);perspective:var(--usa-cube-perspective,900px);touch-action:pan-y;user-select:none;-webkit-user-select:none;position:relative}usa-cube>[data-face]{position:absolute;inset:0;backface-visibility:hidden;transform:translateZ(calc(var(--usa-cube-size) / -2)) rotateX(var(--usa-cube-rx,0deg)) rotateY(var(--usa-cube-ry,0deg)) var(--usa-face) translateZ(calc(var(--usa-cube-size) / 2));transform-origin:50% 50%}usa-cube>[data-face=\"front\"]{--usa-face:rotateY(0deg)}usa-cube>[data-face=\"right\"]{--usa-face:rotateY(90deg)}usa-cube>[data-face=\"back\"]{--usa-face:rotateY(180deg)}usa-cube>[data-face=\"left\"]{--usa-face:rotateY(-90deg)}usa-cube>[data-face=\"top\"]{--usa-face:rotateX(90deg)}usa-cube>[data-face=\"bottom\"]{--usa-face:rotateX(-90deg)}usa-cube:focus-visible{outline:2px solid currentColor;outline-offset:6px}usa-depth{display:block;position:relative;perspective:1000px}usa-depth>*{transform:var(--usa-depth-rot,none);transform-style:preserve-3d}usa-depth [data-depth]{will-change:transform;transition:transform 0.12s linear}@media (prefers-reduced-motion:reduce){usa-depth [data-depth]{transform:none !important}}";
|
|
7
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
4
|
|
|
5
5
|
var css$4 = "usa-spinner{--usa-spinner-size:32px;--usa-spinner-color:currentColor;position:relative;display:inline-block;vertical-align:middle;flex:none;width:var(--usa-spinner-size);height:var(--usa-spinner-size);color:var(--usa-spinner-color)}usa-spinner i{position:absolute;display:block}usa-spinner[paused] *,usa-spinner[paused] *::after{animation-play-state:paused !important}usa-spinner svg{width:100%;height:100%;animation:usa-spin 2s linear infinite;overflow:visible}usa-spinner svg circle{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:0.5 100;stroke-dashoffset:0;animation:usa-ring-arc 1.6s ease-in-out infinite}@keyframes usa-spin{to{transform:rotate(360deg)}}@keyframes usa-ring-arc{0%{stroke-dasharray:0.5 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-20}100%{stroke-dasharray:0.5 100;stroke-dashoffset:-99}}usa-spinner[data-kind=\"windows\"] i{inset:0;opacity:0;animation:usa-orbit 5.5s infinite}usa-spinner[data-kind=\"windows\"] i::after{content:\"\";position:absolute;left:50%;top:0;width:12%;height:12%;margin-left:-6%;border-radius:50%;background:currentColor}usa-spinner[data-kind=\"windows\"] i:nth-child(2){animation-delay:240ms;--n:1}usa-spinner[data-kind=\"windows\"] i:nth-child(3){animation-delay:480ms;--n:2}usa-spinner[data-kind=\"windows\"] i:nth-child(4){animation-delay:720ms;--n:3}usa-spinner[data-kind=\"windows\"] i:nth-child(5){animation-delay:960ms;--n:4}@keyframes usa-orbit{0%{transform:rotate(225deg);opacity:1;animation-timing-function:ease-out}7%{transform:rotate(345deg);animation-timing-function:linear}30%{transform:rotate(455deg);animation-timing-function:ease-in-out}39%{transform:rotate(690deg);animation-timing-function:linear}70%{transform:rotate(815deg);opacity:1;animation-timing-function:ease-out}75%{transform:rotate(945deg);animation-timing-function:ease-out}76%,100%{transform:rotate(945deg);opacity:0}}usa-spinner[data-kind=\"ring\"] i{inset:0;border-radius:50%;border:calc(var(--usa-spinner-size) / 9) solid color-mix(in srgb,currentColor 20%,transparent);border-top-color:currentColor;animation:usa-spin 0.8s linear infinite}usa-spinner[data-kind=\"dots\"]{display:inline-flex;align-items:center;justify-content:space-between;height:calc(var(--usa-spinner-size) / 2.5)}usa-spinner[data-kind=\"dots\"] i{position:static;width:22%;aspect-ratio:1;border-radius:50%;background:currentColor;animation:usa-dot 1.2s ease-in-out infinite}usa-spinner[data-kind=\"dots\"] i:nth-child(2){animation-delay:0.15s}usa-spinner[data-kind=\"dots\"] i:nth-child(3){animation-delay:0.3s}@keyframes usa-dot{0%,60%,100%{transform:translateY(0);opacity:0.35}30%{transform:translateY(-70%);opacity:1}}usa-spinner[data-kind=\"pulse\"] i{inset:0;border-radius:50%;background:currentColor;opacity:0;animation:usa-pulse 1.6s cubic-bezier(0.22,1,0.36,1) infinite}usa-spinner[data-kind=\"pulse\"] i:nth-child(2){animation-delay:0.8s}@keyframes usa-pulse{from{transform:scale(0.1);opacity:0.8}to{transform:scale(1);opacity:0}}usa-spinner[data-kind=\"bars\"]{display:inline-flex;align-items:center;justify-content:space-between}usa-spinner[data-kind=\"bars\"] i{position:static;width:16%;height:100%;border-radius:2px;background:currentColor;transform:scaleY(0.35);animation:usa-bar 1s ease-in-out infinite}usa-spinner[data-kind=\"bars\"] i:nth-child(2){animation-delay:0.12s}usa-spinner[data-kind=\"bars\"] i:nth-child(3){animation-delay:0.24s}usa-spinner[data-kind=\"bars\"] i:nth-child(4){animation-delay:0.36s}@keyframes usa-bar{0%,100%{transform:scaleY(0.35)}40%{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){usa-spinner svg,usa-spinner i,usa-spinner i::after{animation:usa-calm 2.4s ease-in-out infinite !important}usa-spinner[data-kind=\"windows\"] i{transform:rotate(calc(var(--n,0) * 72deg))}usa-spinner svg circle{animation:none;stroke-dasharray:30 100}}@keyframes usa-calm{0%,100%{opacity:1}50%{opacity:0.4}}";
|
|
6
6
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-
|
|
1
|
+
import { i as defineElement, k as kindOf, h as EASE_OUT, b as clamp, F as FLUENT_DECELERATE, E as EASE_SPRING } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
3
3
|
|
|
4
4
|
var css$4 = "usa-spinner{--usa-spinner-size:32px;--usa-spinner-color:currentColor;position:relative;display:inline-block;vertical-align:middle;flex:none;width:var(--usa-spinner-size);height:var(--usa-spinner-size);color:var(--usa-spinner-color)}usa-spinner i{position:absolute;display:block}usa-spinner[paused] *,usa-spinner[paused] *::after{animation-play-state:paused !important}usa-spinner svg{width:100%;height:100%;animation:usa-spin 2s linear infinite;overflow:visible}usa-spinner svg circle{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:0.5 100;stroke-dashoffset:0;animation:usa-ring-arc 1.6s ease-in-out infinite}@keyframes usa-spin{to{transform:rotate(360deg)}}@keyframes usa-ring-arc{0%{stroke-dasharray:0.5 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-20}100%{stroke-dasharray:0.5 100;stroke-dashoffset:-99}}usa-spinner[data-kind=\"windows\"] i{inset:0;opacity:0;animation:usa-orbit 5.5s infinite}usa-spinner[data-kind=\"windows\"] i::after{content:\"\";position:absolute;left:50%;top:0;width:12%;height:12%;margin-left:-6%;border-radius:50%;background:currentColor}usa-spinner[data-kind=\"windows\"] i:nth-child(2){animation-delay:240ms;--n:1}usa-spinner[data-kind=\"windows\"] i:nth-child(3){animation-delay:480ms;--n:2}usa-spinner[data-kind=\"windows\"] i:nth-child(4){animation-delay:720ms;--n:3}usa-spinner[data-kind=\"windows\"] i:nth-child(5){animation-delay:960ms;--n:4}@keyframes usa-orbit{0%{transform:rotate(225deg);opacity:1;animation-timing-function:ease-out}7%{transform:rotate(345deg);animation-timing-function:linear}30%{transform:rotate(455deg);animation-timing-function:ease-in-out}39%{transform:rotate(690deg);animation-timing-function:linear}70%{transform:rotate(815deg);opacity:1;animation-timing-function:ease-out}75%{transform:rotate(945deg);animation-timing-function:ease-out}76%,100%{transform:rotate(945deg);opacity:0}}usa-spinner[data-kind=\"ring\"] i{inset:0;border-radius:50%;border:calc(var(--usa-spinner-size) / 9) solid color-mix(in srgb,currentColor 20%,transparent);border-top-color:currentColor;animation:usa-spin 0.8s linear infinite}usa-spinner[data-kind=\"dots\"]{display:inline-flex;align-items:center;justify-content:space-between;height:calc(var(--usa-spinner-size) / 2.5)}usa-spinner[data-kind=\"dots\"] i{position:static;width:22%;aspect-ratio:1;border-radius:50%;background:currentColor;animation:usa-dot 1.2s ease-in-out infinite}usa-spinner[data-kind=\"dots\"] i:nth-child(2){animation-delay:0.15s}usa-spinner[data-kind=\"dots\"] i:nth-child(3){animation-delay:0.3s}@keyframes usa-dot{0%,60%,100%{transform:translateY(0);opacity:0.35}30%{transform:translateY(-70%);opacity:1}}usa-spinner[data-kind=\"pulse\"] i{inset:0;border-radius:50%;background:currentColor;opacity:0;animation:usa-pulse 1.6s cubic-bezier(0.22,1,0.36,1) infinite}usa-spinner[data-kind=\"pulse\"] i:nth-child(2){animation-delay:0.8s}@keyframes usa-pulse{from{transform:scale(0.1);opacity:0.8}to{transform:scale(1);opacity:0}}usa-spinner[data-kind=\"bars\"]{display:inline-flex;align-items:center;justify-content:space-between}usa-spinner[data-kind=\"bars\"] i{position:static;width:16%;height:100%;border-radius:2px;background:currentColor;transform:scaleY(0.35);animation:usa-bar 1s ease-in-out infinite}usa-spinner[data-kind=\"bars\"] i:nth-child(2){animation-delay:0.12s}usa-spinner[data-kind=\"bars\"] i:nth-child(3){animation-delay:0.24s}usa-spinner[data-kind=\"bars\"] i:nth-child(4){animation-delay:0.36s}@keyframes usa-bar{0%,100%{transform:scaleY(0.35)}40%{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){usa-spinner svg,usa-spinner i,usa-spinner i::after{animation:usa-calm 2.4s ease-in-out infinite !important}usa-spinner[data-kind=\"windows\"] i{transform:rotate(calc(var(--n,0) * 72deg))}usa-spinner svg circle{animation:none;stroke-dasharray:30 100}}@keyframes usa-calm{0%,100%{opacity:1}50%{opacity:0.4}}";
|
|
5
5
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
4
|
-
var spring = require('../chunks/spring-
|
|
5
|
-
var core = require('../chunks/core-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
|
+
var spring = require('../chunks/spring-Dp5BllPB.cjs');
|
|
5
|
+
var core = require('../chunks/core-CHAtivHV.cjs');
|
|
6
6
|
|
|
7
7
|
var css = "usa-swipeable{display:block;touch-action:pan-y;user-select:none;-webkit-user-select:none}usa-swipeable[axis=\"y\"]{touch-action:pan-x}usa-swipeable>*{transform:translate3d(var(--usa-swipe,0px),0,0);opacity:calc(1 - var(--usa-swipe-p,0) * 0.5)}usa-swipeable[axis=\"y\"]>*{transform:translate3d(0,var(--usa-swipe,0px),0)}usa-swipeable:focus-visible{outline:2px solid currentColor;outline-offset:2px}usa-pinch-zoom{display:block;overflow:hidden;touch-action:none;position:relative}usa-pinch-zoom>*{transform:translate3d(var(--usa-zoom-x,0px),var(--usa-zoom-y,0px),0) scale(var(--usa-zoom,1));transform-origin:50% 50%}usa-pinch-zoom[data-zoomed]{cursor:grab}usa-pinch-zoom:focus-visible{outline:2px solid currentColor;outline-offset:2px}";
|
|
8
8
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-
|
|
3
|
-
import { c as createSpring } from '../chunks/spring-
|
|
4
|
-
import { g as gesture } from '../chunks/core-
|
|
5
|
-
export { p as pinchScale, s as swipeDirection } from '../chunks/core-
|
|
1
|
+
import { i as defineElement, b as clamp } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
3
|
+
import { c as createSpring } from '../chunks/spring-UBPhrh1X.js';
|
|
4
|
+
import { g as gesture } from '../chunks/core-CYozf_E-.js';
|
|
5
|
+
export { p as pinchScale, s as swipeDirection } from '../chunks/core-CYozf_E-.js';
|
|
6
6
|
|
|
7
7
|
var css = "usa-swipeable{display:block;touch-action:pan-y;user-select:none;-webkit-user-select:none}usa-swipeable[axis=\"y\"]{touch-action:pan-x}usa-swipeable>*{transform:translate3d(var(--usa-swipe,0px),0,0);opacity:calc(1 - var(--usa-swipe-p,0) * 0.5)}usa-swipeable[axis=\"y\"]>*{transform:translate3d(0,var(--usa-swipe,0px),0)}usa-swipeable:focus-visible{outline:2px solid currentColor;outline-offset:2px}usa-pinch-zoom{display:block;overflow:hidden;touch-action:none;position:relative}usa-pinch-zoom>*{transform:translate3d(var(--usa-zoom-x,0px),var(--usa-zoom-y,0px),0) scale(var(--usa-zoom,1));transform-origin:50% 50%}usa-pinch-zoom[data-zoomed]{cursor:grab}usa-pinch-zoom:focus-visible{outline:2px solid currentColor;outline-offset:2px}";
|
|
8
8
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var base = require('../chunks/base-
|
|
3
|
+
var base = require('../chunks/base-Dm6ee5ug.cjs');
|
|
4
4
|
|
|
5
5
|
var css$5 = "usa-ripple{position:relative;display:inline-block;overflow:hidden;isolation:isolate;border-radius:inherit;-webkit-tap-highlight-color:transparent}usa-ripple[block]{display:block}usa-ripple .usa-ripple-wave{position:absolute;border-radius:50%;pointer-events:none;transform:scale(0);z-index:-1;will-change:transform,opacity}";
|
|
6
6
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-
|
|
1
|
+
import { i as defineElement, h as EASE_OUT, r as raf, e as caf, b as clamp, E as EASE_SPRING } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BRIPyPtX.js';
|
|
3
3
|
|
|
4
4
|
var css$5 = "usa-ripple{position:relative;display:inline-block;overflow:hidden;isolation:isolate;border-radius:inherit;-webkit-tap-highlight-color:transparent}usa-ripple[block]{display:block}usa-ripple .usa-ripple-wave{position:absolute;border-radius:50%;pointer-events:none;transform:scale(0);z-index:-1;will-change:transform,opacity}";
|
|
5
5
|
|
|
@@ -17,6 +17,7 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
17
17
|
readonly webgl: readonly ["usa-shader", "usa-distort", "usa-liquid"];
|
|
18
18
|
readonly depth: readonly ["usa-cube", "usa-depth"];
|
|
19
19
|
readonly layout: readonly ["usa-auto-animate", "usa-masonry"];
|
|
20
|
+
readonly packs: readonly ["usa-pack"];
|
|
20
21
|
};
|
|
21
22
|
|
|
22
23
|
/**
|
package/dist/components/jsx.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
17
17
|
readonly webgl: readonly ["usa-shader", "usa-distort", "usa-liquid"];
|
|
18
18
|
readonly depth: readonly ["usa-cube", "usa-depth"];
|
|
19
19
|
readonly layout: readonly ["usa-auto-animate", "usa-masonry"];
|
|
20
|
+
readonly packs: readonly ["usa-pack"];
|
|
20
21
|
};
|
|
21
22
|
|
|
22
23
|
/**
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { p as prefersReducedMotion,
|
|
2
|
-
export { a as configureComponents } from '../chunks/base-
|
|
1
|
+
import { p as prefersReducedMotion, h as EASE_OUT, m as motionScale, i as defineElement } from '../chunks/base-BRIPyPtX.js';
|
|
2
|
+
export { a as configureComponents } from '../chunks/base-BRIPyPtX.js';
|
|
3
3
|
|
|
4
4
|
/** FLIP keyframes from a previous box to the current one (pure). */
|
|
5
5
|
function flipFrames(from, to, scale = true) {
|
package/dist/components/lazy.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var indexTags = require('../chunks/index-tags-
|
|
3
|
+
var indexTags = require('../chunks/index-tags-DYYsgbba.cjs');
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).
|
|
@@ -33,6 +33,7 @@ const LOADERS = {
|
|
|
33
33
|
webgl: () => Promise.resolve().then(function () { return require('./webgl.cjs'); }),
|
|
34
34
|
depth: () => Promise.resolve().then(function () { return require('./depth.cjs'); }),
|
|
35
35
|
layout: () => Promise.resolve().then(function () { return require('./layout.cjs'); }),
|
|
36
|
+
packs: () => Promise.resolve().then(function () { return require('./packs.cjs'); }),
|
|
36
37
|
};
|
|
37
38
|
const TAG_TO_CAT = new Map();
|
|
38
39
|
for (const [cat, tags] of Object.entries(indexTags.COMPONENT_CATEGORIES))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lazy.cjs","sources":["../../src/components/lazy.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).\n *\n * `lazyDefine()` scans the page (and watches it with a MutationObserver) for\n * `<usa-*>` tags that are not registered yet and dynamically imports only the\n * categories they belong to. Bundlers split each category into its own chunk,\n * so a page that only uses `<usa-button>` loads just the click category.\n *\n * ```js\n * import { lazyDefine } from 'use-scroll-animate/components/lazy';\n * lazyDefine(); // returns a stop() function\n * ```\n */\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst LOADERS: Record<ComponentCategory, () => Promise<Record<string, any>>> = {\n reveal: () => import('./reveal/index'),\n text: () => import('./text/index'),\n interaction: () => import('./interaction/index'),\n feedback: () => import('./feedback/index'),\n background: () => import('./background/index'),\n transitions: () => import('./transitions/index'),\n physics: () => import('./physics/index'),\n cards: () => import('./cards/index'),\n click: () => import('./click/index'),\n ui: () => import('./ui/index'),\n page: () => import('./page/index'),\n timeline: () => import('./timeline/index'),\n gesture: () => import('./gesture/index'),\n svg: () => import('./svg/index'),\n webgl: () => import('./webgl/index'),\n depth: () => import('./depth/index'),\n layout: () => import('./layout/index'),\n};\n\nconst TAG_TO_CAT = new Map<string, ComponentCategory>();\nfor (const [cat, tags] of Object.entries(COMPONENT_CATEGORIES)) for (const t of tags) TAG_TO_CAT.set(t, cat as ComponentCategory);\nconst loaded = new Map<ComponentCategory, Promise<void>>();\n\n/** Category of a tag (`usa-button` → `click`), or `null`. */\nexport const categoryOfTag = (tag: string): ComponentCategory | null => TAG_TO_CAT.get(tag.toLowerCase()) ?? null;\n\n/** Load and register one category (once). */\nexport function loadCategory(cat: ComponentCategory): Promise<void> {\n let p = loaded.get(cat);\n if (!p) {\n p = LOADERS[cat]().then((m) => {\n const fn = Object.keys(m).find((k) => /^define[A-Z]\\w*Components$/.test(k));\n if (fn) m[fn]();\n });\n loaded.set(cat, p);\n }\n return p;\n}\n\n/** Register the categories needed by the `<usa-*>` tags under `root`. Resolves when they are defined. */\nexport async function defineUsed(root: ParentNode = document): Promise<ComponentCategory[]> {\n if (typeof customElements === 'undefined') return [];\n const cats = new Set<ComponentCategory>();\n const scan = (el: Element) => {\n const c = el.localName.startsWith('usa-') && !customElements.get(el.localName) ? categoryOfTag(el.localName) : null;\n if (c) cats.add(c);\n };\n if ((root as Element).localName) scan(root as Element);\n root.querySelectorAll('*').forEach(scan);\n await Promise.all([...cats].map(loadCategory));\n return [...cats];\n}\n\n/** `defineUsed()` now and whenever new `<usa-*>` elements are added. Returns a stop function. */\nexport function lazyDefine(root: ParentNode = typeof document !== 'undefined' ? document : (undefined as any)): () => void {\n if (!root || typeof MutationObserver === 'undefined') return () => undefined;\n defineUsed(root);\n const mo = new MutationObserver((records) => {\n for (const r of records) r.addedNodes.forEach((n) => n.nodeType === 1 && defineUsed(n as Element));\n });\n mo.observe(root as Node, { childList: true, subtree: true });\n return () => mo.disconnect();\n}\n"],"names":["COMPONENT_CATEGORIES"],"mappings":";;;;AAAA;;;;;;;;;;;;AAYG;AAGH,MAAM,OAAO,GAAkE;AAC7E,IAAA,MAAM,EAAE,MAAM,oDAAO,cAAgB,KAAC;AACtC,IAAA,IAAI,EAAE,MAAM,oDAAO,YAAc,KAAC;AAClC,IAAA,WAAW,EAAE,MAAM,oDAAO,mBAAqB,KAAC;AAChD,IAAA,QAAQ,EAAE,MAAM,oDAAO,gBAAkB,KAAC;AAC1C,IAAA,UAAU,EAAE,MAAM,oDAAO,kBAAoB,KAAC;AAC9C,IAAA,WAAW,EAAE,MAAM,oDAAO,mBAAqB,KAAC;AAChD,IAAA,OAAO,EAAE,MAAM,oDAAO,eAAiB,KAAC;AACxC,IAAA,KAAK,EAAE,MAAM,oDAAO,aAAe,KAAC;AACpC,IAAA,KAAK,EAAE,MAAM,oDAAO,aAAe,KAAC;AACpC,IAAA,EAAE,EAAE,MAAM,oDAAO,UAAY,KAAC;AAC9B,IAAA,IAAI,EAAE,MAAM,oDAAO,YAAc,KAAC;AAClC,IAAA,QAAQ,EAAE,MAAM,oDAAO,gBAAkB,KAAC;AAC1C,IAAA,OAAO,EAAE,MAAM,oDAAO,eAAiB,KAAC;AACxC,IAAA,GAAG,EAAE,MAAM,oDAAO,WAAa,KAAC;AAChC,IAAA,KAAK,EAAE,MAAM,oDAAO,aAAe,KAAC;AACpC,IAAA,KAAK,EAAE,MAAM,oDAAO,aAAe,KAAC;AACpC,IAAA,MAAM,EAAE,MAAM,oDAAO,cAAgB,KAAC;
|
|
1
|
+
{"version":3,"file":"lazy.cjs","sources":["../../src/components/lazy.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).\n *\n * `lazyDefine()` scans the page (and watches it with a MutationObserver) for\n * `<usa-*>` tags that are not registered yet and dynamically imports only the\n * categories they belong to. Bundlers split each category into its own chunk,\n * so a page that only uses `<usa-button>` loads just the click category.\n *\n * ```js\n * import { lazyDefine } from 'use-scroll-animate/components/lazy';\n * lazyDefine(); // returns a stop() function\n * ```\n */\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst LOADERS: Record<ComponentCategory, () => Promise<Record<string, any>>> = {\n reveal: () => import('./reveal/index'),\n text: () => import('./text/index'),\n interaction: () => import('./interaction/index'),\n feedback: () => import('./feedback/index'),\n background: () => import('./background/index'),\n transitions: () => import('./transitions/index'),\n physics: () => import('./physics/index'),\n cards: () => import('./cards/index'),\n click: () => import('./click/index'),\n ui: () => import('./ui/index'),\n page: () => import('./page/index'),\n timeline: () => import('./timeline/index'),\n gesture: () => import('./gesture/index'),\n svg: () => import('./svg/index'),\n webgl: () => import('./webgl/index'),\n depth: () => import('./depth/index'),\n layout: () => import('./layout/index'),\n packs: () => import('./packs/index'),\n};\n\nconst TAG_TO_CAT = new Map<string, ComponentCategory>();\nfor (const [cat, tags] of Object.entries(COMPONENT_CATEGORIES)) for (const t of tags) TAG_TO_CAT.set(t, cat as ComponentCategory);\nconst loaded = new Map<ComponentCategory, Promise<void>>();\n\n/** Category of a tag (`usa-button` → `click`), or `null`. */\nexport const categoryOfTag = (tag: string): ComponentCategory | null => TAG_TO_CAT.get(tag.toLowerCase()) ?? null;\n\n/** Load and register one category (once). */\nexport function loadCategory(cat: ComponentCategory): Promise<void> {\n let p = loaded.get(cat);\n if (!p) {\n p = LOADERS[cat]().then((m) => {\n const fn = Object.keys(m).find((k) => /^define[A-Z]\\w*Components$/.test(k));\n if (fn) m[fn]();\n });\n loaded.set(cat, p);\n }\n return p;\n}\n\n/** Register the categories needed by the `<usa-*>` tags under `root`. Resolves when they are defined. */\nexport async function defineUsed(root: ParentNode = document): Promise<ComponentCategory[]> {\n if (typeof customElements === 'undefined') return [];\n const cats = new Set<ComponentCategory>();\n const scan = (el: Element) => {\n const c = el.localName.startsWith('usa-') && !customElements.get(el.localName) ? categoryOfTag(el.localName) : null;\n if (c) cats.add(c);\n };\n if ((root as Element).localName) scan(root as Element);\n root.querySelectorAll('*').forEach(scan);\n await Promise.all([...cats].map(loadCategory));\n return [...cats];\n}\n\n/** `defineUsed()` now and whenever new `<usa-*>` elements are added. Returns a stop function. */\nexport function lazyDefine(root: ParentNode = typeof document !== 'undefined' ? document : (undefined as any)): () => void {\n if (!root || typeof MutationObserver === 'undefined') return () => undefined;\n defineUsed(root);\n const mo = new MutationObserver((records) => {\n for (const r of records) r.addedNodes.forEach((n) => n.nodeType === 1 && defineUsed(n as Element));\n });\n mo.observe(root as Node, { childList: true, subtree: true });\n return () => mo.disconnect();\n}\n"],"names":["COMPONENT_CATEGORIES"],"mappings":"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"}
|
|
@@ -17,6 +17,7 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
17
17
|
readonly webgl: readonly ["usa-shader", "usa-distort", "usa-liquid"];
|
|
18
18
|
readonly depth: readonly ["usa-cube", "usa-depth"];
|
|
19
19
|
readonly layout: readonly ["usa-auto-animate", "usa-masonry"];
|
|
20
|
+
readonly packs: readonly ["usa-pack"];
|
|
20
21
|
};
|
|
21
22
|
type ComponentCategory = keyof typeof COMPONENT_CATEGORIES;
|
|
22
23
|
|
|
@@ -17,6 +17,7 @@ declare const COMPONENT_CATEGORIES: {
|
|
|
17
17
|
readonly webgl: readonly ["usa-shader", "usa-distort", "usa-liquid"];
|
|
18
18
|
readonly depth: readonly ["usa-cube", "usa-depth"];
|
|
19
19
|
readonly layout: readonly ["usa-auto-animate", "usa-masonry"];
|
|
20
|
+
readonly packs: readonly ["usa-pack"];
|
|
20
21
|
};
|
|
21
22
|
type ComponentCategory = keyof typeof COMPONENT_CATEGORIES;
|
|
22
23
|
|
package/dist/components/lazy.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { C as COMPONENT_CATEGORIES } from '../chunks/index-tags-
|
|
1
|
+
import { C as COMPONENT_CATEGORIES } from '../chunks/index-tags-BmQR17Sb.js';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).
|
|
@@ -31,6 +31,7 @@ const LOADERS = {
|
|
|
31
31
|
webgl: () => import('./webgl.js'),
|
|
32
32
|
depth: () => import('./depth.js'),
|
|
33
33
|
layout: () => import('./layout.js'),
|
|
34
|
+
packs: () => import('./packs.js'),
|
|
34
35
|
};
|
|
35
36
|
const TAG_TO_CAT = new Map();
|
|
36
37
|
for (const [cat, tags] of Object.entries(COMPONENT_CATEGORIES))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lazy.js","sources":["../../src/components/lazy.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).\n *\n * `lazyDefine()` scans the page (and watches it with a MutationObserver) for\n * `<usa-*>` tags that are not registered yet and dynamically imports only the\n * categories they belong to. Bundlers split each category into its own chunk,\n * so a page that only uses `<usa-button>` loads just the click category.\n *\n * ```js\n * import { lazyDefine } from 'use-scroll-animate/components/lazy';\n * lazyDefine(); // returns a stop() function\n * ```\n */\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst LOADERS: Record<ComponentCategory, () => Promise<Record<string, any>>> = {\n reveal: () => import('./reveal/index'),\n text: () => import('./text/index'),\n interaction: () => import('./interaction/index'),\n feedback: () => import('./feedback/index'),\n background: () => import('./background/index'),\n transitions: () => import('./transitions/index'),\n physics: () => import('./physics/index'),\n cards: () => import('./cards/index'),\n click: () => import('./click/index'),\n ui: () => import('./ui/index'),\n page: () => import('./page/index'),\n timeline: () => import('./timeline/index'),\n gesture: () => import('./gesture/index'),\n svg: () => import('./svg/index'),\n webgl: () => import('./webgl/index'),\n depth: () => import('./depth/index'),\n layout: () => import('./layout/index'),\n};\n\nconst TAG_TO_CAT = new Map<string, ComponentCategory>();\nfor (const [cat, tags] of Object.entries(COMPONENT_CATEGORIES)) for (const t of tags) TAG_TO_CAT.set(t, cat as ComponentCategory);\nconst loaded = new Map<ComponentCategory, Promise<void>>();\n\n/** Category of a tag (`usa-button` → `click`), or `null`. */\nexport const categoryOfTag = (tag: string): ComponentCategory | null => TAG_TO_CAT.get(tag.toLowerCase()) ?? null;\n\n/** Load and register one category (once). */\nexport function loadCategory(cat: ComponentCategory): Promise<void> {\n let p = loaded.get(cat);\n if (!p) {\n p = LOADERS[cat]().then((m) => {\n const fn = Object.keys(m).find((k) => /^define[A-Z]\\w*Components$/.test(k));\n if (fn) m[fn]();\n });\n loaded.set(cat, p);\n }\n return p;\n}\n\n/** Register the categories needed by the `<usa-*>` tags under `root`. Resolves when they are defined. */\nexport async function defineUsed(root: ParentNode = document): Promise<ComponentCategory[]> {\n if (typeof customElements === 'undefined') return [];\n const cats = new Set<ComponentCategory>();\n const scan = (el: Element) => {\n const c = el.localName.startsWith('usa-') && !customElements.get(el.localName) ? categoryOfTag(el.localName) : null;\n if (c) cats.add(c);\n };\n if ((root as Element).localName) scan(root as Element);\n root.querySelectorAll('*').forEach(scan);\n await Promise.all([...cats].map(loadCategory));\n return [...cats];\n}\n\n/** `defineUsed()` now and whenever new `<usa-*>` elements are added. Returns a stop function. */\nexport function lazyDefine(root: ParentNode = typeof document !== 'undefined' ? document : (undefined as any)): () => void {\n if (!root || typeof MutationObserver === 'undefined') return () => undefined;\n defineUsed(root);\n const mo = new MutationObserver((records) => {\n for (const r of records) r.addedNodes.forEach((n) => n.nodeType === 1 && defineUsed(n as Element));\n });\n mo.observe(root as Node, { childList: true, subtree: true });\n return () => mo.disconnect();\n}\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;AAYG;AAGH,MAAM,OAAO,GAAkE;AAC7E,IAAA,MAAM,EAAE,MAAM,OAAO,aAAgB,CAAC;AACtC,IAAA,IAAI,EAAE,MAAM,OAAO,WAAc,CAAC;AAClC,IAAA,WAAW,EAAE,MAAM,OAAO,kBAAqB,CAAC;AAChD,IAAA,QAAQ,EAAE,MAAM,OAAO,eAAkB,CAAC;AAC1C,IAAA,UAAU,EAAE,MAAM,OAAO,iBAAoB,CAAC;AAC9C,IAAA,WAAW,EAAE,MAAM,OAAO,kBAAqB,CAAC;AAChD,IAAA,OAAO,EAAE,MAAM,OAAO,cAAiB,CAAC;AACxC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,EAAE,EAAE,MAAM,OAAO,SAAY,CAAC;AAC9B,IAAA,IAAI,EAAE,MAAM,OAAO,WAAc,CAAC;AAClC,IAAA,QAAQ,EAAE,MAAM,OAAO,eAAkB,CAAC;AAC1C,IAAA,OAAO,EAAE,MAAM,OAAO,cAAiB,CAAC;AACxC,IAAA,GAAG,EAAE,MAAM,OAAO,UAAa,CAAC;AAChC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,MAAM,EAAE,MAAM,OAAO,aAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"lazy.js","sources":["../../src/components/lazy.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/lazy — lazy, per-category registration (v2.9).\n *\n * `lazyDefine()` scans the page (and watches it with a MutationObserver) for\n * `<usa-*>` tags that are not registered yet and dynamically imports only the\n * categories they belong to. Bundlers split each category into its own chunk,\n * so a page that only uses `<usa-button>` loads just the click category.\n *\n * ```js\n * import { lazyDefine } from 'use-scroll-animate/components/lazy';\n * lazyDefine(); // returns a stop() function\n * ```\n */\nimport { COMPONENT_CATEGORIES, type ComponentCategory } from './index-tags';\n\nconst LOADERS: Record<ComponentCategory, () => Promise<Record<string, any>>> = {\n reveal: () => import('./reveal/index'),\n text: () => import('./text/index'),\n interaction: () => import('./interaction/index'),\n feedback: () => import('./feedback/index'),\n background: () => import('./background/index'),\n transitions: () => import('./transitions/index'),\n physics: () => import('./physics/index'),\n cards: () => import('./cards/index'),\n click: () => import('./click/index'),\n ui: () => import('./ui/index'),\n page: () => import('./page/index'),\n timeline: () => import('./timeline/index'),\n gesture: () => import('./gesture/index'),\n svg: () => import('./svg/index'),\n webgl: () => import('./webgl/index'),\n depth: () => import('./depth/index'),\n layout: () => import('./layout/index'),\n packs: () => import('./packs/index'),\n};\n\nconst TAG_TO_CAT = new Map<string, ComponentCategory>();\nfor (const [cat, tags] of Object.entries(COMPONENT_CATEGORIES)) for (const t of tags) TAG_TO_CAT.set(t, cat as ComponentCategory);\nconst loaded = new Map<ComponentCategory, Promise<void>>();\n\n/** Category of a tag (`usa-button` → `click`), or `null`. */\nexport const categoryOfTag = (tag: string): ComponentCategory | null => TAG_TO_CAT.get(tag.toLowerCase()) ?? null;\n\n/** Load and register one category (once). */\nexport function loadCategory(cat: ComponentCategory): Promise<void> {\n let p = loaded.get(cat);\n if (!p) {\n p = LOADERS[cat]().then((m) => {\n const fn = Object.keys(m).find((k) => /^define[A-Z]\\w*Components$/.test(k));\n if (fn) m[fn]();\n });\n loaded.set(cat, p);\n }\n return p;\n}\n\n/** Register the categories needed by the `<usa-*>` tags under `root`. Resolves when they are defined. */\nexport async function defineUsed(root: ParentNode = document): Promise<ComponentCategory[]> {\n if (typeof customElements === 'undefined') return [];\n const cats = new Set<ComponentCategory>();\n const scan = (el: Element) => {\n const c = el.localName.startsWith('usa-') && !customElements.get(el.localName) ? categoryOfTag(el.localName) : null;\n if (c) cats.add(c);\n };\n if ((root as Element).localName) scan(root as Element);\n root.querySelectorAll('*').forEach(scan);\n await Promise.all([...cats].map(loadCategory));\n return [...cats];\n}\n\n/** `defineUsed()` now and whenever new `<usa-*>` elements are added. Returns a stop function. */\nexport function lazyDefine(root: ParentNode = typeof document !== 'undefined' ? document : (undefined as any)): () => void {\n if (!root || typeof MutationObserver === 'undefined') return () => undefined;\n defineUsed(root);\n const mo = new MutationObserver((records) => {\n for (const r of records) r.addedNodes.forEach((n) => n.nodeType === 1 && defineUsed(n as Element));\n });\n mo.observe(root as Node, { childList: true, subtree: true });\n return () => mo.disconnect();\n}\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;AAYG;AAGH,MAAM,OAAO,GAAkE;AAC7E,IAAA,MAAM,EAAE,MAAM,OAAO,aAAgB,CAAC;AACtC,IAAA,IAAI,EAAE,MAAM,OAAO,WAAc,CAAC;AAClC,IAAA,WAAW,EAAE,MAAM,OAAO,kBAAqB,CAAC;AAChD,IAAA,QAAQ,EAAE,MAAM,OAAO,eAAkB,CAAC;AAC1C,IAAA,UAAU,EAAE,MAAM,OAAO,iBAAoB,CAAC;AAC9C,IAAA,WAAW,EAAE,MAAM,OAAO,kBAAqB,CAAC;AAChD,IAAA,OAAO,EAAE,MAAM,OAAO,cAAiB,CAAC;AACxC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,EAAE,EAAE,MAAM,OAAO,SAAY,CAAC;AAC9B,IAAA,IAAI,EAAE,MAAM,OAAO,WAAc,CAAC;AAClC,IAAA,QAAQ,EAAE,MAAM,OAAO,eAAkB,CAAC;AAC1C,IAAA,OAAO,EAAE,MAAM,OAAO,cAAiB,CAAC;AACxC,IAAA,GAAG,EAAE,MAAM,OAAO,UAAa,CAAC;AAChC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;AACpC,IAAA,MAAM,EAAE,MAAM,OAAO,aAAgB,CAAC;AACtC,IAAA,KAAK,EAAE,MAAM,OAAO,YAAe,CAAC;CACrC;AAED,MAAM,UAAU,GAAG,IAAI,GAAG,EAA6B;AACvD,KAAK,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,oBAAoB,CAAC;IAAE,KAAK,MAAM,CAAC,IAAI,IAAI;AAAE,QAAA,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,GAAwB,CAAC;AACjI,MAAM,MAAM,GAAG,IAAI,GAAG,EAAoC;AAE1D;MACa,aAAa,GAAG,CAAC,GAAW,KAA+B,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,IAAI;AAE7G;AACM,SAAU,YAAY,CAAC,GAAsB,EAAA;IACjD,IAAI,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC;IACvB,IAAI,CAAC,CAAC,EAAE;AACN,QAAA,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,KAAI;YAC5B,MAAM,EAAE,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,4BAA4B,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAC3E,YAAA,IAAI,EAAE;AAAE,gBAAA,CAAC,CAAC,EAAE,CAAC,EAAE;AACjB,QAAA,CAAC,CAAC;AACF,QAAA,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC;IACpB;AACA,IAAA,OAAO,CAAC;AACV;AAEA;AACO,eAAe,UAAU,CAAC,OAAmB,QAAQ,EAAA;IAC1D,IAAI,OAAO,cAAc,KAAK,WAAW;AAAE,QAAA,OAAO,EAAE;AACpD,IAAA,MAAM,IAAI,GAAG,IAAI,GAAG,EAAqB;AACzC,IAAA,MAAM,IAAI,GAAG,CAAC,EAAW,KAAI;AAC3B,QAAA,MAAM,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG,aAAa,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG,IAAI;AACnH,QAAA,IAAI,CAAC;AAAE,YAAA,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AACpB,IAAA,CAAC;IACD,IAAK,IAAgB,CAAC,SAAS;QAAE,IAAI,CAAC,IAAe,CAAC;IACtD,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC;AACxC,IAAA,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;AAC9C,IAAA,OAAO,CAAC,GAAG,IAAI,CAAC;AAClB;AAEA;AACM,SAAU,UAAU,CAAC,IAAA,GAAmB,OAAO,QAAQ,KAAK,WAAW,GAAG,QAAQ,GAAI,SAAiB,EAAA;AAC3G,IAAA,IAAI,CAAC,IAAI,IAAI,OAAO,gBAAgB,KAAK,WAAW;AAAE,QAAA,OAAO,MAAM,SAAS;IAC5E,UAAU,CAAC,IAAI,CAAC;IAChB,MAAM,EAAE,GAAG,IAAI,gBAAgB,CAAC,CAAC,OAAO,KAAI;QAC1C,KAAK,MAAM,CAAC,IAAI,OAAO;YAAE,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,QAAQ,KAAK,CAAC,IAAI,UAAU,CAAC,CAAY,CAAC,CAAC;AACpG,IAAA,CAAC,CAAC;AACF,IAAA,EAAE,CAAC,OAAO,CAAC,IAAY,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAC5D,IAAA,OAAO,MAAM,EAAE,CAAC,UAAU,EAAE;AAC9B;;;;"}
|