shadcn-theme-menu 1.1.2 → 1.1.6

package/dist/sidebar-user-menu.js

@@ -0,0 +1,149 @@
+"use client";
+import { DropdownMenu as e, DropdownMenuContent as t, DropdownMenuItem as n, DropdownMenuPortal as r, DropdownMenuSeparator as i, DropdownMenuSub as a, DropdownMenuSubContent as o, DropdownMenuSubTrigger as s, DropdownMenuTrigger as c } from "./components/ui/dropdown-menu.js";
+import { formatThemeName as l, themeColors as u, themeNames as d } from "./theme-dropdown.js";
+import f from "./cinematic-theme-switcher.js";
+import { SidebarMenu as p, SidebarMenuButton as m, SidebarMenuItem as h } from "./components/ui/sidebar.js";
+import { Avatar as g, AvatarFallback as _, AvatarImage as v } from "./components/ui/avatar.js";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { Bell as S, ChevronUp as C, CreditCard as w, LogOut as T, Palette as E, User2 as D } from "lucide-react";
+import * as O from "react";
+//#region src/sidebar-user-menu.tsx
+function k({ trigger: e }) {
+	return /* @__PURE__ */ b(y, { children: e });
+}
+function A({ user: y, onSignOut: A } = {}) {
+	let j = y || {
+		name: "Guest User",
+		email: "guest@example.com",
+		image: null
+	}, [M, N] = O.useState("minimal"), [P, F] = O.useState(!1), [I, L] = O.useState(null);
+	O.useEffect(() => {
+		F(!0);
+		let e = localStorage.getItem("color-theme");
+		e && d.includes(e) && N(e);
+	}, []);
+	let R = (e) => {
+		N(e), localStorage.setItem("color-theme", e), document.cookie = `color-theme=${e}; path=/; max-age=31536000`, d.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${e}`), L(null);
+	}, z = (e) => {
+		L(e), d.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${e}`);
+	}, B = () => {
+		I && (d.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${M}`), L(null));
+	}, V = j.name?.split(" ").map((e) => e[0]).join("").toUpperCase().substring(0, 2) || "GU";
+	return /* @__PURE__ */ b(p, { children: /* @__PURE__ */ b(h, { children: /* @__PURE__ */ x(e, {
+		onOpenChange: (e) => !e && B(),
+		children: [/* @__PURE__ */ b(c, {
+			asChild: !0,
+			children: /* @__PURE__ */ x(m, {
+				size: "lg",
+				className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
+				children: [
+					/* @__PURE__ */ x(g, {
+						className: "h-8 w-8 rounded-lg",
+						children: [/* @__PURE__ */ b(v, {
+							src: j.image || void 0,
+							alt: j.name || "User"
+						}), /* @__PURE__ */ b(_, {
+							className: "rounded-lg",
+							children: V
+						})]
+					}),
+					/* @__PURE__ */ x("div", {
+						className: "grid flex-1 text-left text-sm leading-tight group-data-[collapsible=icon]:hidden",
+						children: [/* @__PURE__ */ b("span", {
+							className: "truncate font-semibold",
+							children: j.name || "Guest"
+						}), /* @__PURE__ */ b("span", {
+							className: "truncate text-xs text-muted-foreground",
+							children: j.email
+						})]
+					}),
+					/* @__PURE__ */ b(C, { className: "ml-2 size-4 group-data-[collapsible=icon]:hidden" })
+				]
+			})
+		}), /* @__PURE__ */ x(t, {
+			className: "w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg",
+			side: "bottom",
+			align: "end",
+			sideOffset: 4,
+			children: [
+				/* @__PURE__ */ x("div", {
+					className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm",
+					children: [/* @__PURE__ */ x(g, {
+						className: "h-8 w-8 rounded-lg",
+						children: [/* @__PURE__ */ b(v, {
+							src: j.image || void 0,
+							alt: j.name || "User"
+						}), /* @__PURE__ */ b(_, {
+							className: "rounded-lg",
+							children: V
+						})]
+					}), /* @__PURE__ */ x("div", {
+						className: "grid flex-1 text-left text-sm leading-tight",
+						children: [/* @__PURE__ */ b("span", {
+							className: "truncate font-semibold",
+							children: j.name || "Guest"
+						}), /* @__PURE__ */ b("span", {
+							className: "truncate text-xs text-muted-foreground",
+							children: j.email
+						})]
+					})]
+				}),
+				/* @__PURE__ */ b(i, {}),
+				/* @__PURE__ */ b(k, { trigger: /* @__PURE__ */ x(n, {
+					onSelect: (e) => e.preventDefault(),
+					children: [/* @__PURE__ */ b(D, { className: "mr-2 h-4 w-4" }), "Profile"]
+				}) }),
+				/* @__PURE__ */ x(n, { children: [/* @__PURE__ */ b(w, { className: "mr-2 h-4 w-4" }), "Billing"] }),
+				/* @__PURE__ */ x(n, { children: [/* @__PURE__ */ b(S, { className: "mr-2 h-4 w-4" }), "Notifications"] }),
+				/* @__PURE__ */ b(i, {}),
+				/* @__PURE__ */ x(a, { children: [/* @__PURE__ */ x(s, { children: [/* @__PURE__ */ b(E, { className: "mr-2 h-4 w-4" }), /* @__PURE__ */ b("span", { children: "Color Theme" })] }), /* @__PURE__ */ b(r, { children: /* @__PURE__ */ x(o, {
+					className: "max-h-[400px] overflow-y-auto",
+					children: [
+						/* @__PURE__ */ b("div", {
+							className: "px-2 py-1.5 flex items-center justify-center",
+							children: /* @__PURE__ */ b(f, {})
+						}),
+						/* @__PURE__ */ b(i, {}),
+						d.map((e) => {
+							let t = u[e];
+							return /* @__PURE__ */ b(n, {
+								onClick: () => R(e),
+								onMouseEnter: () => z(e),
+								onMouseLeave: B,
+								className: M === e ? "bg-accent" : "",
+								children: /* @__PURE__ */ x("div", {
+									className: "flex items-center justify-between w-full",
+									children: [/* @__PURE__ */ x("div", {
+										className: "flex items-center gap-2",
+										children: [t && /* @__PURE__ */ x("div", {
+											className: "flex items-center gap-1",
+											children: [/* @__PURE__ */ b("div", {
+												className: "w-3 h-3 rounded-full border border-border",
+												style: { backgroundColor: t.primary }
+											}), /* @__PURE__ */ b("div", {
+												className: "w-3 h-3 rounded-full border border-border",
+												style: { backgroundColor: t.secondary }
+											})]
+										}), /* @__PURE__ */ b("span", { children: l(e) })]
+									}), M === e && /* @__PURE__ */ b("span", {
+										className: "text-xs",
+										children: "✓"
+									})]
+								})
+							}, e);
+						})
+					]
+				}) })] }),
+				/* @__PURE__ */ b(i, {}),
+				/* @__PURE__ */ x(n, {
+					onClick: async () => {
+						await A?.();
+					},
+					children: [/* @__PURE__ */ b(T, { className: "mr-2 h-4 w-4" }), "Sign out"]
+				})
+			]
+		})]
+	}) }) });
+}
+//#endregion
+export { A as SidebarUserMenu };

package/dist/theme-dropdown.js

@@ -0,0 +1,488 @@
+"use client";
+import { Button as e } from "./components/ui/button.js";
+import { DropdownMenu as t, DropdownMenuContent as n, DropdownMenuItem as r, DropdownMenuLabel as i, DropdownMenuSeparator as a, DropdownMenuTrigger as o } from "./components/ui/dropdown-menu.js";
+import { useTheme as s } from "next-themes";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Monitor as u, Moon as d, Palette as f, Sun as p } from "lucide-react";
+import { useEffect as m, useState as h } from "react";
+//#region src/theme-dropdown.tsx
+var g = /* @__PURE__ */ "dark.light.midnight.ocean.forest.sunset.rose.amber.violet.slate.emerald.sky.crimson.vscode.slack.x.githubdark.githublight.discord.notion.linear.spotify.dracula.nord.solarized.monokai.jiradark.trellodark.youtubedark.googledark.whatsappdark.minimal.luxury.cyberpunk.twitter.mocha.bubblegum.amethyst.lemonade.notebook.doom64.catppuccin.graphite.perpetuity.kodama.cosmic.tangerine.quantum.nature.boldtech.ambermin.supabase.brutalism.solardusk.claymorphism.pastel.cleanslate.caffeine.breeze.retro.bloom.candyland.aurora.vintage.horizon.starry.claude.vercel.mono".split("."), _ = {
+	dark: "Dark",
+	light: "Light",
+	midnight: "Midnight",
+	ocean: "Ocean",
+	forest: "Forest",
+	sunset: "Sunset",
+	rose: "Rose",
+	amber: "Amber",
+	violet: "Violet",
+	slate: "Slate",
+	emerald: "Emerald",
+	sky: "Sky",
+	crimson: "Crimson",
+	vscode: "VS Code",
+	slack: "Slack",
+	x: "X",
+	githubdark: "Github Dark",
+	githublight: "Github Light",
+	discord: "Discord",
+	notion: "Notion",
+	linear: "Linear",
+	spotify: "Spotify",
+	dracula: "Dracula",
+	nord: "Nord",
+	solarized: "Solarized",
+	monokai: "Monokai",
+	jiradark: "Jira Dark",
+	trellodark: "Trello Dark",
+	youtubedark: "YouTube Dark",
+	googledark: "Google Dark",
+	whatsappdark: "WhatsApp Dark",
+	minimal: "Minimal",
+	luxury: "Luxury",
+	cyberpunk: "Cyberpunk",
+	twitter: "Twitter",
+	mocha: "Mocha",
+	bubblegum: "Bubblegum",
+	amethyst: "Amethyst",
+	lemonade: "Lemonade",
+	notebook: "Notebook",
+	doom64: "Doom 64",
+	catppuccin: "Catppuccin",
+	graphite: "Graphite",
+	perpetuity: "Perpetuity",
+	kodama: "Kodama",
+	cosmic: "Cosmic",
+	tangerine: "Tangerine",
+	quantum: "Quantum",
+	nature: "Nature",
+	boldtech: "Bold Tech",
+	ambermin: "Amber Min",
+	supabase: "Supabase",
+	brutalism: "Brutalism",
+	solardusk: "Solar Dusk",
+	claymorphism: "Claymorphism",
+	pastel: "Pastel",
+	cleanslate: "Clean Slate",
+	caffeine: "Caffeine",
+	breeze: "Breeze",
+	retro: "Retro",
+	bloom: "Bloom",
+	candyland: "Candyland",
+	aurora: "Aurora",
+	vintage: "Vintage",
+	horizon: "Horizon",
+	starry: "Starry",
+	claude: "Claude",
+	vercel: "Vercel",
+	mono: "Mono"
+}, v = {
+	dark: {
+		primary: "#7c6fe0",
+		secondary: "#404040"
+	},
+	light: {
+		primary: "#7c6fe0",
+		secondary: "#ebebeb"
+	},
+	midnight: {
+		primary: "#6b5fc5",
+		secondary: "#252530"
+	},
+	ocean: {
+		primary: "#3a9dc4",
+		secondary: "#253040"
+	},
+	forest: {
+		primary: "#2ea060",
+		secondary: "#25342c"
+	},
+	sunset: {
+		primary: "#d06535",
+		secondary: "#382e25"
+	},
+	rose: {
+		primary: "#c04868",
+		secondary: "#33202c"
+	},
+	amber: {
+		primary: "#d28a30",
+		secondary: "#332a1e"
+	},
+	violet: {
+		primary: "#8460dc",
+		secondary: "#25203e"
+	},
+	slate: {
+		primary: "#65788a",
+		secondary: "#2e3238"
+	},
+	emerald: {
+		primary: "#35b87a",
+		secondary: "#283d33"
+	},
+	sky: {
+		primary: "#3d8fca",
+		secondary: "#2b3540"
+	},
+	crimson: {
+		primary: "#c23c3c",
+		secondary: "#321f1f"
+	},
+	vscode: {
+		primary: "#4b75b0",
+		secondary: "#2d3035"
+	},
+	slack: {
+		primary: "#4268a5",
+		secondary: "#36263e"
+	},
+	x: {
+		primary: "#3d8dc2",
+		secondary: "#2a2a2a"
+	},
+	githubdark: {
+		primary: "#4d8ab8",
+		secondary: "#2d3035"
+	},
+	githublight: {
+		primary: "#2e60a0",
+		secondary: "#f0f0f0"
+	},
+	discord: {
+		primary: "#6958c8",
+		secondary: "#38404c"
+	},
+	notion: {
+		primary: "#4575b0",
+		secondary: "#ece8de"
+	},
+	linear: {
+		primary: "#6258b8",
+		secondary: "#2d2d38"
+	},
+	spotify: {
+		primary: "#1db954",
+		secondary: "#303030"
+	},
+	dracula: {
+		primary: "#9575e0",
+		secondary: "#3c3a4e"
+	},
+	nord: {
+		primary: "#7898b8",
+		secondary: "#3c4550"
+	},
+	solarized: {
+		primary: "#357ea8",
+		secondary: "#e6e2ce"
+	},
+	monokai: {
+		primary: "#a6e22e",
+		secondary: "#3b3b32"
+	},
+	jiradark: {
+		primary: "#3868c8",
+		secondary: "#252c38"
+	},
+	trellodark: {
+		primary: "#4575a0",
+		secondary: "#35404a"
+	},
+	youtubedark: {
+		primary: "#c52818",
+		secondary: "#2d3035"
+	},
+	googledark: {
+		primary: "#4568c8",
+		secondary: "#2a2a2a"
+	},
+	whatsappdark: {
+		primary: "#25d366",
+		secondary: "#2b3a38"
+	},
+	minimal: {
+		primary: "#3b82f6",
+		secondary: "#f3f4f6"
+	},
+	luxury: {
+		primary: "#9b2c2c",
+		secondary: "#fdf2d6"
+	},
+	cyberpunk: {
+		primary: "#ff00c8",
+		secondary: "#f0f0ff"
+	},
+	twitter: {
+		primary: "#1e9df1",
+		secondary: "#0f1419"
+	},
+	mocha: {
+		primary: "#A37764",
+		secondary: "#BAAB92"
+	},
+	bubblegum: {
+		primary: "#d04f99",
+		secondary: "#8acfd1"
+	},
+	amethyst: {
+		primary: "#8a79ab",
+		secondary: "#dfd9ec"
+	},
+	lemonade: {
+		primary: "#a84370",
+		secondary: "#f1c4e6"
+	},
+	notebook: {
+		primary: "#606060",
+		secondary: "#dedede"
+	},
+	doom64: {
+		primary: "#b71c1c",
+		secondary: "#556b2f"
+	},
+	catppuccin: {
+		primary: "#8839ef",
+		secondary: "#ccd0da"
+	},
+	graphite: {
+		primary: "#606060",
+		secondary: "#e0e0e0"
+	},
+	perpetuity: {
+		primary: "#06858e",
+		secondary: "#d9eaea"
+	},
+	kodama: {
+		primary: "#8d9d4f",
+		secondary: "#decea0"
+	},
+	cosmic: {
+		primary: "#6e56cf",
+		secondary: "#e4dfff"
+	},
+	tangerine: {
+		primary: "#e05d38",
+		secondary: "#f3f4f6"
+	},
+	quantum: {
+		primary: "#e6067a",
+		secondary: "#ffd6ff"
+	},
+	nature: {
+		primary: "#2e7d32",
+		secondary: "#e8f5e9"
+	},
+	boldtech: {
+		primary: "#8b5cf6",
+		secondary: "#f3f0ff"
+	},
+	ambermin: {
+		primary: "#f59e0b",
+		secondary: "#f3f4f6"
+	},
+	supabase: {
+		primary: "#72e3ad",
+		secondary: "#fdfdfd"
+	},
+	brutalism: {
+		primary: "#ff3333",
+		secondary: "#ffff00"
+	},
+	solardusk: {
+		primary: "#B45309",
+		secondary: "#E4C090"
+	},
+	claymorphism: {
+		primary: "#6366f1",
+		secondary: "#d6d3d1"
+	},
+	pastel: {
+		primary: "#a78bfa",
+		secondary: "#e9d8fd"
+	},
+	cleanslate: {
+		primary: "#6366f1",
+		secondary: "#e5e7eb"
+	},
+	caffeine: {
+		primary: "#644a40",
+		secondary: "#ffdfb5"
+	},
+	breeze: {
+		primary: "#22c55e",
+		secondary: "#e0f2fe"
+	},
+	retro: {
+		primary: "#d33682",
+		secondary: "#2aa198"
+	},
+	bloom: {
+		primary: "#6c5ce7",
+		secondary: "#a1c9f2"
+	},
+	candyland: {
+		primary: "#ffc0cb",
+		secondary: "#87ceeb"
+	},
+	aurora: {
+		primary: "#34a85a",
+		secondary: "#6495ed"
+	},
+	vintage: {
+		primary: "#a67c52",
+		secondary: "#e2d8c3"
+	},
+	horizon: {
+		primary: "#ff7e5f",
+		secondary: "#feb47b"
+	},
+	starry: {
+		primary: "#3a5ba0",
+		secondary: "#f7c873"
+	},
+	claude: {
+		primary: "#c96442",
+		secondary: "#e9e6dc"
+	},
+	vercel: {
+		primary: "#000000",
+		secondary: "#f5f5f5"
+	},
+	mono: {
+		primary: "#737373",
+		secondary: "#f5f5f5"
+	}
+}, y = (e) => _[e] ?? e.split("-").map((e) => e.charAt(0).toUpperCase() + e.slice(1)).join(" ");
+function b({ Button: _, DropdownMenu: b, iconSrc: x, onColorThemeChange: S, onModeChange: C } = {}) {
+	let { theme: w, setTheme: T } = s(), [E, D] = h("minimal"), [O, k] = h(!1), [A, j] = h(null), M = _ || e, N = b || {
+		Root: t,
+		Trigger: o,
+		Content: n,
+		Item: r,
+		Label: i,
+		Separator: a
+	};
+	m(() => {
+		k(!0);
+		let e = localStorage.getItem("color-theme");
+		e && g.includes(e) && D(e);
+	}, []);
+	let P = (e) => {
+		D(e), localStorage.setItem("color-theme", e), document.cookie = `color-theme=${e}; path=/; max-age=31536000`, g.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${e}`), j(null), S?.(e);
+	}, F = (e) => {
+		T(e), C?.(e);
+	}, I = (e) => {
+		j(e), g.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${e}`);
+	}, L = () => {
+		A && (g.forEach((e) => document.documentElement.classList.remove(`theme-${e}`)), document.documentElement.classList.add(`theme-${E}`), j(null));
+	};
+	if (!O) return null;
+	let R = N.Root || N, z = N.Trigger || o, B = N.Content || n, V = N.Item || r, H = N.Label || i, U = N.Separator || a;
+	return /* @__PURE__ */ l(R, {
+		onOpenChange: (e) => !e && L(),
+		children: [/* @__PURE__ */ c(z, {
+			asChild: !0,
+			children: /* @__PURE__ */ c(M, {
+				variant: "ghost",
+				size: "icon",
+				className: "relative",
+				children: x ? /* @__PURE__ */ c("img", {
+					src: x,
+					alt: "Themes",
+					width: 32,
+					height: 32
+				}) : /* @__PURE__ */ c(f, { className: "h-5 w-5" })
+			})
+		}), /* @__PURE__ */ l(B, {
+			align: "end",
+			className: "w-56 max-h-[400px] overflow-y-auto",
+			children: [
+				/* @__PURE__ */ c(H, { children: "Appearance" }),
+				/* @__PURE__ */ c(U, {}),
+				/* @__PURE__ */ l(V, {
+					onClick: () => F("light"),
+					className: "cursor-pointer py-1 h-7",
+					children: [
+						/* @__PURE__ */ c(p, { className: "mr-2 h-3.5 w-3.5" }),
+						/* @__PURE__ */ c("span", {
+							className: "text-sm",
+							children: "Light"
+						}),
+						w === "light" && /* @__PURE__ */ c("span", {
+							className: "ml-auto text-xs",
+							children: "✓"
+						})
+					]
+				}),
+				/* @__PURE__ */ l(V, {
+					onClick: () => F("dark"),
+					className: "cursor-pointer py-1 h-7",
+					children: [
+						/* @__PURE__ */ c(d, { className: "mr-2 h-3.5 w-3.5" }),
+						/* @__PURE__ */ c("span", {
+							className: "text-sm",
+							children: "Dark"
+						}),
+						w === "dark" && /* @__PURE__ */ c("span", {
+							className: "ml-auto text-xs",
+							children: "✓"
+						})
+					]
+				}),
+				/* @__PURE__ */ l(V, {
+					onClick: () => F("system"),
+					className: "cursor-pointer py-1 h-7",
+					children: [
+						/* @__PURE__ */ c(u, { className: "mr-2 h-3.5 w-3.5" }),
+						/* @__PURE__ */ c("span", {
+							className: "text-sm",
+							children: "System"
+						}),
+						w === "system" && /* @__PURE__ */ c("span", {
+							className: "ml-auto text-xs",
+							children: "✓"
+						})
+					]
+				}),
+				/* @__PURE__ */ c(U, {}),
+				/* @__PURE__ */ c(H, { children: "Color Theme" }),
+				/* @__PURE__ */ l("div", {
+					className: "text-xs text-muted-foreground px-2 py-1.5",
+					children: ["Current: ", y(E)]
+				}),
+				/* @__PURE__ */ c(U, {}),
+				g.map((e) => {
+					let t = v[e];
+					return /* @__PURE__ */ c(V, {
+						onClick: () => P(e),
+						onMouseEnter: () => I(e),
+						onMouseLeave: L,
+						className: `cursor-pointer ${E === e ? "bg-accent" : ""}`,
+						children: /* @__PURE__ */ l("div", {
+							className: "flex items-center justify-between w-full",
+							children: [/* @__PURE__ */ l("div", {
+								className: "flex items-center gap-2",
+								children: [t && /* @__PURE__ */ l("div", {
+									className: "flex items-center gap-1",
+									children: [/* @__PURE__ */ c("div", {
+										className: "w-3 h-3 rounded-full border border-border",
+										style: { backgroundColor: t.primary }
+									}), /* @__PURE__ */ c("div", {
+										className: "w-3 h-3 rounded-full border border-border",
+										style: { backgroundColor: t.secondary }
+									})]
+								}), /* @__PURE__ */ c("span", { children: y(e) })]
+							}), E === e && /* @__PURE__ */ c("span", {
+								className: "text-xs",
+								children: "✓"
+							})]
+						})
+					}, e);
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { b as ThemeDropdown, y as formatThemeName, v as themeColors, g as themeNames };

package/dist/theme-provider.js

@@ -0,0 +1,12 @@
+"use client";
+import { ThemeProvider as e } from "next-themes";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/theme-provider.tsx
+function n({ children: n, ...r }) {
+	return /* @__PURE__ */ t(e, {
+		...r,
+		children: n
+	});
+}
+//#endregion
+export { n as ThemeProvider };

package/dist/theme-toggle.js

@@ -0,0 +1,51 @@
+"use client";
+import { Button as e } from "./components/ui/button.js";
+import { DropdownMenu as t, DropdownMenuContent as n, DropdownMenuItem as r, DropdownMenuTrigger as i } from "./components/ui/dropdown-menu.js";
+import { useTheme as a } from "next-themes";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Monitor as c, Moon as l, Sun as u } from "lucide-react";
+//#region src/theme-toggle.tsx
+function d({ mode: d = "light-dark-system", Button: f, DropdownMenu: p, onThemeChange: m }) {
+	let { setTheme: h } = a(), g = f || e, _ = p || {
+		Root: t,
+		Trigger: i,
+		Content: n,
+		Item: r
+	}, v = (e) => {
+		h(e), m?.(e);
+	}, y = _.Root || _, b = _.Trigger || i, x = _.Content || n, S = _.Item || r;
+	return /* @__PURE__ */ s(y, { children: [/* @__PURE__ */ o(b, {
+		asChild: !0,
+		children: /* @__PURE__ */ s(g, {
+			variant: "ghost",
+			size: "icon",
+			className: "size-8",
+			children: [
+				/* @__PURE__ */ o(u, { className: "size-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
+				/* @__PURE__ */ o(l, { className: "absolute size-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" }),
+				/* @__PURE__ */ o("span", {
+					className: "sr-only",
+					children: "Toggle theme"
+				})
+			]
+		})
+	}), /* @__PURE__ */ s(x, {
+		align: "end",
+		children: [
+			/* @__PURE__ */ s(S, {
+				onClick: () => v("light"),
+				children: [/* @__PURE__ */ o(u, { className: "mr-2 size-4" }), "Light"]
+			}),
+			/* @__PURE__ */ s(S, {
+				onClick: () => v("dark"),
+				children: [/* @__PURE__ */ o(l, { className: "mr-2 size-4" }), "Dark"]
+			}),
+			d === "light-dark-system" && /* @__PURE__ */ s(S, {
+				onClick: () => v("system"),
+				children: [/* @__PURE__ */ o(c, { className: "mr-2 size-4" }), "System"]
+			})
+		]
+	})] });
+}
+//#endregion
+export { d as ThemeToggle };