use-scroll-animate 8.1.0 → 8.3.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/components/fx-organic.cjs +115 -0
- package/dist/components/fx-organic.cjs.map +1 -0
- package/dist/components/fx-organic.d.cts +66 -0
- package/dist/components/fx-organic.d.ts +66 -0
- package/dist/components/fx-organic.js +111 -0
- package/dist/components/fx-organic.js.map +1 -0
- package/dist/components/fx-retro.cjs +96 -0
- package/dist/components/fx-retro.cjs.map +1 -0
- package/dist/components/fx-retro.d.cts +66 -0
- package/dist/components/fx-retro.d.ts +66 -0
- package/dist/components/fx-retro.js +92 -0
- package/dist/components/fx-retro.js.map +1 -0
- package/dist/components/fx2.cjs +12 -0
- package/dist/components/fx2.cjs.map +1 -1
- package/dist/components/fx2.d.cts +45 -1
- package/dist/components/fx2.d.ts +45 -1
- package/dist/components/fx2.js +9 -1
- package/dist/components/fx2.js.map +1 -1
- package/dist/components/widgets.cjs +460 -155
- package/dist/components/widgets.cjs.map +1 -1
- package/dist/components/widgets.d.cts +63 -2
- package/dist/components/widgets.d.ts +63 -2
- package/dist/components/widgets.js +456 -156
- package/dist/components/widgets.js.map +1 -1
- package/dist/widgets.umd.js +1 -1
- package/dist/widgets.umd.js.map +1 -1
- package/docs/ROADMAP.md +2 -2
- package/docs/components.md +44 -0
- package/package.json +41 -1
|
@@ -7,6 +7,7 @@ var registry = require('../chunks/registry-BVklOepd.cjs');
|
|
|
7
7
|
require('../chunks/builtins-ClXshqj-.cjs');
|
|
8
8
|
var components_fxShop = require('./fx-shop.cjs');
|
|
9
9
|
var components_engine = require('./engine.cjs');
|
|
10
|
+
var components_fxOrganic = require('./fx-organic.cjs');
|
|
10
11
|
require('../chunks/core-CwO835Wm.cjs');
|
|
11
12
|
require('./tokens.cjs');
|
|
12
13
|
require('../chunks/fx-C-XjLOTc.cjs');
|
|
@@ -28,9 +29,9 @@ function part(tag, cls, attrs = {}, html = '') {
|
|
|
28
29
|
}
|
|
29
30
|
/** Remove the parts a previous mount created. */
|
|
30
31
|
const dropParts = (el) => el.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
31
|
-
let uid$
|
|
32
|
+
let uid$3 = 0;
|
|
32
33
|
/** A document-unique id with a prefix. */
|
|
33
|
-
const nextId = (p) => `${p}-${++uid$
|
|
34
|
+
const nextId = (p) => `${p}-${++uid$3}`;
|
|
34
35
|
/** Roving arrow-key focus over `items` (horizontal or vertical); returns the new index or -1. */
|
|
35
36
|
function arrowIndex(e, i, n, vertical = false) {
|
|
36
37
|
const prev = vertical ? 'ArrowUp' : 'ArrowLeft';
|
|
@@ -46,7 +47,7 @@ function arrowIndex(e, i, n, vertical = false) {
|
|
|
46
47
|
return -1;
|
|
47
48
|
}
|
|
48
49
|
|
|
49
|
-
var css
|
|
50
|
+
var css$13 = "usa-carousel{display:block;position:relative;--usa-carousel-dur:520ms;--usa-carousel-ease:cubic-bezier(.22,1,.36,1);overflow:hidden;border-radius:var(--usa-radius,14px);touch-action:pan-y}.usa-carousel-viewport{position:relative;overflow:hidden;height:100%;min-height:inherit}.usa-carousel-track{display:flex;height:100%;transition:transform var(--usa-carousel-dur) var(--usa-carousel-ease);will-change:transform}.usa-carousel-track>*{flex:0 0 100%;min-width:0;box-sizing:border-box}usa-carousel:not([data-effect=\"slide\"]) .usa-carousel-track{display:grid}usa-carousel:not([data-effect=\"slide\"]) .usa-carousel-track>*{grid-area:1/1;transition:opacity var(--usa-carousel-dur) ease,transform var(--usa-carousel-dur) var(--usa-carousel-ease),filter var(--usa-carousel-dur) ease}usa-carousel[data-effect=\"cards\"] .usa-carousel-viewport{perspective:900px}usa-carousel[data-dragging] .usa-carousel-track,usa-carousel[data-dragging] .usa-carousel-track>*{transition:none}.usa-carousel-nav{position:absolute;top:50%;translate:0 -50%;z-index:2;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.85);color:#111;font:600 18px/1 system-ui;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.18);transition:transform .2s}.usa-carousel-nav:hover{transform:scale(1.08)}.usa-carousel-nav:focus-visible{outline:2px solid #7c5cff;outline-offset:2px}.usa-carousel-prev{left:10px}.usa-carousel-next{right:10px}.usa-carousel-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:6px;z-index:2}.usa-carousel-dot{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:rgba(255,255,255,.55);cursor:pointer;transition:width .35s var(--usa-carousel-ease),background .35s}.usa-carousel-dot[aria-current=\"true\"]{width:22px;background:#fff}@media (prefers-reduced-motion:reduce){usa-carousel .usa-carousel-track,usa-carousel .usa-carousel-track>*,.usa-carousel-dot{transition:none!important}}usa-carousel[data-reduced] .usa-carousel-track,usa-carousel[data-reduced] .usa-carousel-track>*{transition:none!important}";
|
|
50
51
|
|
|
51
52
|
const CAROUSEL_EFFECTS = ['slide', 'fade', 'scale', 'cards'];
|
|
52
53
|
function defineCarousel(tag = 'usa-carousel') {
|
|
@@ -235,10 +236,10 @@ function defineCarousel(tag = 'usa-carousel') {
|
|
|
235
236
|
}
|
|
236
237
|
}
|
|
237
238
|
return UsaCarousel;
|
|
238
|
-
}, { id: 'carousel', text: css
|
|
239
|
+
}, { id: 'carousel', text: css$13 });
|
|
239
240
|
}
|
|
240
241
|
|
|
241
|
-
var css$
|
|
242
|
+
var css$12 = "usa-tab-bar{display:block;--usa-tab-accent:#7c5cff;--usa-tab-ease:cubic-bezier(.22,1,.36,1)}.usa-tab-bar-list{position:relative;display:flex;gap:4px;padding:4px;border-radius:12px;background:rgba(127,127,127,.12);isolation:isolate;overflow-x:auto;scrollbar-width:none}.usa-tab-bar-list::-webkit-scrollbar{display:none}.usa-tab-bar-list>[role=\"tab\"]{position:relative;z-index:1;flex:1 0 auto;border:0;background:none;color:inherit;font:inherit;font-weight:600;padding:8px 14px;border-radius:9px;cursor:pointer;opacity:.7;transition:opacity .25s,color .25s;white-space:nowrap}.usa-tab-bar-list>[role=\"tab\"][aria-selected=\"true\"]{opacity:1}.usa-tab-bar-list>[role=\"tab\"]:focus-visible{outline:2px solid var(--usa-tab-accent);outline-offset:1px}.usa-tab-bar-ink{position:absolute;z-index:0;left:0;top:4px;bottom:4px;width:0;border-radius:9px;background:var(--usa-tab-accent);pointer-events:none}usa-tab-bar[data-indicator=\"pill\"] [aria-selected=\"true\"]{color:#fff}usa-tab-bar[data-indicator=\"underline\"] .usa-tab-bar-list{background:none;border-bottom:1px solid rgba(127,127,127,.25);border-radius:0}usa-tab-bar[data-indicator=\"underline\"] .usa-tab-bar-ink{top:auto;bottom:0;height:3px;border-radius:3px}usa-tab-bar[data-indicator=\"glow\"] .usa-tab-bar-ink{background:transparent;box-shadow:0 0 0 2px var(--usa-tab-accent),0 0 18px var(--usa-tab-accent)}usa-tab-bar[data-indicator=\"gooey\"] .usa-tab-bar-ink{filter:blur(.5px);border-radius:999px}usa-tab-bar[data-indicator=\"gooey\"] [aria-selected=\"true\"]{color:#fff}.usa-tab-bar-panel{padding:14px 2px}.usa-tab-bar-panel[hidden]{display:none}";
|
|
242
243
|
|
|
243
244
|
const TAB_INDICATORS = ['pill', 'underline', 'glow', 'gooey'];
|
|
244
245
|
function defineTabBar(tag = 'usa-tab-bar') {
|
|
@@ -351,10 +352,10 @@ function defineTabBar(tag = 'usa-tab-bar') {
|
|
|
351
352
|
}
|
|
352
353
|
}
|
|
353
354
|
return UsaTabBar;
|
|
354
|
-
}, { id: 'tab-bar', text: css$
|
|
355
|
+
}, { id: 'tab-bar', text: css$12 });
|
|
355
356
|
}
|
|
356
357
|
|
|
357
|
-
var css$
|
|
358
|
+
var css$11 = "usa-disclosure{display:block;--usa-disclosure-accent:#7c5cff}usa-disclosure>details{border-bottom:1px solid rgba(127,127,127,.25);overflow:hidden}usa-disclosure>details>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 4px;font-weight:600}usa-disclosure>details>summary::-webkit-details-marker{display:none}usa-disclosure>details>summary::after{content:\"\";flex:none;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;rotate:45deg;translate:0 -3px;transition:rotate .35s cubic-bezier(.34,1.56,.64,1),translate .35s}usa-disclosure>details[open]>summary::after{rotate:225deg;translate:0 2px}usa-disclosure>details>summary:focus-visible{outline:2px solid var(--usa-disclosure-accent);outline-offset:2px;border-radius:6px}usa-disclosure>details>:not(summary){padding:0 4px 12px}usa-disclosure[variant=\"cards\"]>details{border:1px solid rgba(127,127,127,.25);border-radius:12px;margin-bottom:8px;padding:0 10px;transition:box-shadow .3s,border-color .3s}usa-disclosure[variant=\"cards\"]>details[open]{border-color:var(--usa-disclosure-accent);box-shadow:0 8px 24px rgba(124,92,255,.16)}@media (prefers-reduced-motion:reduce){usa-disclosure>details>summary::after{transition:none}}";
|
|
358
359
|
|
|
359
360
|
function defineDisclosure(tag = 'usa-disclosure') {
|
|
360
361
|
return base.defineElement(tag, (Base) => {
|
|
@@ -422,10 +423,10 @@ function defineDisclosure(tag = 'usa-disclosure') {
|
|
|
422
423
|
}
|
|
423
424
|
}
|
|
424
425
|
return UsaDisclosure;
|
|
425
|
-
}, { id: 'disclosure', text: css$
|
|
426
|
+
}, { id: 'disclosure', text: css$11 });
|
|
426
427
|
}
|
|
427
428
|
|
|
428
|
-
var css$
|
|
429
|
+
var css$10 = "usa-stories{display:block;position:relative;overflow:hidden;border-radius:var(--usa-radius,16px);background:#111;color:#fff;aspect-ratio:9/14;max-height:520px;user-select:none;-webkit-user-select:none;touch-action:manipulation}usa-stories>:not([data-usa-part]){position:absolute;inset:0;opacity:0;transition:opacity .35s ease,transform .5s cubic-bezier(.22,1,.36,1);transform:scale(1.04);pointer-events:none;box-sizing:border-box}usa-stories>[data-active]:not([data-usa-part]){opacity:1;transform:none;pointer-events:auto}usa-stories>img:not([data-usa-part]){width:100%;height:100%;object-fit:cover}.usa-stories-bars{position:absolute;z-index:3;top:8px;left:8px;right:48px;display:flex;gap:4px}.usa-stories-bar{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.35);overflow:hidden}.usa-stories-bar>i{display:block;height:100%;width:100%;background:#fff;transform-origin:left;transform:scaleX(0)}.usa-stories-bar[data-done]>i{transform:scaleX(1)}.usa-stories-toggle{position:absolute;z-index:3;top:2px;right:6px;width:36px;height:30px;border:0;background:none;color:#fff;font:700 14px/1 system-ui;cursor:pointer;border-radius:8px}.usa-stories-toggle:focus-visible{outline:2px solid #fff}@media (prefers-reduced-motion:reduce){usa-stories>*{transition:none!important;transform:none!important}}";
|
|
429
430
|
|
|
430
431
|
function defineStories(tag = 'usa-stories') {
|
|
431
432
|
return base.defineElement(tag, (Base) => {
|
|
@@ -558,10 +559,10 @@ function defineStories(tag = 'usa-stories') {
|
|
|
558
559
|
}
|
|
559
560
|
}
|
|
560
561
|
return UsaStories;
|
|
561
|
-
}, { id: 'stories', text: css$
|
|
562
|
+
}, { id: 'stories', text: css$10 });
|
|
562
563
|
}
|
|
563
564
|
|
|
564
|
-
var css
|
|
565
|
+
var css$$ = "usa-modal,usa-sheet{display:contents}.usa-ov{border:0;padding:0;margin:auto;color:inherit;background:transparent;max-width:min(92vw,520px);max-height:88vh;overflow:visible}.usa-ov::backdrop{background:rgba(10,12,20,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.usa-ov-body{box-sizing:border-box;background:var(--usa-ov-bg,#fff);color:var(--usa-ov-fg,#111827);border-radius:var(--usa-ov-radius,18px);padding:var(--usa-ov-pad,22px);box-shadow:0 30px 80px -20px rgba(0,0,0,.45);max-height:88vh;overflow:auto}.usa-sheet-panel{margin:0;max-width:none;max-height:none}usa-sheet[data-side=\"right\"] .usa-sheet-panel{inset:0 0 0 auto;height:100%;width:min(88vw,var(--usa-sheet-size,380px))}usa-sheet[data-side=\"left\"] .usa-sheet-panel{inset:0 auto 0 0;height:100%;width:min(88vw,var(--usa-sheet-size,380px))}usa-sheet[data-side=\"bottom\"] .usa-sheet-panel{inset:auto 0 0 0;width:100%;max-height:85vh}usa-sheet[data-side=\"top\"] .usa-sheet-panel{inset:0 0 auto 0;width:100%;max-height:85vh}usa-sheet .usa-ov-body{height:100%;max-height:inherit;border-radius:0}usa-sheet[data-side=\"bottom\"] .usa-ov-body{border-radius:var(--usa-ov-radius,18px) var(--usa-ov-radius,18px) 0 0;height:auto;max-height:85vh;touch-action:none}usa-sheet[data-side=\"top\"] .usa-ov-body{border-radius:0 0 var(--usa-ov-radius,18px) var(--usa-ov-radius,18px);height:auto}.usa-ov-grab{width:44px;height:5px;border-radius:3px;background:rgba(127,127,127,.45);margin:-8px auto 14px;cursor:grab}@media (prefers-color-scheme:dark){.usa-ov-body{background:var(--usa-ov-bg,#171a23);color:var(--usa-ov-fg,#e5e7eb)}}";
|
|
565
566
|
|
|
566
567
|
const MODAL_EFFECTS = ['scale', 'slide-up', 'flip', 'origin'];
|
|
567
568
|
const SHEET_SIDES = ['right', 'left', 'bottom', 'top'];
|
|
@@ -788,12 +789,12 @@ function defineOverlay(tag, kind) {
|
|
|
788
789
|
}
|
|
789
790
|
}
|
|
790
791
|
return UsaOverlay;
|
|
791
|
-
}, { id: 'overlay', text: css
|
|
792
|
+
}, { id: 'overlay', text: css$$ });
|
|
792
793
|
}
|
|
793
794
|
const defineModal = (tag = 'usa-modal') => defineOverlay(tag, 'modal');
|
|
794
795
|
const defineSheet = (tag = 'usa-sheet') => defineOverlay(tag, 'sheet');
|
|
795
796
|
|
|
796
|
-
var css$
|
|
797
|
+
var css$_ = "usa-toast-stack{position:fixed;z-index:2147482000;width:min(360px,calc(100vw - 24px));pointer-events:none;--usa-tstack-bg:#111827;--usa-tstack-fg:#f9fafb}usa-toast-stack[contained]{position:absolute;width:min(360px,calc(100% - 24px))}usa-toast-stack[data-position^=\"bottom\"]{bottom:12px}usa-toast-stack[data-position^=\"top\"]{top:12px}usa-toast-stack[data-position$=\"right\"]{right:12px}usa-toast-stack[data-position$=\"left\"]{left:12px}usa-toast-stack[data-position$=\"center\"]{left:50%;transform:translateX(-50%)}.usa-tstack-list{position:relative;list-style:none;margin:0;padding:0;min-height:1px;transition:height .3s}.usa-tstack{position:absolute;left:0;right:0;display:flex;align-items:center;gap:10px;box-sizing:border-box;padding:12px 12px 12px 14px;border-radius:14px;background:var(--usa-tstack-bg);color:var(--usa-tstack-fg);box-shadow:0 12px 32px -10px rgba(0,0,0,.45);font:500 14px/1.35 system-ui,sans-serif;pointer-events:auto;touch-action:pan-y;transition:transform .38s cubic-bezier(.22,1,.36,1),opacity .3s;user-select:none}usa-toast-stack[data-position^=\"bottom\"] .usa-tstack{bottom:0;transform-origin:50% 100%}usa-toast-stack[data-position^=\"top\"] .usa-tstack{top:0;transform-origin:50% 0}.usa-tstack-icon{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:13px;font-weight:800;background:#3b82f6;color:#fff}.usa-tstack-success .usa-tstack-icon{background:#22c55e}.usa-tstack-warning .usa-tstack-icon{background:#f59e0b}.usa-tstack-error .usa-tstack-icon{background:#ef4444}.usa-tstack-text{flex:1;min-width:0;display:flex;flex-direction:column}.usa-tstack-text strong{font-weight:700}.usa-tstack-action{border:0;border-radius:8px;padding:6px 10px;background:rgba(255,255,255,.14);color:inherit;font:600 13px system-ui,sans-serif;cursor:pointer}.usa-tstack-close{border:0;background:none;color:inherit;opacity:.6;font-size:18px;line-height:1;cursor:pointer;padding:2px 4px}.usa-tstack-close:hover{opacity:1}@media (prefers-reduced-motion:reduce){.usa-tstack,.usa-tstack-list{transition:none}}";
|
|
797
798
|
|
|
798
799
|
const TOAST_POSITIONS = ['bottom-right', 'bottom-left', 'bottom-center', 'top-right', 'top-left', 'top-center'];
|
|
799
800
|
const ICONS = { info: 'ℹ', success: '✓', warning: '!', error: '✕' };
|
|
@@ -964,7 +965,7 @@ function defineToastStack(tag = 'usa-toast-stack') {
|
|
|
964
965
|
}
|
|
965
966
|
}
|
|
966
967
|
return UsaToastStack;
|
|
967
|
-
}, { id: 'toast', text: css$
|
|
968
|
+
}, { id: 'toast', text: css$_ });
|
|
968
969
|
}
|
|
969
970
|
/** Show a toast on the first `<usa-toast-stack>` of the page (one is created when missing). */
|
|
970
971
|
function stackToast(input, stack) {
|
|
@@ -992,7 +993,7 @@ function installToastTriggers() {
|
|
|
992
993
|
});
|
|
993
994
|
}
|
|
994
995
|
|
|
995
|
-
var css$
|
|
996
|
+
var css$Z = "usa-menu{position:relative;display:inline-block}.usa-menu-list{position:absolute;z-index:50;min-width:180px;max-width:min(280px,90vw);box-sizing:border-box;padding:6px;border-radius:12px;background:var(--usa-menu-bg,#fff);color:var(--usa-menu-fg,#111827);box-shadow:0 18px 44px -12px rgba(0,0,0,.35),0 0 0 1px rgba(127,127,127,.15);display:flex;flex-direction:column;gap:2px;text-align:left}.usa-menu-list[hidden]{display:none}usa-menu[data-placement^=\"bottom\"] .usa-menu-list{top:calc(100% + 6px)}usa-menu[data-placement^=\"top\"] .usa-menu-list{bottom:calc(100% + 6px)}usa-menu[data-placement$=\"start\"] .usa-menu-list{left:0;transform-origin:0 0}usa-menu[data-placement$=\"end\"] .usa-menu-list{right:0;transform-origin:100% 0}usa-menu[data-placement=\"top-start\"] .usa-menu-list{transform-origin:0 100%}usa-menu[data-placement=\"top-end\"] .usa-menu-list{transform-origin:100% 100%}.usa-menu-list>[role=\"menuitem\"]{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;border:0;background:none;color:inherit;font:500 14px/1.3 system-ui,sans-serif;text-align:left;text-decoration:none;padding:8px 10px;border-radius:8px;cursor:pointer}.usa-menu-list>[role=\"menuitem\"]:hover,.usa-menu-list>[role=\"menuitem\"]:focus-visible{background:var(--usa-menu-hover,rgba(124,92,255,.14));outline:none}.usa-menu-list>hr{border:0;border-top:1px solid rgba(127,127,127,.2);margin:4px 2px}@media (prefers-color-scheme:dark){.usa-menu-list{background:var(--usa-menu-bg,#1d2130);color:var(--usa-menu-fg,#e5e7eb)}}";
|
|
996
997
|
|
|
997
998
|
const MENU_EFFECTS = ['scale', 'fold', 'slide'];
|
|
998
999
|
function defineMenu(tag = 'usa-menu') {
|
|
@@ -1131,10 +1132,10 @@ function defineMenu(tag = 'usa-menu') {
|
|
|
1131
1132
|
}
|
|
1132
1133
|
}
|
|
1133
1134
|
return UsaMenu;
|
|
1134
|
-
}, { id: 'menu', text: css$
|
|
1135
|
+
}, { id: 'menu', text: css$Z });
|
|
1135
1136
|
}
|
|
1136
1137
|
|
|
1137
|
-
var css$
|
|
1138
|
+
var css$Y = "usa-progress-ring{position:relative;display:inline-block;vertical-align:middle;width:var(--usa-pr-size,120px);aspect-ratio:1;--usa-pr-color:#7c5cff;--usa-pr-track:rgba(127,127,127,.18);--usa-pr-width:9;font:700 calc(var(--usa-pr-size,120px)*.2)/1 system-ui,sans-serif;font-variant-numeric:tabular-nums}usa-progress-ring[data-variant=\"semi\"]{aspect-ratio:100/56}.usa-pr-label{position:absolute;inset:0;display:grid;place-items:center}usa-progress-ring[data-variant=\"semi\"] .usa-pr-label{place-items:end center}usa-progress-ring[data-variant=\"bar\"]{display:inline-flex;width:var(--usa-pr-size,100%);aspect-ratio:auto;gap:10px;align-items:center;font-size:14px}usa-progress-ring[data-variant=\"bar\"]>.usa-pr-track{flex:1 1 auto;min-width:40px}usa-progress-ring[data-variant=\"bar\"] .usa-pr-label{position:static;display:inline}usa-progress-ring .usa-pr-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.usa-pr-svg path{fill:none;stroke-width:var(--usa-pr-width);stroke-linecap:round}.usa-pr-svg .usa-pr-track{stroke:var(--usa-pr-track)}.usa-pr-svg .usa-pr-arc{stroke:var(--usa-pr-color)}usa-progress-ring[data-variant=\"semi\"] .usa-pr-label{padding-bottom:2%}.usa-pr-track:is(div){height:10px;border-radius:999px;background:var(--usa-pr-track);overflow:hidden}.usa-pr-fill{height:100%;border-radius:inherit;background:var(--usa-pr-color);transform-origin:0 50%;transform:scaleX(0)}usa-progress-ring[data-indeterminate] .usa-pr-svg{animation:usa-pr-spin 1.1s linear infinite}usa-progress-ring[data-indeterminate] .usa-pr-fill{width:35%;transform:none!important;animation:usa-pr-slide 1.3s ease-in-out infinite}@keyframes usa-pr-spin{to{transform:rotate(360deg)}}@keyframes usa-pr-slide{from{margin-left:-35%}to{margin-left:100%}}usa-odometer{display:inline-flex;align-items:flex-end;font-variant-numeric:tabular-nums;line-height:1.15}.usa-odo-row{display:inline-flex;align-items:flex-end}.usa-odo-col{display:inline-block;height:1.15em;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent)}.usa-odo-strip{display:block;white-space:pre;line-height:1.15em;text-align:center}.usa-odo-sym{display:inline-block;height:1.15em}@media (prefers-reduced-motion:reduce){usa-progress-ring[data-indeterminate] .usa-pr-svg,usa-progress-ring[data-indeterminate] .usa-pr-fill{animation-duration:4s}}";
|
|
1138
1139
|
|
|
1139
1140
|
const PROGRESS_VARIANTS = ['ring', 'bar', 'semi'];
|
|
1140
1141
|
const NS = 'http://www.w3.org/2000/svg';
|
|
@@ -1274,7 +1275,7 @@ function defineProgressRing(tag = 'usa-progress-ring') {
|
|
|
1274
1275
|
}
|
|
1275
1276
|
}
|
|
1276
1277
|
return UsaProgressRing;
|
|
1277
|
-
}, { id: 'meters', text: css$
|
|
1278
|
+
}, { id: 'meters', text: css$Y });
|
|
1278
1279
|
}
|
|
1279
1280
|
function defineOdometer(tag = 'usa-odometer') {
|
|
1280
1281
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1384,10 +1385,10 @@ function defineOdometer(tag = 'usa-odometer') {
|
|
|
1384
1385
|
}
|
|
1385
1386
|
}
|
|
1386
1387
|
return UsaOdometer;
|
|
1387
|
-
}, { id: 'meters', text: css$
|
|
1388
|
+
}, { id: 'meters', text: css$Y });
|
|
1388
1389
|
}
|
|
1389
1390
|
|
|
1390
|
-
var css$
|
|
1391
|
+
var css$X = "usa-skeleton-reveal{position:relative;display:block;--usa-sk-base:rgba(127,127,127,.16);--usa-sk-hi:rgba(255,255,255,.55)}usa-skeleton-reveal[data-loading]>:not(.usa-sk-layer){visibility:hidden}.usa-sk-layer{position:absolute;inset:0;pointer-events:none}.usa-sk-box{position:absolute;border-radius:6px;background:var(--usa-sk-base);overflow:hidden}usa-skeleton-reveal[data-variant=\"wave\"] .usa-sk-box{background:linear-gradient(100deg,var(--usa-sk-base) 30%,var(--usa-sk-hi) 50%,var(--usa-sk-base) 70%) var(--usa-sk-x,0) 0/var(--usa-sk-w,600px) 100% no-repeat,var(--usa-sk-base);animation:usa-sk-wave 1.4s linear infinite}usa-skeleton-reveal[data-variant=\"pulse\"] .usa-sk-box{animation:usa-sk-pulse 1.2s ease-in-out infinite alternate}usa-skeleton-reveal[data-variant=\"glow\"] .usa-sk-box{animation:usa-sk-glow 1.6s ease-in-out infinite alternate}@keyframes usa-sk-wave{from{background-position:calc(var(--usa-sk-x,0px) - var(--usa-sk-w,600px)) 0,0 0}to{background-position:calc(var(--usa-sk-x,0px) + var(--usa-sk-w,600px)) 0,0 0}}@keyframes usa-sk-pulse{from{opacity:1}to{opacity:.45}}@keyframes usa-sk-glow{from{box-shadow:0 0 0 rgba(124,92,255,0)}to{box-shadow:0 0 14px rgba(124,92,255,.45);background:rgba(124,92,255,.22)}}@media (prefers-color-scheme:dark){usa-skeleton-reveal{--usa-sk-hi:rgba(255,255,255,.16)}}@media (prefers-reduced-motion:reduce){.usa-sk-box{animation:none!important}}";
|
|
1391
1392
|
|
|
1392
1393
|
const SKELETON_VARIANTS = ['wave', 'pulse', 'glow'];
|
|
1393
1394
|
function defineSkeletonReveal(tag = 'usa-skeleton-reveal') {
|
|
@@ -1502,10 +1503,10 @@ function defineSkeletonReveal(tag = 'usa-skeleton-reveal') {
|
|
|
1502
1503
|
}
|
|
1503
1504
|
}
|
|
1504
1505
|
return UsaSkeletonReveal;
|
|
1505
|
-
}, { id: 'skeleton-reveal', text: css$
|
|
1506
|
+
}, { id: 'skeleton-reveal', text: css$X });
|
|
1506
1507
|
}
|
|
1507
1508
|
|
|
1508
|
-
var css$
|
|
1509
|
+
var css$W = "usa-star-rating{display:inline-flex;gap:var(--usa-star-gap,4px);--usa-star-size:28px;--usa-star-on:#fbbf24;--usa-star-off:rgba(127,127,127,.28);cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:8px}usa-star-rating[readonly]{cursor:default}usa-star-rating:focus-visible{outline:2px solid var(--usa-star-on);outline-offset:4px}.usa-star{position:relative;display:inline-block;width:var(--usa-star-size);height:var(--usa-star-size);--usa-star-fill:0%}.usa-star svg{display:block;width:100%;height:100%;overflow:visible;stroke:none}.usa-star-bg{fill:var(--usa-star-off)}.usa-star-fg{position:absolute;left:0;top:0;bottom:0;width:var(--usa-star-fill);overflow:hidden;transition:width .18s ease-out}.usa-star-fg svg{width:var(--usa-star-size);height:var(--usa-star-size);fill:var(--usa-star-on);filter:drop-shadow(0 1px 3px rgba(251,191,36,.45))}usa-star-rating[data-preview] .usa-star-fg{opacity:.8}.usa-star-spark{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var(--usa-star-on);pointer-events:none}@media (prefers-reduced-motion:reduce){.usa-star-fg{transition:none}}";
|
|
1509
1510
|
|
|
1510
1511
|
const PATHS = {
|
|
1511
1512
|
star: 'M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6L2.5 9.4l6.6-.8z',
|
|
@@ -1642,10 +1643,10 @@ function defineStarRating(tag = 'usa-star-rating') {
|
|
|
1642
1643
|
}
|
|
1643
1644
|
UsaStarRating.formAssociated = true;
|
|
1644
1645
|
return UsaStarRating;
|
|
1645
|
-
}, { id: 'star-rating', text: css$
|
|
1646
|
+
}, { id: 'star-rating', text: css$W });
|
|
1646
1647
|
}
|
|
1647
1648
|
|
|
1648
|
-
var css$
|
|
1649
|
+
var css$V = "usa-milestones{position:relative;display:block;--usa-ms-color:#7c5cff;--usa-ms-rail:rgba(127,127,127,.22);--usa-ms-gap:28px;padding:4px 0}.usa-ms-rail{position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;border-radius:3px;background:var(--usa-ms-rail);overflow:hidden}.usa-ms-fill{position:absolute;inset:0;background:linear-gradient(var(--usa-ms-color),#22d3ee);transform-origin:50% 0;transform:scaleY(0)}.usa-ms-item{position:relative;box-sizing:border-box;width:50%;padding:0 var(--usa-ms-gap) var(--usa-ms-gap);text-align:left}.usa-ms-item[data-side=\"right\"]{margin-left:50%}.usa-ms-item[data-side=\"left\"]{text-align:right}.usa-ms-dot{position:absolute;top:4px;width:14px;height:14px;border-radius:50%;background:var(--usa-ms-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--usa-ms-color) 22%,transparent);transform:scale(0)}.usa-ms-item[data-reached] .usa-ms-dot{transform:none}.usa-ms-item[data-side=\"right\"] .usa-ms-dot{left:-7px}.usa-ms-item[data-side=\"left\"] .usa-ms-dot{right:-7px}.usa-ms-date{display:block;font-size:.8em;font-weight:700;letter-spacing:.04em;color:var(--usa-ms-color);margin-bottom:2px}.usa-ms-item:not([data-reached])>:not(.usa-ms-dot){opacity:0}usa-milestones[data-layout=\"left\"] .usa-ms-rail{left:7px}usa-milestones[data-layout=\"left\"] .usa-ms-item{width:auto;margin-left:0;padding-left:calc(var(--usa-ms-gap) + 8px);text-align:left}usa-milestones[data-layout=\"left\"] .usa-ms-dot{left:1px;right:auto}@media (max-width:640px){usa-milestones .usa-ms-rail{left:7px}usa-milestones .usa-ms-item{width:auto;margin-left:0;padding-left:calc(var(--usa-ms-gap) + 8px);text-align:left}usa-milestones .usa-ms-item .usa-ms-dot{left:1px;right:auto}}";
|
|
1649
1650
|
|
|
1650
1651
|
function defineMilestones(tag = 'usa-milestones') {
|
|
1651
1652
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1733,10 +1734,10 @@ function defineMilestones(tag = 'usa-milestones') {
|
|
|
1733
1734
|
}
|
|
1734
1735
|
}
|
|
1735
1736
|
return UsaMilestones;
|
|
1736
|
-
}, { id: 'milestones', text: css$
|
|
1737
|
+
}, { id: 'milestones', text: css$V });
|
|
1737
1738
|
}
|
|
1738
1739
|
|
|
1739
|
-
var css$
|
|
1740
|
+
var css$U = "usa-masonry-flow{position:relative;display:block;width:100%}usa-masonry-flow>*{position:absolute;left:0;top:0;box-sizing:border-box;margin:0;will-change:transform}usa-masonry-flow>[data-hidden]:not([data-leaving]){display:none}usa-masonry-flow>[data-leaving]{pointer-events:none}";
|
|
1740
1741
|
|
|
1741
1742
|
function defineMasonryFlow(tag = 'usa-masonry-flow') {
|
|
1742
1743
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1857,10 +1858,10 @@ function defineMasonryFlow(tag = 'usa-masonry-flow') {
|
|
|
1857
1858
|
}
|
|
1858
1859
|
}
|
|
1859
1860
|
return UsaMasonryFlow;
|
|
1860
|
-
}, { id: 'masonry-flow', text: css$
|
|
1861
|
+
}, { id: 'masonry-flow', text: css$U });
|
|
1861
1862
|
}
|
|
1862
1863
|
|
|
1863
|
-
var css$
|
|
1864
|
+
var css$T = "usa-compare{position:relative;display:grid;overflow:hidden;border-radius:var(--usa-cmp-radius,14px);user-select:none;touch-action:pan-y;cursor:ew-resize;--usa-cmp-line:#fff;outline-offset:3px}usa-compare[data-orientation=\"vertical\"]{touch-action:pan-x;cursor:ns-resize}usa-compare>.usa-cmp-before,usa-compare>.usa-cmp-after{grid-area:1/1;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.usa-cmp-handle{position:absolute;top:0;bottom:0;left:50%;width:0;z-index:2;pointer-events:none}.usa-cmp-handle::before{content:\"\";position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:var(--usa-cmp-line);box-shadow:0 0 8px rgba(0,0,0,.35)}usa-compare[data-orientation=\"vertical\"] .usa-cmp-handle{top:50%;bottom:auto;left:0;right:0;width:auto;height:0}usa-compare[data-orientation=\"vertical\"] .usa-cmp-handle::before{left:0;right:0;top:-1.5px;width:auto;height:3px}.usa-cmp-knob{position:absolute;top:50%;left:0;display:grid;place-items:center;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:var(--usa-cmp-line);color:#111827;box-shadow:0 6px 18px rgba(0,0,0,.35);pointer-events:auto;cursor:grab;transition:transform .2s}usa-compare[data-orientation=\"vertical\"] .usa-cmp-knob{left:50%;top:0;transform:rotate(90deg)}usa-compare:active .usa-cmp-knob{transform:scale(.92)}usa-compare[data-orientation=\"vertical\"]:active .usa-cmp-knob{transform:rotate(90deg) scale(.92)}.usa-cmp-label{position:absolute;top:10px;z-index:1;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font:600 12px/1.4 system-ui,sans-serif;pointer-events:none}.usa-cmp-label-b{left:10px}.usa-cmp-label-a{right:10px}";
|
|
1864
1865
|
|
|
1865
1866
|
function defineCompare(tag = 'usa-compare') {
|
|
1866
1867
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1984,10 +1985,10 @@ function defineCompare(tag = 'usa-compare') {
|
|
|
1984
1985
|
}
|
|
1985
1986
|
}
|
|
1986
1987
|
return UsaCompare;
|
|
1987
|
-
}, { id: 'compare', text: css$
|
|
1988
|
+
}, { id: 'compare', text: css$T });
|
|
1988
1989
|
}
|
|
1989
1990
|
|
|
1990
|
-
var css$
|
|
1991
|
+
var css$S = "usa-cube-gallery{position:relative;display:block;aspect-ratio:4/3;perspective:1100px;outline-offset:4px}.usa-cube-stage{position:absolute;inset:0;transform-style:preserve-3d;touch-action:pan-y}.usa-cube-face{position:absolute;inset:0;box-sizing:border-box;margin:0;backface-visibility:hidden;display:none;overflow:hidden;border-radius:var(--usa-cube-radius,14px)}.usa-cube-face[data-active]{display:block}.usa-cube-face>img{width:100%;height:100%;object-fit:cover;display:block}.usa-cube-btn{position:absolute;top:50%;z-index:2;width:34px;height:34px;margin-top:-17px;border:0;border-radius:50%;background:rgba(255,255,255,.85);color:#111827;font:700 20px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.25)}.usa-cube-prev{left:8px}.usa-cube-next{right:8px}.usa-cube-btn:focus-visible{outline:2px solid #7c5cff;outline-offset:2px}";
|
|
1991
1992
|
|
|
1992
1993
|
function defineCubeGallery(tag = 'usa-cube-gallery') {
|
|
1993
1994
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2120,10 +2121,10 @@ function defineCubeGallery(tag = 'usa-cube-gallery') {
|
|
|
2120
2121
|
}
|
|
2121
2122
|
}
|
|
2122
2123
|
return UsaCubeGallery;
|
|
2123
|
-
}, { id: 'cube-gallery', text: css$
|
|
2124
|
+
}, { id: 'cube-gallery', text: css$S });
|
|
2124
2125
|
}
|
|
2125
2126
|
|
|
2126
|
-
var css$
|
|
2127
|
+
var css$R = "usa-dock{display:inline-flex;align-items:flex-end;gap:var(--usa-dock-gap,8px);padding:8px 10px;border-radius:20px;background:var(--usa-dock-bg,rgba(255,255,255,.55));-webkit-backdrop-filter:blur(14px) saturate(1.6);backdrop-filter:blur(14px) saturate(1.6);box-shadow:0 10px 30px -10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.45);--usa-dock-size:44px}usa-dock[data-orientation=\"vertical\"]{flex-direction:column;align-items:flex-start}.usa-dock-item{--usa-dock-s:1;position:relative;display:grid;place-items:center;flex:none;width:calc(var(--usa-dock-size) * var(--usa-dock-s));height:calc(var(--usa-dock-size) * var(--usa-dock-s));border:0;padding:0;border-radius:calc(var(--usa-dock-size) * .26 * var(--usa-dock-s));background:var(--usa-dock-item,linear-gradient(135deg,#7c5cff,#22d3ee));color:#fff;font-size:calc(var(--usa-dock-size) * .5 * var(--usa-dock-s));text-decoration:none;cursor:pointer;transition:width .12s ease-out,height .12s ease-out,font-size .12s ease-out,border-radius .12s;box-shadow:0 4px 10px rgba(0,0,0,.18)}.usa-dock-item:focus-visible{outline:2px solid #7c5cff;outline-offset:3px}.usa-dock-item[data-label]::after{content:attr(data-label);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);padding:3px 8px;border-radius:6px;background:rgba(17,24,39,.9);color:#fff;font:500 12px/1.3 system-ui,sans-serif;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}.usa-dock-item[data-near]::after,.usa-dock-item:focus-visible::after{opacity:1;transform:translateX(-50%)}usa-dock[data-orientation=\"vertical\"] .usa-dock-item[data-label]::after{bottom:auto;left:calc(100% + 8px);top:50%;transform:translateY(-50%)}@media (prefers-reduced-motion:reduce){.usa-dock-item{transition:none}}";
|
|
2127
2128
|
|
|
2128
2129
|
function defineDock(tag = 'usa-dock') {
|
|
2129
2130
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2191,10 +2192,10 @@ function defineDock(tag = 'usa-dock') {
|
|
|
2191
2192
|
}
|
|
2192
2193
|
}
|
|
2193
2194
|
return UsaDock;
|
|
2194
|
-
}, { id: 'dock', text: css$
|
|
2195
|
+
}, { id: 'dock', text: css$R });
|
|
2195
2196
|
}
|
|
2196
2197
|
|
|
2197
|
-
var css$
|
|
2198
|
+
var css$Q = "usa-nav-morph{position:relative;display:flex;gap:4px;align-items:center;isolation:isolate;--usa-nm-color:#7c5cff;flex-wrap:nowrap;max-width:100%;overflow-x:auto;scrollbar-width:none}usa-nav-morph::-webkit-scrollbar{display:none}usa-nav-morph>:not(.usa-nm-ink){position:relative;z-index:1;flex:none;padding:8px 12px;border-radius:10px;color:inherit;text-decoration:none;font-weight:600;white-space:nowrap;transition:color .25s;outline-offset:2px}.usa-nm-ink{position:absolute;left:0;z-index:0;width:0;pointer-events:none;background:var(--usa-nm-color)}usa-nav-morph[data-indicator=\"underline\"] .usa-nm-ink{bottom:0;height:3px;border-radius:3px}usa-nav-morph[data-indicator=\"pill\"] .usa-nm-ink,usa-nav-morph[data-indicator=\"blob\"] .usa-nm-ink{top:0;bottom:0;border-radius:10px;opacity:.16}usa-nav-morph[data-indicator=\"blob\"] .usa-nm-ink{border-radius:999px;opacity:.2}usa-nav-morph[data-indicator=\"dot\"] .usa-nm-ink{bottom:0;height:6px;background:radial-gradient(circle,var(--usa-nm-color) 3px,transparent 3.5px)}usa-nav-morph>[aria-current=\"page\"]{color:var(--usa-nm-color)}";
|
|
2198
2199
|
|
|
2199
2200
|
const NAV_INDICATORS = ['underline', 'pill', 'blob', 'dot'];
|
|
2200
2201
|
function defineNavMorph(tag = 'usa-nav-morph') {
|
|
@@ -2298,10 +2299,10 @@ function defineNavMorph(tag = 'usa-nav-morph') {
|
|
|
2298
2299
|
}
|
|
2299
2300
|
}
|
|
2300
2301
|
return UsaNavMorph;
|
|
2301
|
-
}, { id: 'nav-morph', text: css$
|
|
2302
|
+
}, { id: 'nav-morph', text: css$Q });
|
|
2302
2303
|
}
|
|
2303
2304
|
|
|
2304
|
-
var css$
|
|
2305
|
+
var css$P = "usa-menu-toggle{display:inline-grid;place-items:center;width:var(--usa-mt-size,44px);height:var(--usa-mt-size,44px);border-radius:12px;cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent;outline-offset:2px;--usa-mt-ease:cubic-bezier(.65,.05,.36,1)}usa-menu-toggle:hover{background:rgba(127,127,127,.12)}.usa-mt-box{position:relative;width:24px;height:18px}.usa-mt-bar{position:absolute;left:0;width:100%;height:2.5px;border-radius:2px;background:currentColor;transform-origin:50% 50%}.usa-mt-bar:nth-child(1){top:0}.usa-mt-bar:nth-child(2){top:7.75px}.usa-mt-bar:nth-child(3){bottom:0}usa-menu-toggle[data-animate] .usa-mt-bar{transition:transform .38s var(--usa-mt-ease),opacity .2s,top .38s var(--usa-mt-ease),bottom .38s var(--usa-mt-ease),width .38s var(--usa-mt-ease)}usa-menu-toggle[data-animate] .usa-mt-box{transition:transform .38s var(--usa-mt-ease)}usa-menu-toggle[data-variant=\"cross\"][data-open] .usa-mt-bar:nth-child(1),usa-menu-toggle[data-variant=\"plus-x\"][data-open] .usa-mt-bar:nth-child(1){top:7.75px;transform:rotate(45deg)}usa-menu-toggle[data-variant=\"cross\"][data-open] .usa-mt-bar:nth-child(2),usa-menu-toggle[data-variant=\"plus-x\"][data-open] .usa-mt-bar:nth-child(2){opacity:0;transform:scaleX(.2)}usa-menu-toggle[data-variant=\"cross\"][data-open] .usa-mt-bar:nth-child(3),usa-menu-toggle[data-variant=\"plus-x\"][data-open] .usa-mt-bar:nth-child(3){bottom:7.75px;transform:rotate(-45deg)}usa-menu-toggle[data-variant=\"plus-x\"][data-open] .usa-mt-box{transform:rotate(180deg)}usa-menu-toggle[data-variant=\"arrow\"][data-open] .usa-mt-bar:nth-child(1){width:55%;transform:translate(-2px,3.5px) rotate(-40deg)}usa-menu-toggle[data-variant=\"arrow\"][data-open] .usa-mt-bar:nth-child(3){width:55%;transform:translate(-2px,-3.5px) rotate(40deg)}usa-menu-toggle[data-variant=\"arrow\"][data-open] .usa-mt-box{transform:rotate(180deg)}usa-menu-toggle[data-variant=\"minus\"][data-open] .usa-mt-bar:nth-child(1){top:7.75px}usa-menu-toggle[data-variant=\"minus\"][data-open] .usa-mt-bar:nth-child(3){bottom:7.75px}";
|
|
2305
2306
|
|
|
2306
2307
|
const TOGGLE_VARIANTS = ['cross', 'arrow', 'minus', 'plus-x'];
|
|
2307
2308
|
function defineMenuToggle(tag = 'usa-menu-toggle') {
|
|
@@ -2374,10 +2375,10 @@ function defineMenuToggle(tag = 'usa-menu-toggle') {
|
|
|
2374
2375
|
}
|
|
2375
2376
|
}
|
|
2376
2377
|
return UsaMenuToggle;
|
|
2377
|
-
}, { id: 'menu-toggle', text: css$
|
|
2378
|
+
}, { id: 'menu-toggle', text: css$P });
|
|
2378
2379
|
}
|
|
2379
2380
|
|
|
2380
|
-
var css$
|
|
2381
|
+
var css$O = "usa-tip{position:relative;display:inline-block}.usa-tip-bubble{position:absolute;left:0;top:0;z-index:60;box-sizing:border-box;max-width:min(260px,calc(100vw - 16px));width:max-content;padding:7px 11px;border-radius:9px;background:var(--usa-tip-bg,#111827);color:var(--usa-tip-fg,#f9fafb);font:500 13px/1.4 system-ui,sans-serif;box-shadow:0 10px 26px -8px rgba(0,0,0,.4);text-align:left;white-space:normal}.usa-tip-bubble[hidden]{display:none}.usa-tip-bubble[data-placement=\"top\"]{transform-origin:50% 100%}.usa-tip-bubble[data-placement=\"bottom\"]{transform-origin:50% 0}.usa-tip-bubble[data-placement=\"left\"]{transform-origin:100% 50%}.usa-tip-bubble[data-placement=\"right\"]{transform-origin:0 50%}.usa-tip-arrow{position:absolute;width:10px;height:10px;background:inherit;transform:rotate(45deg)}.usa-tip-bubble[data-placement=\"top\"] .usa-tip-arrow{bottom:-4px;left:calc(50% - 5px + var(--usa-tip-shift,0px))}.usa-tip-bubble[data-placement=\"bottom\"] .usa-tip-arrow{top:-4px;left:calc(50% - 5px + var(--usa-tip-shift,0px))}.usa-tip-bubble[data-placement=\"left\"] .usa-tip-arrow{right:-4px;top:calc(50% - 5px)}.usa-tip-bubble[data-placement=\"right\"] .usa-tip-arrow{left:-4px;top:calc(50% - 5px)}";
|
|
2381
2382
|
|
|
2382
2383
|
const TIP_PLACEMENTS = ['top', 'bottom', 'left', 'right'];
|
|
2383
2384
|
const FLIP = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' };
|
|
@@ -2509,10 +2510,10 @@ function defineTip(tag = 'usa-tip') {
|
|
|
2509
2510
|
}
|
|
2510
2511
|
}
|
|
2511
2512
|
return UsaTip;
|
|
2512
|
-
}, { id: 'tip', text: css$
|
|
2513
|
+
}, { id: 'tip', text: css$O });
|
|
2513
2514
|
}
|
|
2514
2515
|
|
|
2515
|
-
var css$
|
|
2516
|
+
var css$N = "usa-stepper{--usa-st-c:#7c5cff;--usa-st-size:30px;position:relative;display:flex;justify-content:space-between;gap:8px;padding:0;counter-reset:s;max-width:100%}usa-stepper[data-orientation=\"vertical\"]{flex-direction:column;gap:22px}.usa-st-rail{position:absolute;left:calc(var(--usa-st-size)/2);right:calc(var(--usa-st-size)/2);top:calc(var(--usa-st-size)/2 - 2px);height:4px;border-radius:4px;background:rgba(127,127,127,.25);pointer-events:none}usa-stepper[data-orientation=\"vertical\"] .usa-st-rail{left:calc(var(--usa-st-size)/2 - 2px);right:auto;top:calc(var(--usa-st-size)/2);bottom:calc(var(--usa-st-size)/2);width:4px;height:auto}.usa-st-fill{position:absolute;inset:0;border-radius:inherit;background:var(--usa-st-c);transform-origin:0 0;transform:scaleX(calc(var(--usa-st-p,0%) / 100%));transition:transform .55s cubic-bezier(.6,.05,.3,1)}usa-stepper[data-orientation=\"vertical\"] .usa-st-fill{transform:scaleY(calc(var(--usa-st-p,0%) / 100%))}.usa-st-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;font:600 12px/1.25 system-ui,sans-serif;text-align:center;color:rgba(127,127,127,.95)}usa-stepper[data-orientation=\"vertical\"] .usa-st-step{flex-direction:row;text-align:left}.usa-st-step[data-current],.usa-st-step[data-done]{color:inherit}.usa-st-dot{position:relative;display:grid;place-items:center;flex:none;width:var(--usa-st-size);height:var(--usa-st-size);border-radius:50%;background:var(--usa-st-bg,#fff);box-shadow:inset 0 0 0 2px rgba(127,127,127,.4);color:#666;font-weight:700;transition:background .3s,box-shadow .3s,color .3s}.usa-st-step[data-current] .usa-st-dot{box-shadow:inset 0 0 0 2px var(--usa-st-c);color:var(--usa-st-c)}.usa-st-step[data-done] .usa-st-dot{background:var(--usa-st-c);box-shadow:none;color:#fff}.usa-st-check{position:absolute;width:60%;height:60%;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20;opacity:0}.usa-st-step[data-done] .usa-st-check{stroke-dashoffset:0;opacity:1}.usa-st-step[data-done] .usa-st-num{opacity:0}.usa-st-step[data-clickable],usa-stepper[clickable] .usa-st-step{cursor:pointer}@media (prefers-reduced-motion:reduce){.usa-st-fill,.usa-st-dot{transition:none}}";
|
|
2516
2517
|
|
|
2517
2518
|
function defineStepper(tag = 'usa-stepper') {
|
|
2518
2519
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2609,10 +2610,10 @@ function defineStepper(tag = 'usa-stepper') {
|
|
|
2609
2610
|
}
|
|
2610
2611
|
}
|
|
2611
2612
|
return UsaStepper;
|
|
2612
|
-
}, { id: 'stepper', text: css$
|
|
2613
|
+
}, { id: 'stepper', text: css$N });
|
|
2613
2614
|
}
|
|
2614
2615
|
|
|
2615
|
-
var css$
|
|
2616
|
+
var css$M = "usa-pagination{--usa-pg-c:#7c5cff;display:inline-flex;align-items:center;gap:4px;max-width:100%;font:600 14px/1 system-ui,sans-serif}.usa-pg-list{position:relative;display:inline-flex;align-items:center;gap:2px;isolation:isolate}.usa-pg-ink{position:absolute;left:0;top:0;height:100%;width:0;border-radius:10px;background:var(--usa-pg-c);z-index:-1;transition:width .3s}.usa-pg-btn{display:grid;place-items:center;min-width:34px;height:34px;padding:0 6px;border:0;border-radius:10px;background:none;color:inherit;font:inherit;cursor:pointer;transition:color .25s,background .2s}.usa-pg-btn:hover:not(:disabled):not([aria-current]){background:rgba(127,127,127,.14)}.usa-pg-btn[aria-current=\"page\"]{color:#fff}.usa-pg-btn:disabled{opacity:.35;cursor:default}.usa-pg-btn:focus-visible{outline:2px solid var(--usa-pg-c);outline-offset:2px}.usa-pg-gap{min-width:20px;text-align:center;opacity:.6}@media (max-width:420px){.usa-pg-btn{min-width:28px;height:30px;padding:0 3px}}@media (prefers-reduced-motion:reduce){.usa-pg-ink{transition:none}}";
|
|
2616
2617
|
|
|
2617
2618
|
/** The visible page list: numbers and `'…'` gaps (1-based). */
|
|
2618
2619
|
function pageWindow(page, total, siblings = 1) {
|
|
@@ -2734,10 +2735,10 @@ function definePagination(tag = 'usa-pagination') {
|
|
|
2734
2735
|
}
|
|
2735
2736
|
}
|
|
2736
2737
|
return UsaPagination;
|
|
2737
|
-
}, { id: 'pagination', text: css$
|
|
2738
|
+
}, { id: 'pagination', text: css$M });
|
|
2738
2739
|
}
|
|
2739
2740
|
|
|
2740
|
-
var css$
|
|
2741
|
+
var css$L = "usa-segmented{--usa-seg-c:#7c5cff;position:relative;display:inline-flex;align-items:stretch;padding:3px;border-radius:12px;background:rgba(127,127,127,.16);isolation:isolate;max-width:100%;font:600 13px/1 system-ui,sans-serif}.usa-seg-thumb{position:absolute;top:3px;bottom:3px;left:3px;z-index:-1;border-radius:9px;background:var(--usa-seg-thumb,#fff);box-shadow:0 2px 8px rgba(0,0,0,.18),0 0 0 .5px rgba(0,0,0,.05);transform-origin:50% 50%}usa-segmented[data-variant=\"pill\"]{border-radius:999px}usa-segmented[data-variant=\"pill\"] .usa-seg-thumb{border-radius:999px;background:var(--usa-seg-c)}usa-segmented[data-variant=\"pill\"] .usa-seg-item[data-selected]{color:#fff}usa-segmented[data-variant=\"outline\"]{background:none;box-shadow:inset 0 0 0 1.5px rgba(127,127,127,.35)}usa-segmented[data-variant=\"outline\"] .usa-seg-thumb{background:none;box-shadow:inset 0 0 0 2px var(--usa-seg-c)}.usa-seg-item{flex:1 1 0;min-width:0;padding:8px 14px;border:0;border-radius:9px;background:none;color:inherit;font:inherit;white-space:nowrap;cursor:pointer;opacity:.7;transition:opacity .2s,transform .25s cubic-bezier(.3,1.4,.5,1),color .2s}.usa-seg-item[data-selected]{opacity:1;transform:scale(1.04)}.usa-seg-item:focus-visible{outline:2px solid var(--usa-seg-c);outline-offset:1px}@media (max-width:420px){.usa-seg-item{padding:8px 9px}}@media (prefers-reduced-motion:reduce){.usa-seg-item{transition:none}}";
|
|
2741
2742
|
|
|
2742
2743
|
const SEGMENTED_VARIANTS = ['ios', 'pill', 'outline'];
|
|
2743
2744
|
function defineSegmented(tag = 'usa-segmented') {
|
|
@@ -2831,10 +2832,10 @@ function defineSegmented(tag = 'usa-segmented') {
|
|
|
2831
2832
|
}
|
|
2832
2833
|
}
|
|
2833
2834
|
return UsaSegmented;
|
|
2834
|
-
}, { id: 'segmented', text: css$
|
|
2835
|
+
}, { id: 'segmented', text: css$L });
|
|
2835
2836
|
}
|
|
2836
2837
|
|
|
2837
|
-
var css$
|
|
2838
|
+
var css$K = "usa-switch{--usa-sw-c:#34c759;--usa-sw-w:52px;--usa-sw-h:30px;display:inline-flex;align-items:center;gap:8px;cursor:pointer;-webkit-tap-highlight-color:transparent;vertical-align:middle;outline-offset:3px;border-radius:999px}usa-switch[disabled]{opacity:.45;cursor:not-allowed}.usa-sw-track{position:relative;flex:none;width:var(--usa-sw-w);height:var(--usa-sw-h);border-radius:999px;background:rgba(127,127,127,.35);overflow:hidden;transition:background .3s}.usa-sw-fill{position:absolute;inset:0;border-radius:999px;background:var(--usa-sw-c);transform:scale(0);transform-origin:calc(var(--usa-sw-h)/2) 50%;transition:transform .35s cubic-bezier(.4,0,.2,1)}usa-switch[data-on] .usa-sw-fill{transform:scale(1)}.usa-sw-thumb{position:absolute;top:3px;left:3px;width:calc(var(--usa-sw-h) - 6px);height:calc(var(--usa-sw-h) - 6px);border-radius:999px;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:left .32s cubic-bezier(.3,1.25,.5,1),width .2s ease,background .3s,box-shadow .3s}usa-switch[data-on] .usa-sw-thumb{left:calc(var(--usa-sw-w) - var(--usa-sw-h) + 3px)}usa-switch[data-variant=\"ios\"][data-press] .usa-sw-thumb{width:calc(var(--usa-sw-h) + 2px)}usa-switch[data-variant=\"ios\"][data-press][data-on] .usa-sw-thumb{left:calc(var(--usa-sw-w) - var(--usa-sw-h) - 5px)}usa-switch[data-variant=\"daynight\"]{--usa-sw-w:64px;--usa-sw-h:32px}usa-switch[data-variant=\"daynight\"] .usa-sw-track{background:linear-gradient(#7dd3fc,#38bdf8)}usa-switch[data-variant=\"daynight\"] .usa-sw-fill{background:linear-gradient(#1e1b4b,#312e81);transform:none;opacity:0;transition:opacity .45s}usa-switch[data-variant=\"daynight\"][data-on] .usa-sw-fill{opacity:1}usa-switch[data-variant=\"daynight\"] .usa-sw-thumb{background:radial-gradient(circle at 40% 40%,#fde68a,#f59e0b);box-shadow:0 0 10px #fbbf24}usa-switch[data-variant=\"daynight\"][data-on] .usa-sw-thumb{background:radial-gradient(circle at 65% 35%,transparent 5px,#e5e7eb 5.5px);box-shadow:0 0 8px rgba(255,255,255,.5)}usa-switch[data-variant=\"daynight\"] .usa-sw-deco{position:absolute;inset:0;background:radial-gradient(circle,#fff 1px,transparent 1.5px) 12px 8px/14px 11px;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .5s}usa-switch[data-variant=\"daynight\"][data-on] .usa-sw-deco{opacity:.9;transform:none}usa-switch[data-variant=\"bounce\"] .usa-sw-thumb{transition:left .28s cubic-bezier(.5,0,.75,0)}usa-switch[data-variant=\"liquid\"] .usa-sw-fill{background:linear-gradient(90deg,#22d3ee,#7c5cff)}usa-switch[data-variant=\"liquid\"] .usa-sw-thumb{transition:left .5s cubic-bezier(.68,-.4,.27,1.4)}usa-switch:focus-visible .usa-sw-track{box-shadow:0 0 0 3px rgba(124,92,255,.5)}@media (prefers-reduced-motion:reduce){.usa-sw-thumb,.usa-sw-fill,.usa-sw-deco,.usa-sw-track{transition:none!important}}";
|
|
2838
2839
|
|
|
2839
2840
|
const SWITCH_VARIANTS = ['ios', 'daynight', 'bounce', 'liquid'];
|
|
2840
2841
|
function defineSwitch(tag = 'usa-switch') {
|
|
@@ -2922,10 +2923,10 @@ function defineSwitch(tag = 'usa-switch') {
|
|
|
2922
2923
|
}
|
|
2923
2924
|
}
|
|
2924
2925
|
return UsaSwitch;
|
|
2925
|
-
}, { id: 'switch', text: css$
|
|
2926
|
+
}, { id: 'switch', text: css$K });
|
|
2926
2927
|
}
|
|
2927
2928
|
|
|
2928
|
-
var css$
|
|
2929
|
+
var css$J = "usa-kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(140px,1fr);gap:12px;max-width:100%;overflow-x:auto;padding:4px;font:500 13px/1.35 system-ui,sans-serif}.usa-kb-col{display:flex;flex-direction:column;gap:8px;min-height:80px;padding:10px;border-radius:14px;background:rgba(127,127,127,.12);margin:0;list-style:none}.usa-kb-col>h1,.usa-kb-col>h2,.usa-kb-col>h3,.usa-kb-col>h4{margin:0 0 2px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;opacity:.7}.usa-kb-card{padding:10px 12px;border-radius:10px;background:var(--usa-kb-card,#fff);color:#111;box-shadow:0 1px 3px rgba(0,0,0,.14);cursor:grab;touch-action:none;user-select:none;outline-offset:2px}.usa-kb-card:focus-visible{outline:2px solid #7c5cff}.usa-kb-lifted{cursor:grabbing;box-shadow:0 18px 30px -8px rgba(0,0,0,.35);transition:transform .12s}.usa-kb-held{outline:2px dashed #7c5cff;transform:scale(1.03)}.usa-kb-ph{border-radius:10px;border:2px dashed rgba(124,92,255,.5);background:rgba(124,92,255,.08)}.usa-kb-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion:reduce){.usa-kb-lifted,.usa-kb-held{transition:none;transform:none!important}}";
|
|
2929
2930
|
|
|
2930
2931
|
function defineKanban(tag = 'usa-kanban') {
|
|
2931
2932
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3130,10 +3131,10 @@ function defineKanban(tag = 'usa-kanban') {
|
|
|
3130
3131
|
}
|
|
3131
3132
|
}
|
|
3132
3133
|
return UsaKanban;
|
|
3133
|
-
}, { id: 'kanban', text: css$
|
|
3134
|
+
}, { id: 'kanban', text: css$J });
|
|
3134
3135
|
}
|
|
3135
3136
|
|
|
3136
|
-
var css$
|
|
3137
|
+
var css$I = "usa-swipe-deck{position:relative;display:grid;width:var(--usa-sd-w,240px);max-width:100%;height:var(--usa-sd-h,300px);touch-action:pan-y;outline-offset:6px;border-radius:18px}.usa-sd-card{grid-area:1/1;position:relative;display:grid;place-items:center;border-radius:18px;background:var(--usa-sd-bg,linear-gradient(160deg,#7c5cff,#22d3ee));color:#fff;font:800 22px/1.2 system-ui,sans-serif;box-shadow:0 12px 28px -10px rgba(0,0,0,.4);transition:transform .3s cubic-bezier(.3,1.3,.5,1),opacity .3s;user-select:none;cursor:grab;overflow:hidden;touch-action:none}.usa-sd-card.usa-sd-dragging{transition:none;cursor:grabbing}.usa-sd-stamp{position:absolute;top:18px;padding:4px 10px;border:3px solid currentColor;border-radius:8px;font:900 20px/1 system-ui,sans-serif;letter-spacing:.1em;opacity:0;pointer-events:none}.usa-sd-like{left:16px;color:#4ade80;transform:rotate(-14deg)}.usa-sd-nope{right:16px;color:#f87171;transform:rotate(14deg)}@media (prefers-reduced-motion:reduce){.usa-sd-card{transition:none}}";
|
|
3137
3138
|
|
|
3138
3139
|
function defineSwipeDeck(tag = 'usa-swipe-deck') {
|
|
3139
3140
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3275,10 +3276,10 @@ function defineSwipeDeck(tag = 'usa-swipe-deck') {
|
|
|
3275
3276
|
}
|
|
3276
3277
|
}
|
|
3277
3278
|
return UsaSwipeDeck;
|
|
3278
|
-
}, { id: 'swipe-deck', text: css$
|
|
3279
|
+
}, { id: 'swipe-deck', text: css$I });
|
|
3279
3280
|
}
|
|
3280
3281
|
|
|
3281
|
-
var css$
|
|
3282
|
+
var css$H = "usa-weather-card{--usa-wc-sky:linear-gradient(160deg,#38bdf8,#0ea5e9);position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;width:var(--usa-wc-w,260px);max-width:100%;padding:16px 18px;border-radius:20px;background:var(--usa-wc-sky);color:#fff;overflow:hidden;font:500 13px/1.3 system-ui,sans-serif;box-shadow:0 12px 30px -12px rgba(2,6,23,.5);transition:background .6s}usa-weather-card[data-condition=\"cloudy\"]{--usa-wc-sky:linear-gradient(160deg,#94a3b8,#64748b)}usa-weather-card[data-condition=\"rain\"]{--usa-wc-sky:linear-gradient(160deg,#475569,#1e3a8a)}usa-weather-card[data-condition=\"snow\"]{--usa-wc-sky:linear-gradient(160deg,#cbd5e1,#60a5fa);color:#0f172a}usa-weather-card[data-condition=\"storm\"]{--usa-wc-sky:linear-gradient(160deg,#1e293b,#312e81)}usa-weather-card[data-condition=\"fog\"]{--usa-wc-sky:linear-gradient(160deg,#9ca3af,#d1d5db);color:#1f2937}usa-weather-card[data-condition=\"night\"]{--usa-wc-sky:linear-gradient(160deg,#0f172a,#1e1b4b)}.usa-wc-scene{position:relative;width:76px;height:64px}.usa-wc-icon{position:absolute;inset:0}.usa-wc-icon *{position:absolute;display:block}.usa-wc-text{display:flex;flex-direction:column;gap:2px;min-width:0}.usa-wc-temp{font:800 34px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums}.usa-wc-place{opacity:.8;font-size:12px}.usa-wc-sun{left:14px;top:8px;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,#fde047 55%,transparent 56%);animation:usa-wc-spin 14s linear infinite}.usa-wc-sun::before{content:\"\";position:absolute;inset:-8px;border-radius:50%;background:repeating-conic-gradient(#fde047 0 8deg,transparent 8deg 30deg);-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%,#000 70%,transparent 72%);mask:radial-gradient(circle,transparent 58%,#000 60%,#000 70%,transparent 72%)}.usa-wc-moon{left:18px;top:6px;width:40px;height:40px;border-radius:50%;box-shadow:-10px 6px 0 2px #f1f5f9;transform:rotate(-20deg)}.usa-wc-star{width:3px;height:3px;border-radius:50%;background:#fff;left:calc(8px + var(--i) * 14px);top:calc(40px + (var(--i) * 7px) % 20px);animation:usa-wc-tw 1.8s calc(var(--i) * .35s) ease-in-out infinite alternate}.usa-wc-cloud{left:8px;top:14px;width:56px;height:22px;border-radius:12px;background:#f1f5f9;animation:usa-wc-drift 4s ease-in-out infinite alternate}.usa-wc-cloud::before{content:\"\";position:absolute;left:12px;top:-12px;width:26px;height:26px;border-radius:50%;background:inherit}.usa-wc-c2{left:22px;top:6px;transform:scale(.7);opacity:.75;animation-delay:-2s}.usa-wc-dark{background:#94a3b8}.usa-wc-drop{left:calc(16px + var(--i) * 8px);top:38px;width:2px;height:9px;border-radius:2px;background:#bfdbfe;animation:usa-wc-fall .9s calc(var(--i) * .17s) linear infinite}.usa-wc-flake{left:calc(14px + var(--i) * 9px);top:38px;width:6px;height:6px;border-radius:50%;background:#fff;animation:usa-wc-snow 2.4s calc(var(--i) * .4s) linear infinite}.usa-wc-bolt{left:30px;top:30px;width:14px;height:26px;background:#fde047;clip-path:polygon(40% 0,100% 0,60% 45%,100% 45%,20% 100%,40% 55%,0 55%);animation:usa-wc-bolt 4s ease-in-out infinite}.usa-wc-fogband{left:4px;top:calc(14px + var(--i) * 14px);width:66px;height:6px;border-radius:6px;background:rgba(255,255,255,.85);animation:usa-wc-drift calc(3s + var(--i) * .8s) ease-in-out infinite alternate}@keyframes usa-wc-spin{to{transform:rotate(360deg)}}@keyframes usa-wc-tw{from{opacity:.2}to{opacity:1}}@keyframes usa-wc-drift{from{translate:-4px 0}to{translate:6px 0}}@keyframes usa-wc-fall{from{translate:0 0;opacity:1}to{translate:-3px 22px;opacity:0}}@keyframes usa-wc-snow{from{translate:0 0;opacity:1}50%{translate:4px 12px}to{translate:-2px 24px;opacity:0}}@keyframes usa-wc-bolt{0%,86%,100%{opacity:.35}90%{opacity:1}}@media (prefers-reduced-motion:reduce){usa-weather-card *{animation:none!important}}";
|
|
3282
3283
|
|
|
3283
3284
|
const WEATHER_CONDITIONS = ['clear', 'cloudy', 'rain', 'snow', 'storm', 'fog', 'night'];
|
|
3284
3285
|
const LABEL = { clear: 'Clear', cloudy: 'Cloudy', rain: 'Rain', snow: 'Snow', storm: 'Thunderstorm', fog: 'Fog', night: 'Clear night' };
|
|
@@ -3359,10 +3360,10 @@ function defineWeatherCard(tag = 'usa-weather-card') {
|
|
|
3359
3360
|
}
|
|
3360
3361
|
}
|
|
3361
3362
|
return UsaWeatherCard;
|
|
3362
|
-
}, { id: 'weather-card', text: css$
|
|
3363
|
+
}, { id: 'weather-card', text: css$H });
|
|
3363
3364
|
}
|
|
3364
3365
|
|
|
3365
|
-
var css$
|
|
3366
|
+
var css$G = "usa-pull-cord{--usa-pc-color:#cbd5e1;--usa-pc-light:#fde68a;position:relative;display:inline-flex;flex-direction:column;align-items:center;width:90px;height:190px;cursor:pointer;touch-action:none;user-select:none;outline-offset:4px;border-radius:12px}.usa-pc-lamp{position:relative;width:76px;height:38px;border-radius:38px 38px 6px 6px;background:linear-gradient(#475569,#334155);box-shadow:0 0 0 rgba(253,230,138,0);transition:box-shadow .35s,background .35s}.usa-pc-lamp::after{content:\"\";position:absolute;left:50%;bottom:-10px;width:22px;height:12px;margin-left:-11px;border-radius:0 0 12px 12px;background:#64748b;transition:background .35s,box-shadow .35s}usa-pull-cord[data-on] .usa-pc-lamp{background:linear-gradient(#f59e0b,#d97706);box-shadow:0 30px 60px 10px rgba(253,230,138,.55)}usa-pull-cord[data-on] .usa-pc-lamp::after{background:var(--usa-pc-light);box-shadow:0 0 22px 8px var(--usa-pc-light)}.usa-pc-svg{width:80px;height:150px;margin-top:-2px;overflow:visible}.usa-pc-cord{fill:none;stroke:var(--usa-pc-color);stroke-width:2.2;stroke-linecap:round}.usa-pc-knob{fill:#e2e8f0;stroke:#94a3b8;stroke-width:1.5}usa-pull-cord[data-on] .usa-pc-knob{fill:var(--usa-pc-light)}@media (prefers-reduced-motion:reduce){.usa-pc-lamp,.usa-pc-lamp::after{transition:none}}";
|
|
3366
3367
|
|
|
3367
3368
|
function definePullCord(tag = 'usa-pull-cord') {
|
|
3368
3369
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3491,10 +3492,10 @@ function definePullCord(tag = 'usa-pull-cord') {
|
|
|
3491
3492
|
}
|
|
3492
3493
|
}
|
|
3493
3494
|
return UsaPullCord;
|
|
3494
|
-
}, { id: 'pull-cord', text: css$
|
|
3495
|
+
}, { id: 'pull-cord', text: css$G });
|
|
3495
3496
|
}
|
|
3496
3497
|
|
|
3497
|
-
var css$
|
|
3498
|
+
var css$F = "usa-date-picker{--usa-dp-c:#7c5cff;display:inline-block;width:var(--usa-dp-w,280px);max-width:100%;padding:12px;border-radius:16px;background:var(--usa-dp-bg,#fff);color:#111827;box-shadow:0 10px 30px -12px rgba(0,0,0,.3);font:500 13px/1 system-ui,sans-serif;user-select:none}.usa-dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.usa-dp-title{font-weight:700;font-size:14px}.usa-dp-nav{width:30px;height:30px;border:0;border-radius:8px;background:none;color:inherit;font-size:18px;cursor:pointer}.usa-dp-nav:hover{background:rgba(127,127,127,.14)}.usa-dp-viewport{overflow:hidden}.usa-dp-row{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.usa-dp-dow{margin-bottom:4px;font-size:11px;opacity:.55;text-align:center}.usa-dp-day{position:relative;display:grid;place-items:center;aspect-ratio:1;border-radius:50%;cursor:pointer;font-variant-numeric:tabular-nums;outline:none;transition:background .2s,color .2s}.usa-dp-day:hover{background:rgba(124,92,255,.12)}.usa-dp-day[data-out]{opacity:.35}.usa-dp-day[data-today]{box-shadow:inset 0 0 0 1.5px var(--usa-dp-c)}.usa-dp-day[aria-selected=\"true\"]{background:var(--usa-dp-c);color:#fff}.usa-dp-day[aria-disabled]{opacity:.2;cursor:not-allowed;text-decoration:line-through}.usa-dp-day:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--usa-dp-c)}@media (prefers-reduced-motion:reduce){.usa-dp-day{transition:none}}";
|
|
3498
3499
|
|
|
3499
3500
|
const iso = (d) => `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
|
3500
3501
|
/** Parse `YYYY-MM-DD` as a local date (or null). */
|
|
@@ -3643,10 +3644,10 @@ function defineDatePicker(tag = 'usa-date-picker') {
|
|
|
3643
3644
|
}
|
|
3644
3645
|
}
|
|
3645
3646
|
return UsaDatePicker;
|
|
3646
|
-
}, { id: 'date-picker', text: css$
|
|
3647
|
+
}, { id: 'date-picker', text: css$F });
|
|
3647
3648
|
}
|
|
3648
3649
|
|
|
3649
|
-
var css$
|
|
3650
|
+
var css$E = "usa-color-picker{display:inline-flex;flex-direction:column;gap:10px;width:var(--usa-cp-w,240px);max-width:100%;padding:12px;border-radius:16px;background:var(--usa-cp-bg,#fff);box-shadow:0 10px 30px -12px rgba(0,0,0,.3)}.usa-cp-sv{position:relative;height:140px;border-radius:10px;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,hsl(var(--usa-cp-h) 100% 50%));cursor:crosshair;touch-action:none;outline-offset:2px}.usa-cp-thumb{position:absolute;left:var(--usa-cp-x);top:var(--usa-cp-y);width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--usa-cp-color);box-shadow:0 0 0 3px #fff,0 2px 6px rgba(0,0,0,.4);pointer-events:none;transition:left .18s cubic-bezier(.3,1.4,.5,1),top .18s cubic-bezier(.3,1.4,.5,1),transform .2s}[data-drag]>.usa-cp-thumb{transition:none;transform:scale(1.2)}.usa-cp-row{display:flex;align-items:center;gap:10px}.usa-cp-chip{flex:none;width:30px;height:30px;border-radius:50%;background:var(--usa-cp-color);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.usa-cp-hue{position:relative;flex:1;height:14px;border-radius:7px;background:linear-gradient(90deg,red,#ff0,lime,cyan,blue,#f0f,red);cursor:pointer;touch-action:none;outline-offset:2px}.usa-cp-hue .usa-cp-thumb{left:var(--usa-cp-hx);top:50%;background:hsl(var(--usa-cp-h) 100% 50%)}.usa-cp-swatches{display:flex;flex-wrap:wrap;gap:6px}.usa-cp-sw{width:22px;height:22px;border:0;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}.usa-cp-sv:focus-visible,.usa-cp-hue:focus-visible,.usa-cp-sw:focus-visible{outline:2px solid #7c5cff}@media (prefers-reduced-motion:reduce){.usa-cp-thumb{transition:none}}";
|
|
3650
3651
|
|
|
3651
3652
|
/** HSV (h 0–360, s / v 0–1) → `#rrggbb`. */
|
|
3652
3653
|
function hsvToHex(h, s, v) {
|
|
@@ -3766,10 +3767,10 @@ function defineColorPicker(tag = 'usa-color-picker') {
|
|
|
3766
3767
|
}
|
|
3767
3768
|
}
|
|
3768
3769
|
return UsaColorPicker;
|
|
3769
|
-
}, { id: 'color-picker', text: css$
|
|
3770
|
+
}, { id: 'color-picker', text: css$E });
|
|
3770
3771
|
}
|
|
3771
3772
|
|
|
3772
|
-
var css$
|
|
3773
|
+
var css$D = "usa-file-drop{--usa-fd-c:#7c5cff;display:flex;flex-direction:column;gap:10px;width:var(--usa-fd-w,300px);max-width:100%;font:500 13px/1.3 system-ui,sans-serif}.usa-fd-zone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;padding:16px;border-radius:16px;background:rgba(124,92,255,.06);cursor:pointer;text-align:center;outline-offset:3px;transition:background .25s,transform .25s}.usa-fd-ants{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.usa-fd-ants rect{fill:none;stroke:rgba(124,92,255,.55);stroke-width:2;stroke-dasharray:8 6}usa-file-drop[data-over] .usa-fd-zone{background:rgba(124,92,255,.14);transform:scale(1.02)}usa-file-drop[data-over] .usa-fd-ants rect{stroke:var(--usa-fd-c);animation:usa-fd-march .6s linear infinite}.usa-fd-icon{font-size:30px;color:var(--usa-fd-c);transition:transform .3s cubic-bezier(.3,1.5,.5,1)}usa-file-drop[data-over] .usa-fd-icon{transform:translateY(-8px) scale(1.15)}.usa-fd-zone:focus-visible{outline:2px solid var(--usa-fd-c)}.usa-fd-list{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}.usa-fd-item{--usa-fd-p:0;position:relative;display:grid;grid-template-columns:1fr auto 18px;align-items:center;gap:4px 8px;padding:8px 10px;border-radius:10px;background:rgba(127,127,127,.1)}.usa-fd-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.usa-fd-size{opacity:.6;font-size:12px}.usa-fd-bar{grid-column:1/3;height:4px;border-radius:4px;background:rgba(127,127,127,.25);overflow:hidden}.usa-fd-fill{display:block;height:100%;background:var(--usa-fd-c);transform-origin:0 50%;transform:scaleX(var(--usa-fd-p));transition:transform .2s}.usa-fd-check{grid-row:1/3;grid-column:3;width:18px;height:18px;fill:none;stroke:#22c55e;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .4s}.usa-fd-item[data-done] .usa-fd-check{stroke-dashoffset:0}@keyframes usa-fd-march{to{stroke-dashoffset:-14}}@media (prefers-reduced-motion:reduce){usa-file-drop *{animation:none!important;transition:none!important}usa-file-drop[data-over] .usa-fd-zone,usa-file-drop[data-over] .usa-fd-icon{transform:none}}";
|
|
3773
3774
|
|
|
3774
3775
|
const size = (n) => (n < 1024 ? `${n} B` : n < 1048576 ? `${(n / 1024).toFixed(1)} KB` : `${(n / 1048576).toFixed(1)} MB`);
|
|
3775
3776
|
function defineFileDrop(tag = 'usa-file-drop') {
|
|
@@ -3870,10 +3871,10 @@ function defineFileDrop(tag = 'usa-file-drop') {
|
|
|
3870
3871
|
}
|
|
3871
3872
|
}
|
|
3872
3873
|
return UsaFileDrop;
|
|
3873
|
-
}, { id: 'file-drop', text: css$
|
|
3874
|
+
}, { id: 'file-drop', text: css$D });
|
|
3874
3875
|
}
|
|
3875
3876
|
|
|
3876
|
-
var css$
|
|
3877
|
+
var css$C = "usa-keyframe-editor{--usa-ke-c:#7c5cff;--usa-ke-head:100%;display:flex;flex-direction:column;gap:8px;width:var(--usa-ke-w,100%);max-width:100%;padding:10px;border-radius:14px;background:var(--usa-ke-bg,#0f172a);color:#e2e8f0;font:500 12px/1.2 system-ui,sans-serif}.usa-ke-bar{display:flex;align-items:center;gap:8px}.usa-ke-play{width:30px;height:30px;border:0;border-radius:50%;background:var(--usa-ke-c);color:#fff;cursor:pointer}.usa-ke-scrub{flex:1;min-width:0;accent-color:var(--usa-ke-c)}.usa-ke-time{min-width:58px;text-align:right;font-variant-numeric:tabular-nums;opacity:.8}.usa-ke-tracks{position:relative;display:flex;flex-direction:column;gap:4px}.usa-ke-tracks::after{content:\"\";position:absolute;top:0;bottom:0;left:calc(64px + (100% - 64px) * var(--usa-ke-head) / 100%);width:2px;background:#f43f5e;pointer-events:none}.usa-ke-row{display:grid;grid-template-columns:64px 1fr;align-items:center}.usa-ke-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:6px;opacity:.85}.usa-ke-lane{position:relative;height:22px;border-radius:6px;background:rgba(148,163,184,.14)}.usa-ke-clip{position:absolute;top:2px;bottom:2px;border-radius:5px;background:linear-gradient(90deg,var(--usa-ke-c),#22d3ee);cursor:grab;touch-action:none;outline-offset:2px;transition:left .2s,width .2s}.usa-ke-clip[data-drag]{cursor:grabbing;transition:none;box-shadow:0 4px 12px rgba(0,0,0,.4)}.usa-ke-clip:focus-visible{outline:2px solid #fff}.usa-ke-grip{position:absolute;right:0;top:0;bottom:0;width:8px;border-radius:0 5px 5px 0;background:rgba(255,255,255,.35);cursor:ew-resize}@media (prefers-reduced-motion:reduce){.usa-ke-clip{transition:none}}";
|
|
3877
3878
|
|
|
3878
3879
|
const DEFAULT = {
|
|
3879
3880
|
format: player.ANIMATION_FORMAT,
|
|
@@ -4047,10 +4048,10 @@ function defineKeyframeEditor(tag = 'usa-keyframe-editor') {
|
|
|
4047
4048
|
}
|
|
4048
4049
|
}
|
|
4049
4050
|
return UsaKeyframeEditor;
|
|
4050
|
-
}, { id: 'keyframe-editor', text: css$
|
|
4051
|
+
}, { id: 'keyframe-editor', text: css$C });
|
|
4051
4052
|
}
|
|
4052
4053
|
|
|
4053
|
-
var css$
|
|
4054
|
+
var css$B = "usa-music-player{--usa-mp-c:#7c5cff;--usa-mp-p:0;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;width:var(--usa-mp-w,320px);max-width:100%;padding:14px;border-radius:20px;background:var(--usa-mp-bg,linear-gradient(160deg,#111827,#1e1b4b));color:#f8fafc;font:500 13px/1.3 system-ui,sans-serif;box-shadow:0 14px 34px -14px rgba(0,0,0,.55)}.usa-mp-cover{width:84px;height:84px}.usa-mp-disc{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,#0f172a 9%,#e2e8f0 9.5%,#e2e8f0 12%,transparent 12.5%),repeating-radial-gradient(circle,#111 0 2px,#1f2937 2px 4px),#111;background-size:cover;box-shadow:0 6px 18px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.06)}usa-music-player[data-animate] .usa-mp-disc{animation:usa-mp-spin 1.8s linear infinite}.usa-mp-body{display:flex;flex-direction:column;gap:6px;min-width:0}.usa-mp-meta{display:flex;flex-direction:column;min-width:0}.usa-mp-title{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usa-mp-artist{opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usa-mp-bars{display:flex;gap:3px;align-items:flex-end;height:14px}.usa-mp-bars i{width:3px;height:30%;border-radius:2px;background:var(--usa-mp-c);transition:height .3s}usa-music-player[data-animate] .usa-mp-bars i{animation:usa-mp-bar .9s ease-in-out infinite alternate}.usa-mp-bars i:nth-child(2){animation-delay:-.3s!important}.usa-mp-bars i:nth-child(3){animation-delay:-.6s!important}.usa-mp-bars i:nth-child(4){animation-delay:-.15s!important}.usa-mp-track{position:relative;height:6px;border-radius:6px;background:rgba(255,255,255,.18);cursor:pointer;touch-action:none;outline-offset:4px}.usa-mp-fill{position:absolute;inset:0;border-radius:inherit;background:var(--usa-mp-c);transform-origin:0 50%;transform:scaleX(var(--usa-mp-p))}.usa-mp-knob{position:absolute;top:50%;left:calc(var(--usa-mp-p) * 100%);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4);transition:transform .2s}.usa-mp-track:hover .usa-mp-knob,.usa-mp-track:focus-visible .usa-mp-knob{transform:scale(1.3)}.usa-mp-times{display:flex;justify-content:space-between;font-size:11px;opacity:.65;font-variant-numeric:tabular-nums}.usa-mp-ctrls{display:flex;align-items:center;justify-content:center;gap:12px}.usa-mp-btn{border:0;background:none;color:inherit;font-size:16px;cursor:pointer;opacity:.85}.usa-mp-play{position:relative;width:40px;height:40px;border:0;border-radius:50%;background:#fff;cursor:pointer}.usa-mp-icon{position:absolute;left:50%;top:50%;width:14px;height:16px;margin:-8px 0 0 -6px;background:var(--usa-mp-c);clip-path:polygon(0 0,100% 50%,100% 50%,0 100%);transition:clip-path .3s cubic-bezier(.6,.05,.3,1)}usa-music-player[data-playing] .usa-mp-icon{margin-left:-7px;clip-path:polygon(0 0,35% 0,35% 100%,0 100%,0 0,65% 0,100% 0,100% 100%,65% 100%,65% 0)}.usa-mp-btn:focus-visible,.usa-mp-play:focus-visible,.usa-mp-track:focus-visible{outline:2px solid #fff}@keyframes usa-mp-spin{to{transform:rotate(360deg)}}@keyframes usa-mp-bar{from{height:20%}to{height:100%}}@media (prefers-reduced-motion:reduce){usa-music-player *{animation:none!important;transition:none!important}}";
|
|
4054
4055
|
|
|
4055
4056
|
const fmt = (s) => `${Math.floor(s / 60)}:${String(Math.floor(s % 60)).padStart(2, '0')}`;
|
|
4056
4057
|
function defineMusicPlayer(tag = 'usa-music-player') {
|
|
@@ -4211,10 +4212,10 @@ function defineMusicPlayer(tag = 'usa-music-player') {
|
|
|
4211
4212
|
}
|
|
4212
4213
|
}
|
|
4213
4214
|
return UsaMusicPlayer;
|
|
4214
|
-
}, { id: 'music-player', text: css$
|
|
4215
|
+
}, { id: 'music-player', text: css$B });
|
|
4215
4216
|
}
|
|
4216
4217
|
|
|
4217
|
-
var css$
|
|
4218
|
+
var css$A = "usa-volume-knob{--usa-vk-c:#22d3ee;--usa-vk-size:120px;position:relative;display:inline-grid;place-items:center;width:var(--usa-vk-size);height:var(--usa-vk-size);border-radius:50%;cursor:ns-resize;touch-action:none;user-select:none;outline-offset:6px}.usa-vk-arc{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.usa-vk-arc path{fill:none;stroke-width:6;stroke-linecap:round}.usa-vk-bg{stroke:rgba(127,127,127,.25)}.usa-vk-val{stroke:var(--usa-vk-c);filter:drop-shadow(0 0 4px var(--usa-vk-c))}.usa-vk-ticks{position:absolute;inset:0}.usa-vk-ticks i{position:absolute;left:50%;top:50%;width:3px;height:3px;margin:-1.5px;border-radius:50%;background:rgba(127,127,127,.4);transform:rotate(var(--a)) translateY(calc(var(--usa-vk-size) * -.5 + 2px));transition:background .2s,box-shadow .2s}.usa-vk-ticks i[data-on]{background:var(--usa-vk-c);box-shadow:0 0 6px var(--usa-vk-c)}.usa-vk-cap{position:relative;width:62%;height:62%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4b5563,#111827 70%);box-shadow:0 8px 16px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.15);transform:rotate(var(--usa-vk-angle));transition:transform .35s cubic-bezier(.3,1.5,.5,1)}usa-volume-knob[data-drag] .usa-vk-cap{transition:none}.usa-vk-dot{position:absolute;left:50%;top:10%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--usa-vk-c);box-shadow:0 0 6px var(--usa-vk-c)}usa-volume-knob:focus-visible{outline:2px solid var(--usa-vk-c)}@media (prefers-reduced-motion:reduce){.usa-vk-cap,.usa-vk-ticks i{transition:none}}";
|
|
4218
4219
|
|
|
4219
4220
|
const ARC = 270;
|
|
4220
4221
|
function defineVolumeKnob(tag = 'usa-volume-knob') {
|
|
@@ -4305,10 +4306,10 @@ function defineVolumeKnob(tag = 'usa-volume-knob') {
|
|
|
4305
4306
|
}
|
|
4306
4307
|
}
|
|
4307
4308
|
return UsaVolumeKnob;
|
|
4308
|
-
}, { id: 'volume-knob', text: css$
|
|
4309
|
+
}, { id: 'volume-knob', text: css$A });
|
|
4309
4310
|
}
|
|
4310
4311
|
|
|
4311
|
-
var css$
|
|
4312
|
+
var css$z = "usa-equalizer{--usa-eq-c:#7c5cff;position:relative;display:block;width:var(--usa-eq-w,320px);max-width:100%;padding:12px 10px 8px;border-radius:16px;background:var(--usa-eq-bg,#0f172a);color:#cbd5e1;font:600 10px/1 system-ui,sans-serif}.usa-eq-curve{position:absolute;left:10px;right:10px;top:12px;height:120px;width:calc(100% - 20px);pointer-events:none;overflow:visible}.usa-eq-curve path{fill:none;stroke:#22d3ee;stroke-width:1.6;vector-effect:non-scaling-stroke;opacity:.8;transition:d .45s cubic-bezier(.3,1.3,.5,1)}.usa-eq-bands{display:flex;justify-content:space-between;gap:4px}.usa-eq-band{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;min-width:0}.usa-eq-slot{--usa-eq-k:.5;position:relative;width:8px;height:120px;border-radius:6px;background:rgba(148,163,184,.18);cursor:ns-resize;touch-action:none;outline-offset:4px}.usa-eq-fill{position:absolute;left:0;right:0;top:calc((1 - max(var(--usa-eq-k),.5)) * 100%);bottom:calc(min(var(--usa-eq-k),.5) * 100%);border-radius:6px;background:var(--usa-eq-c)}.usa-eq-cap{position:absolute;left:50%;top:calc((1 - var(--usa-eq-k)) * 100%);width:20px;height:10px;margin:-5px 0 0 -10px;border-radius:4px;background:#f8fafc;box-shadow:0 2px 6px rgba(0,0,0,.5)}usa-equalizer[data-glide] .usa-eq-cap{transition:top .5s cubic-bezier(.3,1.4,.5,1)}usa-equalizer[data-glide] .usa-eq-fill{transition:top .5s cubic-bezier(.3,1.4,.5,1),bottom .5s cubic-bezier(.3,1.4,.5,1)}.usa-eq-slot[data-drag] .usa-eq-cap{transform:scale(1.15)}.usa-eq-slot:focus-visible{outline:2px solid #22d3ee}.usa-eq-label{opacity:.7;white-space:nowrap}@media (prefers-reduced-motion:reduce){.usa-eq-cap,.usa-eq-fill,.usa-eq-curve path{transition:none!important}}";
|
|
4312
4313
|
|
|
4313
4314
|
const EQ_PRESETS = {
|
|
4314
4315
|
flat: [0, 0, 0, 0, 0, 0, 0],
|
|
@@ -4406,10 +4407,10 @@ function defineEqualizer(tag = 'usa-equalizer') {
|
|
|
4406
4407
|
}
|
|
4407
4408
|
}
|
|
4408
4409
|
return UsaEqualizer;
|
|
4409
|
-
}, { id: 'equalizer', text: css$
|
|
4410
|
+
}, { id: 'equalizer', text: css$z });
|
|
4410
4411
|
}
|
|
4411
4412
|
|
|
4412
|
-
var css$
|
|
4413
|
+
var css$y = "usa-lyrics{--usa-ly-c:#f472b6;display:block;width:var(--usa-ly-w,320px);max-width:100%;font:700 18px/1.35 system-ui,sans-serif}.usa-ly-list{height:var(--usa-ly-h,180px);margin:0;padding:70px 0;overflow-y:auto;list-style:none;scrollbar-width:none;-webkit-mask:linear-gradient(transparent,#000 25%,#000 75%,transparent);mask:linear-gradient(transparent,#000 25%,#000 75%,transparent)}.usa-ly-list::-webkit-scrollbar{display:none}.usa-ly-line{--usa-ly-k:0;padding:5px 4px;opacity:.38;cursor:pointer;transform-origin:0 50%;transition:opacity .35s,transform .35s cubic-bezier(.3,1.3,.5,1),filter .35s;filter:blur(.4px)}.usa-ly-line[data-past]{opacity:.22}.usa-ly-line[data-active]{opacity:1;filter:none;transform:scale(1.06);color:transparent;background:linear-gradient(90deg,var(--usa-ly-c) calc(var(--usa-ly-k) * 100%),var(--usa-ly-base,#94a3b8) calc(var(--usa-ly-k) * 100%));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 18px rgba(244,114,182,.25)}@media (prefers-reduced-motion:reduce){.usa-ly-line{transition:none;transform:none!important}}";
|
|
4413
4414
|
|
|
4414
4415
|
/** Parse LRC text into sorted `{ t, text }` lines. */
|
|
4415
4416
|
function parseLRC(src) {
|
|
@@ -4521,10 +4522,10 @@ function defineLyrics(tag = 'usa-lyrics') {
|
|
|
4521
4522
|
}
|
|
4522
4523
|
}
|
|
4523
4524
|
return UsaLyrics;
|
|
4524
|
-
}, { id: 'lyrics', text: css$
|
|
4525
|
+
}, { id: 'lyrics', text: css$y });
|
|
4525
4526
|
}
|
|
4526
4527
|
|
|
4527
|
-
var css$
|
|
4528
|
+
var css$x = "usa-bar-chart{--usa-bc-c:#7c5cff;display:block;width:var(--usa-bc-w,100%);max-width:100%;font:600 11px/1.2 system-ui,sans-serif}.usa-bc-list{display:flex;align-items:flex-end;gap:8px;height:var(--usa-bc-h,140px);margin:0;padding:0;list-style:none}.usa-bc-item{display:grid;grid-template-rows:auto 1fr auto;justify-items:center;flex:1;min-width:0;height:100%;gap:4px}.usa-bc-track{position:relative;grid-row:2;width:100%;display:flex;align-items:flex-end;justify-content:center}.usa-bc-bar{display:block;width:min(100%,38px);height:calc(var(--usa-bc-k) * 100%);border-radius:6px 6px 2px 2px;background:linear-gradient(var(--usa-bc-c),#22d3ee);transform-origin:50% 100%}.usa-bc-item[data-glide] .usa-bc-bar{transition:height .6s cubic-bezier(.3,1.25,.5,1)}.usa-bc-val{grid-row:1;font-variant-numeric:tabular-nums;opacity:.8}.usa-bc-label{grid-row:3;opacity:.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}usa-bar-chart[data-dir=\"h\"] .usa-bc-list{flex-direction:column;align-items:stretch;height:auto}usa-bar-chart[data-dir=\"h\"] .usa-bc-item{grid-template-columns:70px 1fr auto;grid-template-rows:none;align-items:center;height:22px}usa-bar-chart[data-dir=\"h\"] .usa-bc-label{grid-row:auto;grid-column:1;justify-self:start}usa-bar-chart[data-dir=\"h\"] .usa-bc-track{grid-row:auto;grid-column:2;height:100%;justify-content:flex-start;align-items:center}usa-bar-chart[data-dir=\"h\"] .usa-bc-bar{width:calc(var(--usa-bc-k) * 100%);height:14px;border-radius:2px 6px 6px 2px;transform-origin:0 50%;background:linear-gradient(90deg,var(--usa-bc-c),#22d3ee)}usa-bar-chart[data-dir=\"h\"] .usa-bc-item[data-glide] .usa-bc-bar{transition:width .6s cubic-bezier(.3,1.25,.5,1)}usa-bar-chart[data-dir=\"h\"] .usa-bc-val{grid-row:auto;grid-column:3}@media (prefers-reduced-motion:reduce){.usa-bc-bar{transition:none!important}}";
|
|
4528
4529
|
|
|
4529
4530
|
function defineBarChart(tag = 'usa-bar-chart') {
|
|
4530
4531
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4618,10 +4619,10 @@ function defineBarChart(tag = 'usa-bar-chart') {
|
|
|
4618
4619
|
}
|
|
4619
4620
|
}
|
|
4620
4621
|
return UsaBarChart;
|
|
4621
|
-
}, { id: 'bar-chart', text: css$
|
|
4622
|
+
}, { id: 'bar-chart', text: css$x });
|
|
4622
4623
|
}
|
|
4623
4624
|
|
|
4624
|
-
var css$
|
|
4625
|
+
var css$w = "usa-gauge{--usa-gg-c:#7c5cff;--usa-gg-k:0;position:relative;display:inline-block;width:var(--usa-gg-w,220px);max-width:100%;font:600 12px/1.2 system-ui,sans-serif;text-align:center}.usa-gg-svg{display:block;width:100%;height:auto;overflow:visible}.usa-gg-track,.usa-gg-arc{fill:none;stroke-width:16;stroke-linecap:round}.usa-gg-track{stroke:rgba(127,127,127,.2)}.usa-gg-arc{stroke:var(--usa-gg-c);stroke-dasharray:calc(max(var(--usa-gg-k),0) * 100) 100;transition:stroke .3s}.usa-gg-needle{transform-origin:100px 100px;transform:rotate(var(--usa-gg-angle,-90deg));fill:currentColor}.usa-gg-read{position:absolute;left:0;right:0;bottom:2px;display:flex;flex-direction:column;align-items:center;pointer-events:none}.usa-gg-num{font:800 22px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums;transform:translateY(-34px)}.usa-gg-label{opacity:.65;transform:translateY(-34px)}";
|
|
4625
4626
|
|
|
4626
4627
|
function defineGauge(tag = 'usa-gauge') {
|
|
4627
4628
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4706,10 +4707,10 @@ function defineGauge(tag = 'usa-gauge') {
|
|
|
4706
4707
|
}
|
|
4707
4708
|
}
|
|
4708
4709
|
return UsaGauge;
|
|
4709
|
-
}, { id: 'gauge', text: css$
|
|
4710
|
+
}, { id: 'gauge', text: css$w });
|
|
4710
4711
|
}
|
|
4711
4712
|
|
|
4712
|
-
var css$
|
|
4713
|
+
var css$v = "usa-sparkline{--usa-sl-c:#7c5cff;position:relative;display:inline-block;width:var(--usa-sl-w,120px);height:var(--usa-sl-h,32px);vertical-align:middle}.usa-sl-svg{display:block;width:100%;height:100%;overflow:visible}.usa-sl-line{fill:none;stroke:var(--usa-sl-c);stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1}.usa-sl-area{fill:var(--usa-sl-c);opacity:0}usa-sparkline[data-variant=\"area\"] .usa-sl-area{opacity:.16;transition:opacity .8s .4s}.usa-sl-bars rect{fill:var(--usa-sl-c);opacity:.75}usa-sparkline:not([data-variant=\"bars\"]) .usa-sl-bars,usa-sparkline[data-variant=\"bars\"] .usa-sl-line,usa-sparkline[data-variant=\"bars\"] .usa-sl-end{display:none}.usa-sl-end{fill:var(--usa-sl-c);vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;animation:usa-sl-pulse 1.8s ease-out infinite}.usa-sl-hover{fill:#fff;stroke:var(--usa-sl-c);stroke-width:1.5;vector-effect:non-scaling-stroke;opacity:0}usa-sparkline[data-hover] .usa-sl-hover{opacity:1}.usa-sl-tip{position:absolute;bottom:calc(100% + 4px);transform:translateX(-50%);padding:2px 6px;border-radius:5px;background:#111827;color:#fff;font:600 11px/1.3 system-ui,sans-serif;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s}usa-sparkline[data-hover] .usa-sl-tip{opacity:1}@keyframes usa-sl-pulse{0%{opacity:1;transform:scale(1)}70%{opacity:.4;transform:scale(1.8)}100%{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.usa-sl-end{animation:none}}";
|
|
4713
4714
|
|
|
4714
4715
|
const SPARK_VARIANTS = ['line', 'area', 'bars'];
|
|
4715
4716
|
/** Map values to SVG points in a w×h box (with padding). */
|
|
@@ -4832,7 +4833,7 @@ function defineSparkline(tag = 'usa-sparkline') {
|
|
|
4832
4833
|
}
|
|
4833
4834
|
}
|
|
4834
4835
|
return UsaSparkline;
|
|
4835
|
-
}, { id: 'sparkline', text: css$
|
|
4836
|
+
}, { id: 'sparkline', text: css$v });
|
|
4836
4837
|
}
|
|
4837
4838
|
|
|
4838
4839
|
/** Parse a figure like "$12.4k" / "−3.5%" / "1,204" → number + prefix / suffix / decimals (7.2). */
|
|
@@ -4845,7 +4846,7 @@ function parseFigureText(s) {
|
|
|
4845
4846
|
return Number.isFinite(n) ? { n, pre: m[1], post: m[3], dec: (raw.split('.')[1] || '').length } : null;
|
|
4846
4847
|
}
|
|
4847
4848
|
|
|
4848
|
-
var css$
|
|
4849
|
+
var css$u = "usa-kpi{display:inline-grid;grid-template-columns:1fr auto;grid-template-areas:\"label label\" \"value delta\" \"trend trend\" \"caption caption\";align-items:end;gap:4px 10px;width:var(--usa-kpi-w,220px);max-width:100%;padding:14px 16px;border-radius:16px;background:var(--usa-kpi-bg,#fff);color:#0f172a;box-shadow:0 8px 24px -12px rgba(15,23,42,.35);font:500 12px/1.3 system-ui,sans-serif}.usa-kpi-label{grid-area:label;opacity:.6;text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:700}.usa-kpi-value{grid-area:value;font:800 28px/1.05 system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}.usa-kpi-delta{grid-area:delta;display:inline-flex;align-items:center;gap:3px;padding:3px 7px;border-radius:999px;font-weight:700;font-size:12px;margin-bottom:4px}.usa-kpi-delta[data-good=\"true\"]{background:rgba(34,197,94,.14);color:#15803d}.usa-kpi-delta[data-good=\"false\"]{background:rgba(239,68,68,.14);color:#b91c1c}.usa-kpi-delta i{font-style:normal;font-size:9px}.usa-kpi-trend{grid-area:trend;--usa-sl-w:100%;--usa-sl-h:34px;margin-top:4px}.usa-kpi-caption{grid-area:caption;opacity:.55;font-size:11px}.usa-kpi-caption:empty{display:none}";
|
|
4849
4850
|
|
|
4850
4851
|
function defineKpi(tag = 'usa-kpi') {
|
|
4851
4852
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4925,10 +4926,10 @@ function defineKpi(tag = 'usa-kpi') {
|
|
|
4925
4926
|
}
|
|
4926
4927
|
}
|
|
4927
4928
|
return UsaKpi;
|
|
4928
|
-
}, { id: 'kpi', text: css$
|
|
4929
|
+
}, { id: 'kpi', text: css$u });
|
|
4929
4930
|
}
|
|
4930
4931
|
|
|
4931
|
-
var css$
|
|
4932
|
+
var css$t = "usa-add-to-cart{display:inline-block}.usa-atc-btn{position:relative;display:inline-grid;place-items:center;min-width:var(--usa-atc-w,150px);padding:11px 18px;border:0;border-radius:999px;background:var(--usa-atc-bg,#7c5cff);color:#fff;font:700 14px/1 system-ui,sans-serif;cursor:pointer;overflow:hidden;transition:background .3s}.usa-atc-btn>span{grid-area:1/1;transition:transform .35s cubic-bezier(.3,1.4,.5,1),opacity .25s}.usa-atc-done{transform:translateY(120%);opacity:0}usa-add-to-cart[data-added] .usa-atc-btn{background:var(--usa-atc-ok,#16a34a)}usa-add-to-cart[data-added] .usa-atc-label{transform:translateY(-120%);opacity:0}usa-add-to-cart[data-added] .usa-atc-done{transform:none;opacity:1}.usa-atc-btn:focus-visible{outline:3px solid #a78bfa;outline-offset:2px}.usa-atc-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media (prefers-reduced-motion:reduce){.usa-atc-btn>span{transition:none}}";
|
|
4932
4933
|
|
|
4933
4934
|
function defineAddToCart(tag = 'usa-add-to-cart') {
|
|
4934
4935
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4973,10 +4974,10 @@ function defineAddToCart(tag = 'usa-add-to-cart') {
|
|
|
4973
4974
|
}
|
|
4974
4975
|
}
|
|
4975
4976
|
return UsaAddToCart;
|
|
4976
|
-
}, { id: 'add-to-cart', text: css$
|
|
4977
|
+
}, { id: 'add-to-cart', text: css$t });
|
|
4977
4978
|
}
|
|
4978
4979
|
|
|
4979
|
-
var css$
|
|
4980
|
+
var css$s = "usa-cart-drawer{position:relative;display:inline-block;font:500 13px/1.3 system-ui,sans-serif}.usa-cd2-toggle{position:relative;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--usa-cd2-btn,#f1f5f9);font-size:20px;cursor:pointer}.usa-cd2-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font:800 11px/18px system-ui,sans-serif;text-align:center}.usa-cd2-badge:empty{display:none}.usa-cd2-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.35);z-index:2147482000}.usa-cd2-panel{position:fixed;top:0;right:0;bottom:0;width:min(var(--usa-cd2-w,340px),92vw);display:flex;flex-direction:column;background:var(--usa-cd2-bg,#fff);color:#0f172a;box-shadow:-12px 0 40px -12px rgba(15,23,42,.4);z-index:2147482001;outline:none}.usa-cd2-panel header,.usa-cd2-panel footer{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid rgba(15,23,42,.08)}.usa-cd2-panel footer{border:0;border-top:1px solid rgba(15,23,42,.08);margin-top:auto;font-size:15px}.usa-cd2-close,.usa-cd2-rm{border:0;background:none;font-size:20px;line-height:1;cursor:pointer;color:inherit;opacity:.6}.usa-cd2-list{margin:0;padding:6px 8px;list-style:none;overflow:auto}.usa-cd2-item{display:grid;grid-template-columns:36px 1fr auto auto auto;align-items:center;gap:8px;padding:8px;border-radius:10px;overflow:hidden}.usa-cd2-item img,.usa-cd2-item i{width:36px;height:36px;border-radius:8px;object-fit:cover;background:linear-gradient(135deg,#a78bfa,#22d3ee)}.usa-cd2-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.usa-cd2-qty{opacity:.6}.usa-cd2-price,.usa-cd2-total{font-variant-numeric:tabular-nums;font-weight:700}.usa-cd2-empty{margin:24px;text-align:center;opacity:.55}.usa-cd2-panel[hidden],.usa-cd2-backdrop[hidden]{display:none}";
|
|
4980
4981
|
|
|
4981
4982
|
/** Cart total (7.3). */
|
|
4982
4983
|
const cartTotal = (items) => Math.round(items.reduce((a, i) => a + (Number(i.price) || 0) * (i.qty || 1), 0) * 100) / 100;
|
|
@@ -5141,10 +5142,10 @@ function defineCartDrawer(tag = 'usa-cart-drawer') {
|
|
|
5141
5142
|
}
|
|
5142
5143
|
}
|
|
5143
5144
|
return UsaCartDrawer;
|
|
5144
|
-
}, { id: 'cart-drawer', text: css$
|
|
5145
|
+
}, { id: 'cart-drawer', text: css$s });
|
|
5145
5146
|
}
|
|
5146
5147
|
|
|
5147
|
-
var css$
|
|
5148
|
+
var css$r = "usa-product-gallery{display:grid;gap:10px;width:var(--usa-pg2-w,320px);max-width:100%}.usa-pg2-stage{position:relative;aspect-ratio:var(--usa-pg2-ratio,1);border-radius:14px;overflow:hidden;background:#f1f5f9;cursor:zoom-in;outline:none}.usa-pg2-stage:focus-visible{box-shadow:0 0 0 3px #a78bfa}.usa-pg2-main{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease-out}.usa-pg2-thumbs{position:relative;display:flex;gap:8px;overflow-x:auto;padding:3px}.usa-pg2-thumb{flex:0 0 auto;width:var(--usa-pg2-t,56px);height:var(--usa-pg2-t,56px);padding:0;border:0;border-radius:10px;overflow:hidden;background:#e2e8f0;cursor:pointer;opacity:.65;transition:opacity .2s}.usa-pg2-thumb[aria-selected=true]{opacity:1}.usa-pg2-thumb img{width:100%;height:100%;object-fit:cover;display:block}.usa-pg2-thumb:focus-visible{outline:2px solid #7c5cff;outline-offset:2px}.usa-pg2-ring{position:absolute;left:0;top:3px;height:var(--usa-pg2-t,56px);border-radius:10px;box-shadow:0 0 0 2px var(--usa-pg2-accent,#7c5cff);pointer-events:none;transition:transform .35s cubic-bezier(.3,1.3,.5,1),width .35s}@media (prefers-reduced-motion:reduce){.usa-pg2-ring,.usa-pg2-main{transition:none}}";
|
|
5148
5149
|
|
|
5149
5150
|
/** Wrap an index into 0..n-1 (7.3). */
|
|
5150
5151
|
const wrapIndex = (i, n) => (n ? ((i % n) + n) % n : 0);
|
|
@@ -5258,10 +5259,10 @@ function defineProductGallery(tag = 'usa-product-gallery') {
|
|
|
5258
5259
|
}
|
|
5259
5260
|
}
|
|
5260
5261
|
return UsaProductGallery;
|
|
5261
|
-
}, { id: 'product-gallery', text: css$
|
|
5262
|
+
}, { id: 'product-gallery', text: css$r });
|
|
5262
5263
|
}
|
|
5263
5264
|
|
|
5264
|
-
var css$
|
|
5265
|
+
var css$q = "usa-countdown{display:inline-block;font:700 12px/1.2 system-ui,sans-serif;color:var(--usa-cd-fg,inherit)}.usa-cd-row{display:flex;gap:var(--usa-cd-gap,10px)}.usa-cd-unit{display:flex;flex-direction:column;align-items:center;gap:4px}.usa-cd-unit small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;opacity:.6}.usa-cd-digits{display:flex;gap:3px;perspective:300px}.usa-cd-d{display:grid;place-items:center;width:var(--usa-cd-w,28px);height:calc(var(--usa-cd-w,28px) * 1.35);border-radius:6px;background:var(--usa-cd-bg,#111827);color:var(--usa-cd-c,#fff);font:800 calc(var(--usa-cd-w,28px) * .8)/1 ui-monospace,monospace;box-shadow:inset 0 -1px 0 rgba(255,255,255,.08),0 4px 10px -4px rgba(0,0,0,.5);background-image:linear-gradient(transparent 49%,rgba(0,0,0,.35) 50%,transparent 51%);transform-origin:50% 50%}usa-countdown[data-done] .usa-cd-d{background-color:var(--usa-cd-done,#ef4444)}";
|
|
5265
5266
|
|
|
5266
5267
|
/** Split seconds into d/h/m/s (7.3). */
|
|
5267
5268
|
function splitTime(sec) {
|
|
@@ -5349,10 +5350,10 @@ function defineCountdown(tag = 'usa-countdown') {
|
|
|
5349
5350
|
}
|
|
5350
5351
|
}
|
|
5351
5352
|
return UsaCountdown;
|
|
5352
|
-
}, { id: 'countdown', text: css$
|
|
5353
|
+
}, { id: 'countdown', text: css$q });
|
|
5353
5354
|
}
|
|
5354
5355
|
|
|
5355
|
-
var css$
|
|
5356
|
+
var css$p = "usa-message-list{position:relative;display:block;width:var(--usa-ml-w,320px);max-width:100%;font:400 14px/1.35 system-ui,sans-serif}.usa-ml-list{display:flex;flex-direction:column;gap:6px;height:var(--usa-ml-h,260px);margin:0;padding:10px;list-style:none;overflow-y:auto;overscroll-behavior:contain;border-radius:14px;background:var(--usa-ml-bg,#f8fafc)}.usa-ml-msg{display:flex;flex-direction:column;align-items:flex-start;max-width:80%}.usa-ml-msg[data-side=right]{align-self:flex-end;align-items:flex-end}.usa-ml-msg[data-grouped] .usa-ml-from{display:none}.usa-ml-from{font-size:11px;font-weight:600;opacity:.6;margin:2px 8px}.usa-ml-from:empty,.usa-ml-time:empty{display:none}.usa-ml-bubble{padding:8px 12px;border-radius:16px 16px 16px 4px;background:var(--usa-ml-them,#e2e8f0);color:#0f172a;overflow-wrap:anywhere}.usa-ml-msg[data-side=right] .usa-ml-bubble{border-radius:16px 16px 4px 16px;background:var(--usa-ml-me,#7c5cff);color:#fff}.usa-ml-time{font-size:10px;opacity:.5;margin:2px 8px}.usa-ml-typing .usa-ml-bubble{display:inline-flex;gap:4px;padding:11px 12px}.usa-ml-typing i{width:7px;height:7px;border-radius:50%;background:#64748b;animation:usa-ml-dot 1.1s infinite}.usa-ml-typing i:nth-child(2){animation-delay:.18s}.usa-ml-typing i:nth-child(3){animation-delay:.36s}@keyframes usa-ml-dot{0%,60%,100%{transform:none;opacity:.4}30%{transform:translateY(-5px);opacity:1}}.usa-ml-new{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);border:0;border-radius:999px;padding:6px 12px;background:#0f172a;color:#fff;font:600 12px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 6px 16px -6px rgba(0,0,0,.5)}.usa-ml-new[hidden]{display:none}@media (prefers-reduced-motion:reduce){.usa-ml-typing i{animation:none}}";
|
|
5356
5357
|
|
|
5357
5358
|
function defineMessageList(tag = 'usa-message-list') {
|
|
5358
5359
|
return base.defineElement(tag, (Base) => {
|
|
@@ -5439,10 +5440,10 @@ function defineMessageList(tag = 'usa-message-list') {
|
|
|
5439
5440
|
}
|
|
5440
5441
|
}
|
|
5441
5442
|
return UsaMessageList;
|
|
5442
|
-
}, { id: 'message-list', text: css$
|
|
5443
|
+
}, { id: 'message-list', text: css$p });
|
|
5443
5444
|
}
|
|
5444
5445
|
|
|
5445
|
-
var css$
|
|
5446
|
+
var css$o = "usa-reactions{position:relative;display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;font:600 13px/1 system-ui,sans-serif}.usa-rx-row{display:inline-flex;flex-wrap:wrap;gap:6px}.usa-rx-pill,.usa-rx-add{position:relative;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border:1px solid rgba(15,23,42,.12);border-radius:999px;background:var(--usa-rx-bg,#fff);color:inherit;font:inherit;cursor:pointer}.usa-rx-pill[hidden]{display:none}.usa-rx-pill[aria-pressed=true]{border-color:var(--usa-rx-accent,#7c5cff);background:color-mix(in srgb,var(--usa-rx-accent,#7c5cff) 14%,#fff)}.usa-rx-emo{display:inline-block;font-size:15px}.usa-rx-n{display:inline-block;min-width:1ch;font-variant-numeric:tabular-nums}.usa-rx-float{position:absolute;left:50%;top:0;font-size:16px;pointer-events:none}.usa-rx-picker{position:absolute;bottom:calc(100% + 6px);left:0;display:flex;gap:2px;padding:4px;border-radius:999px;background:#fff;box-shadow:0 10px 30px -10px rgba(15,23,42,.45);transform-origin:20% 100%;z-index:5}.usa-rx-picker[hidden]{display:none}.usa-rx-picker button{border:0;background:none;font-size:20px;width:32px;height:32px;border-radius:50%;cursor:pointer}.usa-rx-picker button:hover,.usa-rx-picker button:focus-visible{background:#f1f5f9}.usa-rx-pill:focus-visible,.usa-rx-add:focus-visible{outline:2px solid #7c5cff;outline-offset:2px}";
|
|
5446
5447
|
|
|
5447
5448
|
/** Parse "👍,❤️" + "3,1" into ordered [emoji, count] pairs (7.4). */
|
|
5448
5449
|
function parseReactions(emojis, counts = '') {
|
|
@@ -5544,10 +5545,10 @@ function defineReactions(tag = 'usa-reactions') {
|
|
|
5544
5545
|
}
|
|
5545
5546
|
}
|
|
5546
5547
|
return UsaReactions;
|
|
5547
|
-
}, { id: 'reactions', text: css$
|
|
5548
|
+
}, { id: 'reactions', text: css$o });
|
|
5548
5549
|
}
|
|
5549
5550
|
|
|
5550
|
-
var css$
|
|
5551
|
+
var css$n = "usa-notification-bell{position:relative;display:inline-block;font:400 13px/1.35 system-ui,sans-serif}.usa-nb-btn{position:relative;display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:50%;background:var(--usa-nb-bg,#f1f5f9);color:var(--usa-nb-fg,#0f172a);cursor:pointer}.usa-nb-bell{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transform-origin:50% 12%}.usa-nb-badge{position:absolute;top:2px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#ef4444;color:#fff;font:800 10px/17px system-ui,sans-serif;text-align:center}.usa-nb-badge:empty{display:none}.usa-nb-panel{position:absolute;top:calc(100% + 8px);right:0;width:min(280px,86vw);border-radius:14px;background:#fff;color:#0f172a;box-shadow:0 18px 40px -14px rgba(15,23,42,.45);overflow:hidden;z-index:20;transform-origin:90% 0}.usa-nb-panel[hidden]{display:none}.usa-nb-panel header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid rgba(15,23,42,.08)}.usa-nb-read{border:0;background:none;color:#7c5cff;font:600 12px/1 system-ui,sans-serif;cursor:pointer}.usa-nb-list{max-height:220px;margin:0;padding:4px;list-style:none;overflow:auto}.usa-nb-item{display:flex;justify-content:space-between;gap:8px;padding:8px;border-radius:8px}.usa-nb-item[data-unread]{background:#f5f3ff;font-weight:600}.usa-nb-item[data-unread]::before{content:\"\";flex:0 0 7px;height:7px;margin-top:6px;border-radius:50%;background:#7c5cff}.usa-nb-item time{opacity:.5;font-size:11px;white-space:nowrap}.usa-nb-text{flex:1;min-width:0}.usa-nb-empty{margin:16px;text-align:center;opacity:.55}.usa-nb-btn:focus-visible,.usa-nb-read:focus-visible{outline:2px solid #7c5cff;outline-offset:2px}";
|
|
5551
5552
|
|
|
5552
5553
|
function defineNotificationBell(tag = 'usa-notification-bell') {
|
|
5553
5554
|
return base.defineElement(tag, (Base) => {
|
|
@@ -5642,10 +5643,10 @@ function defineNotificationBell(tag = 'usa-notification-bell') {
|
|
|
5642
5643
|
}
|
|
5643
5644
|
}
|
|
5644
5645
|
return UsaNotificationBell;
|
|
5645
|
-
}, { id: 'notification-bell', text: css$
|
|
5646
|
+
}, { id: 'notification-bell', text: css$n });
|
|
5646
5647
|
}
|
|
5647
5648
|
|
|
5648
|
-
var css$
|
|
5649
|
+
var css$m = "usa-presence{--s:var(--usa-pr2-size,48px);position:relative;display:inline-grid;place-items:center;width:var(--s);height:var(--s);vertical-align:middle}.usa-pr2-face{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#a78bfa,#22d3ee);color:#fff;font:700 calc(var(--s) * .36)/1 system-ui,sans-serif}.usa-pr2-face img{width:100%;height:100%;object-fit:cover}.usa-pr2-dot,.usa-pr2-ripple{position:absolute;right:0;bottom:0;width:calc(var(--s) * .28);height:calc(var(--s) * .28);border-radius:50%;box-sizing:border-box}.usa-pr2-dot{border:2px solid var(--usa-pr2-ring,#fff);background:#94a3b8;transition:background-color .3s}.usa-pr2-ripple{background:#22c55e;pointer-events:none}usa-presence[data-state=online] .usa-pr2-dot{background:#22c55e}usa-presence[data-state=away] .usa-pr2-dot{background:#f59e0b}usa-presence[data-state=busy] .usa-pr2-dot{background:#ef4444}usa-presence[speaking] .usa-pr2-face{box-shadow:0 0 0 3px #22c55e;animation:usa-pr2-speak 1.2s ease-in-out infinite}@keyframes usa-pr2-speak{50%{box-shadow:0 0 0 6px rgba(34,197,94,.35)}}usa-presence[story]::before{content:\"\";position:absolute;inset:-4px;border-radius:50%;background:conic-gradient(#f59e0b,#ef4444,#d946ef,#7c3aed,#f59e0b);animation:usa-pr2-spin 3s linear infinite;z-index:-1}usa-presence[story] .usa-pr2-face{box-shadow:0 0 0 2px var(--usa-pr2-ring,#fff)}@keyframes usa-pr2-spin{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){usa-presence[speaking] .usa-pr2-face,usa-presence[story]::before{animation:none}.usa-pr2-dot{transition:none}}";
|
|
5649
5650
|
|
|
5650
5651
|
/** Presence states (7.4). */
|
|
5651
5652
|
const PRESENCE_STATES = ['online', 'away', 'busy', 'offline'];
|
|
@@ -5715,10 +5716,10 @@ function definePresence(tag = 'usa-presence') {
|
|
|
5715
5716
|
}
|
|
5716
5717
|
}
|
|
5717
5718
|
return UsaPresence;
|
|
5718
|
-
}, { id: 'presence', text: css$
|
|
5719
|
+
}, { id: 'presence', text: css$m });
|
|
5719
5720
|
}
|
|
5720
5721
|
|
|
5721
|
-
var css$
|
|
5722
|
+
var css$l = "usa-leaderboard{display:block;width:var(--usa-lb-w,320px);max-width:100%;font:500 14px/1.2 system-ui,sans-serif}.usa-lb-list{margin:0;padding:0;list-style:none;display:grid;gap:4px}.usa-lb-row{display:grid;grid-template-columns:28px 30px 1fr auto auto;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;background:var(--usa-lb-bg,rgba(15,23,42,.04));position:relative}.usa-lb-row[data-me]{box-shadow:inset 0 0 0 2px var(--usa-lb-accent,#7c5cff)}.usa-lb-rank{text-align:center;font-weight:800;font-size:15px}.usa-lb-av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#a78bfa,#22d3ee) center/cover;color:#fff;font-weight:700;font-size:13px}.usa-lb-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usa-lb-delta{font:700 11px/1 system-ui,sans-serif;font-style:normal}.usa-lb-row[data-move=up] .usa-lb-delta{color:#16a34a}.usa-lb-row[data-move=down] .usa-lb-delta{color:#dc2626}.usa-lb-score{font-variant-numeric:tabular-nums;font-weight:800}.usa-lb-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}";
|
|
5722
5723
|
|
|
5723
5724
|
/** Sort rows by score desc, then name (7.5). */
|
|
5724
5725
|
const rankRows = (rows) => [...rows].sort((a, b) => b.score - a.score || a.name.localeCompare(b.name));
|
|
@@ -5827,10 +5828,10 @@ function defineLeaderboard(tag = 'usa-leaderboard') {
|
|
|
5827
5828
|
}
|
|
5828
5829
|
}
|
|
5829
5830
|
return UsaLeaderboard;
|
|
5830
|
-
}, { id: 'leaderboard', text: css$
|
|
5831
|
+
}, { id: 'leaderboard', text: css$l });
|
|
5831
5832
|
}
|
|
5832
5833
|
|
|
5833
|
-
var css$
|
|
5834
|
+
var css$k = "usa-xp-bar{display:flex;align-items:center;gap:10px;width:var(--usa-xp-w,300px);max-width:100%;font:600 13px/1 system-ui,sans-serif}.usa-xp-lvl{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--usa-xp-accent,#7c5cff);color:#fff;font-size:15px;font-weight:800;box-shadow:0 0 0 3px rgba(124,92,255,.25)}.usa-xp-track{flex:1;min-width:0;height:12px;border-radius:99px;background:var(--usa-xp-track,rgba(15,23,42,.1));overflow:hidden}.usa-xp-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--usa-xp-accent,#7c5cff),#22d3ee);transform-origin:0 50%;transform:scaleX(0)}.usa-xp-num{flex:none;font-variant-numeric:tabular-nums;opacity:.75}usa-xp-bar[data-levelup] .usa-xp-lvl{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.35)}.usa-xp-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}";
|
|
5834
5835
|
|
|
5835
5836
|
/** Apply `gain` XP to (level, xp) with `per` XP per level (7.5). */
|
|
5836
5837
|
function levelFor(level, xp, gain, per = 100) {
|
|
@@ -5927,10 +5928,10 @@ function defineXpBar(tag = 'usa-xp-bar') {
|
|
|
5927
5928
|
}
|
|
5928
5929
|
}
|
|
5929
5930
|
return UsaXpBar;
|
|
5930
|
-
}, { id: 'xp-bar', text: css$
|
|
5931
|
+
}, { id: 'xp-bar', text: css$k });
|
|
5931
5932
|
}
|
|
5932
5933
|
|
|
5933
|
-
var css$
|
|
5934
|
+
var css$j = "usa-badge-wall{display:block;width:var(--usa-bw-w,320px);max-width:100%;font:600 12px/1.2 system-ui,sans-serif}.usa-bw-count{margin:0 0 8px;font-size:13px;opacity:.75;font-variant-numeric:tabular-nums}.usa-bw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:8px;margin:0;padding:0;list-style:none}.usa-bw-badge{position:relative;display:grid;justify-items:center;gap:4px;padding:8px 4px;border-radius:12px;background:linear-gradient(160deg,#fde68a,#f59e0b);color:#422006;text-align:center;overflow:hidden}.usa-bw-icon{font-size:24px;line-height:1}.usa-bw-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usa-bw-badge[data-locked]{background:var(--usa-bw-locked,#e2e8f0);color:#64748b}.usa-bw-badge[data-locked] .usa-bw-icon{filter:grayscale(1);opacity:.45}.usa-bw-badge[data-locked]::after{content:\"🔒\";position:absolute;top:3px;right:4px;font-size:11px}.usa-bw-badge[data-shine]::before{content:\"\";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.75) 50%,transparent 65%) 120% 0/250% 100%;animation:usa-bw-shine 1s ease-in-out .3s both;pointer-events:none}@keyframes usa-bw-shine{to{background-position:-20% 0}}.usa-bw-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media (prefers-reduced-motion:reduce){.usa-bw-badge[data-shine]::before{animation:none;display:none}}";
|
|
5934
5935
|
|
|
5935
5936
|
/** Unlocked / total counts for a badge list (7.5). */
|
|
5936
5937
|
const badgeProgress = (b) => ({ unlocked: b.filter((x) => !x.locked).length, total: b.length });
|
|
@@ -5997,10 +5998,10 @@ function defineBadgeWall(tag = 'usa-badge-wall') {
|
|
|
5997
5998
|
}
|
|
5998
5999
|
}
|
|
5999
6000
|
return UsaBadgeWall;
|
|
6000
|
-
}, { id: 'badge-wall', text: css$
|
|
6001
|
+
}, { id: 'badge-wall', text: css$j });
|
|
6001
6002
|
}
|
|
6002
6003
|
|
|
6003
|
-
var css$
|
|
6004
|
+
var css$i = "usa-prize-wheel{display:inline-block;--s:var(--usa-pw-size,200px);font:700 11px/1 system-ui,sans-serif}.usa-pw-box{position:relative;display:grid;place-items:center;width:var(--s);height:var(--s)}.usa-pw-wheel{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 4px #fff,0 0 0 6px rgba(15,23,42,.15),0 8px 24px rgba(15,23,42,.2);will-change:transform}.usa-pw-label{position:absolute;left:50%;top:0;width:0;height:50%;display:flex;justify-content:center;padding-top:10px;transform-origin:0 100%;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);white-space:nowrap}.usa-pw-pointer{position:absolute;top:-10px;left:50%;margin-left:-9px;width:0;height:0;border:9px solid transparent;border-top:16px solid var(--usa-pw-pointer,#0f172a);border-bottom:0;z-index:2;transform-origin:50% 0}.usa-pw-btn{position:relative;z-index:1;width:30%;aspect-ratio:1;border:0;border-radius:50%;background:#fff;color:#0f172a;font:800 13px/1 system-ui,sans-serif;box-shadow:0 2px 8px rgba(15,23,42,.25);cursor:pointer}.usa-pw-btn:disabled{cursor:progress;opacity:.85}usa-prize-wheel[data-done] .usa-pw-wheel{box-shadow:0 0 0 4px #fff,0 0 0 6px #facc15,0 0 28px rgba(250,204,21,.6)}.usa-pw-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}";
|
|
6004
6005
|
|
|
6005
6006
|
/** Final wheel rotation (deg) that puts segment `index` of `count` under the top pointer after `turns` full turns (7.5). */
|
|
6006
6007
|
function wheelAngle(index, count, turns = 5) {
|
|
@@ -6080,10 +6081,10 @@ function definePrizeWheel(tag = 'usa-prize-wheel') {
|
|
|
6080
6081
|
}
|
|
6081
6082
|
}
|
|
6082
6083
|
return UsaPrizeWheel;
|
|
6083
|
-
}, { id: 'prize-wheel', text: css$
|
|
6084
|
+
}, { id: 'prize-wheel', text: css$i });
|
|
6084
6085
|
}
|
|
6085
6086
|
|
|
6086
|
-
var css$
|
|
6087
|
+
var css$h = "usa-globe{display:inline-block;width:var(--usa-gl-size,200px);max-width:100%;aspect-ratio:1;touch-action:pan-y;cursor:grab;user-select:none}usa-globe:active{cursor:grabbing}.usa-gl-svg{display:block;width:100%;height:100%;overflow:visible}.usa-gl-sea{fill:var(--usa-gl-sea,#1e3a8a)}.usa-gl-grid{fill:none;stroke:var(--usa-gl-grid,rgba(255,255,255,.35));stroke-width:.7}.usa-gl-dot{fill:var(--usa-gl-accent,#f59e0b);stroke:#fff;stroke-width:1}.usa-gl-ring{fill:none;stroke:var(--usa-gl-accent,#f59e0b);stroke-width:1.5;transform-box:fill-box;transform-origin:center;opacity:0}.usa-gl-mark[data-hidden]{display:none}.usa-gl-mark[data-active] .usa-gl-dot{fill:#ef4444}@media (prefers-reduced-motion:no-preference){.usa-gl-ring{animation:usa-gl-pulse 1.8s ease-out infinite}}@keyframes usa-gl-pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(3.2);opacity:0}}";
|
|
6087
6088
|
|
|
6088
6089
|
const RAD = Math.PI / 180;
|
|
6089
6090
|
/** Orthographic projection on a unit sphere seen from longitude `lon0`, tilted by `tilt` degrees (7.6). */
|
|
@@ -6240,10 +6241,10 @@ function defineGlobe(tag = 'usa-globe') {
|
|
|
6240
6241
|
}
|
|
6241
6242
|
}
|
|
6242
6243
|
return UsaGlobe;
|
|
6243
|
-
}, { id: 'globe', text: css$
|
|
6244
|
+
}, { id: 'globe', text: css$h });
|
|
6244
6245
|
}
|
|
6245
6246
|
|
|
6246
|
-
var css$
|
|
6247
|
+
var css$g = "usa-location-card{display:block;width:var(--usa-lc-w,280px);max-width:100%;font:500 13px/1.35 system-ui,sans-serif}.usa-lc{border-radius:16px;overflow:hidden;background:var(--usa-lc-bg,#fff);color:var(--usa-lc-fg,#0f172a);box-shadow:0 10px 28px -14px rgba(15,23,42,.45);border:1px solid rgba(15,23,42,.08)}.usa-lc-map{position:relative;height:var(--usa-lc-map-h,110px);background:var(--usa-lc-land,#e8efe4);overflow:hidden}.usa-lc-map svg{display:block;width:100%;height:100%}.usa-lc-street{fill:none;stroke:#fff;stroke-width:7;stroke-linecap:round}.usa-lc-route{fill:none;stroke:var(--usa-lc-accent,#2563eb);stroke-width:4;stroke-linecap:round;stroke-dasharray:100}.usa-lc-from{fill:#fff;stroke:var(--usa-lc-accent,#2563eb);stroke-width:3}.usa-lc-pin{position:absolute;left:70%;top:calc(48% - 8px);width:22px;height:22px;transform:translate(-50%,-100%);border-radius:50%;background:var(--usa-lc-pin,#ef4444);box-shadow:0 4px 8px rgba(0,0,0,.25)}.usa-lc-pin::after{content:\"\";position:absolute;inset:6px;border-radius:50%;background:#fff}.usa-lc-pin::before{content:\"\";position:absolute;left:50%;bottom:-8px;width:0;height:0;border:6px solid transparent;border-top:9px solid var(--usa-lc-pin,#ef4444);border-bottom:0;transform:translateX(-50%)}.usa-lc-ring{position:absolute;left:70%;top:48%;width:18px;height:18px;border-radius:50%;border:2px solid var(--usa-lc-pin,#ef4444);transform:translate(-50%,-50%);opacity:0;pointer-events:none}.usa-lc-body{padding:10px 14px 12px}.usa-lc-name{margin:0;font-size:15px;font-weight:750}.usa-lc-addr{margin:2px 0 0;opacity:.7}.usa-lc-meta{display:flex;align-items:center;gap:10px;margin:8px 0 0}.usa-lc-meta:empty{display:none}.usa-lc-dist{font-weight:700;font-variant-numeric:tabular-nums}.usa-lc-go{margin-left:auto;color:var(--usa-lc-accent,#2563eb);font-weight:700;text-decoration:none}.usa-lc-go:hover,.usa-lc-go:focus-visible{text-decoration:underline}";
|
|
6247
6248
|
|
|
6248
6249
|
/** Great-circle distance in km between two lat/lon points (7.6). */
|
|
6249
6250
|
function haversine(lat1, lon1, lat2, lon2) {
|
|
@@ -6259,7 +6260,7 @@ function formatDistance(km, unit = 'km') {
|
|
|
6259
6260
|
}
|
|
6260
6261
|
return km < 1 ? `${Math.round(km * 1000)} m` : `${km < 10 ? km.toFixed(1) : Math.round(km)} km`;
|
|
6261
6262
|
}
|
|
6262
|
-
const esc$
|
|
6263
|
+
const esc$8 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6263
6264
|
function defineLocationCard(tag = 'usa-location-card') {
|
|
6264
6265
|
return base.defineElement(tag, (Base) => {
|
|
6265
6266
|
class UsaLocationCard extends Base {
|
|
@@ -6284,7 +6285,7 @@ function defineLocationCard(tag = 'usa-location-card') {
|
|
|
6284
6285
|
const dist = this.str('distance') || (km === null ? '' : formatDistance(km, this.str('unit') === 'mi' ? 'mi' : 'km'));
|
|
6285
6286
|
const href = this.str('href');
|
|
6286
6287
|
const origin = km !== null;
|
|
6287
|
-
this.insertAdjacentHTML('beforeend', `<article class="usa-lc" data-usa-part aria-label="${esc$
|
|
6288
|
+
this.insertAdjacentHTML('beforeend', `<article class="usa-lc" data-usa-part aria-label="${esc$8(name)}"><div class="usa-lc-map" aria-hidden="true"><svg viewBox="0 0 240 120" preserveAspectRatio="xMidYMid slice"><path class="usa-lc-street" d="M0 30H240M0 78H240M40 0V120M120 0V120M196 0V120M0 112L240 8"/>${origin ? '<path class="usa-lc-route" pathLength="100" d="M28 100C60 100 64 78 96 78S120 40 160 40 168 58 168 58"/><circle class="usa-lc-from" cx="28" cy="100" r="4"/>' : ''}</svg><span class="usa-lc-ring"></span><span class="usa-lc-pin"></span></div><div class="usa-lc-body"><h3 class="usa-lc-name">${esc$8(name)}</h3>${this.str('address') ? `<p class="usa-lc-addr">${esc$8(this.str('address'))}</p>` : ''}<p class="usa-lc-meta">${dist ? `<span class="usa-lc-dist">${esc$8(dist)}</span>` : ''}${href ? `<a class="usa-lc-go" href="${esc$8(href)}" target="_blank" rel="noopener">Directions</a>` : ''}</p></div></article>`);
|
|
6288
6289
|
if (origin)
|
|
6289
6290
|
this.setAttribute('data-route', '');
|
|
6290
6291
|
else
|
|
@@ -6317,10 +6318,10 @@ function defineLocationCard(tag = 'usa-location-card') {
|
|
|
6317
6318
|
}
|
|
6318
6319
|
}
|
|
6319
6320
|
return UsaLocationCard;
|
|
6320
|
-
}, { id: 'location-card', text: css$
|
|
6321
|
+
}, { id: 'location-card', text: css$g });
|
|
6321
6322
|
}
|
|
6322
6323
|
|
|
6323
|
-
var css$
|
|
6324
|
+
var css$f = "usa-field{display:block;width:var(--usa-fld-w,280px);max-width:100%;font:500 14px/1.3 system-ui,sans-serif;--usa-fld-accent:#6366f1;--usa-fld-bad:#e11d48;--usa-fld-good:#16a34a}.usa-fld{position:relative;padding-top:18px}.usa-fld-input{display:block;box-sizing:border-box;width:100%;padding:8px 30px 8px 2px;border:0;border-bottom:2px solid var(--usa-fld-rule,rgba(100,116,139,.45));background:transparent;color:inherit;font:inherit;outline:none;border-radius:0}.usa-fld-label{position:absolute;left:2px;top:26px;color:var(--usa-fld-muted,#64748b);pointer-events:none;transform-origin:0 0;transition:transform .22s cubic-bezier(.2,.8,.2,1),color .2s}usa-field[data-focus] .usa-fld-label,usa-field[data-filled] .usa-fld-label,.usa-fld-input:not(:placeholder-shown)+.usa-fld-label{transform:translateY(-24px) scale(.8)}usa-field[data-focus] .usa-fld-label{color:var(--usa-fld-accent)}.usa-fld-line{position:absolute;left:0;right:0;top:calc(18px + 2.3em - 1px);height:2px;background:var(--usa-fld-accent);transform:scaleX(0);transition:transform .3s cubic-bezier(.2,.8,.2,1)}usa-field[data-focus] .usa-fld-line{transform:scaleX(1)}usa-field[data-invalid] .usa-fld-line{transform:scaleX(1);background:var(--usa-fld-bad)}usa-field[data-invalid] .usa-fld-label{color:var(--usa-fld-bad)}.usa-fld-ok{position:absolute;right:2px;top:24px;width:20px;height:20px;fill:none;stroke:var(--usa-fld-good);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.usa-fld-ok path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .35s ease-out}usa-field[data-valid] .usa-fld-ok path{stroke-dashoffset:0}.usa-fld-meter{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:6px}.usa-fld-meter i{height:4px;border-radius:2px;background:rgba(100,116,139,.25);transform-origin:0 50%;transition:background .25s}.usa-fld-meter[data-score=\"1\"] i:nth-child(-n+1){background:#ef4444}.usa-fld-meter[data-score=\"2\"] i:nth-child(-n+2){background:#f59e0b}.usa-fld-meter[data-score=\"3\"] i:nth-child(-n+3){background:#84cc16}.usa-fld-meter[data-score=\"4\"] i{background:#16a34a}.usa-fld-msg{margin:4px 0 0;min-height:1.3em;font-size:12px;color:var(--usa-fld-muted,#64748b)}usa-field[data-invalid] .usa-fld-msg{color:var(--usa-fld-bad)}@media (prefers-reduced-motion:reduce){.usa-fld-label,.usa-fld-line,.usa-fld-ok path,.usa-fld-meter i{transition:none}}";
|
|
6324
6325
|
|
|
6325
6326
|
/** 0–4 password strength score with a label (7.7). */
|
|
6326
6327
|
function passwordStrength(pw) {
|
|
@@ -6342,15 +6343,15 @@ function passwordStrength(pw) {
|
|
|
6342
6343
|
const score = Math.min(4, s);
|
|
6343
6344
|
return { score, label: ['Too short', 'Weak', 'Fair', 'Good', 'Strong'][score] };
|
|
6344
6345
|
}
|
|
6345
|
-
const esc$
|
|
6346
|
-
let uid$
|
|
6346
|
+
const esc$7 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6347
|
+
let uid$2 = 0;
|
|
6347
6348
|
const PASS = ['type', 'name', 'required', 'pattern', 'minlength', 'maxlength', 'autocomplete', 'inputmode', 'placeholder'];
|
|
6348
6349
|
function defineField(tag = 'usa-field') {
|
|
6349
6350
|
return base.defineElement(tag, (Base) => {
|
|
6350
6351
|
class UsaField extends Base {
|
|
6351
6352
|
constructor() {
|
|
6352
6353
|
super(...arguments);
|
|
6353
|
-
this._id = `usa-fld-${++uid$
|
|
6354
|
+
this._id = `usa-fld-${++uid$2}`;
|
|
6354
6355
|
this._checking = false;
|
|
6355
6356
|
}
|
|
6356
6357
|
static get observedAttributes() {
|
|
@@ -6376,9 +6377,9 @@ function defineField(tag = 'usa-field') {
|
|
|
6376
6377
|
const id = this._id;
|
|
6377
6378
|
const strength = this.flag('strength');
|
|
6378
6379
|
const attrs = PASS.filter((a) => this.hasAttribute(a))
|
|
6379
|
-
.map((a) => (a === 'required' ? ' required' : ` ${a}="${esc$
|
|
6380
|
+
.map((a) => (a === 'required' ? ' required' : ` ${a}="${esc$7(this.str(a))}"`))
|
|
6380
6381
|
.join('');
|
|
6381
|
-
this.insertAdjacentHTML('beforeend', `<div class="usa-fld" data-usa-part><input class="usa-fld-input" id="${id}"${attrs} aria-describedby="${id}-msg"${this.hasAttribute('type') ? '' : ' type="text"'}><label class="usa-fld-label" for="${id}">${esc$
|
|
6382
|
+
this.insertAdjacentHTML('beforeend', `<div class="usa-fld" data-usa-part><input class="usa-fld-input" id="${id}"${attrs} aria-describedby="${id}-msg"${this.hasAttribute('type') ? '' : ' type="text"'}><label class="usa-fld-label" for="${id}">${esc$7(this.str('label', 'Label'))}</label><span class="usa-fld-line" aria-hidden="true"></span><svg class="usa-fld-ok" viewBox="0 0 24 24" aria-hidden="true"><path pathLength="1" d="M5 12.5l4.5 4.5L19 7.5"/></svg>${strength ? '<div class="usa-fld-meter" aria-hidden="true"><i></i><i></i><i></i><i></i></div>' : ''}<p class="usa-fld-msg" id="${id}-msg" aria-live="polite">${esc$7(this.str('hint'))}</p></div>`);
|
|
6382
6383
|
const input = this.input;
|
|
6383
6384
|
input.value = keep;
|
|
6384
6385
|
this.listen(input, 'input', () => {
|
|
@@ -6446,10 +6447,10 @@ function defineField(tag = 'usa-field') {
|
|
|
6446
6447
|
}
|
|
6447
6448
|
}
|
|
6448
6449
|
return UsaField;
|
|
6449
|
-
}, { id: 'field', text: css$
|
|
6450
|
+
}, { id: 'field', text: css$f });
|
|
6450
6451
|
}
|
|
6451
6452
|
|
|
6452
|
-
var css$
|
|
6453
|
+
var css$e = "usa-otp{display:inline-block;max-width:100%;--usa-otp-accent:#6366f1;--usa-otp-size:44px}.usa-otp{display:flex;gap:var(--usa-otp-gap,8px)}.usa-otp-box{box-sizing:border-box;width:var(--usa-otp-size);height:calc(var(--usa-otp-size)*1.18);min-width:0;flex:0 1 auto;padding:0;text-align:center;font:700 calc(var(--usa-otp-size)*.48)/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:inherit;background:var(--usa-otp-bg,rgba(148,163,184,.12));border:2px solid var(--usa-otp-rule,rgba(100,116,139,.35));border-radius:10px;outline:none;caret-color:var(--usa-otp-accent);transition:border-color .2s,box-shadow .2s,background .2s}.usa-otp-box:focus{border-color:var(--usa-otp-accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--usa-otp-accent) 22%,transparent)}.usa-otp-box[data-filled]{border-color:color-mix(in srgb,var(--usa-otp-accent) 60%,transparent)}usa-otp[data-state=error] .usa-otp-box{border-color:#e11d48;background:rgba(225,29,72,.08)}usa-otp[data-state=success] .usa-otp-box{border-color:#16a34a;background:rgba(22,163,74,.1);color:#15803d}@media (prefers-reduced-motion:reduce){.usa-otp-box{transition:none}}";
|
|
6453
6454
|
|
|
6454
6455
|
/** Keep only the characters an OTP accepts (7.7). */
|
|
6455
6456
|
function sanitizeCode(s, mode = 'numeric') {
|
|
@@ -6580,10 +6581,10 @@ function defineOtp(tag = 'usa-otp') {
|
|
|
6580
6581
|
}
|
|
6581
6582
|
}
|
|
6582
6583
|
return UsaOtp;
|
|
6583
|
-
}, { id: 'otp', text: css$
|
|
6584
|
+
}, { id: 'otp', text: css$e });
|
|
6584
6585
|
}
|
|
6585
6586
|
|
|
6586
|
-
var css$
|
|
6587
|
+
var css$d = "usa-upload-progress{display:block;width:var(--usa-up-w,300px);max-width:100%;font:500 13px/1.3 system-ui,sans-serif;--usa-up-accent:#6366f1}.usa-up{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--usa-up-bg,rgba(148,163,184,.1));border:1px solid rgba(100,116,139,.18)}.usa-up-icon{flex:none;display:grid;place-items:center;width:34px;height:40px;border-radius:6px;background:var(--usa-up-accent);color:#fff;font:800 9px/1 system-ui,sans-serif;letter-spacing:.04em}.usa-up-main{flex:1;min-width:0}.usa-up-top,.usa-up-sub{display:flex;align-items:center;gap:8px}.usa-up-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:650}.usa-up-pct{font-variant-numeric:tabular-nums;font-weight:700;color:var(--usa-up-accent)}.usa-up-track{position:relative;height:6px;margin:6px 0 4px;border-radius:3px;background:rgba(100,116,139,.2);overflow:hidden}.usa-up-fill{position:absolute;inset:0;border-radius:inherit;background:var(--usa-up-accent);transform-origin:0 50%;transform:scaleX(0);overflow:hidden}usa-upload-progress[data-state=uploading] .usa-up-fill::after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-100%);animation:usa-up-shine 1.2s linear infinite}@keyframes usa-up-shine{to{transform:translateX(100%)}}.usa-up-sub{font-size:11.5px;color:var(--usa-up-muted,#64748b)}.usa-up-msg{flex:1;color:#e11d48}.usa-up-retry{display:none;border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--usa-up-accent);cursor:pointer}usa-upload-progress[data-state=error] .usa-up-retry{display:inline}usa-upload-progress[data-state=error] .usa-up-fill{background:#e11d48}usa-upload-progress[data-state=error] .usa-up-icon{background:#e11d48}usa-upload-progress[data-state=done] .usa-up-fill{background:#16a34a}.usa-up-ok{flex:none;width:0;height:24px;fill:none;stroke:#16a34a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:width .25s}.usa-up-ok circle{opacity:.25}.usa-up-ok path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .4s .15s ease-out}usa-upload-progress[data-state=done] .usa-up-ok{width:24px}usa-upload-progress[data-state=done] .usa-up-ok path{stroke-dashoffset:0}@media (prefers-reduced-motion:reduce){.usa-up-fill::after{animation:none!important;display:none}.usa-up-ok,.usa-up-ok path{transition:none}}";
|
|
6587
6588
|
|
|
6588
6589
|
/** 1536 → "1.5 KB", 2_400_000 → "2.3 MB" (7.7). */
|
|
6589
6590
|
function formatBytes(n) {
|
|
@@ -6597,7 +6598,7 @@ function formatBytes(n) {
|
|
|
6597
6598
|
}
|
|
6598
6599
|
return `${i === 0 ? Math.round(n) : n < 10 ? n.toFixed(1) : Math.round(n)} ${u[i]}`;
|
|
6599
6600
|
}
|
|
6600
|
-
const esc$
|
|
6601
|
+
const esc$6 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6601
6602
|
function defineUploadProgress(tag = 'usa-upload-progress') {
|
|
6602
6603
|
return base.defineElement(tag, (Base) => {
|
|
6603
6604
|
class UsaUploadProgress extends Base {
|
|
@@ -6625,7 +6626,7 @@ function defineUploadProgress(tag = 'usa-upload-progress') {
|
|
|
6625
6626
|
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
6626
6627
|
const name = this.str('name', 'file');
|
|
6627
6628
|
const size = formatBytes(this.num('size', NaN));
|
|
6628
|
-
this.insertAdjacentHTML('beforeend', `<div class="usa-up" data-usa-part><span class="usa-up-icon" aria-hidden="true">${esc$
|
|
6629
|
+
this.insertAdjacentHTML('beforeend', `<div class="usa-up" data-usa-part><span class="usa-up-icon" aria-hidden="true">${esc$6((name.split('.').pop() || '').slice(0, 4).toUpperCase())}</span><div class="usa-up-main"><div class="usa-up-top"><span class="usa-up-name">${esc$6(name)}</span><span class="usa-up-pct"></span></div><div class="usa-up-track" role="progressbar" aria-label="Uploading ${esc$6(name)}" aria-valuemin="0" aria-valuemax="100"><span class="usa-up-fill"></span></div><div class="usa-up-sub"><span class="usa-up-size">${esc$6(size)}</span><span class="usa-up-msg" aria-live="polite"></span><button type="button" class="usa-up-retry">Retry</button></div></div><svg class="usa-up-ok" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path pathLength="1" d="M7 12.5l3.2 3.2L17 9"/></svg></div>`);
|
|
6629
6630
|
this.listen(this.querySelector('.usa-up-retry'), 'click', () => this.emit('retry', { name }));
|
|
6630
6631
|
this._shown = 0;
|
|
6631
6632
|
this.render(true);
|
|
@@ -6666,12 +6667,12 @@ function defineUploadProgress(tag = 'usa-upload-progress') {
|
|
|
6666
6667
|
}
|
|
6667
6668
|
}
|
|
6668
6669
|
return UsaUploadProgress;
|
|
6669
|
-
}, { id: 'upload-progress', text: css$
|
|
6670
|
+
}, { id: 'upload-progress', text: css$d });
|
|
6670
6671
|
}
|
|
6671
6672
|
|
|
6672
|
-
var css$
|
|
6673
|
+
var css$c = "usa-chat-composer{display:block;width:var(--usa-cc-w,100%);max-width:100%;font:500 14px/1.45 system-ui,sans-serif;--usa-cc-accent:#6366f1}.usa-cc{position:relative;display:flex;align-items:flex-end;gap:8px;padding:8px 8px 8px 14px;border-radius:22px;background:var(--usa-cc-bg,#fff);color:var(--usa-cc-fg,#0f172a);border:1px solid rgba(100,116,139,.28);box-shadow:0 6px 20px -12px rgba(15,23,42,.4)}.usa-cc-glow{position:absolute;inset:-2px;border-radius:24px;padding:2px;background:conic-gradient(from var(--usa-cc-a,0deg),#6366f1,#ec4899,#f59e0b,#22d3ee,#6366f1);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s;pointer-events:none}@property --usa-cc-a{syntax:\"<angle>\";inherits:false;initial-value:0deg}usa-chat-composer[data-busy] .usa-cc-glow{opacity:1;animation:usa-cc-spin 2.4s linear infinite}@keyframes usa-cc-spin{to{--usa-cc-a:360deg}}.usa-cc-input{flex:1;min-width:0;resize:none;border:0;outline:none;background:transparent;color:inherit;font:inherit;padding:6px 0;max-height:12em;overflow-y:auto}.usa-cc-send{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:0;background:rgba(100,116,139,.25);color:#fff;cursor:pointer;transition:background .2s}usa-chat-composer[data-ready] .usa-cc-send{background:var(--usa-cc-accent)}.usa-cc-send:focus-visible{outline:2px solid var(--usa-cc-accent);outline-offset:2px}.usa-cc-send svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.usa-cc-arrow{transition:transform .25s,opacity .2s;transform-origin:center}.usa-cc-stop{fill:currentColor;stroke:none;opacity:0;transform:scale(.4);transform-origin:12px 12px;transition:transform .25s,opacity .2s}usa-chat-composer[data-busy] .usa-cc-arrow{opacity:0;transform:scale(.4)}usa-chat-composer[data-busy] .usa-cc-stop{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){usa-chat-composer[data-busy] .usa-cc-glow{animation:none}.usa-cc-arrow,.usa-cc-stop,.usa-cc-glow{transition:none}}";
|
|
6673
6674
|
|
|
6674
|
-
const esc$
|
|
6675
|
+
const esc$5 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6675
6676
|
function defineChatComposer(tag = 'usa-chat-composer') {
|
|
6676
6677
|
return base.defineElement(tag, (Base) => {
|
|
6677
6678
|
class UsaChatComposer extends Base {
|
|
@@ -6701,7 +6702,7 @@ function defineChatComposer(tag = 'usa-chat-composer') {
|
|
|
6701
6702
|
const keep = this.area?.value ?? this.str('value');
|
|
6702
6703
|
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
6703
6704
|
const label = this.str('label', 'Message');
|
|
6704
|
-
this.insertAdjacentHTML('beforeend', `<div class="usa-cc" data-usa-part><span class="usa-cc-glow" aria-hidden="true"></span><textarea class="usa-cc-input" rows="1" aria-label="${esc$
|
|
6705
|
+
this.insertAdjacentHTML('beforeend', `<div class="usa-cc" data-usa-part><span class="usa-cc-glow" aria-hidden="true"></span><textarea class="usa-cc-input" rows="1" aria-label="${esc$5(label)}" placeholder="${esc$5(this.str('placeholder', 'Ask anything…'))}"></textarea><button type="button" class="usa-cc-send" aria-label="Send"><svg viewBox="0 0 24 24" aria-hidden="true"><path class="usa-cc-arrow" d="M12 19V5M5.5 11.5L12 5l6.5 6.5"/><rect class="usa-cc-stop" x="7" y="7" width="10" height="10" rx="2"/></svg></button></div>`);
|
|
6705
6706
|
const a = this.area;
|
|
6706
6707
|
a.value = keep;
|
|
6707
6708
|
this.listen(a, 'input', () => this.sync());
|
|
@@ -6767,10 +6768,10 @@ function defineChatComposer(tag = 'usa-chat-composer') {
|
|
|
6767
6768
|
}
|
|
6768
6769
|
}
|
|
6769
6770
|
return UsaChatComposer;
|
|
6770
|
-
}, { id: 'chat-composer', text: css$
|
|
6771
|
+
}, { id: 'chat-composer', text: css$c });
|
|
6771
6772
|
}
|
|
6772
6773
|
|
|
6773
|
-
var css$
|
|
6774
|
+
var css$b = "usa-suggestion-chips{display:block;max-width:100%;font:500 13px/1.2 system-ui,sans-serif;--usa-sc-accent:#6366f1}.usa-sc{display:flex;flex-wrap:wrap;gap:8px}.usa-sc>span{display:contents}.usa-sc-chip{padding:8px 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--usa-sc-accent) 35%,transparent);background:color-mix(in srgb,var(--usa-sc-accent) 8%,var(--usa-sc-bg,#fff));color:inherit;font:inherit;cursor:pointer;transition:background .2s,border-color .2s,opacity .3s,transform .3s}.usa-sc-chip:hover,.usa-sc-chip:focus-visible{background:color-mix(in srgb,var(--usa-sc-accent) 16%,var(--usa-sc-bg,#fff));outline:none;border-color:var(--usa-sc-accent)}.usa-sc-chip[data-picked]{background:var(--usa-sc-accent);border-color:var(--usa-sc-accent);color:#fff}.usa-sc-chip[data-gone]{opacity:0;transform:scale(.85);pointer-events:none}@media (prefers-reduced-motion:reduce){.usa-sc-chip{transition:none}}";
|
|
6774
6775
|
|
|
6775
6776
|
/** "a | b|c" → ["a", "b", "c"] (7.8). */
|
|
6776
6777
|
function parseChips(s) {
|
|
@@ -6779,7 +6780,7 @@ function parseChips(s) {
|
|
|
6779
6780
|
.map((t) => t.trim())
|
|
6780
6781
|
.filter(Boolean);
|
|
6781
6782
|
}
|
|
6782
|
-
const esc$
|
|
6783
|
+
const esc$4 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6783
6784
|
function defineSuggestionChips(tag = 'usa-suggestion-chips') {
|
|
6784
6785
|
return base.defineElement(tag, (Base) => {
|
|
6785
6786
|
class UsaSuggestionChips extends Base {
|
|
@@ -6814,7 +6815,7 @@ function defineSuggestionChips(tag = 'usa-suggestion-chips') {
|
|
|
6814
6815
|
Array.from(this.children).forEach((c) => !c.hasAttribute('data-usa-part') && c.setAttribute('hidden', ''));
|
|
6815
6816
|
}
|
|
6816
6817
|
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
6817
|
-
this.insertAdjacentHTML('beforeend', `<div class="usa-sc" role="list" aria-label="${esc$
|
|
6818
|
+
this.insertAdjacentHTML('beforeend', `<div class="usa-sc" role="list" aria-label="${esc$4(this.str('label', 'Suggestions'))}" data-usa-part>${items.map((t, i) => `<span role="listitem"><button type="button" class="usa-sc-chip" data-i="${i}">${esc$4(t)}</button></span>`).join('')}</div>`);
|
|
6818
6819
|
const chips = Array.from(this.querySelectorAll('.usa-sc-chip'));
|
|
6819
6820
|
chips.forEach((c, i) => {
|
|
6820
6821
|
this.listen(c, 'click', () => this.pick(i));
|
|
@@ -6855,10 +6856,10 @@ function defineSuggestionChips(tag = 'usa-suggestion-chips') {
|
|
|
6855
6856
|
}
|
|
6856
6857
|
}
|
|
6857
6858
|
return UsaSuggestionChips;
|
|
6858
|
-
}, { id: 'suggestion-chips', text: css$
|
|
6859
|
+
}, { id: 'suggestion-chips', text: css$b });
|
|
6859
6860
|
}
|
|
6860
6861
|
|
|
6861
|
-
var css$
|
|
6862
|
+
var css$a = "usa-voice-button{display:inline-block;--usa-vb-accent:#6366f1;--usa-vb-size:52px}.usa-vb{display:flex;align-items:center;gap:12px}.usa-vb-btn{position:relative;display:grid;place-items:center;width:var(--usa-vb-size);height:var(--usa-vb-size);border-radius:50%;border:0;background:var(--usa-vb-idle,#e2e8f0);color:#334155;cursor:pointer;transition:background .2s,color .2s}.usa-vb-btn:focus-visible{outline:2px solid var(--usa-vb-accent);outline-offset:3px}.usa-vb-btn svg{position:relative;width:46%;height:46%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.usa-vb-btn svg rect{fill:currentColor;stroke:none}.usa-vb-halo{position:absolute;inset:0;border-radius:50%;background:var(--usa-vb-accent);opacity:0;transition:transform .12s linear}usa-voice-button[listening] .usa-vb-btn{background:var(--usa-vb-accent);color:#fff}usa-voice-button[listening] .usa-vb-halo{opacity:.25;animation:usa-vb-breathe 1.6s ease-in-out infinite}usa-voice-button[data-live] .usa-vb-halo{animation:none}@keyframes usa-vb-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}.usa-vb-bars{display:flex;align-items:center;gap:3px;height:calc(var(--usa-vb-size)*.6);opacity:.25;transition:opacity .2s}.usa-vb-bars i{display:block;width:4px;height:100%;border-radius:2px;background:var(--usa-vb-accent);transform:scaleY(.15);transition:transform .1s linear}usa-voice-button[listening] .usa-vb-bars{opacity:1}usa-voice-button[listening]:not([data-live]) .usa-vb-bars i{animation:usa-vb-wave 1s ease-in-out infinite}.usa-vb-bars i:nth-child(2){animation-delay:-.15s!important}.usa-vb-bars i:nth-child(3){animation-delay:-.3s!important}.usa-vb-bars i:nth-child(4){animation-delay:-.45s!important}.usa-vb-bars i:nth-child(5){animation-delay:-.6s!important}.usa-vb-bars i:nth-child(6){animation-delay:-.75s!important}.usa-vb-bars i:nth-child(7){animation-delay:-.9s!important}@keyframes usa-vb-wave{0%,100%{transform:scaleY(.2)}50%{transform:scaleY(.9)}}@media (prefers-reduced-motion:reduce){usa-voice-button[listening] .usa-vb-halo,usa-voice-button[listening] .usa-vb-bars i{animation:none!important}.usa-vb-bars i{transition:none}}";
|
|
6862
6863
|
|
|
6863
6864
|
/** Bar heights (0–1) for a level and a phase, centre bars tallest (7.8). */
|
|
6864
6865
|
function waveBars(level, n = 5, phase = 0) {
|
|
@@ -6930,10 +6931,10 @@ function defineVoiceButton(tag = 'usa-voice-button') {
|
|
|
6930
6931
|
}
|
|
6931
6932
|
}
|
|
6932
6933
|
return UsaVoiceButton;
|
|
6933
|
-
}, { id: 'voice-button', text: css$
|
|
6934
|
+
}, { id: 'voice-button', text: css$a });
|
|
6934
6935
|
}
|
|
6935
6936
|
|
|
6936
|
-
var css$
|
|
6937
|
+
var css$9 = "usa-command-palette{display:contents;--usa-cp-accent:#6366f1}usa-command-palette>option{display:none}.usa-cp{width:min(560px,calc(100vw - 24px));max-width:none;padding:0;margin:12vh auto auto;border:0;border-radius:16px;background:transparent;color:inherit;overflow:visible}.usa-cp::backdrop{background:rgba(15,23,42,.35);backdrop-filter:blur(3px)}.usa-cp-box{border-radius:16px;background:var(--usa-cp-bg,#fff);color:var(--usa-cp-fg,#0f172a);box-shadow:0 24px 60px -20px rgba(15,23,42,.55);border:1px solid rgba(100,116,139,.2);overflow:hidden;font:500 14px/1.3 system-ui,sans-serif}.usa-cp-q{box-sizing:border-box;width:100%;padding:16px 18px;border:0;border-bottom:1px solid rgba(100,116,139,.18);background:transparent;color:inherit;font:inherit;font-size:16px;outline:none}.usa-cp-list{position:relative;max-height:min(340px,50vh);overflow-y:auto;padding:6px}.usa-cp-hl{position:absolute;left:6px;right:6px;top:0;border-radius:10px;background:color-mix(in srgb,var(--usa-cp-accent) 12%,transparent);pointer-events:none;opacity:0}.usa-cp-group{padding:8px 10px 4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.55}.usa-cp-item{position:relative;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;cursor:pointer}.usa-cp-item[aria-selected=true] .usa-cp-label{color:var(--usa-cp-accent)}.usa-cp-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usa-cp-label mark{background:none;color:var(--usa-cp-accent);font-weight:800}.usa-cp-keys{display:flex;gap:3px}.usa-cp-keys kbd,usa-shortcut kbd{display:inline-grid;place-items:center;min-width:1.6em;padding:2px 5px;border-radius:5px;border:1px solid rgba(100,116,139,.35);border-bottom-width:2px;background:var(--usa-kbd-bg,rgba(148,163,184,.12));font:600 11px/1.3 system-ui,sans-serif;color:inherit}.usa-cp-empty{margin:0;padding:18px;text-align:center;opacity:.6}usa-command-palette[inline]{display:block;width:var(--usa-cp-w,100%);max-width:100%}usa-command-palette[inline] .usa-cp{position:static;width:100%;margin:0}usa-command-palette[inline] .usa-cp-box{box-shadow:0 12px 30px -18px rgba(15,23,42,.45)}";
|
|
6937
6938
|
|
|
6938
6939
|
/**
|
|
6939
6940
|
* Fuzzy match: every query letter in order. Returns a score (higher is
|
|
@@ -6992,15 +6993,15 @@ function matchesKeys(e, keys, apple = isApple()) {
|
|
|
6992
6993
|
function isApple() {
|
|
6993
6994
|
return typeof navigator !== 'undefined' && /Mac|iPhone|iPad|iPod/.test(navigator.userAgentData?.platform || navigator.platform || navigator.userAgent || '');
|
|
6994
6995
|
}
|
|
6995
|
-
const esc$
|
|
6996
|
-
let uid = 0;
|
|
6996
|
+
const esc$3 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
6997
|
+
let uid$1 = 0;
|
|
6997
6998
|
function defineCommandPalette(tag = 'usa-command-palette') {
|
|
6998
6999
|
return base.defineElement(tag, (Base) => {
|
|
6999
7000
|
class UsaCommandPalette extends Base {
|
|
7000
7001
|
constructor() {
|
|
7001
7002
|
super(...arguments);
|
|
7002
7003
|
this._cmds = null;
|
|
7003
|
-
this._id = `usa-cp-${++uid}`;
|
|
7004
|
+
this._id = `usa-cp-${++uid$1}`;
|
|
7004
7005
|
this._active = 0;
|
|
7005
7006
|
this._shown = [];
|
|
7006
7007
|
this._opener = null;
|
|
@@ -7029,7 +7030,7 @@ function defineCommandPalette(tag = 'usa-command-palette') {
|
|
|
7029
7030
|
mount() {
|
|
7030
7031
|
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
7031
7032
|
const id = this._id;
|
|
7032
|
-
this.insertAdjacentHTML('beforeend', `<dialog class="usa-cp" data-usa-part aria-label="${esc$
|
|
7033
|
+
this.insertAdjacentHTML('beforeend', `<dialog class="usa-cp" data-usa-part aria-label="${esc$3(this.str('label', 'Command palette'))}"><div class="usa-cp-box"><input class="usa-cp-q" role="combobox" aria-expanded="true" aria-controls="${id}-list" aria-autocomplete="list" autocomplete="off" spellcheck="false" placeholder="${esc$3(this.str('placeholder', 'Type a command or search…'))}"><div class="usa-cp-list" id="${id}-list" role="listbox"><span class="usa-cp-hl" aria-hidden="true"></span></div><p class="usa-cp-empty" hidden>No results</p></div></dialog>`);
|
|
7033
7034
|
const dlg = this.dlg;
|
|
7034
7035
|
const q = this.querySelector('.usa-cp-q');
|
|
7035
7036
|
this.listen(q, 'input', () => this.render(true));
|
|
@@ -7084,12 +7085,12 @@ function defineCommandPalette(tag = 'usa-command-palette') {
|
|
|
7084
7085
|
if (!q && c.group !== group) {
|
|
7085
7086
|
group = c.group;
|
|
7086
7087
|
if (group)
|
|
7087
|
-
html += `<div class="usa-cp-group" role="presentation">${esc$
|
|
7088
|
+
html += `<div class="usa-cp-group" role="presentation">${esc$3(group)}</div>`;
|
|
7088
7089
|
}
|
|
7089
7090
|
const label = Array.from(c.label)
|
|
7090
|
-
.map((ch, j) => (m.hits.includes(j) ? `<mark>${esc$
|
|
7091
|
+
.map((ch, j) => (m.hits.includes(j) ? `<mark>${esc$3(ch)}</mark>` : esc$3(ch)))
|
|
7091
7092
|
.join('');
|
|
7092
|
-
const keys = c.keys ? `<span class="usa-cp-keys">${keyLabels(c.keys).map((k) => `<kbd>${esc$
|
|
7093
|
+
const keys = c.keys ? `<span class="usa-cp-keys">${keyLabels(c.keys).map((k) => `<kbd>${esc$3(k)}</kbd>`).join('')}</span>` : '';
|
|
7093
7094
|
html += `<div class="usa-cp-item" role="option" id="${this._id}-o${i}" data-i="${i}" aria-selected="false"><span class="usa-cp-label">${label}</span>${keys}</div>`;
|
|
7094
7095
|
});
|
|
7095
7096
|
list.insertAdjacentHTML('beforeend', html);
|
|
@@ -7192,13 +7193,13 @@ function defineCommandPalette(tag = 'usa-command-palette') {
|
|
|
7192
7193
|
}
|
|
7193
7194
|
}
|
|
7194
7195
|
return UsaCommandPalette;
|
|
7195
|
-
}, { id: 'command-palette', text: css$
|
|
7196
|
+
}, { id: 'command-palette', text: css$9 });
|
|
7196
7197
|
}
|
|
7197
7198
|
|
|
7198
|
-
var css$
|
|
7199
|
+
var css$8 = "usa-shortcut{display:inline-block;font:500 13px/1.3 system-ui,sans-serif}.usa-sk{display:inline-flex;align-items:center;gap:8px}.usa-sk-caps{display:inline-flex;gap:4px}usa-shortcut kbd{display:inline-grid;place-items:center;min-width:1.9em;height:1.9em;padding:0 6px;box-sizing:border-box;border-radius:6px;border:1px solid rgba(100,116,139,.4);border-bottom-width:3px;background:var(--usa-kbd-bg,#fff);color:inherit;font:600 12px/1 system-ui,sans-serif;box-shadow:0 1px 0 rgba(15,23,42,.08)}usa-shortcut[data-pressed] kbd{background:var(--usa-kbd-on,#eef2ff);border-color:var(--usa-kbd-accent,#6366f1)}.usa-sk-label{opacity:.75}";
|
|
7199
7200
|
|
|
7200
7201
|
const SPOKEN = { '⌘': 'Command', '⇧': 'Shift', '⌥': 'Option', '⌃': 'Control', Ctrl: 'Control', '↵': 'Enter', '⇥': 'Tab', '⌫': 'Backspace' };
|
|
7201
|
-
const esc$
|
|
7202
|
+
const esc$2 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
7202
7203
|
function defineShortcut(tag = 'usa-shortcut') {
|
|
7203
7204
|
return base.defineElement(tag, (Base) => {
|
|
7204
7205
|
class UsaShortcut extends Base {
|
|
@@ -7213,7 +7214,7 @@ function defineShortcut(tag = 'usa-shortcut') {
|
|
|
7213
7214
|
const labels = this.labels;
|
|
7214
7215
|
const spoken = labels.map((l) => SPOKEN[l] || l).join(' ');
|
|
7215
7216
|
const text = this.str('label');
|
|
7216
|
-
this.insertAdjacentHTML('beforeend', `<span class="usa-sk" data-usa-part><span class="usa-sk-caps" role="img" aria-label="${esc$
|
|
7217
|
+
this.insertAdjacentHTML('beforeend', `<span class="usa-sk" data-usa-part><span class="usa-sk-caps" role="img" aria-label="${esc$2(spoken)}">${labels.map((l) => `<kbd aria-hidden="true">${esc$2(l)}</kbd>`).join('')}</span>${text ? `<span class="usa-sk-label">${esc$2(text)}</span>` : ''}</span>`);
|
|
7217
7218
|
if (this.str('listen') !== 'false')
|
|
7218
7219
|
this.listen(document, 'keydown', (e) => {
|
|
7219
7220
|
if (!e.repeat && matchesKeys(e, this.str('keys', 'mod+k'))) {
|
|
@@ -7246,10 +7247,10 @@ function defineShortcut(tag = 'usa-shortcut') {
|
|
|
7246
7247
|
}
|
|
7247
7248
|
}
|
|
7248
7249
|
return UsaShortcut;
|
|
7249
|
-
}, { id: 'shortcut', text: css$
|
|
7250
|
+
}, { id: 'shortcut', text: css$8 });
|
|
7250
7251
|
}
|
|
7251
7252
|
|
|
7252
|
-
var css$
|
|
7253
|
+
var css$7 = "usa-clock-control{display:inline-block;font:600 12.5px/1 system-ui,sans-serif;--usa-clk-accent:#6366f1}.usa-clk{display:inline-flex;align-items:center;gap:8px;padding:5px;border-radius:999px;background:var(--usa-clk-bg,rgba(148,163,184,.14));border:1px solid rgba(100,116,139,.2)}.usa-clk-play{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:0;background:var(--usa-clk-accent);color:#fff;cursor:pointer}.usa-clk-play:focus-visible,.usa-clk-speed:focus-visible{outline:2px solid var(--usa-clk-accent);outline-offset:2px}.usa-clk-play svg{width:15px;height:15px;fill:currentColor}.usa-clk-tri{opacity:0;transform-origin:center;transition:opacity .15s}usa-clock-control[data-paused] .usa-clk-tri{opacity:1}usa-clock-control[data-paused] .usa-clk-bar{opacity:0}.usa-clk-speeds{position:relative;display:flex}.usa-clk-ink{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--usa-clk-ink,#fff);box-shadow:0 1px 4px rgba(15,23,42,.18);transition:transform .25s cubic-bezier(.2,.8,.2,1),width .25s;opacity:0}.usa-clk-speed{position:relative;padding:8px 10px;border:0;background:none;color:inherit;font:inherit;cursor:pointer;border-radius:999px;font-variant-numeric:tabular-nums}.usa-clk-speed[aria-checked=true]{color:var(--usa-clk-accent)}@media (prefers-reduced-motion:reduce){.usa-clk-ink{transition:none}}";
|
|
7253
7254
|
|
|
7254
7255
|
function defineClockControl(tag = 'usa-clock-control') {
|
|
7255
7256
|
return base.defineElement(tag, (Base) => {
|
|
@@ -7308,10 +7309,10 @@ function defineClockControl(tag = 'usa-clock-control') {
|
|
|
7308
7309
|
}
|
|
7309
7310
|
}
|
|
7310
7311
|
return UsaClockControl;
|
|
7311
|
-
}, { id: 'clock-control', text: css$
|
|
7312
|
+
}, { id: 'clock-control', text: css$7 });
|
|
7312
7313
|
}
|
|
7313
7314
|
|
|
7314
|
-
var css$
|
|
7315
|
+
var css$6 = "usa-hydrate{display:block}";
|
|
7315
7316
|
|
|
7316
7317
|
function defineHydrate(tag = 'usa-hydrate') {
|
|
7317
7318
|
return base.defineElement(tag, (Base) => {
|
|
@@ -7347,12 +7348,12 @@ function defineHydrate(tag = 'usa-hydrate') {
|
|
|
7347
7348
|
}
|
|
7348
7349
|
}
|
|
7349
7350
|
return UsaHydrate;
|
|
7350
|
-
}, { id: 'hydrate', text: css$
|
|
7351
|
+
}, { id: 'hydrate', text: css$6 });
|
|
7351
7352
|
}
|
|
7352
7353
|
|
|
7353
|
-
var css$
|
|
7354
|
+
var css$5 = "usa-red-envelope{display:inline-block;--usa-re-w:150px;--usa-re-red:#dc2626;--usa-re-gold:#facc15}.usa-re{position:relative;display:block;width:var(--usa-re-w);height:calc(var(--usa-re-w)*1.35);padding:0;border:0;background:none;cursor:pointer;perspective:600px;font:600 14px/1.2 system-ui,sans-serif}.usa-re:focus-visible{outline:2px solid var(--usa-re-gold);outline-offset:4px;border-radius:12px}.usa-re-body{position:absolute;inset:0;border-radius:12px;background:linear-gradient(160deg,#ef4444,var(--usa-re-red) 60%,#b91c1c);box-shadow:0 12px 24px -12px rgba(127,29,29,.7);display:flex;align-items:flex-end;justify-content:center;padding-bottom:18%;z-index:2}.usa-re-msg{color:var(--usa-re-gold);font-size:calc(var(--usa-re-w)*.13);letter-spacing:.1em}.usa-re-flap{position:absolute;left:0;right:0;top:0;height:42%;border-radius:12px 12px 50% 50%/12px 12px 40% 40%;background:linear-gradient(#f87171,#dc2626);transform-origin:50% 0;z-index:3;display:grid;place-items:end center;box-shadow:0 4px 8px rgba(127,29,29,.35);transition:transform .45s ease-in-out}usa-red-envelope[data-open] .usa-re-flap{transform:rotateX(180deg);z-index:0;opacity:.85}.usa-re-seal{display:grid;place-items:center;width:30%;aspect-ratio:1;margin-bottom:-15%;border-radius:50%;background:var(--usa-re-gold);color:var(--usa-re-red);font-size:calc(var(--usa-re-w)*.14);font-weight:900;box-shadow:0 2px 6px rgba(0,0,0,.25)}usa-red-envelope[data-open] .usa-re-seal{visibility:hidden}.usa-re-card{position:absolute;left:8%;right:8%;top:6%;height:70%;border-radius:8px;background:#fff7ed;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;z-index:1;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}usa-red-envelope[data-open] .usa-re-card{transform:translateY(-46%);z-index:3;box-shadow:0 6px 14px -6px rgba(127,29,29,.5)}.usa-re-amt{color:var(--usa-re-red);font-size:calc(var(--usa-re-w)*.16);font-weight:900;font-variant-numeric:tabular-nums}.usa-re-from{font-size:11px;color:#92400e}.usa-re-coins{position:absolute;left:50%;top:40%;z-index:4}.usa-re-coins i{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fef08a,var(--usa-re-gold) 60%,#ca8a04);box-shadow:0 1px 3px rgba(0,0,0,.3)}.usa-re-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media (prefers-reduced-motion:reduce){.usa-re-flap,.usa-re-card{transition:none}}";
|
|
7354
7355
|
|
|
7355
|
-
const esc = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
7356
|
+
const esc$1 = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
7356
7357
|
function defineRedEnvelope(tag = 'usa-red-envelope') {
|
|
7357
7358
|
return base.defineElement(tag, (Base) => {
|
|
7358
7359
|
class UsaRedEnvelope extends Base {
|
|
@@ -7365,7 +7366,7 @@ function defineRedEnvelope(tag = 'usa-red-envelope') {
|
|
|
7365
7366
|
mount() {
|
|
7366
7367
|
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
7367
7368
|
const msg = this.str('message', '恭喜发财');
|
|
7368
|
-
this.insertAdjacentHTML('beforeend', `<button type="button" class="usa-re" aria-expanded="false" aria-label="${esc(`Open red envelope${this.str('from') ? ` from ${this.str('from')}` : ''}`)}" data-usa-part><span class="usa-re-card" aria-hidden="true"><span class="usa-re-amt"></span><span class="usa-re-from">${esc(this.str('from'))}</span></span><span class="usa-re-body"><span class="usa-re-msg">${esc(msg)}</span></span><span class="usa-re-flap"><span class="usa-re-seal">福</span></span><span class="usa-re-coins" aria-hidden="true"></span><span class="usa-re-live" aria-live="polite"></span></button>`);
|
|
7369
|
+
this.insertAdjacentHTML('beforeend', `<button type="button" class="usa-re" aria-expanded="false" aria-label="${esc$1(`Open red envelope${this.str('from') ? ` from ${this.str('from')}` : ''}`)}" data-usa-part><span class="usa-re-card" aria-hidden="true"><span class="usa-re-amt"></span><span class="usa-re-from">${esc$1(this.str('from'))}</span></span><span class="usa-re-body"><span class="usa-re-msg">${esc$1(msg)}</span></span><span class="usa-re-flap"><span class="usa-re-seal">福</span></span><span class="usa-re-coins" aria-hidden="true"></span><span class="usa-re-live" aria-live="polite"></span></button>`);
|
|
7369
7370
|
this.listen(this.querySelector('.usa-re'), 'click', () => (this.opened ? this.close() : this.open()));
|
|
7370
7371
|
if (this.flag('opened'))
|
|
7371
7372
|
this.open(true);
|
|
@@ -7414,10 +7415,10 @@ function defineRedEnvelope(tag = 'usa-red-envelope') {
|
|
|
7414
7415
|
}
|
|
7415
7416
|
}
|
|
7416
7417
|
return UsaRedEnvelope;
|
|
7417
|
-
}, { id: 'red-envelope', text: css$
|
|
7418
|
+
}, { id: 'red-envelope', text: css$5 });
|
|
7418
7419
|
}
|
|
7419
7420
|
|
|
7420
|
-
var css = "usa-festival-banner{position:relative;display:block;overflow:hidden;padding:18px 44px 18px 20px;border-radius:14px;color:#fff;font:700 15px/1.35 system-ui,sans-serif;isolation:isolate;background:linear-gradient(120deg,#b91c1c,#dc2626 55%,#ea580c)}usa-festival-banner[data-theme=xmas]{background:linear-gradient(120deg,#14532d,#166534 55%,#b91c1c)}usa-festival-banner[data-theme=halloween]{background:linear-gradient(120deg,#1e1b4b,#4c1d95 60%,#c2410c)}usa-festival-banner[data-theme=fireworks]{background:linear-gradient(120deg,#0f172a,#1e293b 60%,#312e81)}.usa-fb-scene{position:absolute;inset:0;z-index:-1;pointer-events:none}.usa-fb-scene i{position:absolute;display:block;font-style:normal;animation-play-state:paused}usa-festival-banner[data-live] .usa-fb-scene i{animation-play-state:running}.usa-fb-lantern{left:var(--x);top:-4px;width:18px;height:24px;border-radius:45%;background:radial-gradient(circle at 50% 40%,#fde68a,#f97316 45%,#b91c1c);box-shadow:0 0 14px rgba(251,191,36,.7);transform-origin:50% -10px;animation:usa-fb-sway 2.6s ease-in-out var(--d) infinite alternate}.usa-fb-lantern::after{content:\"\";position:absolute;left:50%;bottom:-8px;width:2px;height:8px;background:#facc15;transform:translateX(-50%)}@keyframes usa-fb-sway{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}.usa-fb-spark{left:var(--x);bottom:-6px;width:4px;height:4px;border-radius:50%;background:#fde047;box-shadow:0 0 6px #fde047;animation:usa-fb-rise 4s linear var(--d) infinite}@keyframes usa-fb-rise{from{transform:translateY(0);opacity:0}20%{opacity:1}to{transform:translateY(-90px);opacity:0}}.usa-fb-light{left:var(--x);top:3px;width:8px;height:11px;border-radius:50% 50% 45% 45%;background:#fde047;box-shadow:0 0 8px #fde047;animation:usa-fb-twinkle 1.2s ease-in-out var(--d) infinite alternate}.usa-fb-light:nth-child(3n){background:#f87171;box-shadow:0 0 8px #f87171}.usa-fb-light:nth-child(3n+1){background:#60a5fa;box-shadow:0 0 8px #60a5fa}@keyframes usa-fb-twinkle{from{opacity:.35}to{opacity:1}}.usa-fb-snow{left:var(--x);top:-8px;width:6px;height:6px;border-radius:50%;background:#fff;opacity:.85;animation:usa-fb-fall 6s linear var(--d) infinite}@keyframes usa-fb-fall{to{transform:translate(14px,120px)}}.usa-fb-moon{right:18%;top:10%;width:34px;height:34px;border-radius:50%;background:#fde68a;box-shadow:0 0 24px 6px rgba(253,230,138,.55);animation:usa-fb-glow 3s ease-in-out infinite alternate}@keyframes usa-fb-glow{to{box-shadow:0 0 34px 12px rgba(253,230,138,.75)}}.usa-fb-bat{left:-24px;top:var(--y);font-size:16px;animation:usa-fb-fly 7s linear var(--d) infinite}@keyframes usa-fb-fly{0%{transform:translate(0,0)}25%{transform:translate(28vw,-8px)}50%{transform:translate(56vw,6px)}100%{transform:translate(120vw,-4px)}}.usa-fb-rocket{left:var(--x);bottom:20%;width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 0 0 var(--c),14px 0 0 -1px var(--c),-14px 0 0 -1px var(--c),0 14px 0 -1px var(--c),0 -14px 0 -1px var(--c),10px 10px 0 -1px var(--c),-10px -10px 0 -1px var(--c),10px -10px 0 -1px var(--c),-10px 10px 0 -1px var(--c);animation:usa-fb-boom 2.4s ease-out var(--d) infinite}@keyframes usa-fb-boom{0%{transform:translateY(40px) scale(.1);opacity:0}30%{transform:translateY(0) scale(.2);opacity:1}60%{transform:scale(1.2);opacity:1}100%{transform:scale(1.5);opacity:0}}.usa-fb-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;font-size:18px;line-height:1;cursor:pointer}.usa-fb-x:focus-visible{outline:2px solid #fff;outline-offset:2px}@media (prefers-reduced-motion:reduce){.usa-fb-scene i{animation:none!important}}";
|
|
7421
|
+
var css$4 = "usa-festival-banner{position:relative;display:block;overflow:hidden;padding:18px 44px 18px 20px;border-radius:14px;color:#fff;font:700 15px/1.35 system-ui,sans-serif;isolation:isolate;background:linear-gradient(120deg,#b91c1c,#dc2626 55%,#ea580c)}usa-festival-banner[data-theme=xmas]{background:linear-gradient(120deg,#14532d,#166534 55%,#b91c1c)}usa-festival-banner[data-theme=halloween]{background:linear-gradient(120deg,#1e1b4b,#4c1d95 60%,#c2410c)}usa-festival-banner[data-theme=fireworks]{background:linear-gradient(120deg,#0f172a,#1e293b 60%,#312e81)}.usa-fb-scene{position:absolute;inset:0;z-index:-1;pointer-events:none}.usa-fb-scene i{position:absolute;display:block;font-style:normal;animation-play-state:paused}usa-festival-banner[data-live] .usa-fb-scene i{animation-play-state:running}.usa-fb-lantern{left:var(--x);top:-4px;width:18px;height:24px;border-radius:45%;background:radial-gradient(circle at 50% 40%,#fde68a,#f97316 45%,#b91c1c);box-shadow:0 0 14px rgba(251,191,36,.7);transform-origin:50% -10px;animation:usa-fb-sway 2.6s ease-in-out var(--d) infinite alternate}.usa-fb-lantern::after{content:\"\";position:absolute;left:50%;bottom:-8px;width:2px;height:8px;background:#facc15;transform:translateX(-50%)}@keyframes usa-fb-sway{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}.usa-fb-spark{left:var(--x);bottom:-6px;width:4px;height:4px;border-radius:50%;background:#fde047;box-shadow:0 0 6px #fde047;animation:usa-fb-rise 4s linear var(--d) infinite}@keyframes usa-fb-rise{from{transform:translateY(0);opacity:0}20%{opacity:1}to{transform:translateY(-90px);opacity:0}}.usa-fb-light{left:var(--x);top:3px;width:8px;height:11px;border-radius:50% 50% 45% 45%;background:#fde047;box-shadow:0 0 8px #fde047;animation:usa-fb-twinkle 1.2s ease-in-out var(--d) infinite alternate}.usa-fb-light:nth-child(3n){background:#f87171;box-shadow:0 0 8px #f87171}.usa-fb-light:nth-child(3n+1){background:#60a5fa;box-shadow:0 0 8px #60a5fa}@keyframes usa-fb-twinkle{from{opacity:.35}to{opacity:1}}.usa-fb-snow{left:var(--x);top:-8px;width:6px;height:6px;border-radius:50%;background:#fff;opacity:.85;animation:usa-fb-fall 6s linear var(--d) infinite}@keyframes usa-fb-fall{to{transform:translate(14px,120px)}}.usa-fb-moon{right:18%;top:10%;width:34px;height:34px;border-radius:50%;background:#fde68a;box-shadow:0 0 24px 6px rgba(253,230,138,.55);animation:usa-fb-glow 3s ease-in-out infinite alternate}@keyframes usa-fb-glow{to{box-shadow:0 0 34px 12px rgba(253,230,138,.75)}}.usa-fb-bat{left:-24px;top:var(--y);font-size:16px;animation:usa-fb-fly 7s linear var(--d) infinite}@keyframes usa-fb-fly{0%{transform:translate(0,0)}25%{transform:translate(28vw,-8px)}50%{transform:translate(56vw,6px)}100%{transform:translate(120vw,-4px)}}.usa-fb-rocket{left:var(--x);bottom:20%;width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 0 0 var(--c),14px 0 0 -1px var(--c),-14px 0 0 -1px var(--c),0 14px 0 -1px var(--c),0 -14px 0 -1px var(--c),10px 10px 0 -1px var(--c),-10px -10px 0 -1px var(--c),10px -10px 0 -1px var(--c),-10px 10px 0 -1px var(--c);animation:usa-fb-boom 2.4s ease-out var(--d) infinite}@keyframes usa-fb-boom{0%{transform:translateY(40px) scale(.1);opacity:0}30%{transform:translateY(0) scale(.2);opacity:1}60%{transform:scale(1.2);opacity:1}100%{transform:scale(1.5);opacity:0}}.usa-fb-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;font-size:18px;line-height:1;cursor:pointer}.usa-fb-x:focus-visible{outline:2px solid #fff;outline-offset:2px}@media (prefers-reduced-motion:reduce){.usa-fb-scene i{animation:none!important}}";
|
|
7421
7422
|
|
|
7422
7423
|
const FESTIVAL_THEMES = ['lunar', 'xmas', 'halloween', 'fireworks'];
|
|
7423
7424
|
const SCENES = {
|
|
@@ -7465,7 +7466,304 @@ function defineFestivalBanner(tag = 'usa-festival-banner') {
|
|
|
7465
7466
|
}
|
|
7466
7467
|
}
|
|
7467
7468
|
return UsaFestivalBanner;
|
|
7468
|
-
}, { id: 'festival-banner', text: css });
|
|
7469
|
+
}, { id: 'festival-banner', text: css$4 });
|
|
7470
|
+
}
|
|
7471
|
+
|
|
7472
|
+
var css$3 = "usa-terminal{display:block;width:var(--usa-term-w,100%);max-width:100%;--usa-term-bg:#0f172a;--usa-term-fg:#e2e8f0;--usa-term-accent:#22c55e}usa-terminal[data-theme=green]{--usa-term-bg:#03140a;--usa-term-fg:#4ade80;--usa-term-accent:#86efac}usa-terminal[data-theme=amber]{--usa-term-bg:#1a1003;--usa-term-fg:#fbbf24;--usa-term-accent:#fde68a}.usa-term{border-radius:10px;overflow:hidden;background:var(--usa-term-bg);color:var(--usa-term-fg);box-shadow:0 16px 36px -18px rgba(0,0,0,.6);font:500 12.5px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}usa-terminal[data-theme=green] .usa-term,usa-terminal[data-theme=amber] .usa-term{text-shadow:0 0 6px currentColor}.usa-term-bar{display:flex;align-items:center;gap:6px;padding:8px 10px;background:rgba(255,255,255,.06)}.usa-term-bar i{width:10px;height:10px;border-radius:50%;background:#ef4444}.usa-term-bar i:nth-child(2){background:#f59e0b}.usa-term-bar i:nth-child(3){background:#22c55e}.usa-term-bar span{flex:1;text-align:center;margin-right:40px;opacity:.6;font-size:11px}.usa-term-body{min-height:var(--usa-term-h,120px);padding:10px 12px 12px}.usa-term-body p{margin:0;white-space:pre-wrap;word-break:break-word}.usa-term-ps{color:var(--usa-term-accent)}.usa-term-out{opacity:.8}.usa-term-cursor{display:inline-block;width:.6em;height:1.15em;margin-left:1px;vertical-align:text-bottom;background:currentColor;animation:usa-term-blink 1s steps(1) infinite}@keyframes usa-term-blink{50%{opacity:0}}@media (prefers-reduced-motion:reduce){.usa-term-cursor{animation:none}}";
|
|
7473
|
+
|
|
7474
|
+
const esc = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c]);
|
|
7475
|
+
function defineTerminal(tag = 'usa-terminal') {
|
|
7476
|
+
return base.defineElement(tag, (Base) => {
|
|
7477
|
+
class UsaTerminal extends Base {
|
|
7478
|
+
constructor() {
|
|
7479
|
+
super(...arguments);
|
|
7480
|
+
this._lines = [];
|
|
7481
|
+
this._timer = 0;
|
|
7482
|
+
this._run = 0;
|
|
7483
|
+
}
|
|
7484
|
+
static get observedAttributes() {
|
|
7485
|
+
return ['title', 'prompt', 'theme', 'speed'];
|
|
7486
|
+
}
|
|
7487
|
+
mount() {
|
|
7488
|
+
const src = Array.from(this.children).filter((c) => !c.hasAttribute('data-usa-part'));
|
|
7489
|
+
if (src.length)
|
|
7490
|
+
this._lines = src.map((c) => ({ cmd: c.hasAttribute('data-cmd'), text: (c.textContent || '').replace(/\s+$/, '') }));
|
|
7491
|
+
src.forEach((c) => c.remove());
|
|
7492
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
7493
|
+
this.setAttribute('data-theme', ['green', 'amber'].includes(this.str('theme')) ? this.str('theme') : 'dark');
|
|
7494
|
+
this.insertAdjacentHTML('beforeend', `<div class="usa-term" data-usa-part><div class="usa-term-bar" aria-hidden="true"><i></i><i></i><i></i><span>${esc(this.str('title', 'terminal'))}</span></div><div class="usa-term-body" role="log" aria-label="${esc(this.str('title', 'Terminal'))}"></div></div>`);
|
|
7495
|
+
let started = false;
|
|
7496
|
+
this.inView((v) => {
|
|
7497
|
+
if (v && !started) {
|
|
7498
|
+
started = true;
|
|
7499
|
+
this.replay();
|
|
7500
|
+
}
|
|
7501
|
+
}, { threshold: 0.3 });
|
|
7502
|
+
this.onCleanup(() => clearTimeout(this._timer));
|
|
7503
|
+
}
|
|
7504
|
+
line(l) {
|
|
7505
|
+
const body = this.querySelector('.usa-term-body');
|
|
7506
|
+
const p = document.createElement('p');
|
|
7507
|
+
p.className = l.cmd ? 'usa-term-cmd' : 'usa-term-out';
|
|
7508
|
+
if (l.cmd)
|
|
7509
|
+
p.innerHTML = `<span class="usa-term-ps" aria-hidden="true">${esc(this.str('prompt', '$'))} </span><span class="usa-term-tx"></span>`;
|
|
7510
|
+
body.appendChild(p);
|
|
7511
|
+
return p;
|
|
7512
|
+
}
|
|
7513
|
+
/** Clear and type everything again. */
|
|
7514
|
+
replay() {
|
|
7515
|
+
clearTimeout(this._timer);
|
|
7516
|
+
const run = ++this._run;
|
|
7517
|
+
const body = this.querySelector('.usa-term-body');
|
|
7518
|
+
if (!body)
|
|
7519
|
+
return;
|
|
7520
|
+
body.textContent = '';
|
|
7521
|
+
if (this.reduced)
|
|
7522
|
+
return this.skip();
|
|
7523
|
+
const speed = Math.max(5, this.num('speed', 45));
|
|
7524
|
+
let i = 0;
|
|
7525
|
+
const next = () => {
|
|
7526
|
+
if (run !== this._run || !this.isConnected)
|
|
7527
|
+
return;
|
|
7528
|
+
body.querySelectorAll('.usa-term-cursor').forEach((c) => c.remove());
|
|
7529
|
+
const l = this._lines[i++];
|
|
7530
|
+
if (!l) {
|
|
7531
|
+
const last = this.line({ cmd: true, text: '' });
|
|
7532
|
+
last.insertAdjacentHTML('beforeend', '<span class="usa-term-cursor" aria-hidden="true"></span>');
|
|
7533
|
+
this.emit('done');
|
|
7534
|
+
if (this.flag('loop'))
|
|
7535
|
+
this._timer = setTimeout(() => this.replay(), 2500);
|
|
7536
|
+
return;
|
|
7537
|
+
}
|
|
7538
|
+
const p = this.line(l);
|
|
7539
|
+
if (!l.cmd) {
|
|
7540
|
+
p.textContent = l.text;
|
|
7541
|
+
this.motion(p, [{ opacity: 0 }, { opacity: 1 }], { duration: 150 });
|
|
7542
|
+
this._timer = setTimeout(next, 120);
|
|
7543
|
+
return;
|
|
7544
|
+
}
|
|
7545
|
+
const tx = p.querySelector('.usa-term-tx');
|
|
7546
|
+
const cur = document.createElement('span');
|
|
7547
|
+
cur.className = 'usa-term-cursor';
|
|
7548
|
+
cur.setAttribute('aria-hidden', 'true');
|
|
7549
|
+
p.appendChild(cur);
|
|
7550
|
+
let k = 0;
|
|
7551
|
+
const type = () => {
|
|
7552
|
+
if (run !== this._run)
|
|
7553
|
+
return;
|
|
7554
|
+
tx.textContent = l.text.slice(0, ++k);
|
|
7555
|
+
if (k < l.text.length)
|
|
7556
|
+
this._timer = setTimeout(type, speed * (0.6 + Math.random() * 0.8));
|
|
7557
|
+
else
|
|
7558
|
+
this._timer = setTimeout(next, 350);
|
|
7559
|
+
};
|
|
7560
|
+
this._timer = setTimeout(type, 250);
|
|
7561
|
+
};
|
|
7562
|
+
next();
|
|
7563
|
+
}
|
|
7564
|
+
/** Show every line at once. */
|
|
7565
|
+
skip() {
|
|
7566
|
+
clearTimeout(this._timer);
|
|
7567
|
+
this._run++;
|
|
7568
|
+
const body = this.querySelector('.usa-term-body');
|
|
7569
|
+
if (!body)
|
|
7570
|
+
return;
|
|
7571
|
+
body.textContent = '';
|
|
7572
|
+
for (const l of this._lines) {
|
|
7573
|
+
const p = this.line(l);
|
|
7574
|
+
if (l.cmd)
|
|
7575
|
+
p.querySelector('.usa-term-tx').textContent = l.text;
|
|
7576
|
+
else
|
|
7577
|
+
p.textContent = l.text;
|
|
7578
|
+
}
|
|
7579
|
+
this.emit('done');
|
|
7580
|
+
}
|
|
7581
|
+
}
|
|
7582
|
+
return UsaTerminal;
|
|
7583
|
+
}, { id: 'terminal', text: css$3 });
|
|
7584
|
+
}
|
|
7585
|
+
|
|
7586
|
+
var css$2 = "usa-retro-button{display:inline-block}.usa-rb{font:700 14px/1 system-ui,sans-serif;cursor:pointer;color:inherit}.usa-rb:disabled{opacity:.5;cursor:not-allowed}usa-retro-button[data-variant=pixel] .usa-rb{padding:10px 16px;border:0;background:#f43f5e;color:#fff;font-family:ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;box-shadow:3px 0 0 #111,-3px 0 0 #111,0 3px 0 #111,0 -3px 0 #111,6px 6px 0 #111;image-rendering:pixelated}usa-retro-button[data-variant=pixel] .usa-rb:focus-visible{outline:3px dashed #111;outline-offset:6px}usa-retro-button[data-variant=crt] .usa-rb{padding:10px 18px;border:2px solid #22c55e;border-radius:4px;background:#03140a;color:#4ade80;font-family:ui-monospace,Menlo,monospace;text-shadow:0 0 6px #4ade80;box-shadow:0 0 10px rgba(74,222,128,.45),inset 0 0 12px rgba(74,222,128,.25);background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px)}usa-retro-button[data-variant=crt] .usa-rb:focus-visible{outline:2px solid #86efac;outline-offset:3px}usa-retro-button[data-variant=y2k] .usa-rb{padding:11px 22px;border:1px solid rgba(255,255,255,.7);border-radius:999px;color:#1e1b4b;background:linear-gradient(180deg,#f8fafc 0%,#c7d2fe 45%,#818cf8 52%,#e0e7ff 100%);box-shadow:0 6px 14px -6px rgba(79,70,229,.6),inset 0 1px 0 #fff;text-shadow:0 1px 0 rgba(255,255,255,.7)}usa-retro-button[data-variant=y2k] .usa-rb:focus-visible{outline:2px solid #6366f1;outline-offset:3px}usa-retro-button[data-variant=win95] .usa-rb{padding:7px 16px;border:0;border-radius:0;background:#c0c0c0;color:#000;font:400 13px/1 Tahoma,Verdana,sans-serif;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px #808080,inset 2px 2px #dfdfdf}usa-retro-button[data-variant=win95] .usa-rb:active{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px #808080}usa-retro-button[data-variant=win95] .usa-rb:focus-visible{outline:1px dotted #000;outline-offset:-4px}";
|
|
7587
|
+
|
|
7588
|
+
const RETRO_VARIANTS = ['pixel', 'crt', 'y2k', 'win95'];
|
|
7589
|
+
function defineRetroButton(tag = 'usa-retro-button') {
|
|
7590
|
+
return base.defineElement(tag, (Base) => {
|
|
7591
|
+
class UsaRetroButton extends Base {
|
|
7592
|
+
static get observedAttributes() {
|
|
7593
|
+
return ['variant', 'disabled'];
|
|
7594
|
+
}
|
|
7595
|
+
get button() {
|
|
7596
|
+
return this.querySelector('.usa-rb');
|
|
7597
|
+
}
|
|
7598
|
+
get variant() {
|
|
7599
|
+
const v = this.str('variant', 'pixel');
|
|
7600
|
+
return RETRO_VARIANTS.includes(v) ? v : 'pixel';
|
|
7601
|
+
}
|
|
7602
|
+
set variant(v) {
|
|
7603
|
+
this.setAttribute('variant', v);
|
|
7604
|
+
}
|
|
7605
|
+
mount() {
|
|
7606
|
+
let btn = this.button;
|
|
7607
|
+
if (!btn) {
|
|
7608
|
+
btn = document.createElement('button');
|
|
7609
|
+
btn.className = 'usa-rb';
|
|
7610
|
+
btn.setAttribute('data-usa-part', '');
|
|
7611
|
+
while (this.firstChild)
|
|
7612
|
+
btn.appendChild(this.firstChild);
|
|
7613
|
+
this.appendChild(btn);
|
|
7614
|
+
}
|
|
7615
|
+
btn.type = this.str('type', 'button') || 'button';
|
|
7616
|
+
btn.disabled = this.flag('disabled');
|
|
7617
|
+
for (const a of ['name', 'value'])
|
|
7618
|
+
if (this.hasAttribute(a))
|
|
7619
|
+
btn.setAttribute(a, this.str(a));
|
|
7620
|
+
this.setAttribute('data-variant', this.variant);
|
|
7621
|
+
const b = btn;
|
|
7622
|
+
this.listen(b, 'pointerdown', () => this.press(b));
|
|
7623
|
+
this.listen(b, 'keydown', (e) => (e.key === 'Enter' || e.key === ' ') && !e.repeat && this.press(b));
|
|
7624
|
+
}
|
|
7625
|
+
press(b) {
|
|
7626
|
+
if (this.reduced || b.hasAttribute('disabled'))
|
|
7627
|
+
return;
|
|
7628
|
+
const v = this.variant;
|
|
7629
|
+
if (v === 'pixel')
|
|
7630
|
+
this.motion(b, [{ transform: 'none' }, { transform: 'translate(3px,3px)' }, { transform: 'translate(3px,3px)', offset: 0.6 }, { transform: 'none' }], { duration: 260, easing: 'steps(3, end)' });
|
|
7631
|
+
else if (v === 'crt')
|
|
7632
|
+
this.motion(b, [{ filter: 'brightness(1)' }, { filter: 'brightness(1.8)' }, { filter: 'brightness(.7)' }, { filter: 'brightness(1.4)' }, { filter: 'brightness(1)' }], { duration: 300, easing: 'steps(4, end)' });
|
|
7633
|
+
else if (v === 'y2k')
|
|
7634
|
+
this.motion(b, [{ transform: 'scale(1)' }, { transform: 'scale(.92)' }, { transform: 'scale(1.06)' }, { transform: 'scale(1)' }], { duration: 420, easing: 'cubic-bezier(.3,1.5,.5,1)' });
|
|
7635
|
+
else
|
|
7636
|
+
this.motion(b, [{ transform: 'none' }, { transform: 'translate(1px,1px)' }, { transform: 'none' }], { duration: 180 });
|
|
7637
|
+
}
|
|
7638
|
+
}
|
|
7639
|
+
return UsaRetroButton;
|
|
7640
|
+
}, { id: 'retro-button', text: css$2 });
|
|
7641
|
+
}
|
|
7642
|
+
|
|
7643
|
+
var css$1 = "usa-organic-card{position:relative;display:block;padding:22px 24px;color:#0f172a;background:linear-gradient(140deg,#d9f99d,#86efac 55%,#34d399);box-shadow:0 18px 36px -22px rgba(22,101,52,.7);transition:box-shadow .3s;outline:none}usa-organic-card[data-tint=ocean]{background:linear-gradient(140deg,#bae6fd,#7dd3fc 50%,#38bdf8);box-shadow:0 18px 36px -22px rgba(3,105,161,.7)}usa-organic-card[data-tint=petal]{background:linear-gradient(140deg,#fbcfe8,#f9a8d4 50%,#f472b6);box-shadow:0 18px 36px -22px rgba(157,23,77,.6)}usa-organic-card[data-tint=sand]{background:linear-gradient(140deg,#fef3c7,#fde68a 50%,#fbbf24);box-shadow:0 18px 36px -22px rgba(146,64,14,.6)}usa-organic-card:hover{box-shadow:0 24px 44px -20px rgba(15,23,42,.45)}usa-organic-card:focus-within{box-shadow:0 0 0 3px rgba(15,23,42,.25),0 24px 44px -20px rgba(15,23,42,.45)}";
|
|
7644
|
+
|
|
7645
|
+
function defineOrganicCard(tag = 'usa-organic-card') {
|
|
7646
|
+
return base.defineElement(tag, (Base) => {
|
|
7647
|
+
class UsaOrganicCard extends Base {
|
|
7648
|
+
constructor() {
|
|
7649
|
+
super(...arguments);
|
|
7650
|
+
this._seed = 1;
|
|
7651
|
+
this._loop = null;
|
|
7652
|
+
}
|
|
7653
|
+
static get observedAttributes() {
|
|
7654
|
+
return ['tint', 'seed'];
|
|
7655
|
+
}
|
|
7656
|
+
mount() {
|
|
7657
|
+
this._seed = this.num('seed', 1);
|
|
7658
|
+
this.setAttribute('data-tint', ['ocean', 'petal', 'sand'].includes(this.str('tint')) ? this.str('tint') : 'leaf');
|
|
7659
|
+
this.style.borderRadius = components_fxOrganic.blobRadius(this._seed);
|
|
7660
|
+
this.inView((v) => {
|
|
7661
|
+
this._loop?.cancel();
|
|
7662
|
+
this._loop = null;
|
|
7663
|
+
if (!v || this.reduced)
|
|
7664
|
+
return;
|
|
7665
|
+
const frames = [0, 1, 2, 0].map((k, i) => ({ borderRadius: components_fxOrganic.blobRadius(this._seed + k), offset: i / 3 }));
|
|
7666
|
+
this._loop = this.motion(this, frames, { duration: 9000, iterations: Infinity, easing: 'ease-in-out' });
|
|
7667
|
+
});
|
|
7668
|
+
this.listen(this, 'pointerenter', () => this.morph(this._seed + 7));
|
|
7669
|
+
this.listen(this, 'pointerleave', () => this.morph(this._seed));
|
|
7670
|
+
this.onCleanup(() => this._loop?.cancel());
|
|
7671
|
+
}
|
|
7672
|
+
/** Morph to the blob shape of `seed` (random when omitted). */
|
|
7673
|
+
morph(seed = Math.random() * 100) {
|
|
7674
|
+
const to = components_fxOrganic.blobRadius(seed);
|
|
7675
|
+
const from = this.style.borderRadius || to;
|
|
7676
|
+
this.style.borderRadius = to;
|
|
7677
|
+
if (!this.reduced)
|
|
7678
|
+
this.motion(this, [{ borderRadius: from }, { borderRadius: to }], { duration: 700, easing: 'cubic-bezier(.3,1.3,.5,1)', composite: 'replace' });
|
|
7679
|
+
}
|
|
7680
|
+
}
|
|
7681
|
+
return UsaOrganicCard;
|
|
7682
|
+
}, { id: 'organic-card', text: css$1 });
|
|
7683
|
+
}
|
|
7684
|
+
|
|
7685
|
+
var css = "usa-liquid-nav{position:relative;display:inline-flex;align-items:center;gap:4px;padding:8px 10px 18px;border-radius:18px;background:var(--usa-lq-bg,#0f172a);color:#e2e8f0;font:600 13px/1 system-ui,sans-serif;--usa-lq-accent:#38bdf8}.usa-lq-defs{position:absolute}.usa-lq-goo{position:absolute;left:0;right:0;bottom:4px;height:14px;pointer-events:none}.usa-lq-goo i{position:absolute;left:-6px;top:1px;width:12px;height:12px;border-radius:50%;background:var(--usa-lq-accent)}.usa-lq-tail{width:9px!important;height:9px!important;left:-4.5px!important;top:2.5px!important}.usa-lq-item{position:relative;padding:8px 12px;border:0;border-radius:10px;background:none;color:inherit;font:inherit;text-decoration:none;cursor:pointer;opacity:.7;transition:opacity .2s,color .2s}.usa-lq-item[aria-current]{opacity:1;color:var(--usa-lq-accent)}.usa-lq-item:focus-visible{outline:2px solid var(--usa-lq-accent);outline-offset:1px;opacity:1}";
|
|
7686
|
+
|
|
7687
|
+
let uid = 0;
|
|
7688
|
+
function defineLiquidNav(tag = 'usa-liquid-nav') {
|
|
7689
|
+
return base.defineElement(tag, (Base) => {
|
|
7690
|
+
class UsaLiquidNav extends Base {
|
|
7691
|
+
constructor() {
|
|
7692
|
+
super(...arguments);
|
|
7693
|
+
this._i = 0;
|
|
7694
|
+
this._id = `usa-lq-${++uid}`;
|
|
7695
|
+
}
|
|
7696
|
+
static get observedAttributes() {
|
|
7697
|
+
return ['label'];
|
|
7698
|
+
}
|
|
7699
|
+
items() {
|
|
7700
|
+
return Array.from(this.children).filter((c) => !c.hasAttribute('data-usa-part'));
|
|
7701
|
+
}
|
|
7702
|
+
get value() {
|
|
7703
|
+
return this._i;
|
|
7704
|
+
}
|
|
7705
|
+
set value(i) {
|
|
7706
|
+
this.select(i, false);
|
|
7707
|
+
}
|
|
7708
|
+
mount() {
|
|
7709
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
7710
|
+
this.setAttribute('role', 'navigation');
|
|
7711
|
+
this.setAttribute('aria-label', this.str('label', 'Main'));
|
|
7712
|
+
this.insertAdjacentHTML('afterbegin', `<svg class="usa-lq-defs" aria-hidden="true" width="0" height="0" data-usa-part><filter id="${this._id}"><feGaussianBlur in="SourceGraphic" stdDeviation="5"/><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 20 -9"/></filter></svg><span class="usa-lq-goo" aria-hidden="true" style="filter:url(#${this._id})" data-usa-part><i class="usa-lq-drop"></i><i class="usa-lq-tail"></i></span>`);
|
|
7713
|
+
const items = this.items();
|
|
7714
|
+
const cur = items.findIndex((it) => it.getAttribute('aria-current') === 'page' || it.hasAttribute('data-active'));
|
|
7715
|
+
this._i = cur >= 0 ? cur : Math.max(0, Math.min(items.length - 1, Math.round(this.num('value', 0))));
|
|
7716
|
+
items.forEach((it, i) => {
|
|
7717
|
+
it.classList.add('usa-lq-item');
|
|
7718
|
+
this.listen(it, 'click', () => this.select(i, true));
|
|
7719
|
+
this.listen(it, 'keydown', (e) => {
|
|
7720
|
+
const d = e.key === 'ArrowRight' ? 1 : e.key === 'ArrowLeft' ? -1 : 0;
|
|
7721
|
+
if (!d)
|
|
7722
|
+
return;
|
|
7723
|
+
e.preventDefault();
|
|
7724
|
+
items[(i + d + items.length) % items.length].focus();
|
|
7725
|
+
});
|
|
7726
|
+
});
|
|
7727
|
+
requestAnimationFrame(() => this.place(false));
|
|
7728
|
+
this.place(false);
|
|
7729
|
+
this.listen(window, 'resize', () => this.place(false));
|
|
7730
|
+
}
|
|
7731
|
+
select(i, user) {
|
|
7732
|
+
const items = this.items();
|
|
7733
|
+
if (!items[i] || (i === this._i && user))
|
|
7734
|
+
return;
|
|
7735
|
+
const from = this._i;
|
|
7736
|
+
this._i = i;
|
|
7737
|
+
this.place(user && !this.reduced, from);
|
|
7738
|
+
if (user)
|
|
7739
|
+
this.emit('change', { index: i, item: items[i] });
|
|
7740
|
+
}
|
|
7741
|
+
place(animate, from = this._i) {
|
|
7742
|
+
const items = this.items();
|
|
7743
|
+
items.forEach((it, k) => {
|
|
7744
|
+
if (k === this._i)
|
|
7745
|
+
it.setAttribute('aria-current', 'page');
|
|
7746
|
+
else
|
|
7747
|
+
it.removeAttribute('aria-current');
|
|
7748
|
+
});
|
|
7749
|
+
const it = items[this._i];
|
|
7750
|
+
const drop = this.querySelector('.usa-lq-drop');
|
|
7751
|
+
const tail = this.querySelector('.usa-lq-tail');
|
|
7752
|
+
if (!it || !drop || !tail)
|
|
7753
|
+
return;
|
|
7754
|
+
const x = it.offsetLeft + it.offsetWidth / 2;
|
|
7755
|
+
const px = items[from] ? items[from].offsetLeft + items[from].offsetWidth / 2 : x;
|
|
7756
|
+
drop.style.transform = `translateX(${x}px)`;
|
|
7757
|
+
tail.style.transform = `translateX(${x}px)`;
|
|
7758
|
+
if (!animate || px === x)
|
|
7759
|
+
return;
|
|
7760
|
+
const dir = Math.sign(x - px);
|
|
7761
|
+
this.motion(drop, [{ transform: `translateX(${px}px) scale(1)` }, { transform: `translateX(${px + (x - px) * 0.6}px) scale(1.35, .8)`, offset: 0.45 }, { transform: `translateX(${x + dir * 4}px) scale(.9, 1.12)`, offset: 0.75 }, { transform: `translateX(${x}px) scale(1)` }], { duration: 620, easing: 'cubic-bezier(.4,0,.2,1)' });
|
|
7762
|
+
this.motion(tail, [{ transform: `translateX(${px}px) scale(1)` }, { transform: `translateX(${px + (x - px) * 0.25}px) scale(.7)`, offset: 0.5 }, { transform: `translateX(${x}px) scale(.9)`, offset: 0.85 }, { transform: `translateX(${x}px) scale(1)` }], { duration: 760, easing: 'cubic-bezier(.4,0,.2,1)' });
|
|
7763
|
+
}
|
|
7764
|
+
}
|
|
7765
|
+
return UsaLiquidNav;
|
|
7766
|
+
}, { id: 'liquid-nav', text: css });
|
|
7469
7767
|
}
|
|
7470
7768
|
|
|
7471
7769
|
/**
|
|
@@ -7501,6 +7799,8 @@ const WIDGETS = {
|
|
|
7501
7799
|
'7.9': { 'usa-command-palette': defineCommandPalette, 'usa-shortcut': defineShortcut },
|
|
7502
7800
|
'8.0': { 'usa-clock-control': defineClockControl, 'usa-hydrate': defineHydrate },
|
|
7503
7801
|
'8.1': { 'usa-red-envelope': defineRedEnvelope, 'usa-festival-banner': defineFestivalBanner },
|
|
7802
|
+
'8.2': { 'usa-terminal': defineTerminal, 'usa-retro-button': defineRetroButton },
|
|
7803
|
+
'8.3': { 'usa-organic-card': defineOrganicCard, 'usa-liquid-nav': defineLiquidNav },
|
|
7504
7804
|
};
|
|
7505
7805
|
/** Every widget tag, in release order. */
|
|
7506
7806
|
const WIDGET_TAGS = Object.values(WIDGETS).flatMap((g) => Object.keys(g));
|
|
@@ -7520,6 +7820,7 @@ exports.MODAL_EFFECTS = MODAL_EFFECTS;
|
|
|
7520
7820
|
exports.NAV_INDICATORS = NAV_INDICATORS;
|
|
7521
7821
|
exports.PRESENCE_STATES = PRESENCE_STATES;
|
|
7522
7822
|
exports.PROGRESS_VARIANTS = PROGRESS_VARIANTS;
|
|
7823
|
+
exports.RETRO_VARIANTS = RETRO_VARIANTS;
|
|
7523
7824
|
exports.SEGMENTED_VARIANTS = SEGMENTED_VARIANTS;
|
|
7524
7825
|
exports.SHEET_SIDES = SHEET_SIDES;
|
|
7525
7826
|
exports.SKELETON_VARIANTS = SKELETON_VARIANTS;
|
|
@@ -7560,6 +7861,7 @@ exports.defineKanban = defineKanban;
|
|
|
7560
7861
|
exports.defineKeyframeEditor = defineKeyframeEditor;
|
|
7561
7862
|
exports.defineKpi = defineKpi;
|
|
7562
7863
|
exports.defineLeaderboard = defineLeaderboard;
|
|
7864
|
+
exports.defineLiquidNav = defineLiquidNav;
|
|
7563
7865
|
exports.defineLocationCard = defineLocationCard;
|
|
7564
7866
|
exports.defineLyrics = defineLyrics;
|
|
7565
7867
|
exports.defineMasonryFlow = defineMasonryFlow;
|
|
@@ -7572,6 +7874,7 @@ exports.defineMusicPlayer = defineMusicPlayer;
|
|
|
7572
7874
|
exports.defineNavMorph = defineNavMorph;
|
|
7573
7875
|
exports.defineNotificationBell = defineNotificationBell;
|
|
7574
7876
|
exports.defineOdometer = defineOdometer;
|
|
7877
|
+
exports.defineOrganicCard = defineOrganicCard;
|
|
7575
7878
|
exports.defineOtp = defineOtp;
|
|
7576
7879
|
exports.definePagination = definePagination;
|
|
7577
7880
|
exports.definePresence = definePresence;
|
|
@@ -7581,6 +7884,7 @@ exports.defineProgressRing = defineProgressRing;
|
|
|
7581
7884
|
exports.definePullCord = definePullCord;
|
|
7582
7885
|
exports.defineReactions = defineReactions;
|
|
7583
7886
|
exports.defineRedEnvelope = defineRedEnvelope;
|
|
7887
|
+
exports.defineRetroButton = defineRetroButton;
|
|
7584
7888
|
exports.defineSegmented = defineSegmented;
|
|
7585
7889
|
exports.defineSheet = defineSheet;
|
|
7586
7890
|
exports.defineShortcut = defineShortcut;
|
|
@@ -7593,6 +7897,7 @@ exports.defineSuggestionChips = defineSuggestionChips;
|
|
|
7593
7897
|
exports.defineSwipeDeck = defineSwipeDeck;
|
|
7594
7898
|
exports.defineSwitch = defineSwitch;
|
|
7595
7899
|
exports.defineTabBar = defineTabBar;
|
|
7900
|
+
exports.defineTerminal = defineTerminal;
|
|
7596
7901
|
exports.defineTip = defineTip;
|
|
7597
7902
|
exports.defineToastStack = defineToastStack;
|
|
7598
7903
|
exports.defineUploadProgress = defineUploadProgress;
|