@vertz/ui-primitives 0.2.22 → 0.2.23

package/dist/shared/chunk-mr1tb0dp.js

@@ -0,0 +1,167 @@
+import {
+  createFloatingPosition
+} from "./chunk-0mcr52hc.js";
+import {
+  Keys,
+  isKey
+} from "./chunk-7867pr13.js";
+import {
+  setDataState,
+  setExpanded,
+  setHidden,
+  setHiddenAnimated
+} from "./chunk-vevfhpc9.js";
+import {
+  uniqueId
+} from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-2db2dnp3.js";
+
+// src/hover-card/hover-card.tsx
+import { __discardMountFrame, __element, __flushMountFrame, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
+import { signal } from "@vertz/ui";
+function HoverCardRoot(options = {}) {
+  const __mfDepth = __pushMountFrame();
+  try {
+    let cancelTimers = function() {
+      if (openTimeout) {
+        clearTimeout(openTimeout);
+        openTimeout = null;
+      }
+      if (closeTimeout) {
+        clearTimeout(closeTimeout);
+        closeTimeout = null;
+      }
+    }, cancelCloseTimer = function() {
+      if (closeTimeout) {
+        clearTimeout(closeTimeout);
+        closeTimeout = null;
+      }
+    }, positionContent = function() {
+      if (positioning) {
+        floatingCleanup?.();
+        const effectivePlacement = positioning.placement ?? "bottom";
+        const result = createFloatingPosition(trigger, content, {
+          ...positioning,
+          placement: effectivePlacement
+        });
+        floatingCleanup = result.cleanup;
+      }
+    }, show = function() {
+      cancelTimers();
+      if (state.open.peek())
+        return;
+      openTimeout = setTimeout(() => {
+        state.open.value = true;
+        setExpanded(trigger, true);
+        setHidden(content, false);
+        setDataState(content, "open");
+        positionContent();
+        onOpenChange?.(true);
+        openTimeout = null;
+      }, openDelay);
+    }, showImmediate = function() {
+      cancelTimers();
+      state.open.value = true;
+      setExpanded(trigger, true);
+      setHidden(content, false);
+      setDataState(content, "open");
+      positionContent();
+      onOpenChange?.(true);
+    }, hide = function() {
+      cancelTimers();
+      if (!state.open.peek())
+        return;
+      closeTimeout = setTimeout(() => {
+        state.open.value = false;
+        setExpanded(trigger, false);
+        setDataState(content, "closed");
+        setHiddenAnimated(content, true);
+        floatingCleanup?.();
+        floatingCleanup = null;
+        onOpenChange?.(false);
+        closeTimeout = null;
+      }, closeDelay);
+    }, hideImmediate = function() {
+      cancelTimers();
+      state.open.value = false;
+      setExpanded(trigger, false);
+      setDataState(content, "closed");
+      setHiddenAnimated(content, true);
+      floatingCleanup?.();
+      floatingCleanup = null;
+      onOpenChange?.(false);
+    }, handleTriggerBlur = function(event) {
+      const related = event.relatedTarget;
+      if (related && (trigger.contains(related) || content.contains(related)))
+        return;
+      hide();
+    }, handleTriggerKeydown = function(event) {
+      if (isKey(event, Keys.Escape) && state.open.peek()) {
+        hideImmediate();
+      }
+    }, handleContentFocusout = function(event) {
+      const related = event.relatedTarget;
+      if (related && (trigger.contains(related) || content.contains(related)))
+        return;
+      hide();
+    }, handleContentKeydown = function(event) {
+      if (isKey(event, Keys.Escape)) {
+        hideImmediate();
+        trigger.focus();
+      }
+    };
+    const { openDelay = 700, closeDelay = 300, onOpenChange, positioning, ...attrs } = options;
+    const contentId = uniqueId("hovercard");
+    const state = { open: signal(false) };
+    let openTimeout = null;
+    let closeTimeout = null;
+    let floatingCleanup = null;
+    const trigger = (() => {
+      const __el0 = __element("span");
+      __el0.setAttribute("aria-haspopup", "dialog");
+      __el0.setAttribute("aria-expanded", "false");
+      __on(__el0, "mouseenter", show);
+      __on(__el0, "mouseleave", hide);
+      __on(__el0, "focus", showImmediate);
+      __on(__el0, "blur", handleTriggerBlur);
+      __on(__el0, "keydown", handleTriggerKeydown);
+      return __el0;
+    })();
+    const content = (() => {
+      const __el1 = __element("div");
+      __el1.setAttribute("role", "dialog");
+      {
+        const __v = contentId;
+        if (__v != null && __v !== false)
+          __el1.setAttribute("id", __v === true ? "" : __v);
+      }
+      __el1.setAttribute("aria-hidden", "true");
+      __el1.setAttribute("data-state", "closed");
+      {
+        const __v = { display: "none" };
+        if (__v != null && __v !== false)
+          __el1.setAttribute("style", typeof __v === "object" ? __styleStr(__v) : __v === true ? "" : String(__v));
+      }
+      __on(__el1, "mouseenter", cancelCloseTimer);
+      __on(__el1, "mouseleave", hide);
+      __on(__el1, "focusin", cancelCloseTimer);
+      __on(__el1, "focusout", handleContentFocusout);
+      __on(__el1, "keydown", handleContentKeydown);
+      return __el1;
+    })();
+    applyAttrs(trigger, attrs);
+    const __mfResult0 = { trigger, content, state };
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
+}
+var HoverCard = {
+  Root: HoverCardRoot
+};
+
+export { HoverCard };

package/dist/shared/chunk-nj420k31.js

@@ -0,0 +1,54 @@
+import {
+  handleActivation
+} from "./chunk-7867pr13.js";
+import {
+  applyAttrs
+} from "./chunk-2db2dnp3.js";
+
+// src/button/button.tsx
+import { __discardMountFrame, __element, __flushMountFrame, __on, __pushMountFrame } from "@vertz/ui/internals";
+function ButtonRoot(options = {}) {
+  const __mfDepth = __pushMountFrame();
+  try {
+    const { disabled = false, onClick, ...attrs } = options;
+    const el = (() => {
+      const __el0 = __element("button");
+      __el0.setAttribute("type", "button");
+      {
+        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", () => {
+        if (disabled)
+          return;
+        onClick?.();
+      });
+      __on(__el0, "keydown", (event) => {
+        if (disabled)
+          return;
+        handleActivation(event, () => {
+          event.target.click();
+        });
+      });
+      return __el0;
+    })();
+    applyAttrs(el, attrs);
+    const __mfResult0 = el;
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
+}
+var Button = {
+  Root: ButtonRoot
+};
+
+export { Button };

package/dist/shared/chunk-p0x7hgv6.js

@@ -0,0 +1,181 @@
+import {
+  Keys,
+  isKey
+} from "./chunk-7867pr13.js";
+import {
+  setDataState,
+  setValueRange
+} from "./chunk-vevfhpc9.js";
+import {
+  applyAttrs
+} from "./chunk-2db2dnp3.js";
+
+// src/resizable-panel/resizable-panel.tsx
+import { __discardMountFrame, __element, __flushMountFrame, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
+import { signal } from "@vertz/ui";
+function ResizablePanelRoot(options = {}) {
+  const __mfDepth = __pushMountFrame();
+  try {
+    let updateSizes = function(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);
+    }, Panel = function(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;
+    }, Handle = function() {
+      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;
+    };
+    const { orientation = "horizontal", onResize, ...attrs } = options;
+    const state = { sizes: signal([]) };
+    const panels = [];
+    const handles = [];
+    const root = (() => {
+      const __el0 = __element("div");
+      {
+        const __v = { display: "flex", flexDirection: 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;
+    })();
+    applyAttrs(root, attrs);
+    const __mfResult0 = { root, state, Panel, Handle };
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
+}
+var ResizablePanel = {
+  Root: ResizablePanelRoot
+};
+
+export { ResizablePanel };

package/dist/shared/{chunk-w9dag6ce.js → chunk-pn6shbcs.js}

@@ -21,98 +21,150 @@ import {
 } from "./chunk-2db2dnp3.js";
 
 // src/navigation-menu/navigation-menu.tsx
-import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";
+import { __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __insert, __on, __pushMountFrame, __styleStr } from "@vertz/ui/internals";
 import { signal } from "@vertz/ui";
 function NavMenuList(triggers, orientation) {
-  return (() => {
-    const __el0 = __element("div");
-    __on(__el0, "keydown", (event) => {
-      if (isKey(event, Keys.ArrowLeft, Keys.ArrowRight, Keys.Home, Keys.End)) {
-        handleListNavigation(event, triggers, {
-          orientation: orientation === "horizontal" ? "horizontal" : "vertical"
-        });
-      }
-    });
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      const __el0 = __element("div");
+      __on(__el0, "keydown", (event) => {
+        if (isKey(event, Keys.ArrowLeft, Keys.ArrowRight, Keys.Home, Keys.End)) {
+          handleListNavigation(event, triggers, {
+            orientation: orientation === "horizontal" ? "horizontal" : "vertical"
+          });
+        }
+      });
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavMenuViewport() {
-  return (() => {
-    const __el0 = __element("div");
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      const __el0 = __element("div");
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavMenuNav(list, viewport) {
-  return (() => {
-    const __el0 = __element("nav");
-    __enterChildren(__el0);
-    __insert(__el0, list);
-    __insert(__el0, viewport);
-    __exitChildren();
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      const __el0 = __element("nav");
+      __enterChildren(__el0);
+      __insert(__el0, list);
+      __insert(__el0, viewport);
+      __exitChildren();
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavMenuItemTrigger(triggerId, contentId, value, label, onClick, onMouseenter, onMouseleave, onKeydown) {
-  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 = value;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("data-value", __v === true ? "" : __v);
-    }
-    __el0.setAttribute("aria-expanded", "false");
-    __el0.setAttribute("data-state", "closed");
-    __on(__el0, "click", onClick);
-    __on(__el0, "mouseenter", onMouseenter);
-    __on(__el0, "mouseleave", onMouseleave);
-    __on(__el0, "keydown", onKeydown);
-    __enterChildren(__el0);
-    __insert(__el0, label ?? value);
-    __exitChildren();
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      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 = value;
+        if (__v != null && __v !== false)
+          __el0.setAttribute("data-value", __v === true ? "" : __v);
+      }
+      __el0.setAttribute("aria-expanded", "false");
+      __el0.setAttribute("data-state", "closed");
+      __on(__el0, "click", onClick);
+      __on(__el0, "mouseenter", onMouseenter);
+      __on(__el0, "mouseleave", onMouseleave);
+      __on(__el0, "keydown", onKeydown);
+      __enterChildren(__el0);
+      __insert(__el0, label ?? value);
+      __exitChildren();
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavMenuItemContent(contentId, onMouseenter, onMouseleave, onKeydown) {
-  return (() => {
-    const __el0 = __element("div");
-    {
-      const __v = contentId;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("id", __v === true ? "" : __v);
-    }
-    __el0.setAttribute("aria-hidden", "true");
-    __el0.setAttribute("data-state", "closed");
-    __el0.setAttribute("style", "display: none");
-    __on(__el0, "mouseenter", onMouseenter);
-    __on(__el0, "mouseleave", onMouseleave);
-    __on(__el0, "keydown", onKeydown);
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      const __el0 = __element("div");
+      {
+        const __v = contentId;
+        if (__v != null && __v !== false)
+          __el0.setAttribute("id", __v === true ? "" : __v);
+      }
+      __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));
+      }
+      __on(__el0, "mouseenter", onMouseenter);
+      __on(__el0, "mouseleave", onMouseleave);
+      __on(__el0, "keydown", onKeydown);
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavMenuLink(href, label) {
-  return (() => {
-    const __el0 = __element("a");
-    {
-      const __v = href;
-      if (__v != null && __v !== false)
-        __el0.setAttribute("href", __v === true ? "" : __v);
-    }
-    __enterChildren(__el0);
-    __insert(__el0, label);
-    __exitChildren();
-    return __el0;
-  })();
+  const __mfDepth = __pushMountFrame();
+  try {
+    const __mfResult0 = (() => {
+      const __el0 = __element("a");
+      {
+        const __v = href;
+        if (__v != null && __v !== false)
+          __el0.setAttribute("href", __v === true ? "" : __v);
+      }
+      __enterChildren(__el0);
+      __insert(__el0, label);
+      __exitChildren();
+      return __el0;
+    })();
+    __flushMountFrame();
+    return __mfResult0;
+  } catch (__mfErr) {
+    __discardMountFrame(__mfDepth);
+    throw __mfErr;
+  }
 }
 function NavigationMenuRoot(options = {}) {
   const { orientation = "horizontal", delayOpen = 200, delayClose = 300, ...attrs } = options;