@vertz/ui-primitives 0.2.21 → 0.2.23

package/dist/shared/chunk-er9625ar.js

@@ -1,204 +0,0 @@
-import {
-  saveFocus,
-  trapFocus
-} from "./chunk-e2v1c9ex.js";
-import {
-  setDataState,
-  setExpanded,
-  setHidden,
-  setHiddenAnimated
-} from "./chunk-vvjyx7fe.js";
-import {
-  linkedIds
-} from "./chunk-8y1jf6xr.js";
-
-// src/alert-dialog/alert-dialog.tsx
-import { __element, __on, __styleStr } from "@vertz/ui/internals";
-import { signal } from "@vertz/ui";
-function AlertDialogTriggerEl(triggerId, contentId, defaultOpen, onClick) {
-  return (() => {
-    const __el0 = __element("button");
-    __el0.setAttribute("type", "button");
-    {
-      const __v = triggerId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    {
-      const __v = contentId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-controls", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "true" : "false";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-expanded", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "open" : "closed";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-state", __v === true ? "" : __v);
-    }
-    __on(__el0, "click", onClick);
-    return __el0;
-  })();
-}
-function AlertDialogOverlayEl(defaultOpen) {
-  return (() => {
-    const __el0 = __element("div");
-    __el0.setAttribute("data-alertdialog-overlay", "");
-    {
-      const __v = defaultOpen ? "false" : "true";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-hidden", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "open" : "closed";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-state", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "" : "display: none";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-    }
-    return __el0;
-  })();
-}
-function AlertDialogContentEl(contentId, titleId, descriptionId, defaultOpen) {
-  return (() => {
-    const __el0 = __element("div");
-    __el0.setAttribute("role", "alertdialog");
-    {
-      const __v = contentId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    __el0.setAttribute("aria-modal", "true");
-    {
-      const __v = titleId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-labelledby", __v === true ? "" : __v);
-    }
-    {
-      const __v = descriptionId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-describedby", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "false" : "true";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-hidden", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "open" : "closed";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-state", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "" : "display: none";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-    }
-    return __el0;
-  })();
-}
-function AlertDialogTitleEl(titleId) {
-  return (() => {
-    const __el0 = __element("h2");
-    {
-      const __v = titleId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    return __el0;
-  })();
-}
-function AlertDialogDescriptionEl(descriptionId) {
-  return (() => {
-    const __el0 = __element("p");
-    {
-      const __v = descriptionId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    return __el0;
-  })();
-}
-function AlertDialogCancelBtn(onClick) {
-  return (() => {
-    const __el0 = __element("button");
-    __el0.setAttribute("type", "button");
-    __on(__el0, "click", onClick);
-    return __el0;
-  })();
-}
-function AlertDialogActionBtn(onClick) {
-  return (() => {
-    const __el0 = __element("button");
-    __el0.setAttribute("type", "button");
-    __on(__el0, "click", onClick);
-    return __el0;
-  })();
-}
-function AlertDialogRoot(options = {}) {
-  const { defaultOpen = false, onOpenChange, onAction } = options;
-  const ids = linkedIds("alertdialog");
-  const titleId = `${ids.contentId}-title`;
-  const descriptionId = `${ids.contentId}-description`;
-  const state = { open: signal(defaultOpen) };
-  let restoreFocus = null;
-  let removeTrap = null;
-  function show() {
-    if (state.open.peek())
-      return;
-    state.open.value = true;
-    setExpanded(trigger, true);
-    setHidden(overlay, false);
-    setHidden(content, false);
-    setDataState(trigger, "open");
-    setDataState(overlay, "open");
-    setDataState(content, "open");
-    restoreFocus = saveFocus();
-    removeTrap = trapFocus(content);
-    queueMicrotask(() => cancel.focus());
-    onOpenChange?.(true);
-  }
-  function hide() {
-    if (!state.open.peek())
-      return;
-    state.open.value = false;
-    setExpanded(trigger, false);
-    setDataState(trigger, "closed");
-    setDataState(overlay, "closed");
-    setDataState(content, "closed");
-    setHiddenAnimated(overlay, true);
-    setHiddenAnimated(content, true);
-    removeTrap?.();
-    removeTrap = null;
-    restoreFocus?.();
-    restoreFocus = null;
-    onOpenChange?.(false);
-  }
-  const trigger = AlertDialogTriggerEl(ids.triggerId, ids.contentId, defaultOpen, show);
-  const overlay = AlertDialogOverlayEl(defaultOpen);
-  const content = AlertDialogContentEl(ids.contentId, titleId, descriptionId, defaultOpen);
-  const title = AlertDialogTitleEl(titleId);
-  const description = AlertDialogDescriptionEl(descriptionId);
-  const cancel = AlertDialogCancelBtn(() => hide());
-  const action = AlertDialogActionBtn(() => {
-    onAction?.();
-    hide();
-  });
-  if (defaultOpen) {
-    restoreFocus = saveFocus();
-    removeTrap = trapFocus(content);
-    queueMicrotask(() => cancel.focus());
-  }
-  return { trigger, overlay, content, title, description, cancel, action, state, show, hide };
-}
-var AlertDialog = {
-  Root: AlertDialogRoot
-};
-
-export { AlertDialog };

package/dist/shared/chunk-ewxzhtej.js

@@ -1,117 +0,0 @@
-import {
-  setDataState,
-  setExpanded,
-  setHidden,
-  setHiddenAnimated
-} from "./chunk-vvjyx7fe.js";
-import {
-  linkedIds
-} from "./chunk-8y1jf6xr.js";
-import {
-  applyAttrs
-} from "./chunk-q8dm19a5.js";
-
-// src/collapsible/collapsible.tsx
-import { __element, __enterChildren, __exitChildren, __insert, __on, __styleStr } from "@vertz/ui/internals";
-import { signal } from "@vertz/ui";
-function CollapsibleRoot(options = {}) {
-  const { defaultOpen = false, disabled = false, onOpenChange, ...attrs } = options;
-  const ids = linkedIds("collapsible");
-  const state = {
-    open: signal(defaultOpen),
-    disabled: signal(disabled)
-  };
-  function toggle() {
-    if (state.disabled.peek())
-      return;
-    const next = !state.open.peek();
-    state.open.value = next;
-    if (next) {
-      setHidden(content, false);
-    }
-    const height = content.scrollHeight;
-    content.style.setProperty("--collapsible-content-height", `${height}px`);
-    setExpanded(trigger, next);
-    setDataState(trigger, next ? "open" : "closed");
-    setDataState(content, next ? "open" : "closed");
-    if (!next) {
-      setHiddenAnimated(content, true);
-    }
-    onOpenChange?.(next);
-  }
-  const trigger = (() => {
-    const __el0 = __element("button");
-    __el0.setAttribute("type", "button");
-    {
-      const __v = ids.triggerId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    {
-      const __v = ids.contentId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-controls", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "true" : "false";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-expanded", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "open" : "closed";
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-state", __v === true ? "" : __v);
-    }
-    {
-      const __v = disabled;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("disabled", __v === true ? "" : __v);
-    }
-    {
-      const __v = disabled ? "true" : undefined;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-disabled", __v === true ? "" : __v);
-    }
-    __on(__el0, "click", toggle);
-    return __el0;
-  })();
-  const content = (() => {
-    const __el1 = __element("div");
-    {
-      const __v = ids.contentId;
-      if (__v != null && __v !== false)
-        __el1.setAttribute("id", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "false" : "true";
-      if (__v != null && __v !== false)
-        __el1.setAttribute("aria-hidden", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "open" : "closed";
-      if (__v != null && __v !== false)
-        __el1.setAttribute("data-state", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultOpen ? "" : "display: none";
-      if (__v != null && __v !== false)
-        __el1.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-    }
-    return __el1;
-  })();
-  const root = (() => {
-    const __el2 = __element("div");
-    __enterChildren(__el2);
-    __insert(__el2, trigger);
-    __insert(__el2, content);
-    __exitChildren();
-    return __el2;
-  })();
-  applyAttrs(root, attrs);
-  return { root, trigger, content, state };
-}
-var Collapsible = {
-  Root: CollapsibleRoot
-};
-
-export { Collapsible };

package/dist/shared/chunk-ey4485fh.js

@@ -1,196 +0,0 @@
-import {
-  Keys,
-  isKey
-} from "./chunk-7867pr13.js";
-import {
-  setDataState,
-  setExpanded,
-  setHidden,
-  setHiddenAnimated,
-  setSelected
-} from "./chunk-vvjyx7fe.js";
-import {
-  linkedIds
-} from "./chunk-8y1jf6xr.js";
-import {
-  applyAttrs
-} from "./chunk-q8dm19a5.js";
-
-// src/combobox/combobox.tsx
-import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";
-import { signal } from "@vertz/ui";
-function ComboboxRoot(options = {}) {
-  const { defaultValue = "", onValueChange, onInputChange, ...attrs } = options;
-  const ids = linkedIds("combobox");
-  const state = {
-    open: signal(false),
-    value: signal(defaultValue),
-    inputValue: signal(defaultValue),
-    activeIndex: signal(-1)
-  };
-  const optionElements = [];
-  function open() {
-    state.open.value = true;
-    setExpanded(input, true);
-    setHidden(listbox, false);
-    setDataState(listbox, "open");
-  }
-  function close() {
-    state.open.value = false;
-    state.activeIndex.value = -1;
-    setExpanded(input, false);
-    setDataState(listbox, "closed");
-    setHiddenAnimated(listbox, true);
-    updateActiveDescendant(-1);
-  }
-  function selectOption(value) {
-    state.value.value = value;
-    state.inputValue.value = value;
-    input.value = value;
-    for (const opt of optionElements) {
-      const isActive = opt.getAttribute("data-value") === value;
-      setSelected(opt, isActive);
-      setDataState(opt, isActive ? "active" : "inactive");
-    }
-    onValueChange?.(value);
-    close();
-    input.focus();
-  }
-  function updateActiveDescendant(index) {
-    const opt = optionElements[index];
-    if (index >= 0 && opt) {
-      input.setAttribute("aria-activedescendant", opt.id);
-      for (let i = 0;i < optionElements.length; i++) {
-        const el = optionElements[i];
-        if (el)
-          setDataState(el, i === index ? "active" : "inactive");
-      }
-    } else {
-      input.removeAttribute("aria-activedescendant");
-    }
-  }
-  const input = (() => {
-    const __el0 = __element("input");
-    __el0.setAttribute("type", "text");
-    __el0.setAttribute("role", "combobox");
-    __el0.setAttribute("aria-autocomplete", "list");
-    {
-      const __v = ids.contentId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("aria-controls", __v === true ? "" : __v);
-    }
-    __el0.setAttribute("aria-haspopup", "listbox");
-    {
-      const __v = ids.triggerId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    {
-      const __v = defaultValue;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("value", __v === true ? "" : __v);
-    }
-    __el0.setAttribute("aria-expanded", "false");
-    __on(__el0, "input", () => {
-      state.inputValue.value = input.value;
-      onInputChange?.(input.value);
-      if (!state.open.peek())
-        open();
-    });
-    __on(__el0, "focus", () => {
-      if (!state.open.peek() && input.value.length > 0)
-        open();
-    });
-    __on(__el0, "keydown", (event) => {
-      if (isKey(event, Keys.Escape)) {
-        event.preventDefault();
-        close();
-        return;
-      }
-      if (isKey(event, Keys.ArrowDown)) {
-        event.preventDefault();
-        if (!state.open.peek()) {
-          open();
-        }
-        const next = Math.min(state.activeIndex.peek() + 1, optionElements.length - 1);
-        state.activeIndex.value = next;
-        updateActiveDescendant(next);
-        return;
-      }
-      if (isKey(event, Keys.ArrowUp)) {
-        event.preventDefault();
-        const prev = Math.max(state.activeIndex.peek() - 1, 0);
-        state.activeIndex.value = prev;
-        updateActiveDescendant(prev);
-        return;
-      }
-      if (isKey(event, Keys.Enter)) {
-        event.preventDefault();
-        const idx = state.activeIndex.peek();
-        if (idx >= 0 && idx < optionElements.length) {
-          const val = optionElements[idx]?.getAttribute("data-value");
-          if (val != null)
-            selectOption(val);
-        }
-        return;
-      }
-    });
-    return __el0;
-  })();
-  const listbox = (() => {
-    const __el1 = __element("div");
-    __el1.setAttribute("role", "listbox");
-    {
-      const __v = ids.contentId;
-      if (__v != null && __v !== false)
-        __el1.setAttribute("id", __v === true ? "" : __v);
-    }
-    __el1.setAttribute("aria-hidden", "true");
-    __el1.setAttribute("data-state", "closed");
-    __el1.setAttribute("style", "display: none");
-    return __el1;
-  })();
-  function Option(value, label) {
-    const optId = `${ids.contentId}-opt-${optionElements.length}`;
-    const isSelectedOpt = value === defaultValue;
-    const opt = (() => {
-      const __el2 = __element("div");
-      __el2.setAttribute("role", "option");
-      {
-        const __v = optId;
-        if (__v != null && __v !== false)
-          __el2.setAttribute("id", __v === true ? "" : __v);
-      }
-      {
-        const __v = value;
-        if (__v != null && __v !== false)
-          __el2.setAttribute("data-value", __v === true ? "" : __v);
-      }
-      {
-        const __v = isSelectedOpt ? "true" : "false";
-        if (__v != null && __v !== false)
-          __el2.setAttribute("aria-selected", __v === true ? "" : __v);
-      }
-      {
-        const __v = isSelectedOpt ? "active" : "inactive";
-        if (__v != null && __v !== false)
-          __el2.setAttribute("data-state", __v === true ? "" : __v);
-      }
-      __on(__el2, "click", () => selectOption(value));
-      __enterChildren(__el2);
-      __insert(__el2, label ?? value);
-      __exitChildren();
-      return __el2;
-    })();
-    optionElements.push(opt);
-    listbox.appendChild(opt);
-    return opt;
-  }
-  applyAttrs(input, attrs);
-  return { input, listbox, state, Option };
-}
-var Combobox = {
-  Root: ComboboxRoot
-};
-
-export { Combobox };

package/dist/shared/chunk-gbxbkmte.js

@@ -1,175 +0,0 @@
-import {
-  Keys,
-  isKey
-} from "./chunk-7867pr13.js";
-import {
-  setDataState,
-  setValueRange
-} from "./chunk-vvjyx7fe.js";
-import {
-  applyAttrs
-} from "./chunk-q8dm19a5.js";
-
-// src/resizable-panel/resizable-panel.tsx
-import { __element, __on, __styleStr } from "@vertz/ui/internals";
-import { signal } from "@vertz/ui";
-function ResizablePanelRoot(options = {}) {
-  const { orientation = "horizontal", onResize, ...attrs } = options;
-  const state = { sizes: signal([]) };
-  const panels = [];
-  const handles = [];
-  function updateSizes(newSizes) {
-    state.sizes.value = [...newSizes];
-    for (let i = 0;i < panels.length; i++) {
-      const panel = panels[i];
-      if (!panel)
-        continue;
-      const size = newSizes[i] ?? 0;
-      panel.el.style.flex = `0 0 ${size}%`;
-    }
-    for (let i = 0;i < handles.length; i++) {
-      const handle = handles[i];
-      const leftPanel = panels[i];
-      if (handle && leftPanel) {
-        const size = newSizes[i] ?? 0;
-        setValueRange(handle, Math.round(size), Math.round(leftPanel.minSize), Math.round(leftPanel.maxSize));
-      }
-    }
-    onResize?.(newSizes);
-  }
-  const root = (() => {
-    const __el0 = __element("div");
-    {
-      const __v = `display: flex; flex-direction: ${orientation === "horizontal" ? "row" : "column"};`;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
-    }
-    {
-      const __v = orientation;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-orientation", __v === true ? "" : __v);
-    }
-    return __el0;
-  })();
-  function Panel(panelOptions = {}) {
-    const { defaultSize, minSize = 0, maxSize = 100 } = panelOptions;
-    const el = (() => {
-      const __el1 = __element("div");
-      __el1.setAttribute("data-panel", "");
-      return __el1;
-    })();
-    panels.push({ el, minSize, maxSize });
-    const sizes = state.sizes.peek();
-    if (defaultSize != null) {
-      sizes.push(defaultSize);
-    } else {
-      const equalSize = 100 / panels.length;
-      sizes.length = 0;
-      for (let i = 0;i < panels.length; i++) {
-        sizes.push(equalSize);
-      }
-    }
-    updateSizes(sizes);
-    root.appendChild(el);
-    return el;
-  }
-  function Handle() {
-    const handleIndex = handles.length;
-    const handle = (() => {
-      const __el2 = __element("div");
-      __el2.setAttribute("role", "separator");
-      __el2.setAttribute("tabindex", "0");
-      {
-        const __v = orientation;
-        if (__v != null && __v !== false)
-          __el2.setAttribute("data-orientation", __v === true ? "" : __v);
-      }
-      __el2.setAttribute("data-state", "idle");
-      __on(__el2, "keydown", (event) => {
-        const sizes = [...state.sizes.peek()];
-        const leftIdx = handleIndex;
-        const rightIdx = handleIndex + 1;
-        const leftPanel = panels[leftIdx];
-        const rightPanel = panels[rightIdx];
-        if (!leftPanel || !rightPanel)
-          return;
-        let leftSize = sizes[leftIdx] ?? 0;
-        let rightSize = sizes[rightIdx] ?? 0;
-        const STEP = 5;
-        const growKey = orientation === "horizontal" ? Keys.ArrowRight : Keys.ArrowDown;
-        const shrinkKey = orientation === "horizontal" ? Keys.ArrowLeft : Keys.ArrowUp;
-        if (isKey(event, growKey)) {
-          event.preventDefault();
-          const delta = Math.min(STEP, rightSize - rightPanel.minSize, leftPanel.maxSize - leftSize);
-          leftSize += delta;
-          rightSize -= delta;
-        } else if (isKey(event, shrinkKey)) {
-          event.preventDefault();
-          const delta = Math.min(STEP, leftSize - leftPanel.minSize, rightPanel.maxSize - rightSize);
-          leftSize -= delta;
-          rightSize += delta;
-        } else if (isKey(event, Keys.Home)) {
-          event.preventDefault();
-          const delta = leftSize - leftPanel.minSize;
-          leftSize -= delta;
-          rightSize += delta;
-        } else if (isKey(event, Keys.End)) {
-          event.preventDefault();
-          const delta = rightSize - rightPanel.minSize;
-          leftSize += delta;
-          rightSize -= delta;
-        } else {
-          return;
-        }
-        sizes[leftIdx] = leftSize;
-        sizes[rightIdx] = rightSize;
-        updateSizes(sizes);
-      });
-      __on(__el2, "pointerdown", (event) => {
-        event.preventDefault();
-        handle.setPointerCapture(event.pointerId);
-        setDataState(handle, "dragging");
-        const startPos = orientation === "horizontal" ? event.clientX : event.clientY;
-        const rootSize = orientation === "horizontal" ? root.offsetWidth : root.offsetHeight;
-        const startSizes = [...state.sizes.peek()];
-        function onMove(e) {
-          const currentPos = orientation === "horizontal" ? e.clientX : e.clientY;
-          const delta = (currentPos - startPos) / rootSize * 100;
-          const sizes = [...startSizes];
-          const leftIdx = handleIndex;
-          const rightIdx = handleIndex + 1;
-          const leftPanel = panels[leftIdx];
-          const rightPanel = panels[rightIdx];
-          if (!leftPanel || !rightPanel)
-            return;
-          let newLeft = (startSizes[leftIdx] ?? 0) + delta;
-          let newRight = (startSizes[rightIdx] ?? 0) - delta;
-          newLeft = Math.max(leftPanel.minSize, Math.min(leftPanel.maxSize, newLeft));
-          newRight = Math.max(rightPanel.minSize, Math.min(rightPanel.maxSize, newRight));
-          sizes[leftIdx] = newLeft;
-          sizes[rightIdx] = newRight;
-          updateSizes(sizes);
-        }
-        function onUp(e) {
-          handle.releasePointerCapture(e.pointerId);
-          setDataState(handle, "idle");
-          handle.removeEventListener("pointermove", onMove);
-          handle.removeEventListener("pointerup", onUp);
-        }
-        handle.addEventListener("pointermove", onMove);
-        handle.addEventListener("pointerup", onUp);
-      });
-      return __el2;
-    })();
-    handles.push(handle);
-    root.appendChild(handle);
-    return handle;
-  }
-  applyAttrs(root, attrs);
-  return { root, state, Panel, Handle };
-}
-var ResizablePanel = {
-  Root: ResizablePanelRoot
-};
-
-export { ResizablePanel };