@allbluecn/ui 0.3.14 → 0.4.1

package/dist/ai-command-button.d.ts

@@ -0,0 +1,10 @@
+import { AICommandDef } from "@allbluecn/shared";
+//#region src/ai-command-button.d.ts
+interface Props {
+  command: AICommandDef;
+  onClick: () => void;
+  loading?: boolean;
+}
+declare function AICommandButton({ command, onClick, loading }: Props): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { AICommandButton };

package/dist/ai-command-button.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+//#region src/ai-command-button.tsx
+function AICommandButton({ command, onClick, loading }) {
+	return /* @__PURE__ */ jsx("button", {
+		className: "inline-flex items-center gap-1 px-2 py-1 text-xs rounded bg-primary/10 text-primary hover:bg-primary/20",
+		onClick,
+		disabled: loading,
+		children: loading ? "..." : command.label
+	});
+}
+//#endregion
+export { AICommandButton };

package/dist/ai-stream-text.d.ts

@@ -0,0 +1,9 @@
+//#region src/ai-stream-text.d.ts
+interface Props {
+  text: string;
+  streaming?: boolean;
+  className?: string;
+}
+declare function AIStreamText({ text, streaming, className }: Props): import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+export { AIStreamText };

package/dist/ai-stream-text.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/ai-stream-text.tsx
+function AIStreamText({ text, streaming = false, className }) {
+	if (!text && !streaming) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "prose prose-sm max-w-none" + (className ? " " + className : ""),
+		children: [text || "\xA0", streaming && /* @__PURE__ */ jsx("span", { className: "inline-block w-2 h-4 ml-0.5 bg-primary animate-pulse rounded-sm align-middle" })]
+	});
+}
+//#endregion
+export { AIStreamText };

package/dist/alert-dialog.d.ts

@@ -0,0 +1,20 @@
+import { Button } from "./button.js";
+import * as React$1 from "react";
+import { AlertDialog as AlertDialog$1 } from "radix-ui";
+//#region src/alert-dialog.d.ts
+declare function AlertDialog({ ...props }: React$1.ComponentProps<typeof AlertDialog$1.Root>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogTrigger({ ...props }: React$1.ComponentProps<typeof AlertDialog$1.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogPortal({ ...props }: React$1.ComponentProps<typeof AlertDialog$1.Portal>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Overlay>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Content> & {
+  size?: "default" | "sm";
+}): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React$1.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React$1.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React$1.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Title>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Description>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogAction({ className, variant, size, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Action> & Pick<React$1.ComponentProps<typeof Button>, "variant" | "size">): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Cancel> & Pick<React$1.ComponentProps<typeof Button>, "variant" | "size">): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/alert-dialog.js

@@ -0,0 +1,101 @@
+"use client";
+import { cn } from "./utils.js";
+import { Button } from "./button.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { AlertDialog as AlertDialog$1 } from "radix-ui";
+//#region src/alert-dialog.tsx
+function AlertDialog({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Root, {
+		"data-slot": "alert-dialog",
+		...props
+	});
+}
+function AlertDialogTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, {
+		"data-slot": "alert-dialog-trigger",
+		...props
+	});
+}
+function AlertDialogPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Portal, {
+		"data-slot": "alert-dialog-portal",
+		...props
+	});
+}
+function AlertDialogOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Overlay, {
+		"data-slot": "alert-dialog-overlay",
+		className: cn("fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", className),
+		...props
+	});
+}
+function AlertDialogContent({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialog$1.Content, {
+		"data-slot": "alert-dialog-content",
+		"data-size": size,
+		className: cn("group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
+		...props
+	})] });
+}
+function AlertDialogHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-header",
+		className: cn("grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className),
+		...props
+	});
+}
+function AlertDialogFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-footer",
+		className: cn("-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className),
+		...props
+	});
+}
+function AlertDialogMedia({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-media",
+		className: cn("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6", className),
+		...props
+	});
+}
+function AlertDialogTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Title, {
+		"data-slot": "alert-dialog-title",
+		className: cn("text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", className),
+		...props
+	});
+}
+function AlertDialogDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Description, {
+		"data-slot": "alert-dialog-description",
+		className: cn("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", className),
+		...props
+	});
+}
+function AlertDialogAction({ className, variant = "default", size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		variant,
+		size,
+		asChild: true,
+		children: /* @__PURE__ */ jsx(AlertDialog$1.Action, {
+			"data-slot": "alert-dialog-action",
+			className: cn(className),
+			...props
+		})
+	});
+}
+function AlertDialogCancel({ className, variant = "outline", size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		variant,
+		size,
+		asChild: true,
+		children: /* @__PURE__ */ jsx(AlertDialog$1.Cancel, {
+			"data-slot": "alert-dialog-cancel",
+			className: cn(className),
+			...props
+		})
+	});
+}
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/animated-theme-toggler.d.ts

@@ -0,0 +1,11 @@
+//#region src/animated-theme-toggler.d.ts
+type TransitionVariant = "circle" | "square" | "triangle" | "diamond" | "hexagon" | "rectangle" | "star";
+interface AnimatedThemeTogglerProps extends React.ComponentPropsWithoutRef<"button"> {
+  duration?: number;
+  variant?: TransitionVariant;
+  /** When true, the transition expands from the viewport center instead of the button center. */
+  fromCenter?: boolean;
+}
+declare const AnimatedThemeToggler: ({ className, duration, variant, fromCenter, ...props }: AnimatedThemeTogglerProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { AnimatedThemeToggler, TransitionVariant };

package/dist/animated-theme-toggler.js

@@ -0,0 +1,169 @@
+import { cn } from "./utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { Moon, Sun } from "lucide-react";
+import { flushSync } from "react-dom";
+import { useTheme } from "next-themes";
+//#region src/animated-theme-toggler.tsx
+function polygonCollapsed(cx, cy, vertexCount) {
+	return `polygon(${Array.from({ length: vertexCount }, () => `${cx}px ${cy}px`).join(", ")})`;
+}
+function getThemeTransitionClipPaths(variant, cx, cy, maxRadius, viewportWidth, viewportHeight) {
+	switch (variant) {
+		case "circle": return [`circle(0px at ${cx}px ${cy}px)`, `circle(${maxRadius}px at ${cx}px ${cy}px)`];
+		case "square": {
+			const halfW = Math.max(cx, viewportWidth - cx);
+			const halfH = Math.max(cy, viewportHeight - cy);
+			const halfSide = Math.max(halfW, halfH) * 1.05;
+			const end = [
+				`${cx - halfSide}px ${cy - halfSide}px`,
+				`${cx + halfSide}px ${cy - halfSide}px`,
+				`${cx + halfSide}px ${cy + halfSide}px`,
+				`${cx - halfSide}px ${cy + halfSide}px`
+			].join(", ");
+			return [polygonCollapsed(cx, cy, 4), `polygon(${end})`];
+		}
+		case "triangle": {
+			const scale = maxRadius * 2.2;
+			const dx = Math.sqrt(3) / 2 * scale;
+			const verts = [
+				`${cx}px ${cy - scale}px`,
+				`${cx + dx}px ${cy + .5 * scale}px`,
+				`${cx - dx}px ${cy + .5 * scale}px`
+			].join(", ");
+			return [polygonCollapsed(cx, cy, 3), `polygon(${verts})`];
+		}
+		case "diamond": {
+			const R = maxRadius * Math.SQRT2;
+			const end = [
+				`${cx}px ${cy - R}px`,
+				`${cx + R}px ${cy}px`,
+				`${cx}px ${cy + R}px`,
+				`${cx - R}px ${cy}px`
+			].join(", ");
+			return [polygonCollapsed(cx, cy, 4), `polygon(${end})`];
+		}
+		case "hexagon": {
+			const R = maxRadius * Math.SQRT2;
+			const verts = [];
+			for (let i = 0; i < 6; i++) {
+				const a = -Math.PI / 2 + i * Math.PI / 3;
+				verts.push(`${cx + R * Math.cos(a)}px ${cy + R * Math.sin(a)}px`);
+			}
+			return [polygonCollapsed(cx, cy, 6), `polygon(${verts.join(", ")})`];
+		}
+		case "rectangle": {
+			const halfW = Math.max(cx, viewportWidth - cx);
+			const halfH = Math.max(cy, viewportHeight - cy);
+			const end = [
+				`${cx - halfW}px ${cy - halfH}px`,
+				`${cx + halfW}px ${cy - halfH}px`,
+				`${cx + halfW}px ${cy + halfH}px`,
+				`${cx - halfW}px ${cy + halfH}px`
+			].join(", ");
+			return [polygonCollapsed(cx, cy, 4), `polygon(${end})`];
+		}
+		case "star": {
+			const R = maxRadius * Math.SQRT2 * 1.03;
+			const innerRatio = .42;
+			const starPolygon = (radius) => {
+				const verts = [];
+				for (let i = 0; i < 5; i++) {
+					const outerA = -Math.PI / 2 + i * 2 * Math.PI / 5;
+					verts.push(`${cx + radius * Math.cos(outerA)}px ${cy + radius * Math.sin(outerA)}px`);
+					const innerA = outerA + Math.PI / 5;
+					verts.push(`${cx + radius * innerRatio * Math.cos(innerA)}px ${cy + radius * innerRatio * Math.sin(innerA)}px`);
+				}
+				return `polygon(${verts.join(", ")})`;
+			};
+			return [starPolygon(Math.max(2, R * .025)), starPolygon(R)];
+		}
+		default: return [`circle(0px at ${cx}px ${cy}px)`, `circle(${maxRadius}px at ${cx}px ${cy}px)`];
+	}
+}
+const AnimatedThemeToggler = ({ className, duration = 400, variant, fromCenter = false, ...props }) => {
+	const shape = variant ?? "circle";
+	const { theme, setTheme } = useTheme();
+	const [isDark, setIsDark] = useState(false);
+	const buttonRef = useRef(null);
+	useEffect(() => {
+		setIsDark(theme === "dark");
+	}, [theme]);
+	const toggleTheme = useCallback(() => {
+		const button = buttonRef.current;
+		if (!button) return;
+		const viewportWidth = window.visualViewport?.width ?? window.innerWidth;
+		const viewportHeight = window.visualViewport?.height ?? window.innerHeight;
+		let x;
+		let y;
+		if (fromCenter) {
+			x = viewportWidth / 2;
+			y = viewportHeight / 2;
+		} else {
+			const { top, left, width, height } = button.getBoundingClientRect();
+			x = left + width / 2;
+			y = top + height / 2;
+		}
+		const maxRadius = Math.hypot(Math.max(x, viewportWidth - x), Math.max(y, viewportHeight - y));
+		const newTheme = !isDark;
+		const applyTheme = () => {
+			setIsDark(newTheme);
+			document.documentElement.classList.toggle("dark", newTheme);
+		};
+		const syncNextThemes = () => {
+			setTheme(newTheme ? "dark" : "light");
+		};
+		if (typeof document.startViewTransition !== "function") {
+			applyTheme();
+			syncNextThemes();
+			return;
+		}
+		const clipPath = getThemeTransitionClipPaths(shape, x, y, maxRadius, viewportWidth, viewportHeight);
+		const root = document.documentElement;
+		root.dataset.magicuiThemeVt = "active";
+		root.style.setProperty("--magicui-theme-toggle-vt-duration", `${duration}ms`);
+		root.style.setProperty("--magicui-theme-vt-clip-from", clipPath[0]);
+		const cleanup = () => {
+			delete root.dataset.magicuiThemeVt;
+			root.style.removeProperty("--magicui-theme-toggle-vt-duration");
+			root.style.removeProperty("--magicui-theme-vt-clip-from");
+		};
+		const transition = document.startViewTransition(() => {
+			flushSync(applyTheme);
+		});
+		const onFinish = () => {
+			cleanup();
+			syncNextThemes();
+		};
+		if (typeof transition?.finished?.then === "function") transition.finished.then(onFinish);
+		else onFinish();
+		const ready = transition?.ready;
+		if (ready && typeof ready.then === "function") ready.then(() => {
+			document.documentElement.animate({ clipPath }, {
+				duration,
+				easing: shape === "star" ? "linear" : "ease-in-out",
+				fill: "forwards",
+				pseudoElement: "::view-transition-new(root)"
+			});
+		});
+	}, [
+		shape,
+		fromCenter,
+		duration,
+		isDark,
+		setTheme
+	]);
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		ref: buttonRef,
+		onClick: toggleTheme,
+		className: cn(className),
+		...props,
+		children: [isDark ? /* @__PURE__ */ jsx(Sun, { className: cn("size-5", className) }) : /* @__PURE__ */ jsx(Moon, { className: cn("size-5", className) }), /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Toggle theme"
+		})]
+	});
+};
+//#endregion
+export { AnimatedThemeToggler };

package/dist/auth-client.d.ts

@@ -0,0 +1,27 @@
+//#region src/auth-client.d.ts
+interface Session {
+  user: {
+    id: string;
+    email: string;
+    name: string;
+    role: 'USER' | 'ADMIN' | 'SUPER_ADMIN';
+    image?: string | null;
+    aiProvider?: string | null;
+    aiModel?: string | null;
+    hasAiKey?: boolean | null;
+    timezone?: string | null;
+  };
+  expires: string;
+}
+declare function useSession(): import("@tanstack/react-query").UseQueryResult<NoInfer<Session | null>, Error>;
+declare function signIn(provider: string, options?: {
+  redirectTo?: string;
+  email?: string;
+  password?: string;
+  remember?: boolean;
+}): Promise<void>;
+declare function signOut(): Promise<{
+  success: boolean;
+}>;
+//#endregion
+export { Session, signIn, signOut, useSession };

package/dist/auth-client.js

@@ -0,0 +1,86 @@
+import { useQuery } from "@tanstack/react-query";
+//#region src/auth-client.ts
+function useSession() {
+	return useQuery({
+		queryKey: ["session"],
+		queryFn: async () => {
+			const res = await fetch("/api/auth/session", { credentials: "include" });
+			if (!res.ok) return null;
+			const data = await res.json();
+			return data?.user ? data : null;
+		},
+		staleTime: 0,
+		refetchOnMount: true
+	});
+}
+async function signIn(provider, options) {
+	if (provider !== "credentials") {
+		const { csrfToken } = await (await fetch("/api/auth/csrf", { credentials: "include" })).json();
+		const redirectPath = options?.redirectTo ?? "/dashboard";
+		const callbackUrl = `${window.location.origin}${redirectPath}`;
+		const form = document.createElement("form");
+		form.method = "POST";
+		form.action = `/api/auth/signin/${provider}`;
+		form.style.display = "none";
+		const csrfInput = document.createElement("input");
+		csrfInput.name = "csrfToken";
+		csrfInput.value = csrfToken;
+		form.appendChild(csrfInput);
+		const cbInput = document.createElement("input");
+		cbInput.name = "callbackUrl";
+		cbInput.value = callbackUrl;
+		form.appendChild(cbInput);
+		document.body.appendChild(form);
+		form.submit();
+		return;
+	}
+	const { csrfToken } = await (await fetch("/api/auth/csrf", { credentials: "include" })).json();
+	const callbackUrl = options?.redirectTo ?? "/";
+	const form = document.createElement("form");
+	form.method = "POST";
+	form.action = "/api/auth/callback/credentials";
+	form.style.display = "none";
+	const fields = [
+		{
+			name: "email",
+			value: options?.email ?? ""
+		},
+		{
+			name: "password",
+			value: options?.password ?? ""
+		},
+		{
+			name: "remember",
+			value: String(options?.remember ?? false)
+		},
+		{
+			name: "callbackUrl",
+			value: callbackUrl
+		},
+		{
+			name: "csrfToken",
+			value: csrfToken
+		}
+	];
+	for (const field of fields) {
+		const input = document.createElement("input");
+		input.type = "hidden";
+		input.name = field.name;
+		input.value = field.value;
+		form.appendChild(input);
+	}
+	document.body.appendChild(form);
+	form.submit();
+}
+async function signOut() {
+	const { csrfToken } = await (await fetch("/api/auth/csrf", { credentials: "include" })).json();
+	await fetch("/api/auth/signout", {
+		method: "POST",
+		headers: { "Content-Type": "application/x-www-form-urlencoded" },
+		body: new URLSearchParams({ csrfToken }).toString(),
+		credentials: "include"
+	});
+	return { success: true };
+}
+//#endregion
+export { signIn, signOut, useSession };

package/dist/auth-layout.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+//#region src/auth-layout.d.ts
+interface AuthLayoutProps {
+  children: ReactNode;
+}
+declare function AuthLayout({ children }: AuthLayoutProps): import("react/jsx-runtime").JSX.Element;
+declare function AuthLayoutLeft({ children }: {
+  children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+declare function AuthLayoutRight({ children }: {
+  children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { AuthLayout, AuthLayoutLeft, AuthLayoutRight };

package/dist/auth-layout.js

@@ -0,0 +1,43 @@
+import { AnimatedThemeToggler } from "./animated-theme-toggler.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/auth-layout.tsx
+function AuthLayout({ children }) {
+	const left = findChild(children, AuthLayoutLeft);
+	const right = findChild(children, AuthLayoutRight);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex min-h-screen",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "relative flex flex-1 items-center justify-center p-6",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "absolute",
+				style: {
+					top: "1.5rem",
+					right: "1.5rem"
+				},
+				children: /* @__PURE__ */ jsx(AnimatedThemeToggler, { className: "flex size-6 items-center justify-center rounded-full hover:bg-accent" })
+			}), /* @__PURE__ */ jsx("div", {
+				className: "w-full max-w-sm space-y-6",
+				children: left
+			})]
+		}), right && /* @__PURE__ */ jsx("div", {
+			className: "hidden lg:flex flex-1 bg-linear-to-br from-primary/10 via-primary/5 to-background items-center justify-center p-12",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "w-full max-w-md text-center space-y-8",
+				children: right
+			})
+		})]
+	});
+}
+function AuthLayoutLeft({ children }) {
+	return /* @__PURE__ */ jsx(Fragment, { children });
+}
+function AuthLayoutRight({ children }) {
+	return /* @__PURE__ */ jsx(Fragment, { children });
+}
+function findChild(children, type) {
+	const arr = Array.isArray(children) ? children : [children];
+	for (const child of arr) if (child?.type === type) return child.props.children;
+	return null;
+}
+//#endregion
+export { AuthLayout, AuthLayoutLeft, AuthLayoutRight };

package/dist/avatar.d.ts

@@ -0,0 +1,13 @@
+import * as React$1 from "react";
+import { Avatar as Avatar$1 } from "radix-ui";
+//#region src/avatar.d.ts
+declare function Avatar({ className, size, ...props }: React$1.ComponentProps<typeof Avatar$1.Root> & {
+  size?: "default" | "sm" | "lg";
+}): import("react/jsx-runtime").JSX.Element;
+declare function AvatarImage({ className, ...props }: React$1.ComponentProps<typeof Avatar$1.Image>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarFallback({ className, ...props }: React$1.ComponentProps<typeof Avatar$1.Fallback>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarBadge({ className, ...props }: React$1.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
+declare function AvatarGroup({ className, ...props }: React$1.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function AvatarGroupCount({ className, ...props }: React$1.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };

package/dist/avatar.js

@@ -0,0 +1,51 @@
+"use client";
+import { cn } from "./utils.js";
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Avatar as Avatar$1 } from "radix-ui";
+//#region src/avatar.tsx
+function Avatar({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Avatar$1.Root, {
+		"data-slot": "avatar",
+		"data-size": size,
+		className: cn("group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten", className),
+		...props
+	});
+}
+function AvatarImage({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Avatar$1.Image, {
+		"data-slot": "avatar-image",
+		className: cn("aspect-square size-full rounded-full object-cover", className),
+		...props
+	});
+}
+function AvatarFallback({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Avatar$1.Fallback, {
+		"data-slot": "avatar-fallback",
+		className: cn("flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs", className),
+		...props
+	});
+}
+function AvatarBadge({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "avatar-badge",
+		className: cn("absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className),
+		...props
+	});
+}
+function AvatarGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "avatar-group",
+		className: cn("group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background", className),
+		...props
+	});
+}
+function AvatarGroupCount({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "avatar-group-count",
+		className: cn("relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3", className),
+		...props
+	});
+}
+//#endregion
+export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };

package/dist/badge.d.ts

@@ -0,0 +1,11 @@
+import * as React$1 from "react";
+import { VariantProps } from "class-variance-authority";
+//#region src/badge.d.ts
+declare const badgeVariants: (props?: ({
+  variant?: "default" | "destructive" | "ghost" | "link" | "outline" | "secondary" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Badge({ className, variant, asChild, ...props }: React$1.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+  asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Badge, badgeVariants };

package/dist/badge.js

@@ -0,0 +1,28 @@
+import { cn } from "./utils.js";
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Slot } from "radix-ui";
+import { cva } from "class-variance-authority";
+//#region src/badge.tsx
+const badgeVariants = cva("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!", {
+	variants: { variant: {
+		default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+		secondary: "bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
+		destructive: "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
+		outline: "border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
+		ghost: "hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
+		link: "text-primary underline-offset-4 hover:underline"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function Badge({ className, variant = "default", asChild = false, ...props }) {
+	const Comp = asChild ? Slot.Root : "span";
+	return /* @__PURE__ */ jsx(Comp, {
+		"data-slot": "badge",
+		"data-variant": variant,
+		className: cn(badgeVariants({ variant }), className),
+		...props
+	});
+}
+//#endregion
+export { Badge, badgeVariants };

package/dist/button.d.ts

@@ -0,0 +1,12 @@
+import * as React$1 from "react";
+import { VariantProps } from "class-variance-authority";
+//#region src/button.d.ts
+declare const buttonVariants: (props?: ({
+  variant?: "default" | "destructive" | "ghost" | "link" | "outline" | "secondary" | null | undefined;
+  size?: "default" | "icon" | "icon-lg" | "icon-sm" | "icon-xs" | "lg" | "sm" | "xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+  asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Button, buttonVariants };