@zentauri-ui/zentauri-components 1.5.22 → 1.6.0

package/src/ui/toggle/variants.ts

@@ -1,7 +1,7 @@
 import { cva } from "class-variance-authority";
 
 export const toggleTrackVariants = cva(
-  "relative inline-flex shrink-0 cursor-pointer rounded-full border border-white/10 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950 data-[state=checked]:border-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50",
+  "relative inline-flex shrink-0 cursor-pointer rounded-full border border-black/10 dark:border-white/10 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-600 dark:focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-50 dark:focus-visible:ring-offset-slate-950 data-[state=checked]:border-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50",
   {
     variants: {
       size: {
@@ -10,54 +10,55 @@ export const toggleTrackVariants = cva(
         lg: "h-7 w-[3.25rem]",
       },
       appearance: {
-        default: "data-[state=checked]:bg-cyan-600/80",
+        default:
+          "data-[state=checked]:bg-cyan-400/50 dark:data-[state=checked]:bg-cyan-600/80",
         success:
-          "data-[state=checked]:border-emerald-500/40 data-[state=checked]:bg-emerald-600/80",
+          "data-[state=checked]:border-emerald-500/40 data-[state=checked]:bg-emerald-400/50 dark:data-[state=checked]:bg-emerald-600/80",
         destructive:
-          "data-[state=checked]:border-rose-500/40 data-[state=checked]:bg-rose-600/80",
+          "data-[state=checked]:border-rose-500/40 data-[state=checked]:bg-rose-400/50 dark:data-[state=checked]:bg-rose-600/80",
         neutral:
-          "data-[state=checked]:border-slate-400/40 data-[state=checked]:bg-slate-600/90",
+          "data-[state=checked]:border-slate-500/40 dark:data-[state=checked]:border-slate-400/40 data-[state=checked]:bg-slate-400/90 dark:data-[state=checked]:bg-slate-600/90",
         indigo:
-          "data-[state=checked]:border-indigo-500/40 data-[state=checked]:bg-indigo-600/80",
+          "data-[state=checked]:border-indigo-500/40 data-[state=checked]:bg-indigo-400/50 dark:data-[state=checked]:bg-indigo-600/80",
         purple:
-          "data-[state=checked]:border-purple-500/40 data-[state=checked]:bg-purple-600/80",
-        pink: "data-[state=checked]:border-pink-500/40 data-[state=checked]:bg-pink-600/80",
+          "data-[state=checked]:border-purple-500/40 data-[state=checked]:bg-purple-400/50 dark:data-[state=checked]:bg-purple-600/80",
+        pink: "data-[state=checked]:border-pink-500/40 data-[state=checked]:bg-pink-400/50 dark:data-[state=checked]:bg-pink-600/80",
         orange:
-          "data-[state=checked]:border-orange-500/40 data-[state=checked]:bg-orange-600/80",
+          "data-[state=checked]:border-orange-500/40 data-[state=checked]:bg-orange-400/50 dark:data-[state=checked]:bg-orange-600/80",
         yellow:
-          "data-[state=checked]:border-yellow-500/40 data-[state=checked]:bg-yellow-600/80",
+          "data-[state=checked]:border-yellow-500/40 data-[state=checked]:bg-yellow-400/50 dark:data-[state=checked]:bg-yellow-600/80",
         green:
-          "data-[state=checked]:border-green-500/40 data-[state=checked]:bg-green-600/80",
-        teal: "data-[state=checked]:border-teal-500/40 data-[state=checked]:bg-teal-600/80",
-        cyan: "data-[state=checked]:border-cyan-500/40 data-[state=checked]:bg-cyan-600/80",
-        lime: "data-[state=checked]:border-lime-500/40 data-[state=checked]:bg-lime-600/80",
+          "data-[state=checked]:border-green-500/40 data-[state=checked]:bg-green-400/50 dark:data-[state=checked]:bg-green-600/80",
+        teal: "data-[state=checked]:border-teal-500/40 data-[state=checked]:bg-teal-400/50 dark:data-[state=checked]:bg-teal-600/80",
+        cyan: "data-[state=checked]:border-cyan-500/40 data-[state=checked]:bg-cyan-400/50 dark:data-[state=checked]:bg-cyan-600/80",
+        lime: "data-[state=checked]:border-lime-500/40 data-[state=checked]:bg-lime-400/50 dark:data-[state=checked]:bg-lime-600/80",
         emerald:
-          "data-[state=checked]:border-emerald-500/40 data-[state=checked]:bg-emerald-600/80",
-        rose: "data-[state=checked]:border-rose-500/40 data-[state=checked]:bg-rose-600/80",
+          "data-[state=checked]:border-emerald-500/40 data-[state=checked]:bg-emerald-400/50 dark:data-[state=checked]:bg-emerald-600/80",
+        rose: "data-[state=checked]:border-rose-500/40 data-[state=checked]:bg-rose-400/50 dark:data-[state=checked]:bg-rose-600/80",
         slate:
-          "data-[state=checked]:border-slate-400/40 data-[state=checked]:bg-slate-600/90",
+          "data-[state=checked]:border-slate-500/40 dark:data-[state=checked]:border-slate-400/40 data-[state=checked]:bg-slate-400/90 dark:data-[state=checked]:bg-slate-600/90",
         zinc: "data-[state=checked]:border-zinc-400/40 data-[state=checked]:bg-zinc-600/90",
-        gray: "data-[state=checked]:border-gray-400/40 data-[state=checked]:bg-gray-600/90",
+        gray: "data-[state=checked]:border-gray-400/40 data-[state=checked]:bg-gray-400/50 dark:data-[state=checked]:bg-gray-600/90",
         stone:
           "data-[state=checked]:border-stone-400/40 data-[state=checked]:bg-stone-600/90",
         "gradient-blue":
-          "data-[state=checked]:bg-linear-to-r from-blue-600 to-purple-600",
+          "data-[state=checked]:bg-linear-to-r from-blue-800 dark:from-blue-600 to-purple-800 dark:to-purple-600",
         "gradient-green":
-          "data-[state=checked]:bg-linear-to-r from-green-600 to-lime-600",
+          "data-[state=checked]:bg-linear-to-r from-green-800 dark:from-green-600 to-lime-800 dark:to-lime-600",
         "gradient-red":
-          "data-[state=checked]:bg-linear-to-r from-red-600 to-pink-600",
+          "data-[state=checked]:bg-linear-to-r from-red-800 dark:from-red-600 to-pink-800 dark:to-pink-600",
         "gradient-yellow":
-          "data-[state=checked]:bg-linear-to-r from-yellow-600 to-orange-600",
+          "data-[state=checked]:bg-linear-to-r from-yellow-800 dark:from-yellow-600 to-orange-800 dark:to-orange-600",
         "gradient-purple":
-          "data-[state=checked]:bg-linear-to-r from-purple-600 to-pink-600",
+          "data-[state=checked]:bg-linear-to-r from-purple-800 dark:from-purple-600 to-pink-800 dark:to-pink-600",
         "gradient-teal":
-          "data-[state=checked]:bg-linear-to-r from-teal-600 to-cyan-600",
+          "data-[state=checked]:bg-linear-to-r from-teal-800 dark:from-teal-600 to-cyan-800 dark:to-cyan-600",
         "gradient-indigo":
-          "data-[state=checked]:bg-linear-to-r from-indigo-600 to-purple-600",
+          "data-[state=checked]:bg-linear-to-r from-indigo-800 dark:from-indigo-600 to-purple-800 dark:to-purple-600",
         "gradient-pink":
-          "data-[state=checked]:bg-linear-to-r from-pink-600 to-rose-600",
+          "data-[state=checked]:bg-linear-to-r from-pink-800 dark:from-pink-600 to-rose-800 dark:to-rose-600",
         "gradient-orange":
-          "data-[state=checked]:bg-linear-to-r from-orange-600 to-red-600",
+          "data-[state=checked]:bg-linear-to-r from-orange-800 dark:from-orange-600 to-red-800 dark:to-red-600",
       },
     },
     defaultVariants: {
@@ -68,7 +69,7 @@ export const toggleTrackVariants = cva(
 );
 
 export const toggleThumbVariants = cva(
-  "pointer-events-none block rounded-full bg-white shadow-[0_1px_2px_rgba(15,23,42,0.35)] ring-0",
+  "pointer-events-none block rounded-full border border-slate-900/30 dark:border-white/10 shadow-[0_1px_2px_rgba(15,23,42,0.12)] dark:shadow-[0_1px_2px_rgba(15,23,42,0.35)] ring-0",
   {
     variants: {
       size: {
@@ -76,9 +77,40 @@ export const toggleThumbVariants = cva(
         md: "size-5",
         lg: "size-6",
       },
+      thumbColor: {
+        default: "bg-white",
+        success: "bg-emerald-500",
+        destructive: "bg-rose-500",
+        neutral: "bg-slate-500",
+        indigo: "bg-indigo-500",
+        purple: "bg-purple-500",
+        pink: "bg-pink-500",
+        orange: "bg-orange-500",
+        yellow: "bg-yellow-500",
+        green: "bg-green-500",
+        teal: "bg-teal-500",
+        cyan: "bg-cyan-500",
+        lime: "bg-lime-500",
+        emerald: "bg-emerald-500",
+        rose: "bg-rose-500",
+        slate: "bg-slate-500",
+        zinc: "bg-zinc-500",
+        gray: "bg-gray-500",
+        stone: "bg-stone-500",
+        "gradient-blue": "bg-blue-500",
+        "gradient-green": "bg-green-500",
+        "gradient-red": "bg-red-500",
+        "gradient-yellow": "bg-yellow-500",
+        "gradient-purple": "bg-purple-500",
+        "gradient-teal": "bg-teal-500",
+        "gradient-indigo": "bg-indigo-500",
+        "gradient-pink": "bg-pink-500",
+        "gradient-orange": "bg-orange-500",
+      },
     },
     defaultVariants: {
       size: "md",
+      thumbColor: "default",
     },
   },
 );

package/src/ui/tooltip/variants.ts

@@ -5,35 +5,36 @@ export const tooltipVariants = cva(
   {
     variants: {
       variant: {
-        default: "bg-black text-white",
-        outline: "border bg-white text-black",
+        default: "bg-white dark:bg-black text-slate-900 dark:text-white",
+        outline: "border bg-black dark:bg-white text-white dark:text-black",
         ghost: "bg-gray-800 text-white/90",
-        glass: "border border-white/15 bg-white/10 text-white backdrop-blur-md",
+        glass:
+          "border border-black/15 dark:border-white/15 bg-black/10 dark:bg-white/10 text-slate-900 dark:text-white backdrop-blur-md",
         emerald: "bg-emerald-800 text-white",
-        indigo: "bg-indigo-600 text-white",
-        purple: "bg-purple-600 text-white",
-        pink: "bg-pink-600 text-white",
-        rose: "bg-rose-600 text-white",
+        indigo: "bg-indigo-800 text-white",
+        purple: "bg-purple-800 text-white",
+        pink: "bg-pink-800 text-white",
+        rose: "bg-rose-800 text-white",
         sky: "bg-sky-700 text-white",
-        teal: "bg-teal-600 text-white",
-        yellow: "bg-yellow-600 text-white",
-        orange: "bg-orange-600 text-white",
-        green: "bg-green-600 text-white",
+        teal: "bg-teal-800 text-white",
+        yellow: "bg-yellow-800 text-white",
+        orange: "bg-orange-800 text-white",
+        green: "bg-green-800 text-white",
         "gradient-blue":
-          "bg-linear-to-r from-blue-600 to-purple-600 text-white",
+          "bg-linear-to-r from-blue-800 to-purple-800 text-white",
         "gradient-green":
-          "bg-linear-to-r from-green-600 to-lime-600 text-white",
-        "gradient-red": "bg-linear-to-r from-red-600 to-pink-600 text-white",
+          "bg-linear-to-r from-green-800 to-lime-800 text-white",
+        "gradient-red": "bg-linear-to-r from-red-800 to-pink-800 text-white",
         "gradient-yellow":
-          "bg-linear-to-r from-yellow-600 to-orange-600 text-white",
+          "bg-linear-to-r from-yellow-800 to-orange-800 text-white",
         "gradient-purple":
-          "bg-linear-to-r from-purple-600 to-pink-600 text-white",
-        "gradient-teal": "bg-linear-to-r from-teal-600 to-cyan-600 text-white",
+          "bg-linear-to-r from-purple-800 to-pink-800 text-white",
+        "gradient-teal": "bg-linear-to-r from-teal-800 to-cyan-800 text-white",
         "gradient-indigo":
-          "bg-linear-to-r from-indigo-600 to-purple-600 text-white",
-        "gradient-pink": "bg-linear-to-r from-pink-600 to-rose-600 text-white",
+          "bg-linear-to-r from-indigo-800 to-purple-800 text-white",
+        "gradient-pink": "bg-linear-to-r from-pink-800 to-rose-800 text-white",
         "gradient-orange":
-          "bg-linear-to-r from-orange-600 to-red-600 text-white",
+          "bg-linear-to-r from-orange-800 to-red-800 text-white",
       },
       size: {
         sm: "text-xs px-2 py-1",

package/src/ui/typography/blockquote-base.tsx

@@ -1,5 +1,3 @@
-import { forwardRef } from "react";
-
 import { cn } from "../../lib/utils";
 
 import type { BlockquoteProps } from "./types";

package/src/ui/typography/code-block-base.tsx

@@ -1,5 +1,3 @@
-import { forwardRef } from "react";
-
 import { cn } from "../../lib/utils";
 
 import type { CodeBlockProps } from "./types";
@@ -17,7 +15,7 @@ export const CodeBlockBase = (props: CodeBlockProps) => {
       aria-label={ariaLabel}
       className={cn(
         typographyToneVariants({ tone }),
-        "overflow-x-auto rounded-xl border border-white/10 bg-slate-950/80 p-4 text-sm leading-relaxed shadow-inner shadow-slate-950/40",
+        "overflow-x-auto rounded-xl border border-white/10 bg-white/90 dark:bg-slate-950/80 p-4 text-sm leading-relaxed shadow-inner shadow-slate-950/40",
         className,
       )}
       {...rest}

package/src/ui/typography/heading-base.tsx

@@ -1,5 +1,3 @@
-import { forwardRef } from "react";
-
 import { cn } from "../../lib/utils";
 
 import type { HeadingProps } from "./types";

package/src/ui/typography/inline-code-base.tsx

@@ -1,5 +1,3 @@
-import { forwardRef } from "react";
-
 import { cn } from "../../lib/utils";
 
 import type { InlineCodeProps } from "./types";

package/src/ui/typography/variants.ts

@@ -4,32 +4,35 @@ import { cva } from "class-variance-authority";
 export const typographyToneVariants = cva("", {
   variants: {
     tone: {
-      default: "text-slate-50 border-white/15",
-      muted: "text-slate-400 border-white/15",
-      primary: "text-cyan-300 border-cyan-300/40",
-      secondary: "text-slate-300 border-white/15",
-      accent: "text-violet-300 border-violet-300/40",
-      destructive: "text-rose-400 border-rose-300/40",
-      info: "text-sky-300 border-sky-300/40",
-      success: "text-emerald-300 border-emerald-300/40",
-      warning: "text-amber-300 border-amber-300/40",
-      error: "text-red-300 border-red-300/40",
+      default:
+        "text-slate-900 dark:text-slate-50 border-black/15 dark:border-white/15",
+      muted:
+        "text-slate-500 dark:text-slate-400 border-black/15 dark:border-white/15",
+      primary: "text-cyan-700 dark:text-cyan-300 border-cyan-300/40",
+      secondary:
+        "text-slate-600 dark:text-slate-300 border-black/15 dark:border-white/15",
+      accent: "text-violet-700 dark:text-violet-300 border-violet-300/40",
+      destructive: "text-rose-600 dark:text-rose-400 border-rose-300/40",
+      info: "text-sky-700 dark:text-sky-300 border-sky-300/40",
+      success: "text-emerald-700 dark:text-emerald-300 border-emerald-300/40",
+      warning: "text-amber-700 dark:text-amber-300 border-amber-300/40",
+      error: "text-red-700 dark:text-red-300 border-red-300/40",
       "gradient-pink-violet":
-        "bg-linear-to-r from-pink-400 to-violet-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-pink-600 dark:from-pink-400 to-violet-600 dark:to-violet-400 bg-clip-text text-transparent border-violet-300/40",
       "gradient-cyan-violet":
-        "bg-linear-to-r from-cyan-400 to-violet-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-violet-600 dark:to-violet-400 bg-clip-text text-transparent border-violet-300/40",
       "gradient-cyan-blue":
-        "bg-linear-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-blue-600 dark:to-blue-400 bg-clip-text text-transparent border-blue-300/40",
       "gradient-cyan-green":
-        "bg-linear-to-r from-cyan-400 to-green-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-green-600 dark:to-green-400 bg-clip-text text-transparent border-green-300/40",
       "gradient-cyan-orange":
-        "bg-linear-to-r from-cyan-400 to-orange-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-orange-600 dark:to-orange-400 bg-clip-text text-transparent border-orange-300/40",
       "gradient-cyan-red":
-        "bg-linear-to-r from-cyan-400 to-red-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-red-600 dark:to-red-400 bg-clip-text text-transparent border-red-300/40",
       "gradient-cyan-purple":
-        "bg-linear-to-r from-cyan-400 to-purple-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-purple-600 dark:to-purple-400 bg-clip-text text-transparent border-purple-300/40",
       "gradient-cyan-pink":
-        "bg-linear-to-r from-cyan-400 to-pink-400 bg-clip-text text-transparent",
+        "bg-linear-to-r from-cyan-600 dark:from-cyan-400 to-pink-600 dark:to-pink-400 bg-clip-text text-transparent border-pink-300/40",
     },
   },
   defaultVariants: {

package/dist/chunk-2BAMNRAL.mjs

@@ -1,323 +0,0 @@
-import { useFocusManagement } from './chunk-K6YI4FJO.mjs';
-import { cn } from './chunk-4D54YOL6.mjs';
-import { cva } from 'class-variance-authority';
-import { createContext, useContext, useState, useCallback, useId, useRef, useMemo } from 'react';
-import { createPortal } from 'react-dom';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var modalOverlayVariants = cva(
-  "fixed inset-0 z-50 bg-slate-950/70 backdrop-blur-sm data-[state=open]:animate-in"
-);
-var modalTriggerVariants = cva(
-  "relative inline-flex shrink-0 cursor-pointer rounded-md border",
-  {
-    variants: {
-      appearance: {
-        default: "bg-slate-950",
-        glass: "border-white/15 bg-slate-950/70 backdrop-blur-xl",
-        sky: "border-sky-600 bg-sky-950/70 backdrop-blur-xl",
-        rose: "border-rose-600 bg-rose-950/70 backdrop-blur-xl",
-        purple: "border-purple-600 bg-purple-950/70 backdrop-blur-xl",
-        pink: "border-pink-600 bg-pink-950/70 backdrop-blur-xl",
-        orange: "border-orange-600 bg-orange-950/70 backdrop-blur-xl",
-        yellow: "border-yellow-600 bg-yellow-950/70 backdrop-blur-xl",
-        teal: "border-teal-600 bg-teal-950/70 backdrop-blur-xl",
-        indigo: "border-indigo-600 bg-indigo-950/70 backdrop-blur-xl",
-        emerald: "border-emerald-600 bg-emerald-950/70 backdrop-blur-xl",
-        gray: "border-gray-600 bg-gray-950/70 backdrop-blur-xl",
-        amber: "border-amber-600 bg-amber-950/70 backdrop-blur-xl",
-        violet: "border-violet-600 bg-violet-950/70 backdrop-blur-xl",
-        "gradient-blue": "border-blue-600 bg-linear-to-r from-blue-950/70 to-purple-950/70 backdrop-blur-xl",
-        "gradient-green": "border-green-600 bg-linear-to-r from-green-950/70 to-lime-950/70 backdrop-blur-xl",
-        "gradient-red": "border-red-600 bg-linear-to-r from-red-950/70 to-pink-950/70 backdrop-blur-xl",
-        "gradient-yellow": "border-yellow-600 bg-linear-to-r from-yellow-950/70 to-orange-950/70 backdrop-blur-xl",
-        "gradient-purple": "border-purple-600 bg-linear-to-r from-purple-950/70 to-pink-950/70 backdrop-blur-xl",
-        "gradient-teal": "border-teal-600 bg-linear-to-r from-teal-950/70 to-cyan-950/70 backdrop-blur-xl",
-        "gradient-indigo": "border-indigo-600 bg-linear-to-r from-indigo-950/70 to-purple-950/70 backdrop-blur-xl",
-        "gradient-pink": "border-pink-600 bg-linear-to-r from-pink-950/70 to-rose-950/70 backdrop-blur-xl",
-        "gradient-orange": "border-orange-600 bg-linear-to-r from-orange-950/70 to-red-950/70 backdrop-blur-xl"
-      }
-    },
-    defaultVariants: {
-      appearance: "default"
-    }
-  }
-);
-var modalContentVariants = cva(
-  "fixed left-1/2 z-50 w-[calc(100%-2rem)] max-h-[min(90vh,720px)] translate-x-[-50%] overflow-y-auto border border-white/10 bg-slate-950 p-6 text-slate-50 shadow-[0_24px_80px_rgba(15,23,42,0.55)] focus:outline-none",
-  {
-    variants: {
-      size: {
-        sm: "max-w-md",
-        md: "max-w-lg",
-        lg: "max-w-2xl",
-        xl: "max-w-4xl",
-        full: "max-w-[calc(100%-2rem)]"
-      },
-      position: {
-        center: "top-1/2 translate-y-[-50%]",
-        top: "top-10 translate-y-0",
-        bottom: "bottom-10 translate-y-0"
-      },
-      appearance: {
-        default: "bg-slate-950",
-        glass: "border-white/15 bg-slate-950/70 backdrop-blur-xl",
-        sky: "border-sky-600 bg-sky-950/70 backdrop-blur-xl",
-        rose: "border-rose-600 bg-rose-950/70 backdrop-blur-xl",
-        purple: "border-purple-600 bg-purple-950/70 backdrop-blur-xl",
-        pink: "border-pink-600 bg-pink-950/70 backdrop-blur-xl",
-        orange: "border-orange-600 bg-orange-950/70 backdrop-blur-xl",
-        yellow: "border-yellow-600 bg-yellow-950/70 backdrop-blur-xl",
-        teal: "border-teal-600 bg-teal-950/70 backdrop-blur-xl",
-        indigo: "border-indigo-600 bg-indigo-950/70 backdrop-blur-xl",
-        emerald: "border-emerald-600 bg-emerald-950/70 backdrop-blur-xl",
-        gray: "border-gray-600 bg-gray-950/70 backdrop-blur-xl",
-        amber: "border-amber-600 bg-amber-950/70 backdrop-blur-xl",
-        violet: "border-violet-600 bg-violet-950/70 backdrop-blur-xl",
-        "gradient-blue": "border-blue-600 bg-linear-to-r from-blue-950/70 to-purple-950/70 backdrop-blur-xl",
-        "gradient-green": "border-green-600 bg-linear-to-r from-green-950/70 to-lime-950/70 backdrop-blur-xl",
-        "gradient-red": "border-red-600 bg-linear-to-r from-red-950/70 to-pink-950/70 backdrop-blur-xl",
-        "gradient-yellow": "border-yellow-600 bg-linear-to-r from-yellow-950/70 to-orange-950/70 backdrop-blur-xl",
-        "gradient-purple": "border-purple-600 bg-linear-to-r from-purple-950/70 to-pink-950/70 backdrop-blur-xl",
-        "gradient-teal": "border-teal-600 bg-linear-to-r from-teal-950/70 to-cyan-950/70 backdrop-blur-xl",
-        "gradient-indigo": "border-indigo-600 bg-linear-to-r from-indigo-950/70 to-purple-950/70 backdrop-blur-xl",
-        "gradient-pink": "border-pink-600 bg-linear-to-r from-pink-950/70 to-rose-950/70 backdrop-blur-xl",
-        "gradient-orange": "border-orange-600 bg-linear-to-r from-orange-950/70 to-red-950/70 backdrop-blur-xl"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      position: "center",
-      appearance: "default"
-    }
-  }
-);
-var ModalContext = createContext(null);
-function useModalContext(component) {
-  const ctx = useContext(ModalContext);
-  if (!ctx) {
-    throw new Error(`${component} must be used within <Modal>`);
-  }
-  return ctx;
-}
-function Modal({
-  open,
-  defaultOpen = false,
-  onOpenChange,
-  children
-}) {
-  const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
-  const resolvedOpen = isControlled ? Boolean(open) : uncontrolledOpen;
-  const setOpen = useCallback(
-    (next) => {
-      if (!isControlled) {
-        setUncontrolledOpen(next);
-      }
-      onOpenChange?.(next);
-    },
-    [isControlled, onOpenChange]
-  );
-  const baseId = useId();
-  const titleId = `${baseId}-title`;
-  const descriptionId = `${baseId}-description`;
-  const contentRef = useRef(null);
-  const triggerRef = useRef(null);
-  const ctx = useMemo(
-    () => ({
-      open: resolvedOpen,
-      setOpen,
-      titleId,
-      descriptionId,
-      contentRef,
-      triggerRef
-    }),
-    [descriptionId, resolvedOpen, setOpen, titleId]
-  );
-  return /* @__PURE__ */ jsx(ModalContext.Provider, { value: ctx, children });
-}
-Modal.displayName = "Modal";
-function ModalTrigger({
-  className,
-  children,
-  appearance,
-  onClick,
-  ref: refProp,
-  ...rest
-}) {
-  const { setOpen, triggerRef } = useModalContext("ModalTrigger");
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref: (node) => {
-        triggerRef.current = node;
-        if (typeof refProp === "function") {
-          refProp(node);
-        } else if (refProp) {
-          refProp.current = node;
-        }
-      },
-      type: "button",
-      "data-slot": "modal-trigger",
-      className: cn(modalTriggerVariants({ appearance }), className),
-      onClick: (event) => {
-        onClick?.(event);
-        if (!event.defaultPrevented) {
-          setOpen(true);
-        }
-      },
-      ...rest,
-      children
-    }
-  );
-}
-ModalTrigger.displayName = "ModalTrigger";
-function ModalContent({
-  className,
-  size,
-  position,
-  appearance,
-  children,
-  ref,
-  id,
-  style
-}) {
-  const { open, setOpen, titleId, descriptionId, contentRef, triggerRef } = useModalContext("ModalContent");
-  useFocusManagement({
-    open,
-    setOpen,
-    contentRef,
-    triggerRef
-  });
-  const portalTarget = typeof document !== "undefined" ? document.body : null;
-  if (!portalTarget) {
-    return null;
-  }
-  return createPortal(
-    open ? /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50", "data-slot": "modal-portal", children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          role: "presentation",
-          "data-slot": "modal-overlay",
-          className: modalOverlayVariants(),
-          onClick: () => setOpen(false)
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: (node) => {
-            contentRef.current = node;
-            if (typeof ref === "function") {
-              ref(node);
-            } else if (ref) {
-              ref.current = node;
-            }
-          },
-          role: "dialog",
-          "aria-modal": "true",
-          "aria-labelledby": titleId,
-          "aria-describedby": descriptionId,
-          "data-slot": "modal-content",
-          tabIndex: -1,
-          className: cn(
-            modalContentVariants({ size, position, appearance }),
-            className
-          ),
-          id,
-          style,
-          children
-        }
-      )
-    ] }) : null,
-    portalTarget
-  );
-}
-ModalContent.displayName = "ModalContent";
-function ModalHeader({ className, children }) {
-  return /* @__PURE__ */ jsx(
-    "header",
-    {
-      "data-slot": "modal-header",
-      className: cn("mb-4 flex flex-col gap-2", className),
-      children
-    }
-  );
-}
-ModalHeader.displayName = "ModalHeader";
-function ModalBody({ className, children }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "modal-body",
-      className: cn("text-sm text-slate-300", className),
-      children
-    }
-  );
-}
-ModalBody.displayName = "ModalBody";
-function ModalFooter({ className, children }) {
-  return /* @__PURE__ */ jsx(
-    "footer",
-    {
-      "data-slot": "modal-footer",
-      className: cn("mt-6 flex justify-end gap-2", className),
-      children
-    }
-  );
-}
-ModalFooter.displayName = "ModalFooter";
-function ModalTitle({ className, children }) {
-  const { titleId } = useModalContext("ModalTitle");
-  return /* @__PURE__ */ jsx(
-    "h2",
-    {
-      id: titleId,
-      "data-slot": "modal-title",
-      className: cn("text-lg font-semibold", className),
-      children
-    }
-  );
-}
-ModalTitle.displayName = "ModalTitle";
-function ModalDescription({ className, children }) {
-  const { descriptionId } = useModalContext("ModalDescription");
-  return /* @__PURE__ */ jsx(
-    "p",
-    {
-      id: descriptionId,
-      "data-slot": "modal-description",
-      className: cn("text-sm text-slate-400", className),
-      children
-    }
-  );
-}
-ModalDescription.displayName = "ModalDescription";
-function ModalClose({
-  className,
-  children,
-  ...rest
-}) {
-  const { setOpen } = useModalContext("ModalClose");
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      "data-slot": "modal-close",
-      className: cn(
-        "absolute right-4 top-4 inline-flex size-9 items-center justify-center rounded-md text-slate-200 transition hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/30",
-        className
-      ),
-      "aria-label": "Close dialog",
-      onClick: () => setOpen(false),
-      ...rest,
-      children: children ?? "\xD7"
-    }
-  );
-}
-ModalClose.displayName = "ModalClose";
-
-export { Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalTitle, ModalTrigger, modalContentVariants, modalOverlayVariants, useModalContext };
-//# sourceMappingURL=chunk-2BAMNRAL.mjs.map
-//# sourceMappingURL=chunk-2BAMNRAL.mjs.map