@camox/ui 0.36.0 → 0.36.2

package/dist/components/tabs.d.ts

@@ -0,0 +1,29 @@
+import { VariantProps } from "class-variance-authority";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/tabs.d.ts
+declare function Tabs({
+  className,
+  orientation,
+  ...props
+}: Tabs$1.Root.Props): _$react_jsx_runtime0.JSX.Element;
+declare const tabsListVariants: (props?: ({
+  variant?: "line" | "default" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function TabsList({
+  className,
+  variant,
+  ...props
+}: Tabs$1.List.Props & VariantProps<typeof tabsListVariants>): _$react_jsx_runtime0.JSX.Element;
+declare function TabsTrigger({
+  className,
+  ...props
+}: Tabs$1.Tab.Props): _$react_jsx_runtime0.JSX.Element;
+declare function TabsContent({
+  className,
+  ...props
+}: Tabs$1.Panel.Props): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants };

package/dist/components/tabs.js

@@ -0,0 +1,46 @@
+import { cn } from "../lib/utils.js";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
+
+//#region src/components/tabs.tsx
+function Tabs({ className, orientation = "horizontal", ...props }) {
+	return /* @__PURE__ */ jsx(Tabs$1.Root, {
+		"data-slot": "tabs",
+		"data-orientation": orientation,
+		className: cn("group/tabs flex gap-2 data-horizontal:flex-col", className),
+		...props
+	});
+}
+const tabsListVariants = cva("group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-9 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none", {
+	variants: { variant: {
+		default: "bg-muted",
+		line: "gap-1 bg-transparent"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function TabsList({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Tabs$1.List, {
+		"data-slot": "tabs-list",
+		"data-variant": variant,
+		className: cn(tabsListVariants({ variant }), className),
+		...props
+	});
+}
+function TabsTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs$1.Tab, {
+		"data-slot": "tabs-trigger",
+		className: cn("relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent", "data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100", className),
+		...props
+	});
+}
+function TabsContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs$1.Panel, {
+		"data-slot": "tabs-content",
+		className: cn("flex-1 text-sm outline-none", className),
+		...props
+	});
+}
+
+//#endregion
+export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants };

package/dist/components/textarea.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/textarea.d.ts
+declare function Textarea({
+  className,
+  ...props
+}: React.ComponentProps<"textarea">): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Textarea };

package/dist/components/textarea.js

@@ -0,0 +1,15 @@
+import { cn } from "../lib/utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/textarea.tsx
+function Textarea({ className, ...props }) {
+	return /* @__PURE__ */ jsx("textarea", {
+		"data-slot": "textarea",
+		className: cn("flex field-sizing-content min-h-16 w-full rounded-md border border-input bg-transparent px-2.5 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", className),
+		...props
+	});
+}
+
+//#endregion
+export { Textarea };

package/dist/components/toaster.d.ts

@@ -0,0 +1,11 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ToasterProps, toast } from "sonner";
+
+//#region src/components/toaster.d.ts
+declare const Toaster: ({
+  theme,
+  className,
+  ...props
+}: ToasterProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Toaster, toast };

package/dist/components/toaster.js

@@ -0,0 +1,21 @@
+import { cn } from "../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+import { Toaster as Toaster$1, toast } from "sonner";
+
+//#region src/components/toaster.tsx
+const Toaster = ({ theme = "system", className, ...props }) => {
+	return /* @__PURE__ */ jsx(Toaster$1, {
+		theme,
+		className: cn("toaster group camox-studio-theme", theme === "dark" && "dark", className),
+		style: {
+			"--normal-bg": "var(--popover)",
+			"--normal-text": "var(--popover-foreground)",
+			"--normal-border": "var(--border)"
+		},
+		position: "top-center",
+		...props
+	});
+};
+
+//#endregion
+export { Toaster, toast };

package/dist/components/toggle.d.ts

@@ -0,0 +1,18 @@
+import { VariantProps } from "class-variance-authority";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Toggle as Toggle$1 } from "@base-ui/react/toggle";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/toggle.d.ts
+declare const toggleVariants: (props?: ({
+  variant?: "default" | "outline" | null | undefined;
+  size?: "default" | "sm" | "lg" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function Toggle({
+  className,
+  variant,
+  size,
+  ...props
+}: Toggle$1.Props & VariantProps<typeof toggleVariants>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Toggle, toggleVariants };

package/dist/components/toggle.js

@@ -0,0 +1,37 @@
+import { cn } from "../lib/utils.js";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+import { Toggle as Toggle$1 } from "@base-ui/react/toggle";
+
+//#region src/components/toggle.tsx
+const toggleVariants = cva("group/toggle inline-flex items-center justify-center gap-1 rounded-md text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-accent hover:text-accent-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-accent dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
+	variants: {
+		variant: {
+			default: "bg-transparent",
+			outline: "border border-input bg-transparent shadow-xs hover:bg-accent"
+		},
+		size: {
+			default: "h-9 min-w-9 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+			sm: "h-8 min-w-8 px-2.5 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5",
+			lg: "h-10 min-w-10 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function Toggle({ className, variant = "default", size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Toggle$1, {
+		"data-slot": "toggle",
+		className: cn(toggleVariants({
+			variant,
+			size,
+			className
+		})),
+		...props
+	});
+}
+
+//#endregion
+export { Toggle, toggleVariants };

package/dist/components/tooltip.d.ts

@@ -0,0 +1,25 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
+
+//#region src/components/tooltip.d.ts
+declare function TooltipProvider({
+  delay,
+  ...props
+}: Tooltip$1.Provider.Props): _$react_jsx_runtime0.JSX.Element;
+declare function Tooltip({
+  ...props
+}: Tooltip$1.Root.Props): _$react_jsx_runtime0.JSX.Element;
+declare function TooltipTrigger({
+  ...props
+}: Tooltip$1.Trigger.Props): _$react_jsx_runtime0.JSX.Element;
+declare function TooltipContent({
+  className,
+  side,
+  sideOffset,
+  align,
+  alignOffset,
+  children,
+  ...props
+}: Tooltip$1.Popup.Props & Pick<Tooltip$1.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/components/tooltip.js

@@ -0,0 +1,42 @@
+import { cn } from "../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
+
+//#region src/components/tooltip.tsx
+function TooltipProvider({ delay = 0, ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Provider, {
+		"data-slot": "tooltip-provider",
+		delay,
+		...props
+	});
+}
+function Tooltip({ ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Root, {
+		"data-slot": "tooltip",
+		...props
+	});
+}
+function TooltipTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Trigger, {
+		"data-slot": "tooltip-trigger",
+		...props
+	});
+}
+function TooltipContent({ className, side = "top", sideOffset = 4, align = "center", alignOffset = 0, children, ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, {
+		align,
+		alignOffset,
+		side,
+		sideOffset,
+		className: "isolate z-50",
+		children: /* @__PURE__ */ jsxs(Tooltip$1.Popup, {
+			"data-slot": "tooltip-content",
+			className: cn("z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 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,
+			children: [children, /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })]
+		})
+	}) });
+}
+
+//#endregion
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/lib/utils.d.ts

@@ -0,0 +1,10 @@
+import { ClassValue } from "clsx";
+
+//#region src/lib/utils.d.ts
+declare function cn(...inputs: Array<ClassValue>): string;
+/** Shared focus-ring + validation styles for all input-like elements (Input, Textarea, ContentEditable, etc.) */
+declare const INPUT_FOCUS_STYLES = "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive";
+/** Shared base styles for input-like elements (border, text, shadow, transition, outline) */
+declare const INPUT_BASE_STYLES = "border-input placeholder:text-muted-foreground rounded-md border bg-transparent text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm";
+//#endregion
+export { INPUT_BASE_STYLES, INPUT_FOCUS_STYLES, cn };

package/dist/lib/utils.js

@@ -0,0 +1,14 @@
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+//#region src/lib/utils.ts
+function cn(...inputs) {
+	return twMerge(clsx(inputs));
+}
+/** Shared focus-ring + validation styles for all input-like elements (Input, Textarea, ContentEditable, etc.) */
+const INPUT_FOCUS_STYLES = "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive";
+/** Shared base styles for input-like elements (border, text, shadow, transition, outline) */
+const INPUT_BASE_STYLES = "border-input placeholder:text-muted-foreground rounded-md border bg-transparent text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm";
+
+//#endregion
+export { INPUT_BASE_STYLES, INPUT_FOCUS_STYLES, cn };

package/package.json

@@ -1,123 +1,123 @@
 {
   "name": "@camox/ui",
-  "version": "0.36.0",
+  "version": "0.36.2",
   "license": "MIT",
   "files": [
-    "src"
+    "dist"
   ],
   "type": "module",
   "exports": {
     "./utils": {
-      "types": "./src/lib/utils.ts",
-      "default": "./src/lib/utils.ts"
+      "types": "./dist/lib/utils.d.ts",
+      "default": "./dist/lib/utils.js"
     },
     "./alert-dialog": {
-      "types": "./src/components/alert-dialog.tsx",
-      "default": "./src/components/alert-dialog.tsx"
+      "types": "./dist/components/alert-dialog.d.ts",
+      "default": "./dist/components/alert-dialog.js"
     },
     "./alert": {
-      "types": "./src/components/alert.tsx",
-      "default": "./src/components/alert.tsx"
+      "types": "./dist/components/alert.d.ts",
+      "default": "./dist/components/alert.js"
     },
     "./avatar": {
-      "types": "./src/components/avatar.tsx",
-      "default": "./src/components/avatar.tsx"
+      "types": "./dist/components/avatar.d.ts",
+      "default": "./dist/components/avatar.js"
     },
     "./badge": {
-      "types": "./src/components/badge.tsx",
-      "default": "./src/components/badge.tsx"
+      "types": "./dist/components/badge.d.ts",
+      "default": "./dist/components/badge.js"
     },
     "./button-group": {
-      "types": "./src/components/button-group.tsx",
-      "default": "./src/components/button-group.tsx"
+      "types": "./dist/components/button-group.d.ts",
+      "default": "./dist/components/button-group.js"
     },
     "./button": {
-      "types": "./src/components/button.tsx",
-      "default": "./src/components/button.tsx"
+      "types": "./dist/components/button.d.ts",
+      "default": "./dist/components/button.js"
     },
     "./command": {
-      "types": "./src/components/command.tsx",
-      "default": "./src/components/command.tsx"
+      "types": "./dist/components/command.d.ts",
+      "default": "./dist/components/command.js"
     },
     "./dialog": {
-      "types": "./src/components/dialog.tsx",
-      "default": "./src/components/dialog.tsx"
+      "types": "./dist/components/dialog.d.ts",
+      "default": "./dist/components/dialog.js"
     },
     "./dropdown-menu": {
-      "types": "./src/components/dropdown-menu.tsx",
-      "default": "./src/components/dropdown-menu.tsx"
+      "types": "./dist/components/dropdown-menu.d.ts",
+      "default": "./dist/components/dropdown-menu.js"
     },
     "./floating-toolbar": {
-      "types": "./src/components/floating-toolbar.tsx",
-      "default": "./src/components/floating-toolbar.tsx"
+      "types": "./dist/components/floating-toolbar.d.ts",
+      "default": "./dist/components/floating-toolbar.js"
     },
     "./input-group": {
-      "types": "./src/components/input-group.tsx",
-      "default": "./src/components/input-group.tsx"
+      "types": "./dist/components/input-group.d.ts",
+      "default": "./dist/components/input-group.js"
     },
     "./input": {
-      "types": "./src/components/input.tsx",
-      "default": "./src/components/input.tsx"
+      "types": "./dist/components/input.d.ts",
+      "default": "./dist/components/input.js"
     },
     "./kbd": {
-      "types": "./src/components/kbd.tsx",
-      "default": "./src/components/kbd.tsx"
+      "types": "./dist/components/kbd.d.ts",
+      "default": "./dist/components/kbd.js"
     },
     "./label": {
-      "types": "./src/components/label.tsx",
-      "default": "./src/components/label.tsx"
+      "types": "./dist/components/label.d.ts",
+      "default": "./dist/components/label.js"
     },
     "./panel": {
-      "types": "./src/components/panel.tsx",
-      "default": "./src/components/panel.tsx"
+      "types": "./dist/components/panel.d.ts",
+      "default": "./dist/components/panel.js"
     },
     "./popover": {
-      "types": "./src/components/popover.tsx",
-      "default": "./src/components/popover.tsx"
+      "types": "./dist/components/popover.d.ts",
+      "default": "./dist/components/popover.js"
     },
     "./select": {
-      "types": "./src/components/select.tsx",
-      "default": "./src/components/select.tsx"
+      "types": "./dist/components/select.d.ts",
+      "default": "./dist/components/select.js"
     },
     "./separator": {
-      "types": "./src/components/separator.tsx",
-      "default": "./src/components/separator.tsx"
+      "types": "./dist/components/separator.d.ts",
+      "default": "./dist/components/separator.js"
     },
     "./sheet": {
-      "types": "./src/components/sheet.tsx",
-      "default": "./src/components/sheet.tsx"
+      "types": "./dist/components/sheet.d.ts",
+      "default": "./dist/components/sheet.js"
     },
     "./skeleton": {
-      "types": "./src/components/skeleton.tsx",
-      "default": "./src/components/skeleton.tsx"
+      "types": "./dist/components/skeleton.d.ts",
+      "default": "./dist/components/skeleton.js"
     },
     "./spinner": {
-      "types": "./src/components/spinner.tsx",
-      "default": "./src/components/spinner.tsx"
+      "types": "./dist/components/spinner.d.ts",
+      "default": "./dist/components/spinner.js"
     },
     "./switch": {
-      "types": "./src/components/switch.tsx",
-      "default": "./src/components/switch.tsx"
+      "types": "./dist/components/switch.d.ts",
+      "default": "./dist/components/switch.js"
     },
     "./tabs": {
-      "types": "./src/components/tabs.tsx",
-      "default": "./src/components/tabs.tsx"
+      "types": "./dist/components/tabs.d.ts",
+      "default": "./dist/components/tabs.js"
     },
     "./textarea": {
-      "types": "./src/components/textarea.tsx",
-      "default": "./src/components/textarea.tsx"
+      "types": "./dist/components/textarea.d.ts",
+      "default": "./dist/components/textarea.js"
     },
     "./toaster": {
-      "types": "./src/components/toaster.tsx",
-      "default": "./src/components/toaster.tsx"
+      "types": "./dist/components/toaster.d.ts",
+      "default": "./dist/components/toaster.js"
     },
     "./toggle": {
-      "types": "./src/components/toggle.tsx",
-      "default": "./src/components/toggle.tsx"
+      "types": "./dist/components/toggle.d.ts",
+      "default": "./dist/components/toggle.js"
     },
     "./tooltip": {
-      "types": "./src/components/tooltip.tsx",
-      "default": "./src/components/tooltip.tsx"
+      "types": "./dist/components/tooltip.d.ts",
+      "default": "./dist/components/tooltip.js"
     }
   },
   "dependencies": {
@@ -141,5 +141,8 @@
     "tags": [
       "type:pkg"
     ]
+  },
+  "scripts": {
+    "build": "vp pack"
   }
 }

package/src/components/alert-dialog.tsx

@@ -1,160 +0,0 @@
-import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
-import * as React from "react";
-
-import { cn } from "../lib/utils";
-import { Button } from "./button";
-
-function AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {
-  return <AlertDialogPrimitive.Root data-slot="alert-dialog" {...props} />;
-}
-
-function AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {
-  return <AlertDialogPrimitive.Trigger data-slot="alert-dialog-trigger" {...props} />;
-}
-
-function AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {
-  return <AlertDialogPrimitive.Portal data-slot="alert-dialog-portal" {...props} />;
-}
-
-function AlertDialogOverlay({ className, ...props }: AlertDialogPrimitive.Backdrop.Props) {
-  return (
-    <AlertDialogPrimitive.Backdrop
-      data-slot="alert-dialog-overlay"
-      className={cn(
-        "fixed inset-0 isolate z-50 bg-black/66 duration-100 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
-}: AlertDialogPrimitive.Popup.Props & {
-  size?: "default" | "sm";
-}) {
-  return (
-    <AlertDialogPortal>
-      <AlertDialogOverlay />
-      <AlertDialogPrimitive.Popup
-        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-6 rounded-xl bg-popover p-6 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-lg 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}
-      />
-    </AlertDialogPortal>
-  );
-}
-
-function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <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-6 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 }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-dialog-footer"
-      className={cn(
-        "flex flex-col-reverse gap-2 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 }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-dialog-media"
-      className={cn(
-        "mb-2 inline-flex size-16 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8",
-        className,
-      )}
-      {...props}
-    />
-  );
-}
-
-function AlertDialogTitle({
-  className,
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {
-  return (
-    <AlertDialogPrimitive.Title
-      data-slot="alert-dialog-title"
-      className={cn(
-        "text-lg 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
-}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {
-  return (
-    <AlertDialogPrimitive.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, ...props }: React.ComponentProps<typeof Button>) {
-  return <Button data-slot="alert-dialog-action" className={cn(className)} {...props} />;
-}
-
-function AlertDialogCancel({
-  className,
-  variant = "outline",
-  size = "default",
-  ...props
-}: AlertDialogPrimitive.Close.Props &
-  Pick<React.ComponentProps<typeof Button>, "variant" | "size">) {
-  return (
-    <AlertDialogPrimitive.Close
-      data-slot="alert-dialog-cancel"
-      className={cn(className)}
-      render={<Button variant={variant} size={size} />}
-      {...props}
-    />
-  );
-}
-
-export {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogMedia,
-  AlertDialogOverlay,
-  AlertDialogPortal,
-  AlertDialogTitle,
-  AlertDialogTrigger,
-};