@shineuix/core 1.0.0 → 1.0.1

package/dist/cjs/sui-description-list.cjs.entry.js

@@ -4,9 +4,9 @@ var index = require('./index-BtWzlhN3.js');
 var renderContent = require('./render-content-Bij4diic.js');
 var clipboard = require('./clipboard-DHY6LL_N.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 
-const suiDescriptionListCss = () => `.sc-sui-description-list-h{display:block;font-family:var(--font-sans);color:var(--ink)}.sui-dl.sc-sui-description-list{margin:0;padding:0}.sui-dl.columns.sc-sui-description-list{display:grid;gap:8px}.rows.sc-sui-description-list .item.sc-sui-description-list{display:flex;gap:14px;padding:8px 0;border-bottom:1px solid var(--hairline);align-items:baseline}.rows.sc-sui-description-list .term.sc-sui-description-list{flex-shrink:0;margin:0;font-size:12.5px;font-weight:550;color:var(--ink-muted)}.columns.sc-sui-description-list .item.sc-sui-description-list{display:flex;flex-direction:column;gap:3px;padding:10px 12px;background:var(--surface-sunken);border-radius:var(--radius-md);min-width:0}.columns.sc-sui-description-list .term.sc-sui-description-list{width:auto;margin:0;font-size:10.5px;font-weight:650;color:var(--ink-muted);text-transform:uppercase;letter-spacing:0.06em}.detail.sc-sui-description-list{flex:1;margin:0;min-width:0;display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:550;color:var(--ink);font-feature-settings:'tnum'}.detail.strong.sc-sui-description-list{font-weight:700}.value.sc-sui-description-list{min-width:0;overflow-wrap:anywhere}.copy.sc-sui-description-list{appearance:none;display:inline-flex;align-items:center;justify-content:center;margin:0;padding:2px;border:0;background:transparent;border-radius:var(--radius-xs);font-size:10.5px;line-height:1;color:var(--ink-faint);cursor:pointer;transition:color var(--duration-fast) var(--ease-out)}.copy.sc-sui-description-list:hover{color:var(--ink)}.copy.done.sc-sui-description-list{background:var(--brand-soft);color:var(--brand-soft-ink)}.copy.sc-sui-description-list:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sr-status.sc-sui-description-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}`;
+const suiDescriptionListCss = () => `.sc-sui-description-list-h{display:block;font-family:var(--font-sans);color:var(--ink)}[align].sc-sui-description-list-h{text-align:inherit}.sui-dl.sc-sui-description-list{margin:0;padding:0}.sui-dl.columns.sc-sui-description-list{display:grid;gap:8px}.rows.sc-sui-description-list .item.sc-sui-description-list{display:flex;gap:14px;padding:8px 0;border-bottom:1px solid var(--hairline);align-items:baseline}.rows.sc-sui-description-list .term.sc-sui-description-list{flex-shrink:0;margin:0;font-size:12.5px;font-weight:550;color:var(--ink-muted)}.columns.sc-sui-description-list .item.sc-sui-description-list{display:flex;flex-direction:column;gap:3px;padding:10px 12px;background:var(--surface-sunken);border-radius:var(--radius-md);min-width:0}.columns.sc-sui-description-list .term.sc-sui-description-list{width:auto;margin:0;font-size:10.5px;font-weight:650;color:var(--ink-muted);text-transform:uppercase;letter-spacing:0.06em}.detail.sc-sui-description-list{flex:1;margin:0;min-width:0;display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:550;color:var(--ink);font-feature-settings:'tnum'}.detail.strong.sc-sui-description-list{font-weight:700}.value.sc-sui-description-list{min-width:0;overflow-wrap:anywhere}.end.sc-sui-description-list .detail.sc-sui-description-list{justify-content:flex-end;text-align:end}.columns.end.sc-sui-description-list .item.sc-sui-description-list{align-items:flex-end;text-align:end}.copy.sc-sui-description-list{appearance:none;display:inline-flex;align-items:center;justify-content:center;margin:0;padding:2px;border:0;background:transparent;border-radius:var(--radius-xs);font-size:10.5px;line-height:1;color:var(--ink-faint);cursor:pointer;transition:color var(--duration-fast) var(--ease-out)}.copy.sc-sui-description-list:hover{color:var(--ink)}.copy.done.sc-sui-description-list{background:var(--brand-soft);color:var(--brand-soft-ink)}.copy.sc-sui-description-list:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sr-status.sc-sui-description-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}`;
 
 const COPIED_MS = 1400;
 const SuiDescriptionList = class {
@@ -26,6 +26,13 @@ const SuiDescriptionList = class {
     columns = 2;
     /** Term column width in px in the rows layout. */
     termWidth = 150;
+    /**
+     * Which side the values sit on, in the reading direction. `end` lines figures up on their last
+     * digit, for a summary such as subtotal, tax and balance due. It is one side for the whole list,
+     * as a table column has one: a list that mixes names and dates with amounts reads best at the
+     * start. In the columns layout the term moves with its value.
+     */
+    align = 'start';
     /** Fires after a value reaches the clipboard, together with the short "Copied" state on the
      *  control; detail is the copied text, as on every element that copies. */
     suiCopy;
@@ -69,7 +76,7 @@ const SuiDescriptionList = class {
     render() {
         const rows = this.layout === 'rows';
         const items = this.items || [];
-        return (index.h(index.Host, { key: 'da49cf66b779b2d428143f420ea4ce6e1a7a4473' }, index.h("dl", { key: '421493290ad688348e9e40814cd4cb916a792efd', class: { 'sui-dl': true, rows, columns: !rows }, style: !rows ? { gridTemplateColumns: `repeat(${Math.max(1, this.columns | 0)}, 1fr)` } : undefined }, items.map((it, i) => (index.h("div", { class: "item", key: i }, index.h("dt", { class: "term", style: rows ? { width: `${this.termWidth}px` } : undefined }, it.term), index.h("dd", { class: { detail: true, strong: !!it.strong } }, index.h("span", { class: "value", ref: (el) => renderContent.mountContent(el, it.detail) }), it.copy ? this.renderCopy(it, i) : null))))), index.h("span", { key: '2397428704ca345e33c580c28d29cec8bd163d24', class: "sr-status", role: "status", "aria-live": "polite" }, this.copiedIdx >= 0 ? locale.localeText(undefined, 'description-list.copied', undefined, 'Copied') : '')));
+        return (index.h(index.Host, { key: 'a1e220243fe7d55656465055ea99c5fd4f16b8b3' }, index.h("dl", { key: '40d4ded095fd72700df4e5b8eae9e2042f575d6f', class: { 'sui-dl': true, rows, columns: !rows, end: this.align === 'end' }, style: !rows ? { gridTemplateColumns: `repeat(${Math.max(1, this.columns | 0)}, 1fr)` } : undefined }, items.map((it, i) => (index.h("div", { class: "item", key: i }, index.h("dt", { class: "term", style: rows ? { width: `${this.termWidth}px` } : undefined }, it.term), index.h("dd", { class: { detail: true, strong: !!it.strong } }, index.h("span", { class: "value", ref: (el) => renderContent.mountContent(el, it.detail) }), it.copy ? this.renderCopy(it, i) : null))))), index.h("span", { key: '6699245bda7806c9309dff4c92aaa7c2aab1f61a', class: "sr-status", role: "status", "aria-live": "polite" }, this.copiedIdx >= 0 ? locale.localeText(undefined, 'description-list.copied', undefined, 'Copied') : '')));
     }
 };
 SuiDescriptionList.style = suiDescriptionListCss();

package/dist/cjs/sui-dialog.cjs.entry.js

@@ -1,17 +1,17 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var modal = require('./modal-1S8X9Mu6.js');
-var layer = require('./layer-BkCcJvyt.js');
+var modal = require('./modal-BqGRqHln.js');
+var layer = require('./layer-31199iWw.js');
 var slots = require('./slots-rhqoeAqs.js');
 var id = require('./id-Ca7UTKW6.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 require('./anchor-BjGUozqb.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./overlay-DcMtiB1L.js');
+require('./overlay-CsoWlGY8.js');
 require('./direction-BaE_rqNY.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiDialogCss = () => `.sc-sui-dialog-h{display:contents;font-family:var(--font-sans)}.layer.sc-sui-dialog{position:fixed;inset:0;z-index:var(--z-dialog)}.scrim.sc-sui-dialog{position:absolute;inset:0;background:var(--scrim);animation:sui-dialog-fade var(--duration-overlay) var(--ease-out)}.card.sc-sui-dialog{position:absolute;top:12vh;left:0;right:0;margin:0 auto;width:min(520px, calc(100% - 40px));box-sizing:border-box;max-height:76vh;background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-overlay);display:flex;flex-direction:column;animation:sui-dialog-in var(--duration-overlay) var(--ease-out)}.card.sm.sc-sui-dialog{width:min(400px, calc(100% - 40px))}.card.lg.sc-sui-dialog{width:min(680px, calc(100% - 40px))}.card.sc-sui-dialog:focus{outline:none}.card.dragging.sc-sui-dialog{user-select:none;-webkit-user-select:none;box-shadow:var(--shadow-overlay), var(--shadow-overlay), var(--shadow-pop), 0 0 0 1px var(--border-strong)}.card.maximized.sc-sui-dialog{top:0;left:0;right:0;bottom:0;margin:0;width:100%;height:100%;max-height:none;border-radius:0;animation-name:sui-dialog-fade}.card.maximized.sc-sui-dialog .body.sc-sui-dialog{flex:1}.card.maximized.sc-sui-dialog .foot.has.sc-sui-dialog{border-radius:0}.head.sc-sui-dialog{display:flex;align-items:flex-start;gap:12px;padding:18px 20px 0}.head.handle.sc-sui-dialog{cursor:grab;touch-action:none}.card.dragging.sc-sui-dialog .head.handle.sc-sui-dialog{cursor:grabbing}.titles.sc-sui-dialog{flex:1;min-width:0}.heading.sc-sui-dialog{font-size:17px;font-weight:730;letter-spacing:var(--tracking-tight);color:var(--ink)}.subtitle.sc-sui-dialog{font-size:12.5px;color:var(--ink-muted);margin-top:3px}.controls.sc-sui-dialog{display:flex;align-items:center;gap:4px;flex-shrink:0;margin-top:-2px}.controls.sc-sui-dialog .sui-glyph.sc-sui-dialog{font-size:var(--icon-size-sm)}.body.sc-sui-dialog{padding:14px 20px 18px;overflow:auto;overscroll-behavior:contain;font-size:13.5px;line-height:1.55;color:var(--ink)}.body.sc-sui-dialog:focus{outline:none}.foot.sc-sui-dialog{display:none}.foot.has.sc-sui-dialog{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding:13px 20px;border-top:1px solid var(--hairline);background:var(--surface-sunken);border-radius:0 0 var(--radius-lg) var(--radius-lg)}.layer.closing.sc-sui-dialog{pointer-events:none}.layer.closing.sc-sui-dialog .scrim.sc-sui-dialog,.layer.closing.sc-sui-dialog .card.sc-sui-dialog{animation:sui-dialog-out var(--duration-fast) var(--ease-out) forwards}@keyframes sui-dialog-fade{from{opacity:0}}@keyframes sui-dialog-in{from{opacity:0;top:calc(12vh + 4px)}}@keyframes sui-dialog-out{to{opacity:0}}.foot.sc-sui-dialog-s>span,.foot .sc-sui-dialog-s>span,.foot.sc-sui-dialog-s>div,.foot .sc-sui-dialog-s>div{display:inline-flex;align-items:center;flex-wrap:wrap;gap:10px}@media (max-height: 480px){.card.sc-sui-dialog{top:16px;max-height:calc(100% - 32px);overflow-y:auto;overscroll-behavior:contain;animation-name:sui-dialog-fade}.body.sc-sui-dialog{overflow:visible}}@media (forced-colors: active){.card.sc-sui-dialog{border:1px solid CanvasText}}`;
 
@@ -185,7 +185,7 @@ const SuiDialog = class {
         this.modal = undefined;
         this.endDrag();
     }
-    /** The fade has run (or there was none): the layer goes, and a dragged card returns to centre
+    /** The fade has run (or there was none): the layer goes, and a dragged card returns to center
      *  for the next open rather than snapping there while still visible. */
     exited() {
         this.closing = false;
@@ -237,7 +237,7 @@ const SuiDialog = class {
         const placed = this.offset && !this.maximized
             ? { top: `${this.offset.y}px`, left: `${this.offset.x}px`, right: 'auto', margin: '0' }
             : undefined;
-        return (index.h(index.Host, { key: '6683cfed73ece872aa5f28ed3a33d5a6d28fbce0' }, this.open || this.closing ? (index.h("div", { class: { layer: true, closing: this.closing }, inert: this.closing, ref: (el) => (this.layer = el) }, index.h("div", { class: "scrim", onMouseDown: this.onScrimPress, onClick: () => this.requestClose('scrim') }), index.h("div", { ref: (el) => (this.card = el), class: { card: true, [this.size]: true, maximized: this.maximized, dragging: this.dragging }, style: placed, role: "dialog", tabindex: "-1", "aria-labelledby": this.hasHeader ? titleId : undefined, "aria-label": this.hasHeader ? undefined : this.heading || undefined }, index.h("div", { class: { head: true, handle: this.movable && !this.maximized }, onPointerDown: this.onHeadPointerDown }, index.h("div", { class: "titles", id: titleId }, index.h("slot", { name: "header" }), !this.hasHeader ? index.h("div", { class: "heading" }, this.heading) : null, !this.hasHeader && this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), this.maximizable || !this.hideClose ? (index.h("div", { class: "controls" }, this.maximizable ? (index.h("sui-icon-button", { class: "maximize", size: "sm", "aria-label": this.maximized ? locale.localeText(undefined, 'dialog.restore', undefined, 'Restore') : locale.localeText(undefined, 'dialog.maximize', undefined, 'Maximize'), onClick: this.toggleMaximized }, index.h(glyphs.Glyph, { glyph: this.maximized ? glyphs.compress : glyphs.expand }))) : null, !this.hideClose ? (index.h("sui-icon-button", { class: "close", size: "sm", "aria-label": locale.localeText(undefined, 'dialog.close', undefined, 'Close'), onClick: () => this.requestClose('close-button') }, index.h(glyphs.Glyph, { glyph: glyphs.xmark }))) : null)) : null), index.h("div", { class: "body", ref: (el) => (this.body = el) }, index.h("slot", null)), index.h("div", { class: { foot: true, has: this.hasFooter } }, index.h("slot", { name: "footer" }))))) : null));
+        return (index.h(index.Host, { key: 'd1a87cd13fde55d1515d8917af49396c25bad092' }, this.open || this.closing ? (index.h("div", { class: { layer: true, closing: this.closing }, inert: this.closing, ref: (el) => (this.layer = el) }, index.h("div", { class: "scrim", onMouseDown: this.onScrimPress, onClick: () => this.requestClose('scrim') }), index.h("div", { ref: (el) => (this.card = el), class: { card: true, [this.size]: true, maximized: this.maximized, dragging: this.dragging }, style: placed, role: "dialog", tabindex: "-1", "aria-labelledby": this.hasHeader ? titleId : undefined, "aria-label": this.hasHeader ? undefined : this.heading || undefined }, index.h("div", { class: { head: true, handle: this.movable && !this.maximized }, onPointerDown: this.onHeadPointerDown }, index.h("div", { class: "titles", id: titleId }, index.h("slot", { name: "header" }), !this.hasHeader ? index.h("div", { class: "heading" }, this.heading) : null, !this.hasHeader && this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), this.maximizable || !this.hideClose ? (index.h("div", { class: "controls" }, this.maximizable ? (index.h("sui-icon-button", { class: "maximize", size: "sm", "aria-label": this.maximized ? locale.localeText(undefined, 'dialog.restore', undefined, 'Restore') : locale.localeText(undefined, 'dialog.maximize', undefined, 'Maximize'), onClick: this.toggleMaximized }, index.h(glyphs.Glyph, { glyph: this.maximized ? glyphs.compress : glyphs.expand }))) : null, !this.hideClose ? (index.h("sui-icon-button", { class: "close", size: "sm", "aria-label": locale.localeText(undefined, 'dialog.close', undefined, 'Close'), onClick: () => this.requestClose('close-button') }, index.h(glyphs.Glyph, { glyph: glyphs.xmark }))) : null)) : null), index.h("div", { class: "body", ref: (el) => (this.body = el) }, index.h("slot", null)), index.h("div", { class: { foot: true, has: this.hasFooter } }, index.h("slot", { name: "footer" }))))) : null));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/sui-divider.cjs.entry.js

@@ -27,7 +27,7 @@ const SuiDivider = class {
             ? { minHeight: `${this.height}px`, margin: `0 ${this.spacing}px` }
             : { margin: `${this.spacing}px 0` };
         const labeled = !vertical && !!this.label;
-        return (index.h(index.Host, { key: '7bb2c5c6e090d1b9db4cfbfe0891c17172a29373', role: "separator", "aria-orientation": vertical ? 'vertical' : 'horizontal', class: { labeled, strong: this.strong, dashed: this.dashed }, style: style }, labeled ? [index.h("span", { class: "line" }), index.h("span", { class: "label" }, this.label), index.h("span", { class: "line" })] : null));
+        return (index.h(index.Host, { key: '74bbb0a2dc9ef0693f9516d0dbdd927e7804337f', role: "separator", "aria-orientation": vertical ? 'vertical' : 'horizontal', class: { labeled, strong: this.strong, dashed: this.dashed }, style: style }, labeled ? [index.h("span", { class: "line" }), index.h("span", { class: "label" }, this.label), index.h("span", { class: "line" })] : null));
     }
 };
 SuiDivider.style = suiDividerCss();

package/dist/cjs/sui-dock.cjs.entry.js

@@ -2,9 +2,9 @@
 
 var index = require('./index-BtWzlhN3.js');
 var formControl = require('./form-control-CvMyyCaa.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 
 const suiDockCss = () => `.sc-sui-dock-h{display:inline-block;vertical-align:top;font-family:var(--font-sans)}[position].sc-sui-dock-h{position:fixed;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:center;pointer-events:none}[position].sc-sui-dock-h>.bar-wrap.sc-sui-dock,[position].sc-sui-dock-h>.radial.sc-sui-dock{pointer-events:auto}[position='top'].sc-sui-dock-h{left:0;right:0;top:var(--space-4)}[position='bottom'].sc-sui-dock-h{left:0;right:0;bottom:var(--space-4)}[position='left'].sc-sui-dock-h{top:0;bottom:0;left:var(--space-4)}[position='right'].sc-sui-dock-h{top:0;bottom:0;right:var(--space-4)}.bar-wrap.sc-sui-dock{display:inline-flex;align-items:center;gap:4px;padding:8px;background:var(--surface-navy);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop)}.bar-wrap.h.sc-sui-dock{flex-direction:row}.bar-wrap.v.sc-sui-dock{flex-direction:column}.sep.sc-sui-dock{background:var(--border-inverse);margin:2px}.bar-wrap.h.sc-sui-dock .sep.sc-sui-dock{width:1px;height:24px}.bar-wrap.v.sc-sui-dock .sep.sc-sui-dock{width:24px;height:1px}.tile.sc-sui-dock,.ctl.sc-sui-dock{position:relative;width:44px;height:44px;flex-shrink:0;margin:0;padding:0;border:none;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-sans);color:var(--ink-inverse-muted);background:transparent;text-decoration:none;line-height:normal;transition:background var(--duration-fast) var(--ease-out)}a.tile.sc-sui-dock,a.tile.sc-sui-dock:hover,a.tile.sc-sui-dock:visited{color:var(--ink-inverse-muted);text-decoration:none}a.tile.on.sc-sui-dock,a.tile.on.sc-sui-dock:hover,a.tile.on.sc-sui-dock:visited{color:var(--accent)}.tile.sc-sui-dock:hover{background:color-mix(in srgb, var(--ink-inverse) 5%, transparent)}.tile.on.sc-sui-dock{background:color-mix(in srgb, var(--ink-inverse) 9%, transparent);color:var(--accent)}.tile.sc-sui-dock:focus-visible,.ctl.sc-sui-dock:focus-visible,.center.sc-sui-dock:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.icon.sc-sui-dock{font-size:17px}.mark.sc-sui-dock{width:26px;height:26px;border-radius:7px;display:block}.bar.sc-sui-dock{position:absolute;background:transparent;transition:background var(--duration-fast) var(--ease-out)}.bar.h.sc-sui-dock{top:-6px;left:50%;transform:translateX(-50%);height:3px;width:22px;border-radius:0 0 3px 3px}.bar.v.sc-sui-dock{inset-inline-start:-6px;top:50%;transform:translateY(-50%);width:3px;height:22px;border-start-start-radius:0;border-start-end-radius:3px;border-end-end-radius:3px;border-end-start-radius:0}.tile.on.sc-sui-dock .bar.sc-sui-dock{background:var(--accent)}.ring.sc-sui-dock{position:absolute;inset:3px;border-radius:9px;border:2px solid var(--accent);pointer-events:none}.badge.sc-sui-dock{position:absolute;top:2px;inset-inline-end:2px;min-width:15px;height:15px;padding:0 4px;box-sizing:border-box;border-radius:8px;background:var(--accent);color:var(--accent-contrast);font-size:9px;font-weight:720;font-feature-settings:'tnum';display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px var(--surface-navy)}.ctl.sc-sui-dock{background:color-mix(in srgb, var(--ink-inverse) 7%, transparent)}.ctl.sc-sui-dock:hover{background:color-mix(in srgb, var(--ink-inverse) 14%, transparent)}.grip.sc-sui-dock{font-size:15px}.tip.sc-sui-dock{position:absolute;z-index:30;white-space:nowrap;background:var(--surface-raised);color:var(--ink);border:1px solid var(--border);font-size:11px;font-weight:620;font-family:var(--font-sans);padding:5px 9px;border-radius:6px;box-shadow:var(--shadow-pop);pointer-events:none}.tip.right.sc-sui-dock{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tip.left.sc-sui-dock{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tip.top.sc-sui-dock{bottom:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tip.bottom.sc-sui-dock{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tip.radial-tip.sc-sui-dock{transform:translate(-50%, -100%);z-index:var(--z-tooltip)}.radial.sc-sui-dock{position:relative;display:inline-block}.sat.sc-sui-dock{position:absolute;transform:translate(-50%, -50%);background:var(--surface-navy);border-radius:13px;box-shadow:var(--shadow-pop);padding:3px}.center.sc-sui-dock{position:absolute;transform:translate(-50%, -50%);width:48px;height:48px;border-radius:50%;border:none;padding:0;cursor:pointer;box-shadow:var(--shadow-pop);background:var(--surface-navy);color:var(--ink-inverse);display:flex;align-items:center;justify-content:center;transition:background var(--duration-base) var(--ease-out)}.center.open.sc-sui-dock{background:var(--accent);color:var(--accent-contrast)}.center.sc-sui-dock .sui-glyph.sc-sui-dock{font-size:16px}@media (forced-colors: active){.bar-wrap.sc-sui-dock,.sat.sc-sui-dock{border:1px solid CanvasText}.sep.sc-sui-dock{background:CanvasText}.tile.on.sc-sui-dock{forced-color-adjust:none;background:Highlight;color:HighlightText}a.tile.on.sc-sui-dock,a.tile.on.sc-sui-dock:hover,a.tile.on.sc-sui-dock:visited{color:HighlightText}.tile.sc-sui-dock:focus-visible,.ctl.sc-sui-dock:focus-visible,.center.sc-sui-dock:focus-visible{outline-color:CanvasText;box-shadow:none}.tile.on.sc-sui-dock .bar.sc-sui-dock{background:HighlightText}.ring.sc-sui-dock{border-color:Highlight}.badge.sc-sui-dock{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none}.ctl.sc-sui-dock,.center.sc-sui-dock{border:1px solid ButtonText;box-sizing:border-box}.center.open.sc-sui-dock{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight;box-shadow:none}.tip.sc-sui-dock{background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none}}`;
 

package/dist/cjs/sui-drawer.cjs.entry.js

@@ -1,17 +1,17 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var modal = require('./modal-1S8X9Mu6.js');
-var layer = require('./layer-BkCcJvyt.js');
+var modal = require('./modal-BqGRqHln.js');
+var layer = require('./layer-31199iWw.js');
 var slots = require('./slots-rhqoeAqs.js');
 var id = require('./id-Ca7UTKW6.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 require('./anchor-BjGUozqb.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./overlay-DcMtiB1L.js');
+require('./overlay-CsoWlGY8.js');
 require('./direction-BaE_rqNY.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiDrawerCss = () => `.sc-sui-drawer-h{display:contents;font-family:var(--font-sans)}.layer.sc-sui-drawer{position:fixed;inset:0;z-index:var(--z-dialog)}.scrim.sc-sui-drawer{position:absolute;inset:0;background:var(--scrim);animation:sui-drawer-fade var(--duration-overlay) var(--ease-out)}.panel.sc-sui-drawer{position:absolute;box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-overlay);animation:sui-drawer-right var(--duration-overlay) var(--ease-out)}.panel.sc-sui-drawer:focus{outline:none}.panel.right.sc-sui-drawer{top:0;right:0;bottom:0;width:var(--sui-drawer-size);border-radius:var(--radius-xl) 0 0 var(--radius-xl)}.panel.left.sc-sui-drawer{top:0;left:0;bottom:0;width:var(--sui-drawer-size);border-radius:0 var(--radius-xl) var(--radius-xl) 0;animation-name:sui-drawer-left}.panel.bottom.sc-sui-drawer{left:0;right:0;bottom:0;height:var(--sui-drawer-size);border-radius:var(--radius-xl) var(--radius-xl) 0 0;animation-name:sui-drawer-bottom}.panel.top.sc-sui-drawer{left:0;right:0;top:0;height:var(--sui-drawer-size);border-radius:0 0 var(--radius-xl) var(--radius-xl);animation-name:sui-drawer-top}.panel.full.sc-sui-drawer{inset:0;border-radius:0;animation-name:sui-drawer-fade}.head.sc-sui-drawer{display:flex;align-items:flex-start;gap:12px;padding:18px 20px;border-bottom:1px solid var(--hairline)}.titles.sc-sui-drawer{flex:1;min-width:0}.heading.sc-sui-drawer{font-size:16px;font-weight:730;letter-spacing:var(--tracking-tight);color:var(--ink)}.subtitle.sc-sui-drawer{font-size:12px;color:var(--ink-muted);margin-top:2px}.close.sc-sui-drawer{margin-top:-2px}.close.sc-sui-drawer .sui-glyph.sc-sui-drawer{font-size:var(--icon-size-sm)}.body.sc-sui-drawer{flex:1;overflow:auto;overscroll-behavior:contain;padding:16px 20px;font-size:13.5px;line-height:1.5;color:var(--ink)}.body.sc-sui-drawer:focus{outline:none}.foot.sc-sui-drawer{display:none}.foot.has.sc-sui-drawer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding:13px 20px;border-top:1px solid var(--hairline);background:var(--surface-sunken)}.layer.closing.sc-sui-drawer{pointer-events:none}.layer.closing.sc-sui-drawer .scrim.sc-sui-drawer,.layer.closing.sc-sui-drawer .panel.sc-sui-drawer{animation:sui-drawer-out var(--duration-fast) var(--ease-out) forwards}@keyframes sui-drawer-fade{from{opacity:0}}@keyframes sui-drawer-out{to{opacity:0}}@keyframes sui-drawer-right{from{opacity:0;right:calc(-1 * var(--sui-drawer-size))}}@keyframes sui-drawer-left{from{opacity:0;left:calc(-1 * var(--sui-drawer-size))}}@keyframes sui-drawer-bottom{from{opacity:0;bottom:calc(-1 * var(--sui-drawer-size))}}@keyframes sui-drawer-top{from{opacity:0;top:calc(-1 * var(--sui-drawer-size))}}.foot.sc-sui-drawer-s>span,.foot .sc-sui-drawer-s>span,.foot.sc-sui-drawer-s>div,.foot .sc-sui-drawer-s>div{display:inline-flex;align-items:center;flex-wrap:wrap;gap:10px}@media (max-height: 480px){.panel.sc-sui-drawer{overflow-y:auto;overscroll-behavior:contain}.body.sc-sui-drawer{flex:1 0 auto;overflow:visible}}@media (forced-colors: active){.panel.sc-sui-drawer{border:1px solid CanvasText}}`;
 
@@ -167,7 +167,7 @@ const SuiDrawer = class {
             '--sui-drawer-size': horizontal ? `min(${this.width}px, 90%)` : `min(${this.height}px, 90%)`,
         };
         const titleId = `${this.fieldId}-title`;
-        return (index.h(index.Host, { key: 'c39839ec4c85ca2f006d26e1cc66edf7e906c713' }, this.open || this.closing ? (index.h("div", { class: { layer: true, closing: this.closing }, inert: this.closing, ref: (el) => (this.layer = el) }, index.h("div", { class: "scrim", onMouseDown: this.onScrimPress, onClick: () => this.requestClose('scrim') }), index.h("div", { ref: (el) => (this.panel = el), class: `panel ${this.position}`, role: "dialog", tabindex: "-1", "aria-labelledby": this.hasHeader ? titleId : undefined, "aria-label": this.hasHeader ? undefined : this.heading || undefined, style: size }, index.h("div", { class: "head" }, index.h("div", { class: "titles", id: titleId }, index.h("slot", { name: "header" }), !this.hasHeader ? index.h("div", { class: "heading" }, this.heading) : null, !this.hasHeader && this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), index.h("sui-icon-button", { class: "close", size: "sm", "aria-label": locale.localeText(undefined, 'drawer.close', undefined, 'Close'), onClick: () => this.requestClose('close-button') }, index.h(glyphs.Glyph, { glyph: glyphs.xmark }))), index.h("div", { class: "body", ref: (el) => (this.body = el) }, index.h("slot", null)), index.h("div", { class: { foot: true, has: this.hasFooter } }, index.h("slot", { name: "footer" }))))) : null));
+        return (index.h(index.Host, { key: '90df1c499498fc9222118be766f3304262e2650b' }, this.open || this.closing ? (index.h("div", { class: { layer: true, closing: this.closing }, inert: this.closing, ref: (el) => (this.layer = el) }, index.h("div", { class: "scrim", onMouseDown: this.onScrimPress, onClick: () => this.requestClose('scrim') }), index.h("div", { ref: (el) => (this.panel = el), class: `panel ${this.position}`, role: "dialog", tabindex: "-1", "aria-labelledby": this.hasHeader ? titleId : undefined, "aria-label": this.hasHeader ? undefined : this.heading || undefined, style: size }, index.h("div", { class: "head" }, index.h("div", { class: "titles", id: titleId }, index.h("slot", { name: "header" }), !this.hasHeader ? index.h("div", { class: "heading" }, this.heading) : null, !this.hasHeader && this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), index.h("sui-icon-button", { class: "close", size: "sm", "aria-label": locale.localeText(undefined, 'drawer.close', undefined, 'Close'), onClick: () => this.requestClose('close-button') }, index.h(glyphs.Glyph, { glyph: glyphs.xmark }))), index.h("div", { class: "body", ref: (el) => (this.body = el) }, index.h("slot", null)), index.h("div", { class: { foot: true, has: this.hasFooter } }, index.h("slot", { name: "footer" }))))) : null));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/sui-edit-box.cjs.entry.js

@@ -1,13 +1,13 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var shortcut = require('./shortcut-DtorcEKc.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var fieldShell = require('./field-shell-XLDTgSCW.js');
-var editorApi = require('./editor-api-CSahLJnW.js');
+var shortcut = require('./shortcut-DFVF9r5V.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var fieldShell = require('./field-shell-BJ_XxyIs.js');
+var editorApi = require('./editor-api-a2yvULBj.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var id = require('./id-Ca7UTKW6.js');
-var format = require('./format-BOushIZn.js');
+var format = require('./format-C_36FFqb.js');
 var locale = require('./locale-EVD23NSt.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
 
@@ -41,7 +41,7 @@ const SuiEditBox = class {
      * and the edit path both read it through `sanitizeEditorHtml`: tags and attributes the editor
      * cannot produce are dropped, a script or a handler never reaches the page, and a link whose
      * address is not http, https, mailto, tel or sms, or a relative path, is shown as plain text.
-     * A picture is shown with `referrerpolicy="no-referrer"`. View mode writes the sanitised markup
+     * A picture is shown with `referrerpolicy="no-referrer"`. View mode writes the sanitized markup
      * through the library's Trusted Types policy, `shineui`. The form value is the string as set, so
      * a value that came from your own store posts back unchanged until an edit is saved.
      */
@@ -351,7 +351,7 @@ const SuiEditBox = class {
         return (index.h("div", { key: "edit", class: "sui-edit-box-edit floating", onKeyDown: this.onEditKey }, index.h("div", { class: "sui-edit-box-frame", ref: (el) => (this.box = el), style: { minHeight: `${this.minHeight}px` } }, index.h("div", { key: "mount", class: "sb-editor-mount sc-sui-edit-box-s", ref: (el) => (this.mount = el), style: { minHeight: `${this.minHeight - 18}px` } })), index.h("sui-mini-toolbar", { open: true, x: this.pos.x, y: this.pos.y, "aria-label": locale.localeText(undefined, 'edit-box.formatting', undefined, 'Formatting') }, this.renderFormatButtons(), index.h("span", { class: "sui-tbtn-sep", role: "separator", "aria-orientation": "vertical" }), this.renderActions(4))));
     }
     render() {
-        return (index.h(index.Host, { key: 'aaf62e49d6002e3932bc27b0f289d7f2e288ba3c', class: { editing: this.editing, floating: this.floating, disabled: this.isDisabled, 'read-only': this.readOnly && !this.isDisabled, invalid: this.invalid || !!this.error } }, this.label ? (index.h("span", { key: "label", class: "sui-edit-box-label" }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, !this.editing ? this.renderView() : this.floating ? this.renderFloating() : this.renderAttached(), this.renderNote()));
+        return (index.h(index.Host, { key: '3a0ab2300f7a55ab3afb958e49316fc3a31cc888', class: { editing: this.editing, floating: this.floating, disabled: this.isDisabled, 'read-only': this.readOnly && !this.isDisabled, invalid: this.invalid || !!this.error } }, this.label ? (index.h("span", { key: "label", class: "sui-edit-box-label" }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, !this.editing ? this.renderView() : this.floating ? this.renderFloating() : this.renderAttached(), this.renderNote()));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/cjs/sui-empty-state.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-BtWzlhN3.js');
 var slots = require('./slots-rhqoeAqs.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 
 const suiEmptyStateCss = () => `.sc-sui-empty-state-h{display:block;font-family:var(--font-sans);color:var(--ink)}.state.sc-sui-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 24px;box-sizing:border-box;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.state.compact.sc-sui-empty-state{padding:22px 18px}.state.bare.sc-sui-empty-state{background:transparent;border:none}.well.sc-sui-empty-state{width:52px;height:52px;border-radius:50%;margin-bottom:12px;display:flex;align-items:center;justify-content:center;background:var(--surface-sunken);color:var(--ink-faint)}.well.sc-sui-empty-state i.sc-sui-empty-state,.well.sc-sui-empty-state .sui-glyph.sc-sui-empty-state{font-size:19px}.state.compact.sc-sui-empty-state .well.sc-sui-empty-state{width:40px;height:40px}.state.compact.sc-sui-empty-state .well.sc-sui-empty-state i.sc-sui-empty-state,.state.compact.sc-sui-empty-state .well.sc-sui-empty-state .sui-glyph.sc-sui-empty-state{font-size:15px}.state.success.sc-sui-empty-state .well.sc-sui-empty-state{background:var(--status-positive-bg);color:var(--status-positive-ink)}.state.error.sc-sui-empty-state .well.sc-sui-empty-state{background:var(--danger-fill);color:var(--danger-contrast)}.heading.sc-sui-empty-state{margin:0;font-size:15px;font-weight:720;line-height:var(--leading-normal)}.state.compact.sc-sui-empty-state .heading.sc-sui-empty-state{font-size:13.5px}.description.sc-sui-empty-state{font-size:12.5px;color:var(--ink-muted);line-height:1.55;margin-top:5px;max-width:360px;text-wrap:pretty}.description.empty.sc-sui-empty-state{display:none}.slotted.sc-sui-empty-state{display:contents}.actions.sc-sui-empty-state{display:flex;gap:9px;margin-top:16px}@media (forced-colors: active){.well.sc-sui-empty-state{border:1px solid CanvasText;box-sizing:border-box}}`;
 
@@ -17,7 +17,7 @@ const SuiEmptyState = class {
         index.registerInstance(this, hostRef);
     }
     get host() { return index.getElement(this); }
-    /** Outcome flavour: `empty`, `success` (the brand, never a green), `error` (the deep accent) or `not-found`.
+    /** Outcome flavor: `empty`, `success` (the brand, never a green), `error` (the deep accent) or `not-found`.
      *  Sets the icon well colors and the default icon. Only `error` renders `role="alert"`, so only
      *  a failed operation interrupts a screen reader; do not use it for a merely empty list. The
      *  icon is `aria-hidden`, so the heading and body are the whole accessible content. */
@@ -74,7 +74,7 @@ const SuiEmptyState = class {
     render() {
         const Heading = `h${[2, 3, 4].includes(Number(this.headingLevel)) ? Number(this.headingLevel) : 2}`;
         const emptyBody = !this.hasBody && !this.description;
-        return (index.h(index.Host, { key: 'ca1c86e9ba56e709a9d94957f5b2dd3b18f432ed' }, index.h("div", { key: '7aae77fa209d25314738e4a21dc71b7038806d55', class: { state: true, [this.variant]: true, compact: this.compact, bare: this.bare }, role: this.variant === 'error' ? 'alert' : undefined }, index.h("span", { key: '5610cd720542cbc9b730e662803e9a0482cf2547', class: "well" }, this.icon ? index.h("i", { class: this.icon, "aria-hidden": "true" }) : index.h(glyphs.Glyph, { glyph: VARIANT_GLYPH[this.variant] || VARIANT_GLYPH.empty })), this.heading ? index.h(Heading, { class: "heading" }, this.heading) : null, index.h("div", { key: '9f5df1d7eee8d81fb06fb9b0733a7825eb373e39', class: { description: true, empty: emptyBody } }, this.hasBody ? null : this.description, index.h("div", { key: '2542a822fc3a3d9a91cdc9dff7f37ecb73c2d4c9', ref: (el) => (this.bodyEl = el), class: "slotted" }, index.h("slot", { key: '232f4a63318600bbb13b0276216c802cea35549c' }))), this.hasActions ? index.h("div", { class: "actions" }, index.h("slot", { name: "actions" })) : null)));
+        return (index.h(index.Host, { key: '7012b71842ce4e6ffe170bde0f0e662b3a5a7efe' }, index.h("div", { key: '2cb4d41d55095d17e27d1b56bd2fcd69224f0bd9', class: { state: true, [this.variant]: true, compact: this.compact, bare: this.bare }, role: this.variant === 'error' ? 'alert' : undefined }, index.h("span", { key: '93c918d6f300722820a36275a6081797487927ab', class: "well" }, this.icon ? index.h("i", { class: this.icon, "aria-hidden": "true" }) : index.h(glyphs.Glyph, { glyph: VARIANT_GLYPH[this.variant] || VARIANT_GLYPH.empty })), this.heading ? index.h(Heading, { class: "heading" }, this.heading) : null, index.h("div", { key: '0eaeaa6f1e22059e3f47b7c9a053fef1171bacc5', class: { description: true, empty: emptyBody } }, this.hasBody ? null : this.description, index.h("div", { key: 'd23d71ed12638e398dc0f25cc24025fbec81b9e8', ref: (el) => (this.bodyEl = el), class: "slotted" }, index.h("slot", { key: '726e674870ecacc7da47526da615df11a29ee443' }))), this.hasActions ? index.h("div", { class: "actions" }, index.h("slot", { name: "actions" })) : null)));
     }
 };
 SuiEmptyState.style = suiEmptyStateCss();

package/dist/cjs/sui-fieldset.cjs.entry.js

@@ -3,8 +3,8 @@
 var index = require('./index-BtWzlhN3.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var id = require('./id-Ca7UTKW6.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var motion = require('./motion-BaUBY31j.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var motion = require('./motion-D8mcyZVH.js');
 require('./locale-EVD23NSt.js');
 
 const suiFieldsetCss = () => `.sc-sui-fieldset-h{display:block;font-family:var(--font-sans);color:var(--ink)}.set.sc-sui-fieldset{border:1px solid var(--border-strong);border-radius:var(--radius-lg);padding:6px 16px 0;margin:0;min-width:0}.closed.sc-sui-fieldset-h .set.sc-sui-fieldset{padding:0 16px 12px}.reveal.sc-sui-fieldset{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--duration-base) var(--ease-out)}.reveal.open.sc-sui-fieldset{grid-template-rows:1fr}.body.sc-sui-fieldset{min-height:0;overflow:hidden}.content.sc-sui-fieldset{padding-bottom:16px}.legend.sc-sui-fieldset{padding:0 8px;margin-inline-start:-4px;font-size:12.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:7px;font-family:var(--font-sans);user-select:none}[disabled].sc-sui-fieldset-h .legend.sc-sui-fieldset{color:var(--disabled-ink)}.toggle.sc-sui-fieldset{display:inline-flex;align-items:center;gap:7px;margin:0;padding:0;border:none;background:transparent;color:inherit;font:inherit;font-family:var(--font-sans);cursor:pointer}.toggle.sc-sui-fieldset:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow);border-radius:var(--radius-sm)}.chev.sc-sui-fieldset{font-size:9px;color:var(--ink-faint);transition:transform var(--duration-base) var(--ease-out)}.collapsed.sc-sui-fieldset-h .chev.sc-sui-fieldset{transform:rotate(-90deg)}.collapsed.sc-sui-fieldset-h:dir(rtl) .chev.sc-sui-fieldset{transform:rotate(90deg)}@media (forced-colors: active){[disabled].sc-sui-fieldset-h .legend.sc-sui-fieldset{color:GrayText}}`;
@@ -23,7 +23,7 @@ const SuiFieldset = class {
     /** Puts a disclosure button with `aria-expanded` and `aria-controls` inside the legend. The body
      *  closes over `--duration-base` and unmounts once it has closed. Reflected. */
     collapsible = false;
-    /** Whether the body is hidden. Seeds the state (the reference `defaultCollapsed`) and tracks it afterwards; writing it from script emits nothing. */
+    /** Whether the body is hidden. Seeds the state (the reference `defaultCollapsed`) and tracks it afterward; writing it from script emits nothing. */
     collapsed = false;
     /**
      * Disables every form control inside the group through the native `fieldset[disabled]`
@@ -116,7 +116,7 @@ const SuiFieldset = class {
         this.suiOpen.emit();
     };
     render() {
-        return (index.h(index.Host, { key: '82f9fb852f9a21fdd78b89379b2bb8299721d14c', class: { collapsed: this.collapsed, closed: !this.mounted, collapsible: this.collapsible } }, index.h("fieldset", { key: '89039257843e751b67bfebfa72c2be402f29c7d1', class: "set", disabled: this.disabled }, index.h("legend", { key: '8bfd12020b6f09ae6c597c286e055add90f22b49', class: "legend" }, this.collapsible ? (index.h("button", { type: "button", class: "toggle", "aria-expanded": this.collapsed ? 'false' : 'true', "aria-controls": this.bodyId, onClick: this.toggle }, index.h(glyphs.Glyph, { glyph: glyphs.chevronDown, class: "chev" }), index.h("span", null, this.legend))) : (index.h("span", { class: "text" }, this.legend))), index.h("div", { key: 'fb5040bff8f07d2b71b12211d710e9b5a801540c', class: { reveal: true, open: !this.collapsed }, ref: (el) => (this.reveal = el) }, this.mounted ? (index.h("div", { class: "body", id: this.bodyId }, index.h("div", { class: "content" }, index.h("slot", null)))) : null))));
+        return (index.h(index.Host, { key: '59953dc833a3d4cbd2ba868e8363c4b981fe8bad', class: { collapsed: this.collapsed, closed: !this.mounted, collapsible: this.collapsible } }, index.h("fieldset", { key: '8241f36ad412819cb7cd6235b12251e7137a30a5', class: "set", disabled: this.disabled }, index.h("legend", { key: 'be34aced3da1507da5abe4c2d19bbaa16265a99d', class: "legend" }, this.collapsible ? (index.h("button", { type: "button", class: "toggle", "aria-expanded": this.collapsed ? 'false' : 'true', "aria-controls": this.bodyId, onClick: this.toggle }, index.h(glyphs.Glyph, { glyph: glyphs.chevronDown, class: "chev" }), index.h("span", null, this.legend))) : (index.h("span", { class: "text" }, this.legend))), index.h("div", { key: '5c009175a6cd8b32dde81e0d6d772185f1ff383b', class: { reveal: true, open: !this.collapsed }, ref: (el) => (this.reveal = el) }, this.mounted ? (index.h("div", { class: "body", id: this.bodyId }, index.h("div", { class: "content" }, index.h("slot", null)))) : null))));
     }
     static get watchers() { return {
         "collapsed": [{

package/dist/cjs/sui-file-upload.cjs.entry.js

@@ -2,11 +2,11 @@
 
 var index = require('./index-BtWzlhN3.js');
 var locale = require('./locale-EVD23NSt.js');
-var format = require('./format-BOushIZn.js');
+var format = require('./format-C_36FFqb.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
 var id = require('./id-Ca7UTKW6.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 
 const suiFileUploadCss = () => `.sc-sui-file-upload-h{display:flex;flex-direction:column;gap:10px;font-family:var(--font-sans);color:var(--ink)}.sui-upload-zone.sc-sui-file-upload{border:1.5px dashed var(--border-strong);background:var(--surface-sunken);border-radius:var(--radius-lg);padding:26px 16px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;text-align:center;transition:border-color var(--duration-fast) var(--ease-out), background var(--duration-fast) var(--ease-out)}.sui-upload-zone.compact.sc-sui-file-upload{padding:16px}.sui-upload-zone.over.sc-sui-file-upload{border-color:var(--accent);background:var(--accent-soft)}.sui-upload-zone.sc-sui-file-upload:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sui-upload-zone.invalid.sc-sui-file-upload:not(.disabled){border-color:var(--danger)}.sui-upload-label.sc-sui-file-upload{margin-block-end:-4px}.sui-upload-zone.disabled.sc-sui-file-upload{background:var(--disabled-bg);border-color:var(--border);color:var(--disabled-ink);cursor:not-allowed}.sui-upload-icon.sc-sui-file-upload{font-size:20px;color:var(--ink-faint);transition:color var(--duration-fast) var(--ease-out)}.sui-upload-zone.over.sc-sui-file-upload .sui-upload-icon.sc-sui-file-upload{color:var(--accent-mark)}.sui-upload-title.sc-sui-file-upload{font-size:13px;font-weight:650}.sui-upload-browse.sc-sui-file-upload{color:var(--link)}.sui-upload-hint.sc-sui-file-upload{font-size:11.5px;color:var(--ink-faint)}.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-icon.sc-sui-file-upload,.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-browse.sc-sui-file-upload,.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-hint.sc-sui-file-upload{color:var(--disabled-ink)}.sui-upload-input.sc-sui-file-upload{display:none}.sui-upload-row.sc-sui-file-upload{display:flex;align-items:center;gap:11px;padding:9px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-sizing:border-box}.sui-upload-row-icon.sc-sui-file-upload{font-size:15px;color:var(--ink-muted)}.sui-upload-thumb.sc-sui-file-upload{width:28px;height:28px;flex:none;object-fit:cover;border-radius:var(--radius-xs);border:1px solid var(--border);background:var(--surface-sunken)}.sui-upload-row.error.sc-sui-file-upload .sui-upload-row-icon.sc-sui-file-upload{color:var(--danger)}.sui-upload-row-body.sc-sui-file-upload{flex:1;min-width:0}.sui-upload-row-name.sc-sui-file-upload{font-size:12.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sui-upload-row-meta.sc-sui-file-upload{font-size:11px;color:var(--ink-faint)}.sui-upload-row.error.sc-sui-file-upload .sui-upload-row-meta.sc-sui-file-upload{color:var(--danger)}.sui-upload-bar.sc-sui-file-upload{height:4px;border-radius:2px;background:var(--brand-soft);margin-top:5px;overflow:hidden}.sui-upload-bar-fill.sc-sui-file-upload{height:100%;background:var(--brand);border-radius:2px;transition:width var(--duration-base) var(--ease-out)}.sui-upload-check.sc-sui-file-upload{font-size:13px;color:var(--brand)}.sui-upload-pct.sc-sui-file-upload{font-size:11px;color:var(--ink-muted);font-feature-settings:'tnum'}.sui-upload-row-btn.sc-sui-file-upload{border:none;background:transparent;color:var(--ink-faint);cursor:pointer;padding:3px;margin:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-xs);transition:color var(--duration-fast) var(--ease-out)}.sui-upload-row-btn.sc-sui-file-upload:hover:not(:disabled){color:var(--ink)}.sui-upload-row-btn.sc-sui-file-upload:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sui-upload-row-btn.sc-sui-file-upload:disabled{color:var(--ink-placeholder);cursor:not-allowed}.sui-upload-row-btn.sc-sui-file-upload .sui-glyph.sc-sui-file-upload{font-size:11px}@media (forced-colors: active){.sui-upload-zone.over.sc-sui-file-upload{border-style:solid;border-color:Highlight}.sui-upload-zone.disabled.sc-sui-file-upload{color:GrayText;border-color:GrayText}.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-icon.sc-sui-file-upload,.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-browse.sc-sui-file-upload,.sui-upload-zone.disabled.sc-sui-file-upload .sui-upload-hint.sc-sui-file-upload{color:GrayText}.sui-upload-bar.sc-sui-file-upload{border:1px solid CanvasText}.sui-upload-bar-fill.sc-sui-file-upload{background:Highlight}}`;
 
@@ -242,17 +242,17 @@ const SuiFileUpload = class {
     /** Cancels the uploads in flight, whose rows then read as failed so `upload()` can send them
      *  again, and revokes the previews it made. */
     release() {
-        const cancelled = Array.from(this.sending.keys());
+        const canceled = Array.from(this.sending.keys());
         this.sending.forEach((xhr) => xhr.abort?.());
         this.sending.clear();
         const ours = this.objectUrls;
         this.objectUrls = new Set();
         ours.forEach((u) => this.revoke(u));
-        if (!cancelled.length && !ours.size)
+        if (!canceled.length && !ours.size)
             return;
         this.files = (this.files || []).map((row) => {
             let next = row;
-            if (row.file && cancelled.includes(row.file))
+            if (row.file && canceled.includes(row.file))
                 next = { ...next, status: 'error', error: failedText() };
             if (row.thumbnail && ours.has(row.thumbnail)) {
                 next = { ...next, thumbnail: undefined };
@@ -478,10 +478,10 @@ const SuiFileUpload = class {
         const disabled = this.isDisabled;
         const invalid = !!this.error;
         const id = this.fieldId;
-        return (index.h(index.Host, { key: '5802f0c2d7e13a0f0311df5fb6aaf4ebfaf6d466' }, this.label ? (index.h("span", { class: "sui-field-label sui-upload-label", id: `${id}-label` }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, index.h("div", { key: '14ce75f09fc46158cca9303e89dbc15c9866dbc3', ref: (el) => (this.zone = el), class: { 'sui-upload-zone': true, over: this.over, compact: this.compact, disabled, invalid }, role: "button", tabIndex: disabled ? -1 : 0, "aria-label": this.label ? undefined : locale.localeText(undefined, 'file-upload.uploadFiles', undefined, 'Upload files'), "aria-labelledby": this.label ? `${id}-label ${id}-title` : undefined, "aria-describedby": this.error ? `${id}-err` : help ? `${id}-help` : undefined, "aria-disabled": disabled ? 'true' : null, "aria-invalid": invalid ? 'true' : null, onClick: () => {
+        return (index.h(index.Host, { key: 'b60b738b2716515123214f59b1e7b0139cb1af23' }, this.label ? (index.h("span", { class: "sui-field-label sui-upload-label", id: `${id}-label` }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, index.h("div", { key: 'b564ae709d5f238b383e2e0c8462c9028ccf575f', ref: (el) => (this.zone = el), class: { 'sui-upload-zone': true, over: this.over, compact: this.compact, disabled, invalid }, role: "button", tabIndex: disabled ? -1 : 0, "aria-label": this.label ? undefined : locale.localeText(undefined, 'file-upload.uploadFiles', undefined, 'Upload files'), "aria-labelledby": this.label ? `${id}-label ${id}-title` : undefined, "aria-describedby": this.error ? `${id}-err` : help ? `${id}-help` : undefined, "aria-disabled": disabled ? 'true' : null, "aria-invalid": invalid ? 'true' : null, onClick: () => {
                 if (!this.isDisabled)
                     this.input?.click();
-            }, onKeyDown: this.onZoneKey, onDragEnter: this.onDragEnter, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onDrop: this.onDrop }, index.h(glyphs.Glyph, { key: 'd9b86748feb1a4d1be468c37fa5b215e4cc55d1a', glyph: glyphs.cloudArrowUp, class: "sui-upload-icon" }), index.h("span", { key: 'ef3c454acde1334139e329f5da94452ff2653149', class: "sui-upload-title", id: `${id}-title` }, locale.localeText(undefined, 'file-upload.drop', undefined, 'Drop files here or '), index.h("span", { key: '79b381ef4f7044749152ccbe5c877babdf8d52c2', class: "sui-upload-browse" }, locale.localeText(undefined, 'file-upload.browse', undefined, 'browse'))), help ? index.h("span", { class: "sui-upload-hint", id: `${id}-help` }, help) : null, index.h("input", { key: '6d2fa122550bd6e58fc4521985fca894c3e8bfff', ref: (el) => (this.input = el), class: "sui-upload-input", type: "file", accept: this.accept, multiple: this.multiple, disabled: disabled, tabIndex: -1, "aria-hidden": "true", onChange: this.onPick })), rows.map((f, i) => {
+            }, onKeyDown: this.onZoneKey, onDragEnter: this.onDragEnter, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onDrop: this.onDrop }, index.h(glyphs.Glyph, { key: '19e0237b68a2560023b4427b58156cf647fccd2c', glyph: glyphs.cloudArrowUp, class: "sui-upload-icon" }), index.h("span", { key: '2a462ae136ee8bd692fb446dbc88ff416c1fdc9e', class: "sui-upload-title", id: `${id}-title` }, locale.localeText(undefined, 'file-upload.drop', undefined, 'Drop files here or '), index.h("span", { key: '4560c3623e8b158e8c626ca48195fcb5f5b5fa4b', class: "sui-upload-browse" }, locale.localeText(undefined, 'file-upload.browse', undefined, 'browse'))), help ? index.h("span", { class: "sui-upload-hint", id: `${id}-help` }, help) : null, index.h("input", { key: 'd6e60e2f88f30b8f8dfc628dc3161ba5b3185dd7', ref: (el) => (this.input = el), class: "sui-upload-input", type: "file", accept: this.accept, multiple: this.multiple, disabled: disabled, tabIndex: -1, "aria-hidden": "true", onChange: this.onPick })), rows.map((f, i) => {
             const pct = f.progress ?? 40;
             const nth = (seen.get(f.name) ?? 0) + 1;
             seen.set(f.name, nth);

package/dist/cjs/sui-filter-builder.cjs.entry.js

@@ -1,17 +1,17 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var filter = require('./filter-CL1-xa2r.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var filter = require('./filter-DCIDkDEb.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var locale = require('./locale-EVD23NSt.js');
 var id = require('./id-Ca7UTKW6.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var columnFilter = require('./column-filter-CG2bPlB7.js');
-require('./format-BOushIZn.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var columnFilter = require('./column-filter-CUNgiX12.js');
+require('./format-C_36FFqb.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiFilterBuilderCss = () => `.sc-sui-filter-builder-h{display:inline-block;font-family:var(--font-sans);color:var(--ink)}[inline].sc-sui-filter-builder-h{display:block}.trigger.sc-sui-filter-builder{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;height:var(--control-md);padding:0 13px;margin:0;background:var(--surface);color:var(--ink);border:1px solid var(--control-border);border-radius:var(--radius-md);box-shadow:none;font-family:var(--font-sans);font-size:13px;font-weight:620;line-height:1;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.trigger.sm.sc-sui-filter-builder{height:var(--control-sm);padding:0 10px;gap:6px;font-size:12.5px}.trigger.sc-sui-filter-builder .sui-glyph.sc-sui-filter-builder{font-size:11px;color:var(--ink-muted)}.trigger.active.sc-sui-filter-builder .sui-glyph.sc-sui-filter-builder{color:var(--accent-mark)}.trigger.sc-sui-filter-builder:hover{border-color:color-mix(in srgb, var(--ink) 30%, var(--control-border));background:var(--brand-soft)}.trigger.sc-sui-filter-builder:active{background:color-mix(in srgb, var(--brand-soft) 92%, var(--ink))}.trigger.open.sc-sui-filter-builder{background:color-mix(in srgb, var(--brand-soft) 84%, var(--ink))}.trigger.sc-sui-filter-builder:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.count.sc-sui-filter-builder{margin-inline-start:-1px}.sui-fb.sc-sui-filter-builder{box-sizing:border-box;color:var(--ink);font-family:var(--font-sans);font-size:var(--text-md);text-align:start}.sui-fb-panel.sc-sui-filter-builder{position:fixed;top:0;left:0;z-index:var(--z-dropdown);display:flex;flex-direction:column;width:min(840px, calc(100vw - 16px));max-height:min(80vh, 640px);overflow:hidden;padding:0;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop);animation:sui-fb-in var(--duration-overlay) var(--ease-out)}.sui-fb-panel[data-side='top'].sc-sui-filter-builder{animation-name:sui-fb-in-top}.sui-fb-panel.closing.sc-sui-filter-builder{animation:sui-fb-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-fb-in{from{opacity:0;margin-top:-4px}}@keyframes sui-fb-in-top{from{opacity:0;margin-top:4px}}@keyframes sui-fb-out{to{opacity:0}}@keyframes sui-fb-sheet-in{from{opacity:0;margin-bottom:-8px}}.sui-fb-top.sc-sui-filter-builder{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px 0 16px}.sui-fb-title.sc-sui-filter-builder{font-size:13px;font-weight:650;color:var(--ink)}.sui-fb-panel.sc-sui-filter-builder>.sui-fb-scroll.sc-sui-filter-builder{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 16px 12px}.sui-fb-panel.sc-sui-filter-builder>.sui-fb-bar.sc-sui-filter-builder{flex:none;margin:0;padding:11px 16px 14px}.sui-fb-scrim.sc-sui-filter-builder{display:none}.sui-fb-scrim.on.sc-sui-filter-builder{display:block;position:fixed;inset:0;z-index:var(--z-dropdown);background:var(--scrim);animation:sui-fb-scrim-in var(--duration-overlay) var(--ease-out)}.sui-fb-scrim.on.closing.sc-sui-filter-builder{animation:sui-fb-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-fb-scrim-in{from{opacity:0}}.sui-fb-panel.sheet.sc-sui-filter-builder{top:auto;bottom:0;left:0;right:0;width:100vw;max-width:100vw;max-height:88vh;border-radius:var(--radius-lg) var(--radius-lg) 0 0;border-bottom:0;animation-name:sui-fb-sheet-in}.sui-fb-inline.sc-sui-filter-builder{padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.sui-fb-head.sc-sui-filter-builder,.sui-fb-row.sc-sui-filter-builder{display:grid;grid-template-columns:20px 76px minmax(0, 1.1fr) minmax(0, 0.9fr) minmax(0, 1.4fr) 58px;align-items:center;gap:8px;min-width:0}.sui-fb-row.sc-sui-filter-builder{position:relative;border-radius:2px}.sui-fb-head.off.sc-sui-filter-builder{display:none}.sui-fb-head.sc-sui-filter-builder{margin-bottom:6px;font-size:var(--text-xs);font-weight:650;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--ink-muted)}.sui-fb-rows.sc-sui-filter-builder{display:flex;flex-direction:column;gap:8px}.sui-fb-row.sub.sc-sui-filter-builder{align-items:start}.sui-fb-row.sub.sc-sui-filter-builder>.sui-cf-join.sc-sui-filter-builder,.sui-fb-row.sub.sc-sui-filter-builder>.sui-fb-grip.sc-sui-filter-builder{margin-top:10px}.sui-fb-row.sub.sc-sui-filter-builder>.sui-fb-group.sc-sui-filter-builder{grid-column:3 / -1}.sui-fb-acts.sc-sui-filter-builder{display:inline-flex;align-items:center;gap:2px}.sui-fb-grip.sc-sui-filter-builder{box-sizing:border-box;width:20px;height:28px;padding:0;margin:0;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--ink-muted);border:0;border-radius:var(--radius-sm);font:inherit;cursor:grab;touch-action:none;transition:background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.sui-fb-grip.sc-sui-filter-builder .sui-glyph.sc-sui-filter-builder{font-size:11px}.sui-fb-grip.sc-sui-filter-builder:hover{color:var(--ink);background:var(--surface-hover)}.sui-fb-grip.sc-sui-filter-builder:active{cursor:grabbing}.sui-fb-grip.sc-sui-filter-builder:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sui-fb-row.lifted.sc-sui-filter-builder{background:var(--surface-raised);box-shadow:0 0 0 4px var(--surface-raised), 0 0 0 5px var(--control-border), var(--shadow-raised);z-index:1}.sui-fb-row.lifted.sc-sui-filter-builder>.sui-fb-grip.sc-sui-filter-builder{color:var(--brand-soft-ink);cursor:grabbing}.sui-fb-row.dragging.sc-sui-filter-builder{opacity:0.5;outline:1px dashed var(--ink-muted);outline-offset:2px}.sui-fb-row.drop-before.sc-sui-filter-builder::before,.sui-fb-row.drop-after.sc-sui-filter-builder::after,.sui-fb-adds.drop-end.sc-sui-filter-builder::before{content:'';position:absolute;inset-inline:0;height:2px;border-radius:1px;pointer-events:none;background:var(--accent-ink);box-shadow:0 0 0 1px color-mix(in srgb, var(--accent-ink) 25%, transparent)}.sui-fb-row.drop-before.sc-sui-filter-builder::before,.sui-fb-adds.drop-end.sc-sui-filter-builder::before{top:-5px}.sui-fb-row.drop-after.sc-sui-filter-builder::after{bottom:-5px}.sui-fb-hole.sc-sui-filter-builder{box-sizing:border-box;padding:12px 10px;font-size:12px;text-align:center;color:var(--ink-muted);border:1px dashed var(--border-strong);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.sui-fb-hole.over.sc-sui-filter-builder{color:var(--accent-soft-ink);background:var(--accent-soft);border-color:var(--accent)}.sui-fb-sr.sc-sui-filter-builder{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.sui-fb-cell.sc-sui-filter-builder{min-width:0}.sui-fb-cell.sc-sui-filter-builder>sui-select.sc-sui-filter-builder,.sui-fb-cell.sc-sui-filter-builder>sui-multi-select.sc-sui-filter-builder,.sui-fb-cell.sc-sui-filter-builder>sui-input-text.sc-sui-filter-builder,.sui-fb-cell.sc-sui-filter-builder>sui-input-number.sc-sui-filter-builder,.sui-fb-cell.sc-sui-filter-builder>sui-date-picker.sc-sui-filter-builder{width:100%}.sui-fb-hint.sc-sui-filter-builder{display:none}.sui-fb-group.nested.sc-sui-filter-builder{padding:10px 12px 8px;background:var(--surface-sunken);border:1px solid var(--border);border-radius:var(--radius-md)}.sui-fb-group.nested.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder{grid-template-columns:20px 72px minmax(0, 1.1fr) minmax(0, 0.9fr) minmax(0, 1.4fr) 58px}.sui-fb-caption.sc-sui-filter-builder{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:12.5px;font-weight:600;color:var(--ink-muted)}.sui-fb-caption.sc-sui-filter-builder>.sui-fb-acts.sc-sui-filter-builder{margin-inline-end:-2px}.sui-fb-adds.sc-sui-filter-builder{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:8px;margin-inline-start:-8px}.sui-fb-adds.sc-sui-filter-builder>.sui-cf-add.sc-sui-filter-builder{margin-inline-start:0}.sui-fb-group.sc-sui-filter-builder:not(.nested)>.sui-fb-adds.sc-sui-filter-builder{margin-top:10px}.sui-fb-bar.sc-sui-filter-builder{margin-top:14px}.sui-fb-note.sc-sui-filter-builder{flex:1;min-width:0;font-size:12px;color:var(--ink-faint);text-align:end}.sui-fb-note.moving.sc-sui-filter-builder{color:var(--ink-muted);font-weight:600}.sui-fb-empty.sc-sui-filter-builder{padding:12px 0;font-size:12.5px;color:var(--ink-faint)}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-head.sc-sui-filter-builder{display:none}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder,.sui-fb.narrow.sc-sui-filter-builder .sui-fb-group.nested.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder{grid-template-columns:20px minmax(0, 1fr) auto;grid-template-areas:'grip join acts' 'field field field' 'mode mode mode' 'val val val';align-items:start;row-gap:6px;padding-bottom:10px;border-bottom:1px solid var(--border)}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder:last-child{border-bottom:0;padding-bottom:0}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-cf-join.sc-sui-filter-builder{grid-area:join;align-self:center;min-height:28px;margin-top:0}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-fb-grip.sc-sui-filter-builder{grid-area:grip;margin-top:0}.sui-fb.narrow.sc-sui-filter-builder .sui-cf-joinsel.sc-sui-filter-builder{width:96px}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-fb-cell.field.sc-sui-filter-builder{grid-area:field}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-fb-cell.mode.sc-sui-filter-builder{grid-area:mode}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-fb-cell.val.sc-sui-filter-builder{grid-area:val}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sc-sui-filter-builder>.sui-fb-acts.sc-sui-filter-builder{grid-area:acts}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sub.sc-sui-filter-builder{grid-template-columns:20px minmax(0, 1fr);grid-template-areas:'grip join' 'sub sub'}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-row.sub.sc-sui-filter-builder>.sui-fb-group.sc-sui-filter-builder{grid-area:sub}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-group.nested.sc-sui-filter-builder{padding:10px}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-hint.sc-sui-filter-builder{display:block;margin-bottom:4px;font-size:11.5px;font-weight:600;color:var(--ink-muted)}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-bar.sc-sui-filter-builder{flex-wrap:wrap}.sui-fb.narrow.sc-sui-filter-builder .sui-fb-note.sc-sui-filter-builder{flex-basis:100%;order:3;text-align:start}@media (forced-colors: active){.sui-fb-panel.sc-sui-filter-builder,.sui-fb-inline.sc-sui-filter-builder,.sui-fb-group.nested.sc-sui-filter-builder{border:1px solid CanvasText}.trigger.active.sc-sui-filter-builder .sui-glyph.sc-sui-filter-builder{color:Highlight}.sui-fb-grip.sc-sui-filter-builder{color:ButtonText}.sui-fb-row.lifted.sc-sui-filter-builder{forced-color-adjust:none;outline:2px dashed Highlight;outline-offset:2px;background:Canvas;box-shadow:none}.sui-fb-row.drop-before.sc-sui-filter-builder::before,.sui-fb-row.drop-after.sc-sui-filter-builder::after,.sui-fb-adds.drop-end.sc-sui-filter-builder::before{background:Highlight;box-shadow:none}.sui-fb-hole.sc-sui-filter-builder{border-color:CanvasText}.sui-fb-hole.over.sc-sui-filter-builder{border-color:Highlight}}`;
 

package/dist/cjs/sui-filter-panel.cjs.entry.js

@@ -1,16 +1,16 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var focus = require('./focus-DRuLpXAC.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var id = require('./id-Ca7UTKW6.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiFilterPanelCss = () => `.sc-sui-filter-panel-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:var(--font-sans);color:var(--ink)}.anchor.sc-sui-filter-panel{position:relative;display:inline-flex}.trigger.sc-sui-filter-panel{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;height:var(--control-md);padding:0 13px;margin:0;background:var(--surface);color:var(--ink);border:1px solid var(--control-border);border-radius:var(--radius-md);box-shadow:none;font-family:var(--font-sans);font-size:13px;font-weight:620;line-height:1;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.trigger.sc-sui-filter-panel .sui-glyph.sc-sui-filter-panel{font-size:11px;color:var(--ink-muted)}.trigger.sc-sui-filter-panel:hover{border-color:color-mix(in srgb, var(--ink) 30%, var(--control-border));background:var(--brand-soft)}.trigger.open.sc-sui-filter-panel{background:color-mix(in srgb, var(--brand-soft) 84%, var(--ink))}.trigger.sc-sui-filter-panel:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.count.sc-sui-filter-panel{margin-inline-start:-1px}.panel.sc-sui-filter-panel{position:fixed;top:0;left:0;z-index:var(--z-dropdown);box-sizing:border-box;width:280px;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop);padding:14px 16px;animation:sui-filter-panel-in var(--duration-overlay) var(--ease-out)}.panel[data-side='top'].sc-sui-filter-panel{animation-name:sui-filter-panel-in-top}.panel.closing.sc-sui-filter-panel{animation:sui-filter-panel-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-filter-panel-in{from{opacity:0;margin-top:-4px}}@keyframes sui-filter-panel-in-top{from{opacity:0;margin-top:4px}}@keyframes sui-filter-panel-out{to{opacity:0}}.field.sc-sui-filter-panel{margin-bottom:12px}.bar.sc-sui-filter-panel{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--hairline);padding-top:11px}.clear.sc-sui-filter-panel{appearance:none;margin:0;padding:0;border:0;background:transparent;cursor:pointer;font-family:var(--font-sans);font-size:12.5px;font-weight:620;color:var(--ink-muted)}.clear.sc-sui-filter-panel:hover{color:var(--ink)}.clear.sc-sui-filter-panel:focus-visible,.clear-link.sc-sui-filter-panel:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow);border-radius:var(--radius-xs)}.clear-link.sc-sui-filter-panel{appearance:none;margin:0;padding:0;border:0;background:transparent;cursor:pointer;font-family:var(--font-sans);font-size:12px;font-weight:620;color:var(--link)}.clear-link.sc-sui-filter-panel:hover{text-decoration:underline}`;
 

package/dist/cjs/sui-float-label.cjs.entry.js

@@ -1,13 +1,13 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var fieldShell = require('./field-shell-XLDTgSCW.js');
+var fieldShell = require('./field-shell-BJ_XxyIs.js');
 var id = require('./id-Ca7UTKW6.js');
 var formControl = require('./form-control-CvMyyCaa.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var inputHints = require('./input-hints-Bsq-zavl.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
-require('./glyphs-8uuUhG6s.js');
+require('./glyphs-BNG4Wolq.js');
 require('./locale-EVD23NSt.js');
 
 const suiFloatLabelCss = () => `.sc-sui-float-label-h{display:block;font-family:var(--font-sans)}.sui-float.sc-sui-float-label{position:relative;padding-top:6px}.float-label.sc-sui-float-label{position:absolute;inset-inline-start:9px;top:17px;padding:0 4px;font-size:14px;font-weight:460;line-height:1.3;color:var(--ink-placeholder);max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;background:transparent;pointer-events:none;white-space:nowrap;transition:top var(--duration-fast) var(--ease-out), font-size var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), background var(--duration-fast) var(--ease-out)}.sui-float.up.sc-sui-float-label .float-label.sc-sui-float-label{top:-2px;font-size:11px;font-weight:650;background:linear-gradient(transparent 50%, var(--surface) 50%)}.sui-float.up.focus.sc-sui-float-label .float-label.sc-sui-float-label{color:var(--focus-ring)}.sui-float.invalid.sc-sui-float-label .float-label.sc-sui-float-label,.sui-float.up.invalid.focus.sc-sui-float-label .float-label.sc-sui-float-label{color:var(--danger)}.sui-float.up.sc-sui-float-label input[readonly].sc-sui-float-label:not(:disabled)+.float-label.sc-sui-float-label{background:linear-gradient(transparent 50%, var(--surface-sunken) 50%)}.sui-float.up.sc-sui-float-label input.sc-sui-float-label:disabled+.float-label.sc-sui-float-label{background:linear-gradient(transparent 50%, var(--disabled-bg) 50%)}@media (forced-colors: active){.float-label.sc-sui-float-label{color:GrayText}.sui-float.up.sc-sui-float-label .float-label.sc-sui-float-label{color:CanvasText}}`;
@@ -155,7 +155,7 @@ const SuiFloatLabel = class {
     render() {
         const up = this.focused || this.value.length > 0;
         const invalid = this.invalid || !!this.error;
-        return (index.h(fieldShell.FieldShell, { key: 'fbe190ed093fd199fbae1f5332b74ff3dfb376e1', help: this.help, error: this.error, descId: this.fieldId }, index.h("div", { key: '88c016752270f107da947149cfce1edbaefa94c1', class: { 'sui-float': true, up, focus: this.focused, invalid } }, index.h("input", { key: '15908e6cadaa01ce554e8d9c53656ab42f78be88', ref: (el) => (this.input = el), id: this.fieldId, class: { 'sui-input': true, 'sui-frame': true, lg: true, invalid }, type: this.type, value: this.value, required: this.required, disabled: this.isDisabled, readOnly: this.readOnly, maxLength: this.maxLength, autocomplete: this.autocomplete, pattern: this.pattern, minLength: this.minLength, inputMode: this.hints.inputmode, enterKeyHint: this.hints.enterkeyhint, "aria-label": this.label ? undefined : this.hostLabel, "aria-labelledby": this.label ? undefined : this.hostLabelledby, "aria-invalid": invalid ? 'true' : null, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, onChange: this.onChange }), index.h("label", { key: '5b3a8521a56c0f24288574c4599390d60f433242', class: "float-label", htmlFor: this.fieldId }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null))));
+        return (index.h(fieldShell.FieldShell, { key: '8f9a8dc84a706dc09ea2c2e1c413821e46a9fafa', help: this.help, error: this.error, descId: this.fieldId }, index.h("div", { key: '81b4b1c68f7c11c5432b29d06f55a78aa6f6b841', class: { 'sui-float': true, up, focus: this.focused, invalid } }, index.h("input", { key: '619bd89da26a7f1cc91bbd8f47f352e0236546f8', ref: (el) => (this.input = el), id: this.fieldId, class: { 'sui-input': true, 'sui-frame': true, lg: true, invalid }, type: this.type, value: this.value, required: this.required, disabled: this.isDisabled, readOnly: this.readOnly, maxLength: this.maxLength, autocomplete: this.autocomplete, pattern: this.pattern, minLength: this.minLength, inputMode: this.hints.inputmode, enterKeyHint: this.hints.enterkeyhint, "aria-label": this.label ? undefined : this.hostLabel, "aria-labelledby": this.label ? undefined : this.hostLabelledby, "aria-invalid": invalid ? 'true' : null, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, onChange: this.onChange }), index.h("label", { key: 'c981aee4cb39f5c99b6bb4320be7ce0479e62fba', class: "float-label", htmlFor: this.fieldId }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/cjs/sui-fluid.cjs.entry.js

@@ -11,7 +11,7 @@ const SuiFluid = class {
     /** Vertical gap between children in px. 14 matches the form stack. */
     gap = 14;
     render() {
-        return (index.h(index.Host, { key: '27d68663c89484e99754667044e75ef2b63ede70', style: { gap: `${this.gap}px` } }, index.h("slot", { key: 'e6f30518196c5d7e3d3fdde8ca3d67d3a2e081ac' })));
+        return (index.h(index.Host, { key: 'd033991e2e8b3c204d9a3f00b827144e1556b559', style: { gap: `${this.gap}px` } }, index.h("slot", { key: '47fc1c8985ad638deb0b1a0ec96ccc625c2fba3a' })));
     }
 };
 SuiFluid.style = suiFluidCss();

package/dist/cjs/sui-form-actions.cjs.entry.js

@@ -56,7 +56,7 @@ const SuiFormActions = class {
         const form = this.formId();
         const primaryType = PRIMARY_TYPES.includes(this.primaryType) ? this.primaryType : 'button';
         const secondaryType = SECONDARY_TYPES.includes(this.secondaryType) ? this.secondaryType : 'button';
-        return (index.h(index.Host, { key: '3d6f1ff1a5f122f0aba0952026f354b1ffffcd0f' }, index.h("div", { key: '83683b89a0b15e4ea1037cabe4513ed1ce303bc4', class: { bar: true, sticky: this.sticky } }, index.h("slot", { key: '355c7473aedd2508e2487aced90cd614845d90c1', name: "status" }), index.h("div", { key: '54ee8ad10c5dd59af32fb7ec87e5e52976d71c8f', class: "spacer" }), this.hideSecondary ? null : (index.h("sui-button", { class: "secondary", variant: "outline", size: "md", type: secondaryType, form: form, label: locale.localeText(undefined, 'form-actions.secondary', this.secondaryLabel, 'Cancel'), onClick: () => this.suiSecondary.emit() })), index.h("sui-button", { key: 'b8a2a450ae4ac4045095dd054236eb0aa2ad44d7', class: "primary", variant: "brand", size: "md", type: primaryType, form: form, label: locale.localeText(undefined, 'form-actions.primary', this.primaryLabel, 'Save'), disabled: this.primaryDisabled, loading: this.primaryLoading, onClick: () => {
+        return (index.h(index.Host, { key: '0ec0425755d3910d43ea8756ec8deb587a470a16' }, index.h("div", { key: 'bb9688137bce7a5d6fb203bd42a24fed93a9e033', class: { bar: true, sticky: this.sticky } }, index.h("slot", { key: 'bd8dd1bdf235cb796201fd647515a881e219ca3f', name: "status" }), index.h("div", { key: 'f1e168eef62e7a94e0e173d192ea91627f91dcc1', class: "spacer" }), this.hideSecondary ? null : (index.h("sui-button", { class: "secondary", variant: "outline", size: "md", type: secondaryType, form: form, label: locale.localeText(undefined, 'form-actions.secondary', this.secondaryLabel, 'Cancel'), onClick: () => this.suiSecondary.emit() })), index.h("sui-button", { key: 'c83cf62a00cb0cb22cdfc4473b74bc04114f2c15', class: "primary", variant: "brand", size: "md", type: primaryType, form: form, label: locale.localeText(undefined, 'form-actions.primary', this.primaryLabel, 'Save'), disabled: this.primaryDisabled, loading: this.primaryLoading, onClick: () => {
                 if (!this.primaryDisabled && !this.primaryLoading)
                     this.suiPrimary.emit();
             } }))));

package/dist/cjs/sui-form-layout.cjs.entry.js

@@ -58,7 +58,7 @@ const SuiFormLayout = class {
     }
     render() {
         const cols = Math.max(1, Math.floor(this.columns) || 1);
-        return (index.h(index.Host, { key: 'f2d1db8c7223db12a6754aa0c2aff8bc50b380b6' }, index.h("div", { key: 'ab865ee2ee2417e8b8e99c13f4fba61abb73e221', class: "card" }, this.heading || this.hasStatus || this.hasHeaderEnd ? (index.h("div", { class: "head" }, index.h("div", { class: "titles" }, this.heading ? index.h("div", { class: "title" }, this.heading) : null, this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), index.h("slot", { name: "status" }), index.h("slot", { name: "header-end" }))) : null, index.h("div", { key: 'b14c2d2d85792ff539689a1508a03886a6e6db2b', class: "grid", style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` } }, index.h("slot", { key: '4323653c95abe4a21292a73b6c524e41a518a1b8' })), index.h("slot", { key: '06ad097013f2c0039b91230596d95128fceddc25', name: "actions" }))));
+        return (index.h(index.Host, { key: 'deb1e784d9e8e8037332a3d223b75b19a5d3fd9c' }, index.h("div", { key: '00d95868772fc2d5acbeff1875dfb33954b0685f', class: "card" }, this.heading || this.hasStatus || this.hasHeaderEnd ? (index.h("div", { class: "head" }, index.h("div", { class: "titles" }, this.heading ? index.h("div", { class: "title" }, this.heading) : null, this.subtitle ? index.h("div", { class: "subtitle" }, this.subtitle) : null), index.h("slot", { name: "status" }), index.h("slot", { name: "header-end" }))) : null, index.h("div", { key: '965abe415d8a8d47f10bfb1a3377d80fa5ae57d7', class: "grid", style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` } }, index.h("slot", { key: '2780f8e6133fda03b15655e5bfe3760d9a1987d1' })), index.h("slot", { key: '3757d1181541153ff03e63c0952ee9f76554d757', name: "actions" }))));
     }
 };
 SuiFormLayout.style = suiFormLayoutCss();

package/dist/cjs/sui-form.cjs.entry.js

@@ -1,12 +1,12 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var heldFocus = require('./held-focus-DeQVYDkc.js');
+var heldFocus = require('./held-focus-ikz5F6kW.js');
 var locale = require('./locale-EVD23NSt.js');
-require('./overlay-DcMtiB1L.js');
+require('./overlay-CsoWlGY8.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiFormCss = () => `.sc-sui-form-h{display:block;font-family:var(--font-sans)}.sui-form.sc-sui-form{display:contents}`;
 
@@ -323,7 +323,7 @@ const SuiForm = class {
             this.form.submit?.();
     };
     render() {
-        return (index.h(index.Host, { key: '6c027ccc85abb0807e7f4744e031a086720d6130' }, index.h("form", { key: 'ebadf1a877b54c35c2019c64b1b1163cf1efb13a', ref: (el) => (this.form = el), id: this.formId, class: "sui-form", noValidate: true, onSubmit: this.onSubmit }, index.h("slot", { key: 'a3a8cf94f678872a7efd26f49826b58697967fec' }))));
+        return (index.h(index.Host, { key: '9e424b0f4a9d78f8074758d1b0c5b4656a9163fd' }, index.h("form", { key: 'd179d3f107a397e9c66c16816658ee3f14e370c4', ref: (el) => (this.form = el), id: this.formId, class: "sui-form", noValidate: true, onSubmit: this.onSubmit }, index.h("slot", { key: '7020fb5e4e886d01c04cf45fb79547b178f0111b' }))));
     }
 };
 SuiForm.style = suiFormCss();

package/dist/cjs/sui-galleria.cjs.entry.js

@@ -3,16 +3,16 @@
 var index = require('./index-BtWzlhN3.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var direction = require('./direction-BaE_rqNY.js');
-var autoplay = require('./autoplay-pXVaA5sd.js');
-var modal = require('./modal-1S8X9Mu6.js');
-var layer = require('./layer-BkCcJvyt.js');
+var autoplay = require('./autoplay-BAzQ2uf0.js');
+var modal = require('./modal-BqGRqHln.js');
+var layer = require('./layer-31199iWw.js');
 var id = require('./id-Ca7UTKW6.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var mediaFallback = require('./media-fallback-D8a7yPGc.js');
-var motion = require('./motion-BaUBY31j.js');
-require('./held-focus-DeQVYDkc.js');
-require('./overlay-DcMtiB1L.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var mediaFallback = require('./media-fallback-CzSdNufY.js');
+var motion = require('./motion-D8mcyZVH.js');
+require('./held-focus-ikz5F6kW.js');
+require('./overlay-CsoWlGY8.js');
 require('./focus-trap-CcyiWkvv.js');
 require('./anchor-BjGUozqb.js');
 require('./slots-rhqoeAqs.js');
@@ -63,7 +63,7 @@ const SuiGalleria = class {
     /**
      * Shows the full-screen viewer. Mutable; the element opens it from the full-screen control and
      * closes it on Escape, the scrim and the close control. Focus is trapped inside while it is open
-     * and returns to the control afterwards. While open, and while it fades out, the viewer paints in
+     * and returns to the control afterward. While open, and while it fades out, the viewer paints in
      * the browser's top layer, so a transformed or clipping ancestor cannot trap it; everything
      * outside it is inert and the page does not scroll, and a node the page adds outside it while it
      * is open goes inert too. The viewer is `role="dialog"` with no `aria-modal`, so VoiceOver keeps
@@ -385,7 +385,7 @@ const SuiGalleria = class {
         const list = this.items || [];
         const cur = list[this.index] || {};
         const name = this.host.getAttribute('aria-label') || locale.localeText(undefined, 'galleria.imageViewer', undefined, 'Image viewer');
-        return (index.h(index.Host, { key: '1ef00acc3af19b6d36fa37439355038c15e1e125', onKeyDown: this.onHostKeyDown }, index.h("div", { key: 'd0198daf7788700f5961cdd71340656bf77396bd', class: "hero", style: { height: `${this.height}px` }, onPointerDown: this.onPointerDown }, cur.src && this.failed.has(cur.src) ? index.h(mediaFallback.MediaFallback, { text: locale.localeText(undefined, 'galleria.unavailable', undefined, 'Image unavailable') }) : null, cur.src && !this.failed.has(cur.src) ? index.h("img", { class: "hero-img", src: cur.src, alt: cur.alt || '', onError: () => this.fail(cur.src) }) : null, cur.caption ? index.h("div", { class: "caption" }, cur.caption) : null, this.navigators(), Number(this.autoplay) > 0 && !this.reduced
+        return (index.h(index.Host, { key: 'c6af17ee902554ee5e64bb53f7c2bbe8392cdb22', onKeyDown: this.onHostKeyDown }, index.h("div", { key: '543249abb2d3e13400fcd8b5cdb0017401e0466b', class: "hero", style: { height: `${this.height}px` }, onPointerDown: this.onPointerDown }, cur.src && this.failed.has(cur.src) ? index.h(mediaFallback.MediaFallback, { text: locale.localeText(undefined, 'galleria.unavailable', undefined, 'Image unavailable') }) : null, cur.src && !this.failed.has(cur.src) ? index.h("img", { class: "hero-img", src: cur.src, alt: cur.alt || '', onError: () => this.fail(cur.src) }) : null, cur.caption ? index.h("div", { class: "caption" }, cur.caption) : null, this.navigators(), Number(this.autoplay) > 0 && !this.reduced
             ? this.control('play', this.playing ? glyphs.pause : glyphs.play, this.playing ? locale.localeText(undefined, 'galleria.pauseAutoplay', undefined, 'Pause autoplay') : locale.localeText(undefined, 'galleria.startAutoplay', undefined, 'Start autoplay'), this.togglePlay)
             : null, this.fullScreen ? this.control('expand', glyphs.expand, locale.localeText(undefined, 'galleria.openFullScreen', undefined, 'Open full screen'), this.openFull) : null), this.thumbs(list, false), this.open || this.closing ? (index.h("div", { id: this.layerId, class: { layer: true, closing: this.closing }, inert: this.closing, ref: (el) => (this.layer = el), role: "dialog", "aria-label": name, onClick: this.onLayerClick, onKeyDown: this.onKeyDown }, cur.caption ? index.h("div", { class: "full-caption" }, cur.caption) : null, this.control('close', glyphs.xmark, locale.localeText(undefined, 'galleria.close', undefined, 'Close'), () => this.requestClose('close-button'), false, true), index.h("div", { class: "stage", ref: (el) => (this.stage = el), onPointerDown: this.onPointerDown }, cur.src && this.failed.has(cur.src) ? index.h(mediaFallback.MediaFallback, { inverse: true, text: locale.localeText(undefined, 'galleria.unavailable', undefined, 'Image unavailable') }) : null, cur.src && !this.failed.has(cur.src) ? index.h("img", { class: "full-img", src: cur.src, alt: cur.alt || '', onError: () => this.fail(cur.src) }) : null, this.navigators(true)), this.thumbs(list, true))) : null));
     }