@prototyperco/ui 0.5.0-alpha.0 → 0.5.0

package/dist/components/alert-dialog.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/alert-dialog.tsx","../../src/lib/utils.ts","../../src/components/button.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\n\nfunction AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  );\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {\n  return (\n    <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n  );\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: AlertDialogPrimitive.Backdrop.Props) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        \"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-overlay-backdrop duration-200 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50 transition motion-reduce:animate-none motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Popup.Props & {\n  size?: \"default\" | \"sm\";\n}) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={cn(\n          \"bg-overlay text-overlay-foreground shadow-overlay data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-[0.98] data-open:zoom-in-[1.02] ring-border-light gap-6 rounded-xl p-6 ring-1 duration-200 ease-out-fluid data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none transition data-entering:will-change-[opacity,transform] data-exiting:will-change-[opacity,transform] motion-reduce:animate-none motion-reduce:transition-none\",\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  );\n}\n\nfunction AlertDialogHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        \"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]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogFooter({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        \"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\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogMedia({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"bg-surface-secondary mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\n        \"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\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\n        \"text-muted-foreground *:[a]:hover-only:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogAction({\n  className,\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  return (\n    <Button\n      data-slot=\"alert-dialog-action\"\n      className={cn(className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = \"outline\",\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Close.Props &\n  Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(className)}\n      render={<Button variant={variant} size={size} />}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n\nexport type AlertDialogProps = React.ComponentProps<typeof AlertDialog>;\nexport type AlertDialogContentProps = React.ComponentProps<\n  typeof AlertDialogContent\n>;\nexport type AlertDialogTriggerProps = React.ComponentProps<\n  typeof AlertDialogTrigger\n>;\nexport type AlertDialogActionProps = React.ComponentProps<\n  typeof AlertDialogAction\n>;\nexport type AlertDialogCancelProps = React.ComponentProps<\n  typeof AlertDialogCancel\n>;\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst buttonVariants = cva(\n  [\n    \"inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium\",\n    \"transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth\",\n    \"motion-reduce:transition-none\",\n    \"disabled:status-disabled\",\n    \"focus-visible:focus-ring\",\n    \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    \"shrink-0 group/button select-none no-highlight\",\n  ],\n  {\n    variants: {\n      variant: {\n        default: [\n          // Base styles\n          \"relative rounded-lg overflow-visible shadow-surface border border-primary dark:border-primary-dark\",\n          \"isolate text-primary-foreground [text-shadow:_0_1px_2px_oklch(0%_0_0_/_30%)]\",\n          \"[&>*]:relative [&>*]:z-[2]\",\n          // Combined gradient layer with primary colors\n          \"before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]\",\n          \"before:bg-gradient-to-br before:from-primary-light before:via-primary-middle before:to-primary-dark\",\n          \"before:dark:from-primary-light before:dark:via-primary-middle before:dark:to-primary-dark\",\n          \"before:z-[-1]\",\n          // Additional outer border\n          \"after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]\",\n          \"after:bg-gradient-to-br after:from-primary after:to-primary-dark\",\n          \"after:z-[-1] after:transition-opacity after:duration-200 after:opacity-40 after:motion-reduce:transition-none\",\n          // Hover state\n          \"hover-only:after:opacity-100 hover-only:transition-opacity hover-only:duration-200\",\n        ].join(\" \"),\n        destructive:\n          \"bg-destructive text-destructive-foreground hover-only:hover:bg-destructive-hover\",\n        outline: [\n          // Base styles\n          \"relative rounded-lg overflow-visible shadow-field border\",\n          \"isolate text-foreground\",\n          \"[&>*]:relative [&>*]:z-[2]\",\n          // Background layer\n          \"before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]\",\n          \"before:bg-gradient-to-br before:from-border-light before:via-border before:to-border-dark/50\",\n          \"before:dark:from-border-light before:dark:to-border-dark\",\n          \"before:z-[-1]\",\n          // Inner background layer\n          \"after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]\",\n          \"after:bg-background\",\n          \"after:z-[-1]\",\n          \"after:transition-colors after:duration-200 after:ease-out after:motion-reduce:transition-none\",\n          // Hover state\n          \"hover-only:after:bg-muted\",\n        ].join(\" \"),\n        secondary:\n          \"bg-secondary text-secondary-foreground hover-only:hover:bg-accent\",\n        ghost:\n          \"hover-only:bg-accent hover-only:text-accent-foreground motion-safe:active:scale-100\",\n        \"primary-soft\":\n          \"bg-primary-soft text-primary hover-only:hover:bg-primary-soft-hover\",\n        \"destructive-soft\":\n          \"bg-destructive-soft text-destructive hover-only:hover:bg-destructive-soft-hover\",\n        success:\n          \"bg-success text-success-foreground hover-only:hover:bg-success-hover\",\n        warning:\n          \"bg-warning text-warning-foreground hover-only:hover:bg-warning-hover\",\n        link: \"dark:text-primary-light text-primary-dark underline-offset-4 hover-only:underline motion-safe:active:scale-100\",\n      },\n      size: {\n        default:\n          \"h-9 gap-2 px-4 py-1 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 motion-safe:active:scale-[0.97]\",\n        xs: \"h-6 gap-1 rounded-lg px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3 motion-safe:active:scale-[0.985]\",\n        sm: \"h-8 gap-1.5 rounded-lg px-3 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 motion-safe:active:scale-[0.98]\",\n        lg: \"h-10 gap-2 rounded-lg px-8 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3 motion-safe:active:scale-[0.96]\",\n        icon: \"size-9 motion-safe:active:scale-[0.97]\",\n        \"icon-xs\":\n          \"size-6 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.985]\",\n        \"icon-sm\":\n          \"size-8 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.98]\",\n        \"icon-lg\": \"size-10 motion-safe:active:scale-[0.96]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  isPending,\n  nativeButton,\n  render,\n  ...props\n}: ButtonPrimitive.Props &\n  VariantProps<typeof buttonVariants> & { isPending?: boolean }) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      data-pending={isPending || undefined}\n      aria-disabled={isPending || undefined}\n      nativeButton={nativeButton ?? (render ? false : undefined)}\n      render={render}\n      className={cn(\n        buttonVariants({ variant, size }),\n        isPending && \"status-pending\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n\nexport type ButtonProps = React.ComponentProps<typeof Button>;\n"],"mappings":"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","names":["ButtonPrimitive","import_jsx_runtime","AlertDialogPrimitive"]}

package/dist/components/alert-dialog.d.cts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { AlertDialog as AlertDialog$1 } from '@base-ui/react/alert-dialog';
+import { Button } from './button.cjs';
+import 'class-variance-authority/types';
+import '@base-ui/react/button';
+import 'class-variance-authority';
+
+declare function AlertDialog({ ...props }: AlertDialog$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTrigger({ ...props }: AlertDialog$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogPortal({ ...props }: AlertDialog$1.Portal.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: AlertDialog$1.Backdrop.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: AlertDialog$1.Popup.Props & {
+    size?: "default" | "sm";
+}): react_jsx_runtime.JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialog$1.Title>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialog$1.Description>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogAction({ className, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialog$1.Close.Props & Pick<React.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime.JSX.Element;
+
+type AlertDialogProps = React.ComponentProps<typeof AlertDialog>;
+type AlertDialogContentProps = React.ComponentProps<typeof AlertDialogContent>;
+type AlertDialogTriggerProps = React.ComponentProps<typeof AlertDialogTrigger>;
+type AlertDialogActionProps = React.ComponentProps<typeof AlertDialogAction>;
+type AlertDialogCancelProps = React.ComponentProps<typeof AlertDialogCancel>;
+
+export { AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, type AlertDialogProps, AlertDialogTitle, AlertDialogTrigger, type AlertDialogTriggerProps };

package/dist/components/alert-dialog.d.ts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { AlertDialog as AlertDialog$1 } from '@base-ui/react/alert-dialog';
+import { Button } from './button.js';
+import 'class-variance-authority/types';
+import '@base-ui/react/button';
+import 'class-variance-authority';
+
+declare function AlertDialog({ ...props }: AlertDialog$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTrigger({ ...props }: AlertDialog$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogPortal({ ...props }: AlertDialog$1.Portal.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: AlertDialog$1.Backdrop.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: AlertDialog$1.Popup.Props & {
+    size?: "default" | "sm";
+}): react_jsx_runtime.JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialog$1.Title>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialog$1.Description>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogAction({ className, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialog$1.Close.Props & Pick<React.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime.JSX.Element;
+
+type AlertDialogProps = React.ComponentProps<typeof AlertDialog>;
+type AlertDialogContentProps = React.ComponentProps<typeof AlertDialogContent>;
+type AlertDialogTriggerProps = React.ComponentProps<typeof AlertDialogTrigger>;
+type AlertDialogActionProps = React.ComponentProps<typeof AlertDialogAction>;
+type AlertDialogCancelProps = React.ComponentProps<typeof AlertDialogCancel>;
+
+export { AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, type AlertDialogProps, AlertDialogTitle, AlertDialogTrigger, type AlertDialogTriggerProps };

package/dist/components/alert-dialog.js

@@ -0,0 +1,289 @@
+"use client";
+
+// src/components/alert-dialog.tsx
+import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/button.tsx
+import { Button as ButtonPrimitive } from "@base-ui/react/button";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var buttonVariants = cva(
+  [
+    "inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium",
+    "transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth",
+    "motion-reduce:transition-none",
+    "disabled:status-disabled",
+    "focus-visible:focus-ring",
+    "[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+    "shrink-0 group/button select-none no-highlight"
+  ],
+  {
+    variants: {
+      variant: {
+        default: [
+          // Base styles
+          "relative rounded-lg overflow-visible shadow-surface border border-primary dark:border-primary-dark",
+          "isolate text-primary-foreground [text-shadow:_0_1px_2px_oklch(0%_0_0_/_30%)]",
+          "[&>*]:relative [&>*]:z-[2]",
+          // Combined gradient layer with primary colors
+          "before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]",
+          "before:bg-gradient-to-br before:from-primary-light before:via-primary-middle before:to-primary-dark",
+          "before:dark:from-primary-light before:dark:via-primary-middle before:dark:to-primary-dark",
+          "before:z-[-1]",
+          // Additional outer border
+          "after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]",
+          "after:bg-gradient-to-br after:from-primary after:to-primary-dark",
+          "after:z-[-1] after:transition-opacity after:duration-200 after:opacity-40 after:motion-reduce:transition-none",
+          // Hover state
+          "hover-only:after:opacity-100 hover-only:transition-opacity hover-only:duration-200"
+        ].join(" "),
+        destructive: "bg-destructive text-destructive-foreground hover-only:hover:bg-destructive-hover",
+        outline: [
+          // Base styles
+          "relative rounded-lg overflow-visible shadow-field border",
+          "isolate text-foreground",
+          "[&>*]:relative [&>*]:z-[2]",
+          // Background layer
+          "before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]",
+          "before:bg-gradient-to-br before:from-border-light before:via-border before:to-border-dark/50",
+          "before:dark:from-border-light before:dark:to-border-dark",
+          "before:z-[-1]",
+          // Inner background layer
+          "after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]",
+          "after:bg-background",
+          "after:z-[-1]",
+          "after:transition-colors after:duration-200 after:ease-out after:motion-reduce:transition-none",
+          // Hover state
+          "hover-only:after:bg-muted"
+        ].join(" "),
+        secondary: "bg-secondary text-secondary-foreground hover-only:hover:bg-accent",
+        ghost: "hover-only:bg-accent hover-only:text-accent-foreground motion-safe:active:scale-100",
+        "primary-soft": "bg-primary-soft text-primary hover-only:hover:bg-primary-soft-hover",
+        "destructive-soft": "bg-destructive-soft text-destructive hover-only:hover:bg-destructive-soft-hover",
+        success: "bg-success text-success-foreground hover-only:hover:bg-success-hover",
+        warning: "bg-warning text-warning-foreground hover-only:hover:bg-warning-hover",
+        link: "dark:text-primary-light text-primary-dark underline-offset-4 hover-only:underline motion-safe:active:scale-100"
+      },
+      size: {
+        default: "h-9 gap-2 px-4 py-1 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 motion-safe:active:scale-[0.97]",
+        xs: "h-6 gap-1 rounded-lg px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3 motion-safe:active:scale-[0.985]",
+        sm: "h-8 gap-1.5 rounded-lg px-3 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 motion-safe:active:scale-[0.98]",
+        lg: "h-10 gap-2 rounded-lg px-8 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3 motion-safe:active:scale-[0.96]",
+        icon: "size-9 motion-safe:active:scale-[0.97]",
+        "icon-xs": "size-6 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.985]",
+        "icon-sm": "size-8 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.98]",
+        "icon-lg": "size-10 motion-safe:active:scale-[0.96]"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  isPending,
+  nativeButton,
+  render,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ButtonPrimitive,
+    {
+      "data-slot": "button",
+      "data-pending": isPending || void 0,
+      "aria-disabled": isPending || void 0,
+      nativeButton: nativeButton ?? (render ? false : void 0),
+      render,
+      className: cn(
+        buttonVariants({ variant, size }),
+        isPending && "status-pending",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/alert-dialog.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+function AlertDialog({ ...props }) {
+  return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
+}
+function AlertDialogTrigger({ ...props }) {
+  return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Trigger, { "data-slot": "alert-dialog-trigger", ...props });
+}
+function AlertDialogPortal({ ...props }) {
+  return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
+}
+function AlertDialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    AlertDialogPrimitive.Backdrop,
+    {
+      "data-slot": "alert-dialog-overlay",
+      className: cn(
+        "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-overlay-backdrop duration-200 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50 transition motion-reduce:animate-none motion-reduce:transition-none",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogContent({
+  className,
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsx2(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsx2(
+      AlertDialogPrimitive.Popup,
+      {
+        "data-slot": "alert-dialog-content",
+        "data-size": size,
+        className: cn(
+          "bg-overlay text-overlay-foreground shadow-overlay data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-[0.98] data-open:zoom-in-[1.02] ring-border-light gap-6 rounded-xl p-6 ring-1 duration-200 ease-out-fluid data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none transition data-entering:will-change-[opacity,transform] data-exiting:will-change-[opacity,transform] motion-reduce:animate-none motion-reduce:transition-none",
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    "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
+}) {
+  return /* @__PURE__ */ jsx2(
+    "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
+}) {
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      "data-slot": "alert-dialog-media",
+      className: cn(
+        "bg-surface-secondary mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    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
+}) {
+  return /* @__PURE__ */ jsx2(
+    AlertDialogPrimitive.Description,
+    {
+      "data-slot": "alert-dialog-description",
+      className: cn(
+        "text-muted-foreground *:[a]:hover-only:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogAction({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    Button,
+    {
+      "data-slot": "alert-dialog-action",
+      className: cn(className),
+      ...props
+    }
+  );
+}
+function AlertDialogCancel({
+  className,
+  variant = "outline",
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    AlertDialogPrimitive.Close,
+    {
+      "data-slot": "alert-dialog-cancel",
+      className: cn(className),
+      render: /* @__PURE__ */ jsx2(Button, { variant, size }),
+      ...props
+    }
+  );
+}
+export {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogMedia,
+  AlertDialogOverlay,
+  AlertDialogPortal,
+  AlertDialogTitle,
+  AlertDialogTrigger
+};
+//# sourceMappingURL=alert-dialog.js.map

package/dist/components/alert-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/alert-dialog.tsx","../../src/lib/utils.ts","../../src/components/button.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\n\nfunction AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  );\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {\n  return (\n    <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n  );\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: AlertDialogPrimitive.Backdrop.Props) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        \"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-overlay-backdrop duration-200 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50 transition motion-reduce:animate-none motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Popup.Props & {\n  size?: \"default\" | \"sm\";\n}) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={cn(\n          \"bg-overlay text-overlay-foreground shadow-overlay data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-[0.98] data-open:zoom-in-[1.02] ring-border-light gap-6 rounded-xl p-6 ring-1 duration-200 ease-out-fluid data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none transition data-entering:will-change-[opacity,transform] data-exiting:will-change-[opacity,transform] motion-reduce:animate-none motion-reduce:transition-none\",\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  );\n}\n\nfunction AlertDialogHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        \"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]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogFooter({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        \"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\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogMedia({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"bg-surface-secondary mb-2 inline-flex size-16 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\n        \"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\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\n        \"text-muted-foreground *:[a]:hover-only:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogAction({\n  className,\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  return (\n    <Button\n      data-slot=\"alert-dialog-action\"\n      className={cn(className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = \"outline\",\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Close.Props &\n  Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(className)}\n      render={<Button variant={variant} size={size} />}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n\nexport type AlertDialogProps = React.ComponentProps<typeof AlertDialog>;\nexport type AlertDialogContentProps = React.ComponentProps<\n  typeof AlertDialogContent\n>;\nexport type AlertDialogTriggerProps = React.ComponentProps<\n  typeof AlertDialogTrigger\n>;\nexport type AlertDialogActionProps = React.ComponentProps<\n  typeof AlertDialogAction\n>;\nexport type AlertDialogCancelProps = React.ComponentProps<\n  typeof AlertDialogCancel\n>;\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst buttonVariants = cva(\n  [\n    \"inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium\",\n    \"transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth\",\n    \"motion-reduce:transition-none\",\n    \"disabled:status-disabled\",\n    \"focus-visible:focus-ring\",\n    \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    \"shrink-0 group/button select-none no-highlight\",\n  ],\n  {\n    variants: {\n      variant: {\n        default: [\n          // Base styles\n          \"relative rounded-lg overflow-visible shadow-surface border border-primary dark:border-primary-dark\",\n          \"isolate text-primary-foreground [text-shadow:_0_1px_2px_oklch(0%_0_0_/_30%)]\",\n          \"[&>*]:relative [&>*]:z-[2]\",\n          // Combined gradient layer with primary colors\n          \"before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]\",\n          \"before:bg-gradient-to-br before:from-primary-light before:via-primary-middle before:to-primary-dark\",\n          \"before:dark:from-primary-light before:dark:via-primary-middle before:dark:to-primary-dark\",\n          \"before:z-[-1]\",\n          // Additional outer border\n          \"after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]\",\n          \"after:bg-gradient-to-br after:from-primary after:to-primary-dark\",\n          \"after:z-[-1] after:transition-opacity after:duration-200 after:opacity-40 after:motion-reduce:transition-none\",\n          // Hover state\n          \"hover-only:after:opacity-100 hover-only:transition-opacity hover-only:duration-200\",\n        ].join(\" \"),\n        destructive:\n          \"bg-destructive text-destructive-foreground hover-only:hover:bg-destructive-hover\",\n        outline: [\n          // Base styles\n          \"relative rounded-lg overflow-visible shadow-field border\",\n          \"isolate text-foreground\",\n          \"[&>*]:relative [&>*]:z-[2]\",\n          // Background layer\n          \"before:pointer-events-none before:absolute before:inset-[-0.5px] before:rounded-[inherit]\",\n          \"before:bg-gradient-to-br before:from-border-light before:via-border before:to-border-dark/50\",\n          \"before:dark:from-border-light before:dark:to-border-dark\",\n          \"before:z-[-1]\",\n          // Inner background layer\n          \"after:pointer-events-none after:absolute after:inset-[0.5px] after:rounded-[inherit]\",\n          \"after:bg-background\",\n          \"after:z-[-1]\",\n          \"after:transition-colors after:duration-200 after:ease-out after:motion-reduce:transition-none\",\n          // Hover state\n          \"hover-only:after:bg-muted\",\n        ].join(\" \"),\n        secondary:\n          \"bg-secondary text-secondary-foreground hover-only:hover:bg-accent\",\n        ghost:\n          \"hover-only:bg-accent hover-only:text-accent-foreground motion-safe:active:scale-100\",\n        \"primary-soft\":\n          \"bg-primary-soft text-primary hover-only:hover:bg-primary-soft-hover\",\n        \"destructive-soft\":\n          \"bg-destructive-soft text-destructive hover-only:hover:bg-destructive-soft-hover\",\n        success:\n          \"bg-success text-success-foreground hover-only:hover:bg-success-hover\",\n        warning:\n          \"bg-warning text-warning-foreground hover-only:hover:bg-warning-hover\",\n        link: \"dark:text-primary-light text-primary-dark underline-offset-4 hover-only:underline motion-safe:active:scale-100\",\n      },\n      size: {\n        default:\n          \"h-9 gap-2 px-4 py-1 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 motion-safe:active:scale-[0.97]\",\n        xs: \"h-6 gap-1 rounded-lg px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3 motion-safe:active:scale-[0.985]\",\n        sm: \"h-8 gap-1.5 rounded-lg px-3 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 motion-safe:active:scale-[0.98]\",\n        lg: \"h-10 gap-2 rounded-lg px-8 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3 motion-safe:active:scale-[0.96]\",\n        icon: \"size-9 motion-safe:active:scale-[0.97]\",\n        \"icon-xs\":\n          \"size-6 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.985]\",\n        \"icon-sm\":\n          \"size-8 rounded-lg in-data-[slot=button-group]:rounded-md motion-safe:active:scale-[0.98]\",\n        \"icon-lg\": \"size-10 motion-safe:active:scale-[0.96]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  isPending,\n  nativeButton,\n  render,\n  ...props\n}: ButtonPrimitive.Props &\n  VariantProps<typeof buttonVariants> & { isPending?: boolean }) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      data-pending={isPending || undefined}\n      aria-disabled={isPending || undefined}\n      nativeButton={nativeButton ?? (render ? false : undefined)}\n      render={render}\n      className={cn(\n        buttonVariants({ variant, size }),\n        isPending && \"status-pending\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n\nexport type ButtonProps = React.ComponentProps<typeof Button>;\n"],"mappings":";;;AAGA,SAAS,eAAe,4BAA4B;;;ACHpD,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACHA,SAAS,UAAU,uBAAuB;AAC1C,SAAS,WAA8B;AAoGnC;AAhGJ,IAAM,iBAAiB;AAAA,EACrB;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA;AAAA,UAEP;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,QACF,EAAE,KAAK,GAAG;AAAA,QACV,aACE;AAAA,QACF,SAAS;AAAA;AAAA,UAEP;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,QACF,EAAE,KAAK,GAAG;AAAA,QACV,WACE;AAAA,QACF,OACE;AAAA,QACF,gBACE;AAAA,QACF,oBACE;AAAA,QACF,SACE;AAAA,QACF,SACE;AAAA,QACF,MAAM;AAAA,MACR;AAAA,MACA,MAAM;AAAA,QACJ,SACE;AAAA,QACF,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,WACE;AAAA,QACF,WACE;AAAA,QACF,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAEA,SAAS,OAAO;AAAA,EACd;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACiE;AAC/D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc,aAAa;AAAA,MAC3B,iBAAe,aAAa;AAAA,MAC5B,cAAc,iBAAiB,SAAS,QAAQ;AAAA,MAChD;AAAA,MACA,WAAW;AAAA,QACT,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,QAChC,aAAa;AAAA,QACb;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;;;AF5GS,gBAAAA,MAuCL,YAvCK;AADT,SAAS,YAAY,EAAE,GAAG,MAAM,GAAoC;AAClE,SAAO,gBAAAA,KAAC,qBAAqB,MAArB,EAA0B,aAAU,gBAAgB,GAAG,OAAO;AACxE;AAEA,SAAS,mBAAmB,EAAE,GAAG,MAAM,GAAuC;AAC5E,SACE,gBAAAA,KAAC,qBAAqB,SAArB,EAA6B,aAAU,wBAAwB,GAAG,OAAO;AAE9E;AAEA,SAAS,kBAAkB,EAAE,GAAG,MAAM,GAAsC;AAC1E,SACE,gBAAAA,KAAC,qBAAqB,QAArB,EAA4B,aAAU,uBAAuB,GAAG,OAAO;AAE5E;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAwC;AACtC,SACE,gBAAAA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAEG;AACD,SACE,qBAAC,qBACC;AAAA,oBAAAA,KAAC,sBAAmB;AAAA,IACpB,gBAAAA;AAAA,MAAC,qBAAqB;AAAA,MAArB;AAAA,QACC,aAAU;AAAA,QACV,aAAW;AAAA,QACX,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACC,GAAG;AAAA;AAAA,IACN;AAAA,KACF;AAEJ;AAEA,SAAS,kBAAkB;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,kBAAkB;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAA4D;AAC1D,SACE,gBAAAA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,uBAAuB;AAAA,EAC9B;AAAA,EACA,GAAG;AACL,GAAkE;AAChE,SACE,gBAAAA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,kBAAkB;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAwC;AACtC,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,SAAS;AAAA,MACtB,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,kBAAkB;AAAA,EACzB;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,GAAG;AACL,GACiE;AAC/D,SACE,gBAAAA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,SAAS;AAAA,MACvB,QAAQ,gBAAAA,KAAC,UAAO,SAAkB,MAAY;AAAA,MAC7C,GAAG;AAAA;AAAA,EACN;AAEJ;","names":["jsx"]}

package/dist/components/alert.cjs

@@ -0,0 +1,105 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/alert.tsx
+var alert_exports = {};
+__export(alert_exports, {
+  Alert: () => Alert,
+  AlertDescription: () => AlertDescription,
+  AlertTitle: () => AlertTitle,
+  alertVariants: () => alertVariants
+});
+module.exports = __toCommonJS(alert_exports);
+var import_class_variance_authority = require("class-variance-authority");
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/alert.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var alertVariants = (0, import_class_variance_authority.cva)(
+  [
+    "relative flex w-full gap-3 rounded-lg border p-4 text-sm",
+    "[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground border-border",
+        destructive: "bg-destructive/5 text-destructive border-destructive/20 [&>svg]:text-destructive",
+        success: "bg-success/5 text-success border-success/20 [&>svg]:text-success",
+        warning: "bg-warning/5 text-warning border-warning/20 [&>svg]:text-warning"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Alert({
+  className,
+  variant,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      "data-slot": "alert",
+      role: "alert",
+      className: cn(alertVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+function AlertTitle({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "h5",
+    {
+      "data-slot": "alert-title",
+      className: cn("font-medium leading-none tracking-tight", className),
+      ...props
+    }
+  );
+}
+function AlertDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      "data-slot": "alert-description",
+      className: cn("text-sm [&_p]:leading-relaxed", className),
+      ...props
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Alert,
+  AlertDescription,
+  AlertTitle,
+  alertVariants
+});
+//# sourceMappingURL=alert.cjs.map

package/dist/components/alert.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/alert.tsx","../../src/lib/utils.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst alertVariants = cva(\n  [\n    \"relative flex w-full gap-3 rounded-lg border p-4 text-sm\",\n    \"[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5\",\n  ],\n  {\n    variants: {\n      variant: {\n        default: \"bg-background text-foreground border-border\",\n        destructive:\n          \"bg-destructive/5 text-destructive border-destructive/20 [&>svg]:text-destructive\",\n        success:\n          \"bg-success/5 text-success border-success/20 [&>svg]:text-success\",\n        warning:\n          \"bg-warning/5 text-warning border-warning/20 [&>svg]:text-warning\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"h5\">) {\n  return (\n    <h5\n      data-slot=\"alert-title\"\n      className={cn(\"font-medium leading-none tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\"text-sm [&_p]:leading-relaxed\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { Alert, AlertTitle, AlertDescription, alertVariants };\n\nexport type AlertProps = React.ComponentProps<typeof Alert>;\nexport type AlertTitleProps = React.ComponentProps<typeof AlertTitle>;\nexport type AlertDescriptionProps = React.ComponentProps<\n  typeof AlertDescription\n>;\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,sCAAuC;;;ACHvC,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;AD+BI;AA7BJ,IAAM,oBAAgB;AAAA,EACpB;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,aACE;AAAA,QACF,SACE;AAAA,QACF,SACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAEA,SAAS,MAAM;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqE;AACnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;AAAA,MAClD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,MAAM,GAA+B;AACvE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,2CAA2C,SAAS;AAAA,MACjE,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iCAAiC,SAAS;AAAA,MACvD,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/alert.d.cts

@@ -0,0 +1,17 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Alert({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof alertVariants>): react_jsx_runtime.JSX.Element;
+declare function AlertTitle({ className, ...props }: React.ComponentProps<"h5">): react_jsx_runtime.JSX.Element;
+declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+type AlertProps = React.ComponentProps<typeof Alert>;
+type AlertTitleProps = React.ComponentProps<typeof AlertTitle>;
+type AlertDescriptionProps = React.ComponentProps<typeof AlertDescription>;
+
+export { Alert, AlertDescription, type AlertDescriptionProps, type AlertProps, AlertTitle, type AlertTitleProps, alertVariants };

package/dist/components/alert.d.ts

@@ -0,0 +1,17 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Alert({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof alertVariants>): react_jsx_runtime.JSX.Element;
+declare function AlertTitle({ className, ...props }: React.ComponentProps<"h5">): react_jsx_runtime.JSX.Element;
+declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+type AlertProps = React.ComponentProps<typeof Alert>;
+type AlertTitleProps = React.ComponentProps<typeof AlertTitle>;
+type AlertDescriptionProps = React.ComponentProps<typeof AlertDescription>;
+
+export { Alert, AlertDescription, type AlertDescriptionProps, type AlertProps, AlertTitle, type AlertTitleProps, alertVariants };