@vertz/ui-primitives 0.2.41 → 0.2.42

package/dist/shared/chunk-862x7dja.js

@@ -1,398 +0,0 @@
-import {
-  createDismiss
-} from "./chunk-a6wp8c32.js";
-import {
-  cn
-} from "./chunk-q7xbcj9q.js";
-import {
-  createFloatingPosition
-} from "./chunk-vef3sepw.js";
-import {
-  linkedIds
-} from "./chunk-8y1jf6xr.js";
-import {
-  Keys,
-  handleListNavigation,
-  isKey
-} from "./chunk-7867pr13.js";
-import {
-  setHiddenAnimated
-} from "./chunk-vevfhpc9.js";
-
-// src/select/select-composed.tsx
-import { computed, signal } from "@vertz/ui";
-import { __append, __attr, __child, __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
-import { createContext, onMount, ref, useContext } from "@vertz/ui";
-var SelectContext = createContext(undefined, "@vertz/ui-primitives::SelectContext");
-function useSelectContext(componentName) {
-  const ctx = useContext(SelectContext);
-  if (!ctx) {
-    throw new Error(`<Select.${componentName}> must be used inside <Select>. ` + "Ensure it is a direct or nested child of the Select root component.");
-  }
-  return ctx;
-}
-function SelectTrigger(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const ctx = useSelectContext("Trigger");
-    const displayText = computed(() => __props.children ?? (ctx.selectedValue() || ctx.placeholder || ""));
-    const __mfResult0 = (() => {
-      const __el0 = __element("button");
-      __el0.setAttribute("type", "button");
-      __el0.setAttribute("role", "combobox");
-      __el0.setAttribute("data-select-trigger", "");
-      {
-        const __v = ctx.contentId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("aria-controls", __v === true ? "" : __v);
-      }
-      __el0.setAttribute("aria-haspopup", "listbox");
-      __el0.setAttribute("aria-expanded", "false");
-      __el0.setAttribute("data-state", "closed");
-      __attr(__el0, "class", () => cn(ctx.classes?.trigger, __props.className ?? __props.class));
-      __on(__el0, "click", () => ctx.toggle());
-      __on(__el0, "keydown", (event) => {
-        if (isKey(event, Keys.ArrowDown, Keys.ArrowUp, Keys.Enter, Keys.Space)) {
-          event.preventDefault();
-          if (!ctx.isOpen())
-            ctx.open();
-        }
-      });
-      __enterChildren(__el0);
-      __append(__el0, (() => {
-        const __el1 = __element("span");
-        __el1.setAttribute("data-part", "text");
-        {
-          const __v = {
-            flex: 1,
-            textAlign: "start",
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-            whiteSpace: "nowrap"
-          };
-          if (__v != null && __v !== false)
-            __el1.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-        }
-        __enterChildren(__el1);
-        __append(__el1, __child(() => displayText.value));
-        __exitChildren();
-        return __el1;
-      })());
-      __append(__el0, (() => {
-        const __el2 = __element("span");
-        __el2.setAttribute("data-part", "chevron");
-        __enterChildren(__el2);
-        __append(__el2, (() => {
-          const __el3 = __element("svg");
-          __el3.setAttribute("xmlns", "http://www.w3.org/2000/svg");
-          __el3.setAttribute("width", "16");
-          __el3.setAttribute("height", "16");
-          __el3.setAttribute("viewBox", "0 0 24 24");
-          __el3.setAttribute("fill", "none");
-          __el3.setAttribute("stroke", "currentColor");
-          __el3.setAttribute("stroke-width", "2");
-          __el3.setAttribute("stroke-linecap", "round");
-          __el3.setAttribute("stroke-linejoin", "round");
-          __el3.setAttribute("aria-hidden", "true");
-          __enterChildren(__el3);
-          __append(__el3, (() => {
-            const __el4 = __element("path");
-            __el4.setAttribute("d", "m6 9 6 6 6-6");
-            return __el4;
-          })());
-          __exitChildren();
-          return __el3;
-        })());
-        __exitChildren();
-        return __el2;
-      })());
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function SelectContent(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const ctx = useSelectContext("Content");
-    const instanceIndex = ctx._contentCount.value++;
-    if (instanceIndex > 0) {
-      console.warn("Duplicate <Select.Content> detected – only the first is used");
-    }
-    onMount(() => {
-      const el = ctx.contentRef.current;
-      if (!el || el.__selectWired)
-        return;
-      el.__selectWired = true;
-      el.addEventListener("keydown", (event) => {
-        if (isKey(event, Keys.Escape)) {
-          event.preventDefault();
-          ctx.close();
-          return;
-        }
-        const items = [...el.querySelectorAll('[role="option"]')];
-        const focusedIdx = items.indexOf(document.activeElement);
-        if (isKey(event, Keys.Enter, Keys.Space)) {
-          event.preventDefault();
-          const active = items[focusedIdx];
-          if (active) {
-            const val = active.getAttribute("data-value");
-            if (val !== null)
-              ctx.selectItem(val);
-          }
-          return;
-        }
-        const result = handleListNavigation(event, items, { orientation: "vertical" });
-        if (result)
-          return;
-        if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
-          const char = event.key.toLowerCase();
-          const match = items.find((item) => item.textContent?.toLowerCase().startsWith(char));
-          if (match)
-            match.focus();
-        }
-      });
-    });
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      ctx.contentRef.current = __el0;
-      __el0.setAttribute("role", "listbox");
-      __el0.setAttribute("tabindex", "-1");
-      {
-        const __v = ctx.contentId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("id", __v === true ? "" : __v);
-      }
-      __el0.setAttribute("data-select-content", "");
-      __el0.setAttribute("aria-hidden", "true");
-      __el0.setAttribute("data-state", "closed");
-      {
-        const __v = { display: "none" };
-        if (__v != null && __v !== false)
-          __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-      }
-      __attr(__el0, "class", () => cn(ctx.classes?.content, __props.className ?? __props.class));
-      __enterChildren(__el0);
-      __append(__el0, __child(() => __props.children));
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function SelectItem(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const ctx = useSelectContext("Item");
-    const isSelected = computed(() => ctx.selectedValue() === __props.value);
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      __el0.setAttribute("role", "option");
-      __attr(__el0, "data-value", () => __props.value);
-      __el0.setAttribute("tabindex", "-1");
-      __attr(__el0, "aria-selected", () => isSelected.value ? "true" : "false");
-      __attr(__el0, "data-state", () => isSelected.value ? "active" : "inactive");
-      __attr(__el0, "class", () => cn(ctx.classes?.item, __props.className ?? __props.class));
-      __on(__el0, "click", () => ctx.selectItem(__props.value));
-      __enterChildren(__el0);
-      __append(__el0, __child(() => __props.children ?? __props.value));
-      __append(__el0, (() => {
-        const __el1 = __element("span");
-        __el1.setAttribute("data-part", "indicator");
-        __attr(__el1, "style", () => ({ display: isSelected.value ? "" : "none" }));
-        {
-          const __v = cn(ctx.classes?.itemIndicator);
-          if (__v != null && __v !== false)
-            __el1.setAttribute("class", __v === true ? "" : __v);
-        }
-        return __el1;
-      })());
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function SelectGroup(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const ctx = useSelectContext("Group");
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      __el0.setAttribute("role", "group");
-      __attr(__el0, "aria-label", () => __props.label);
-      __attr(__el0, "class", () => cn(ctx.classes?.group, __props.className ?? __props.class));
-      __enterChildren(__el0);
-      __append(__el0, (() => {
-        const __el1 = __element("div");
-        __el1.setAttribute("data-part", "group-label");
-        __el1.setAttribute("role", "none");
-        __attr(__el1, "class", () => cn(ctx.classes?.label));
-        __enterChildren(__el1);
-        __append(__el1, __child(() => __props.label));
-        __exitChildren();
-        return __el1;
-      })());
-      __append(__el0, __child(() => __props.children));
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function SelectSeparator(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const { classes } = useSelectContext("Separator");
-    const __mfResult0 = (() => {
-      const __el0 = __element("hr");
-      __el0.setAttribute("role", "separator");
-      __attr(__el0, "class", () => cn(classes?.separator, __props.className ?? __props.class));
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function ComposedSelectRoot(__props) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    let getContentEl = function() {
-      return contentRef.current ?? null;
-    }, getTriggerEl = function() {
-      const content = getContentEl();
-      return content?.parentElement?.querySelector("[data-select-trigger]");
-    }, syncTriggerAttrs = function(nowOpen) {
-      const trigger = getTriggerEl();
-      if (!trigger)
-        return;
-      trigger.setAttribute("aria-expanded", nowOpen ? "true" : "false");
-      trigger.setAttribute("data-state", nowOpen ? "open" : "closed");
-    }, showContent = function() {
-      const content = getContentEl();
-      if (!content)
-        return;
-      content.setAttribute("data-state", "open");
-      content.setAttribute("aria-hidden", "false");
-      content.style.display = "";
-    }, hideContent = function() {
-      const content = getContentEl();
-      if (!content)
-        return;
-      content.setAttribute("data-state", "closed");
-      setHiddenAnimated(content, true);
-    }, open = function() {
-      isOpen.value = true;
-      syncTriggerAttrs(true);
-      showContent();
-      const contentEl = getContentEl();
-      const triggerEl = getTriggerEl();
-      if (!contentEl)
-        return;
-      contentEl.style.position = "fixed";
-      if (triggerEl) {
-        const floatingOpts = { matchReferenceWidth: true, ...__props.positioning };
-        const result = createFloatingPosition(triggerEl, contentEl, floatingOpts);
-        state.floatingCleanup = result.cleanup;
-      }
-      const insideElements = [contentEl, ...triggerEl ? [triggerEl] : []];
-      state.dismissCleanup = createDismiss({
-        onDismiss: close,
-        insideElements
-      });
-      const items = [...contentEl.querySelectorAll('[role="option"]')];
-      const selectedIdx = items.findIndex((el) => el.getAttribute("data-value") === selectedValue.value);
-      if (selectedIdx >= 0) {
-        items.forEach((el, i) => el.setAttribute("tabindex", i === selectedIdx ? "0" : "-1"));
-        items[selectedIdx]?.focus();
-      } else {
-        contentEl.focus();
-      }
-    }, close = function() {
-      isOpen.value = false;
-      syncTriggerAttrs(false);
-      hideContent();
-      state.floatingCleanup?.();
-      state.floatingCleanup = null;
-      state.dismissCleanup?.();
-      state.dismissCleanup = null;
-      getTriggerEl()?.focus();
-    }, toggle = function() {
-      if (isOpen.value)
-        close();
-      else
-        open();
-    }, selectItem = function(value) {
-      selectedValue.value = value;
-      __props.onValueChange?.(value);
-      close();
-    };
-    const ids = linkedIds("select");
-    const contentRef = ref();
-    const isOpen = signal(false, "isOpen");
-    const selectedValue = signal(__props.defaultValue ?? "", "selectedValue");
-    const state = { floatingCleanup: null, dismissCleanup: null };
-    const ctx = {
-      isOpen: () => isOpen.value,
-      selectedValue: () => selectedValue.value,
-      placeholder: __props.placeholder,
-      contentId: ids.contentId,
-      contentRef,
-      classes: __props.classes,
-      open,
-      close,
-      toggle,
-      selectItem,
-      _contentCount: { value: 0 }
-    };
-    const __mfResult0 = SelectContext.Provider({ get value() {
-      return ctx;
-    }, children: () => (() => {
-      const __el0 = __element("span");
-      {
-        const __v = { display: "contents" };
-        if (__v != null && __v !== false)
-          __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-      }
-      __el0.setAttribute("data-select-root", "");
-      __enterChildren(__el0);
-      __append(__el0, __child(() => __props.children));
-      __exitChildren();
-      return __el0;
-    })() });
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-var ComposedSelect = Object.assign(ComposedSelectRoot, {
-  Trigger: SelectTrigger,
-  Content: SelectContent,
-  Item: SelectItem,
-  Group: SelectGroup,
-  Separator: SelectSeparator
-});
-
-export { ComposedSelect };

package/dist/shared/chunk-8pk1pn5h.js

@@ -1,215 +0,0 @@
-import {
-  setRovingTabindex
-} from "./chunk-e2v1c9ex.js";
-import {
-  uniqueId
-} from "./chunk-8y1jf6xr.js";
-import {
-  handleListNavigation
-} from "./chunk-7867pr13.js";
-import {
-  setDataState,
-  setHidden,
-  setSelected
-} from "./chunk-vevfhpc9.js";
-import {
-  applyAttrs
-} from "./chunk-2db2dnp3.js";
-
-// src/tabs/tabs.tsx
-import { __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __insert, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
-import { signal } from "@vertz/ui";
-function TabList(orientation, triggers, tabValues, selectTab) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      __el0.setAttribute("role", "tablist");
-      {
-        const __v = orientation === "vertical" ? "vertical" : undefined;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("aria-orientation", __v === true ? "" : __v);
-      }
-      __on(__el0, "keydown", (event) => {
-        const result = handleListNavigation(event, triggers, {
-          orientation
-        });
-        if (result) {
-          const idx = triggers.indexOf(result);
-          if (idx >= 0) {
-            const val = tabValues[idx];
-            if (val !== undefined)
-              selectTab(val);
-          }
-        }
-      });
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function TabTrigger(triggerId, panelId, value, label, isActive, selectTab) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const __mfResult0 = (() => {
-      const __el0 = __element("button");
-      __el0.setAttribute("type", "button");
-      __el0.setAttribute("role", "tab");
-      {
-        const __v = triggerId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("id", __v === true ? "" : __v);
-      }
-      {
-        const __v = panelId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("aria-controls", __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-selected", __v === true ? "" : __v);
-      }
-      {
-        const __v = isActive ? "active" : "inactive";
-        if (__v != null && __v !== false)
-          __el0.setAttribute("data-state", __v === true ? "" : __v);
-      }
-      __on(__el0, "click", () => {
-        selectTab(value);
-      });
-      __enterChildren(__el0);
-      __insert(__el0, label ?? value);
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function TabsContainer(list) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      __enterChildren(__el0);
-      __insert(__el0, list);
-      __exitChildren();
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function TabPanel(panelId, triggerId, isActive) {
-  const __mfDepth = __pushMountFrame();
-  try {
-    const __mfResult0 = (() => {
-      const __el0 = __element("div");
-      __el0.setAttribute("role", "tabpanel");
-      {
-        const __v = panelId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("id", __v === true ? "" : __v);
-      }
-      {
-        const __v = triggerId;
-        if (__v != null && __v !== false)
-          __el0.setAttribute("aria-labelledby", __v === true ? "" : __v);
-      }
-      __el0.setAttribute("tabindex", "0");
-      {
-        const __v = isActive ? "false" : "true";
-        if (__v != null && __v !== false)
-          __el0.setAttribute("aria-hidden", __v === true ? "" : __v);
-      }
-      {
-        const __v = isActive ? "active" : "inactive";
-        if (__v != null && __v !== false)
-          __el0.setAttribute("data-state", __v === true ? "" : __v);
-      }
-      {
-        const __v = { display: isActive ? "" : "none" };
-        if (__v != null && __v !== false)
-          __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-      }
-      return __el0;
-    })();
-    __flushMountFrame();
-    return __mfResult0;
-  } catch (__mfErr) {
-    __discardMountFrame(__mfDepth);
-    throw __mfErr;
-  }
-}
-function TabsRoot(options = {}) {
-  const { defaultValue = "", orientation = "horizontal", onValueChange, ...attrs } = options;
-  const state = { value: signal(defaultValue) };
-  const triggers = [];
-  const panels = [];
-  const tabValues = [];
-  function selectTab(value) {
-    state.value.value = value;
-    for (let i = 0;i < tabValues.length; i++) {
-      const isActive = tabValues[i] === value;
-      const trig = triggers[i];
-      const panel = panels[i];
-      if (!trig || !panel)
-        continue;
-      setSelected(trig, isActive);
-      setDataState(trig, isActive ? "active" : "inactive");
-      trig.setAttribute("tabindex", isActive ? "0" : "-1");
-      setHidden(panel, !isActive);
-      setDataState(panel, isActive ? "active" : "inactive");
-    }
-    onValueChange?.(value);
-  }
-  const list = TabList(orientation, triggers, tabValues, selectTab);
-  const root = TabsContainer(list);
-  const cleanups = [];
-  function Tab(value, label) {
-    const baseId = uniqueId("tab");
-    const triggerId = `${baseId}-trigger`;
-    const panelId = `${baseId}-panel`;
-    const isActive = value === state.value.peek();
-    const trig = TabTrigger(triggerId, panelId, value, label, isActive, selectTab);
-    const handleClick = () => {
-      trig.focus();
-    };
-    trig.addEventListener("click", handleClick);
-    cleanups.push(() => trig.removeEventListener("click", handleClick));
-    const panel = TabPanel(panelId, triggerId, isActive);
-    triggers.push(trig);
-    panels.push(panel);
-    tabValues.push(value);
-    setRovingTabindex(triggers, triggers.findIndex((t) => tabValues[triggers.indexOf(t)] === state.value.peek()));
-    return { trigger: trig, panel };
-  }
-  function destroy() {
-    for (const cleanup of cleanups)
-      cleanup();
-    cleanups.length = 0;
-  }
-  applyAttrs(root, attrs);
-  return { root, list, state, Tab, destroy };
-}
-var Tabs = {
-  Root: TabsRoot
-};
-
-export { Tabs };