@vertz/ui-primitives 0.2.20 → 0.2.22

package/dist/shared/chunk-w9dag6ce.js

@@ -0,0 +1,237 @@
+import {
+  focusFirst,
+  setRovingTabindex
+} from "./chunk-e2v1c9ex.js";
+import {
+  Keys,
+  handleListNavigation,
+  isKey
+} from "./chunk-7867pr13.js";
+import {
+  setDataState,
+  setExpanded,
+  setHidden,
+  setHiddenAnimated
+} from "./chunk-vevfhpc9.js";
+import {
+  linkedIds
+} from "./chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "./chunk-2db2dnp3.js";
+
+// src/navigation-menu/navigation-menu.tsx
+import { __element, __enterChildren, __exitChildren, __insert, __on } 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;
+  })();
+}
+function NavMenuViewport() {
+  return (() => {
+    const __el0 = __element("div");
+    return __el0;
+  })();
+}
+function NavMenuNav(list, viewport) {
+  return (() => {
+    const __el0 = __element("nav");
+    __enterChildren(__el0);
+    __insert(__el0, list);
+    __insert(__el0, viewport);
+    __exitChildren();
+    return __el0;
+  })();
+}
+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;
+  })();
+}
+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;
+  })();
+}
+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;
+  })();
+}
+function NavigationMenuRoot(options = {}) {
+  const { orientation = "horizontal", delayOpen = 200, delayClose = 300, ...attrs } = options;
+  const state = { activeItem: signal(null) };
+  const triggers = [];
+  const items = new Map;
+  let openTimeout = null;
+  let closeTimeout = null;
+  function cancelTimers() {
+    if (openTimeout) {
+      clearTimeout(openTimeout);
+      openTimeout = null;
+    }
+    if (closeTimeout) {
+      clearTimeout(closeTimeout);
+      closeTimeout = null;
+    }
+  }
+  function openItem(value) {
+    cancelTimers();
+    const current = state.activeItem.peek();
+    if (current && current !== value) {
+      const prev = items.get(current);
+      if (prev) {
+        setExpanded(prev.trigger, false);
+        setDataState(prev.trigger, "closed");
+        setDataState(prev.content, "closed");
+        setHiddenAnimated(prev.content, true);
+      }
+    }
+    const item = items.get(value);
+    if (!item)
+      return;
+    state.activeItem.value = value;
+    setExpanded(item.trigger, true);
+    setHidden(item.content, false);
+    setDataState(item.trigger, "open");
+    setDataState(item.content, "open");
+  }
+  function closeAll() {
+    cancelTimers();
+    const current = state.activeItem.peek();
+    if (current) {
+      const item = items.get(current);
+      if (item) {
+        setExpanded(item.trigger, false);
+        setDataState(item.trigger, "closed");
+        setDataState(item.content, "closed");
+        setHiddenAnimated(item.content, true);
+      }
+    }
+    state.activeItem.value = null;
+  }
+  const list = NavMenuList(triggers, orientation);
+  const viewport = NavMenuViewport();
+  const root = NavMenuNav(list, viewport);
+  function Item(value, label) {
+    const ids = linkedIds("nav-menu");
+    let contentEl;
+    const trigger = NavMenuItemTrigger(ids.triggerId, ids.contentId, value, label, () => {
+      if (state.activeItem.peek() === value) {
+        closeAll();
+      } else {
+        openItem(value);
+      }
+    }, () => {
+      cancelTimers();
+      openTimeout = setTimeout(() => {
+        openItem(value);
+        openTimeout = null;
+      }, delayOpen);
+    }, () => {
+      cancelTimers();
+      closeTimeout = setTimeout(() => {
+        closeAll();
+        closeTimeout = null;
+      }, delayClose);
+    }, (event) => {
+      if (isKey(event, Keys.Enter, Keys.Space)) {
+        event.preventDefault();
+        openItem(value);
+        queueMicrotask(() => focusFirst(contentEl));
+      }
+      if (isKey(event, Keys.Escape)) {
+        event.preventDefault();
+        closeAll();
+      }
+    });
+    contentEl = NavMenuItemContent(ids.contentId, () => cancelTimers(), () => {
+      cancelTimers();
+      closeTimeout = setTimeout(() => {
+        closeAll();
+        closeTimeout = null;
+      }, delayClose);
+    }, (event) => {
+      if (isKey(event, Keys.Escape)) {
+        event.preventDefault();
+        event.stopPropagation();
+        closeAll();
+        trigger.focus();
+      }
+    });
+    triggers.push(trigger);
+    setRovingTabindex(triggers, 0);
+    items.set(value, { trigger, content: contentEl });
+    list.appendChild(trigger);
+    viewport.appendChild(contentEl);
+    return { trigger, content: contentEl };
+  }
+  function Link(href, label) {
+    const a = NavMenuLink(href, label);
+    list.appendChild(a);
+    return a;
+  }
+  applyAttrs(root, attrs);
+  return { root, list, viewport, state, Item, Link };
+}
+var NavigationMenu = {
+  Root: NavigationMenuRoot
+};
+
+export { NavigationMenu };

package/dist/shared/{chunk-g9qvd20g.js → chunk-wcdq7bew.js}

@@ -1,13 +1,13 @@
 import {
   Keys,
   isKey
-} from "./chunk-jctqs9m4.js";
+} from "./chunk-7867pr13.js";
 import {
   setDataState
-} from "./chunk-vvjyx7fe.js";
+} from "./chunk-vevfhpc9.js";
 import {
   applyAttrs
-} from "./chunk-dpsgb1xw.js";
+} from "./chunk-2db2dnp3.js";
 
 // src/carousel/carousel.tsx
 import { __element, __enterChildren, __exitChildren, __insert, __on } from "@vertz/ui/internals";

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

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

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

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

package/dist/shared/{chunk-7kpsyjd7.js → chunk-zyfc6cx3.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-2db2dnp3.js";
 
 // src/switch/switch.tsx
 import { computed, signal } from "@vertz/ui";

package/dist/src/accordion/accordion.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/accordion/accordion.js

@@ -1,10 +1,6 @@
 import {
   Accordion
-} from "../../shared/chunk-avxcmmk6.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-e4mm5e59.js";
 export {
   Accordion
 };

package/dist/src/alert-dialog/alert-dialog.d.ts

@@ -8,13 +8,13 @@ interface AlertDialogState {
 	open: Signal<boolean>;
 }
 interface AlertDialogElements {
-	trigger: HTMLButtonElement;
-	overlay: HTMLDivElement;
-	content: HTMLDivElement;
-	title: HTMLHeadingElement;
-	description: HTMLParagraphElement;
-	cancel: HTMLButtonElement;
-	action: HTMLButtonElement;
+	trigger: HTMLElement;
+	overlay: HTMLElement;
+	content: HTMLElement;
+	title: HTMLElement;
+	description: HTMLElement;
+	cancel: HTMLElement;
+	action: HTMLElement;
 	show: () => void;
 	hide: () => void;
 }

package/dist/src/alert-dialog/alert-dialog.js

@@ -1,9 +1,6 @@
 import {
   AlertDialog
-} from "../../shared/chunk-34yfm2b0.js";
-import"../../shared/chunk-e2v1c9ex.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-w318par6.js";
 export {
   AlertDialog
 };

package/dist/src/badge/badge.d.ts

@@ -1,4 +1,6 @@
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/badge/badge.js

@@ -1,8 +1,6 @@
 import {
   Badge
-} from "../../shared/chunk-rnjm61t0.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-z0gwkzgp.js";
 export {
   Badge
 };

package/dist/src/button/button.d.ts

@@ -1,4 +1,6 @@
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/button/button.js

@@ -1,8 +1,6 @@
 import {
   Button
-} from "../../shared/chunk-4da5zksy.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-mqs4qq0b.js";
 export {
   Button
 };

package/dist/src/calendar/calendar.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;
@@ -37,16 +39,17 @@ interface CalendarState {
 	displayMonth: Signal<Date>;
 }
 interface CalendarElements {
-	root: HTMLDivElement;
-	header: HTMLDivElement;
-	title: HTMLDivElement;
-	prevButton: HTMLButtonElement;
-	nextButton: HTMLButtonElement;
-	grid: HTMLTableElement;
+	root: HTMLElement;
+	header: HTMLElement;
+	title: HTMLElement;
+	prevButton: HTMLElement;
+	nextButton: HTMLElement;
+	grid: HTMLElement;
 }
 declare const Calendar: {
 	Root: (options?: CalendarOptions) => CalendarElements & {
 		state: CalendarState;
+		destroy: () => void;
 	};
 };
 export { CalendarState, CalendarOptions, CalendarElements, Calendar };

package/dist/src/calendar/calendar.js

@@ -1,7 +1,6 @@
 import {
   Calendar
-} from "../../shared/chunk-18y8gfk0.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-k8nabsxm.js";
 export {
   Calendar
 };

package/dist/src/carousel/carousel.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/carousel/carousel.js

@@ -1,9 +1,6 @@
 import {
   Carousel
-} from "../../shared/chunk-g9qvd20g.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-wcdq7bew.js";
 export {
   Carousel
 };

package/dist/src/checkbox/checkbox.d.ts

@@ -1,4 +1,6 @@
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/checkbox/checkbox.js

@@ -1,9 +1,6 @@
 import {
   Checkbox
-} from "../../shared/chunk-hr9hx58m.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-rb53v045.js";
 export {
   Checkbox
 };

package/dist/src/collapsible/collapsible.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/collapsible/collapsible.js

@@ -1,9 +1,6 @@
 import {
   Collapsible
-} from "../../shared/chunk-tfyg0qrp.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-c46v0fsw.js";
 export {
   Collapsible
 };

package/dist/src/combobox/combobox.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/combobox/combobox.js

@@ -1,10 +1,6 @@
 import {
   Combobox
-} from "../../shared/chunk-4085nbdq.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-vhx3sqw6.js";
 export {
   Combobox
 };

package/dist/src/command/command.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/command/command.js

@@ -1,10 +1,6 @@
 import {
   Command
-} from "../../shared/chunk-ttsyf6ma.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-s6a2yph8.js";
 export {
   Command
 };

package/dist/src/context-menu/context-menu.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;

package/dist/src/context-menu/context-menu.js

@@ -1,12 +1,6 @@
 import {
   ContextMenu
-} from "../../shared/chunk-x0we8gcy.js";
-import"../../shared/chunk-a6wp8c32.js";
-import"../../shared/chunk-0mcr52hc.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-g8hnc95b.js";
 export {
   ContextMenu
 };

package/dist/src/date-picker/date-picker.d.ts

@@ -29,12 +29,12 @@ interface DatePickerElements {
 	trigger: HTMLButtonElement;
 	content: HTMLDivElement;
 	calendar: {
-		root: HTMLDivElement;
-		header: HTMLDivElement;
-		title: HTMLDivElement;
-		prevButton: HTMLButtonElement;
-		nextButton: HTMLButtonElement;
-		grid: HTMLTableElement;
+		root: HTMLElement;
+		header: HTMLElement;
+		title: HTMLElement;
+		prevButton: HTMLElement;
+		nextButton: HTMLElement;
+		grid: HTMLElement;
 	};
 }
 declare const DatePicker: {

package/dist/src/date-picker/date-picker.js

@@ -1,15 +1,6 @@
 import {
   DatePicker
-} from "../../shared/chunk-x2hz98qn.js";
-import"../../shared/chunk-18y8gfk0.js";
-import"../../shared/chunk-m1ptgp1s.js";
-import"../../shared/chunk-a6wp8c32.js";
-import"../../shared/chunk-e2v1c9ex.js";
-import"../../shared/chunk-0mcr52hc.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-jda3v59q.js";
 export {
   DatePicker
 };

package/dist/src/dialog/dialog.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;
@@ -24,6 +26,7 @@ interface DialogElements {
 	content: HTMLDivElement;
 	overlay: HTMLDivElement;
 	title: HTMLHeadingElement;
+	description: HTMLParagraphElement;
 	close: HTMLButtonElement;
 	show: () => void;
 	hide: () => void;

package/dist/src/dialog/dialog.js

@@ -1,11 +1,6 @@
 import {
   Dialog
-} from "../../shared/chunk-7krvqrwq.js";
-import"../../shared/chunk-e2v1c9ex.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-8qtexw5s.js";
 export {
   Dialog
 };

package/dist/src/dropdown-menu/dropdown-menu.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;
@@ -26,6 +28,7 @@ interface FloatingOptions {
 }
 interface MenuOptions extends ElementAttrs {
 	onSelect?: (value: string) => void;
+	onOpenChange?: (open: boolean) => void;
 	positioning?: FloatingOptions;
 }
 interface MenuState {

package/dist/src/dropdown-menu/dropdown-menu.js

@@ -1,13 +1,6 @@
 import {
   DropdownMenu
-} from "../../shared/chunk-96d9nr7y.js";
-import"../../shared/chunk-7ffg0caj.js";
-import"../../shared/chunk-a6wp8c32.js";
-import"../../shared/chunk-0mcr52hc.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-dhyr0s9n.js";
 export {
   DropdownMenu
 };

package/dist/src/hover-card/hover-card.d.ts

@@ -1,5 +1,7 @@
 import { Signal } from "@vertz/ui";
 interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
 	class?: string;
 	id?: string;
 	style?: string;