@questpie/admin 3.0.3 → 3.0.4

package/dist/client/components/ui/select.mjs

@@ -8,6 +8,38 @@ import { Select } from "@base-ui/react/select";
 
 //#region src/client/components/ui/select.tsx
 const Select$1 = Select.Root;
+function SelectGroup(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("qa-select__group scroll-my-1 p-1", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Select.Group, {
+			"data-slot": "select-group",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
 function SelectValue(t0) {
 	const $ = c(8);
 	let className;
@@ -41,55 +73,61 @@ function SelectValue(t0) {
 	return t2;
 }
 function SelectTrigger(t0) {
-	const $ = c(13);
+	const $ = c(15);
 	let children;
 	let className;
 	let props;
 	let t1;
+	let t2;
 	if ($[0] !== t0) {
-		({className, size: t1, children, ...props} = t0);
+		({className, size: t1, children, type: t2, ...props} = t0);
 		$[0] = t0;
 		$[1] = children;
 		$[2] = className;
 		$[3] = props;
 		$[4] = t1;
+		$[5] = t2;
 	} else {
 		children = $[1];
 		className = $[2];
 		props = $[3];
 		t1 = $[4];
+		t2 = $[5];
 	}
 	const size = t1 === void 0 ? "default" : t1;
-	let t2;
-	if ($[5] !== className) {
-		t2 = cn("qa-select__trigger border-input data-[placeholder]:text-muted-foreground bg-transparent font-mono focus-visible:border-ring focus-visible:ring-ring/30 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex w-fit items-center justify-between gap-2 border px-3 py-2 text-sm whitespace-nowrap transition-all outline-none focus-visible:ring-[2px] disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-[2px] data-[size=default]:h-9 data-[size=sm]:h-7 data-[size=sm]:px-2.5 data-[size=sm]:text-xs *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className);
-		$[5] = className;
-		$[6] = t2;
-	} else t2 = $[6];
+	const type = t2 === void 0 ? "button" : t2;
 	let t3;
-	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
-		t3 = /* @__PURE__ */ jsx(Select.Icon, { render: /* @__PURE__ */ jsx(Icon, {
-			icon: "ph:caret-down",
-			className: "text-muted-foreground pointer-events-none size-4"
-		}) });
+	if ($[6] !== className) {
+		t3 = cn("qa-select__trigger control-surface font-chrome data-[placeholder]:text-muted-foreground focus-visible:border-border-strong focus-visible:ring-ring/20 aria-expanded:border-border-strong aria-expanded:ring-ring/20 aria-invalid:border-border-strong aria-invalid:ring-ring/20 flex w-fit items-center justify-between gap-2 px-3 py-2 text-sm whitespace-nowrap outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 aria-expanded:ring-[3px] aria-invalid:ring-[3px] data-[size=sm]:h-8 data-[size=sm]:px-2.5 data-[size=sm]:text-xs *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className);
+		$[6] = className;
 		$[7] = t3;
 	} else t3 = $[7];
 	let t4;
-	if ($[8] !== children || $[9] !== props || $[10] !== size || $[11] !== t2) {
-		t4 = /* @__PURE__ */ jsxs(Select.Trigger, {
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Select.Icon, { render: /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:caret-down",
+			className: "text-muted-foreground pointer-events-none size-4"
+		}) });
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== children || $[10] !== props || $[11] !== size || $[12] !== t3 || $[13] !== type) {
+		t5 = /* @__PURE__ */ jsxs(Select.Trigger, {
 			"data-slot": "select-trigger",
 			"data-size": size,
-			className: t2,
+			type,
+			className: t3,
 			...props,
-			children: [children, t3]
+			children: [children, t4]
 		});
-		$[8] = children;
-		$[9] = props;
-		$[10] = size;
-		$[11] = t2;
-		$[12] = t4;
-	} else t4 = $[12];
-	return t4;
+		$[9] = children;
+		$[10] = props;
+		$[11] = size;
+		$[12] = t3;
+		$[13] = type;
+		$[14] = t5;
+	} else t5 = $[14];
+	return t5;
 }
 function SelectContent(t0) {
 	const $ = c(26);
@@ -129,7 +167,7 @@ function SelectContent(t0) {
 	const alignItemWithTrigger = t5 === void 0 ? true : t5;
 	let t6;
 	if ($[9] !== className) {
-		t6 = cn("qa-select__content bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto border duration-100", className);
+		t6 = cn("qa-select__content floating-surface motion-floating text-popover-foreground relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto data-ending-style:scale-[var(--motion-scale-enter)] data-ending-style:opacity-0 data-starting-style:scale-[var(--motion-scale-enter)] data-starting-style:opacity-0", className);
 		$[9] = className;
 		$[10] = t6;
 	} else t6 = $[10];
@@ -187,6 +225,38 @@ function SelectContent(t0) {
 	} else t11 = $[25];
 	return t11;
 }
+function SelectLabel(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("qa-select__label text-muted-foreground px-2 py-1.5 text-xs", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Select.GroupLabel, {
+			"data-slot": "select-label",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
 function SelectItem(t0) {
 	const $ = c(13);
 	let children;
@@ -205,7 +275,7 @@ function SelectItem(t0) {
 	}
 	let t1;
 	if ($[4] !== className) {
-		t1 = cn("qa-select__item focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground relative flex min-h-9 w-full cursor-default items-center gap-2 px-3 py-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className);
+		t1 = cn("qa-select__item item-surface focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground relative flex min-h-9 w-full cursor-default items-center gap-2 px-3 py-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className);
 		$[4] = className;
 		$[5] = t1;
 	} else t1 = $[5];
@@ -244,6 +314,38 @@ function SelectItem(t0) {
 	} else t4 = $[12];
 	return t4;
 }
+function SelectSeparator(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("bg-border pointer-events-none -mx-1 my-1 h-px", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Select.Separator, {
+			"data-slot": "select-separator",
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
 function SelectScrollUpButton(t0) {
 	const $ = c(9);
 	let className;
@@ -322,4 +424,4 @@ function SelectScrollDownButton(t0) {
 }
 
 //#endregion
-export { Select$1 as Select, SelectContent, SelectItem, SelectTrigger, SelectValue };
+export { Select$1 as Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue };

package/dist/client/components/ui/sheet.mjs

@@ -59,7 +59,7 @@ function SheetOverlay(t0) {
 	}
 	let t1;
 	if ($[3] !== className) {
-		t1 = cn("qa-sheet__overlay data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 fixed inset-0 z-50 bg-black/80 duration-200 data-ending-style:opacity-0 data-starting-style:opacity-0", className);
+		t1 = cn("qa-sheet__overlay fixed inset-0 z-50 bg-black/80", className);
 		$[3] = className;
 		$[4] = t1;
 	} else t1 = $[4];
@@ -77,43 +77,56 @@ function SheetOverlay(t0) {
 	return t2;
 }
 function SheetContent(t0) {
-	const $ = c(17);
+	const $ = c(25);
 	let children;
 	let className;
 	let props;
 	let t1;
 	let t2;
+	let t3;
+	let t4;
 	if ($[0] !== t0) {
-		({className, children, side: t1, showCloseButton: t2, ...props} = t0);
+		({className, children, side: t1, showCloseButton: t2, animated: t3, showOverlay: t4, ...props} = t0);
 		$[0] = t0;
 		$[1] = children;
 		$[2] = className;
 		$[3] = props;
 		$[4] = t1;
 		$[5] = t2;
+		$[6] = t3;
+		$[7] = t4;
 	} else {
 		children = $[1];
 		className = $[2];
 		props = $[3];
 		t1 = $[4];
 		t2 = $[5];
+		t3 = $[6];
+		t4 = $[7];
 	}
 	const side = t1 === void 0 ? "right" : t1;
 	const showCloseButton = t2 === void 0 ? true : t2;
-	let t3;
-	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-		t3 = /* @__PURE__ */ jsx(SheetOverlay, {});
-		$[6] = t3;
-	} else t3 = $[6];
-	let t4;
-	if ($[7] !== className) {
-		t4 = cn("qa-sheet__content bg-background border-border data-open:animate-in data-closed:animate-out data-[side=right]:data-closed:slide-out-to-right-10 data-[side=right]:data-open:slide-in-from-right-10 data-[side=left]:data-closed:slide-out-to-left-10 data-[side=left]:data-open:slide-in-from-left-10 data-[side=top]:data-closed:slide-out-to-top-10 data-[side=top]:data-open:slide-in-from-top-10 data-closed:fade-out-0 data-open:fade-in-0 data-[side=bottom]:data-closed:slide-out-to-bottom-10 data-[side=bottom]:data-open:slide-in-from-bottom-10 fixed z-50 flex flex-col bg-clip-padding text-sm transition duration-200 ease-in-out data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-full data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-full data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-lg data-[side=right]:sm:max-w-lg", className);
-		$[7] = className;
-		$[8] = t4;
-	} else t4 = $[8];
+	const animated = t3 === void 0 ? true : t3;
+	const showOverlay = t4 === void 0 ? false : t4;
+	const overlayClassName = animated ? "qa-sheet__overlay motion-overlay fixed inset-0 z-50 bg-black/80 data-ending-style:opacity-0 data-starting-style:opacity-0" : "qa-sheet__overlay fixed inset-0 z-50 bg-black/80";
+	const contentClassName = animated ? "qa-sheet__content bg-background border-border motion-sheet data-starting-style:opacity-0 data-ending-style:opacity-0 data-[side=right]:data-starting-style:translate-x-10 data-[side=right]:data-ending-style:translate-x-10 data-[side=left]:data-starting-style:-translate-x-10 data-[side=left]:data-ending-style:-translate-x-10 data-[side=top]:data-starting-style:-translate-y-10 data-[side=top]:data-ending-style:-translate-y-10 data-[side=bottom]:data-starting-style:translate-y-10 data-[side=bottom]:data-ending-style:translate-y-10 fixed z-50 flex flex-col bg-clip-padding text-sm data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-full data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-full data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-lg data-[side=right]:sm:max-w-lg" : "qa-sheet__content bg-background border-border fixed z-50 flex flex-col bg-clip-padding text-sm data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-full data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-full data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-lg data-[side=right]:sm:max-w-lg";
 	let t5;
-	if ($[9] !== showCloseButton) {
-		t5 = showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
+	if ($[8] !== overlayClassName || $[9] !== showOverlay) {
+		t5 = showOverlay && /* @__PURE__ */ jsx(SheetOverlay, { className: overlayClassName });
+		$[8] = overlayClassName;
+		$[9] = showOverlay;
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] !== className || $[12] !== contentClassName) {
+		t6 = cn(contentClassName, className);
+		$[11] = className;
+		$[12] = contentClassName;
+		$[13] = t6;
+	} else t6 = $[13];
+	let t7;
+	if ($[14] !== showCloseButton) {
+		t7 = showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
 			"data-slot": "sheet-close",
 			nativeButton: false,
 			render: /* @__PURE__ */ jsx(Button, {
@@ -126,26 +139,33 @@ function SheetContent(t0) {
 				children: "Close"
 			})]
 		});
-		$[9] = showCloseButton;
-		$[10] = t5;
-	} else t5 = $[10];
-	let t6;
-	if ($[11] !== children || $[12] !== props || $[13] !== side || $[14] !== t4 || $[15] !== t5) {
-		t6 = /* @__PURE__ */ jsxs(SheetPortal, { children: [t3, /* @__PURE__ */ jsxs(Dialog.Popup, {
+		$[14] = showCloseButton;
+		$[15] = t7;
+	} else t7 = $[15];
+	let t8;
+	if ($[16] !== children || $[17] !== props || $[18] !== side || $[19] !== t6 || $[20] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Dialog.Popup, {
 			"data-slot": "sheet-content",
 			"data-side": side,
-			className: t4,
+			className: t6,
 			...props,
-			children: [children, t5]
-		})] });
-		$[11] = children;
-		$[12] = props;
-		$[13] = side;
-		$[14] = t4;
-		$[15] = t5;
-		$[16] = t6;
-	} else t6 = $[16];
-	return t6;
+			children: [children, t7]
+		});
+		$[16] = children;
+		$[17] = props;
+		$[18] = side;
+		$[19] = t6;
+		$[20] = t7;
+		$[21] = t8;
+	} else t8 = $[21];
+	let t9;
+	if ($[22] !== t5 || $[23] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(SheetPortal, { children: [t5, t8] });
+		$[22] = t5;
+		$[23] = t8;
+		$[24] = t9;
+	} else t9 = $[24];
+	return t9;
 }
 function SheetHeader(t0) {
 	const $ = c(8);
@@ -226,7 +246,7 @@ function SheetTitle(t0) {
 	}
 	let t1;
 	if ($[3] !== className) {
-		t1 = cn("qa-sheet__title text-foreground font-mono text-sm font-medium", className);
+		t1 = cn("qa-sheet__title font-chrome text-foreground text-sm font-medium", className);
 		$[3] = className;
 		$[4] = t1;
 	} else t1 = $[4];

package/dist/client/components/ui/sidebar.mjs

@@ -5,6 +5,7 @@ import { Button } from "./button.mjs";
 import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "./sheet.mjs";
 import { Separator } from "./separator.mjs";
 import { useIsMobile } from "../../hooks/use-media-query.mjs";
+import { shouldHandleAdminShortcut } from "../../utils/keyboard-shortcuts.mjs";
 import { c } from "react/compiler-runtime";
 import { Icon } from "@iconify/react";
 import * as React from "react";
@@ -19,7 +20,7 @@ const SIDEBAR_COOKIE_MAX_AGE = 3600 * 24 * 7;
 const SIDEBAR_WIDTH = "16rem";
 const SIDEBAR_WIDTH_MOBILE = "min(18rem, 85vw)";
 const SIDEBAR_WIDTH_ICON = "3rem";
-const SIDEBAR_KEYBOARD_SHORTCUT = "b";
+const SIDEBAR_KEYBOARD_SHORTCUT = "\\";
 const SidebarContext = React.createContext(null);
 function useSidebar() {
 	const context = React.useContext(SidebarContext);
@@ -85,7 +86,7 @@ function SidebarProvider(t0) {
 	if ($[14] !== toggleSidebar) {
 		t4 = () => {
 			const handleKeyDown = (event) => {
-				if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
+				if (shouldHandleAdminShortcut(event, { key: SIDEBAR_KEYBOARD_SHORTCUT })) {
 					event.preventDefault();
 					toggleSidebar();
 				}
@@ -136,7 +137,7 @@ function SidebarProvider(t0) {
 	const t8 = t7;
 	let t9;
 	if ($[26] !== className) {
-		t9 = cn("qa-sidebar-provider group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full", className);
+		t9 = cn("qa-sidebar-provider group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar bg-background flex min-h-svh w-full", className);
 		$[26] = className;
 		$[27] = t9;
 	} else t9 = $[27];
@@ -241,7 +242,7 @@ function Sidebar(t0) {
 		let t6$1;
 		if ($[15] !== children) {
 			t6$1 = /* @__PURE__ */ jsx("div", {
-				className: "flex h-full w-full flex-col",
+				className: "bg-sidebar border-sidebar-border flex h-full w-full flex-col overflow-hidden rounded-xl border shadow-lg",
 				children
 			});
 			$[15] = children;
@@ -253,7 +254,7 @@ function Sidebar(t0) {
 				"data-sidebar": "sidebar",
 				"data-slot": "sidebar",
 				"data-mobile": "true",
-				className: "bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0",
+				className: "text-sidebar-foreground w-(--sidebar-width) bg-transparent p-2 [&>button]:hidden",
 				style: t4$1,
 				side,
 				children: [t5$1, t6$1]
@@ -282,7 +283,7 @@ function Sidebar(t0) {
 	const t5 = variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)";
 	let t6;
 	if ($[25] !== t5) {
-		t6 = cn("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offExamples]:w-0", "group-data-[side=right]:rotate-180", t5);
+		t6 = cn("relative w-(--sidebar-width) bg-transparent transition-[width] duration-[var(--motion-duration-slow)] ease-[var(--motion-ease-move)] motion-reduce:transition-none", "group-data-[collapsible=offExamples]:w-0", "group-data-[side=right]:rotate-180", t5);
 		$[25] = t5;
 		$[26] = t6;
 	} else t6 = $[26];
@@ -299,7 +300,7 @@ function Sidebar(t0) {
 	const t9 = variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l";
 	let t10;
 	if ($[29] !== className || $[30] !== t8 || $[31] !== t9) {
-		t10 = cn("absolute inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex", t8, t9, className);
+		t10 = cn("qa-sidebar__container absolute inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-[var(--motion-duration-slow)] ease-[var(--motion-ease-move)] motion-reduce:transition-none md:flex", t8, t9, className);
 		$[29] = className;
 		$[30] = t8;
 		$[31] = t9;
@@ -310,7 +311,7 @@ function Sidebar(t0) {
 		t11 = /* @__PURE__ */ jsx("div", {
 			"data-sidebar": "sidebar",
 			"data-slot": "sidebar-inner",
-			className: "qa-sidebar bg-sidebar border-sidebar-border flex size-full flex-col group-data-[variant=floating]:border group-data-[variant=floating]:shadow-lg",
+			className: "qa-sidebar bg-sidebar border-sidebar-border group-data-[variant=floating]:ring-sidebar-border flex size-full flex-col group-data-[variant=floating]:overflow-hidden group-data-[variant=floating]:rounded-xl group-data-[variant=floating]:border group-data-[variant=floating]:shadow-md group-data-[variant=floating]:ring-1",
 			children
 		});
 		$[33] = children;
@@ -618,7 +619,7 @@ function SidebarGroupLabel(t0) {
 		render = t4$1;
 		t3 = useRender;
 		t1 = "div";
-		t2 = mergeProps({ className: cn("qa-sidebar-group-label text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center px-2 font-mono text-xs outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", className) }, props);
+		t2 = mergeProps({ className: cn("qa-sidebar-group-label text-sidebar-foreground/55 ring-sidebar-ring flex h-8 shrink-0 items-center px-2 font-mono text-[11px] font-semibold tracking-[0.08em] uppercase tabular-nums outline-hidden transition-[height,margin,opacity,padding] duration-200 ease-linear group-data-[collapsible=icon]:pointer-events-none group-data-[collapsible=icon]:mt-0 group-data-[collapsible=icon]:h-0 group-data-[collapsible=icon]:overflow-hidden group-data-[collapsible=icon]:px-0 group-data-[collapsible=icon]:py-0 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", className) }, props);
 		$[0] = t0;
 		$[1] = render;
 		$[2] = t1;
@@ -752,16 +753,16 @@ function SidebarMenuItem(t0) {
 	} else t2 = $[7];
 	return t2;
 }
-cva("qa-sidebar-menu-button ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden p-2 text-left text-xs outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:font-medium [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate", {
+cva("qa-sidebar-menu-button item-surface font-chrome ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden p-2 text-left text-[13px] outline-hidden transition-[background-color,color,border-color,box-shadow,transform,width,height,padding] duration-150 ease-out group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:scale-[0.96] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:border-transparent data-active:bg-[var(--sidebar-active-background)] data-active:font-medium data-active:text-[var(--sidebar-active-foreground)] [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate", {
 	variants: {
 		variant: {
 			default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
-			outline: "bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground border-sidebar-border hover:border-sidebar-accent border"
+			outline: "bg-background border-sidebar-border hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:border-sidebar-border"
 		},
 		size: {
-			default: "h-8 text-xs",
-			sm: "h-7 text-xs",
-			lg: "h-12 text-xs group-data-[collapsible=icon]:p-0!"
+			default: "h-8 text-[13px]",
+			sm: "h-7 text-[13px]",
+			lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
 		}
 	},
 	defaultVariants: {

package/dist/client/components/ui/skeleton.mjs

@@ -1,38 +1,54 @@
 import { cn } from "../../lib/utils.mjs";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
 
 //#region src/client/components/ui/skeleton.tsx
+const skeletonVariants = cva("qa-skeleton bg-muted animate-pulse", {
+	variants: { variant: {
+		default: "rounded-sm",
+		text: "rounded-xs",
+		chip: "rounded-sm",
+		avatar: "rounded-md"
+	} },
+	defaultVariants: { variant: "default" }
+});
 function Skeleton(t0) {
-	const $ = c(8);
+	const $ = c(11);
 	let className;
 	let props;
+	let variant;
 	if ($[0] !== t0) {
-		({className, ...props} = t0);
+		({className, variant, ...props} = t0);
 		$[0] = t0;
 		$[1] = className;
 		$[2] = props;
+		$[3] = variant;
 	} else {
 		className = $[1];
 		props = $[2];
+		variant = $[3];
 	}
 	let t1;
-	if ($[3] !== className) {
-		t1 = cn("qa-skeleton bg-muted animate-pulse", className);
-		$[3] = className;
-		$[4] = t1;
-	} else t1 = $[4];
+	if ($[4] !== className || $[5] !== variant) {
+		t1 = cn(skeletonVariants({ variant }), className);
+		$[4] = className;
+		$[5] = variant;
+		$[6] = t1;
+	} else t1 = $[6];
 	let t2;
-	if ($[5] !== props || $[6] !== t1) {
+	if ($[7] !== props || $[8] !== t1 || $[9] !== variant) {
 		t2 = /* @__PURE__ */ jsx("div", {
 			"data-slot": "skeleton",
+			"data-variant": variant,
 			className: t1,
 			...props
 		});
-		$[5] = props;
-		$[6] = t1;
-		$[7] = t2;
-	} else t2 = $[7];
+		$[7] = props;
+		$[8] = t1;
+		$[9] = variant;
+		$[10] = t2;
+	} else t2 = $[10];
 	return t2;
 }
 

package/dist/client/components/ui/switch.mjs

@@ -25,7 +25,7 @@ function Switch$1(t0) {
 	const size = t1 === void 0 ? "default" : t1;
 	let t2;
 	if ($[4] !== className) {
-		t2 = cn("qa-switch data-checked:bg-primary data-checked:border-primary data-unchecked:bg-muted data-unchecked:border-border focus-visible:border-ring focus-visible:ring-ring/30 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 dark:data-unchecked:bg-muted peer group/switch relative inline-flex shrink-0 items-center rounded-full border transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-[2px] aria-invalid:ring-[2px] data-disabled:cursor-not-allowed data-disabled:opacity-50 data-[size=default]:h-[16.6px] data-[size=default]:w-[28px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px]", className);
+		t2 = cn("qa-switch data-checked:border-border-strong data-checked:bg-surface-high data-unchecked:border-input data-unchecked:bg-input focus-visible:border-ring focus-visible:ring-ring/20 aria-invalid:border-border-strong aria-invalid:ring-ring/20 peer group/switch relative inline-flex shrink-0 items-center rounded-full border transition-[background-color,border-color,box-shadow] duration-150 ease-out outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-[3px] aria-invalid:ring-[3px] data-disabled:cursor-not-allowed data-disabled:opacity-50 data-[size=default]:h-[16.6px] data-[size=default]:w-[28px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px]", className);
 		$[4] = className;
 		$[5] = t2;
 	} else t2 = $[5];
@@ -33,7 +33,7 @@ function Switch$1(t0) {
 	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
 		t3 = /* @__PURE__ */ jsx(Switch.Thumb, {
 			"data-slot": "switch-thumb",
-			className: "qa-switch__thumb bg-background dark:data-unchecked:bg-foreground dark:data-checked:bg-primary-foreground pointer-events-none block rounded-full ring-0 transition-transform group-data-[size=default]/switch:size-3.5 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0"
+			className: "qa-switch__thumb bg-card data-checked:bg-foreground pointer-events-none block rounded-full ring-0 transition-transform duration-150 ease-out group-data-[size=default]/switch:size-3.5 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0"
 		});
 		$[6] = t3;
 	} else t3 = $[6];