@vertz/theme-shadcn 0.2.21 → 0.2.22

package/dist/base.js

@@ -1,6 +1,6 @@
 import {
   configureThemeBase
-} from "./shared/chunk-d2nh1syq.js";
+} from "./shared/chunk-gjsm05ga.js";
 export {
   configureThemeBase
 };

package/dist/index.d.ts

@@ -255,30 +255,41 @@ interface CheckboxRootProps {
 	onCheckedChange?: (checked: CheckedState) => void;
 }
 type ThemedCheckboxComponent = (props: CheckboxRootProps) => HTMLElement;
-import { CollapsibleElements, CollapsibleOptions, CollapsibleState } from "@vertz/ui-primitives";
-interface CollapsibleStyleClasses {
-	readonly content: string;
-}
-declare function createThemedCollapsible(styles: CollapsibleStyleClasses): (options?: CollapsibleOptions) => CollapsibleElements & {
-	state: CollapsibleState;
-};
 import { ChildValue as ChildValue12 } from "@vertz/ui";
+interface CollapsibleRootProps {
+	defaultOpen?: boolean;
+	disabled?: boolean;
+	onOpenChange?: (open: boolean) => void;
+	children?: ChildValue12;
+}
+interface CollapsibleSlotProps {
+	children?: ChildValue12;
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+}
+interface ThemedCollapsibleComponent {
+	(props: CollapsibleRootProps): HTMLElement;
+	Trigger: (props: CollapsibleSlotProps) => HTMLElement;
+	Content: (props: CollapsibleSlotProps) => HTMLElement;
+}
+import { ChildValue as ChildValue13 } from "@vertz/ui";
 interface CommandRootProps {
 	filter?: (value: string, search: string) => boolean;
 	onSelect?: (value: string) => void;
 	onInputChange?: (value: string) => void;
 	placeholder?: string;
-	children?: ChildValue12;
+	children?: ChildValue13;
 }
 interface CommandSlotProps {
-	children?: ChildValue12;
+	children?: ChildValue13;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface CommandItemProps {
 	value: string;
-	children?: ChildValue12;
+	children?: ChildValue13;
 	keywords?: string[];
 	className?: string;
 	/** @deprecated Use `className` instead. */
@@ -286,7 +297,7 @@ interface CommandItemProps {
 }
 interface CommandGroupProps {
 	label: string;
-	children?: ChildValue12;
+	children?: ChildValue13;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -300,33 +311,33 @@ interface ThemedCommandComponent {
 	Group: (props: CommandGroupProps) => HTMLElement;
 	Separator: (props: CommandSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue13 } from "@vertz/ui";
+import { ChildValue as ChildValue14 } from "@vertz/ui";
 interface ContextMenuRootProps {
 	onSelect?: (value: string) => void;
-	children?: ChildValue13;
+	children?: ChildValue14;
 }
 interface ContextMenuSlotProps {
-	children?: ChildValue13;
+	children?: ChildValue14;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface ContextMenuItemProps {
 	value: string;
-	children?: ChildValue13;
+	children?: ChildValue14;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface ContextMenuGroupProps {
 	label: string;
-	children?: ChildValue13;
+	children?: ChildValue14;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface ContextMenuLabelProps {
-	children?: ChildValue13;
+	children?: ChildValue14;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -340,47 +351,71 @@ interface ThemedContextMenuComponent {
 	Label: (props: ContextMenuLabelProps) => HTMLElement;
 	Separator: (props: ContextMenuSlotProps) => HTMLElement;
 }
-import { DatePickerElements, DatePickerOptions, DatePickerState } from "@vertz/ui-primitives";
-interface DatePickerStyleClasses {
-	readonly trigger: string;
-	readonly content: string;
+import { ChildValue as ChildValue15 } from "@vertz/ui";
+interface DatePickerRootProps {
+	mode?: "single" | "range";
+	defaultValue?: Date | {
+		from: Date;
+		to: Date;
+	};
+	defaultMonth?: Date;
+	minDate?: Date;
+	maxDate?: Date;
+	disabled?: (date: Date) => boolean;
+	formatDate?: (date: Date) => string;
+	placeholder?: string;
+	onValueChange?: (value: Date | {
+		from: Date;
+		to: Date;
+	} | null) => void;
+	onOpenChange?: (open: boolean) => void;
+	children?: ChildValue15;
 }
-declare function createThemedDatePicker(styles: DatePickerStyleClasses): (options?: DatePickerOptions) => DatePickerElements & {
-	state: DatePickerState;
-	show: () => void;
-	hide: () => void;
-};
-import { ChildValue as ChildValue14 } from "@vertz/ui";
+interface DatePickerSlotProps {
+	children?: ChildValue15;
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+}
+interface ThemedDatePickerComponent {
+	(props: DatePickerRootProps): HTMLElement;
+	Trigger: (props: DatePickerSlotProps) => HTMLElement;
+	Content: (props: DatePickerSlotProps) => HTMLElement;
+}
+import { ChildValue as ChildValue16 } from "@vertz/ui";
 interface DialogRootProps {
-	children?: ChildValue14;
+	children?: ChildValue16;
 	onOpenChange?: (open: boolean) => void;
 }
 interface DialogSlotProps {
-	children?: ChildValue14;
+	children?: ChildValue16;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
+interface DialogContentProps extends DialogSlotProps {
+	showClose?: boolean;
+}
 interface ThemedDialogComponent {
 	(props: DialogRootProps): HTMLElement;
 	Trigger: (props: DialogSlotProps) => HTMLElement;
-	Content: (props: DialogSlotProps) => HTMLElement;
+	Content: (props: DialogContentProps) => HTMLElement;
 	Header: (props: DialogSlotProps) => HTMLElement;
 	Title: (props: DialogSlotProps) => HTMLElement;
 	Description: (props: DialogSlotProps) => HTMLElement;
 	Footer: (props: DialogSlotProps) => HTMLElement;
 	Close: (props: DialogSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue15 } from "@vertz/ui";
+import { ChildValue as ChildValue17 } from "@vertz/ui";
 import { SheetSide } from "@vertz/ui-primitives";
 type DrawerSide = SheetSide;
 interface DrawerRootProps {
 	side?: DrawerSide;
 	onOpenChange?: (open: boolean) => void;
-	children?: ChildValue15;
+	children?: ChildValue17;
 }
 interface DrawerSlotProps {
-	children?: ChildValue15;
+	children?: ChildValue17;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -395,34 +430,34 @@ interface ThemedDrawerComponent {
 	Footer: (props: DrawerSlotProps) => HTMLElement;
 	Handle: (props: DrawerSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue16 } from "@vertz/ui";
+import { ChildValue as ChildValue18 } from "@vertz/ui";
 interface DropdownMenuRootProps {
 	onSelect?: (value: string) => void;
 	onOpenChange?: (open: boolean) => void;
-	children?: ChildValue16;
+	children?: ChildValue18;
 }
 interface DropdownMenuSlotProps {
-	children?: ChildValue16;
+	children?: ChildValue18;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface DropdownMenuItemProps {
 	value: string;
-	children?: ChildValue16;
+	children?: ChildValue18;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface DropdownMenuGroupProps {
 	label: string;
-	children?: ChildValue16;
+	children?: ChildValue18;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface DropdownMenuLabelProps {
-	children?: ChildValue16;
+	children?: ChildValue18;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -436,44 +471,55 @@ interface ThemedDropdownMenuComponent {
 	Label: (props: DropdownMenuLabelProps) => HTMLElement;
 	Separator: (props: DropdownMenuSlotProps) => HTMLElement;
 }
-import { HoverCardElements, HoverCardOptions, HoverCardState } from "@vertz/ui-primitives";
-interface HoverCardStyleClasses {
-	readonly content: string;
+import { ChildValue as ChildValue19 } from "@vertz/ui";
+interface HoverCardRootProps {
+	openDelay?: number;
+	closeDelay?: number;
+	onOpenChange?: (open: boolean) => void;
+	children?: ChildValue19;
 }
-declare function createThemedHoverCard(styles: HoverCardStyleClasses): (options?: HoverCardOptions) => HoverCardElements & {
-	state: HoverCardState;
-};
-import { ChildValue as ChildValue17 } from "@vertz/ui";
+interface HoverCardSlotProps {
+	children?: ChildValue19;
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+}
+interface ThemedHoverCardComponent {
+	(props: HoverCardRootProps): HTMLElement;
+	Trigger: (props: HoverCardSlotProps) => HTMLElement;
+	Content: (props: HoverCardSlotProps) => HTMLElement;
+}
+import { ChildValue as ChildValue20 } from "@vertz/ui";
 interface MenubarRootProps {
 	onSelect?: (value: string) => void;
-	children?: ChildValue17;
+	children?: ChildValue20;
 }
 interface MenubarMenuProps {
 	value: string;
-	children?: ChildValue17;
+	children?: ChildValue20;
 }
 interface MenubarSlotProps {
-	children?: ChildValue17;
+	children?: ChildValue20;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface MenubarItemProps {
 	value: string;
-	children?: ChildValue17;
+	children?: ChildValue20;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface MenubarGroupProps {
 	label: string;
-	children?: ChildValue17;
+	children?: ChildValue20;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface MenubarLabelProps {
-	children?: ChildValue17;
+	children?: ChildValue20;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -488,26 +534,26 @@ interface ThemedMenubarComponent {
 	Label: (props: MenubarLabelProps) => HTMLElement;
 	Separator: (props: MenubarSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue18 } from "@vertz/ui";
+import { ChildValue as ChildValue21 } from "@vertz/ui";
 interface NavigationMenuRootProps {
 	orientation?: "horizontal" | "vertical";
 	delayOpen?: number;
 	delayClose?: number;
-	children?: ChildValue18;
+	children?: ChildValue21;
 }
 interface NavigationMenuSlotProps {
-	children?: ChildValue18;
+	children?: ChildValue21;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface NavigationMenuItemProps {
 	value: string;
-	children?: ChildValue18;
+	children?: ChildValue21;
 }
 interface NavigationMenuLinkProps {
 	href: string;
-	children?: ChildValue18;
+	children?: ChildValue21;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -526,13 +572,13 @@ interface ThemedNavigationMenuComponent {
 	Link: (props: NavigationMenuLinkProps) => HTMLElement;
 	Viewport: (props: NavigationMenuViewportProps) => HTMLElement;
 }
-import { ChildValue as ChildValue19 } from "@vertz/ui";
+import { ChildValue as ChildValue22 } from "@vertz/ui";
 interface PopoverRootProps {
 	onOpenChange?: (open: boolean) => void;
-	children?: ChildValue19;
+	children?: ChildValue22;
 }
 interface PopoverSlotProps {
-	children?: ChildValue19;
+	children?: ChildValue22;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -542,74 +588,87 @@ interface ThemedPopoverComponent {
 	Trigger: (props: PopoverSlotProps) => HTMLElement;
 	Content: (props: PopoverSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue20 } from "@vertz/ui";
+import { ChildValue as ChildValue23 } from "@vertz/ui";
 interface ProgressRootProps {
-	children?: ChildValue20;
+	children?: ChildValue23;
 	defaultValue?: number;
 	min?: number;
 	max?: number;
 }
 type ThemedProgressComponent = (props: ProgressRootProps) => HTMLElement;
-import { ChildValue as ChildValue21 } from "@vertz/ui";
+import { ChildValue as ChildValue24 } from "@vertz/ui";
 interface RadioGroupRootProps {
-	children?: ChildValue21;
+	children?: ChildValue24;
 	defaultValue?: string;
 	onValueChange?: (value: string) => void;
 }
 interface RadioGroupItemProps {
 	value: string;
 	disabled?: boolean;
-	children?: ChildValue21;
+	children?: ChildValue24;
 }
 interface ThemedRadioGroupComponent {
 	(props: RadioGroupRootProps): HTMLElement;
 	Item: (props: RadioGroupItemProps) => HTMLElement;
 }
-import { PanelOptions, ResizablePanelElements, ResizablePanelOptions, ResizablePanelState } from "@vertz/ui-primitives";
+import { ChildValue as ChildValue25 } from "@vertz/ui";
+import { PanelOptions } from "@vertz/ui-primitives";
 interface ResizablePanelStyleClasses {
 	readonly root: string;
 	readonly panel: string;
 	readonly handle: string;
 }
-declare function createThemedResizablePanel(styles: ResizablePanelStyleClasses): (options?: ResizablePanelOptions) => ResizablePanelElements & {
-	state: ResizablePanelState;
-	Panel: (panelOptions?: PanelOptions) => HTMLDivElement;
-	Handle: () => HTMLDivElement;
-};
-import { ScrollAreaElements, ScrollAreaOptions, ScrollAreaState } from "@vertz/ui-primitives";
-interface ScrollAreaStyleClasses {
-	readonly root: string;
-	readonly viewport: string;
-	readonly scrollbar: string;
-	readonly thumb: string;
+interface ResizablePanelRootProps {
+	orientation?: "horizontal" | "vertical";
+	onResize?: (sizes: number[]) => void;
+	children?: ChildValue25;
 }
-declare function createThemedScrollArea(styles: ScrollAreaStyleClasses): (options?: ScrollAreaOptions) => ScrollAreaElements & {
-	state: ScrollAreaState;
-	update: () => void;
-};
-import { ChildValue as ChildValue22 } from "@vertz/ui";
+interface ResizablePanelPanelProps extends PanelOptions {
+	children?: ChildValue25;
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+}
+interface ResizablePanelHandleProps {
+	className?: string;
+	/** @deprecated Use `className` instead. */
+	class?: string;
+}
+interface ThemedResizablePanelComponent {
+	(props: ResizablePanelRootProps): HTMLElement;
+	Panel: (props: ResizablePanelPanelProps) => HTMLElement;
+	Handle: (props: ResizablePanelHandleProps) => HTMLElement;
+}
+declare function createThemedResizablePanel(styles: ResizablePanelStyleClasses): ThemedResizablePanelComponent;
+import { ChildValue as ChildValue26 } from "@vertz/ui";
+interface ScrollAreaRootProps {
+	orientation?: "vertical" | "horizontal" | "both";
+	children?: ChildValue26;
+}
+type ThemedScrollAreaComponent = (props: ScrollAreaRootProps) => HTMLElement;
+import { ChildValue as ChildValue27 } from "@vertz/ui";
 interface SelectRootProps {
 	defaultValue?: string;
 	placeholder?: string;
 	onValueChange?: (value: string) => void;
-	children?: ChildValue22;
+	children?: ChildValue27;
 }
 interface SelectSlotProps {
-	children?: ChildValue22;
+	children?: ChildValue27;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface SelectItemProps {
 	value: string;
-	children?: ChildValue22;
+	children?: ChildValue27;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface SelectGroupProps {
 	label: string;
-	children?: ChildValue22;
+	children?: ChildValue27;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -622,30 +681,33 @@ interface ThemedSelectComponent {
 	Group: (props: SelectGroupProps) => HTMLElement;
 	Separator: (props: SelectSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue23 } from "@vertz/ui";
+import { ChildValue as ChildValue28 } from "@vertz/ui";
 import { SheetSide as SheetSide2 } from "@vertz/ui-primitives";
 interface SheetRootProps {
 	side?: SheetSide2;
 	onOpenChange?: (open: boolean) => void;
-	children?: ChildValue23;
+	children?: ChildValue28;
 }
 interface SheetSlotProps {
-	children?: ChildValue23;
+	children?: ChildValue28;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
+interface SheetContentProps extends SheetSlotProps {
+	showClose?: boolean;
+}
 interface ThemedSheetComponent {
 	(props: SheetRootProps): HTMLElement;
 	Trigger: (props: SheetSlotProps) => HTMLElement;
-	Content: (props: SheetSlotProps) => HTMLElement;
+	Content: (props: SheetContentProps) => HTMLElement;
 	Title: (props: SheetSlotProps) => HTMLElement;
 	Description: (props: SheetSlotProps) => HTMLElement;
 	Close: (props: SheetSlotProps) => HTMLElement;
 }
-import { ChildValue as ChildValue24 } from "@vertz/ui";
+import { ChildValue as ChildValue29 } from "@vertz/ui";
 interface SliderRootProps {
-	children?: ChildValue24;
+	children?: ChildValue29;
 	defaultValue?: number;
 	min?: number;
 	max?: number;
@@ -654,37 +716,37 @@ interface SliderRootProps {
 	onValueChange?: (value: number) => void;
 }
 type ThemedSliderComponent = (props: SliderRootProps) => HTMLElement;
-import { ChildValue as ChildValue25 } from "@vertz/ui";
+import { ChildValue as ChildValue30 } from "@vertz/ui";
 interface ThemedSwitchProps {
-	children?: ChildValue25;
+	children?: ChildValue30;
 	defaultChecked?: boolean;
 	disabled?: boolean;
 	onCheckedChange?: (checked: boolean) => void;
 	size?: "default" | "sm";
 }
 type ThemedSwitchComponent = (props: ThemedSwitchProps) => HTMLElement;
-import { ChildValue as ChildValue26 } from "@vertz/ui";
+import { ChildValue as ChildValue31 } from "@vertz/ui";
 interface TabsRootProps {
 	defaultValue?: string;
 	variant?: "default" | "line";
-	children?: ChildValue26;
+	children?: ChildValue31;
 }
 interface TabsSlotProps {
-	children?: ChildValue26;
+	children?: ChildValue31;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface TabsTriggerProps {
 	value: string;
-	children?: ChildValue26;
+	children?: ChildValue31;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
 }
 interface TabsContentProps {
 	value: string;
-	children?: ChildValue26;
+	children?: ChildValue31;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -701,30 +763,38 @@ type ThemedToastResult = ToastElements & {
 	announce: (content: string) => ToastMessage;
 	dismiss: (id: string) => void;
 };
-import { ChildValue as ChildValue27 } from "@vertz/ui";
+import { ChildValue as ChildValue32 } from "@vertz/ui";
 interface ToggleRootProps {
-	children?: ChildValue27;
+	children?: ChildValue32;
 	defaultPressed?: boolean;
 	disabled?: boolean;
 	onPressedChange?: (pressed: boolean) => void;
 }
 type ThemedToggleComponent = (props: ToggleRootProps) => HTMLElement;
-import { ToggleGroupElements, ToggleGroupOptions, ToggleGroupState } from "@vertz/ui-primitives";
-interface ToggleGroupStyleClasses {
-	readonly root: string;
-	readonly item: string;
+import { ChildValue as ChildValue33 } from "@vertz/ui";
+interface ToggleGroupRootProps {
+	children?: ChildValue33;
+	type?: "single" | "multiple";
+	defaultValue?: string[];
+	orientation?: "horizontal" | "vertical";
+	disabled?: boolean;
+	onValueChange?: (value: string[]) => void;
 }
-declare function createThemedToggleGroup(styles: ToggleGroupStyleClasses): (options?: ToggleGroupOptions) => ToggleGroupElements & {
-	state: ToggleGroupState;
-	Item: (value: string) => HTMLButtonElement;
-};
-import { ChildValue as ChildValue28 } from "@vertz/ui";
+interface ToggleGroupItemProps {
+	value: string;
+	children?: ChildValue33;
+}
+interface ThemedToggleGroupComponent {
+	(props: ToggleGroupRootProps): HTMLElement;
+	Item: (props: ToggleGroupItemProps) => HTMLElement;
+}
+import { ChildValue as ChildValue34 } from "@vertz/ui";
 interface TooltipRootProps {
 	delay?: number;
-	children?: ChildValue28;
+	children?: ChildValue34;
 }
 interface TooltipSlotProps {
-	children?: ChildValue28;
+	children?: ChildValue34;
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -735,6 +805,7 @@ interface ThemedTooltipComponent {
 	Content: (props: TooltipSlotProps) => HTMLElement;
 }
 interface SeparatorProps {
+	orientation?: "horizontal" | "vertical";
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
@@ -749,12 +820,12 @@ interface SkeletonProps {
 interface SkeletonComponents {
 	Skeleton: (props?: SkeletonProps) => HTMLDivElement;
 }
-import { ChildValue as ChildValue29 } from "@vertz/ui";
+import { ChildValue as ChildValue35 } from "@vertz/ui";
 interface TableProps {
 	className?: string;
 	/** @deprecated Use `className` instead. */
 	class?: string;
-	children?: ChildValue29;
+	children?: ChildValue35;
 }
 interface TableComponents {
 	Table: (props: TableProps) => HTMLDivElement;
@@ -1214,29 +1285,29 @@ interface ThemedPrimitives {
 	/** Themed Carousel — composable JSX component with Carousel.Slide, Carousel.Previous, Carousel.Next. */
 	Carousel: ThemedCarouselComponent;
 	/** Themed Collapsible — expandable/collapsible content section. */
-	collapsible: ReturnType<typeof createThemedCollapsible>;
+	Collapsible: ThemedCollapsibleComponent;
 	/** Themed Command — composable JSX component with Command.Input, Command.List, Command.Item, Command.Group, etc. */
 	Command: ThemedCommandComponent;
 	/** Themed ContextMenu — composable JSX component with ContextMenu.Trigger, ContextMenu.Content, etc. */
 	ContextMenu: ThemedContextMenuComponent;
-	/** Themed DatePicker — date picker composing Calendar + Popover. */
-	datePicker: ReturnType<typeof createThemedDatePicker>;
+	/** Themed DatePicker — composable JSX component with DatePicker.Trigger, DatePicker.Content. */
+	DatePicker: ThemedDatePickerComponent;
 	/** Themed Drawer — composable JSX component with Drawer.Trigger, Drawer.Content, Drawer.Handle, etc. */
 	Drawer: ThemedDrawerComponent;
 	/** Themed HoverCard — hover-triggered interactive card. */
-	hoverCard: ReturnType<typeof createThemedHoverCard>;
+	HoverCard: ThemedHoverCardComponent;
 	/** Themed Menubar — composable JSX component with Menubar.Menu, Menubar.Trigger, Menubar.Content, etc. */
 	Menubar: ThemedMenubarComponent;
 	/** Themed NavigationMenu — composable JSX component with NavigationMenu.List, NavigationMenu.Item, etc. */
 	NavigationMenu: ThemedNavigationMenuComponent;
 	/** Themed ResizablePanel — resizable panel layout with drag handles. */
-	resizablePanel: ReturnType<typeof createThemedResizablePanel>;
-	/** Themed ScrollArea — custom scrollbars. */
-	scrollArea: ReturnType<typeof createThemedScrollArea>;
+	ResizablePanel: ReturnType<typeof createThemedResizablePanel>;
+	/** Themed ScrollArea — composable JSX component wrapping @vertz/ui-primitives ScrollArea. */
+	ScrollArea: ThemedScrollAreaComponent;
 	/** Themed Toggle — composable JSX component wrapping @vertz/ui-primitives Toggle. */
 	Toggle: ThemedToggleComponent;
-	/** Themed ToggleGroup — group of toggle buttons. */
-	toggleGroup: ReturnType<typeof createThemedToggleGroup>;
+	/** Themed ToggleGroup — composable JSX component with ToggleGroup.Item sub-components. */
+	ToggleGroup: ThemedToggleGroupComponent;
 }
 /** Component functions returned by configureTheme(). */
 interface ThemeComponents {
@@ -1325,13 +1396,13 @@ declare module "@vertz/ui/components" {
 		Toast: ThemedPrimitives["Toast"];
 		Carousel: ThemedCarouselComponent;
 		Command: ThemedCommandComponent;
-		collapsible: ThemedPrimitives["collapsible"];
-		datePicker: ThemedPrimitives["datePicker"];
-		hoverCard: ThemedPrimitives["hoverCard"];
+		Collapsible: ThemedCollapsibleComponent;
+		DatePicker: ThemedDatePickerComponent;
+		HoverCard: ThemedHoverCardComponent;
 		NavigationMenu: ThemedNavigationMenuComponent;
-		resizablePanel: ThemedPrimitives["resizablePanel"];
-		scrollArea: ThemedPrimitives["scrollArea"];
-		toggleGroup: ThemedPrimitives["toggleGroup"];
+		ResizablePanel: ThemedResizablePanelComponent;
+		ScrollArea: ThemedPrimitives["ScrollArea"];
+		ToggleGroup: ThemedToggleGroupComponent;
 	}
 }
 export { configureTheme, ThemedPrimitives, ThemeStyles, ThemeStyle, ThemeConfig, ThemeComponents, ResolvedThemeBase, ResolvedTheme };

package/dist/index.js

@@ -8,7 +8,7 @@ import {
 } from "./shared/chunk-gzfp8m46.js";
 import {
   configureThemeBase
-} from "./shared/chunk-d2nh1syq.js";
+} from "./shared/chunk-gjsm05ga.js";
 
 // src/components/alert.ts
 import { resolveChildren } from "@vertz/ui";
@@ -478,7 +478,7 @@ function createThemedAccordion(styles) {
 // src/components/primitives/alert-dialog.ts
 import { ComposedAlertDialog, withStyles as withStyles2 } from "@vertz/ui-primitives";
 function createThemedAlertDialog(styles) {
-  const StyledAlertDialog = withStyles2(ComposedAlertDialog, {
+  return withStyles2(ComposedAlertDialog, {
     overlay: styles.overlay,
     content: styles.panel,
     cancel: styles.cancel,
@@ -488,27 +488,6 @@ function createThemedAlertDialog(styles) {
     footer: styles.footer,
     header: ""
   });
-  function AlertDialogRoot({
-    children,
-    onOpenChange,
-    onAction
-  }) {
-    return StyledAlertDialog({
-      children,
-      onOpenChange,
-      onAction
-    });
-  }
-  return Object.assign(AlertDialogRoot, {
-    Trigger: StyledAlertDialog.Trigger,
-    Content: StyledAlertDialog.Content,
-    Header: StyledAlertDialog.Header,
-    Title: StyledAlertDialog.Title,
-    Description: StyledAlertDialog.Description,
-    Footer: StyledAlertDialog.Footer,
-    Cancel: StyledAlertDialog.Cancel,
-    Action: StyledAlertDialog.Action
-  });
 }
 
 // src/components/primitives/calendar.ts
@@ -573,14 +552,29 @@ function createThemedCheckbox(styles) {
   };
 }
 
-// src/components/primitives/collapsible.ts
-import { Collapsible } from "@vertz/ui-primitives";
+// src/components/primitives/collapsible.tsx
+import { ComposedCollapsible } from "@vertz/ui-primitives";
 function createThemedCollapsible(styles) {
-  return function themedCollapsible(options) {
-    const result = Collapsible.Root(options);
-    result.content.classList.add(styles.content);
-    return result;
-  };
+  function CollapsibleRoot({
+    children,
+    defaultOpen,
+    disabled,
+    onOpenChange
+  }) {
+    return ComposedCollapsible({
+      children,
+      defaultOpen,
+      disabled,
+      onOpenChange,
+      classes: {
+        content: styles.content
+      }
+    });
+  }
+  return Object.assign(CollapsibleRoot, {
+    Trigger: ComposedCollapsible.Trigger,
+    Content: ComposedCollapsible.Content
+  });
 }
 
 // src/components/primitives/command.tsx
@@ -644,21 +638,51 @@ function createThemedContextMenu(styles) {
   });
 }
 
-// src/components/primitives/date-picker.ts
-import { DatePicker } from "@vertz/ui-primitives";
-function createThemedDatePicker(styles) {
-  return function themedDatePicker(options) {
-    const result = DatePicker.Root(options);
-    result.trigger.classList.add(styles.trigger);
-    result.content.classList.add(styles.content);
-    return result;
-  };
+// src/components/primitives/date-picker.tsx
+import { ComposedDatePicker } from "@vertz/ui-primitives";
+function createThemedDatePicker(styles, calendarClasses) {
+  function DatePickerRoot({
+    children,
+    mode,
+    defaultValue,
+    defaultMonth,
+    minDate,
+    maxDate,
+    disabled,
+    formatDate,
+    placeholder,
+    onValueChange,
+    onOpenChange
+  }) {
+    return ComposedDatePicker({
+      children,
+      mode,
+      defaultValue,
+      defaultMonth,
+      minDate,
+      maxDate,
+      disabled,
+      formatDate,
+      placeholder,
+      onValueChange,
+      onOpenChange,
+      classes: {
+        trigger: styles.trigger,
+        content: styles.content,
+        calendar: calendarClasses
+      }
+    });
+  }
+  return Object.assign(DatePickerRoot, {
+    Trigger: ComposedDatePicker.Trigger,
+    Content: ComposedDatePicker.Content
+  });
 }
 
 // src/components/primitives/dialog.ts
 import { ComposedDialog, withStyles as withStyles8 } from "@vertz/ui-primitives";
 function createThemedDialog(styles) {
-  const StyledDialog = withStyles8(ComposedDialog, {
+  return withStyles8(ComposedDialog, {
     overlay: styles.overlay,
     content: styles.panel,
     close: styles.close,
@@ -667,27 +691,6 @@ function createThemedDialog(styles) {
     description: styles.description,
     footer: styles.footer
   });
-  function DialogRoot({ children, onOpenChange }) {
-    const closeIcon = document.createElement("button");
-    closeIcon.type = "button";
-    closeIcon.className = styles.close;
-    closeIcon.setAttribute("aria-label", "Close");
-    closeIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>';
-    return StyledDialog({
-      children,
-      onOpenChange,
-      closeIcon
-    });
-  }
-  return Object.assign(DialogRoot, {
-    Trigger: StyledDialog.Trigger,
-    Content: StyledDialog.Content,
-    Header: StyledDialog.Header,
-    Title: StyledDialog.Title,
-    Description: StyledDialog.Description,
-    Footer: StyledDialog.Footer,
-    Close: StyledDialog.Close
-  });
 }
 
 // src/components/primitives/drawer.tsx
@@ -805,17 +808,30 @@ function createThemedDropdownMenu(styles) {
   });
 }
 
-// src/components/primitives/hover-card.ts
-import { HoverCard } from "@vertz/ui-primitives";
+// src/components/primitives/hover-card.tsx
+import { ComposedHoverCard } from "@vertz/ui-primitives";
 function createThemedHoverCard(styles) {
-  return function themedHoverCard(options) {
-    const result = HoverCard.Root({
-      ...options,
-      positioning: { placement: "bottom", portal: true }
+  function HoverCardRoot({
+    children,
+    openDelay,
+    closeDelay,
+    onOpenChange
+  }) {
+    return ComposedHoverCard({
+      children,
+      openDelay,
+      closeDelay,
+      onOpenChange,
+      positioning: { placement: "bottom", portal: true },
+      classes: {
+        content: styles.content
+      }
     });
-    result.content.classList.add(styles.content);
-    return result;
-  };
+  }
+  return Object.assign(HoverCardRoot, {
+    Trigger: ComposedHoverCard.Trigger,
+    Content: ComposedHoverCard.Content
+  });
 }
 
 // src/components/primitives/menubar.ts
@@ -910,7 +926,8 @@ function createThemedRadioGroup(styles) {
   const StyledRadioGroup = withStyles13(ComposedRadioGroup, {
     root: styles.root,
     item: styles.item,
-    indicator: styles.indicator
+    indicator: styles.indicator,
+    indicatorIcon: styles.indicatorIcon
   });
   function RadioGroupRoot(props) {
     return StyledRadioGroup(props);
@@ -920,44 +937,47 @@ function createThemedRadioGroup(styles) {
   });
 }
 
-// src/components/primitives/resizable-panel.ts
-import { ResizablePanel } from "@vertz/ui-primitives";
+// src/components/primitives/resizable-panel.tsx
+import { ComposedResizablePanel } from "@vertz/ui-primitives";
 function createThemedResizablePanel(styles) {
-  return function themedResizablePanel(options) {
-    const result = ResizablePanel.Root(options);
-    result.root.classList.add(styles.root);
-    const originalPanel = result.Panel;
-    const originalHandle = result.Handle;
-    return {
-      root: result.root,
-      state: result.state,
-      Panel: (panelOptions) => {
-        const panel = originalPanel(panelOptions);
-        panel.classList.add(styles.panel);
-        return panel;
-      },
-      Handle: () => {
-        const handle = originalHandle();
-        handle.classList.add(styles.handle);
-        return handle;
+  function ResizablePanelRoot({
+    children,
+    orientation,
+    onResize
+  }) {
+    return ComposedResizablePanel({
+      children,
+      orientation,
+      onResize,
+      classes: {
+        root: styles.root,
+        panel: styles.panel,
+        handle: styles.handle
       }
-    };
-  };
+    });
+  }
+  return Object.assign(ResizablePanelRoot, {
+    Panel: ComposedResizablePanel.Panel,
+    Handle: ComposedResizablePanel.Handle
+  });
 }
 
-// src/components/primitives/scroll-area.ts
-import { ScrollArea } from "@vertz/ui-primitives";
+// src/components/primitives/scroll-area.tsx
+import { ComposedScrollArea } from "@vertz/ui-primitives";
 function createThemedScrollArea(styles) {
-  return function themedScrollArea(options) {
-    const result = ScrollArea.Root(options);
-    result.root.classList.add(styles.root);
-    result.viewport.classList.add(styles.viewport);
-    result.scrollbarY.classList.add(styles.scrollbar);
-    result.thumbY.classList.add(styles.thumb);
-    result.scrollbarX.classList.add(styles.scrollbar);
-    result.thumbX.classList.add(styles.thumb);
-    return result;
-  };
+  function ScrollAreaRoot({ children, orientation }) {
+    return ComposedScrollArea({
+      children,
+      orientation,
+      classes: {
+        root: styles.root,
+        viewport: styles.viewport,
+        scrollbar: styles.scrollbar,
+        thumb: styles.thumb
+      }
+    });
+  }
+  return ScrollAreaRoot;
 }
 
 // src/components/primitives/select.ts
@@ -1112,26 +1132,25 @@ function createThemedToggle(styles) {
   };
 }
 
-// src/components/primitives/toggle-group.ts
-import { ToggleGroup } from "@vertz/ui-primitives";
+// src/components/primitives/toggle-group.tsx
+import { ComposedToggleGroup, withStyles as withStyles18 } from "@vertz/ui-primitives";
 function createThemedToggleGroup(styles) {
-  return function themedToggleGroup(options) {
-    const result = ToggleGroup.Root(options);
-    result.root.classList.add(styles.root);
-    const originalItem = result.Item;
-    result.Item = (value) => {
-      const item = originalItem(value);
-      item.classList.add(styles.item);
-      return item;
-    };
-    return result;
-  };
+  const StyledToggleGroup = withStyles18(ComposedToggleGroup, {
+    root: styles.root,
+    item: styles.item
+  });
+  function ToggleGroupRoot(props) {
+    return StyledToggleGroup(props);
+  }
+  return Object.assign(ToggleGroupRoot, {
+    Item: ComposedToggleGroup.Item
+  });
 }
 
 // src/components/primitives/tooltip.ts
-import { ComposedTooltip, withStyles as withStyles18 } from "@vertz/ui-primitives";
+import { ComposedTooltip, withStyles as withStyles19 } from "@vertz/ui-primitives";
 function createThemedTooltip(styles) {
-  const StyledTooltip = withStyles18(ComposedTooltip, {
+  const StyledTooltip = withStyles19(ComposedTooltip, {
     content: styles.content
   });
   function TooltipRoot({ children, delay }) {
@@ -1145,10 +1164,17 @@ function createThemedTooltip(styles) {
 
 // src/components/separator.ts
 function createSeparatorComponent(separatorStyles) {
-  return function Separator({ className, class: classProp }) {
+  return function Separator({
+    orientation = "horizontal",
+    className,
+    class: classProp
+  }) {
     const effectiveClass = className ?? classProp;
+    const orientationClass = orientation === "vertical" ? separatorStyles.vertical : separatorStyles.horizontal;
     const el = document.createElement("hr");
-    el.className = [separatorStyles.base, effectiveClass].filter(Boolean).join(" ");
+    el.className = [separatorStyles.base, orientationClass, effectiveClass].filter(Boolean).join(" ");
+    el.setAttribute("role", "separator");
+    el.setAttribute("aria-orientation", orientation);
     return el;
   };
 }
@@ -1354,6 +1380,12 @@ function createAccordionStyles() {
       },
       {
         '&[data-state="closed"]': [animationDecl(`${accordionUp} 200ms ease-out forwards`)]
+      },
+      {
+        '& [data-part="content-inner"]': {
+          "padding-bottom": "1rem",
+          "padding-top": "0"
+        }
       }
     ]
   });
@@ -1424,8 +1456,6 @@ function createAlertDialogStyles() {
       }
     ],
     alertDialogPanel: [
-      "fixed",
-      "z:50",
       "bg:background",
       "gap:4",
       {
@@ -1436,11 +1466,24 @@ function createAlertDialogStyles() {
           "box-shadow": "0 0 0 1px color-mix(in oklch, var(--color-foreground) 10%, transparent)",
           "border-radius": "0.75rem",
           padding: "1rem",
-          inset: "0",
           margin: "auto",
           height: "fit-content",
+          outline: "none",
+          border: "none",
           "container-type": "inline-size"
         },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 100ms ease-out forwards"
+        },
         "@media (min-width: 640px)": { "max-width": "24rem" }
       },
       {
@@ -2132,8 +2175,6 @@ function createDialogStyles() {
       }
     ],
     dialogPanel: [
-      "fixed",
-      "z:50",
       "bg:background",
       "gap:4",
       {
@@ -2145,12 +2186,24 @@ function createDialogStyles() {
           "border-radius": "0.75rem",
           padding: "1rem",
           "font-size": "0.875rem",
-          inset: "0",
           margin: "auto",
           height: "fit-content",
           outline: "none",
+          border: "none",
           "container-type": "inline-size"
         },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 100ms ease-out forwards"
+        },
         "@media (min-width: 640px)": { "max-width": "24rem" }
       },
       {
@@ -2402,6 +2455,7 @@ function createDropdownMenuStyles() {
       "bg:popover",
       "text:popover-foreground",
       "rounded:lg",
+      "w:fit",
       "p:1",
       {
         "&": {
@@ -2787,6 +2841,7 @@ function createPopoverStyles() {
       "bg:popover",
       "text:popover-foreground",
       "rounded:lg",
+      "w:fit",
       "flex",
       "flex-col",
       "gap:2.5",
@@ -3031,7 +3086,15 @@ function createSelectStyles() {
       focusRing11,
       { "&:disabled": ["pointer-events-none", "opacity:0.5"] },
       { '&[data-state="open"]': ["border:ring"] },
-      { [DARK]: [bgOpacity("input", 30)] }
+      { [DARK]: [bgOpacity("input", 30)] },
+      {
+        '& [data-part="chevron"]': {
+          opacity: "0.5",
+          "flex-shrink": "0",
+          display: "flex",
+          "align-items": "center"
+        }
+      }
     ],
     selectContent: [
       "z:50",
@@ -3203,7 +3266,24 @@ function createSheetStyles() {
         "&": {
           inset: "0 auto 0 0",
           width: "75%",
-          "max-width": "24rem"
+          "max-width": "24rem",
+          height: "100dvh",
+          "max-height": "none",
+          margin: "0",
+          outline: "none",
+          border: "none"
+        },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 300ms ease-out forwards"
         }
       },
       {
@@ -3220,7 +3300,24 @@ function createSheetStyles() {
         "&": {
           inset: "0 0 0 auto",
           width: "75%",
-          "max-width": "24rem"
+          "max-width": "24rem",
+          height: "100dvh",
+          "max-height": "none",
+          margin: "0",
+          outline: "none",
+          border: "none"
+        },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 300ms ease-out forwards"
         }
       },
       {
@@ -3234,7 +3331,26 @@ function createSheetStyles() {
       ...PANEL_BASE2,
       "border-b:1",
       {
-        "&": { inset: "0 0 auto 0" }
+        "&": {
+          inset: "0 0 auto 0",
+          width: "100dvw",
+          "max-width": "none",
+          margin: "0",
+          outline: "none",
+          border: "none"
+        },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 300ms ease-out forwards"
+        }
       },
       {
         '&[data-state="open"]': [animationDecl("vz-slide-in-from-top 300ms ease-out forwards")]
@@ -3247,7 +3363,26 @@ function createSheetStyles() {
       ...PANEL_BASE2,
       "border-t:1",
       {
-        "&": { inset: "auto 0 0 0" }
+        "&": {
+          inset: "auto 0 0 0",
+          width: "100dvw",
+          "max-width": "none",
+          margin: "0",
+          outline: "none",
+          border: "none"
+        },
+        "&:not([open])": { display: "none" },
+        "&::backdrop": {
+          "background-color": "oklch(0 0 0 / 10%)",
+          "backdrop-filter": "blur(4px)",
+          "-webkit-backdrop-filter": "blur(4px)"
+        },
+        '&[data-state="open"]::backdrop': {
+          animation: "vz-fade-in 100ms ease-out forwards"
+        },
+        '&[data-state="closed"]::backdrop': {
+          animation: "vz-fade-out 300ms ease-out forwards"
+        }
       },
       {
         '&[data-state="open"]': [animationDecl("vz-slide-in-from-bottom 300ms ease-out forwards")]
@@ -4011,18 +4146,18 @@ function configureTheme(config) {
       Sheet: createThemedSheet(sheetStyles),
       Calendar: createThemedCalendar(calendarStyles),
       Carousel: createThemedCarousel(carouselStyles),
-      collapsible: createThemedCollapsible(collapsibleStyles),
+      Collapsible: createThemedCollapsible(collapsibleStyles),
       Command: createThemedCommand(commandStyles),
       ContextMenu: createThemedContextMenu(contextMenuStyles),
-      datePicker: createThemedDatePicker(datePickerStyles),
+      DatePicker: createThemedDatePicker(datePickerStyles, calendarStyles),
       Drawer: createThemedDrawer(drawerStyles),
-      hoverCard: createThemedHoverCard(hoverCardStyles),
+      HoverCard: createThemedHoverCard(hoverCardStyles),
       Menubar: createThemedMenubar(menubarStyles),
       NavigationMenu: createThemedNavigationMenu(navigationMenuStyles),
-      resizablePanel: createThemedResizablePanel(resizablePanelStyles),
-      scrollArea: createThemedScrollArea(scrollAreaStyles),
+      ResizablePanel: createThemedResizablePanel(resizablePanelStyles),
+      ScrollArea: createThemedScrollArea(scrollAreaStyles),
       Toggle: createThemedToggle(toggleStyles),
-      toggleGroup: createThemedToggleGroup(toggleGroupStyles)
+      ToggleGroup: createThemedToggleGroup(toggleGroupStyles)
     }
   };
   return { theme, globals, styles, components };

package/dist/shared/{chunk-d2nh1syq.js → chunk-gjsm05ga.js}

@@ -379,6 +379,9 @@ function configureThemeBase(config) {
       color: "var(--color-foreground)",
       backgroundColor: "var(--color-background)"
     },
+    "dialog:not([open])": {
+      display: "none"
+    },
     'input[type="checkbox"]': {
       appearance: "none",
       width: "1rem",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertz/theme-shadcn",
-  "version": "0.2.21",
+  "version": "0.2.22",
   "type": "module",
   "license": "MIT",
   "description": "Shadcn-inspired theme for Vertz — pre-built style definitions using variants() and css()",
@@ -39,12 +39,12 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@vertz/ui": "^0.2.20",
-    "@vertz/ui-primitives": "^0.2.20"
+    "@vertz/ui": "^0.2.21",
+    "@vertz/ui-primitives": "^0.2.21"
   },
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.7.0",
-    "@vertz/ui-compiler": "^0.2.20",
+    "@vertz/ui-compiler": "^0.2.21",
     "bunup": "^0.16.31",
     "happy-dom": "^20.7.0",
     "typescript": "^5.7.0"