@vertz/ui-primitives 0.2.20 → 0.2.21

package/dist/shared/{chunk-ppcv3ehd.js → chunk-0gn67thm.js}

@@ -1,15 +1,15 @@
 import {
   setDataState
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/progress/progress.tsx
-import { __append, __element, __enterChildren, __exitChildren } from "@vertz/ui/internals";
+import { __append, __element, __enterChildren, __exitChildren, __styleStr } from "@vertz/ui/internals";
 import { ref, signal } from "@vertz/ui";
 function dataStateFor(pct) {
   if (pct >= 100)
@@ -18,12 +18,8 @@ function dataStateFor(pct) {
     return "loading";
   return "idle";
 }
-function ProgressRoot(options = {}) {
-  const { defaultValue = 0, min = 0, max = 100, ...attrs } = options;
-  const state = { value: signal(defaultValue) };
-  const indicatorRef = ref();
-  const initialPct = (defaultValue - min) / (max - min) * 100;
-  const root = (() => {
+function ProgressBar(defaultValue, min, max, initialPct, indicatorRef) {
+  return (() => {
     const __el0 = __element("div");
     __el0.setAttribute("role", "progressbar");
     {
@@ -59,13 +55,20 @@ function ProgressRoot(options = {}) {
       {
         const __v = `width: ${initialPct}%`;
         if (__v != null && __v !== false)
-          __el1.setAttribute("style", __v === true ? "" : __v);
+          __el1.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
       }
       return __el1;
     })());
     __exitChildren();
     return __el0;
   })();
+}
+function ProgressRoot(options = {}) {
+  const { defaultValue = 0, min = 0, max = 100, ...attrs } = options;
+  const state = { value: signal(defaultValue) };
+  const indicatorRef = ref();
+  const initialPct = (defaultValue - min) / (max - min) * 100;
+  const root = ProgressBar(defaultValue, min, max, initialPct, indicatorRef);
   const indicator = indicatorRef.current;
   applyAttrs(root, attrs);
   function setValue(val) {

package/dist/shared/{chunk-4da5zksy.js → chunk-1dzcjmfq.js}

@@ -1,9 +1,9 @@
 import {
   handleActivation
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-q8dm19a5.js";
 
 // src/button/button.tsx
 import { __element, __on } from "@vertz/ui/internals";

package/dist/shared/{chunk-avxcmmk6.js → chunk-1hv9yd28.js}

@@ -2,22 +2,22 @@ import {
   Keys,
   handleListNavigation,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setDataState,
   setExpanded,
   setHidden,
   setHiddenAnimated
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/accordion/accordion.tsx
-import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";
+import { __element, __enterChildren, __exitChildren, __insert, __on, __styleStr } from "@vertz/ui/internals";
 import { signal } from "@vertz/ui";
 function AccordionRoot(options = {}) {
   const { multiple = false, defaultValue = [], onValueChange, ...attrs } = options;
@@ -140,7 +140,7 @@ function AccordionRoot(options = {}) {
       {
         const __v = isOpen ? "" : "display: none";
         if (__v != null && __v !== false)
-          __el2.setAttribute("style", __v === true ? "" : __v);
+          __el2.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
       }
       return __el2;
     })();

package/dist/shared/{chunk-kg27s15c.js → chunk-2d05qxdw.js}

@@ -8,7 +8,7 @@ import {
   Keys,
   handleListNavigation,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setDataState,
   setExpanded,
@@ -16,12 +16,12 @@ import {
   setHiddenAnimated,
   setSelected
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   linkedIds
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/select/select.tsx
 import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";

package/dist/shared/{chunk-bew4bjgf.js → chunk-4jnweh3m.js}

@@ -4,19 +4,19 @@ import {
 import {
   Keys,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setDataState,
   setExpanded,
   setHidden,
   setHiddenAnimated
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/hover-card/hover-card.tsx
 import { __element, __on } from "@vertz/ui/internals";

package/dist/shared/{chunk-jctqs9m4.js → chunk-7867pr13.js}

@@ -24,24 +24,16 @@ function handleListNavigation(event, items, options = {}) {
   let nextIndex = -1;
   if (isKey(event, prevKey)) {
     event.preventDefault();
-    if (currentIndex <= 0) {
-      nextIndex = loop ? items.length - 1 : 0;
-    } else {
-      nextIndex = currentIndex - 1;
-    }
+    nextIndex = findEnabled(items, currentIndex, -1, loop);
   } else if (isKey(event, nextKey)) {
     event.preventDefault();
-    if (currentIndex >= items.length - 1) {
-      nextIndex = loop ? 0 : items.length - 1;
-    } else {
-      nextIndex = currentIndex + 1;
-    }
+    nextIndex = findEnabled(items, currentIndex, 1, loop);
   } else if (isKey(event, Keys.Home)) {
     event.preventDefault();
-    nextIndex = 0;
+    nextIndex = findEnabledFrom(items, 0, 1);
   } else if (isKey(event, Keys.End)) {
     event.preventDefault();
-    nextIndex = items.length - 1;
+    nextIndex = findEnabledFrom(items, items.length - 1, -1);
   }
   const target = items[nextIndex];
   if (target) {
@@ -50,6 +42,38 @@ function handleListNavigation(event, items, options = {}) {
   }
   return null;
 }
+function isDisabled(el) {
+  return el.getAttribute("aria-disabled") === "true";
+}
+function findEnabled(items, current, direction, loop) {
+  const len = items.length;
+  let candidate = current;
+  for (let i = 0;i < len; i++) {
+    candidate += direction;
+    if (loop) {
+      candidate = (candidate % len + len) % len;
+    } else if (candidate < 0 || candidate >= len) {
+      return -1;
+    }
+    const el = items[candidate];
+    if (el && !isDisabled(el))
+      return candidate;
+  }
+  return -1;
+}
+function findEnabledFrom(items, start, direction) {
+  const len = items.length;
+  let candidate = start;
+  for (let i = 0;i < len; i++) {
+    if (candidate < 0 || candidate >= len)
+      return -1;
+    const el = items[candidate];
+    if (el && !isDisabled(el))
+      return candidate;
+    candidate += direction;
+  }
+  return -1;
+}
 function handleActivation(event, handler) {
   if (isKey(event, Keys.Enter, Keys.Space)) {
     event.preventDefault();

package/dist/shared/{chunk-rnjm61t0.js → chunk-90hmpm0w.js}

@@ -1,9 +1,9 @@
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/badge/badge.tsx
 import { __element } from "@vertz/ui/internals";

package/dist/shared/{chunk-hr9hx58m.js → chunk-ac86qw7a.js}

@@ -1,13 +1,13 @@
 import {
   Keys,
   isKey
-} from "./chunk-jctqs9m4.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-7867pr13.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/checkbox/checkbox.tsx
 import { computed, signal } from "@vertz/ui";

package/dist/shared/{chunk-gt0wth9h.js → chunk-b02fkvts.js}

@@ -5,14 +5,14 @@ import {
   Keys,
   handleListNavigation,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setDataState,
   setPressed
 } from "./chunk-vvjyx7fe.js";
 import {
   applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-q8dm19a5.js";
 
 // src/toggle-group/toggle-group.tsx
 import { __element, __on } from "@vertz/ui/internals";

package/dist/shared/{chunk-7kpsyjd7.js → chunk-bsx59bv9.js}

@@ -1,13 +1,13 @@
 import {
   Keys,
   isKey
-} from "./chunk-jctqs9m4.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-7867pr13.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/switch/switch.tsx
 import { computed, signal } from "@vertz/ui";

package/dist/shared/{chunk-jz0s6srh.js → chunk-cm2akzrm.js}

@@ -1,6 +1,6 @@
 import {
   applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-q8dm19a5.js";
 
 // src/scroll-area/scroll-area.tsx
 import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";

package/dist/shared/{chunk-yr9yzpvq.js → chunk-cvms20w3.js}

@@ -3,40 +3,24 @@ import {
 } from "./chunk-e2v1c9ex.js";
 import {
   handleListNavigation
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setChecked,
-  setDataState
+  setDataState,
+  setDisabled
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/radio/radio.tsx
 import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";
 import { signal } from "@vertz/ui";
-function RadioRoot(options = {}) {
-  const { defaultValue = "", onValueChange, ...attrs } = options;
-  const state = { value: signal(defaultValue) };
-  const items = [];
-  const itemValues = [];
-  function selectItem(value) {
-    state.value.value = value;
-    for (let i = 0;i < items.length; i++) {
-      const item = items[i];
-      if (!item)
-        continue;
-      const isActive = itemValues[i] === value;
-      setChecked(item, isActive);
-      setDataState(item, isActive ? "checked" : "unchecked");
-    }
-    setRovingTabindex(items, itemValues.indexOf(value));
-    onValueChange?.(value);
-  }
-  const root = (() => {
+function RadioGroup(items, itemValues, selectItem) {
+  return (() => {
     const __el0 = __element("div");
     __el0.setAttribute("role", "radiogroup");
     {
@@ -57,48 +41,89 @@ function RadioRoot(options = {}) {
     });
     return __el0;
   })();
-  function Item(value, label) {
-    const isActive = value === state.value.peek();
-    const item = (() => {
-      const __el1 = __element("div");
-      __el1.setAttribute("role", "radio");
-      {
-        const __v = uniqueId("radio");
-        if (__v != null && __v !== false)
-          __el1.setAttribute("id", __v === true ? "" : __v);
-      }
-      {
-        const __v = value;
-        if (__v != null && __v !== false)
-          __el1.setAttribute("data-value", __v === true ? "" : __v);
-      }
-      {
-        const __v = isActive ? "true" : "false";
-        if (__v != null && __v !== false)
-          __el1.setAttribute("aria-checked", __v === true ? "" : __v);
-      }
-      {
-        const __v = isActive ? "checked" : "unchecked";
-        if (__v != null && __v !== false)
-          __el1.setAttribute("data-state", __v === true ? "" : __v);
-      }
-      __on(__el1, "click", () => {
+}
+function RadioItem(value, label, isActive, disabled, selectItem) {
+  const el = (() => {
+    const __el0 = __element("div");
+    __el0.setAttribute("role", "radio");
+    {
+      const __v = uniqueId("radio");
+      if (__v != null && __v !== false)
+        __el0.setAttribute("id", __v === true ? "" : __v);
+    }
+    {
+      const __v = value;
+      if (__v != null && __v !== false)
+        __el0.setAttribute("data-value", __v === true ? "" : __v);
+    }
+    {
+      const __v = isActive ? "true" : "false";
+      if (__v != null && __v !== false)
+        __el0.setAttribute("aria-checked", __v === true ? "" : __v);
+    }
+    {
+      const __v = isActive ? "checked" : "unchecked";
+      if (__v != null && __v !== false)
+        __el0.setAttribute("data-state", __v === true ? "" : __v);
+    }
+    __on(__el0, "click", () => {
+      if (!disabled)
         selectItem(value);
+    });
+    __enterChildren(__el0);
+    __insert(__el0, label ?? value);
+    __exitChildren();
+    return __el0;
+  })();
+  if (disabled) {
+    setDisabled(el, true);
+    el.setAttribute("data-disabled", "");
+  }
+  return el;
+}
+function RadioRoot(options = {}) {
+  const { defaultValue = "", onValueChange, ...attrs } = options;
+  const state = { value: signal(defaultValue) };
+  const items = [];
+  const itemValues = [];
+  function selectItem(value) {
+    state.value.value = value;
+    for (let i = 0;i < items.length; i++) {
+      const item = items[i];
+      if (!item)
+        continue;
+      const isActive = itemValues[i] === value;
+      setChecked(item, isActive);
+      setDataState(item, isActive ? "checked" : "unchecked");
+    }
+    setRovingTabindex(items, itemValues.indexOf(value));
+    onValueChange?.(value);
+  }
+  const root = RadioGroup(items, itemValues, selectItem);
+  const cleanups = [];
+  function Item(value, label, itemOptions) {
+    const isActive = value === state.value.peek();
+    const disabled = itemOptions?.disabled ?? false;
+    const item = RadioItem(value, label, isActive, disabled, selectItem);
+    const handleClick = () => {
+      if (!disabled)
         item.focus();
-      });
-      __enterChildren(__el1);
-      __insert(__el1, label ?? value);
-      __exitChildren();
-      return __el1;
-    })();
+    };
+    item.addEventListener("click", handleClick);
+    cleanups.push(() => item.removeEventListener("click", handleClick));
     items.push(item);
     itemValues.push(value);
     root.appendChild(item);
     setRovingTabindex(items, itemValues.indexOf(state.value.peek()));
     return item;
   }
+  function destroy() {
+    for (const cleanup of cleanups)
+      cleanup();
+    cleanups.length = 0;
+  }
   applyAttrs(root, attrs);
-  return { root, state, Item };
+  return { root, state, Item, destroy };
 }
 var Radio = {
   Root: RadioRoot

package/dist/shared/{chunk-ttsyf6ma.js → chunk-d8n8mggh.js}

@@ -1,16 +1,16 @@
 import {
   Keys,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setHidden
 } from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-dpsgb1xw.js";
 import {
   uniqueId
 } from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-q8dm19a5.js";
 
 // src/command/command.tsx
 import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";