@shineuix/core 1.0.0 → 1.0.1

package/dist/cjs/sui-rich-text-editor.cjs.entry.js

@@ -1,21 +1,21 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var fieldShell = require('./field-shell-XLDTgSCW.js');
-var shortcut = require('./shortcut-DtorcEKc.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var editorApi = require('./editor-api-CSahLJnW.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var fieldShell = require('./field-shell-BJ_XxyIs.js');
+var shortcut = require('./shortcut-DFVF9r5V.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var editorApi = require('./editor-api-a2yvULBj.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var behaviors = require('./behaviors-BtpAo1yJ.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 aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiRichTextEditorCss = () => `.sc-sui-rich-text-editor-h{display:block;font-family:var(--font-sans);color:var(--ink)}.sui-rte-box.sc-sui-rich-text-editor{position:relative;box-sizing:border-box}.sui-frame.focus-own.sc-sui-rich-text-editor:focus-within:not(.focus){border-color:var(--control-border);outline:none;box-shadow:none}.sui-frame.focus-own.invalid.sc-sui-rich-text-editor:focus-within:not(.focus){border-color:var(--danger);outline:1px solid var(--danger);outline-offset:-2px;box-shadow:none}.sui-rte-toolbar.sc-sui-rich-text-editor{display:flex;align-items:center;flex-wrap:wrap;gap:2px;padding:7px 9px;border-bottom:1px solid var(--hairline);background:var(--surface-sunken);border-radius:var(--radius-md) var(--radius-md) 0 0}.sui-rte-spacer.sc-sui-rich-text-editor{flex:1}.sui-rte-loading.sc-sui-rich-text-editor{padding:14px;font-size:12.5px;color:var(--ink-faint)}.sui-rte-loading[hidden].sc-sui-rich-text-editor{display:none}.sui-rte-body.sc-sui-rich-text-editor{position:relative}.sb-editor-mount.sc-sui-rich-text-editor{box-sizing:content-box;padding:12px 14px;font-size:13.5px;line-height:1.6;color:var(--ink);opacity:0;transition:opacity var(--duration-fast) var(--ease-out)}.ready.sc-sui-rich-text-editor-h .sb-editor-mount.sc-sui-rich-text-editor{opacity:1}.sb-editor-mount.sui-rte-static.sc-sui-rich-text-editor{opacity:1}.sui-rte-placeholder.sc-sui-rich-text-editor{position:absolute;inset-inline-start:14px;top:12px;font-size:13.5px;line-height:1.6;color:var(--ink-placeholder);pointer-events:none}.sui-rte-placeholder[hidden].sc-sui-rich-text-editor{display:none}.sui-rte-status.sc-sui-rich-text-editor{display:flex;align-items:center;gap:12px;padding:6px 12px;border-top:1px solid var(--hairline);font-size:11px;color:var(--ink-faint);font-feature-settings:'tnum'}.sui-rte-lock.sc-sui-rich-text-editor{display:inline-flex;align-items:center;gap:5px;font-weight:650;white-space:nowrap}.sui-rte-lock.sc-sui-rich-text-editor .sui-glyph.sc-sui-rich-text-editor{font-size:9px}.sui-rte-bubble.sc-sui-rich-text-editor{transform:translateX(-50%)}.sui-rte-pop.sc-sui-rich-text-editor{position:relative;display:inline-flex}.sui-rte-panel.sc-sui-rich-text-editor{position:absolute;top:calc(100% + 5px);inset-inline-start:0;z-index:var(--z-dropdown);box-sizing:border-box;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);padding:4px;animation:sui-rte-pop-in var(--duration-overlay) var(--ease-out)}@keyframes sui-rte-pop-in{from{opacity:0;transform:translateY(4px)}}.sui-rte-panel.block.sc-sui-rich-text-editor{width:150px}.sui-rte-panel.merge.sc-sui-rich-text-editor{width:210px}.sui-rte-panel.link.sc-sui-rich-text-editor{inset-inline-start:-60px;display:flex;gap:6px;padding:8px}.sui-rte-block-trigger.sc-sui-rich-text-editor{height:28px;width:108px;padding-block:0;padding-inline:10px 8px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:space-between;gap:7px;color:var(--ink);font-size:12px;font-weight:620;font-family:var(--font-sans);cursor:pointer;white-space:nowrap}.sui-rte-block-trigger.sc-sui-rich-text-editor .sui-glyph.sc-sui-rich-text-editor{font-size:9px;color:var(--ink-faint)}.sui-rte-option.sc-sui-rich-text-editor{display:block;width:100%;text-align:start;padding:6px 9px;border-radius:5px;border:none;background:transparent;color:var(--ink);cursor:pointer;font-family:var(--font-sans);font-size:12.5px;font-weight:460;line-height:normal;transition:background var(--duration-fast) var(--ease-out)}.sui-rte-option.sc-sui-rich-text-editor:hover,.sui-rte-option.sc-sui-rich-text-editor:focus-visible{--ink-faint:var(--ink-muted);background:var(--surface-hover);outline:none}.sui-rte-option.sc-sui-rich-text-editor:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.sui-rte-option.selected.sc-sui-rich-text-editor{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--surface-selected);font-weight:650}.sui-rte-option.selected.sc-sui-rich-text-editor:hover,.sui-rte-option.selected.sc-sui-rich-text-editor:focus-visible{--ink-muted:var(--ink);--ink-faint:var(--ink);background:linear-gradient(var(--surface-hover) 0 0) var(--surface-selected)}.sui-rte-option.h1.sc-sui-rich-text-editor{font-size:15px;font-weight:700}.sui-rte-option.h2.sc-sui-rich-text-editor{font-size:13.5px;font-weight:700}.sui-rte-option.h3.sc-sui-rich-text-editor{font-weight:700}.sui-rte-option.code.sc-sui-rich-text-editor{font-family:var(--font-mono)}.sui-rte-eyebrow.sc-sui-rich-text-editor{padding:6px 9px 4px;font-size:10px;font-weight:650;letter-spacing:0.09em;text-transform:uppercase;color:var(--ink-faint)}.sui-rte-merge-row.sc-sui-rich-text-editor{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:6px 9px;border-radius:5px;border:none;background:transparent;color:var(--ink);cursor:pointer;font-family:var(--font-sans);text-align:start;transition:background var(--duration-fast) var(--ease-out)}.sui-rte-merge-row.sc-sui-rich-text-editor:hover,.sui-rte-merge-row.sc-sui-rich-text-editor:focus-visible{--ink-faint:var(--ink-muted);background:var(--surface-hover);outline:none}.sui-rte-merge-row.sc-sui-rich-text-editor span.sc-sui-rich-text-editor{font-size:12.5px;font-weight:600}.sui-rte-merge-row.sc-sui-rich-text-editor code.sc-sui-rich-text-editor{font-size:9.5px;color:var(--ink-faint);font-family:var(--font-mono)}.sui-rte-link-input.sc-sui-rich-text-editor{width:180px;min-width:0;height:28px;box-sizing:border-box;padding:0 9px;color:var(--ink);font-size:12px;font-family:var(--font-sans)}.sui-rte-link-input.sc-sui-rich-text-editor::placeholder{color:var(--ink-placeholder)}@media (forced-colors: active){.sui-rte-option.sc-sui-rich-text-editor:focus-visible,.sui-rte-merge-row.sc-sui-rich-text-editor:focus-visible{outline:2px solid CanvasText;outline-offset:-2px}.sui-rte-option.selected.sc-sui-rich-text-editor{forced-color-adjust:none;background:Highlight;color:HighlightText}}`;
 
@@ -521,7 +521,7 @@ const SuiRichTextEditor = class {
         const s = this.snap;
         const showPlaceholder = this.ready && !!s?.empty && !locked;
         // Until the engine has mounted (on the server, and in the browser while ProseMirror loads), the
-        // document is drawn as static markup through the same sanitiser, so the text is there from the
+        // document is drawn as static markup through the same sanitizer, so the text is there from the
         // first paint; the engine's own surface replaces it in the render that marks it ready.
         const staticHtml = this.ready ? '' : editorApi.sanitizeEditorHtml(this.html || '');
         return (index.h(index.Host, { key: 'f2d203ef4a5d0729bf496f9ecb0e8314a89f7784', class: { [this.variant]: true, 'read-only': locked, disabled: this.isDisabled, focused: this.focused, ready: this.ready, invalid: this.invalid || !!this.error } }, index.h(fieldShell.FieldShell, { key: '29fe86632f0aa40f64354551515e71fa0d8f5c2e', label: this.label, help: this.help, error: this.error, descId: this.fieldId }, index.h("div", { key: '5e50036b9048d055b6510f525e68d9aaef437d1f', class: { 'sui-rte-box': true, 'sui-frame': true, 'focus-own': true, focus: this.editing, invalid: this.invalid || !!this.error, disabled: this.isDisabled, readonly: locked && !this.isDisabled }, ref: (el) => (this.box = el), onFocusin: this.onFocusIn, onFocusout: this.onFocusOut, onKeyDown: this.onBoxKey }, !locked && !bubble ? this.renderToolbar() : null, bubble ? this.renderBubble() : null, index.h("div", { key: "loading", class: "sui-rte-loading", hidden: this.ready || !!staticHtml }, locale.localeText(undefined, 'rich-text-editor.loading', undefined, 'Loading editor engine (ProseMirror)…')), index.h("div", { key: "body", class: "sui-rte-body" }, staticHtml ? (index.h("div", { key: "static", class: "sb-editor-mount sui-rte-static sc-sui-rich-text-editor-s", style: { minHeight: `${minHeight}px` }, innerHTML: editorApi.trustedHTML(staticHtml) })) : null, index.h("div", { key: "mount", class: "sb-editor-mount sc-sui-rich-text-editor-s", hidden: !!staticHtml, ref: (el) => (this.mount = el), style: { minHeight: `${minHeight}px` } }), index.h("div", { key: "placeholder", class: "sui-rte-placeholder", hidden: !showPlaceholder, "aria-hidden": "true" }, locale.localeText(undefined, 'rich-text-editor.placeholder', this.placeholder, 'Write here…'))), index.h("div", { key: "status", class: "sui-rte-status" }, locked ? (index.h("span", { class: "sui-rte-lock" }, index.h(glyphs.Glyph, { glyph: glyphs.lock }), this.isDisabled ? locale.localeText(undefined, 'rich-text-editor.disabled', undefined, 'Disabled') : locale.localeText(undefined, 'rich-text-editor.readOnly', undefined, 'Read-only'))) : null, s || !staticHtml ? index.h("span", { class: "sui-rte-count" }, wordCount(s?.words || 0), " \u00B7 ", charCount(s?.chars || 0)) : null, index.h("span", { key: '1cbe0d58336947a6bf9f97b287c2ddc28a49139d', class: "sui-rte-spacer" }), index.h("slot", { key: 'd253cf5b0893c41586ed5a30540959d7882a1bf2', name: "status" }))))));

package/dist/cjs/sui-save-status.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-BtWzlhN3.js');
 var locale = require('./locale-EVD23NSt.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 
 const suiSaveStatusCss = () => `.sc-sui-save-status-h{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-sans);font-size:12px;font-weight:620;color:var(--ink-muted)}.icon.sc-sui-save-status{font-size:12px}[state="dirty"].sc-sui-save-status-h .icon.sc-sui-save-status{font-size:7px;color:var(--status-attention-accent)}[state="error"].sc-sui-save-status-h{color:var(--danger);font-weight:650}`;
 
@@ -16,11 +16,16 @@ const SuiSaveStatus = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
-    /** Which line to show. */
-    state = 'saved';
+    /**
+     * Which line to show. `idle`, the default, has nothing to report: a record opened and not yet
+     * edited. It draws nothing and stays in the page as the live region, so the first change is
+     * announced; a live region added to the page together with its text is often not read. Keep the
+     * element in place and change `state`, rather than adding it when there is something to say.
+     */
+    state = 'idle';
     /**
      * When the record was saved, in the page's language, e.g. "2 min ago". The saved line reads
-     * "Saved 2 min ago"; without it, "Saved just now".
+     * "Saved 2 min ago"; without it, "Saved just now". Read on the saved line only.
      */
     time;
     text(state) {
@@ -35,9 +40,10 @@ const SuiSaveStatus = class {
             : locale.localeText(undefined, 'save-status.savedJustNow', undefined, 'Saved just now');
     }
     render() {
-        const state = GLYPHS[this.state] ? this.state : 'saved';
-        const s = GLYPHS[state];
-        return (index.h(index.Host, { key: '2b2ff47dfdbe5e5bbed24648474cf9417aaaefac', role: "status", "aria-live": "polite" }, index.h(glyphs.Glyph, { key: 'ebcefc26bba653ba5e91c0b143d35fe79bf37533', glyph: s.glyph, class: "icon", spin: s.spin }), index.h("span", { key: '0ba9900555885c1cb660235090515cc206d81316', class: "text" }, this.text(state))));
+        // A state the element does not know reports nothing rather than a save that may not have run.
+        const state = GLYPHS[this.state] ? this.state : null;
+        const s = state ? GLYPHS[state] : null;
+        return (index.h(index.Host, { key: 'e6b7c187d74595dabdc330a79178db005f7a8026', role: "status", "aria-live": "polite" }, state && s ? [index.h(glyphs.Glyph, { glyph: s.glyph, class: "icon", spin: s.spin }), index.h("span", { class: "text" }, this.text(state))] : null));
     }
 };
 SuiSaveStatus.style = suiSaveStatusCss();

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

@@ -1,10 +1,10 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var format = require('./format-BOushIZn.js');
-var datetime = require('./datetime-BJ2__762.js');
+var format = require('./format-C_36FFqb.js');
+var datetime = require('./datetime-BjnA3NLP.js');
 var clock = require('./clock-BoprlBky.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 var id = require('./id-Ca7UTKW6.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var locale = require('./locale-EVD23NSt.js');

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

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 require('./locale-EVD23NSt.js');
 
@@ -103,7 +103,7 @@ const SuiScrollPanel = class {
         this.atBottom = el.scrollTop >= range - EDGE;
     };
     render() {
-        return (index.h(index.Host, { key: '3bc8103387774825da35821902c89660eec9c2ce' }, index.h("div", { key: 'af4deb8848a97cd9a5759dbc08ba06356f30dd4c', class: "viewport", ref: (el) => (this.viewport = el), style: { height: `${this.height}px` }, tabindex: this.overflowing ? '0' : undefined, role: this.hostLabel ? 'region' : undefined, "aria-label": this.hostLabel || undefined, onScroll: this.measure }, index.h("div", { key: 'd222f3fd435ea470d353423be9b62d75304e22a2', class: "content", ref: (el) => (this.content = el) }, index.h("slot", { key: '92d71107fd2499c86c62074a19a42549a15823e5' }))), index.h("div", { key: '5d75598c86729ef4d058c9f60857d5b9ea4c0548', class: { fade: true, top: true, on: !this.atTop }, "aria-hidden": "true" }), index.h("div", { key: '0a381cfdcb95708abc3fb0fd4944dabcd7790a57', class: { fade: true, bottom: true, on: !this.atBottom }, "aria-hidden": "true" })));
+        return (index.h(index.Host, { key: '8988eecd590ae436c6d76013e1072f2b8310cfcd' }, index.h("div", { key: 'a5f3079b2be410e78aafa26fb9f2ebb413fdc8ce', class: "viewport", ref: (el) => (this.viewport = el), style: { height: `${this.height}px` }, tabindex: this.overflowing ? '0' : undefined, role: this.hostLabel ? 'region' : undefined, "aria-label": this.hostLabel || undefined, onScroll: this.measure }, index.h("div", { key: '9d20f67cdc37a42a350895908ad3a866b487f857', class: "content", ref: (el) => (this.content = el) }, index.h("slot", { key: 'ad8de745a31baac43902021700e474b77a278ad1' }))), index.h("div", { key: '9a312926faf4d7f3fbe298fc7c8a0f4994483a3c', class: { fade: true, top: true, on: !this.atTop }, "aria-hidden": "true" }), index.h("div", { key: '8a732de0e1e7686438b9e01c2cc7035e8d36a161', class: { fade: true, bottom: true, on: !this.atBottom }, "aria-hidden": "true" })));
     }
     static get watchers() { return {
         "height": [{

package/dist/cjs/sui-scroll-top.cjs.entry.js

@@ -2,9 +2,9 @@
 
 var index = require('./index-BtWzlhN3.js');
 var formControl = require('./form-control-CvMyyCaa.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 var locale = require('./locale-EVD23NSt.js');
-var motion = require('./motion-BaUBY31j.js');
+var motion = require('./motion-D8mcyZVH.js');
 
 const suiScrollTopCss = () => `.sc-sui-scroll-top-h{display:contents;font-family:var(--font-sans)}.sui-scroll-top.sc-sui-scroll-top{position:fixed;inset-inline-end:18px;bottom:18px;z-index:var(--z-overlay);width:42px;height:42px;border-radius:50%;border:none;background:var(--brand);color:var(--brand-contrast);box-shadow:var(--shadow-pop);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin:0;transition:background var(--duration-fast) var(--ease-out)}.sui-scroll-top.inside.sc-sui-scroll-top{position:sticky;inset-inline-end:auto;bottom:18px;z-index:var(--z-sticky);margin-block:18px 0;margin-inline:auto 18px}.sui-scroll-top.sc-sui-scroll-top:hover{background:var(--brand-hover)}.sui-scroll-top.sc-sui-scroll-top:active{background:var(--brand-active)}.sui-scroll-top.sc-sui-scroll-top:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sui-scroll-top.sc-sui-scroll-top .sui-glyph.sc-sui-scroll-top{font-size:14px}@media (forced-colors: active){.sui-scroll-top.sc-sui-scroll-top{border:1px solid ButtonText}}`;
 
@@ -118,7 +118,7 @@ const SuiScrollTop = class {
             el.scrollTop = 0;
     };
     render() {
-        return (index.h(index.Host, { key: '1766543a8c8e1ae405007d1d58e6663896dfa831' }, this.visible ? (index.h("button", { type: "button", class: { 'sui-scroll-top': true, inside: this.inside }, "aria-label": locale.localeText(undefined, 'scroll-top.backToTop', undefined, 'Back to top'), onClick: this.toTop }, index.h(glyphs.Glyph, { glyph: glyphs.arrowUp }))) : null));
+        return (index.h(index.Host, { key: '63e7a26a0330440bb7218970290a07a50702ef6c' }, this.visible ? (index.h("button", { type: "button", class: { 'sui-scroll-top': true, inside: this.inside }, "aria-label": locale.localeText(undefined, 'scroll-top.backToTop', undefined, 'Back to top'), onClick: this.toTop }, index.h(glyphs.Glyph, { glyph: glyphs.arrowUp }))) : null));
     }
     static get watchers() { return {
         "target": [{

package/dist/cjs/{sui-select-DFEg73cd.js → sui-select-BIs1eF8Q.js}

@@ -1,16 +1,16 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var fieldShell = require('./field-shell-XLDTgSCW.js');
-var popupRows = require('./popup-rows-Cssh7aI9.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var aria = require('./aria-DXFt0vvU.js');
+var fieldShell = require('./field-shell-BJ_XxyIs.js');
+var popupRows = require('./popup-rows--Tt1lQhB.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var aria = require('./aria-DsLSiGlA.js');
 var id = require('./id-Ca7UTKW6.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
 var options = require('./options-BN7er6uK.js');
-var overlay = require('./overlay-DcMtiB1L.js');
-var popupSurface = require('./popup-surface-BOH2mgOi.js');
+var overlay = require('./overlay-CsoWlGY8.js');
+var popupSurface = require('./popup-surface-Db-7bDoA.js');
 var focus = require('./focus-DRuLpXAC.js');
 var virtual = require('./virtual-Dk8q_Rrq.js');
 var locale = require('./locale-EVD23NSt.js');
@@ -18,7 +18,7 @@ var renderContent = require('./render-content-Bij4diic.js');
 var keyNav = require('./key-nav-D1FeUqKe.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiSelectCss = () => `.sc-sui-select-h{display:block;font-family:var(--font-sans);min-width:0}.sui-popup-trigger.readonly.sc-sui-select:not(:disabled){cursor:default}.sui-select.sc-sui-select{position:relative}.sui-select.inline.sc-sui-select{display:flex;align-items:flex-start}.sui-popup-option.sc-sui-select .icon.sc-sui-select,.sui-popup-trigger.sc-sui-select .icon.sc-sui-select{font-size:12px;width:15px;text-align:center;color:var(--ink-muted);flex-shrink:0}.sui-popup-option.disabled.sc-sui-select .icon.sc-sui-select,.sui-popup-trigger.sc-sui-select:disabled .icon.sc-sui-select{color:var(--ink-placeholder)}.sui-popup-option-label.custom.sc-sui-select,.sui-popup-trigger.sc-sui-select .val.custom.sc-sui-select,.sui-inline.sc-sui-select .val.custom.sc-sui-select{display:flex;align-items:center;gap:8px}.sui-popup-option-text.sc-sui-select{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.sui-popup-option-text.sc-sui-select .sui-popup-option-label.sc-sui-select{flex:none}.sui-popup-option-desc.sc-sui-select{font-size:12px;font-weight:460;line-height:1.3;color:var(--ink-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-popup-option.disabled.sc-sui-select .sui-popup-option-desc.sc-sui-select{color:var(--ink-placeholder)}@media (forced-colors: active){.sui-popup-option.selected.sc-sui-select .icon.sc-sui-select,.sui-popup-option.selected.sc-sui-select .sui-popup-option-desc.sc-sui-select{color:HighlightText}.sui-popup-option.disabled.sc-sui-select .icon.sc-sui-select,.sui-popup-trigger.sc-sui-select:disabled .icon.sc-sui-select,.sui-popup-option.disabled.sc-sui-select .sui-popup-option-desc.sc-sui-select{color:GrayText}}`;
 
@@ -117,7 +117,7 @@ const SuiSelect = class {
     variant = 'default';
     /**
      * Ink for the quiet variant on the brand chrome. `inverse` takes the inverse inks, the inverse hover
-     * wash and the inverse focus colour, as `sui-button`'s tone of the same name does, so the value
+     * wash and the inverse focus color, as `sui-button`'s tone of the same name does, so the value
      * reads on a `tone="brand"` toolbar. Opening the field shows its shell in the card's own inks. The
      * default variant ignores it.
      */
@@ -541,7 +541,7 @@ const SuiSelect = class {
         const triggerClass = inline
             ? { 'sui-inline': true, [size]: true, open: this.open, shell: this.open, invalid, placeholder: !sel, readonly: this.readOnly, inverse: this.tone === 'inverse' }
             : { 'sui-popup-trigger': true, 'sui-frame': true, [size]: true, open: this.open, focus: this.focused, invalid, placeholder: !sel, readonly: this.readOnly };
-        return (index.h(fieldShell.FieldShell, { key: '3e43436a5f0c6f30c29ffbbe0f4b846897264d15', label: inline ? undefined : this.label, required: this.required, help: this.help, error: this.error, htmlFor: this.fieldId, descId: this.fieldId }, index.h("div", { key: 'a7609f4a6b07cca3bb666e0bb77cbab6f8cddc63', class: { 'sui-select': true, inline }, onKeyDown: this.onKeyDown }, index.h("button", { key: 'ad461b35b4a51c6cbcd6d9cf76ca012583728c62', ref: (el) => (this.trigger = el), id: this.fieldId, class: triggerClass, type: "button", disabled: this.isDisabled, role: "combobox", "aria-label": inline ? this.label || this.hostLabel : this.label ? undefined : this.hostLabel, "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `${this.fieldId}-list`, "aria-activedescendant": activeId, "aria-invalid": invalid ? 'true' : null, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), "aria-required": this.required ? 'true' : null, "aria-readonly": this.readOnly ? 'true' : null, "aria-keyshortcuts": canClear ? 'Delete' : null, "aria-busy": this.loading ? 'true' : null, onClick: () => (this.open ? this.requestClose('trigger') : this.show()), onFocus: () => (this.focused = true), onBlur: () => (this.focused = false) }, sel ? this.renderIcon(sel) : null, sel && sel.render
+        return (index.h(fieldShell.FieldShell, { key: 'c7dea087307f1e8d0ec499295752d99dbf0da435', label: inline ? undefined : this.label, required: this.required, help: this.help, error: this.error, htmlFor: this.fieldId, descId: this.fieldId }, index.h("div", { key: '15feb4f281bc318bea8b94f850bc84c338368fdd', class: { 'sui-select': true, inline }, onKeyDown: this.onKeyDown }, index.h("button", { key: '37dfed4dace9dcd4b3a9f0f5f3f61849c0ac9567', ref: (el) => (this.trigger = el), id: this.fieldId, class: triggerClass, type: "button", disabled: this.isDisabled, role: "combobox", "aria-label": inline ? this.label || this.hostLabel : this.label ? undefined : this.hostLabel, "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `${this.fieldId}-list`, "aria-activedescendant": activeId, "aria-invalid": invalid ? 'true' : null, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), "aria-required": this.required ? 'true' : null, "aria-readonly": this.readOnly ? 'true' : null, "aria-keyshortcuts": canClear ? 'Delete' : null, "aria-busy": this.loading ? 'true' : null, onClick: () => (this.open ? this.requestClose('trigger') : this.show()), onFocus: () => (this.focused = true), onBlur: () => (this.focused = false) }, sel ? this.renderIcon(sel) : null, sel && sel.render
             ? index.h("span", { key: "val-custom", class: "val custom", ref: (el) => {
                     if (el)
                         renderContent.mountContent(el, renderContent.callRender(sel.render, ['value'], sel.label));
@@ -550,7 +550,7 @@ const SuiSelect = class {
             ? index.h(glyphs.Glyph, { glyph: glyphs.circleNotch, class: "spin sui-popup-spin" })
             : index.h(glyphs.Glyph, { glyph: glyphs.chevronDown, class: "chev" })), this.open || this.closing ? (index.h("div", { key: "panel", ref: (el) => (this.panel = el), class: { 'sui-popup-panel': true, closing: this.closing }, inert: this.closing, role: "presentation", onScroll: this.onPanelScroll, onKeyDown: this.onPanelKey }, this.filter ? (index.h("div", { class: "sui-popup-search" }, index.h("div", { class: "sui-popup-search-box sui-frame" }, index.h(glyphs.Glyph, { glyph: glyphs.magnifyingGlass }), index.h("input", { ref: (el) => (this.filterInput = el), type: "text", placeholder: locale.localeText(undefined, 'select.search', undefined, 'Search'), "aria-label": locale.localeText(undefined, 'select.searchOptions', undefined, 'Search options'), "aria-controls": `${this.fieldId}-list`, "aria-activedescendant": activeId, value: this.query, onInput: (e) => { this.query = e.target.value; this.hoverIdx = 0; this.resetScroll(); } })))) : null, this.loading ? index.h(popupRows.PopupLoading, { message: loadingText }) : null, !this.loading && list.length === 0 ? index.h("div", { key: "empty", class: "sui-popup-empty" }, emptyText) : null, index.h("div", { key: "list", id: `${this.fieldId}-list`, role: "listbox", "aria-label": this.label || this.hostLabel, "aria-busy": this.loading ? 'true' : null }, this.loading || list.length === 0
             ? null
-            : popupRows.popupRows(runs, win, (r) => `${this.fieldId}-grp-${r}`, (o, i) => this.renderRow(o, i, list.length))))) : null, index.h(popupRows.PopupStatus, { key: '7761ce644cbeedffc56f084e1e7f273a5e984d69', message: !this.open ? '' : this.loading ? loadingText : list.length === 0 ? emptyText : '' }))));
+            : popupRows.popupRows(runs, win, (r) => `${this.fieldId}-grp-${r}`, (o, i) => this.renderRow(o, i, list.length))))) : null, index.h(popupRows.PopupStatus, { key: '2cf3588de6b3d13ae763322a3482406d8d9fd25f', message: !this.open ? '' : this.loading ? loadingText : list.length === 0 ? emptyText : '' }))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/cjs/sui-select-button.cjs.entry.js

@@ -1,15 +1,15 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var fieldShell = require('./field-shell-XLDTgSCW.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
+var fieldShell = require('./field-shell-BJ_XxyIs.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
 var id = require('./id-Ca7UTKW6.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
 var formMulti = require('./form-multi-BGykpOcS.js');
 var options = require('./options-BN7er6uK.js');
 var behaviors = require('./behaviors-BtpAo1yJ.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 require('./locale-EVD23NSt.js');
 require('./direction-BaE_rqNY.js');
 
@@ -236,7 +236,7 @@ const SuiSelectButton = class {
         const opts = this.norm();
         const linked = this.linked(opts);
         const labelId = this.label ? `${this.fieldId}-label` : undefined;
-        return (index.h(fieldShell.FieldShell, { key: 'b8fe3e006c63e7dcac2bd8b66fe3b5e7d1b98170', help: this.help, error: this.error, descId: this.fieldId }, this.label ? (index.h("div", { class: "sui-field-label", id: labelId }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, index.h("div", { key: '933f8c2e5d65e6857757f24209d5eafe5847d5d5', ref: (el) => (this.track = el), class: { track: true, pill: this.pill, [this.size]: true, invalid: this.invalid || !!this.error, disabled: this.isDisabled, readonly: this.readOnly }, role: linked ? 'navigation' : this.multiple ? 'group' : 'radiogroup', "aria-labelledby": labelId, "aria-label": labelId ? null : this.hostLabel, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), "aria-invalid": this.invalid || this.error ? 'true' : null, "aria-required": this.required && !this.multiple && !linked ? 'true' : null, "aria-readonly": this.readOnly ? 'true' : null, "aria-disabled": this.isDisabled ? 'true' : null }, opts.map((o) => {
+        return (index.h(fieldShell.FieldShell, { key: 'a8d1ce9734af2a7b62b42ba7d8453dffacac20b2', help: this.help, error: this.error, descId: this.fieldId }, this.label ? (index.h("div", { class: "sui-field-label", id: labelId }, this.label, this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null)) : null, index.h("div", { key: '68ef71aaf46fefd472d6fbf3f9c7b6030495dc1a', ref: (el) => (this.track = el), class: { track: true, pill: this.pill, [this.size]: true, invalid: this.invalid || !!this.error, disabled: this.isDisabled, readonly: this.readOnly }, role: linked ? 'navigation' : this.multiple ? 'group' : 'radiogroup', "aria-labelledby": labelId, "aria-label": labelId ? null : this.hostLabel, "aria-describedby": fieldShell.describedBy(this.fieldId, this.help, this.error), "aria-invalid": this.invalid || this.error ? 'true' : null, "aria-required": this.required && !this.multiple && !linked ? 'true' : null, "aria-readonly": this.readOnly ? 'true' : null, "aria-disabled": this.isDisabled ? 'true' : null }, opts.map((o) => {
             const sel = this.isSel(o.value);
             const link = this.isLink(o, linked);
             const Segment = (link ? 'a' : 'button');

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

@@ -1,21 +1,21 @@
 'use strict';
 
-var suiSelect_entry = require('./sui-select-DFEg73cd.js');
+var suiSelect_entry = require('./sui-select-BIs1eF8Q.js');
 require('./index-BtWzlhN3.js');
-require('./field-shell-XLDTgSCW.js');
-require('./glyphs-8uuUhG6s.js');
-require('./popup-rows-Cssh7aI9.js');
-require('./aria-DXFt0vvU.js');
+require('./field-shell-BJ_XxyIs.js');
+require('./glyphs-BNG4Wolq.js');
+require('./popup-rows--Tt1lQhB.js');
+require('./aria-DsLSiGlA.js');
 require('./id-Ca7UTKW6.js');
 require('./form-control-CvMyyCaa.js');
 require('./locale-EVD23NSt.js');
 require('./form-disabled-wss8T3bH.js');
 require('./options-BN7er6uK.js');
-require('./overlay-DcMtiB1L.js');
+require('./overlay-CsoWlGY8.js');
 require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
-require('./popup-surface-BOH2mgOi.js');
+require('./motion-D8mcyZVH.js');
+require('./popup-surface-Db-7bDoA.js');
 require('./focus-DRuLpXAC.js');
 require('./virtual-Dk8q_Rrq.js');
 require('./render-content-Bij4diic.js');

package/dist/cjs/sui-side-nav.cjs.entry.js

@@ -1,19 +1,19 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var aria = require('./aria-DXFt0vvU.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var aria = require('./aria-DsLSiGlA.js');
 var slots = require('./slots-rhqoeAqs.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var anchor = require('./anchor-BjGUozqb.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var locale = require('./locale-EVD23NSt.js');
 var id = require('./id-Ca7UTKW6.js');
 var direction = require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
-const suiSideNavCss = () => `.sc-sui-side-nav-h{display:inline-block;vertical-align:top;font-family:var(--font-sans)}.flush.sc-sui-side-nav-h{display:block;align-self:stretch}.rail.sc-sui-side-nav,.fly.sc-sui-side-nav{--sn-ground:var(--surface-navy);--sn-ink:var(--ink-inverse);--sn-quiet:var(--ink-inverse-muted);--sn-hair:var(--border-inverse);--sn-wash:color-mix(in srgb, var(--ink-inverse) 7%, transparent);--sn-fill:var(--surface-navy-current);--sn-off:color-mix(in srgb, var(--ink-inverse) 34%, transparent);--sn-mark:var(--accent-inverse)}.rail.sc-sui-side-nav{width:var(--sidebar-w);height:100%;box-sizing:border-box;flex-shrink:0;background:var(--sn-ground);color:var(--sn-ink);display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-lg);transition:width var(--duration-base) var(--ease-out)}.rail.brand.sc-sui-side-nav,.fly.brand.sc-sui-side-nav{--focus-ring:var(--ink-inverse);--focus-shadow:none}.rail.brand.sc-sui-side-nav{--logo-quiet:color-mix(in srgb, currentColor var(--logo-quiet-inverse, 82%), transparent);--logo-spark:var(--logo-spark-inverse)}.rail.surface.sc-sui-side-nav,.fly.surface.sc-sui-side-nav{--sn-ground:var(--surface);--sn-ink:var(--ink);--sn-quiet:var(--ink-muted);--sn-hair:var(--hairline);--sn-wash:var(--surface-hover);--sn-fill:var(--surface-current);--sn-off:var(--ink-placeholder);--sn-mark:var(--accent-mark)}.rail.canvas.sc-sui-side-nav,.fly.canvas.sc-sui-side-nav{--sn-ground:var(--canvas);--sn-ink:var(--ink);--sn-quiet:var(--ink-muted);--sn-hair:var(--border);--sn-wash:var(--surface-hover);--sn-fill:var(--surface-current);--sn-off:var(--ink-placeholder);--sn-mark:var(--accent-mark)}.rail.surface.sc-sui-side-nav,.rail.canvas.sc-sui-side-nav{border:1px solid var(--border)}.rail.flush.sc-sui-side-nav{border-radius:0}.rail.surface.flush.sc-sui-side-nav,.rail.canvas.flush.sc-sui-side-nav{border-width:0;border-inline-end-width:1px}.rail.collapsed.sc-sui-side-nav{width:60px}.brand-row.sc-sui-side-nav{display:flex;align-items:center;gap:10px;padding-block:13px 11px;padding-inline:10.5px 12px;min-height:30px}.rail.collapsed.sc-sui-side-nav .brand-row.sc-sui-side-nav{padding:13px 0 11px;justify-content:center;gap:0}.mark.sc-sui-side-nav{width:28px;height:28px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}.mark.sc-sui-side-nav-s>*,.mark .sc-sui-side-nav-s>*{display:block;max-width:28px;max-height:28px}.word.sc-sui-side-nav{flex:1;min-width:0;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.head-slot.sc-sui-side-nav{padding:0 12px 10px}.rail.collapsed.sc-sui-side-nav .head-slot.sc-sui-side-nav{padding:0 8px 8px;display:flex;justify-content:center}.scroll.sc-sui-side-nav{flex:1;overflow-x:hidden;overflow-y:auto;padding:2px 0 10px}.scroll.has-bottom.sc-sui-side-nav{display:flex;flex-direction:column}.section.push.sc-sui-side-nav{margin-top:auto}.heading.sc-sui-side-nav{padding:13px 16px 5px;white-space:nowrap;overflow:hidden;font-size:10px;font-weight:650;letter-spacing:var(--tracking-wider);color:var(--sn-quiet)}.rule.sc-sui-side-nav{height:1px;background:var(--sn-hair);margin:8px 12px}.list.sc-sui-side-nav{list-style:none;margin:0;padding:0}.item.sc-sui-side-nav{position:relative;display:flex;align-items:center;gap:10px;width:calc(100% - 16px);box-sizing:border-box;padding-block:7.5px;padding-inline:8px 6px;justify-content:flex-start;margin:2px 8px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--sn-quiet);font-family:var(--font-sans);font-size:13.5px;font-weight:460;line-height:normal;text-align:start;cursor:pointer;user-select:none;text-decoration:none;transition:background var(--duration-fast) var(--ease-out)}a.item.sc-sui-side-nav,a.item.sc-sui-side-nav:hover,a.item.sc-sui-side-nav:visited{color:var(--sn-quiet);text-decoration:none}a.item.on.sc-sui-side-nav,a.item.on.sc-sui-side-nav:hover,a.item.on.sc-sui-side-nav:visited{color:var(--sn-ink)}.item.sc-sui-side-nav:hover{--ink-faint:var(--ink-muted);background:var(--sn-wash)}.item.on.sc-sui-side-nav{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--sn-fill);color:var(--sn-ink);font-weight:650}.item.sc-sui-side-nav:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.item.sub.sc-sui-side-nav{padding-inline-start:35px}.item[disabled].sc-sui-side-nav,.item[disabled].sc-sui-side-nav:hover{--ink-muted:var(--ink-placeholder);--ink-faint:var(--ink-placeholder);--accent:var(--surface-sunken);--accent-contrast:var(--ink-placeholder);color:var(--sn-off);background:transparent;cursor:not-allowed}.rail.collapsed.sc-sui-side-nav .item.sc-sui-side-nav{padding:9px 0;justify-content:center}.icon.sc-sui-side-nav{font-size:13px;width:17px;text-align:center;color:inherit}.item.on.sc-sui-side-nav .icon.sc-sui-side-nav{color:inherit}.label.sc-sui-side-nav{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge.sc-sui-side-nav{min-width:17px;height:17px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:var(--accent);color:var(--accent-contrast);font-size:10px;font-weight:720;font-feature-settings:'tnum';display:inline-flex;align-items:center;justify-content:center}.dot.sc-sui-side-nav{position:absolute;top:8px;inset-inline-end:7px;width:6px;height:6px;border-radius:50%;background:var(--sn-mark)}.chev.sc-sui-side-nav{font-size:9px;width:10px;text-align:center;color:inherit;transition:transform var(--duration-base) var(--ease-out)}.chev.closed.sc-sui-side-nav{transform:rotate(-90deg)}.chev.closed.sc-sui-side-nav:dir(rtl){transform:rotate(90deg)}.sub-list.sc-sui-side-nav{list-style:none;margin:0;padding:0}.foot.sc-sui-side-nav{border-top:1px solid var(--sn-hair);display:flex;align-items:center;gap:10px;padding-block:9px;padding-inline:16px 10px}.foot-slot.sc-sui-side-nav{flex:1;min-width:0;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.rail.collapsed.sc-sui-side-nav .foot.sc-sui-side-nav{flex-direction:column;gap:8px;padding:9px 0}.rail.collapsed.sc-sui-side-nav .foot-slot.sc-sui-side-nav{flex:none;justify-content:center}.ctl.sc-sui-side-nav{width:var(--control-sm);height:var(--control-sm);flex-shrink:0;border:none;border-radius:var(--radius-md);padding:0;background:transparent;color:var(--sn-quiet);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.ctl.sc-sui-side-nav .sui-glyph.sc-sui-side-nav{font-size:11px}.ctl.sc-sui-side-nav .sui-glyph.sc-sui-side-nav:dir(rtl){transform:scaleX(-1)}.ctl.sc-sui-side-nav:hover{background:var(--sn-wash);color:var(--sn-ink)}.ctl.sc-sui-side-nav:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.tip.sc-sui-side-nav{position:fixed;transform:translateY(-50%);z-index:var(--z-tooltip);white-space:nowrap;background:var(--surface-raised);color:var(--ink);border:1px solid var(--border);font-size:11px;font-weight:620;padding:5px 9px;border-radius:6px;box-shadow:var(--shadow-pop);pointer-events:none}.tip.sc-sui-side-nav:dir(rtl){transform:translate(-100%, -50%)}.fly.sc-sui-side-nav{position:fixed;z-index:var(--z-dropdown);min-width:200px;max-width:280px;box-sizing:border-box;padding:4px 0 6px;background:var(--sn-ground);color:var(--sn-ink);border:1px solid var(--sn-hair);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);font-family:var(--font-sans);animation:sui-side-nav-in var(--duration-fast) var(--ease-out)}.fly.surface.sc-sui-side-nav,.fly.canvas.sc-sui-side-nav{border-color:var(--border)}.fly.closing.sc-sui-side-nav{animation:sui-side-nav-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}.fly.sc-sui-side-nav .heading.sc-sui-side-nav{padding-top:9px}@keyframes sui-side-nav-in{from{opacity:0}}@keyframes sui-side-nav-out{to{opacity:0}}@media (forced-colors: active){.rail.sc-sui-side-nav,.fly.sc-sui-side-nav{border:1px solid CanvasText}.rail.flush.sc-sui-side-nav{border-width:0;border-inline-end-width:1px}.rule.sc-sui-side-nav{background:CanvasText}.item.on.sc-sui-side-nav{forced-color-adjust:none;background:Highlight;color:HighlightText}a.item.on.sc-sui-side-nav,a.item.on.sc-sui-side-nav:hover,a.item.on.sc-sui-side-nav:visited{color:HighlightText}.item.sc-sui-side-nav:focus-visible{outline-color:CanvasText;box-shadow:none}.item.on.sc-sui-side-nav .icon.sc-sui-side-nav{color:HighlightText}.badge.sc-sui-side-nav{background:Canvas;color:CanvasText;border:1px solid CanvasText}.dot.sc-sui-side-nav{background:CanvasText}.item.on.sc-sui-side-nav .dot.sc-sui-side-nav{background:HighlightText}}`;
+const suiSideNavCss = () => `.sc-sui-side-nav-h{display:inline-block;vertical-align:top;font-family:var(--font-sans)}.flush.sc-sui-side-nav-h{display:block;align-self:stretch}.rail.sc-sui-side-nav,.fly.sc-sui-side-nav{--sn-ground:var(--surface-navy);--sn-ink:var(--ink-inverse);--sn-quiet:var(--ink-inverse-muted);--sn-hair:var(--border-inverse);--sn-wash:color-mix(in srgb, var(--ink-inverse) 7%, transparent);--sn-fill:var(--surface-navy-current);--sn-off:color-mix(in srgb, var(--ink-inverse) 34%, transparent);--sn-mark:var(--accent-inverse)}.rail.sc-sui-side-nav{width:var(--sidebar-w);height:100%;box-sizing:border-box;flex-shrink:0;background:var(--sn-ground);color:var(--sn-ink);display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-lg);transition:width var(--duration-base) var(--ease-out)}.rail.brand.sc-sui-side-nav,.fly.brand.sc-sui-side-nav{--focus-ring:var(--ink-inverse);--focus-shadow:none}.rail.brand.sc-sui-side-nav{--logo-quiet:color-mix(in srgb, currentColor var(--logo-quiet-inverse, 82%), transparent);--logo-spark:var(--logo-spark-inverse)}.rail.surface.sc-sui-side-nav,.fly.surface.sc-sui-side-nav{--sn-ground:var(--surface);--sn-ink:var(--ink);--sn-quiet:var(--ink-muted);--sn-hair:var(--hairline);--sn-wash:var(--surface-hover);--sn-fill:var(--surface-current);--sn-off:var(--ink-placeholder);--sn-mark:var(--accent-mark)}.rail.canvas.sc-sui-side-nav,.fly.canvas.sc-sui-side-nav{--sn-ground:var(--canvas);--sn-ink:var(--ink);--sn-quiet:var(--ink-muted);--sn-hair:var(--border);--sn-wash:var(--surface-hover);--sn-fill:var(--surface-current);--sn-off:var(--ink-placeholder);--sn-mark:var(--accent-mark)}.rail.surface.sc-sui-side-nav,.rail.canvas.sc-sui-side-nav{border:1px solid var(--border)}.rail.flush.sc-sui-side-nav{border-radius:0}.rail.surface.flush.sc-sui-side-nav,.rail.canvas.flush.sc-sui-side-nav{border-width:0;border-inline-end-width:1px}.rail.collapsed.sc-sui-side-nav{width:60px}.brand-row.sc-sui-side-nav{display:flex;align-items:center;gap:10px;padding-block:13px 11px;padding-inline:10.5px 12px;min-height:30px}.rail.collapsed.sc-sui-side-nav .brand-row.sc-sui-side-nav{padding:13px 0 11px;justify-content:center;gap:0}.mark.sc-sui-side-nav{width:28px;height:28px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}.mark.sc-sui-side-nav-s>*,.mark .sc-sui-side-nav-s>*{display:block;max-width:28px;max-height:28px}.word.sc-sui-side-nav{flex:1;min-width:0;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.head-slot.sc-sui-side-nav{padding:0 12px 10px}.rail.collapsed.sc-sui-side-nav .head-slot.sc-sui-side-nav{padding:0 8px 8px;display:flex;justify-content:center}.scroll.sc-sui-side-nav{flex:1;overflow-x:hidden;overflow-y:auto;padding:2px 0 10px}.scroll.has-bottom.sc-sui-side-nav{display:flex;flex-direction:column}.section.push.sc-sui-side-nav{margin-top:auto}.heading.sc-sui-side-nav{padding:13px 16px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;font-weight:650;letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--sn-quiet)}.rule.sc-sui-side-nav{height:1px;background:var(--sn-hair);margin:8px 12px}.list.sc-sui-side-nav{list-style:none;margin:0;padding:0}.item.sc-sui-side-nav{position:relative;display:flex;align-items:center;gap:10px;width:calc(100% - 16px);box-sizing:border-box;padding-block:7.5px;padding-inline:8px 6px;justify-content:flex-start;margin:2px 8px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--sn-quiet);font-family:var(--font-sans);font-size:13.5px;font-weight:460;line-height:normal;text-align:start;cursor:pointer;user-select:none;text-decoration:none;transition:background var(--duration-fast) var(--ease-out)}a.item.sc-sui-side-nav,a.item.sc-sui-side-nav:hover,a.item.sc-sui-side-nav:visited{color:var(--sn-quiet);text-decoration:none}a.item.on.sc-sui-side-nav,a.item.on.sc-sui-side-nav:hover,a.item.on.sc-sui-side-nav:visited{color:var(--sn-ink)}.item.sc-sui-side-nav:hover{--ink-faint:var(--ink-muted);background:var(--sn-wash)}.item.on.sc-sui-side-nav{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--sn-fill);color:var(--sn-ink);font-weight:650}.item.sc-sui-side-nav:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.item.sub.sc-sui-side-nav{padding-inline-start:35px}.item[disabled].sc-sui-side-nav,.item[disabled].sc-sui-side-nav:hover{--ink-muted:var(--ink-placeholder);--ink-faint:var(--ink-placeholder);--accent:var(--surface-sunken);--accent-contrast:var(--ink-placeholder);color:var(--sn-off);background:transparent;cursor:not-allowed}.rail.collapsed.sc-sui-side-nav .item.sc-sui-side-nav{padding:9px 0;justify-content:center}.icon.sc-sui-side-nav{font-size:13px;width:17px;text-align:center;color:inherit}.item.on.sc-sui-side-nav .icon.sc-sui-side-nav{color:inherit}.label.sc-sui-side-nav{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge.sc-sui-side-nav{min-width:17px;height:17px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:var(--accent);color:var(--accent-contrast);font-size:10px;font-weight:720;font-feature-settings:'tnum';display:inline-flex;align-items:center;justify-content:center}.dot.sc-sui-side-nav{position:absolute;top:8px;inset-inline-end:7px;width:6px;height:6px;border-radius:50%;background:var(--sn-mark)}.chev.sc-sui-side-nav{font-size:9px;width:10px;text-align:center;color:inherit;transition:transform var(--duration-base) var(--ease-out)}.chev.closed.sc-sui-side-nav{transform:rotate(-90deg)}.chev.closed.sc-sui-side-nav:dir(rtl){transform:rotate(90deg)}.sub-list.sc-sui-side-nav{list-style:none;margin:0;padding:0}.foot.sc-sui-side-nav{border-top:1px solid var(--sn-hair);display:flex;align-items:center;gap:10px;padding-block:9px;padding-inline:16px 10px}.foot-slot.sc-sui-side-nav{flex:1;min-width:0;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.rail.collapsed.sc-sui-side-nav .foot.sc-sui-side-nav{flex-direction:column;gap:8px;padding:9px 0}.rail.collapsed.sc-sui-side-nav .foot-slot.sc-sui-side-nav{flex:none;justify-content:center}.ctl.sc-sui-side-nav{width:var(--control-sm);height:var(--control-sm);flex-shrink:0;border:none;border-radius:var(--radius-md);padding:0;background:transparent;color:var(--sn-quiet);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.ctl.sc-sui-side-nav .sui-glyph.sc-sui-side-nav{font-size:11px}.ctl.sc-sui-side-nav .sui-glyph.sc-sui-side-nav:dir(rtl){transform:scaleX(-1)}.ctl.sc-sui-side-nav:hover{background:var(--sn-wash);color:var(--sn-ink)}.ctl.sc-sui-side-nav:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.tip.sc-sui-side-nav{position:fixed;transform:translateY(-50%);z-index:var(--z-tooltip);white-space:nowrap;background:var(--surface-raised);color:var(--ink);border:1px solid var(--border);font-size:11px;font-weight:620;padding:5px 9px;border-radius:6px;box-shadow:var(--shadow-pop);pointer-events:none}.tip.sc-sui-side-nav:dir(rtl){transform:translate(-100%, -50%)}.fly.sc-sui-side-nav{position:fixed;z-index:var(--z-dropdown);min-width:200px;max-width:280px;box-sizing:border-box;padding:4px 0 6px;background:var(--sn-ground);color:var(--sn-ink);border:1px solid var(--sn-hair);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);font-family:var(--font-sans);animation:sui-side-nav-in var(--duration-fast) var(--ease-out)}.fly.surface.sc-sui-side-nav,.fly.canvas.sc-sui-side-nav{border-color:var(--border)}.fly.closing.sc-sui-side-nav{animation:sui-side-nav-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}.fly.sc-sui-side-nav .heading.sc-sui-side-nav{padding-top:9px}@keyframes sui-side-nav-in{from{opacity:0}}@keyframes sui-side-nav-out{to{opacity:0}}@media (forced-colors: active){.rail.sc-sui-side-nav,.fly.sc-sui-side-nav{border:1px solid CanvasText}.rail.flush.sc-sui-side-nav{border-width:0;border-inline-end-width:1px}.rule.sc-sui-side-nav{background:CanvasText}.item.on.sc-sui-side-nav{forced-color-adjust:none;background:Highlight;color:HighlightText}a.item.on.sc-sui-side-nav,a.item.on.sc-sui-side-nav:hover,a.item.on.sc-sui-side-nav:visited{color:HighlightText}.item.sc-sui-side-nav:focus-visible{outline-color:CanvasText;box-shadow:none}.item.on.sc-sui-side-nav .icon.sc-sui-side-nav{color:HighlightText}.badge.sc-sui-side-nav{background:Canvas;color:CanvasText;border:1px solid CanvasText}.dot.sc-sui-side-nav{background:CanvasText}.item.on.sc-sui-side-nav .dot.sc-sui-side-nav{background:HighlightText}}`;
 
 const SuiSideNav = class {
     constructor(hostRef) {
@@ -240,7 +240,7 @@ const SuiSideNav = class {
         return this.active != null && this.kids(it).some((ch) => this.keyOf(ch) === this.active);
     }
     /** Opens the group holding the active item, so a page that routes straight to a child never draws
-     *  a rail with no active row. The load and `sections` passes are initialisation and stay quiet;
+     *  a rail with no active row. The load and `sections` passes are initialization and stay quiet;
      *  a later `active` move reports through `suiExpandedChange`. */
     openActiveGroup(report) {
         const owner = (this.sections || [])
@@ -430,7 +430,7 @@ const SuiSideNav = class {
         const label = c
             ? locale.localeText(undefined, 'side-nav.expandNavigation', undefined, 'Expand navigation')
             : locale.localeText(undefined, 'side-nav.collapseNavigation', undefined, 'Collapse navigation');
-        return (index.h(index.Host, { key: '8f3f6b52b684bd790935408772ab3fef80c43d46', class: { flush: this.variant === 'flush' }, style: this.height != null ? { height: `${this.height}px` } : undefined }, index.h("div", { key: 'a813bb1c38e1656f9cde6b60c96c835cae098c15', class: { rail: true, collapsed: c, brand: tone === 'brand', surface: tone === 'surface', canvas: tone === 'canvas', flush: this.variant === 'flush' }, style: size != null ? { width: `${size}px` } : undefined }, showBrand ? (index.h("div", { class: "brand-row" }, this.hasIcon ? index.h("span", { class: "mark" }, index.h("slot", { name: "icon" })) : null, !c && this.hasBrand ? index.h("span", { class: "word" }, index.h("slot", { name: "brand" })) : null)) : null, showHeader ? (index.h("div", { class: "head-slot" }, c ? index.h("slot", { name: "header-collapsed" }) : index.h("slot", { name: "header" }))) : null, index.h("nav", { key: '6fba41edce6b46b00ae12ac18dde5a4f7098c863', class: { scroll: true, 'has-bottom': foot >= 0 }, id: navId, "data-scroll": tone === 'brand' ? 'navy' : null, "aria-label": this.hostLabel || locale.localeText(undefined, 'side-nav.primary', undefined, 'Primary') }, list.map((sec, si) => (index.h("div", { class: { section: true, push: foot === si } }, si > 0 && (sec.divider || (!!sec.heading && c)) ? index.h("div", { class: "rule" }) : null, sec.heading && !c ? index.h("div", { class: "heading" }, sec.heading) : null, index.h("ul", { class: "list" }, (sec.items || []).map((it, ii) => this.renderItem(it, false, `${this.fieldId}-g${si}-${ii}`))))))), showFooter || control ? (index.h("div", { class: "foot" }, showFooter ? (index.h("div", { class: "foot-slot", key: "foot-slot" }, c ? index.h("slot", { name: "footer-collapsed" }) : index.h("slot", { name: "footer" }))) : null, control ? (index.h("button", { type: "button", class: "ctl", key: "collapse", "aria-label": label, "aria-expanded": c ? 'false' : 'true', "aria-controls": navId, onClick: () => this.setCollapsed(!c), onMouseEnter: (e) => this.showTip(e, label), onMouseLeave: this.hideTip, onFocus: (e) => this.showTip(e, label), onBlur: this.hideTip }, index.h(glyphs.Glyph, { glyph: c ? glyphs.anglesRight : glyphs.anglesLeft }))) : null)) : null), c && this.tip ? (index.h("span", { class: "tip", role: "presentation", style: { left: `${this.tip.x}px`, top: `${this.tip.y}px` } }, this.tip.label)) : null, this.fly ? (index.h("div", { class: { fly: true, closing: this.flyClosing, brand: tone === 'brand', surface: tone === 'surface', canvas: tone === 'canvas' }, id: `${this.fieldId}-fly`, ref: (el) => (this.flyPanel = el), onKeyDown: this.onFlyKey }, index.h("div", { class: "heading" }, this.fly.label), index.h("ul", { class: "list" }, this.kids(this.fly).map((ch) => this.renderItem(ch, false, undefined, true))))) : null));
+        return (index.h(index.Host, { key: '16b2629bb9eb89ddd61ba200d8da1aff615b7c4b', class: { flush: this.variant === 'flush' }, style: this.height != null ? { height: `${this.height}px` } : undefined }, index.h("div", { key: 'e871e5ad05ab29c50244703bf336140db92014c5', class: { rail: true, collapsed: c, brand: tone === 'brand', surface: tone === 'surface', canvas: tone === 'canvas', flush: this.variant === 'flush' }, style: size != null ? { width: `${size}px` } : undefined }, showBrand ? (index.h("div", { class: "brand-row" }, this.hasIcon ? index.h("span", { class: "mark" }, index.h("slot", { name: "icon" })) : null, !c && this.hasBrand ? index.h("span", { class: "word" }, index.h("slot", { name: "brand" })) : null)) : null, showHeader ? (index.h("div", { class: "head-slot" }, c ? index.h("slot", { name: "header-collapsed" }) : index.h("slot", { name: "header" }))) : null, index.h("nav", { key: 'ccea0536de10f80dc7a76ef1108f86b284a942ac', class: { scroll: true, 'has-bottom': foot >= 0 }, id: navId, "data-scroll": tone === 'brand' ? 'navy' : null, "aria-label": this.hostLabel || locale.localeText(undefined, 'side-nav.primary', undefined, 'Primary') }, list.map((sec, si) => (index.h("div", { class: { section: true, push: foot === si } }, si > 0 && (sec.divider || (!!sec.heading && c)) ? index.h("div", { class: "rule" }) : null, sec.heading && !c ? index.h("div", { class: "heading" }, sec.heading) : null, index.h("ul", { class: "list" }, (sec.items || []).map((it, ii) => this.renderItem(it, false, `${this.fieldId}-g${si}-${ii}`))))))), showFooter || control ? (index.h("div", { class: "foot" }, showFooter ? (index.h("div", { class: "foot-slot", key: "foot-slot" }, c ? index.h("slot", { name: "footer-collapsed" }) : index.h("slot", { name: "footer" }))) : null, control ? (index.h("button", { type: "button", class: "ctl", key: "collapse", "aria-label": label, "aria-expanded": c ? 'false' : 'true', "aria-controls": navId, onClick: () => this.setCollapsed(!c), onMouseEnter: (e) => this.showTip(e, label), onMouseLeave: this.hideTip, onFocus: (e) => this.showTip(e, label), onBlur: this.hideTip }, index.h(glyphs.Glyph, { glyph: c ? glyphs.anglesRight : glyphs.anglesLeft }))) : null)) : null), c && this.tip ? (index.h("span", { class: "tip", role: "presentation", style: { left: `${this.tip.x}px`, top: `${this.tip.y}px` } }, this.tip.label)) : null, this.fly ? (index.h("div", { class: { fly: true, closing: this.flyClosing, brand: tone === 'brand', surface: tone === 'surface', canvas: tone === 'canvas' }, id: `${this.fieldId}-fly`, ref: (el) => (this.flyPanel = el), onKeyDown: this.onFlyKey }, index.h("div", { class: "heading" }, this.fly.label), index.h("ul", { class: "list" }, this.kids(this.fly).map((ch) => this.renderItem(ch, false, undefined, true))))) : null));
     }
     static get watchers() { return {
         "sections": [{

package/dist/cjs/sui-skeleton-card.cjs.entry.js

@@ -13,7 +13,7 @@ const SuiSkeletonCard = class {
      *  of cards; see `sui-skeleton`. */
     animation = 'wave';
     render() {
-        return (index.h(index.Host, { key: 'fc0e0e51f435b81b903cf4f2c13fb56e738f075a', "aria-hidden": "true" }, index.h("div", { key: '693aeabe2c1619e7e34c16d8479e811909539ab4', class: "head" }, index.h("sui-skeleton", { key: '17a37729368b77cbbc4c699d9e404eb4eea24c57', shape: "circle", animation: this.animation }), index.h("div", { key: 'bad001d493bf6868330b79877bdc104b9da0c046', class: "titles" }, index.h("sui-skeleton", { key: 'c7aea9cece4a48f1a941b864622b1fc13b8b8794', shape: "title", width: "55%", animation: this.animation }), index.h("sui-skeleton", { key: '14a910a25e3cd6fa02c27263af20ac322ea19916', width: "35%", animation: this.animation }))), index.h("div", { key: '7eef67f9b4aaade85547f30708d48ef35b779747', class: "lines" }, index.h("sui-skeleton", { key: '0703e289179c1aa69fa2460123eb87a6cf25cb74', animation: this.animation }), index.h("sui-skeleton", { key: '161fca0562110a8eca8236bf078c81dc530118fe', width: "88%", animation: this.animation }), index.h("sui-skeleton", { key: 'fae05b61a74733eaaea3878a0e6af3e89e0da6a7', width: "62%", animation: this.animation }))));
+        return (index.h(index.Host, { key: '0c8b4d548822a419276bc08781bbf0d5b0c025ed', "aria-hidden": "true" }, index.h("div", { key: '302b6d8997b04d738d50879eeacfada18c215e6c', class: "head" }, index.h("sui-skeleton", { key: '51e5817ecb935abe16338d2763839a67485eb5c0', shape: "circle", animation: this.animation }), index.h("div", { key: 'c22de1c1361dab18b641d94775f45c3652098a73', class: "titles" }, index.h("sui-skeleton", { key: '7e867fabca19489ff1be797b9eecb6cae3981bf2', shape: "title", width: "55%", animation: this.animation }), index.h("sui-skeleton", { key: '3b9834becaeed495e1bf602041cdd5db2402766b', width: "35%", animation: this.animation }))), index.h("div", { key: 'ef3d8248eaa8e51d59e9dc60b1d51678f22d0487', class: "lines" }, index.h("sui-skeleton", { key: '097dcb1d91db47eb81de8d4c01d4ba04f71ad20a', animation: this.animation }), index.h("sui-skeleton", { key: '31bf568ca26782af3f7932b69a8f5b6a0cef2092', width: "88%", animation: this.animation }), index.h("sui-skeleton", { key: '6914722e0e9d31b2d39e735b7e3906ddf47fac00', width: "62%", animation: this.animation }))));
     }
 };
 SuiSkeletonCard.style = suiSkeletonCardCss();

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

@@ -35,7 +35,7 @@ const SuiSkeleton = class {
         const d = DEFAULTS[this.shape] || DEFAULTS.text;
         const width = len(this.width) || d.width;
         const height = len(this.height) || (this.shape === 'circle' ? len(this.width) : undefined) || d.height;
-        return index.h(index.Host, { key: '9eebc3140ff49c1f16bef16710d81ae7e3795c30', "aria-hidden": "true", style: { width, height, borderRadius: d.radius } });
+        return index.h(index.Host, { key: '2791580a991b2557f57d19f5e01b2d29b9fab85a', "aria-hidden": "true", style: { width, height, borderRadius: d.radius } });
     }
 };
 SuiSkeleton.style = suiSkeletonCss();

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

@@ -1,14 +1,14 @@
 '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 format = require('./format-BOushIZn.js');
+var format = require('./format-C_36FFqb.js');
 var direction = require('./direction-BaE_rqNY.js');
 var locale = require('./locale-EVD23NSt.js');
 var formDisabled = require('./form-disabled-wss8T3bH.js');
-require('./glyphs-8uuUhG6s.js');
+require('./glyphs-BNG4Wolq.js');
 
 const suiSliderCss = () => `.sc-sui-slider-h{display:block;font-family:var(--font-sans)}[orientation='vertical'].sc-sui-slider-h{display:inline-block;height:180px}[orientation='vertical'].sc-sui-slider-h .sui-field.sc-sui-slider{height:100%}[orientation='vertical'].sc-sui-slider-h .sui-slider.sc-sui-slider{flex:1 1 auto;min-height:0}.sui-slider.sc-sui-slider{display:flex;flex-direction:column;gap:8px}.head.sc-sui-slider{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.label.sc-sui-slider{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.readout.sc-sui-slider{font-size:12.5px;font-weight:650;color:var(--ink-muted);font-feature-settings:'tnum';white-space:nowrap}.figure.sc-sui-slider{direction:ltr;unicode-bidi:plaintext}.track.sc-sui-slider{position:relative;height:16px;cursor:pointer;touch-action:none}.read-only.sc-sui-slider .track.sc-sui-slider,.read-only.sc-sui-slider .handle.sc-sui-slider{cursor:default}.disabled.sc-sui-slider .track.sc-sui-slider{cursor:not-allowed}.rail.sc-sui-slider,.fill.sc-sui-slider{position:absolute;top:50%;transform:translateY(-50%);height:4px;border-radius:2px}.rail.sc-sui-slider{left:0;right:0;background:var(--brand-soft)}.fill.sc-sui-slider{background:var(--brand)}.disabled.sc-sui-slider .fill.sc-sui-slider{background:var(--border-strong)}.empty.sc-sui-slider .fill.sc-sui-slider{visibility:hidden}.handle.sc-sui-slider{position:absolute;top:50%;margin-inline-start:-8px;transform:translateY(-50%);box-sizing:border-box;width:16px;height:16px;border-radius:50%;--sui-slider-tint:var(--brand);--sui-slider-lift:0 1px 3px color-mix(in srgb, var(--sui-slider-tint) 25%, transparent);background:var(--surface);border:2px solid var(--sui-slider-tint);box-shadow:var(--sui-slider-lift);cursor:grab;touch-action:none}.handle.dragging.sc-sui-slider{cursor:grabbing}.handle.sc-sui-slider:hover{box-shadow:var(--sui-slider-lift), 0 0 0 6px var(--surface-hover)}.handle.sc-sui-slider:active,.handle.dragging.sc-sui-slider{box-shadow:var(--sui-slider-lift), 0 0 0 6px var(--surface-pressed)}.handle.sc-sui-slider:focus{outline:none}.handle.sc-sui-slider:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.invalid.sc-sui-slider:not(.disabled) .rail.sc-sui-slider{background:var(--danger-soft)}.invalid.sc-sui-slider:not(.disabled) .fill.sc-sui-slider{background:var(--danger)}.invalid.sc-sui-slider:not(.disabled) .handle.sc-sui-slider{--sui-slider-tint:var(--danger)}.invalid.sc-sui-slider .handle.sc-sui-slider:focus-visible{outline-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent)}.disabled.sc-sui-slider .handle.sc-sui-slider{border-color:var(--border-strong);cursor:not-allowed}.disabled.sc-sui-slider .handle.sc-sui-slider:hover,.read-only.sc-sui-slider .handle.sc-sui-slider:hover{box-shadow:var(--sui-slider-lift)}.vertical.sc-sui-slider{align-items:center}.vertical.sc-sui-slider .head.sc-sui-slider,.vertical.sc-sui-slider .foot.sc-sui-slider{flex:none;justify-content:center}.vertical.sc-sui-slider .track.sc-sui-slider{flex:1 1 auto;height:auto;width:16px;min-height:48px}.vertical.sc-sui-slider .rail.sc-sui-slider,.vertical.sc-sui-slider .fill.sc-sui-slider{top:auto;left:50%;transform:translateX(-50%);width:4px;height:auto}.vertical.sc-sui-slider .rail.sc-sui-slider{top:0;bottom:0}.vertical.sc-sui-slider .handle.sc-sui-slider{top:auto;left:50%;margin-inline-start:0;transform:translate(-50%, 50%)}@media (forced-colors: active){.rail.sc-sui-slider{box-sizing:border-box;border:1px solid CanvasText}.fill.sc-sui-slider,.invalid.sc-sui-slider:not(.disabled) .fill.sc-sui-slider{background:Highlight}.handle.sc-sui-slider{background:ButtonText;border-color:ButtonText}.disabled.sc-sui-slider .fill.sc-sui-slider{background:GrayText}.disabled.sc-sui-slider .handle.sc-sui-slider{background:GrayText;border-color:GrayText}.disabled.sc-sui-slider .label.sc-sui-slider,.disabled.sc-sui-slider .readout.sc-sui-slider{color:GrayText}}`;
 
@@ -350,13 +350,13 @@ const SuiSlider = class {
         const hi = this.range ? this.pct(rhi) : this.empty ? 0 : this.pct(this.one);
         // Each figure is isolated, so a negative value keeps its sign in front under dir="rtl" and a
         // range still reads low to high in the track's direction.
-        const fig = (v) => index.h("span", { key: 'f9066101fe8150af393c3a15bbb4ede8863100ff', class: "figure" }, this.fmt(v));
+        const fig = (v) => index.h("span", { key: 'f2234063bf300aa93bfba689f1dd64dd378f92d4', class: "figure" }, this.fmt(v));
         const readout = this.empty ? null : this.range ? [fig(rlo), ' – ', fig(rhi)] : fig(this.one);
         const vertical = this.vertical;
         const fillStyle = vertical
             ? { bottom: `${lo}%`, height: `${Math.max(0, hi - lo)}%` }
             : { insetInlineStart: `${lo}%`, width: `${Math.max(0, hi - lo)}%` };
-        return (index.h(fieldShell.FieldShell, { key: '5169112e51bad8494823f224b7a6b48673dec4db', help: this.help, error: this.error, descId: this.fieldId }, index.h("div", { key: 'e93bf6e823bb8328e49ac414bee70bdbe67cd795', class: { 'sui-slider': true, disabled: this.isDisabled, 'read-only': this.readOnly, invalid: !!this.error, range: this.range, vertical, empty: this.empty } }, this.label || (this.showValue && !vertical) ? (index.h("div", { class: "head" }, index.h("span", { class: "label" }, this.label, this.label && this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null), this.showValue && !vertical ? index.h("span", { class: "readout" }, readout) : null)) : null, index.h("div", { key: 'beacc31bf345d9e8b043d8866b54920348cd7c67', ref: (el) => (this.track = el), class: "track", onPointerDown: this.onTrackDown }, index.h("div", { key: 'c801f5052c4c7bb2cfa0df7a9caf72e9cae9c5f5', class: "rail" }), index.h("div", { key: '9f11ac6a3ca4b31207d66d4870219e20e758778b', class: "fill", style: fillStyle }), this.range ? [this.renderHandle(rlo, 0), this.renderHandle(rhi, 1)] : this.renderHandle(this.one, 0)), vertical && this.showValue ? index.h("div", { class: "foot" }, index.h("span", { class: "readout" }, readout)) : null)));
+        return (index.h(fieldShell.FieldShell, { key: '38901a2efc3e1def330e8b665f42d053742cfd0e', help: this.help, error: this.error, descId: this.fieldId }, index.h("div", { key: '657b5db8dc5081158d6f8caabb905dd6903d203c', class: { 'sui-slider': true, disabled: this.isDisabled, 'read-only': this.readOnly, invalid: !!this.error, range: this.range, vertical, empty: this.empty } }, this.label || (this.showValue && !vertical) ? (index.h("div", { class: "head" }, index.h("span", { class: "label" }, this.label, this.label && this.required ? index.h("span", { class: "sui-field-req", "aria-hidden": "true" }, "*") : null), this.showValue && !vertical ? index.h("span", { class: "readout" }, readout) : null)) : null, index.h("div", { key: 'd5e525c5760ccd32112508a8dd6655764a362a0e', ref: (el) => (this.track = el), class: "track", onPointerDown: this.onTrackDown }, index.h("div", { key: 'ac96a6b31831cdb35bd37728f529a51b2aece8b5', class: "rail" }), index.h("div", { key: 'f1450666108aaf93441d948327226d0397ffd562', class: "fill", style: fillStyle }), this.range ? [this.renderHandle(rlo, 0), this.renderHandle(rhi, 1)] : this.renderHandle(this.one, 0)), vertical && this.showValue ? index.h("div", { class: "foot" }, index.h("span", { class: "readout" }, readout)) : null)));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

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

@@ -1,8 +1,8 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var chartCore = require('./chart-core-B6gClUK8.js');
-var format = require('./format-BOushIZn.js');
+var chartCore = require('./chart-core-BJy3KjtK.js');
+var format = require('./format-C_36FFqb.js');
 require('./locale-EVD23NSt.js');
 
 const suiSparklineCss = () => `.sc-sui-sparkline-h{display:inline-block;line-height:0;vertical-align:bottom}.spark.sc-sui-sparkline{display:block;overflow:visible}@media (forced-colors: active){.spark.sc-sui-sparkline polyline.sc-sui-sparkline{stroke:CanvasText}.spark.sc-sui-sparkline circle.sc-sui-sparkline{fill:CanvasText}}`;

package/dist/cjs/sui-speed-dial.cjs.entry.js

@@ -1,15 +1,15 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var aria = require('./aria-DXFt0vvU.js');
+var aria = require('./aria-DsLSiGlA.js');
 var formControl = require('./form-control-CvMyyCaa.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var focus = require('./focus-DRuLpXAC.js');
 var id = require('./id-Ca7UTKW6.js');
 var locale = require('./locale-EVD23NSt.js');
 var direction = require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiSpeedDialCss = () => `.sc-sui-speed-dial-h{position:relative;display:inline-block;vertical-align:middle;font-family:var(--font-sans)}.dial.sc-sui-speed-dial{position:relative;display:flex;flex-direction:column;align-items:center}.sats.sc-sui-speed-dial{position:absolute;left:50%;transform:translateX(-50%);z-index:var(--z-dropdown);display:flex;flex-direction:column-reverse;align-items:center;gap:10px;bottom:calc(100% + 10px)}.dial.down.sc-sui-speed-dial .sats.sc-sui-speed-dial{top:calc(100% + 10px);bottom:auto;flex-direction:column}.dial.left.sc-sui-speed-dial .sats.sc-sui-speed-dial,.dial.right.sc-sui-speed-dial .sats.sc-sui-speed-dial{left:auto;bottom:auto;top:50%;transform:translateY(-50%);flex-direction:row;align-items:center}.dial.left.sc-sui-speed-dial .sats.sc-sui-speed-dial{right:calc(100% + 10px);flex-direction:row-reverse}.dial.right.sc-sui-speed-dial .sats.sc-sui-speed-dial{left:calc(100% + 10px)}.launcher.sc-sui-speed-dial{width:48px;height:48px;padding:0;margin:0;border:none;border-radius:50%;cursor:pointer;background:var(--accent);color:var(--accent-contrast);box-shadow:var(--shadow-pop);display:flex;align-items:center;justify-content:center;transition:transform var(--duration-base) var(--ease-out), background var(--duration-fast) var(--ease-out)}.launcher.sc-sui-speed-dial i.sc-sui-speed-dial{font-size:17px}.dial.open.spin.sc-sui-speed-dial .launcher.sc-sui-speed-dial{transform:rotate(45deg)}.launcher.sc-sui-speed-dial:hover{background:var(--accent-hover)}.launcher.sc-sui-speed-dial:active{background:var(--accent-active)}.launcher.sc-sui-speed-dial:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.launcher.sc-sui-speed-dial:disabled,.sat.sc-sui-speed-dial:disabled{background:var(--disabled-bg);color:var(--disabled-ink);cursor:not-allowed;box-shadow:none}.launcher.sc-sui-speed-dial:disabled:hover,.sat.sc-sui-speed-dial:disabled:hover{background:var(--disabled-bg)}.sat-wrap.sc-sui-speed-dial{position:relative;display:flex;align-items:center;animation:sui-speed-dial-in var(--duration-overlay) var(--ease-out)}.dial.down.sc-sui-speed-dial .sat-wrap.sc-sui-speed-dial{animation-name:sui-speed-dial-in-down}.dial.left.sc-sui-speed-dial .sat-wrap.sc-sui-speed-dial{animation-name:sui-speed-dial-in-left}.dial.right.sc-sui-speed-dial .sat-wrap.sc-sui-speed-dial{animation-name:sui-speed-dial-in-right}.sats.closing.sc-sui-speed-dial{pointer-events:none}.sats.closing.sc-sui-speed-dial .sat-wrap.sc-sui-speed-dial{animation:sui-speed-dial-out var(--duration-fast) var(--ease-out) forwards}.sat.sc-sui-speed-dial{width:40px;height:40px;padding:0;margin:0;border:none;border-radius:50%;cursor:pointer;background:var(--brand);color:var(--brand-contrast);box-shadow:var(--shadow-raised);display:flex;align-items:center;justify-content:center;transition:background var(--duration-fast) var(--ease-out)}.sat.sc-sui-speed-dial i.sc-sui-speed-dial{font-size:14px}.sat.sc-sui-speed-dial:hover,.sat.sc-sui-speed-dial:focus-visible{background:var(--brand-hover)}.sat.sc-sui-speed-dial:active{background:var(--brand-active)}.sat.sc-sui-speed-dial:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.cap.sc-sui-speed-dial{display:none;position:absolute;inset-inline-end:calc(100% + 10px);white-space:nowrap;background:var(--brand);color:var(--brand-contrast);font-size:11.5px;font-weight:620;padding:5px 9px;border-radius:var(--radius-sm);box-shadow:var(--shadow-pop);pointer-events:none}.sat.sc-sui-speed-dial:hover+.cap.sc-sui-speed-dial,.sat.sc-sui-speed-dial:focus-visible+.cap.sc-sui-speed-dial{display:inline-block}.dial.left.sc-sui-speed-dial .cap.sc-sui-speed-dial,.dial.right.sc-sui-speed-dial .cap.sc-sui-speed-dial{inset-inline:auto;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%)}@keyframes sui-speed-dial-in{from{opacity:0;transform:translateY(4px)}}@keyframes sui-speed-dial-in-down{from{opacity:0;transform:translateY(-4px)}}@keyframes sui-speed-dial-in-left{from{opacity:0;transform:translateX(4px)}}@keyframes sui-speed-dial-in-right{from{opacity:0;transform:translateX(-4px)}}@keyframes sui-speed-dial-out{to{opacity:0}}@media (forced-colors: active){.launcher.sc-sui-speed-dial,.sat.sc-sui-speed-dial{border:1px solid ButtonText}.launcher.sc-sui-speed-dial:disabled,.sat.sc-sui-speed-dial:disabled{border-color:GrayText}.cap.sc-sui-speed-dial{border:1px solid CanvasText}}`;
 
@@ -45,7 +45,7 @@ const SuiSpeedDial = class {
      */
     iconOpen;
     /** Where the satellites fan out from the launcher. The first item is always the one nearest the
-     *  launcher. An unrecognised value falls back to `up`. */
+     *  launcher. An unrecognized value falls back to `up`. */
     direction = 'up';
     /**
      * Fanned out. Mutable: the launcher toggles it, and Escape, an outside pointer, Tabbing out and
@@ -82,7 +82,7 @@ const SuiSpeedDial = class {
     exit = overlay.overlayExit(() => (this.closing = false));
     pendingFocus;
     get fanned() { return this.open && !this.disabled; }
-    /** The direction actually drawn: an unrecognised value falls back to the documented default. */
+    /** The direction actually drawn: an unrecognized value falls back to the documented default. */
     get fanDirection() { return DIRECTIONS.includes(this.direction) ? this.direction : 'up'; }
     connectedCallback() {
         formControl.delegateFocus(this.host, () => this.launcher);
@@ -285,7 +285,7 @@ const SuiSpeedDial = class {
         const satsId = `${this.fieldId}-sats`;
         const items = this.items || [];
         const fanned = this.fanned;
-        return (index.h(index.Host, { key: '2c711bb8eb7c2750533f559fc1bf398c3460ec98' }, index.h("div", { key: '67f6c7608034bbf70deddd8defef5a0fe59ef343', class: { dial: true, [direction]: true, open: fanned, spin: !this.iconOpen }, onKeyDown: this.onKeyDown, onFocusout: this.onFocusOut }, index.h("button", { key: '20b049f9d25e1210a37d900b24909d833fa7d8ba', ref: (el) => (this.launcher = el), type: "button", class: "launcher", disabled: this.disabled, "aria-label": name, "aria-expanded": fanned ? 'true' : 'false', "aria-controls": fanned ? satsId : null, onClick: this.toggle }, index.h("i", { key: 'b389f0cd5bad14f2bfb766bc79b1aa9e47396732', class: fanned && this.iconOpen ? this.iconOpen : this.icon, "aria-hidden": "true" })), fanned || this.closing ? (index.h("div", { class: { sats: true, closing: this.closing }, inert: this.closing, id: satsId, role: "group", "aria-label": name, ref: (el) => (this.satsEl = el) }, items.map((it, i) => (index.h("div", { class: "sat-wrap", key: i }, index.h("button", { type: "button", class: "sat", disabled: this.disabled || !!it.disabled, "aria-label": it.label || locale.localeFormat(undefined, 'speed-dial.action', undefined, 'Action {n}', { n: i + 1 }), onClick: () => this.pick(it) }, index.h("i", { class: it.icon, "aria-hidden": "true" })), it.label ? index.h("span", { class: "cap", "aria-hidden": "true" }, it.label) : null))))) : null)));
+        return (index.h(index.Host, { key: '049709302f2b68fa4e2a94259d077b5f77cd37ec' }, index.h("div", { key: '27404c8506c31124c983c99dcb916e4e1c0080cc', class: { dial: true, [direction]: true, open: fanned, spin: !this.iconOpen }, onKeyDown: this.onKeyDown, onFocusout: this.onFocusOut }, index.h("button", { key: '21a53903f4dc8e1a3670ac15f3c178947a51b479', ref: (el) => (this.launcher = el), type: "button", class: "launcher", disabled: this.disabled, "aria-label": name, "aria-expanded": fanned ? 'true' : 'false', "aria-controls": fanned ? satsId : null, onClick: this.toggle }, index.h("i", { key: 'ed24963a9341f2c0174b2b52b7a3a2abf9984f4b', class: fanned && this.iconOpen ? this.iconOpen : this.icon, "aria-hidden": "true" })), fanned || this.closing ? (index.h("div", { class: { sats: true, closing: this.closing }, inert: this.closing, id: satsId, role: "group", "aria-label": name, ref: (el) => (this.satsEl = el) }, items.map((it, i) => (index.h("div", { class: "sat-wrap", key: i }, index.h("button", { type: "button", class: "sat", disabled: this.disabled || !!it.disabled, "aria-label": it.label || locale.localeFormat(undefined, 'speed-dial.action', undefined, 'Action {n}', { n: i + 1 }), onClick: () => this.pick(it) }, index.h("i", { class: it.icon, "aria-hidden": "true" })), it.label ? index.h("span", { class: "cap", "aria-hidden": "true" }, it.label) : null))))) : null)));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/sui-split-button.cjs.entry.js

@@ -1,17 +1,17 @@
 'use strict';
 
 var index = require('./index-BtWzlhN3.js');
-var menuList = require('./menu-list--7y_0m8t.js');
-var glyphs = require('./glyphs-8uuUhG6s.js');
-var overlay = require('./overlay-DcMtiB1L.js');
+var menuList = require('./menu-list-CIuBU-4o.js');
+var glyphs = require('./glyphs-BNG4Wolq.js');
+var overlay = require('./overlay-CsoWlGY8.js');
 var focus = require('./focus-DRuLpXAC.js');
-var menuTab = require('./menu-tab-DipN-4R9.js');
+var menuTab = require('./menu-tab-Y485zCZm.js');
 var id = require('./id-Ca7UTKW6.js');
 var formControl = require('./form-control-CvMyyCaa.js');
 var locale = require('./locale-EVD23NSt.js');
 var direction = require('./direction-BaE_rqNY.js');
 require('./focus-trap-CcyiWkvv.js');
-require('./motion-BaUBY31j.js');
+require('./motion-D8mcyZVH.js');
 
 const suiSplitButtonCss = () => `.sc-sui-split-button-h{display:inline-block;vertical-align:middle;font-family:var(--font-sans)}.split.sc-sui-split-button{display:inline-flex;align-items:stretch;position:relative}.main.sc-sui-split-button{position:relative;z-index:0;--sui-button-radius:var(--radius-md) 0 0 var(--radius-md);--sui-button-hover-border:color-mix(in srgb, var(--ink) 30%, var(--control-border))}.main.sc-sui-split-button:dir(rtl){--sui-button-radius:0 var(--radius-md) var(--radius-md) 0}.main.sc-sui-split-button:focus-within{z-index:2}.chev.sc-sui-split-button{position:relative;z-index:1;box-sizing:border-box;margin:0;padding:0 9px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:0;border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md);font-family:var(--font-sans);line-height:1;cursor:pointer;user-select:none;transition:background var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.chev.sc-sui-split-button::before{content:'';position:absolute;top:-1px;bottom:-1px;inset-inline-start:0;width:1px;background:color-mix(in srgb, var(--brand) 18%, transparent)}.chev.sc-sui-split-button:hover:not(:disabled)::before,.chev.sc-sui-split-button:active:not(:disabled)::before{background:transparent}.chev.sc-sui-split-button .sui-glyph.sc-sui-split-button{font-size:10px}.chev.sc-sui-split-button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow);z-index:2}.chev.sm.sc-sui-split-button{height:var(--control-sm)}.chev.md.sc-sui-split-button{height:var(--control-md)}.chev.lg.sc-sui-split-button{height:var(--control-lg)}.chev.accent.sc-sui-split-button{background:var(--accent);color:var(--accent-contrast)}.chev.accent.sc-sui-split-button:hover:not(:disabled){background:var(--accent-hover)}.chev.accent.sc-sui-split-button:active:not(:disabled){background:var(--accent-active)}.chev.brand.sc-sui-split-button{background:var(--brand);color:var(--brand-contrast)}.chev.brand.sc-sui-split-button:hover:not(:disabled){background:var(--brand-hover)}.chev.brand.sc-sui-split-button:not(:disabled)::before{background:var(--border-inverse)}.chev.brand.sc-sui-split-button:active:not(:disabled){background:var(--brand-active)}.chev.outline.sc-sui-split-button{background:var(--surface);color:var(--ink);border-color:var(--control-border);border-left-width:0;background-clip:padding-box}.chev.outline.sc-sui-split-button:hover:not(:disabled){background:var(--brand-soft)}.chev.outline.sc-sui-split-button:active:not(:disabled){background:color-mix(in srgb, var(--brand-soft) 84%, var(--ink))}.chev.outline.sc-sui-split-button::before{content:none}.chev.outline.sc-sui-split-button:disabled:not(.loading)::before{content:'';background:var(--border)}.chev.sc-sui-split-button:disabled:not(.loading){cursor:not-allowed;color:var(--disabled-ink);border-color:transparent;background:var(--disabled-bg)}.chev.outline.sc-sui-split-button:disabled:not(.loading){background:var(--surface);border-color:var(--border);border-left-width:0}.chev.loading.sc-sui-split-button{cursor:progress}.panel.sc-sui-split-button{position:fixed;top:0;left:0;z-index:var(--z-dropdown);box-sizing:border-box;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);animation:sui-split-in var(--duration-overlay) var(--ease-out)}.panel[data-side='top'].sc-sui-split-button{animation-name:sui-split-in-top}.panel.closing.sc-sui-split-button{animation:sui-split-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-split-in{from{opacity:0;transform:translateY(-4px)}}@keyframes sui-split-in-top{from{opacity:0;transform:translateY(4px)}}@keyframes sui-split-out{to{opacity:0}}`;
 
@@ -293,7 +293,7 @@ const SuiSplitButton = class {
         const menuName = this.label
             ? locale.localeFormat(undefined, 'split-button.optionsFor', undefined, '{label} options', { label: this.label })
             : locale.localeText(undefined, 'split-button.moreActions', undefined, 'More actions');
-        return (index.h(index.Host, { key: '619b2d055700221a8e1e0036cf6107fe5f89cd35' }, index.h("div", { key: 'cd02c7ac4de03c0285c3c38306a70bb4b9220d9d', ref: (el) => (this.control = el), class: "split", onKeyDown: this.onControlKey }, index.h("sui-button", { key: 'bf8e84c64ae4b2a0362582fb6aef743c3c1f2dfd', class: "main", variant: variant, size: size, label: this.label, icon: this.icon, disabled: this.disabled, loading: this.loading, type: this.type, form: this.form, name: this.name, value: this.value }), index.h("button", { key: 'cf5a14df8fcb41eea22f00f285797288a8df99c7', ref: (el) => (this.chev = el), type: "button", class: { chev: true, [variant]: true, [size]: true, loading: this.loading }, disabled: inert, "aria-label": menuName, "aria-haspopup": "menu", "aria-expanded": this.menuOpen ? 'true' : 'false', "aria-controls": this.menuOpen ? menuId : null, onClick: this.toggle }, index.h(glyphs.Glyph, { key: '7d922bf64fadd4c0edb533bddbfb8608bd108db3', glyph: glyphs.chevronDown }))), this.menuOpen || this.closing ? (index.h("div", { ref: (el) => (this.panel = el), id: menuId, class: { panel: true, closing: this.closing }, inert: this.closing, onClick: this.stopClick }, index.h(menuList.MenuList, { items: this.items, width: this.menuWidth, activeIndex: this.active, idBase: this.fieldId, ariaLabel: menuName, menuRef: (el) => (this.menu = el), onPick: this.pick, onHover: (i) => (this.active = i), onLeave: () => (this.active = -1), onKeyDown: this.onMenuKey }))) : null));
+        return (index.h(index.Host, { key: 'cdd5e546552e655c615952f9342965468bb5d807' }, index.h("div", { key: '642d2459b7a2b3e3f6b50dc5ef383cee46c918df', ref: (el) => (this.control = el), class: "split", onKeyDown: this.onControlKey }, index.h("sui-button", { key: '82d45a4d11c2bfdb2bba5dda30391c3d4ad0b521', class: "main", variant: variant, size: size, label: this.label, icon: this.icon, disabled: this.disabled, loading: this.loading, type: this.type, form: this.form, name: this.name, value: this.value }), index.h("button", { key: '350ef9a36246b917b8d752bfac3090b4b37259a7', ref: (el) => (this.chev = el), type: "button", class: { chev: true, [variant]: true, [size]: true, loading: this.loading }, disabled: inert, "aria-label": menuName, "aria-haspopup": "menu", "aria-expanded": this.menuOpen ? 'true' : 'false', "aria-controls": this.menuOpen ? menuId : null, onClick: this.toggle }, index.h(glyphs.Glyph, { key: 'b30e906434528be5597b5be790bcf65870e9ecb6', glyph: glyphs.chevronDown }))), this.menuOpen || this.closing ? (index.h("div", { ref: (el) => (this.panel = el), id: menuId, class: { panel: true, closing: this.closing }, inert: this.closing, onClick: this.stopClick }, index.h(menuList.MenuList, { items: this.items, width: this.menuWidth, activeIndex: this.active, idBase: this.fieldId, ariaLabel: menuName, menuRef: (el) => (this.menu = el), onPick: this.pick, onHover: (i) => (this.active = i), onLeave: () => (this.active = -1), onKeyDown: this.onMenuKey }))) : null));
     }
     static get watchers() { return {
         "disabled": [{