@threadlabs/looma 0.1.23 → 0.1.25

package/dist/{ui-popover.entry-ZQQB4N6E.js → ui-popover.entry-ZOEQMUWG.js}

@@ -1,6 +1,3 @@
-import {
-  dispatchDetail
-} from "./chunk-UL7UIUJZ.js";
 import {
   closeOverlay,
   openOverlay,
@@ -9,15 +6,22 @@ import {
 import {
   createAnchoredSurface
 } from "./chunk-YHXJC5M5.js";
+import {
+  controlledOrDefault,
+  isControlled
+} from "./chunk-HNFCGIBP.js";
+import {
+  dispatchDetail
+} from "./chunk-UL7UIUJZ.js";
 import {
   Host,
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-popover.entry.js
-var uiPopoverCss = () => `:host{--ui-popover-viewport-gap:var(--ui-space-2, 0.5rem);padding:var(--ui-space-3);background:var(--ui-surface-elevated);border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3);box-shadow:var(--ui-shadow-lg);max-inline-size:min(     20rem,     calc(100vw - (var(--ui-popover-viewport-gap) * 2))   );max-block-size:calc(100dvh - (var(--ui-popover-viewport-gap) * 2));overflow:auto}:host(:not([data-open])){display:none}:host([popover]){position:fixed;inset:auto;margin:0;opacity:0;transform:translateY(-4px) scale(0.99);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease),     transform var(--ui-motion-fast) var(--ui-motion-ease),     display var(--ui-motion-fast) allow-discrete,     overlay var(--ui-motion-fast) allow-discrete}:host([popover]:popover-open){opacity:1;transform:translateY(0) scale(1)}@starting-style{:host([popover]:popover-open){opacity:0;transform:translateY(-4px) scale(0.99)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host([popover]){transition:none}}`;
+var uiPopoverCss = () => `:host{--ui-popover-viewport-gap:var(--ui-space-2, 0.5rem);box-sizing:border-box;max-inline-size:min(     20rem,     calc(100vw - (var(--ui-popover-viewport-gap) * 2))   );max-block-size:calc(100dvh - (var(--ui-popover-viewport-gap) * 2));overflow:auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:var(--ui-shadow-lg)}.popover__surface{box-sizing:border-box;padding:var(--ui-space-3);background:var(--ui-surface-elevated);border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3)}:host(:not([data-open])){display:none}:host([popover]){position:fixed;inset:auto;margin:0;opacity:0;transform:translateY(-4px) scale(0.99);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease),     transform var(--ui-motion-fast) var(--ui-motion-ease),     display var(--ui-motion-fast) allow-discrete,     overlay var(--ui-motion-fast) allow-discrete}:host([popover]:popover-open){opacity:1;transform:translateY(0) scale(1)}@starting-style{:host([popover]:popover-open){opacity:0;transform:translateY(-4px) scale(0.99)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host([popover]){transition:none}}`;
 var UIPopover = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -25,7 +29,8 @@ var UIPopover = class {
   get host() {
     return getElement(this);
   }
-  open = false;
+  /** Controlled open state. Omit it to use defaultOpen and local interaction state. */
+  open;
   defaultOpen = false;
   /** Optional id of the element this popover follows in the top layer. */
   for;
@@ -35,7 +40,8 @@ var UIPopover = class {
   anchor = null;
   surface = null;
   syncFromProp() {
-    this.internalOpen = this.open;
+    if (isControlled(this.open))
+      this.internalOpen = this.open;
   }
   onOpenChange() {
     this.syncOverlay();
@@ -92,8 +98,7 @@ var UIPopover = class {
     }
   }
   componentDidLoad() {
-    this.syncFromProp();
-    this.internalOpen = this.internalOpen || this.defaultOpen;
+    this.internalOpen = controlledOrDefault(this.open, this.defaultOpen);
     this.host.addEventListener("keydown", this.onKeydown);
     this.setupSurface();
     this.syncOverlay();
@@ -108,7 +113,8 @@ var UIPopover = class {
     this.syncOverlay();
   }
   handleRequestClose(reason, trigger) {
-    this.internalOpen = false;
+    if (!isControlled(this.open))
+      this.internalOpen = false;
     dispatchDetail(this.host, "close", {
       open: false,
       reason,
@@ -121,7 +127,7 @@ var UIPopover = class {
     }
   };
   render() {
-    return h(Host, { key: "cd957cb9fd5d1c05da7729a16d4cb229bc1deffa", "data-open": this.internalOpen ? "" : void 0, onKeyDown: this.onKeydown }, h("slot", { key: "d14960a1471948120f7173e18adae8d86e4fabb7" }));
+    return h(Host, { key: "a4986ace0f3c586774a549cb844287b28ccd0531", "data-open": this.internalOpen ? "" : void 0, onKeyDown: this.onKeydown }, h("div", { key: "8f2c589916d06138ef72bfe0d039893b3c59a7cc", class: "popover__surface" }, h("slot", { key: "ee70e7dcc53a99b5c80e56862a6eb00edcfcf912" })));
   }
   static get watchers() {
     return {

package/dist/{ui-radio-group.entry-V7PCTS7I.js → ui-radio-group.entry-QCQ46EK5.js}

@@ -7,7 +7,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-radio-group.entry.js
 var uiRadioGroupCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2)}:host([data-orientation='vertical']){display:inline-grid;justify-items:start}`;
@@ -114,7 +114,7 @@ var UIRadioGroup = class {
     }
   };
   render() {
-    return h(Host, { key: "e80e01600d499d1b8e3410060433dac2bb8cf38a", role: "radiogroup", "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? "" : void 0 }, h("slot", { key: "e60dcfa1b174b1a4c9092567e6ec4d9f5bcd9ffe" }));
+    return h(Host, { key: "1882ad7c092c6a138eab2a52c19beb9a950a8d5a", role: "radiogroup", "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? "" : void 0 }, h("slot", { key: "d5abade3d23963410cfbac17e80aa16dd21ccc6e" }));
   }
   static get watchers() {
     return {

package/dist/{ui-radio.entry-JYH6TQBI.js → ui-radio.entry-QAATWUYT.js}

@@ -1,3 +1,7 @@
+import {
+  controlledOrDefault,
+  isControlled
+} from "./chunk-HNFCGIBP.js";
 import {
   dispatchDetail,
   eventToTrigger
@@ -7,7 +11,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-radio.entry.js
 var uiRadioCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2);color:var(--ui-text-primary)}:host([data-disabled='true']),:host([aria-disabled='true']){opacity:0.6;cursor:not-allowed}::slotted(input[type='radio']){accent-color:var(--ui-accent-solid);cursor:pointer}::slotted(input[type='radio']:focus-visible){outline:2px solid var(--ui-accent-solid);outline-offset:2px}`;
@@ -18,28 +22,32 @@ var UIRadio = class {
   get host() {
     return getElement(this);
   }
-  checked = false;
+  /** Controlled checked state. Omit it to use defaultChecked and local interaction state. */
+  checked;
   defaultChecked = false;
   disabled = false;
   name = "";
   required = false;
   value = "on";
+  internalChecked = false;
   slotRef;
+  syncFromProp() {
+    if (isControlled(this.checked))
+      this.internalChecked = this.checked;
+  }
   syncToInput() {
     const input = this.getInput();
     if (!input)
       return;
     this.host.toggleAttribute("data-disabled", this.disabled);
-    input.checked = this.checked;
+    input.checked = this.internalChecked;
     input.disabled = this.disabled;
     input.name = this.name;
     input.required = this.required;
     input.value = this.value;
   }
   componentDidLoad() {
-    if (!this.checked && this.defaultChecked) {
-      this.checked = true;
-    }
+    this.internalChecked = controlledOrDefault(this.checked, this.defaultChecked);
     this.slotRef?.addEventListener("slotchange", () => this.syncToInput());
     this.syncToInput();
     const input = this.getInput();
@@ -61,6 +69,10 @@ var UIRadio = class {
     const input = e.target;
     if (!input || !input.checked)
       return;
+    if (!isControlled(this.checked))
+      this.internalChecked = true;
+    else
+      this.syncToInput();
     dispatchDetail(this.host, "change", {
       checked: true,
       value: this.value,
@@ -68,12 +80,12 @@ var UIRadio = class {
     });
   };
   render() {
-    return h(Host, { key: "898869b84429366e43c075723e884f34da6fc6df", role: "radio", "aria-checked": String(this.checked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? "" : void 0 }, h("slot", { key: "3f3b881175f25d439807ec9f8f0dd59a1acd6a90", ref: (el) => this.slotRef = el }));
+    return h(Host, { key: "f4700b43790accd29a6bcc55fcc862072e29c335", role: "radio", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? "" : void 0 }, h("slot", { key: "ed32c35f8f68c662a8b95e58b74c8c76c959ea49", ref: (el) => this.slotRef = el }));
   }
   static get watchers() {
     return {
       "checked": [{
-        "syncToInput": 0
+        "syncFromProp": 0
       }],
       "disabled": [{
         "syncToInput": 0

package/dist/{ui-search-result-row.entry-JBNYXXUN.js → ui-search-result-row.entry-2I3DH2OT.js}

@@ -2,7 +2,7 @@ import {
   Host,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-search-result-row.entry.js
 var uiSearchResultRowCss = () => `:host{display:block}.search-result-row{appearance:none;inline-size:100%;min-block-size:var(--ui-search-result-row-min-height, 56px);margin:0;padding-block:var(--ui-search-result-row-padding-block, var(--ui-space-3, 0.75rem));padding-inline:var(--ui-search-result-row-padding-inline, var(--ui-space-4, 1rem));display:flex;align-items:flex-start;gap:var(--ui-search-result-row-gap, var(--ui-space-3, 0.75rem));background:var(--ui-search-result-row-bg, transparent);border:none;border-block-end:1px solid var(--ui-search-result-row-border, var(--ui-border, #e5e7eb));color:inherit;cursor:pointer;text-align:left;transition:background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease)}:host(:last-child) .search-result-row{border-block-end:none}.search-result-row:hover:enabled{background:var(--ui-search-result-row-hover-bg, color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%))}:host([selected]) .search-result-row{background:var(     --ui-search-result-row-selected-bg,     var(--ui-search-result-row-hover-bg, color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%))   )}.search-result-row:focus-visible{outline:2px solid var(--ui-focus-ring, #2563eb);outline-offset:-2px}.search-result-row:disabled,:host([disabled]) .search-result-row{opacity:0.6;cursor:not-allowed}.search-result-row__leading,.search-result-row__trailing{display:inline-flex;align-items:flex-start;flex-shrink:0}.search-result-row__content{min-inline-size:0;flex:1;display:flex;flex-direction:column}.search-result-row__title,.search-result-row__meta,.search-result-row__excerpt{display:block;min-inline-size:0}[hidden]{display:none}::slotted([slot='title']),::slotted([slot='meta']),::slotted([slot='excerpt']){display:block;margin:0}`;
@@ -41,7 +41,7 @@ var UISearchResultRow = class {
     this.hasTrailing = slotHasContent(this.trailingSlot);
   };
   render() {
-    return h(Host, { key: "8ef897782b50f1ecb129a51a25631d3d2bafe1e3" }, h("button", { key: "5b4fb4ac4968551a191e80bde7b991391d931220", class: "search-result-row", type: "button", disabled: this.disabled, part: "button" }, h("span", { key: "5f5988d87bcf754d8a521e19e0e2a490dd868bd2", class: "search-result-row__leading", part: "leading", hidden: !this.hasLeading }, h("slot", { key: "a7671c75c28d71ab843dcbb1fcdd9f4d0e0f7361", name: "leading", ref: (el) => this.leadingSlot = el, onSlotchange: this.syncSlots })), h("span", { key: "4ed60057e10ade9d7771812ad28aa25a017d34d8", class: "search-result-row__content", part: "content" }, h("span", { key: "37fa74ef4980ffd0b576ff824532d1267420461c", class: "search-result-row__title", part: "title" }, h("slot", { key: "187df950b39702723fa456b09e220e2b7587f00a", name: "title" })), h("span", { key: "6d2476c57d7c9c7530c3796a723f47f5f4859d71", class: "search-result-row__meta", part: "meta", hidden: !this.hasMeta }, h("slot", { key: "d53329dd6865bbda005b0d25a2b9bc7b7a597452", name: "meta", ref: (el) => this.metaSlot = el, onSlotchange: this.syncSlots })), h("span", { key: "8846c9669c0f65a739b770f41a93ddd4bef3f6bd", class: "search-result-row__excerpt", part: "excerpt", hidden: !this.hasExcerpt }, h("slot", { key: "b63f70371538901aaff481a9e524bf817883cee6", name: "excerpt", ref: (el) => this.excerptSlot = el, onSlotchange: this.syncSlots }))), h("span", { key: "1e8f94c3d83c3f649595c2843522b0973590a8d5", class: "search-result-row__trailing", part: "trailing", hidden: !this.hasTrailing }, h("slot", { key: "cfba9301ad97c1130a01f78c16052fc26e249f4b", name: "trailing", ref: (el) => this.trailingSlot = el, onSlotchange: this.syncSlots }))));
+    return h(Host, { key: "eeda041dbcf8841cd53be9c532df208eb3be3d3b" }, h("button", { key: "71d3db6d2eca4f8d7796429f68ef73bf2c7b62f7", class: "search-result-row", type: "button", disabled: this.disabled, part: "button" }, h("span", { key: "f2260cab9f654e7f5e96a5e7e2a1cbbb5a55fde3", class: "search-result-row__leading", part: "leading", hidden: !this.hasLeading }, h("slot", { key: "824fffc19c2b5712dae0c000f12cc36a0043a370", name: "leading", ref: (el) => this.leadingSlot = el, onSlotchange: this.syncSlots })), h("span", { key: "4e3728ea7d363f256f1b3283df6eb984cf3f570f", class: "search-result-row__content", part: "content" }, h("span", { key: "95009b1ce569fb4251df62334a5dd88f1de561af", class: "search-result-row__title", part: "title" }, h("slot", { key: "132beecf36471ae0db68d686829428225699c534", name: "title" })), h("span", { key: "0ad7c8d52aa40ccf62667d3ecca4d48b49917a9a", class: "search-result-row__meta", part: "meta", hidden: !this.hasMeta }, h("slot", { key: "4b97129504571a676839287bd87e68d803f8bc99", name: "meta", ref: (el) => this.metaSlot = el, onSlotchange: this.syncSlots })), h("span", { key: "e6c73e653fb7dc213866a15870281f3f6d95a86b", class: "search-result-row__excerpt", part: "excerpt", hidden: !this.hasExcerpt }, h("slot", { key: "49deae8194485304380b8b4b3d4fe96cd6623f4d", name: "excerpt", ref: (el) => this.excerptSlot = el, onSlotchange: this.syncSlots }))), h("span", { key: "c7c6f0b57668644a28d3c4c981b4db79a0e3c42a", class: "search-result-row__trailing", part: "trailing", hidden: !this.hasTrailing }, h("slot", { key: "e6cbceeb41d23c9b7514f53663438069499d1a4d", name: "trailing", ref: (el) => this.trailingSlot = el, onSlotchange: this.syncSlots }))));
   }
 };
 UISearchResultRow.style = uiSearchResultRowCss();

package/dist/{ui-search-shell.entry-TEAWE76O.js → ui-search-shell.entry-7RS55ORF.js}

@@ -1,7 +1,7 @@
 import {
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-search-shell.entry.js
 var uiSearchShellCss = () => `:host{position:fixed;inset:0;z-index:var(--ui-search-shell-z-index, 400);display:block}.search-shell{position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:center;padding-block-start:var(--ui-search-shell-padding-top, 10vh)}.search-shell__panel{position:relative;inline-size:min(     calc(100% - (var(--ui-search-shell-margin-inline, var(--ui-space-4, 1rem)) * 2)),     var(--ui-search-shell-max-width, 640px)   );max-block-size:var(--ui-search-shell-max-height, 80vh);display:flex;flex-direction:column;overflow:hidden;background:var(--ui-search-shell-bg, var(--ui-surface, #ffffff));border:1px solid var(--ui-search-shell-border, var(--ui-border, #e5e7eb));border-radius:var(--ui-search-shell-radius, var(--ui-radius-xl, 1rem));box-shadow:var(--ui-search-shell-shadow, var(--ui-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12)))}.search-shell__search,.search-shell__status,.search-shell__footer{flex-shrink:0}.search-shell__body{flex:1;min-block-size:0}[hidden]{display:none}@media (max-width: 767px){.search-shell{padding-block-start:0;align-items:stretch}.search-shell__panel{inline-size:100%;block-size:100vh;block-size:100dvh;max-block-size:none;border-radius:0;border-inline:none;border-block-start:none}}`;
@@ -32,7 +32,7 @@ var UISearchShell = class {
     this.hasFooter = slotHasContent(this.footerSlot);
   };
   render() {
-    return h("div", { key: "2a09e1ee81d04c0af5420887a9fa0dfb8057040c", class: "search-shell", part: "base" }, h("slot", { key: "9124af2e3e73b686a73b11c7fe8c9d40986e98c1", name: "backdrop" }), h("div", { key: "cec39a8cbbfe99b7bbeb37ce32655a88cee2bec3", class: "search-shell__panel", part: "panel" }, h("div", { key: "8168eda720e031daf350800ac48dcf445be0c417", class: "search-shell__search", part: "search" }, h("slot", { key: "b220c9670a6a53cd93fa434dc97dc9d2582bec08", name: "search" })), h("div", { key: "24386da67dd8ab5e865519e5b0b70fe9c8924010", class: "search-shell__status", part: "status", hidden: !this.hasStatus }, h("slot", { key: "7a0dfada13aca3275961667dadc9623729fbf644", name: "status", ref: (el) => this.statusSlot = el, onSlotchange: this.syncSlots })), h("div", { key: "e06b7da6219c7a71d69662c5bdcc24e6baa52aa9", class: "search-shell__body", part: "body" }, h("slot", { key: "fabdea16cf443b57a826fc748b24342ff214b918", name: "body" })), h("div", { key: "d38662a77f19fd59315b1882cda0a55680cc5a0b", class: "search-shell__footer", part: "footer", hidden: !this.hasFooter }, h("slot", { key: "56eb386e22ae033939cdbdf3c6b6edf68594ceb5", name: "footer", ref: (el) => this.footerSlot = el, onSlotchange: this.syncSlots }))));
+    return h("div", { key: "ae5baf1fae88f3c0ff8c98e68e1c31d7f19d7b6a", class: "search-shell", part: "base" }, h("slot", { key: "192d10867902bc4618762ab3ce1ca8a44229ec11", name: "backdrop" }), h("div", { key: "72bafd3ba7aadebcb011fb27f56793a9079bb2e1", class: "search-shell__panel", part: "panel" }, h("div", { key: "c2d46c9099699cc1c2f357cb51d11ab0e6cf6c69", class: "search-shell__search", part: "search" }, h("slot", { key: "21f4ed690247fa794bd9322c75cee1721926087a", name: "search" })), h("div", { key: "84baba674456aa2a5878d5858d0e6531251440ce", class: "search-shell__status", part: "status", hidden: !this.hasStatus }, h("slot", { key: "6e7b6533a29231ebbcd41529d8120649ca4a1dd1", name: "status", ref: (el) => this.statusSlot = el, onSlotchange: this.syncSlots })), h("div", { key: "710d51d450132ad0f528b2eb2cd6f0312dbced2f", class: "search-shell__body", part: "body" }, h("slot", { key: "2c380ff4ad33ead6ca8c2611ebc024f125f0da48", name: "body" })), h("div", { key: "6923984a31c7bc23bae3ecee08d7acad14703a02", class: "search-shell__footer", part: "footer", hidden: !this.hasFooter }, h("slot", { key: "57c2eab7a3f46558ada8d1aa70d64f434bb8cdd6", name: "footer", ref: (el) => this.footerSlot = el, onSlotchange: this.syncSlots }))));
   }
 };
 UISearchShell.style = uiSearchShellCss();

package/dist/{ui-select.entry-F3A6TE2U.js → ui-select.entry-6O4KD4G7.js}

@@ -7,7 +7,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-select.entry.js
 var uiSelectCss = () => `:host{display:inline-flex;min-inline-size:0;color:var(--ui-text-primary)}::slotted(select){width:100%;appearance:none;min-block-size:var(--ui-control-min-block-size, 2.75rem);border:1px solid var(--ui-control-border, var(--ui-border-default));border-radius:var(--ui-radius-2);background-color:var(--ui-control-surface, var(--ui-surface-default));color:inherit;font:inherit;line-height:var(--ui-line-height-md);padding-block:var(--ui-select-padding-block, var(--ui-space-2));padding-inline-start:var(--ui-select-padding-inline-start, var(--ui-space-3));padding-inline-end:var(--ui-select-padding-inline-end, calc(var(--ui-space-6) + var(--ui-space-3)));margin:0;background-image:linear-gradient(45deg, transparent 50%, currentColor 50%),     linear-gradient(135deg, currentColor 50%, transparent 50%);background-position:calc(100% - 1rem) calc(50% - 2px),     calc(100% - 0.7rem) calc(50% - 2px);background-size:0.35rem 0.35rem, 0.35rem 0.35rem;background-repeat:no-repeat;transition:border-color var(--ui-motion-fast) var(--ui-motion-ease),     box-shadow var(--ui-motion-fast) var(--ui-motion-ease),     background-color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(select:hover:not(:focus):not(:disabled)){border-color:var(--ui-control-border-hover, var(--ui-border-strong))}::slotted(select:focus){border-color:var(--ui-control-focus, var(--ui-focus-ring));box-shadow:0 0 0 3px var(--ui-control-focus-halo, var(--ui-accent-soft))}:host([data-invalid='true'])::slotted(select),::slotted(select[aria-invalid='true']){border-color:var(--ui-accent-active)}::slotted(select:disabled){background-color:var(--ui-control-surface-disabled, var(--ui-surface-muted));color:var(--ui-text-muted);cursor:not-allowed}::slotted(select:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(select[multiple]),::slotted(select[size]:not([size='1'])){background-image:none;padding-inline-end:var(--ui-select-padding-inline-start, var(--ui-space-3))}`;
@@ -86,7 +86,7 @@ var UISelect = class {
     });
   };
   render() {
-    return h(Host, { key: "5ac54353f467b70e94fce0ae661dc86c305befe7", "data-invalid": this.invalid ? "" : void 0 }, h("slot", { key: "1386f3e4912720ab597f4567112e9c8b4166bcc6", ref: (el) => this.slotRef = el }));
+    return h(Host, { key: "74cbe4a76a23af415c202c61951ad513b0ed6cb8", "data-invalid": this.invalid ? "" : void 0 }, h("slot", { key: "e86eb0cfb0d379cb3f8b2ea5ce3c69639d0cdda4", ref: (el) => this.slotRef = el }));
   }
   static get watchers() {
     return {

package/dist/{ui-switch.entry-MJIICMP2.js → ui-switch.entry-DY5PSHCQ.js}

@@ -1,3 +1,7 @@
+import {
+  controlledOrDefault,
+  isControlled
+} from "./chunk-HNFCGIBP.js";
 import {
   dispatchDetail
 } from "./chunk-UL7UIUJZ.js";
@@ -6,7 +10,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-switch.entry.js
 var uiSwitchCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2);color:var(--ui-text-primary)}:host([aria-disabled='true']),:host([data-disabled='true']){opacity:0.6;cursor:not-allowed}:host([role='switch']){cursor:pointer}:host input[type='checkbox']{appearance:none;-webkit-appearance:none;display:block;position:relative;width:2.25rem;height:1.25rem;padding:0;border:1px solid var(--ui-border-default);border-radius:999px;background:var(--ui-surface-muted);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease),     border-color var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host input[type='checkbox']::after{content:'';position:absolute;top:2px;left:2px;width:0.875rem;height:0.875rem;border-radius:999px;background:var(--ui-surface-default);border:1px solid var(--ui-border-default);transition:transform var(--ui-motion-fast) var(--ui-motion-ease)}:host input[type='checkbox']:checked{background:var(--ui-accent-solid);border-color:var(--ui-accent-solid)}:host input[type='checkbox']:checked::after{transform:translateX(calc(2.25rem - 0.875rem - 4px));background:var(--ui-text-on-accent);border-color:var(--ui-text-on-accent)}:host input[type='checkbox']:focus-visible{outline:2px solid var(--ui-accent-solid);outline-offset:2px}`;
@@ -17,25 +21,28 @@ var UISwitch = class {
   get host() {
     return getElement(this);
   }
-  checked = false;
+  /** Controlled checked state. Omit it to use defaultChecked and local interaction state. */
+  checked;
   defaultChecked = false;
   disabled = false;
   required = false;
   value = "on";
   internalChecked = false;
   syncFromProp() {
-    this.internalChecked = this.checked;
+    if (isControlled(this.checked))
+      this.internalChecked = this.checked;
   }
   componentDidLoad() {
-    this.syncFromProp();
-    this.internalChecked = this.internalChecked || this.defaultChecked;
+    this.internalChecked = controlledOrDefault(this.checked, this.defaultChecked);
   }
   toggle = (trigger) => {
     if (this.disabled)
       return;
-    this.internalChecked = !this.internalChecked;
+    const checked = !this.internalChecked;
+    if (!isControlled(this.checked))
+      this.internalChecked = checked;
     dispatchDetail(this.host, "change", {
-      checked: this.internalChecked,
+      checked,
       value: this.value,
       trigger
     });
@@ -52,14 +59,19 @@ var UISwitch = class {
     this.toggle("pointer");
   };
   render() {
-    return h(Host, { key: "14205d2856f8fb49b72d69d40f10ac1473a80c04", role: "switch", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? "" : void 0, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.onKeydown, onClick: this.onClick }, h("input", { key: "974f8e487c8bf9196c05420e1817139dd6b4138c", type: "checkbox", checked: this.internalChecked, disabled: this.disabled, required: this.required, value: this.value, "aria-hidden": "true", tabIndex: -1, onChange: (e) => {
-      this.internalChecked = e.target.checked;
+    return h(Host, { key: "a37ded5259d71a57308cba6dd158ae4ae81e4e8b", role: "switch", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? "" : void 0, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.onKeydown, onClick: this.onClick }, h("input", { key: "882f81f39d752430f1de1554a5d83176416f4617", type: "checkbox", checked: this.internalChecked, disabled: this.disabled, required: this.required, value: this.value, "aria-hidden": "true", tabIndex: -1, onChange: (e) => {
+      const input = e.target;
+      const checked = input.checked;
+      if (!isControlled(this.checked))
+        this.internalChecked = checked;
       dispatchDetail(this.host, "change", {
-        checked: this.internalChecked,
+        checked,
         value: this.value,
         trigger: "pointer"
       });
-    } }), h("slot", { key: "d1cd89aa2d5312cff8845364cdee64821977cb44" }));
+      if (isControlled(this.checked))
+        input.checked = this.internalChecked;
+    } }), h("slot", { key: "b3b2b5afae622d1ae79cadd84f60c6b6c2df55a4" }));
   }
   static get watchers() {
     return {

package/dist/{ui-tabs.entry-6REFIUHV.js → ui-tabs.entry-6X56UOUE.js}

@@ -1,3 +1,7 @@
+import {
+  controlledOrDefault,
+  isControlled
+} from "./chunk-HNFCGIBP.js";
 import {
   dispatchDetail,
   eventToTrigger
@@ -7,7 +11,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-tabs.entry.js
 var uiTabsCss = () => `:host{display:flex;flex-direction:column;gap:0}:host([data-orientation='vertical']){flex-direction:row}::slotted([role='tablist']){display:flex;gap:0;max-inline-size:100%;overflow-x:auto;overscroll-behavior-inline:contain;border-bottom:1px solid var(--ui-border-default)}:host([data-orientation='vertical']) ::slotted([role='tablist']){flex-direction:column;border-bottom:none;border-inline-end:1px solid var(--ui-border-default)}::slotted(button[role='tab']),::slotted([role='tab']),::slotted(ui-button) button[role='tab']{padding:var(--ui-space-2) var(--ui-space-3);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-medium, 500);color:var(--ui-text-secondary);background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;transition:color var(--ui-motion-fast) var(--ui-motion-ease);box-shadow:none}::slotted(button[role='tab']:hover),::slotted([role='tab']:hover){color:var(--ui-text-primary)}::slotted(button[role='tab'][aria-selected='true']),::slotted([role='tab'][aria-selected='true']){color:var(--ui-accent-solid);border-bottom-color:var(--ui-accent-solid)}:host([data-orientation='vertical']) ::slotted(button[role='tab']),:host([data-orientation='vertical']) ::slotted([role='tab']){border-bottom:none;border-inline-end:2px solid transparent;margin-bottom:0;margin-inline-end:-1px}:host([data-orientation='vertical']) ::slotted(button[role='tab'][aria-selected='true']),:host([data-orientation='vertical']) ::slotted([role='tab'][aria-selected='true']){border-inline-end-color:var(--ui-accent-solid)}::slotted([role='tabpanel']){padding:var(--ui-space-4)}`;
@@ -18,12 +22,14 @@ var UITabs = class {
   get host() {
     return getElement(this);
   }
-  value = "";
+  /** Controlled selected tab value. Omit it to use defaultValue and local interaction state. */
+  value;
   defaultValue = "";
   orientation = "horizontal";
   internalValue = "";
   syncFromProp() {
-    this.internalValue = this.value;
+    if (isControlled(this.value))
+      this.internalValue = this.value;
   }
   syncState() {
     const tabs = this.getTabs();
@@ -44,11 +50,8 @@ var UITabs = class {
     });
   }
   componentDidLoad() {
-    this.syncFromProp();
-    if (!this.internalValue && this.defaultValue) {
-      this.internalValue = this.defaultValue;
-    }
-    if (!this.internalValue) {
+    this.internalValue = controlledOrDefault(this.value, this.defaultValue);
+    if (!isControlled(this.value) && !this.internalValue) {
       const tabs = this.getTabs();
       if (tabs.length > 0) {
         this.internalValue = tabs[0]?.id ?? tabs[0]?.getAttribute("aria-controls") ?? "";
@@ -73,7 +76,8 @@ var UITabs = class {
     if (!newValue)
       return;
     const prev = this.internalValue;
-    this.internalValue = newValue;
+    if (!isControlled(this.value))
+      this.internalValue = newValue;
     this.syncState();
     dispatchDetail(this.host, "select", { value: newValue, previousValue: prev || void 0, trigger });
   }
@@ -102,7 +106,7 @@ var UITabs = class {
     }
   };
   render() {
-    return h(Host, { key: "ca8671f06914de2bd6b412caf11e385d67ae722b", orientation: this.orientation, "data-orientation": this.orientation }, h("slot", { key: "49beb3783c8f6a330d25164c82933c2bf6345b1e" }));
+    return h(Host, { key: "19207153c7b7a6ea5f5ffb50439e99af70984b44", orientation: this.orientation, "data-orientation": this.orientation }, h("slot", { key: "5045cd040eeccd028c00328206d47f7d17b622de" }));
   }
   static get watchers() {
     return {

package/dist/{ui-textarea.entry-OJTXCED7.js → ui-textarea.entry-RDYP6O77.js}

@@ -7,7 +7,7 @@ import {
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-textarea.entry.js
 var uiTextareaCss = () => `:host{display:inline-flex;min-inline-size:0;color:var(--ui-text-primary)}::slotted(textarea){width:100%;appearance:none;border:1px solid var(--ui-control-border, var(--ui-border-default));border-radius:var(--ui-radius-2);background:var(--ui-control-surface, var(--ui-surface-default));color:inherit;font:inherit;line-height:var(--ui-line-height-md);min-block-size:calc(var(--ui-space-12, 3rem) * 2);padding:var(--ui-space-2) var(--ui-space-3);margin:0;resize:vertical;transition:border-color var(--ui-motion-fast) var(--ui-motion-ease),     box-shadow var(--ui-motion-fast) var(--ui-motion-ease),     background-color var(--ui-motion-fast) var(--ui-motion-ease)}::slotted(textarea:hover:not(:focus):not(:disabled)){border-color:var(--ui-control-border-hover, var(--ui-border-strong))}::slotted(textarea:focus){border-color:var(--ui-control-focus, var(--ui-focus-ring));box-shadow:0 0 0 3px var(--ui-control-focus-halo, var(--ui-accent-soft))}:host([data-invalid='true'])::slotted(textarea),::slotted(textarea[aria-invalid='true']){border-color:var(--ui-accent-active)}::slotted(textarea:disabled){background:var(--ui-control-surface-disabled, var(--ui-surface-muted));color:var(--ui-text-muted);cursor:not-allowed}::slotted(textarea:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}`;
@@ -85,7 +85,7 @@ var UITextarea = class {
     });
   };
   render() {
-    return h(Host, { key: "9ccc0464bca55b3364645ea90df3890f9ed9d697", "data-invalid": this.invalid ? "" : void 0 }, h("slot", { key: "81c4df31064d4dcd2b2e27dfcf3141cc9f18f54e", ref: (el) => this.slotRef = el }));
+    return h(Host, { key: "020adfed4a177ef5d07852ff2e6ffb66b6f80742", "data-invalid": this.invalid ? "" : void 0 }, h("slot", { key: "2e9bd0e071e24fcf248eadf38f16484321359503", ref: (el) => this.slotRef = el }));
   }
   static get watchers() {
     return {

package/dist/{ui-toast-region.entry-NOFXLKPS.js → ui-toast-region.entry-EBY42KS5.js}

@@ -1,16 +1,16 @@
+import {
+  createViewportSurface
+} from "./chunk-YHXJC5M5.js";
 import {
   dispatchDetail,
   eventToTrigger
 } from "./chunk-UL7UIUJZ.js";
-import {
-  createViewportSurface
-} from "./chunk-YHXJC5M5.js";
 import {
   Host,
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-toast-region.entry.js
 var uiToastRegionCss = () => `:host{position:fixed;top:calc(var(--ui-space-4) + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:9999;display:grid;gap:var(--ui-space-2);inline-size:min(24rem, calc(100vw - (var(--ui-space-4) * 2)));max-inline-size:100%;pointer-events:none}:host([popover]){right:auto;bottom:auto;margin:0}:host>*{pointer-events:auto}::slotted([data-ui-toast]){display:grid;grid-template-columns:1fr auto;gap:var(--ui-space-2);align-items:start;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-3);padding:var(--ui-space-3) var(--ui-space-4);background:var(--ui-surface-elevated);color:var(--ui-text-primary);box-shadow:var(--ui-shadow-lg);animation:ui-toast-enter 0.25s var(--ui-motion-ease) forwards}@keyframes ui-toast-enter{from{opacity:0;transform:translateY(-0.5rem)}to{opacity:1;transform:translateY(0)}}::slotted([data-ui-toast][aria-hidden='true']){display:none}::slotted([data-ui-toast-dismiss]){border:0;background:transparent;color:var(--ui-text-secondary);cursor:pointer;font:inherit}`;
@@ -22,10 +22,12 @@ var UIToastRegion = class {
     return getElement(this);
   }
   open = true;
-  internalOpen = true;
+  internalOpen = false;
   surface = null;
+  contentObserver = null;
+  pendingDismiss = null;
   syncFromProp() {
-    this.internalOpen = this.open;
+    this.syncContents();
   }
   syncSurface() {
     if (this.internalOpen)
@@ -35,22 +37,37 @@ var UIToastRegion = class {
   }
   componentDidLoad() {
     this.surface = createViewportSurface(this.host);
-    this.syncFromProp();
+    this.contentObserver = new MutationObserver(this.syncContents);
+    this.contentObserver.observe(this.host, { childList: true, subtree: true });
+    this.syncContents();
     this.syncSurface();
     this.host.addEventListener("click", this.onClick);
   }
   disconnectedCallback() {
     this.host.removeEventListener("click", this.onClick);
+    this.contentObserver?.disconnect();
+    this.contentObserver = null;
     this.surface?.destroy();
     this.surface = null;
   }
   getToasts() {
     return Array.from(this.host.querySelectorAll("[data-ui-toast]"));
   }
-  updateOpenState() {
-    const toasts = this.getToasts();
-    this.internalOpen = toasts.length > 0;
-  }
+  syncContents = () => {
+    const nextOpen = this.open && this.getToasts().length > 0;
+    const wasOpen = this.internalOpen;
+    const completedDismiss = this.pendingDismiss && !this.host.contains(this.pendingDismiss.toast) ? this.pendingDismiss : null;
+    this.internalOpen = nextOpen;
+    if (wasOpen && !nextOpen && completedDismiss) {
+      dispatchDetail(this.host, "close", {
+        open: false,
+        reason: "action",
+        trigger: completedDismiss.trigger
+      });
+    }
+    if (completedDismiss || !this.open)
+      this.pendingDismiss = null;
+  };
   onClick = (e) => {
     const dismissBtn = e.target.closest?.("[data-ui-toast-dismiss]");
     if (!dismissBtn)
@@ -59,24 +76,16 @@ var UIToastRegion = class {
     if (!toast)
       return;
     const id = toast.id ?? "";
-    toast.setAttribute("aria-hidden", "true");
-    toast.remove();
+    const trigger = eventToTrigger(e);
+    this.pendingDismiss = { toast, trigger };
     dispatchDetail(this.host, "dismiss", {
       id,
       reason: "action",
-      trigger: eventToTrigger(e)
+      trigger
     });
-    this.updateOpenState();
-    if (this.getToasts().length === 0) {
-      dispatchDetail(this.host, "close", {
-        open: false,
-        reason: "action",
-        trigger: eventToTrigger(e)
-      });
-    }
   };
   render() {
-    return h(Host, { key: "9ec1cc51ecc4e7a256be5d89a09a10788e46db53", role: "region", "aria-label": "Notifications", "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "7b08656f3745a02f8e9f0935e47d6f2cffd88f9b" }));
+    return h(Host, { key: "8a3546bcd59e12f21393ea55fa4d232d3907a34e", role: "region", "aria-label": "Notifications", "aria-live": "polite", "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "a4a4525a1ca768d65ff36b3889a821b8dda8b6f7" }));
   }
   static get watchers() {
     return {

package/dist/{ui-tooltip.entry-COWTWVHX.js → ui-tooltip.entry-PLXMPOKV.js}

@@ -1,6 +1,3 @@
-import {
-  dispatchDetail
-} from "./chunk-UL7UIUJZ.js";
 import {
   closeOverlay,
   openOverlay
@@ -8,16 +5,23 @@ import {
 import {
   createAnchoredSurface
 } from "./chunk-YHXJC5M5.js";
+import {
+  controlledOrDefault,
+  isControlled
+} from "./chunk-HNFCGIBP.js";
+import {
+  dispatchDetail
+} from "./chunk-UL7UIUJZ.js";
 import {
   Host,
   createEvent,
   getElement,
   h,
   registerInstance
-} from "./chunk-GDMQKT5F.js";
+} from "./chunk-UY423IKN.js";
 
 // dist/esm/ui-tooltip.entry.js
-var uiTooltipCss = () => `:host{position:fixed;inset:auto;margin:0;display:inline-block;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-elevated);color:var(--ui-text-primary);padding:var(--ui-space-2) var(--ui-space-3);font-size:var(--ui-font-size-sm);box-shadow:var(--ui-shadow-md);opacity:0;transform:translateY(4px);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease),     transform var(--ui-motion-fast) var(--ui-motion-ease),     display var(--ui-motion-fast) allow-discrete,     overlay var(--ui-motion-fast) allow-discrete}:host(:popover-open){opacity:1;transform:translateY(0)}@starting-style{:host(:popover-open){opacity:0;transform:translateY(4px)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host{transition:none}}`;
+var uiTooltipCss = () => `:host{position:fixed;inset:auto;margin:0;display:inline-block;box-sizing:border-box;padding:0;border:0;border-radius:0;background:transparent;opacity:0;transform:translateY(4px);transition:opacity var(--ui-motion-fast) var(--ui-motion-ease),     transform var(--ui-motion-fast) var(--ui-motion-ease),     display var(--ui-motion-fast) allow-discrete,     overlay var(--ui-motion-fast) allow-discrete}.tooltip__surface{box-sizing:border-box;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-elevated);color:var(--ui-text-primary);padding:var(--ui-space-2) var(--ui-space-3);font-size:var(--ui-font-size-sm);box-shadow:var(--ui-shadow-md)}:host(:popover-open){opacity:1;transform:translateY(0)}@starting-style{:host(:popover-open){opacity:0;transform:translateY(4px)}}:host([hidden]){display:none !important}@media (prefers-reduced-motion: reduce){:host{transition:none}}`;
 var UITooltip = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -28,7 +32,8 @@ var UITooltip = class {
     return getElement(this);
   }
   for = "";
-  open = false;
+  /** Controlled open state. Omit it to use defaultOpen and local interaction state. */
+  open;
   defaultOpen = false;
   placement = "top-start";
   /** Pointer hover intent delay in milliseconds. Keyboard focus is immediate. */
@@ -49,7 +54,8 @@ var UITooltip = class {
   hideTimer = null;
   syncFromProp() {
     this.clearTimers();
-    this.internalOpen = this.open;
+    if (isControlled(this.open))
+      this.internalOpen = this.open;
   }
   resetSurface() {
     this.syncTrigger();
@@ -75,8 +81,7 @@ var UITooltip = class {
   componentDidLoad() {
     if (!this.host.id)
       this.host.id = this.overlayId;
-    this.syncFromProp();
-    this.internalOpen = this.internalOpen || this.defaultOpen;
+    this.internalOpen = controlledOrDefault(this.open, this.defaultOpen);
     this.syncTrigger();
     this.setupSurface();
     this.host.addEventListener("pointerenter", this.onSurfaceEnter);
@@ -159,7 +164,8 @@ var UITooltip = class {
   setInteractionOpen(nextOpen, trigger) {
     if (this.internalOpen === nextOpen)
       return;
-    this.internalOpen = nextOpen;
+    if (!isControlled(this.open))
+      this.internalOpen = nextOpen;
     dispatchDetail(this.host, nextOpen ? "open" : "close", {
       open: nextOpen,
       reason: "action",
@@ -216,7 +222,8 @@ var UITooltip = class {
     if (reason === "escape" || reason === "light-dismiss" && this.toggleOnClick) {
       this.pinned = false;
       this.clearTimers();
-      this.internalOpen = false;
+      if (!isControlled(this.open))
+        this.internalOpen = false;
       dispatchDetail(this.host, "close", {
         open: false,
         reason,
@@ -225,7 +232,7 @@ var UITooltip = class {
     }
   }
   render() {
-    return h(Host, { key: "b0199c23316a707ae3e1e7c361f2838872f62221", role: "tooltip", hidden: !this.internalOpen, "data-open": this.internalOpen ? "" : void 0 }, h("slot", { key: "d0c7822f2f47848a509bf8e310806edbdb320f02" }));
+    return h(Host, { key: "6c70f235889d6f1c425f0a51fcfc04e06a96dea4", role: "tooltip", hidden: !this.internalOpen, "data-open": this.internalOpen ? "" : void 0 }, h("div", { key: "5c4f1d264e32d308f5b26af4e967e13369c4238a", class: "tooltip__surface" }, h("slot", { key: "52b5900d67ffa7590b0ff97511f99718d2e8c311" })));
   }
   static get watchers() {
     return {