@vertz/ui-primitives 0.2.20 → 0.2.22

package/dist/src/menu/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/menu/menu.js

@@ -1,12 +1,6 @@
 import {
   Menu
-} from "../../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-4rf1m34c.js";
 export {
   Menu
 };

package/dist/src/menubar/menubar.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/menubar/menubar.js

@@ -1,13 +1,6 @@
 import {
   Menubar
-} from "../../shared/chunk-sqs8kyb2.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-27xs9apd.js";
 export {
   Menubar
 };

package/dist/src/navigation-menu/navigation-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;
@@ -21,17 +23,17 @@ interface NavigationMenuState {
 }
 interface NavigationMenuElements {
 	root: HTMLElement;
-	list: HTMLDivElement;
-	viewport: HTMLDivElement;
+	list: HTMLElement;
+	viewport: HTMLElement;
 }
 declare const NavigationMenu: {
 	Root: (options?: NavigationMenuOptions) => NavigationMenuElements & {
 		state: NavigationMenuState;
 		Item: (value: string, label?: string) => {
-			trigger: HTMLButtonElement;
-			content: HTMLDivElement;
+			trigger: HTMLElement;
+			content: HTMLElement;
 		};
-		Link: (href: string, label: string) => HTMLAnchorElement;
+		Link: (href: string, label: string) => HTMLElement;
 	};
 };
 export { NavigationMenuState, NavigationMenuOptions, NavigationMenuElements, NavigationMenu };

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

@@ -1,11 +1,6 @@
 import {
   NavigationMenu
-} from "../../shared/chunk-8tvzqry6.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-w9dag6ce.js";
 export {
   NavigationMenu
 };

package/dist/src/popover/popover.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/popover/popover.js

@@ -1,13 +1,6 @@
 import {
   Popover
-} from "../../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-9ezgd78r.js";
 export {
   Popover
 };

package/dist/src/progress/progress.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;
@@ -20,8 +22,8 @@ interface ProgressState {
 	value: Signal<number>;
 }
 interface ProgressElements {
-	root: HTMLDivElement;
-	indicator: HTMLDivElement;
+	root: HTMLElement;
+	indicator: HTMLElement;
 }
 declare const Progress: {
 	Root: (options?: ProgressOptions) => ProgressElements & {

package/dist/src/progress/progress.js

@@ -1,9 +1,6 @@
 import {
   Progress
-} from "../../shared/chunk-ppcv3ehd.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-pg2yjn8f.js";
 export {
   Progress
 };

package/dist/src/radio/radio.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;
@@ -19,12 +21,16 @@ interface RadioState {
 	value: Signal<string>;
 }
 interface RadioElements {
-	root: HTMLDivElement;
+	root: HTMLElement;
+}
+interface RadioItemOptions {
+	disabled?: boolean;
 }
 declare const Radio: {
 	Root: (options?: RadioOptions) => RadioElements & {
 		state: RadioState;
-		Item: (value: string, label?: string) => HTMLDivElement;
+		Item: (value: string, label?: string, itemOptions?: RadioItemOptions) => HTMLElement;
+		destroy: () => void;
 	};
 };
-export { RadioState, RadioOptions, RadioElements, Radio };
+export { RadioState, RadioOptions, RadioItemOptions, RadioElements, Radio };

package/dist/src/radio/radio.js

@@ -1,11 +1,6 @@
 import {
   Radio
-} from "../../shared/chunk-yr9yzpvq.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-279bzynx.js";
 export {
   Radio
 };

package/dist/src/resizable-panel/resizable-panel.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/resizable-panel/resizable-panel.js

@@ -1,9 +1,6 @@
 import {
   ResizablePanel
-} from "../../shared/chunk-j4cm8avr.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-kcnq15je.js";
 export {
   ResizablePanel
 };

package/dist/src/scroll-area/scroll-area.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/scroll-area/scroll-area.js

@@ -1,7 +1,6 @@
 import {
   ScrollArea
-} from "../../shared/chunk-jz0s6srh.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-z850et33.js";
 export {
   ScrollArea
 };

package/dist/src/select/select.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/select/select.js

@@ -1,12 +1,6 @@
 import {
   Select
-} from "../../shared/chunk-kg27s15c.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-ajpj10z0.js";
 export {
   Select
 };

package/dist/src/sheet/sheet.js

@@ -1,10 +1,6 @@
 import {
   Sheet
-} from "../../shared/chunk-t1vkvsz2.js";
-import"../../shared/chunk-e2v1c9ex.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-3rp73gkd.js";
 export {
   Sheet
 };

package/dist/src/slider/slider.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/slider/slider.js

@@ -1,10 +1,6 @@
 import {
   Slider
-} from "../../shared/chunk-8ak7vdk1.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-2k8gxzdf.js";
 export {
   Slider
 };

package/dist/src/switch/switch.d.ts

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

package/dist/src/switch/switch.js

@@ -1,9 +1,6 @@
 import {
   Switch
-} from "../../shared/chunk-7kpsyjd7.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-zyfc6cx3.js";
 export {
   Switch
 };

package/dist/src/tabs/tabs.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;
@@ -20,16 +22,17 @@ interface TabsState {
 	value: Signal<string>;
 }
 interface TabsElements {
-	root: HTMLDivElement;
-	list: HTMLDivElement;
+	root: HTMLElement;
+	list: HTMLElement;
 }
 declare const Tabs: {
 	Root: (options?: TabsOptions) => TabsElements & {
 		state: TabsState;
 		Tab: (value: string, label?: string) => {
-			trigger: HTMLButtonElement;
-			panel: HTMLDivElement;
+			trigger: HTMLElement;
+			panel: HTMLElement;
 		};
+		destroy: () => void;
 	};
 };
 export { TabsState, TabsOptions, TabsElements, Tabs };

package/dist/src/tabs/tabs.js

@@ -1,11 +1,6 @@
 import {
   Tabs
-} from "../../shared/chunk-8nk0ya7a.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-j2tdpxgc.js";
 export {
   Tabs
 };

package/dist/src/toast/toast.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/toast/toast.js

@@ -1,9 +1,6 @@
 import {
   Toast
-} from "../../shared/chunk-gkddsbmh.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-56reyd5r.js";
 export {
   Toast
 };

package/dist/src/toggle/toggle.d.ts

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

package/dist/src/toggle/toggle.js

@@ -1,9 +1,6 @@
 import {
   Toggle
-} from "../../shared/chunk-n9nwx58j.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-dpsgb1xw.js";
-import"../../shared/chunk-8y1jf6xr.js";
+} from "../../shared/chunk-7bxsf80c.js";
 export {
   Toggle
 };

package/dist/src/toggle-group/toggle-group.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/toggle-group/toggle-group.js

@@ -1,10 +1,6 @@
 import {
   ToggleGroup
-} from "../../shared/chunk-gt0wth9h.js";
-import"../../shared/chunk-e2v1c9ex.js";
-import"../../shared/chunk-jctqs9m4.js";
-import"../../shared/chunk-vvjyx7fe.js";
-import"../../shared/chunk-dpsgb1xw.js";
+} from "../../shared/chunk-fqa5bwn1.js";
 export {
   ToggleGroup
 };

package/dist/src/tooltip/tooltip.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;
@@ -34,7 +36,7 @@ interface TooltipState {
 }
 interface TooltipElements {
 	trigger: HTMLElement;
-	content: HTMLDivElement;
+	content: HTMLElement;
 }
 declare const Tooltip: {
 	Root: (options?: TooltipOptions) => TooltipElements & {

package/dist/src/tooltip/tooltip.js

@@ -1,11 +1,6 @@
 import {
   Tooltip
-} from "../../shared/chunk-9hj9p7s2.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-myq79qew.js";
 export {
   Tooltip
 };

package/dist/src/utils.d.ts

@@ -1,4 +1,4 @@
-import { onAnimationsComplete } from "@vertz/ui/internals";
+import { onAnimationsComplete } from "@vertz/ui";
 /**
 * Set aria-expanded on an element.
 */
@@ -56,6 +56,21 @@ declare function setDescribedBy(el: HTMLElement, descriptionId: string): void;
 * Set aria-valuenow, aria-valuemin, and aria-valuemax for range widgets.
 */
 declare function setValueRange(el: HTMLElement, now: number, min: number, max: number): void;
+interface ElementAttrs {
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+	id?: string;
+	style?: string;
+	title?: string;
+	role?: string;
+	tabindex?: number | string;
+	hidden?: boolean | string;
+	autofocus?: boolean;
+	[key: `data-${string}`]: string | undefined;
+	[key: `aria-${string}`]: string | undefined;
+}
+declare function applyAttrs(el: HTMLElement, attrs: Record<string, unknown>): void;
 /**
 * Shared dismiss utility for floating elements.
 * Handles click-outside and Escape key dismissal.
@@ -71,6 +86,41 @@ interface DismissOptions {
 * Returns a cleanup function that removes all listeners.
 */
 declare function createDismiss(options: DismissOptions): () => void;
+/**
+* Typed event handler props for interactive themed components.
+*
+* Shared across Button, AlertDialog.Action, AlertDialog.Cancel, etc.
+* Only explicitly listed events are accepted — no arbitrary `on*` string matching.
+*/
+interface ElementEventHandlers {
+	onClick?: (event: MouseEvent) => void;
+	onDblClick?: (event: MouseEvent) => void;
+	onMouseDown?: (event: MouseEvent) => void;
+	onMouseUp?: (event: MouseEvent) => void;
+	onMouseEnter?: (event: MouseEvent) => void;
+	onMouseLeave?: (event: MouseEvent) => void;
+	onFocus?: (event: FocusEvent) => void;
+	onBlur?: (event: FocusEvent) => void;
+	onKeyDown?: (event: KeyboardEvent) => void;
+	onKeyUp?: (event: KeyboardEvent) => void;
+	onPointerDown?: (event: PointerEvent) => void;
+	onPointerUp?: (event: PointerEvent) => void;
+	onInput?: (event: InputEvent) => void;
+	onChange?: (event: Event) => void;
+}
+/**
+* Check if a prop key is a known event handler.
+* Used by components that need to separate event handlers from HTML attributes.
+*/
+declare function isKnownEventHandler(key: string): boolean;
+/**
+* Wire typed event handler props onto a DOM element.
+*
+* Only handlers from the known {@link EVENT_HANDLER_KEYS} set are wired.
+* Converts camelCase prop names to lowercase DOM event names
+* (e.g. `onClick` → `click`, `onKeyDown` → `keydown`).
+*/
+declare function wireEventHandlers(el: HTMLElement, handlers: ElementEventHandlers): void;
 import { Middleware, Placement, Strategy, VirtualElement } from "@floating-ui/dom";
 interface FloatingOptions {
 	placement?: Placement;
@@ -173,4 +223,14 @@ declare function handleListNavigation(event: KeyboardEvent, items: HTMLElement[]
 * Calls the handler and prevents default behavior.
 */
 declare function handleActivation(event: KeyboardEvent, handler: () => void): void;
-export { virtualElement, uniqueId, trapFocus, toggleExpanded, setValueRange, setSelected, setRovingTabindex, setLabelledBy, setHiddenAnimated, setHidden, setExpanded, setDisabled, setDescribedBy, setDataState, setControls, setChecked, saveFocus, resetIdCounter, onAnimationsComplete, linkedIds, isKey, handleListNavigation, handleActivation, getFocusableElements, focusFirst, createFloatingPosition, createDismiss, Keys, FloatingResult, FloatingOptions, DismissOptions };
+/**
+* Apply a bag of props to a DOM element: wire on* event handlers via addEventListener,
+* then forward remaining keys as HTML attributes (delegating to applyAttrs).
+*
+* Use applyAttrs directly if your props bag contains no event handlers.
+*
+* Designed for imperative .ts theme components. JSX .tsx components compiled by Vertz
+* do not need this — the compiler handles event wiring automatically.
+*/
+declare function applyProps(el: HTMLElement, props: Record<string, unknown>): void;
+export { wireEventHandlers, virtualElement, uniqueId, trapFocus, toggleExpanded, setValueRange, setSelected, setRovingTabindex, setLabelledBy, setHiddenAnimated, setHidden, setExpanded, setDisabled, setDescribedBy, setDataState, setControls, setChecked, saveFocus, resetIdCounter, onAnimationsComplete, linkedIds, isKnownEventHandler, isKey, handleListNavigation, handleActivation, getFocusableElements, focusFirst, createFloatingPosition, createDismiss, applyProps, applyAttrs, Keys, FloatingResult, FloatingOptions, ElementEventHandlers, ElementAttrs, DismissOptions };

package/dist/src/utils.js

@@ -17,7 +17,7 @@ import {
   handleActivation,
   handleListNavigation,
   isKey
-} from "../shared/chunk-jctqs9m4.js";
+} from "../shared/chunk-7867pr13.js";
 import {
   setChecked,
   setControls,
@@ -31,16 +31,60 @@ import {
   setSelected,
   setValueRange,
   toggleExpanded
-} from "../shared/chunk-vvjyx7fe.js";
+} from "../shared/chunk-vevfhpc9.js";
 import {
   linkedIds,
   resetIdCounter,
   uniqueId
 } from "../shared/chunk-8y1jf6xr.js";
+import {
+  applyAttrs
+} from "../shared/chunk-2db2dnp3.js";
 
 // src/utils.ts
-import { onAnimationsComplete } from "@vertz/ui/internals";
+import { onAnimationsComplete } from "@vertz/ui";
+
+// src/utils/event-handlers.ts
+var EVENT_HANDLER_KEYS = new Set([
+  "onClick",
+  "onDblClick",
+  "onMouseDown",
+  "onMouseUp",
+  "onMouseEnter",
+  "onMouseLeave",
+  "onFocus",
+  "onBlur",
+  "onKeyDown",
+  "onKeyUp",
+  "onPointerDown",
+  "onPointerUp",
+  "onInput",
+  "onChange"
+]);
+function isKnownEventHandler(key) {
+  return EVENT_HANDLER_KEYS.has(key);
+}
+function wireEventHandlers(el, handlers) {
+  for (const [key, value] of Object.entries(handlers)) {
+    if (!value || !EVENT_HANDLER_KEYS.has(key))
+      continue;
+    const event = key.slice(2).toLowerCase();
+    el.addEventListener(event, value);
+  }
+}
+// src/utils/props.ts
+function applyProps(el, props) {
+  wireEventHandlers(el, props);
+  const attrs = {};
+  for (const [key, value] of Object.entries(props)) {
+    if (isKnownEventHandler(key))
+      continue;
+    attrs[key] = value;
+  }
+  applyAttrs(el, attrs);
+}
 export {
+  wireEventHandlers,
   virtualElement,
   uniqueId,
   trapFocus,
@@ -61,6 +105,7 @@ export {
   resetIdCounter,
   onAnimationsComplete,
   linkedIds,
+  isKnownEventHandler,
   isKey,
   handleListNavigation,
   handleActivation,
@@ -68,5 +113,7 @@ export {
   focusFirst,
   createFloatingPosition,
   createDismiss,
+  applyProps,
+  applyAttrs,
   Keys
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertz/ui-primitives",
-  "version": "0.2.20",
+  "version": "0.2.22",
   "type": "module",
   "license": "MIT",
   "description": "Headless UI primitives for Vertz — Accordion, Dialog, Select, and more",
@@ -36,11 +36,11 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.5",
-    "@vertz/ui": "^0.2.18"
+    "@vertz/ui": "^0.2.21"
   },
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.7.0",
-    "@vertz/ui-compiler": "^0.2.18",
+    "@vertz/ui-compiler": "^0.2.21",
     "bunup": "^0.16.31",
     "happy-dom": "^20.7.0",
     "typescript": "^5.7.0"
@@ -48,7 +48,5 @@
   "engines": {
     "node": ">=22"
   },
-  "sideEffects": [
-    "./dist/shared/*.js"
-  ]
+  "sideEffects": false
 }