use-scroll-animate 7.4.0 → 7.5.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 +20 -0
- package/dist/components/fx-game.cjs +127 -0
- package/dist/components/fx-game.cjs.map +1 -0
- package/dist/components/fx-game.d.cts +70 -0
- package/dist/components/fx-game.d.ts +70 -0
- package/dist/components/fx-game.js +123 -0
- package/dist/components/fx-game.js.map +1 -0
- package/dist/components/fx2.cjs +6 -0
- package/dist/components/fx2.cjs.map +1 -1
- package/dist/components/fx2.d.cts +27 -1
- package/dist/components/fx2.d.ts +27 -1
- package/dist/components/fx2.js +5 -1
- package/dist/components/fx2.js.map +1 -1
- package/dist/components/widgets.cjs +467 -93
- package/dist/components/widgets.cjs.map +1 -1
- package/dist/components/widgets.d.cts +92 -2
- package/dist/components/widgets.d.ts +92 -2
- package/dist/components/widgets.js +460 -94
- 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 +1 -1
- package/docs/components.md +24 -0
- package/package.json +21 -1
|
@@ -45,7 +45,7 @@ function arrowIndex(e, i, n, vertical = false) {
|
|
|
45
45
|
return -1;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
var css$
|
|
48
|
+
var css$N = "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}";
|
|
49
49
|
|
|
50
50
|
const CAROUSEL_EFFECTS = ['slide', 'fade', 'scale', 'cards'];
|
|
51
51
|
function defineCarousel(tag = 'usa-carousel') {
|
|
@@ -234,10 +234,10 @@ function defineCarousel(tag = 'usa-carousel') {
|
|
|
234
234
|
}
|
|
235
235
|
}
|
|
236
236
|
return UsaCarousel;
|
|
237
|
-
}, { id: 'carousel', text: css$
|
|
237
|
+
}, { id: 'carousel', text: css$N });
|
|
238
238
|
}
|
|
239
239
|
|
|
240
|
-
var css$
|
|
240
|
+
var css$M = "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}";
|
|
241
241
|
|
|
242
242
|
const TAB_INDICATORS = ['pill', 'underline', 'glow', 'gooey'];
|
|
243
243
|
function defineTabBar(tag = 'usa-tab-bar') {
|
|
@@ -350,10 +350,10 @@ function defineTabBar(tag = 'usa-tab-bar') {
|
|
|
350
350
|
}
|
|
351
351
|
}
|
|
352
352
|
return UsaTabBar;
|
|
353
|
-
}, { id: 'tab-bar', text: css$
|
|
353
|
+
}, { id: 'tab-bar', text: css$M });
|
|
354
354
|
}
|
|
355
355
|
|
|
356
|
-
var css$
|
|
356
|
+
var css$L = "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}}";
|
|
357
357
|
|
|
358
358
|
function defineDisclosure(tag = 'usa-disclosure') {
|
|
359
359
|
return base.defineElement(tag, (Base) => {
|
|
@@ -421,10 +421,10 @@ function defineDisclosure(tag = 'usa-disclosure') {
|
|
|
421
421
|
}
|
|
422
422
|
}
|
|
423
423
|
return UsaDisclosure;
|
|
424
|
-
}, { id: 'disclosure', text: css$
|
|
424
|
+
}, { id: 'disclosure', text: css$L });
|
|
425
425
|
}
|
|
426
426
|
|
|
427
|
-
var css$
|
|
427
|
+
var css$K = "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}}";
|
|
428
428
|
|
|
429
429
|
function defineStories(tag = 'usa-stories') {
|
|
430
430
|
return base.defineElement(tag, (Base) => {
|
|
@@ -557,10 +557,10 @@ function defineStories(tag = 'usa-stories') {
|
|
|
557
557
|
}
|
|
558
558
|
}
|
|
559
559
|
return UsaStories;
|
|
560
|
-
}, { id: 'stories', text: css$
|
|
560
|
+
}, { id: 'stories', text: css$K });
|
|
561
561
|
}
|
|
562
562
|
|
|
563
|
-
var css$
|
|
563
|
+
var css$J = "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)}}";
|
|
564
564
|
|
|
565
565
|
const MODAL_EFFECTS = ['scale', 'slide-up', 'flip', 'origin'];
|
|
566
566
|
const SHEET_SIDES = ['right', 'left', 'bottom', 'top'];
|
|
@@ -787,12 +787,12 @@ function defineOverlay(tag, kind) {
|
|
|
787
787
|
}
|
|
788
788
|
}
|
|
789
789
|
return UsaOverlay;
|
|
790
|
-
}, { id: 'overlay', text: css$
|
|
790
|
+
}, { id: 'overlay', text: css$J });
|
|
791
791
|
}
|
|
792
792
|
const defineModal = (tag = 'usa-modal') => defineOverlay(tag, 'modal');
|
|
793
793
|
const defineSheet = (tag = 'usa-sheet') => defineOverlay(tag, 'sheet');
|
|
794
794
|
|
|
795
|
-
var css$
|
|
795
|
+
var css$I = "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}}";
|
|
796
796
|
|
|
797
797
|
const TOAST_POSITIONS = ['bottom-right', 'bottom-left', 'bottom-center', 'top-right', 'top-left', 'top-center'];
|
|
798
798
|
const ICONS = { info: 'ℹ', success: '✓', warning: '!', error: '✕' };
|
|
@@ -963,7 +963,7 @@ function defineToastStack(tag = 'usa-toast-stack') {
|
|
|
963
963
|
}
|
|
964
964
|
}
|
|
965
965
|
return UsaToastStack;
|
|
966
|
-
}, { id: 'toast', text: css$
|
|
966
|
+
}, { id: 'toast', text: css$I });
|
|
967
967
|
}
|
|
968
968
|
/** Show a toast on the first `<usa-toast-stack>` of the page (one is created when missing). */
|
|
969
969
|
function stackToast(input, stack) {
|
|
@@ -991,7 +991,7 @@ function installToastTriggers() {
|
|
|
991
991
|
});
|
|
992
992
|
}
|
|
993
993
|
|
|
994
|
-
var css$
|
|
994
|
+
var css$H = "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)}}";
|
|
995
995
|
|
|
996
996
|
const MENU_EFFECTS = ['scale', 'fold', 'slide'];
|
|
997
997
|
function defineMenu(tag = 'usa-menu') {
|
|
@@ -1130,10 +1130,10 @@ function defineMenu(tag = 'usa-menu') {
|
|
|
1130
1130
|
}
|
|
1131
1131
|
}
|
|
1132
1132
|
return UsaMenu;
|
|
1133
|
-
}, { id: 'menu', text: css$
|
|
1133
|
+
}, { id: 'menu', text: css$H });
|
|
1134
1134
|
}
|
|
1135
1135
|
|
|
1136
|
-
var css$
|
|
1136
|
+
var css$G = "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}}";
|
|
1137
1137
|
|
|
1138
1138
|
const PROGRESS_VARIANTS = ['ring', 'bar', 'semi'];
|
|
1139
1139
|
const NS = 'http://www.w3.org/2000/svg';
|
|
@@ -1273,7 +1273,7 @@ function defineProgressRing(tag = 'usa-progress-ring') {
|
|
|
1273
1273
|
}
|
|
1274
1274
|
}
|
|
1275
1275
|
return UsaProgressRing;
|
|
1276
|
-
}, { id: 'meters', text: css$
|
|
1276
|
+
}, { id: 'meters', text: css$G });
|
|
1277
1277
|
}
|
|
1278
1278
|
function defineOdometer(tag = 'usa-odometer') {
|
|
1279
1279
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1383,10 +1383,10 @@ function defineOdometer(tag = 'usa-odometer') {
|
|
|
1383
1383
|
}
|
|
1384
1384
|
}
|
|
1385
1385
|
return UsaOdometer;
|
|
1386
|
-
}, { id: 'meters', text: css$
|
|
1386
|
+
}, { id: 'meters', text: css$G });
|
|
1387
1387
|
}
|
|
1388
1388
|
|
|
1389
|
-
var css$
|
|
1389
|
+
var css$F = "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}}";
|
|
1390
1390
|
|
|
1391
1391
|
const SKELETON_VARIANTS = ['wave', 'pulse', 'glow'];
|
|
1392
1392
|
function defineSkeletonReveal(tag = 'usa-skeleton-reveal') {
|
|
@@ -1501,10 +1501,10 @@ function defineSkeletonReveal(tag = 'usa-skeleton-reveal') {
|
|
|
1501
1501
|
}
|
|
1502
1502
|
}
|
|
1503
1503
|
return UsaSkeletonReveal;
|
|
1504
|
-
}, { id: 'skeleton-reveal', text: css$
|
|
1504
|
+
}, { id: 'skeleton-reveal', text: css$F });
|
|
1505
1505
|
}
|
|
1506
1506
|
|
|
1507
|
-
var css$
|
|
1507
|
+
var css$E = "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}}";
|
|
1508
1508
|
|
|
1509
1509
|
const PATHS = {
|
|
1510
1510
|
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',
|
|
@@ -1628,10 +1628,10 @@ function defineStarRating(tag = 'usa-star-rating') {
|
|
|
1628
1628
|
}
|
|
1629
1629
|
}
|
|
1630
1630
|
return UsaStarRating;
|
|
1631
|
-
}, { id: 'star-rating', text: css$
|
|
1631
|
+
}, { id: 'star-rating', text: css$E });
|
|
1632
1632
|
}
|
|
1633
1633
|
|
|
1634
|
-
var css$
|
|
1634
|
+
var css$D = "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}}";
|
|
1635
1635
|
|
|
1636
1636
|
function defineMilestones(tag = 'usa-milestones') {
|
|
1637
1637
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1719,10 +1719,10 @@ function defineMilestones(tag = 'usa-milestones') {
|
|
|
1719
1719
|
}
|
|
1720
1720
|
}
|
|
1721
1721
|
return UsaMilestones;
|
|
1722
|
-
}, { id: 'milestones', text: css$
|
|
1722
|
+
}, { id: 'milestones', text: css$D });
|
|
1723
1723
|
}
|
|
1724
1724
|
|
|
1725
|
-
var css$
|
|
1725
|
+
var css$C = "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}";
|
|
1726
1726
|
|
|
1727
1727
|
function defineMasonryFlow(tag = 'usa-masonry-flow') {
|
|
1728
1728
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1843,10 +1843,10 @@ function defineMasonryFlow(tag = 'usa-masonry-flow') {
|
|
|
1843
1843
|
}
|
|
1844
1844
|
}
|
|
1845
1845
|
return UsaMasonryFlow;
|
|
1846
|
-
}, { id: 'masonry-flow', text: css$
|
|
1846
|
+
}, { id: 'masonry-flow', text: css$C });
|
|
1847
1847
|
}
|
|
1848
1848
|
|
|
1849
|
-
var css$
|
|
1849
|
+
var css$B = "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}";
|
|
1850
1850
|
|
|
1851
1851
|
function defineCompare(tag = 'usa-compare') {
|
|
1852
1852
|
return base.defineElement(tag, (Base) => {
|
|
@@ -1970,10 +1970,10 @@ function defineCompare(tag = 'usa-compare') {
|
|
|
1970
1970
|
}
|
|
1971
1971
|
}
|
|
1972
1972
|
return UsaCompare;
|
|
1973
|
-
}, { id: 'compare', text: css$
|
|
1973
|
+
}, { id: 'compare', text: css$B });
|
|
1974
1974
|
}
|
|
1975
1975
|
|
|
1976
|
-
var css$
|
|
1976
|
+
var css$A = "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}";
|
|
1977
1977
|
|
|
1978
1978
|
function defineCubeGallery(tag = 'usa-cube-gallery') {
|
|
1979
1979
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2106,10 +2106,10 @@ function defineCubeGallery(tag = 'usa-cube-gallery') {
|
|
|
2106
2106
|
}
|
|
2107
2107
|
}
|
|
2108
2108
|
return UsaCubeGallery;
|
|
2109
|
-
}, { id: 'cube-gallery', text: css$
|
|
2109
|
+
}, { id: 'cube-gallery', text: css$A });
|
|
2110
2110
|
}
|
|
2111
2111
|
|
|
2112
|
-
var css$
|
|
2112
|
+
var css$z = "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}}";
|
|
2113
2113
|
|
|
2114
2114
|
function defineDock(tag = 'usa-dock') {
|
|
2115
2115
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2177,10 +2177,10 @@ function defineDock(tag = 'usa-dock') {
|
|
|
2177
2177
|
}
|
|
2178
2178
|
}
|
|
2179
2179
|
return UsaDock;
|
|
2180
|
-
}, { id: 'dock', text: css$
|
|
2180
|
+
}, { id: 'dock', text: css$z });
|
|
2181
2181
|
}
|
|
2182
2182
|
|
|
2183
|
-
var css$
|
|
2183
|
+
var css$y = "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)}";
|
|
2184
2184
|
|
|
2185
2185
|
const NAV_INDICATORS = ['underline', 'pill', 'blob', 'dot'];
|
|
2186
2186
|
function defineNavMorph(tag = 'usa-nav-morph') {
|
|
@@ -2284,10 +2284,10 @@ function defineNavMorph(tag = 'usa-nav-morph') {
|
|
|
2284
2284
|
}
|
|
2285
2285
|
}
|
|
2286
2286
|
return UsaNavMorph;
|
|
2287
|
-
}, { id: 'nav-morph', text: css$
|
|
2287
|
+
}, { id: 'nav-morph', text: css$y });
|
|
2288
2288
|
}
|
|
2289
2289
|
|
|
2290
|
-
var css$
|
|
2290
|
+
var css$x = "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}";
|
|
2291
2291
|
|
|
2292
2292
|
const TOGGLE_VARIANTS = ['cross', 'arrow', 'minus', 'plus-x'];
|
|
2293
2293
|
function defineMenuToggle(tag = 'usa-menu-toggle') {
|
|
@@ -2360,10 +2360,10 @@ function defineMenuToggle(tag = 'usa-menu-toggle') {
|
|
|
2360
2360
|
}
|
|
2361
2361
|
}
|
|
2362
2362
|
return UsaMenuToggle;
|
|
2363
|
-
}, { id: 'menu-toggle', text: css$
|
|
2363
|
+
}, { id: 'menu-toggle', text: css$x });
|
|
2364
2364
|
}
|
|
2365
2365
|
|
|
2366
|
-
var css$
|
|
2366
|
+
var css$w = "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)}";
|
|
2367
2367
|
|
|
2368
2368
|
const TIP_PLACEMENTS = ['top', 'bottom', 'left', 'right'];
|
|
2369
2369
|
const FLIP = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' };
|
|
@@ -2495,10 +2495,10 @@ function defineTip(tag = 'usa-tip') {
|
|
|
2495
2495
|
}
|
|
2496
2496
|
}
|
|
2497
2497
|
return UsaTip;
|
|
2498
|
-
}, { id: 'tip', text: css$
|
|
2498
|
+
}, { id: 'tip', text: css$w });
|
|
2499
2499
|
}
|
|
2500
2500
|
|
|
2501
|
-
var css$
|
|
2501
|
+
var css$v = "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}}";
|
|
2502
2502
|
|
|
2503
2503
|
function defineStepper(tag = 'usa-stepper') {
|
|
2504
2504
|
return base.defineElement(tag, (Base) => {
|
|
@@ -2595,10 +2595,10 @@ function defineStepper(tag = 'usa-stepper') {
|
|
|
2595
2595
|
}
|
|
2596
2596
|
}
|
|
2597
2597
|
return UsaStepper;
|
|
2598
|
-
}, { id: 'stepper', text: css$
|
|
2598
|
+
}, { id: 'stepper', text: css$v });
|
|
2599
2599
|
}
|
|
2600
2600
|
|
|
2601
|
-
var css$
|
|
2601
|
+
var css$u = "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}}";
|
|
2602
2602
|
|
|
2603
2603
|
/** The visible page list: numbers and `'…'` gaps (1-based). */
|
|
2604
2604
|
function pageWindow(page, total, siblings = 1) {
|
|
@@ -2720,10 +2720,10 @@ function definePagination(tag = 'usa-pagination') {
|
|
|
2720
2720
|
}
|
|
2721
2721
|
}
|
|
2722
2722
|
return UsaPagination;
|
|
2723
|
-
}, { id: 'pagination', text: css$
|
|
2723
|
+
}, { id: 'pagination', text: css$u });
|
|
2724
2724
|
}
|
|
2725
2725
|
|
|
2726
|
-
var css$
|
|
2726
|
+
var css$t = "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}}";
|
|
2727
2727
|
|
|
2728
2728
|
const SEGMENTED_VARIANTS = ['ios', 'pill', 'outline'];
|
|
2729
2729
|
function defineSegmented(tag = 'usa-segmented') {
|
|
@@ -2817,10 +2817,10 @@ function defineSegmented(tag = 'usa-segmented') {
|
|
|
2817
2817
|
}
|
|
2818
2818
|
}
|
|
2819
2819
|
return UsaSegmented;
|
|
2820
|
-
}, { id: 'segmented', text: css$
|
|
2820
|
+
}, { id: 'segmented', text: css$t });
|
|
2821
2821
|
}
|
|
2822
2822
|
|
|
2823
|
-
var css$
|
|
2823
|
+
var css$s = "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}}";
|
|
2824
2824
|
|
|
2825
2825
|
const SWITCH_VARIANTS = ['ios', 'daynight', 'bounce', 'liquid'];
|
|
2826
2826
|
function defineSwitch(tag = 'usa-switch') {
|
|
@@ -2908,10 +2908,10 @@ function defineSwitch(tag = 'usa-switch') {
|
|
|
2908
2908
|
}
|
|
2909
2909
|
}
|
|
2910
2910
|
return UsaSwitch;
|
|
2911
|
-
}, { id: 'switch', text: css$
|
|
2911
|
+
}, { id: 'switch', text: css$s });
|
|
2912
2912
|
}
|
|
2913
2913
|
|
|
2914
|
-
var css$
|
|
2914
|
+
var css$r = "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}}";
|
|
2915
2915
|
|
|
2916
2916
|
function defineKanban(tag = 'usa-kanban') {
|
|
2917
2917
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3116,10 +3116,10 @@ function defineKanban(tag = 'usa-kanban') {
|
|
|
3116
3116
|
}
|
|
3117
3117
|
}
|
|
3118
3118
|
return UsaKanban;
|
|
3119
|
-
}, { id: 'kanban', text: css$
|
|
3119
|
+
}, { id: 'kanban', text: css$r });
|
|
3120
3120
|
}
|
|
3121
3121
|
|
|
3122
|
-
var css$
|
|
3122
|
+
var css$q = "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}}";
|
|
3123
3123
|
|
|
3124
3124
|
function defineSwipeDeck(tag = 'usa-swipe-deck') {
|
|
3125
3125
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3261,10 +3261,10 @@ function defineSwipeDeck(tag = 'usa-swipe-deck') {
|
|
|
3261
3261
|
}
|
|
3262
3262
|
}
|
|
3263
3263
|
return UsaSwipeDeck;
|
|
3264
|
-
}, { id: 'swipe-deck', text: css$
|
|
3264
|
+
}, { id: 'swipe-deck', text: css$q });
|
|
3265
3265
|
}
|
|
3266
3266
|
|
|
3267
|
-
var css$
|
|
3267
|
+
var css$p = "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}}";
|
|
3268
3268
|
|
|
3269
3269
|
const WEATHER_CONDITIONS = ['clear', 'cloudy', 'rain', 'snow', 'storm', 'fog', 'night'];
|
|
3270
3270
|
const LABEL = { clear: 'Clear', cloudy: 'Cloudy', rain: 'Rain', snow: 'Snow', storm: 'Thunderstorm', fog: 'Fog', night: 'Clear night' };
|
|
@@ -3345,10 +3345,10 @@ function defineWeatherCard(tag = 'usa-weather-card') {
|
|
|
3345
3345
|
}
|
|
3346
3346
|
}
|
|
3347
3347
|
return UsaWeatherCard;
|
|
3348
|
-
}, { id: 'weather-card', text: css$
|
|
3348
|
+
}, { id: 'weather-card', text: css$p });
|
|
3349
3349
|
}
|
|
3350
3350
|
|
|
3351
|
-
var css$
|
|
3351
|
+
var css$o = "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}}";
|
|
3352
3352
|
|
|
3353
3353
|
function definePullCord(tag = 'usa-pull-cord') {
|
|
3354
3354
|
return base.defineElement(tag, (Base) => {
|
|
@@ -3477,10 +3477,10 @@ function definePullCord(tag = 'usa-pull-cord') {
|
|
|
3477
3477
|
}
|
|
3478
3478
|
}
|
|
3479
3479
|
return UsaPullCord;
|
|
3480
|
-
}, { id: 'pull-cord', text: css$
|
|
3480
|
+
}, { id: 'pull-cord', text: css$o });
|
|
3481
3481
|
}
|
|
3482
3482
|
|
|
3483
|
-
var css$
|
|
3483
|
+
var css$n = "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}}";
|
|
3484
3484
|
|
|
3485
3485
|
const iso = (d) => `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
|
3486
3486
|
/** Parse `YYYY-MM-DD` as a local date (or null). */
|
|
@@ -3629,10 +3629,10 @@ function defineDatePicker(tag = 'usa-date-picker') {
|
|
|
3629
3629
|
}
|
|
3630
3630
|
}
|
|
3631
3631
|
return UsaDatePicker;
|
|
3632
|
-
}, { id: 'date-picker', text: css$
|
|
3632
|
+
}, { id: 'date-picker', text: css$n });
|
|
3633
3633
|
}
|
|
3634
3634
|
|
|
3635
|
-
var css$
|
|
3635
|
+
var css$m = "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}}";
|
|
3636
3636
|
|
|
3637
3637
|
/** HSV (h 0–360, s / v 0–1) → `#rrggbb`. */
|
|
3638
3638
|
function hsvToHex(h, s, v) {
|
|
@@ -3752,10 +3752,10 @@ function defineColorPicker(tag = 'usa-color-picker') {
|
|
|
3752
3752
|
}
|
|
3753
3753
|
}
|
|
3754
3754
|
return UsaColorPicker;
|
|
3755
|
-
}, { id: 'color-picker', text: css$
|
|
3755
|
+
}, { id: 'color-picker', text: css$m });
|
|
3756
3756
|
}
|
|
3757
3757
|
|
|
3758
|
-
var css$
|
|
3758
|
+
var css$l = "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}}";
|
|
3759
3759
|
|
|
3760
3760
|
const size = (n) => (n < 1024 ? `${n} B` : n < 1048576 ? `${(n / 1024).toFixed(1)} KB` : `${(n / 1048576).toFixed(1)} MB`);
|
|
3761
3761
|
function defineFileDrop(tag = 'usa-file-drop') {
|
|
@@ -3856,10 +3856,10 @@ function defineFileDrop(tag = 'usa-file-drop') {
|
|
|
3856
3856
|
}
|
|
3857
3857
|
}
|
|
3858
3858
|
return UsaFileDrop;
|
|
3859
|
-
}, { id: 'file-drop', text: css$
|
|
3859
|
+
}, { id: 'file-drop', text: css$l });
|
|
3860
3860
|
}
|
|
3861
3861
|
|
|
3862
|
-
var css$
|
|
3862
|
+
var css$k = "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}}";
|
|
3863
3863
|
|
|
3864
3864
|
const DEFAULT = {
|
|
3865
3865
|
format: player.ANIMATION_FORMAT,
|
|
@@ -4033,10 +4033,10 @@ function defineKeyframeEditor(tag = 'usa-keyframe-editor') {
|
|
|
4033
4033
|
}
|
|
4034
4034
|
}
|
|
4035
4035
|
return UsaKeyframeEditor;
|
|
4036
|
-
}, { id: 'keyframe-editor', text: css$
|
|
4036
|
+
}, { id: 'keyframe-editor', text: css$k });
|
|
4037
4037
|
}
|
|
4038
4038
|
|
|
4039
|
-
var css$
|
|
4039
|
+
var css$j = "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}}";
|
|
4040
4040
|
|
|
4041
4041
|
const fmt = (s) => `${Math.floor(s / 60)}:${String(Math.floor(s % 60)).padStart(2, '0')}`;
|
|
4042
4042
|
function defineMusicPlayer(tag = 'usa-music-player') {
|
|
@@ -4197,10 +4197,10 @@ function defineMusicPlayer(tag = 'usa-music-player') {
|
|
|
4197
4197
|
}
|
|
4198
4198
|
}
|
|
4199
4199
|
return UsaMusicPlayer;
|
|
4200
|
-
}, { id: 'music-player', text: css$
|
|
4200
|
+
}, { id: 'music-player', text: css$j });
|
|
4201
4201
|
}
|
|
4202
4202
|
|
|
4203
|
-
var css$
|
|
4203
|
+
var css$i = "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}}";
|
|
4204
4204
|
|
|
4205
4205
|
const ARC = 270;
|
|
4206
4206
|
function defineVolumeKnob(tag = 'usa-volume-knob') {
|
|
@@ -4291,10 +4291,10 @@ function defineVolumeKnob(tag = 'usa-volume-knob') {
|
|
|
4291
4291
|
}
|
|
4292
4292
|
}
|
|
4293
4293
|
return UsaVolumeKnob;
|
|
4294
|
-
}, { id: 'volume-knob', text: css$
|
|
4294
|
+
}, { id: 'volume-knob', text: css$i });
|
|
4295
4295
|
}
|
|
4296
4296
|
|
|
4297
|
-
var css$
|
|
4297
|
+
var css$h = "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}}";
|
|
4298
4298
|
|
|
4299
4299
|
const EQ_PRESETS = {
|
|
4300
4300
|
flat: [0, 0, 0, 0, 0, 0, 0],
|
|
@@ -4392,10 +4392,10 @@ function defineEqualizer(tag = 'usa-equalizer') {
|
|
|
4392
4392
|
}
|
|
4393
4393
|
}
|
|
4394
4394
|
return UsaEqualizer;
|
|
4395
|
-
}, { id: 'equalizer', text: css$
|
|
4395
|
+
}, { id: 'equalizer', text: css$h });
|
|
4396
4396
|
}
|
|
4397
4397
|
|
|
4398
|
-
var css$
|
|
4398
|
+
var css$g = "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}}";
|
|
4399
4399
|
|
|
4400
4400
|
/** Parse LRC text into sorted `{ t, text }` lines. */
|
|
4401
4401
|
function parseLRC(src) {
|
|
@@ -4507,10 +4507,10 @@ function defineLyrics(tag = 'usa-lyrics') {
|
|
|
4507
4507
|
}
|
|
4508
4508
|
}
|
|
4509
4509
|
return UsaLyrics;
|
|
4510
|
-
}, { id: 'lyrics', text: css$
|
|
4510
|
+
}, { id: 'lyrics', text: css$g });
|
|
4511
4511
|
}
|
|
4512
4512
|
|
|
4513
|
-
var css$
|
|
4513
|
+
var css$f = "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}}";
|
|
4514
4514
|
|
|
4515
4515
|
function defineBarChart(tag = 'usa-bar-chart') {
|
|
4516
4516
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4604,10 +4604,10 @@ function defineBarChart(tag = 'usa-bar-chart') {
|
|
|
4604
4604
|
}
|
|
4605
4605
|
}
|
|
4606
4606
|
return UsaBarChart;
|
|
4607
|
-
}, { id: 'bar-chart', text: css$
|
|
4607
|
+
}, { id: 'bar-chart', text: css$f });
|
|
4608
4608
|
}
|
|
4609
4609
|
|
|
4610
|
-
var css$
|
|
4610
|
+
var css$e = "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)}";
|
|
4611
4611
|
|
|
4612
4612
|
function defineGauge(tag = 'usa-gauge') {
|
|
4613
4613
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4692,10 +4692,10 @@ function defineGauge(tag = 'usa-gauge') {
|
|
|
4692
4692
|
}
|
|
4693
4693
|
}
|
|
4694
4694
|
return UsaGauge;
|
|
4695
|
-
}, { id: 'gauge', text: css$
|
|
4695
|
+
}, { id: 'gauge', text: css$e });
|
|
4696
4696
|
}
|
|
4697
4697
|
|
|
4698
|
-
var css$
|
|
4698
|
+
var css$d = "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}}";
|
|
4699
4699
|
|
|
4700
4700
|
const SPARK_VARIANTS = ['line', 'area', 'bars'];
|
|
4701
4701
|
/** Map values to SVG points in a w×h box (with padding). */
|
|
@@ -4818,7 +4818,7 @@ function defineSparkline(tag = 'usa-sparkline') {
|
|
|
4818
4818
|
}
|
|
4819
4819
|
}
|
|
4820
4820
|
return UsaSparkline;
|
|
4821
|
-
}, { id: 'sparkline', text: css$
|
|
4821
|
+
}, { id: 'sparkline', text: css$d });
|
|
4822
4822
|
}
|
|
4823
4823
|
|
|
4824
4824
|
/** Parse a figure like "$12.4k" / "−3.5%" / "1,204" → number + prefix / suffix / decimals (7.2). */
|
|
@@ -4831,7 +4831,7 @@ function parseFigureText(s) {
|
|
|
4831
4831
|
return Number.isFinite(n) ? { n, pre: m[1], post: m[3], dec: (raw.split('.')[1] || '').length } : null;
|
|
4832
4832
|
}
|
|
4833
4833
|
|
|
4834
|
-
var css$
|
|
4834
|
+
var css$c = "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}";
|
|
4835
4835
|
|
|
4836
4836
|
function defineKpi(tag = 'usa-kpi') {
|
|
4837
4837
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4911,10 +4911,10 @@ function defineKpi(tag = 'usa-kpi') {
|
|
|
4911
4911
|
}
|
|
4912
4912
|
}
|
|
4913
4913
|
return UsaKpi;
|
|
4914
|
-
}, { id: 'kpi', text: css$
|
|
4914
|
+
}, { id: 'kpi', text: css$c });
|
|
4915
4915
|
}
|
|
4916
4916
|
|
|
4917
|
-
var css$
|
|
4917
|
+
var css$b = "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}}";
|
|
4918
4918
|
|
|
4919
4919
|
function defineAddToCart(tag = 'usa-add-to-cart') {
|
|
4920
4920
|
return base.defineElement(tag, (Base) => {
|
|
@@ -4959,10 +4959,10 @@ function defineAddToCart(tag = 'usa-add-to-cart') {
|
|
|
4959
4959
|
}
|
|
4960
4960
|
}
|
|
4961
4961
|
return UsaAddToCart;
|
|
4962
|
-
}, { id: 'add-to-cart', text: css$
|
|
4962
|
+
}, { id: 'add-to-cart', text: css$b });
|
|
4963
4963
|
}
|
|
4964
4964
|
|
|
4965
|
-
var css$
|
|
4965
|
+
var css$a = "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}";
|
|
4966
4966
|
|
|
4967
4967
|
/** Cart total (7.3). */
|
|
4968
4968
|
const cartTotal = (items) => Math.round(items.reduce((a, i) => a + (Number(i.price) || 0) * (i.qty || 1), 0) * 100) / 100;
|
|
@@ -5127,10 +5127,10 @@ function defineCartDrawer(tag = 'usa-cart-drawer') {
|
|
|
5127
5127
|
}
|
|
5128
5128
|
}
|
|
5129
5129
|
return UsaCartDrawer;
|
|
5130
|
-
}, { id: 'cart-drawer', text: css$
|
|
5130
|
+
}, { id: 'cart-drawer', text: css$a });
|
|
5131
5131
|
}
|
|
5132
5132
|
|
|
5133
|
-
var css$
|
|
5133
|
+
var css$9 = "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}}";
|
|
5134
5134
|
|
|
5135
5135
|
/** Wrap an index into 0..n-1 (7.3). */
|
|
5136
5136
|
const wrapIndex = (i, n) => (n ? ((i % n) + n) % n : 0);
|
|
@@ -5244,10 +5244,10 @@ function defineProductGallery(tag = 'usa-product-gallery') {
|
|
|
5244
5244
|
}
|
|
5245
5245
|
}
|
|
5246
5246
|
return UsaProductGallery;
|
|
5247
|
-
}, { id: 'product-gallery', text: css$
|
|
5247
|
+
}, { id: 'product-gallery', text: css$9 });
|
|
5248
5248
|
}
|
|
5249
5249
|
|
|
5250
|
-
var css$
|
|
5250
|
+
var css$8 = "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)}";
|
|
5251
5251
|
|
|
5252
5252
|
/** Split seconds into d/h/m/s (7.3). */
|
|
5253
5253
|
function splitTime(sec) {
|
|
@@ -5335,10 +5335,10 @@ function defineCountdown(tag = 'usa-countdown') {
|
|
|
5335
5335
|
}
|
|
5336
5336
|
}
|
|
5337
5337
|
return UsaCountdown;
|
|
5338
|
-
}, { id: 'countdown', text: css$
|
|
5338
|
+
}, { id: 'countdown', text: css$8 });
|
|
5339
5339
|
}
|
|
5340
5340
|
|
|
5341
|
-
var css$
|
|
5341
|
+
var css$7 = "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}}";
|
|
5342
5342
|
|
|
5343
5343
|
function defineMessageList(tag = 'usa-message-list') {
|
|
5344
5344
|
return base.defineElement(tag, (Base) => {
|
|
@@ -5425,10 +5425,10 @@ function defineMessageList(tag = 'usa-message-list') {
|
|
|
5425
5425
|
}
|
|
5426
5426
|
}
|
|
5427
5427
|
return UsaMessageList;
|
|
5428
|
-
}, { id: 'message-list', text: css$
|
|
5428
|
+
}, { id: 'message-list', text: css$7 });
|
|
5429
5429
|
}
|
|
5430
5430
|
|
|
5431
|
-
var css$
|
|
5431
|
+
var css$6 = "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}";
|
|
5432
5432
|
|
|
5433
5433
|
/** Parse "👍,❤️" + "3,1" into ordered [emoji, count] pairs (7.4). */
|
|
5434
5434
|
function parseReactions(emojis, counts = '') {
|
|
@@ -5530,10 +5530,10 @@ function defineReactions(tag = 'usa-reactions') {
|
|
|
5530
5530
|
}
|
|
5531
5531
|
}
|
|
5532
5532
|
return UsaReactions;
|
|
5533
|
-
}, { id: 'reactions', text: css$
|
|
5533
|
+
}, { id: 'reactions', text: css$6 });
|
|
5534
5534
|
}
|
|
5535
5535
|
|
|
5536
|
-
var css$
|
|
5536
|
+
var css$5 = "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}";
|
|
5537
5537
|
|
|
5538
5538
|
function defineNotificationBell(tag = 'usa-notification-bell') {
|
|
5539
5539
|
return base.defineElement(tag, (Base) => {
|
|
@@ -5628,10 +5628,10 @@ function defineNotificationBell(tag = 'usa-notification-bell') {
|
|
|
5628
5628
|
}
|
|
5629
5629
|
}
|
|
5630
5630
|
return UsaNotificationBell;
|
|
5631
|
-
}, { id: 'notification-bell', text: css$
|
|
5631
|
+
}, { id: 'notification-bell', text: css$5 });
|
|
5632
5632
|
}
|
|
5633
5633
|
|
|
5634
|
-
var css = "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}}";
|
|
5634
|
+
var css$4 = "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}}";
|
|
5635
5635
|
|
|
5636
5636
|
/** Presence states (7.4). */
|
|
5637
5637
|
const PRESENCE_STATES = ['online', 'away', 'busy', 'offline'];
|
|
@@ -5701,7 +5701,372 @@ function definePresence(tag = 'usa-presence') {
|
|
|
5701
5701
|
}
|
|
5702
5702
|
}
|
|
5703
5703
|
return UsaPresence;
|
|
5704
|
-
}, { id: 'presence', text: css });
|
|
5704
|
+
}, { id: 'presence', text: css$4 });
|
|
5705
|
+
}
|
|
5706
|
+
|
|
5707
|
+
var css$3 = "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)}";
|
|
5708
|
+
|
|
5709
|
+
/** Sort rows by score desc, then name (7.5). */
|
|
5710
|
+
const rankRows = (rows) => [...rows].sort((a, b) => b.score - a.score || a.name.localeCompare(b.name));
|
|
5711
|
+
const MEDAL = ['🥇', '🥈', '🥉'];
|
|
5712
|
+
function defineLeaderboard(tag = 'usa-leaderboard') {
|
|
5713
|
+
return base.defineElement(tag, (Base) => {
|
|
5714
|
+
class UsaLeaderboard extends Base {
|
|
5715
|
+
constructor() {
|
|
5716
|
+
super(...arguments);
|
|
5717
|
+
this._rows = [];
|
|
5718
|
+
}
|
|
5719
|
+
get rows() {
|
|
5720
|
+
return rankRows(this._rows).map((r) => ({ ...r }));
|
|
5721
|
+
}
|
|
5722
|
+
set rows(v) {
|
|
5723
|
+
this._rows = (v || []).map((r) => ({ ...r, score: Number(r.score) || 0 }));
|
|
5724
|
+
if (this.isConnected)
|
|
5725
|
+
this.render();
|
|
5726
|
+
}
|
|
5727
|
+
mount() {
|
|
5728
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
5729
|
+
const seed = Array.from(this.querySelectorAll(':scope > li'));
|
|
5730
|
+
if (seed.length)
|
|
5731
|
+
this._rows = seed.map((li) => ({ name: (li.textContent || '').trim(), score: Number(li.dataset.score) || 0, avatar: li.dataset.avatar }));
|
|
5732
|
+
seed.forEach((li) => li.remove());
|
|
5733
|
+
this.insertAdjacentHTML('beforeend', '<ol class="usa-lb-list" data-usa-part></ol><span class="usa-lb-live" data-usa-part aria-live="polite"></span>');
|
|
5734
|
+
this.querySelector('.usa-lb-list').setAttribute('aria-label', this.str('label', 'Leaderboard'));
|
|
5735
|
+
this.render();
|
|
5736
|
+
}
|
|
5737
|
+
setScore(name, score) {
|
|
5738
|
+
const r = this._rows.find((x) => x.name === name);
|
|
5739
|
+
if (r)
|
|
5740
|
+
r.score = score;
|
|
5741
|
+
else
|
|
5742
|
+
this._rows.push({ name, score });
|
|
5743
|
+
this.render();
|
|
5744
|
+
}
|
|
5745
|
+
render() {
|
|
5746
|
+
const list = this.querySelector('.usa-lb-list');
|
|
5747
|
+
if (!list)
|
|
5748
|
+
return;
|
|
5749
|
+
const ranked = rankRows(this._rows).slice(0, this.num('limit', 10));
|
|
5750
|
+
const old = new Map();
|
|
5751
|
+
Array.from(list.children).forEach((li) => {
|
|
5752
|
+
const h = li;
|
|
5753
|
+
old.set(h.dataset.name, { li: h, top: h.getBoundingClientRect().top, rank: Number(h.dataset.rank), score: Number(h.dataset.score) });
|
|
5754
|
+
});
|
|
5755
|
+
const me = this.str('me', '');
|
|
5756
|
+
const moves = [];
|
|
5757
|
+
ranked.forEach((r, i) => {
|
|
5758
|
+
const prev = old.get(r.name);
|
|
5759
|
+
old.delete(r.name);
|
|
5760
|
+
const li = prev?.li || document.createElement('li');
|
|
5761
|
+
if (!prev) {
|
|
5762
|
+
li.className = 'usa-lb-row';
|
|
5763
|
+
li.innerHTML = '<b class="usa-lb-rank" aria-hidden="true"></b><span class="usa-lb-av" aria-hidden="true"></span><span class="usa-lb-name"></span><i class="usa-lb-delta" aria-hidden="true"></i><span class="usa-lb-score"></span>';
|
|
5764
|
+
}
|
|
5765
|
+
li.dataset.name = r.name;
|
|
5766
|
+
li.dataset.rank = String(i + 1);
|
|
5767
|
+
li.dataset.score = String(r.score);
|
|
5768
|
+
li.toggleAttribute('data-me', r.name === me);
|
|
5769
|
+
li.querySelector('.usa-lb-rank').textContent = MEDAL[i] || String(i + 1);
|
|
5770
|
+
const av = li.querySelector('.usa-lb-av');
|
|
5771
|
+
av.textContent = r.avatar ? '' : Array.from(r.name)[0] || '?';
|
|
5772
|
+
av.style.backgroundImage = r.avatar ? `url("${r.avatar}")` : '';
|
|
5773
|
+
li.querySelector('.usa-lb-name').textContent = r.name;
|
|
5774
|
+
li.setAttribute('aria-label', `${i + 1}. ${r.name}, ${r.score} points`);
|
|
5775
|
+
const sc = li.querySelector('.usa-lb-score');
|
|
5776
|
+
const delta = li.querySelector('.usa-lb-delta');
|
|
5777
|
+
list.appendChild(li);
|
|
5778
|
+
if (prev && prev.rank !== i + 1) {
|
|
5779
|
+
const d = prev.rank - (i + 1);
|
|
5780
|
+
delta.textContent = d > 0 ? `▲${d}` : `▼${-d}`;
|
|
5781
|
+
li.dataset.move = d > 0 ? 'up' : 'down';
|
|
5782
|
+
moves.push(`${r.name} ${d > 0 ? 'up' : 'down'} to ${i + 1}`);
|
|
5783
|
+
this.emit('rank', { name: r.name, from: prev.rank, to: i + 1 });
|
|
5784
|
+
}
|
|
5785
|
+
else if (prev) {
|
|
5786
|
+
delete li.dataset.move;
|
|
5787
|
+
delta.textContent = '';
|
|
5788
|
+
}
|
|
5789
|
+
if (!this.reduced && prev) {
|
|
5790
|
+
const dy = prev.top - li.getBoundingClientRect().top;
|
|
5791
|
+
if (dy)
|
|
5792
|
+
this.motion(li, [{ transform: `translateY(${dy}px)` }, { transform: 'none' }], { duration: 520, easing: 'cubic-bezier(.2,.9,.3,1)' });
|
|
5793
|
+
if (li.dataset.move)
|
|
5794
|
+
this.motion(li, [{ backgroundColor: li.dataset.move === 'up' ? 'rgba(34,197,94,.25)' : 'rgba(239,68,68,.2)' }, { backgroundColor: 'transparent' }], { duration: 1200, composite: 'add' });
|
|
5795
|
+
}
|
|
5796
|
+
this.roll(sc, prev ? prev.score : r.score, r.score);
|
|
5797
|
+
});
|
|
5798
|
+
old.forEach(({ li }) => li.remove());
|
|
5799
|
+
if (moves.length)
|
|
5800
|
+
this.querySelector('.usa-lb-live').textContent = moves.join('; ');
|
|
5801
|
+
}
|
|
5802
|
+
roll(el, from, to) {
|
|
5803
|
+
if (this.reduced || from === to || typeof requestAnimationFrame !== 'function')
|
|
5804
|
+
return void (el.textContent = to.toLocaleString());
|
|
5805
|
+
const t0 = performance.now();
|
|
5806
|
+
const f = (now) => {
|
|
5807
|
+
const k = Math.min(1, (now - t0) / 600);
|
|
5808
|
+
el.textContent = Math.round(from + (to - from) * (1 - Math.pow(1 - k, 3))).toLocaleString();
|
|
5809
|
+
if (k < 1)
|
|
5810
|
+
requestAnimationFrame(f);
|
|
5811
|
+
};
|
|
5812
|
+
requestAnimationFrame(f);
|
|
5813
|
+
}
|
|
5814
|
+
}
|
|
5815
|
+
return UsaLeaderboard;
|
|
5816
|
+
}, { id: 'leaderboard', text: css$3 });
|
|
5817
|
+
}
|
|
5818
|
+
|
|
5819
|
+
var css$2 = "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)}";
|
|
5820
|
+
|
|
5821
|
+
/** Apply `gain` XP to (level, xp) with `per` XP per level (7.5). */
|
|
5822
|
+
function levelFor(level, xp, gain, per = 100) {
|
|
5823
|
+
const p = Math.max(1, per);
|
|
5824
|
+
let total = Math.max(0, xp + gain);
|
|
5825
|
+
let ups = 0;
|
|
5826
|
+
while (total >= p) {
|
|
5827
|
+
total -= p;
|
|
5828
|
+
ups++;
|
|
5829
|
+
}
|
|
5830
|
+
return { level: level + ups, xp: total, ups };
|
|
5831
|
+
}
|
|
5832
|
+
function defineXpBar(tag = 'usa-xp-bar') {
|
|
5833
|
+
return base.defineElement(tag, (Base) => {
|
|
5834
|
+
class UsaXpBar extends Base {
|
|
5835
|
+
constructor() {
|
|
5836
|
+
super(...arguments);
|
|
5837
|
+
this._busy = false;
|
|
5838
|
+
}
|
|
5839
|
+
static get observedAttributes() {
|
|
5840
|
+
return ['level', 'xp', 'per'];
|
|
5841
|
+
}
|
|
5842
|
+
get level() {
|
|
5843
|
+
return Math.max(1, Math.floor(this.num('level', 1)));
|
|
5844
|
+
}
|
|
5845
|
+
set level(v) {
|
|
5846
|
+
this.setAttribute('level', String(v));
|
|
5847
|
+
}
|
|
5848
|
+
get xp() {
|
|
5849
|
+
return Math.max(0, this.num('xp', 0));
|
|
5850
|
+
}
|
|
5851
|
+
set xp(v) {
|
|
5852
|
+
this.setAttribute('xp', String(v));
|
|
5853
|
+
}
|
|
5854
|
+
get per() {
|
|
5855
|
+
return Math.max(1, this.num('per', 100));
|
|
5856
|
+
}
|
|
5857
|
+
mount() {
|
|
5858
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
5859
|
+
this.insertAdjacentHTML('beforeend', '<b class="usa-xp-lvl" data-usa-part aria-hidden="true"></b><span class="usa-xp-track" data-usa-part><i class="usa-xp-fill"></i></span><span class="usa-xp-num" data-usa-part aria-hidden="true"></span><span class="usa-xp-live" data-usa-part aria-live="polite"></span>');
|
|
5860
|
+
this.setAttribute('role', 'progressbar');
|
|
5861
|
+
this.setAttribute('aria-valuemin', '0');
|
|
5862
|
+
this.paint(false);
|
|
5863
|
+
}
|
|
5864
|
+
changed() {
|
|
5865
|
+
if (!this._busy && this.querySelector('.usa-xp-fill'))
|
|
5866
|
+
this.paint(false);
|
|
5867
|
+
}
|
|
5868
|
+
paint(animate, from) {
|
|
5869
|
+
const per = this.per;
|
|
5870
|
+
const xp = Math.min(this.xp, per);
|
|
5871
|
+
this.querySelector('.usa-xp-lvl').textContent = String(this.level);
|
|
5872
|
+
this.querySelector('.usa-xp-num').textContent = `${Math.round(xp)} / ${per} XP`;
|
|
5873
|
+
this.setAttribute('aria-valuemax', String(per));
|
|
5874
|
+
this.setAttribute('aria-valuenow', String(Math.round(xp)));
|
|
5875
|
+
this.setAttribute('aria-label', `Level ${this.level}, ${Math.round(xp)} of ${per} XP`);
|
|
5876
|
+
const fill = this.querySelector('.usa-xp-fill');
|
|
5877
|
+
const to = `scaleX(${(xp / per).toFixed(4)})`;
|
|
5878
|
+
if (animate && !this.reduced && from !== undefined)
|
|
5879
|
+
this.motion(fill, [{ transform: `scaleX(${from.toFixed(4)})` }, { transform: to }], { duration: 500, easing: 'cubic-bezier(.2,.8,.3,1)' });
|
|
5880
|
+
fill.style.transform = to;
|
|
5881
|
+
}
|
|
5882
|
+
add(n) {
|
|
5883
|
+
const per = this.per;
|
|
5884
|
+
const start = this.level;
|
|
5885
|
+
const r = levelFor(start, Math.min(this.xp, per), Number(n) || 0, per);
|
|
5886
|
+
const fill = this.querySelector('.usa-xp-fill');
|
|
5887
|
+
const fromK = Math.min(this.xp, per) / per;
|
|
5888
|
+
this._busy = true;
|
|
5889
|
+
this.level = r.level;
|
|
5890
|
+
this.xp = r.xp;
|
|
5891
|
+
this._busy = false;
|
|
5892
|
+
if (!fill)
|
|
5893
|
+
return;
|
|
5894
|
+
if (r.ups && !this.reduced) {
|
|
5895
|
+
this.motion(fill, [{ transform: `scaleX(${fromK.toFixed(4)})` }, { transform: 'scaleX(1)' }], { duration: 380, easing: 'ease-in' });
|
|
5896
|
+
const lvl = this.querySelector('.usa-xp-lvl');
|
|
5897
|
+
this.motion(lvl, [{ transform: 'scale(1)' }, { transform: 'scale(1.6) rotate(-8deg)', offset: 0.5 }, { transform: 'scale(1)' }], { duration: 600, delay: 340, easing: 'ease-out' });
|
|
5898
|
+
this.dataset.levelup = '';
|
|
5899
|
+
setTimeout(() => {
|
|
5900
|
+
delete this.dataset.levelup;
|
|
5901
|
+
}, 1200);
|
|
5902
|
+
setTimeout(() => this.isConnected && this.paint(true, 0), 380);
|
|
5903
|
+
this.paint(false);
|
|
5904
|
+
fill.style.transform = 'scaleX(1)';
|
|
5905
|
+
}
|
|
5906
|
+
else
|
|
5907
|
+
this.paint(true, fromK);
|
|
5908
|
+
if (r.ups) {
|
|
5909
|
+
this.querySelector('.usa-xp-live').textContent = `Level up! Level ${r.level}`;
|
|
5910
|
+
this.emit('levelup', { level: r.level });
|
|
5911
|
+
}
|
|
5912
|
+
this.emit('xp', { level: r.level, xp: r.xp, gained: n });
|
|
5913
|
+
}
|
|
5914
|
+
}
|
|
5915
|
+
return UsaXpBar;
|
|
5916
|
+
}, { id: 'xp-bar', text: css$2 });
|
|
5917
|
+
}
|
|
5918
|
+
|
|
5919
|
+
var css$1 = "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}}";
|
|
5920
|
+
|
|
5921
|
+
/** Unlocked / total counts for a badge list (7.5). */
|
|
5922
|
+
const badgeProgress = (b) => ({ unlocked: b.filter((x) => !x.locked).length, total: b.length });
|
|
5923
|
+
function defineBadgeWall(tag = 'usa-badge-wall') {
|
|
5924
|
+
return base.defineElement(tag, (Base) => {
|
|
5925
|
+
class UsaBadgeWall extends Base {
|
|
5926
|
+
constructor() {
|
|
5927
|
+
super(...arguments);
|
|
5928
|
+
this._b = [];
|
|
5929
|
+
}
|
|
5930
|
+
get badges() {
|
|
5931
|
+
return this._b.map((b) => ({ ...b }));
|
|
5932
|
+
}
|
|
5933
|
+
mount() {
|
|
5934
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
5935
|
+
const seed = Array.from(this.querySelectorAll(':scope > li'));
|
|
5936
|
+
if (seed.length)
|
|
5937
|
+
this._b = seed.map((li) => ({ name: (li.textContent || '').trim(), icon: li.dataset.icon || '🏅', locked: li.hasAttribute('data-locked') }));
|
|
5938
|
+
seed.forEach((li) => li.remove());
|
|
5939
|
+
this.insertAdjacentHTML('beforeend', '<p class="usa-bw-count" data-usa-part></p><ul class="usa-bw-grid" data-usa-part></ul><span class="usa-bw-live" data-usa-part aria-live="polite"></span>');
|
|
5940
|
+
const grid = this.querySelector('.usa-bw-grid');
|
|
5941
|
+
grid.setAttribute('aria-label', this.str('label', 'Achievements'));
|
|
5942
|
+
for (const b of this._b) {
|
|
5943
|
+
const li = document.createElement('li');
|
|
5944
|
+
li.className = 'usa-bw-badge';
|
|
5945
|
+
li.innerHTML = '<span class="usa-bw-icon" aria-hidden="true"></span><span class="usa-bw-name"></span>';
|
|
5946
|
+
li.querySelector('.usa-bw-icon').textContent = b.icon;
|
|
5947
|
+
li.querySelector('.usa-bw-name').textContent = b.name;
|
|
5948
|
+
li.dataset.name = b.name;
|
|
5949
|
+
grid.appendChild(li);
|
|
5950
|
+
this.paintBadge(li, b);
|
|
5951
|
+
}
|
|
5952
|
+
this.count();
|
|
5953
|
+
}
|
|
5954
|
+
paintBadge(li, b) {
|
|
5955
|
+
li.toggleAttribute('data-locked', b.locked);
|
|
5956
|
+
li.setAttribute('aria-label', `${b.name}, ${b.locked ? 'locked' : 'unlocked'}`);
|
|
5957
|
+
}
|
|
5958
|
+
count() {
|
|
5959
|
+
const p = badgeProgress(this._b);
|
|
5960
|
+
this.querySelector('.usa-bw-count').textContent = `${p.unlocked} / ${p.total} unlocked`;
|
|
5961
|
+
}
|
|
5962
|
+
unlock(name) {
|
|
5963
|
+
const b = this._b.find((x) => x.name === name && x.locked);
|
|
5964
|
+
if (!b)
|
|
5965
|
+
return false;
|
|
5966
|
+
b.locked = false;
|
|
5967
|
+
const li = Array.from(this.querySelectorAll('.usa-bw-badge')).find((x) => x.dataset.name === name);
|
|
5968
|
+
if (li) {
|
|
5969
|
+
if (!this.reduced) {
|
|
5970
|
+
this.motion(li, [{ transform: 'perspective(400px) rotateY(0)' }, { transform: 'perspective(400px) rotateY(90deg)', offset: 0.45 }, { transform: 'perspective(400px) rotateY(0) scale(1.12)', offset: 0.8 }, { transform: 'none' }], { duration: 700, easing: 'ease-out' });
|
|
5971
|
+
setTimeout(() => this.paintBadge(li, b), 300);
|
|
5972
|
+
li.dataset.shine = '';
|
|
5973
|
+
setTimeout(() => delete li.dataset.shine, 1100);
|
|
5974
|
+
}
|
|
5975
|
+
else
|
|
5976
|
+
this.paintBadge(li, b);
|
|
5977
|
+
li.setAttribute('aria-label', `${b.name}, unlocked`);
|
|
5978
|
+
}
|
|
5979
|
+
this.count();
|
|
5980
|
+
this.querySelector('.usa-bw-live').textContent = `Unlocked: ${name}`;
|
|
5981
|
+
this.emit('unlock', { name });
|
|
5982
|
+
return true;
|
|
5983
|
+
}
|
|
5984
|
+
}
|
|
5985
|
+
return UsaBadgeWall;
|
|
5986
|
+
}, { id: 'badge-wall', text: css$1 });
|
|
5987
|
+
}
|
|
5988
|
+
|
|
5989
|
+
var css = "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)}";
|
|
5990
|
+
|
|
5991
|
+
/** Final wheel rotation (deg) that puts segment `index` of `count` under the top pointer after `turns` full turns (7.5). */
|
|
5992
|
+
function wheelAngle(index, count, turns = 5) {
|
|
5993
|
+
const seg = 360 / Math.max(1, count);
|
|
5994
|
+
return turns * 360 + (360 - (index * seg + seg / 2));
|
|
5995
|
+
}
|
|
5996
|
+
const COLORS = ['#7c5cff', '#22d3ee', '#f59e0b', '#ef4444', '#22c55e', '#ec4899', '#3b82f6', '#a3e635'];
|
|
5997
|
+
function definePrizeWheel(tag = 'usa-prize-wheel') {
|
|
5998
|
+
return base.defineElement(tag, (Base) => {
|
|
5999
|
+
class UsaPrizeWheel extends Base {
|
|
6000
|
+
constructor() {
|
|
6001
|
+
super(...arguments);
|
|
6002
|
+
this._r = -1;
|
|
6003
|
+
this._spin = false;
|
|
6004
|
+
this._rot = 0;
|
|
6005
|
+
}
|
|
6006
|
+
get segments() {
|
|
6007
|
+
return this.str('segments', '10% off,Free ship,Try again,🎁 Gift,5% off,Jackpot').split(',').map((s) => s.trim()).filter(Boolean);
|
|
6008
|
+
}
|
|
6009
|
+
get result() {
|
|
6010
|
+
return this._r;
|
|
6011
|
+
}
|
|
6012
|
+
get spinning() {
|
|
6013
|
+
return this._spin;
|
|
6014
|
+
}
|
|
6015
|
+
mount() {
|
|
6016
|
+
this.querySelectorAll(':scope > [data-usa-part]').forEach((n) => n.remove());
|
|
6017
|
+
const s = this.segments;
|
|
6018
|
+
const seg = 360 / s.length;
|
|
6019
|
+
const grad = s.map((_, i) => `${COLORS[i % COLORS.length]} ${(i * seg).toFixed(2)}deg ${((i + 1) * seg).toFixed(2)}deg`).join(',');
|
|
6020
|
+
this.insertAdjacentHTML('beforeend', '<span class="usa-pw-box" data-usa-part><i class="usa-pw-pointer" aria-hidden="true"></i><span class="usa-pw-wheel" aria-hidden="true"></span><button type="button" class="usa-pw-btn"></button></span><span class="usa-pw-live" data-usa-part aria-live="polite"></span>');
|
|
6021
|
+
const wheel = this.querySelector('.usa-pw-wheel');
|
|
6022
|
+
wheel.style.background = `conic-gradient(${grad})`;
|
|
6023
|
+
s.forEach((label, i) => {
|
|
6024
|
+
const l = document.createElement('span');
|
|
6025
|
+
l.className = 'usa-pw-label';
|
|
6026
|
+
l.textContent = label;
|
|
6027
|
+
l.style.transform = `rotate(${(i * seg + seg / 2).toFixed(2)}deg)`;
|
|
6028
|
+
wheel.appendChild(l);
|
|
6029
|
+
});
|
|
6030
|
+
this._rot = 0;
|
|
6031
|
+
const btn = this.querySelector('.usa-pw-btn');
|
|
6032
|
+
btn.textContent = this.str('label', 'Spin');
|
|
6033
|
+
btn.setAttribute('aria-label', `${this.str('label', 'Spin')} the prize wheel`);
|
|
6034
|
+
this.listen(btn, 'click', () => void this.spin());
|
|
6035
|
+
}
|
|
6036
|
+
async spin(index) {
|
|
6037
|
+
if (this._spin)
|
|
6038
|
+
return this._r;
|
|
6039
|
+
const s = this.segments;
|
|
6040
|
+
const i = index !== undefined && index >= 0 && index < s.length ? Math.floor(index) : Math.floor(Math.random() * s.length);
|
|
6041
|
+
const wheel = this.querySelector('.usa-pw-wheel');
|
|
6042
|
+
const btn = this.querySelector('.usa-pw-btn');
|
|
6043
|
+
if (!wheel || !btn)
|
|
6044
|
+
return -1;
|
|
6045
|
+
this._spin = true;
|
|
6046
|
+
btn.disabled = true;
|
|
6047
|
+
this.removeAttribute('data-done');
|
|
6048
|
+
const base = this._rot - (this._rot % 360);
|
|
6049
|
+
const to = base + wheelAngle(i, s.length, this.reduced ? 0 : this.num('turns', 5));
|
|
6050
|
+
const from = this._rot;
|
|
6051
|
+
this._rot = to;
|
|
6052
|
+
const a = this.reduced ? null : this.motion(wheel, [{ transform: `rotate(${from}deg)` }, { transform: `rotate(${to}deg)` }], { duration: this.num('duration', 4000), easing: 'cubic-bezier(.12,.6,.1,1)' });
|
|
6053
|
+
wheel.style.transform = `rotate(${to}deg)`;
|
|
6054
|
+
if (a) {
|
|
6055
|
+
const ptr = this.querySelector('.usa-pw-pointer');
|
|
6056
|
+
this.motion(ptr, [{ transform: 'rotate(0)' }, { transform: 'rotate(-18deg)' }, { transform: 'rotate(0)' }], { duration: 160, iterations: 18, easing: 'ease-out' });
|
|
6057
|
+
await a.finished.catch(() => undefined);
|
|
6058
|
+
}
|
|
6059
|
+
this._spin = false;
|
|
6060
|
+
btn.disabled = false;
|
|
6061
|
+
this._r = i;
|
|
6062
|
+
this.setAttribute('data-done', '');
|
|
6063
|
+
this.querySelector('.usa-pw-live').textContent = `Result: ${s[i]}`;
|
|
6064
|
+
this.emit('result', { index: i, label: s[i] });
|
|
6065
|
+
return i;
|
|
6066
|
+
}
|
|
6067
|
+
}
|
|
6068
|
+
return UsaPrizeWheel;
|
|
6069
|
+
}, { id: 'prize-wheel', text: css });
|
|
5705
6070
|
}
|
|
5706
6071
|
|
|
5707
6072
|
/**
|
|
@@ -5730,6 +6095,7 @@ const WIDGETS = {
|
|
|
5730
6095
|
'7.2': { 'usa-bar-chart': defineBarChart, 'usa-gauge': defineGauge, 'usa-sparkline': defineSparkline, 'usa-kpi': defineKpi },
|
|
5731
6096
|
'7.3': { 'usa-add-to-cart': defineAddToCart, 'usa-cart-drawer': defineCartDrawer, 'usa-product-gallery': defineProductGallery, 'usa-countdown': defineCountdown },
|
|
5732
6097
|
'7.4': { 'usa-message-list': defineMessageList, 'usa-reactions': defineReactions, 'usa-notification-bell': defineNotificationBell, 'usa-presence': definePresence },
|
|
6098
|
+
'7.5': { 'usa-leaderboard': defineLeaderboard, 'usa-xp-bar': defineXpBar, 'usa-badge-wall': defineBadgeWall, 'usa-prize-wheel': definePrizeWheel },
|
|
5733
6099
|
};
|
|
5734
6100
|
/** Every widget tag, in release order. */
|
|
5735
6101
|
const WIDGET_TAGS = Object.values(WIDGETS).flatMap((g) => Object.keys(g));
|
|
@@ -5760,8 +6126,10 @@ exports.TOGGLE_VARIANTS = TOGGLE_VARIANTS;
|
|
|
5760
6126
|
exports.WEATHER_CONDITIONS = WEATHER_CONDITIONS;
|
|
5761
6127
|
exports.WIDGETS = WIDGETS;
|
|
5762
6128
|
exports.WIDGET_TAGS = WIDGET_TAGS;
|
|
6129
|
+
exports.badgeProgress = badgeProgress;
|
|
5763
6130
|
exports.cartTotal = cartTotal;
|
|
5764
6131
|
exports.defineAddToCart = defineAddToCart;
|
|
6132
|
+
exports.defineBadgeWall = defineBadgeWall;
|
|
5765
6133
|
exports.defineBarChart = defineBarChart;
|
|
5766
6134
|
exports.defineCarousel = defineCarousel;
|
|
5767
6135
|
exports.defineCartDrawer = defineCartDrawer;
|
|
@@ -5778,6 +6146,7 @@ exports.defineGauge = defineGauge;
|
|
|
5778
6146
|
exports.defineKanban = defineKanban;
|
|
5779
6147
|
exports.defineKeyframeEditor = defineKeyframeEditor;
|
|
5780
6148
|
exports.defineKpi = defineKpi;
|
|
6149
|
+
exports.defineLeaderboard = defineLeaderboard;
|
|
5781
6150
|
exports.defineLyrics = defineLyrics;
|
|
5782
6151
|
exports.defineMasonryFlow = defineMasonryFlow;
|
|
5783
6152
|
exports.defineMenu = defineMenu;
|
|
@@ -5791,6 +6160,7 @@ exports.defineNotificationBell = defineNotificationBell;
|
|
|
5791
6160
|
exports.defineOdometer = defineOdometer;
|
|
5792
6161
|
exports.definePagination = definePagination;
|
|
5793
6162
|
exports.definePresence = definePresence;
|
|
6163
|
+
exports.definePrizeWheel = definePrizeWheel;
|
|
5794
6164
|
exports.defineProductGallery = defineProductGallery;
|
|
5795
6165
|
exports.defineProgressRing = defineProgressRing;
|
|
5796
6166
|
exports.definePullCord = definePullCord;
|
|
@@ -5810,16 +6180,20 @@ exports.defineToastStack = defineToastStack;
|
|
|
5810
6180
|
exports.defineVolumeKnob = defineVolumeKnob;
|
|
5811
6181
|
exports.defineWeatherCard = defineWeatherCard;
|
|
5812
6182
|
exports.defineWidgets = defineWidgets;
|
|
6183
|
+
exports.defineXpBar = defineXpBar;
|
|
5813
6184
|
exports.hexToHsv = hexToHsv;
|
|
5814
6185
|
exports.hsvToHex = hsvToHex;
|
|
5815
6186
|
exports.initials = initials;
|
|
6187
|
+
exports.levelFor = levelFor;
|
|
5816
6188
|
exports.monthGrid = monthGrid;
|
|
5817
6189
|
exports.pageWindow = pageWindow;
|
|
5818
6190
|
exports.parseISODate = parseISODate;
|
|
5819
6191
|
exports.parseLRC = parseLRC;
|
|
5820
6192
|
exports.parseReactions = parseReactions;
|
|
6193
|
+
exports.rankRows = rankRows;
|
|
5821
6194
|
exports.sparkPoints = sparkPoints;
|
|
5822
6195
|
exports.splitTime = splitTime;
|
|
5823
6196
|
exports.stackToast = stackToast;
|
|
6197
|
+
exports.wheelAngle = wheelAngle;
|
|
5824
6198
|
exports.wrapIndex = wrapIndex;
|
|
5825
6199
|
//# sourceMappingURL=widgets.cjs.map
|