@zentauri-ui/zentauri-components 1.8.42 → 1.9.1

package/dist/ui/file-upload.mjs

@@ -21,7 +21,28 @@ var zuiFileUploadAppearances = {
   amber: "border-[color:var(--zui-file-upload-amber-border,oklch(82.8%_0.189_84.429_/_0.7))] dark:border-[color:var(--zui-file-upload-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.7))] bg-[var(--zui-file-upload-amber-bg,oklch(76.9%_0.188_70.08_/_0.1))] dark:bg-[var(--zui-file-upload-amber-bg-dark,oklch(76.9%_0.188_70.08_/_0.1))] text-[color:var(--zui-file-upload-amber-fg,oklch(66.6%_0.179_58.318))] dark:text-[color:var(--zui-file-upload-amber-fg-dark,oklch(82.8%_0.189_84.429))] hover:border-[color:var(--zui-file-upload-amber-border-hover,oklch(82.8%_0.189_84.429_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-amber-border-hover-dark,oklch(82.8%_0.189_84.429_/_0.8))] hover:bg-[var(--zui-file-upload-amber-bg-hover,oklch(76.9%_0.188_70.08_/_0.15))] dark:hover:bg-[var(--zui-file-upload-amber-bg-hover-dark,oklch(76.9%_0.188_70.08_/_0.15))]",
   pink: "border-[color:var(--zui-file-upload-pink-border,oklch(71.8%_0.202_349.761_/_0.7))] dark:border-[color:var(--zui-file-upload-pink-border-dark,oklch(71.8%_0.202_349.761_/_0.7))] bg-[var(--zui-file-upload-pink-bg,oklch(65.6%_0.241_354.308_/_0.1))] dark:bg-[var(--zui-file-upload-pink-bg-dark,oklch(65.6%_0.241_354.308_/_0.1))] text-[color:var(--zui-file-upload-pink-fg,oklch(59.2%_0.249_0.584))] dark:text-[color:var(--zui-file-upload-pink-fg-dark,oklch(71.8%_0.202_349.761))] hover:border-[color:var(--zui-file-upload-pink-border-hover,oklch(71.8%_0.202_349.761_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-pink-border-hover-dark,oklch(71.8%_0.202_349.761_/_0.8))] hover:bg-[var(--zui-file-upload-pink-bg-hover,oklch(65.6%_0.241_354.308_/_0.15))] dark:hover:bg-[var(--zui-file-upload-pink-bg-hover-dark,oklch(65.6%_0.241_354.308_/_0.15))]",
   orange: "border-[color:var(--zui-file-upload-orange-border,oklch(75%_0.183_55.934_/_0.7))] dark:border-[color:var(--zui-file-upload-orange-border-dark,oklch(75%_0.183_55.934_/_0.7))] bg-[var(--zui-file-upload-orange-bg,oklch(70.5%_0.213_47.604_/_0.1))] dark:bg-[var(--zui-file-upload-orange-bg-dark,oklch(70.5%_0.213_47.604_/_0.1))] text-[color:var(--zui-file-upload-orange-fg,oklch(64.6%_0.222_41.116))] dark:text-[color:var(--zui-file-upload-orange-fg-dark,oklch(75%_0.183_55.934))] hover:border-[color:var(--zui-file-upload-orange-border-hover,oklch(75%_0.183_55.934_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-orange-border-hover-dark,oklch(75%_0.183_55.934_/_0.8))] hover:bg-[var(--zui-file-upload-orange-bg-hover,oklch(70.5%_0.213_47.604_/_0.15))] dark:hover:bg-[var(--zui-file-upload-orange-bg-hover-dark,oklch(70.5%_0.213_47.604_/_0.15))]",
-  teal: "border-[color:var(--zui-file-upload-teal-border,oklch(77.7%_0.152_181.912_/_0.7))] dark:border-[color:var(--zui-file-upload-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.7))] bg-[var(--zui-file-upload-teal-bg,oklch(70.4%_0.14_182.503_/_0.1))] dark:bg-[var(--zui-file-upload-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.1))] text-[color:var(--zui-file-upload-teal-fg,oklch(60%_0.118_184.704))] dark:text-[color:var(--zui-file-upload-teal-fg-dark,oklch(77.7%_0.152_181.912))] hover:border-[color:var(--zui-file-upload-teal-border-hover,oklch(77.7%_0.152_181.912_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-teal-border-hover-dark,oklch(77.7%_0.152_181.912_/_0.8))] hover:bg-[var(--zui-file-upload-teal-bg-hover,oklch(70.4%_0.14_182.503_/_0.15))] dark:hover:bg-[var(--zui-file-upload-teal-bg-hover-dark,oklch(70.4%_0.14_182.503_/_0.15))]"
+  teal: "border-[color:var(--zui-file-upload-teal-border,oklch(77.7%_0.152_181.912_/_0.7))] dark:border-[color:var(--zui-file-upload-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.7))] bg-[var(--zui-file-upload-teal-bg,oklch(70.4%_0.14_182.503_/_0.1))] dark:bg-[var(--zui-file-upload-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.1))] text-[color:var(--zui-file-upload-teal-fg,oklch(60%_0.118_184.704))] dark:text-[color:var(--zui-file-upload-teal-fg-dark,oklch(77.7%_0.152_181.912))] hover:border-[color:var(--zui-file-upload-teal-border-hover,oklch(77.7%_0.152_181.912_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-teal-border-hover-dark,oklch(77.7%_0.152_181.912_/_0.8))] hover:bg-[var(--zui-file-upload-teal-bg-hover,oklch(70.4%_0.14_182.503_/_0.15))] dark:hover:bg-[var(--zui-file-upload-teal-bg-hover-dark,oklch(70.4%_0.14_182.503_/_0.15))]",
+  blue: "border border-[color:var(--zui-file-upload-blue-border,#2563eb)] dark:border-[color:var(--zui-file-upload-blue-border-dark,#3b82f6)] bg-[var(--zui-file-upload-blue-bg,#2563eb14)] dark:bg-[var(--zui-file-upload-blue-bg-dark,#3b82f624)] text-[color:var(--zui-file-upload-blue-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-blue-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-blue-bg-hover,#2563eb24)] dark:hover:bg-[var(--zui-file-upload-blue-bg-hover-dark,#3b82f633)]",
+  cyan: "border border-[color:var(--zui-file-upload-cyan-border,#0891b2)] dark:border-[color:var(--zui-file-upload-cyan-border-dark,#22d3ee)] bg-[var(--zui-file-upload-cyan-bg,#0891b214)] dark:bg-[var(--zui-file-upload-cyan-bg-dark,#22d3ee24)] text-[color:var(--zui-file-upload-cyan-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-cyan-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-cyan-bg-hover,#0891b224)] dark:hover:bg-[var(--zui-file-upload-cyan-bg-hover-dark,#22d3ee33)]",
+  green: "border border-[color:var(--zui-file-upload-green-border,#16a34a)] dark:border-[color:var(--zui-file-upload-green-border-dark,#22c55e)] bg-[var(--zui-file-upload-green-bg,#16a34a14)] dark:bg-[var(--zui-file-upload-green-bg-dark,#22c55e24)] text-[color:var(--zui-file-upload-green-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-green-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-green-bg-hover,#16a34a24)] dark:hover:bg-[var(--zui-file-upload-green-bg-hover-dark,#22c55e33)]",
+  lime: "border border-[color:var(--zui-file-upload-lime-border,#65a30d)] dark:border-[color:var(--zui-file-upload-lime-border-dark,#a3e635)] bg-[var(--zui-file-upload-lime-bg,#65a30d14)] dark:bg-[var(--zui-file-upload-lime-bg-dark,#a3e63524)] text-[color:var(--zui-file-upload-lime-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-lime-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-lime-bg-hover,#65a30d24)] dark:hover:bg-[var(--zui-file-upload-lime-bg-hover-dark,#a3e63533)]",
+  mint: "border border-[color:var(--zui-file-upload-mint-border,#10b981)] dark:border-[color:var(--zui-file-upload-mint-border-dark,#6ee7b7)] bg-[var(--zui-file-upload-mint-bg,#10b98114)] dark:bg-[var(--zui-file-upload-mint-bg-dark,#6ee7b724)] text-[color:var(--zui-file-upload-mint-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-mint-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-mint-bg-hover,#10b98124)] dark:hover:bg-[var(--zui-file-upload-mint-bg-hover-dark,#6ee7b733)]",
+  ocean: "border border-[color:var(--zui-file-upload-ocean-border,#0284c7)] dark:border-[color:var(--zui-file-upload-ocean-border-dark,#38bdf8)] bg-[var(--zui-file-upload-ocean-bg,#0284c714)] dark:bg-[var(--zui-file-upload-ocean-bg-dark,#38bdf824)] text-[color:var(--zui-file-upload-ocean-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-ocean-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-ocean-bg-hover,#0284c724)] dark:hover:bg-[var(--zui-file-upload-ocean-bg-hover-dark,#38bdf833)]",
+  sapphire: "border border-[color:var(--zui-file-upload-sapphire-border,#1d4ed8)] dark:border-[color:var(--zui-file-upload-sapphire-border-dark,#60a5fa)] bg-[var(--zui-file-upload-sapphire-bg,#1d4ed814)] dark:bg-[var(--zui-file-upload-sapphire-bg-dark,#60a5fa24)] text-[color:var(--zui-file-upload-sapphire-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-sapphire-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-sapphire-bg-hover,#1d4ed824)] dark:hover:bg-[var(--zui-file-upload-sapphire-bg-hover-dark,#60a5fa33)]",
+  lavender: "border border-[color:var(--zui-file-upload-lavender-border,#8b5cf6)] dark:border-[color:var(--zui-file-upload-lavender-border-dark,#a78bfa)] bg-[var(--zui-file-upload-lavender-bg,#8b5cf614)] dark:bg-[var(--zui-file-upload-lavender-bg-dark,#a78bfa24)] text-[color:var(--zui-file-upload-lavender-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-lavender-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-lavender-bg-hover,#8b5cf624)] dark:hover:bg-[var(--zui-file-upload-lavender-bg-hover-dark,#a78bfa33)]",
+  ruby: "border border-[color:var(--zui-file-upload-ruby-border,#be123c)] dark:border-[color:var(--zui-file-upload-ruby-border-dark,#fb7185)] bg-[var(--zui-file-upload-ruby-bg,#be123c14)] dark:bg-[var(--zui-file-upload-ruby-bg-dark,#fb718524)] text-[color:var(--zui-file-upload-ruby-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-ruby-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-ruby-bg-hover,#be123c24)] dark:hover:bg-[var(--zui-file-upload-ruby-bg-hover-dark,#fb718533)]",
+  red: "border border-[color:var(--zui-file-upload-red-border,#dc2626)] dark:border-[color:var(--zui-file-upload-red-border-dark,#ef4444)] bg-[var(--zui-file-upload-red-bg,#dc262614)] dark:bg-[var(--zui-file-upload-red-bg-dark,#ef444424)] text-[color:var(--zui-file-upload-red-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-red-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-red-bg-hover,#dc262624)] dark:hover:bg-[var(--zui-file-upload-red-bg-hover-dark,#ef444433)]",
+  slate: "border border-[color:var(--zui-file-upload-slate-border,#475569)] dark:border-[color:var(--zui-file-upload-slate-border-dark,#64748b)] bg-[var(--zui-file-upload-slate-bg,#47556914)] dark:bg-[var(--zui-file-upload-slate-bg-dark,#64748b24)] text-[color:var(--zui-file-upload-slate-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-slate-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-slate-bg-hover,#47556924)] dark:hover:bg-[var(--zui-file-upload-slate-bg-hover-dark,#64748b33)]",
+  zinc: "border border-[color:var(--zui-file-upload-zinc-border,#52525b)] dark:border-[color:var(--zui-file-upload-zinc-border-dark,#71717a)] bg-[var(--zui-file-upload-zinc-bg,#52525b14)] dark:bg-[var(--zui-file-upload-zinc-bg-dark,#71717a24)] text-[color:var(--zui-file-upload-zinc-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-zinc-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-zinc-bg-hover,#52525b24)] dark:hover:bg-[var(--zui-file-upload-zinc-bg-hover-dark,#71717a33)]",
+  stone: "border border-[color:var(--zui-file-upload-stone-border,#57534e)] dark:border-[color:var(--zui-file-upload-stone-border-dark,#78716c)] bg-[var(--zui-file-upload-stone-bg,#57534e14)] dark:bg-[var(--zui-file-upload-stone-bg-dark,#78716c24)] text-[color:var(--zui-file-upload-stone-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-stone-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-stone-bg-hover,#57534e24)] dark:hover:bg-[var(--zui-file-upload-stone-bg-hover-dark,#78716c33)]",
+  royal: "border border-[color:var(--zui-file-upload-royal-border,#4338ca)] dark:border-[color:var(--zui-file-upload-royal-border-dark,#818cf8)] bg-[var(--zui-file-upload-royal-bg,#4338ca14)] dark:bg-[var(--zui-file-upload-royal-bg-dark,#818cf824)] text-[color:var(--zui-file-upload-royal-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-royal-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-royal-bg-hover,#4338ca24)] dark:hover:bg-[var(--zui-file-upload-royal-bg-hover-dark,#818cf833)]",
+  electric: "border border-[color:var(--zui-file-upload-electric-border,#0ea5e9)] dark:border-[color:var(--zui-file-upload-electric-border-dark,#38bdf8)] bg-[var(--zui-file-upload-electric-bg,#0ea5e914)] dark:bg-[var(--zui-file-upload-electric-bg-dark,#38bdf824)] text-[color:var(--zui-file-upload-electric-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-electric-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-electric-bg-hover,#0ea5e924)] dark:hover:bg-[var(--zui-file-upload-electric-bg-hover-dark,#38bdf833)]",
+  forest: "border border-[color:var(--zui-file-upload-forest-border,#166534)] dark:border-[color:var(--zui-file-upload-forest-border-dark,#4ade80)] bg-[var(--zui-file-upload-forest-bg,#16653414)] dark:bg-[var(--zui-file-upload-forest-bg-dark,#4ade8024)] text-[color:var(--zui-file-upload-forest-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-forest-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-forest-bg-hover,#16653424)] dark:hover:bg-[var(--zui-file-upload-forest-bg-hover-dark,#4ade8033)]",
+  sunset: "border border-[color:var(--zui-file-upload-sunset-border,#ea580c)] dark:border-[color:var(--zui-file-upload-sunset-border-dark,#fb923c)] bg-[var(--zui-file-upload-sunset-bg,#ea580c14)] dark:bg-[var(--zui-file-upload-sunset-bg-dark,#fb923c24)] text-[color:var(--zui-file-upload-sunset-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-sunset-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-sunset-bg-hover,#ea580c24)] dark:hover:bg-[var(--zui-file-upload-sunset-bg-hover-dark,#fb923c33)]",
+  magenta: "border border-[color:var(--zui-file-upload-magenta-border,#c026d3)] dark:border-[color:var(--zui-file-upload-magenta-border-dark,#e879f9)] bg-[var(--zui-file-upload-magenta-bg,#c026d314)] dark:bg-[var(--zui-file-upload-magenta-bg-dark,#e879f924)] text-[color:var(--zui-file-upload-magenta-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-magenta-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-magenta-bg-hover,#c026d324)] dark:hover:bg-[var(--zui-file-upload-magenta-bg-hover-dark,#e879f933)]",
+  crimson: "border border-[color:var(--zui-file-upload-crimson-border,#b91c1c)] dark:border-[color:var(--zui-file-upload-crimson-border-dark,#f87171)] bg-[var(--zui-file-upload-crimson-bg,#b91c1c14)] dark:bg-[var(--zui-file-upload-crimson-bg-dark,#f8717124)] text-[color:var(--zui-file-upload-crimson-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-crimson-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-crimson-bg-hover,#b91c1c24)] dark:hover:bg-[var(--zui-file-upload-crimson-bg-hover-dark,#f8717133)]",
+  aqua: "border border-[color:var(--zui-file-upload-aqua-border,#0f766e)] dark:border-[color:var(--zui-file-upload-aqua-border-dark,#2dd4bf)] bg-[var(--zui-file-upload-aqua-bg,#0f766e14)] dark:bg-[var(--zui-file-upload-aqua-bg-dark,#2dd4bf24)] text-[color:var(--zui-file-upload-aqua-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-aqua-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-aqua-bg-hover,#0f766e24)] dark:hover:bg-[var(--zui-file-upload-aqua-bg-hover-dark,#2dd4bf33)]",
+  plum: "border border-[color:var(--zui-file-upload-plum-border,#7e22ce)] dark:border-[color:var(--zui-file-upload-plum-border-dark,#c084fc)] bg-[var(--zui-file-upload-plum-bg,#7e22ce14)] dark:bg-[var(--zui-file-upload-plum-bg-dark,#c084fc24)] text-[color:var(--zui-file-upload-plum-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-plum-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-plum-bg-hover,#7e22ce24)] dark:hover:bg-[var(--zui-file-upload-plum-bg-hover-dark,#c084fc33)]"
 };
 
 // src/ui/file-upload/variants.ts

package/dist/ui/file-upload.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/design-system/file-upload.ts","../../src/ui/file-upload/variants.ts","../../src/ui/file-upload/file-upload.tsx"],"names":[],"mappings":"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","file":"file-upload.mjs","sourcesContent":["export const zuiFileUploadBase =\n  \"relative flex cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border border-dashed px-6 py-10 text-center text-sm transition-colors outline-none focus-visible:ring-2 focus-visible:ring-[var(--zui-file-upload-ring-focus,oklch(70.2%_0.183_293.541_/_0.6))] dark:focus-visible:ring-[var(--zui-file-upload-ring-focus-dark,oklch(70.2%_0.183_293.541_/_0.6))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-file-upload-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:focus-visible:ring-offset-[var(--zui-file-upload-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))]\";\n\nexport const zuiFileUploadAppearances = {\n  idle: \"border-[color:var(--zui-file-upload-idle-border,#00000026)] dark:border-[color:var(--zui-file-upload-idle-border-dark,#ffffff26)] bg-[var(--zui-file-upload-idle-bg,#0000000d)] dark:bg-[var(--zui-file-upload-idle-bg-dark,#ffffff0d)] text-[color:var(--zui-file-upload-idle-fg,oklch(44.6%_0.043_257.281))] dark:text-[color:var(--zui-file-upload-idle-fg-dark,oklch(86.9%_0.022_252.894))] hover:border-[color:var(--zui-file-upload-idle-border-hover,#00000040)] dark:hover:border-[color:var(--zui-file-upload-idle-border-hover-dark,#ffffff40)] hover:bg-[var(--zui-file-upload-idle-bg-hover,#00000012)] dark:hover:bg-[var(--zui-file-upload-idle-bg-hover-dark,#ffffff12)] dark:bg-[var(--zui-file-upload-idle-bg-dark,#ffffff12)]\",\n  active:\n    \"border-[color:var(--zui-file-upload-active-border,oklch(70.2%_0.183_293.541_/_0.7))] dark:border-[color:var(--zui-file-upload-active-border-dark,oklch(70.2%_0.183_293.541_/_0.7))] bg-[var(--zui-file-upload-active-bg,oklch(60.6%_0.25_292.717_/_0.1))] dark:bg-[var(--zui-file-upload-active-bg-dark,oklch(60.6%_0.25_292.717_/_0.1))] text-[color:var(--zui-file-upload-active-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-file-upload-active-fg-dark,#ffffff)]\",\n  disabled: \"cursor-not-allowed opacity-50\",\n  error:\n    \"border-[color:var(--zui-file-upload-error-border,oklch(70.4%_0.191_22.216_/_0.7))] dark:border-[color:var(--zui-file-upload-error-border-dark,oklch(70.4%_0.191_22.216_/_0.7))] bg-[var(--zui-file-upload-error-bg,oklch(63.7%_0.237_25.331_/_0.1))] dark:bg-[var(--zui-file-upload-error-bg-dark,oklch(63.7%_0.237_25.331_/_0.1))] text-[color:var(--zui-file-upload-error-fg,oklch(57.7%_0.245_27.325))] dark:text-[color:var(--zui-file-upload-error-fg-dark,oklch(70.4%_0.191_22.216))] hover:border-[color:var(--zui-file-upload-error-border-hover,oklch(70.4%_0.191_22.216_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-error-border-hover-dark,oklch(70.4%_0.191_22.216_/_0.8))] hover:bg-[var(--zui-file-upload-error-bg-hover,oklch(63.7%_0.237_25.331_/_0.15))] dark:hover:bg-[var(--zui-file-upload-error-bg-hover-dark,oklch(63.7%_0.237_25.331_/_0.15))]\",\n  success:\n    \"border-[color:var(--zui-file-upload-success-border,oklch(79.2%_0.209_151.711_/_0.7))] dark:border-[color:var(--zui-file-upload-success-border-dark,oklch(79.2%_0.209_151.711_/_0.7))] bg-[var(--zui-file-upload-success-bg,oklch(72.3%_0.219_149.579_/_0.1))] dark:bg-[var(--zui-file-upload-success-bg-dark,oklch(72.3%_0.219_149.579_/_0.1))] text-[color:var(--zui-file-upload-success-fg,oklch(62.7%_0.194_149.214))] dark:text-[color:var(--zui-file-upload-success-fg-dark,oklch(79.2%_0.209_151.711))] hover:border-[color:var(--zui-file-upload-success-border-hover,oklch(79.2%_0.209_151.711_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-success-border-hover-dark,oklch(79.2%_0.209_151.711_/_0.8))] hover:bg-[var(--zui-file-upload-success-bg-hover,oklch(72.3%_0.219_149.579_/_0.15))] dark:hover:bg-[var(--zui-file-upload-success-bg-hover-dark,oklch(72.3%_0.219_149.579_/_0.15))]\",\n  warning:\n    \"border-[color:var(--zui-file-upload-warning-border,oklch(85.2%_0.199_91.936_/_0.7))] dark:border-[color:var(--zui-file-upload-warning-border-dark,oklch(85.2%_0.199_91.936_/_0.7))] bg-[var(--zui-file-upload-warning-bg,oklch(79.5%_0.184_86.047_/_0.1))] dark:bg-[var(--zui-file-upload-warning-bg-dark,oklch(79.5%_0.184_86.047_/_0.1))] text-[color:var(--zui-file-upload-warning-fg,oklch(68.1%_0.162_75.834))] dark:text-[color:var(--zui-file-upload-warning-fg-dark,oklch(85.2%_0.199_91.936))] hover:border-[color:var(--zui-file-upload-warning-border-hover,oklch(85.2%_0.199_91.936_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-warning-border-hover-dark,oklch(85.2%_0.199_91.936_/_0.8))] hover:bg-[var(--zui-file-upload-warning-bg-hover,oklch(79.5%_0.184_86.047_/_0.15))] dark:hover:bg-[var(--zui-file-upload-warning-bg-hover-dark,oklch(79.5%_0.184_86.047_/_0.15))]\",\n  info: \"border-[color:var(--zui-file-upload-info-border,oklch(70.7%_0.165_254.624_/_0.7))] dark:border-[color:var(--zui-file-upload-info-border-dark,oklch(70.7%_0.165_254.624_/_0.7))] bg-[var(--zui-file-upload-info-bg,oklch(62.3%_0.214_259.815_/_0.1))] dark:bg-[var(--zui-file-upload-info-bg-dark,oklch(62.3%_0.214_259.815_/_0.1))] text-[color:var(--zui-file-upload-info-fg,oklch(54.6%_0.245_262.881))] dark:text-[color:var(--zui-file-upload-info-fg-dark,oklch(70.7%_0.165_254.624))] hover:border-[color:var(--zui-file-upload-info-border-hover,oklch(70.7%_0.165_254.624_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-info-border-hover-dark,oklch(70.7%_0.165_254.624_/_0.8))] hover:bg-[var(--zui-file-upload-info-bg-hover,oklch(62.3%_0.214_259.815_/_0.15))] dark:hover:bg-[var(--zui-file-upload-info-bg-hover-dark,oklch(62.3%_0.214_259.815_/_0.15))]\",\n  neutral:\n    \"border-[color:var(--zui-file-upload-neutral-border,oklch(70.7%_0.022_261.325_/_0.7))] dark:border-[color:var(--zui-file-upload-neutral-border-dark,oklch(70.7%_0.022_261.325_/_0.7))] bg-[var(--zui-file-upload-neutral-bg,oklch(55.1%_0.027_264.364_/_0.1))] dark:bg-[var(--zui-file-upload-neutral-bg-dark,oklch(55.1%_0.027_264.364_/_0.1))] text-[color:var(--zui-file-upload-neutral-fg,oklch(44.6%_0.03_256.802))] dark:text-[color:var(--zui-file-upload-neutral-fg-dark,oklch(70.7%_0.022_261.325))] hover:border-[color:var(--zui-file-upload-neutral-border-hover,oklch(70.7%_0.022_261.325_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-neutral-border-hover-dark,oklch(70.7%_0.022_261.325_/_0.8))] hover:bg-[var(--zui-file-upload-neutral-bg-hover,oklch(55.1%_0.027_264.364_/_0.15))] dark:hover:bg-[var(--zui-file-upload-neutral-bg-hover-dark,oklch(55.1%_0.027_264.364_/_0.15))]\",\n  purple:\n    \"border-[color:var(--zui-file-upload-purple-border,oklch(71.4%_0.203_305.504_/_0.7))] dark:border-[color:var(--zui-file-upload-purple-border-dark,oklch(71.4%_0.203_305.504_/_0.7))] bg-[var(--zui-file-upload-purple-bg,oklch(62.7%_0.265_303.9_/_0.1))] dark:bg-[var(--zui-file-upload-purple-bg-dark,oklch(62.7%_0.265_303.9_/_0.1))] text-[color:var(--zui-file-upload-purple-fg,oklch(55.8%_0.288_302.321))] dark:text-[color:var(--zui-file-upload-purple-fg-dark,oklch(71.4%_0.203_305.504))] hover:border-[color:var(--zui-file-upload-purple-border-hover,oklch(71.4%_0.203_305.504_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-purple-border-hover-dark,oklch(71.4%_0.203_305.504_/_0.8))] hover:bg-[var(--zui-file-upload-purple-bg-hover,oklch(62.7%_0.265_303.9_/_0.15))] dark:hover:bg-[var(--zui-file-upload-purple-bg-hover-dark,oklch(62.7%_0.265_303.9_/_0.15))]\",\n  indigo:\n    \"border-[color:var(--zui-file-upload-indigo-border,oklch(67.3%_0.182_276.935_/_0.7))] dark:border-[color:var(--zui-file-upload-indigo-border-dark,oklch(67.3%_0.182_276.935_/_0.7))] bg-[var(--zui-file-upload-indigo-bg,oklch(58.5%_0.233_277.117_/_0.1))] dark:bg-[var(--zui-file-upload-indigo-bg-dark,oklch(58.5%_0.233_277.117_/_0.1))] text-[color:var(--zui-file-upload-indigo-fg,oklch(51.1%_0.262_276.966))] dark:text-[color:var(--zui-file-upload-indigo-fg-dark,oklch(67.3%_0.182_276.935))] hover:border-[color:var(--zui-file-upload-indigo-border-hover,oklch(67.3%_0.182_276.935_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-indigo-border-hover-dark,oklch(67.3%_0.182_276.935_/_0.8))] hover:bg-[var(--zui-file-upload-indigo-bg-hover,oklch(58.5%_0.233_277.117_/_0.15))] dark:hover:bg-[var(--zui-file-upload-indigo-bg-hover-dark,oklch(58.5%_0.233_277.117_/_0.15))]\",\n  emerald:\n    \"border-[color:var(--zui-file-upload-emerald-border,oklch(76.5%_0.177_163.223_/_0.7))] dark:border-[color:var(--zui-file-upload-emerald-border-dark,oklch(76.5%_0.177_163.223_/_0.7))] bg-[var(--zui-file-upload-emerald-bg,oklch(69.6%_0.17_162.48_/_0.1))] dark:bg-[var(--zui-file-upload-emerald-bg-dark,oklch(69.6%_0.17_162.48_/_0.1))] text-[color:var(--zui-file-upload-emerald-fg,oklch(59.6%_0.145_163.225))] dark:text-[color:var(--zui-file-upload-emerald-fg-dark,oklch(76.5%_0.177_163.223))] hover:border-[color:var(--zui-file-upload-emerald-border-hover,oklch(76.5%_0.177_163.223_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-emerald-border-hover-dark,oklch(76.5%_0.177_163.223_/_0.8))] hover:bg-[var(--zui-file-upload-emerald-bg-hover,oklch(69.6%_0.17_162.48_/_0.15))] dark:hover:bg-[var(--zui-file-upload-emerald-bg-hover-dark,oklch(69.6%_0.17_162.48_/_0.15))]\",\n  amber:\n    \"border-[color:var(--zui-file-upload-amber-border,oklch(82.8%_0.189_84.429_/_0.7))] dark:border-[color:var(--zui-file-upload-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.7))] bg-[var(--zui-file-upload-amber-bg,oklch(76.9%_0.188_70.08_/_0.1))] dark:bg-[var(--zui-file-upload-amber-bg-dark,oklch(76.9%_0.188_70.08_/_0.1))] text-[color:var(--zui-file-upload-amber-fg,oklch(66.6%_0.179_58.318))] dark:text-[color:var(--zui-file-upload-amber-fg-dark,oklch(82.8%_0.189_84.429))] hover:border-[color:var(--zui-file-upload-amber-border-hover,oklch(82.8%_0.189_84.429_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-amber-border-hover-dark,oklch(82.8%_0.189_84.429_/_0.8))] hover:bg-[var(--zui-file-upload-amber-bg-hover,oklch(76.9%_0.188_70.08_/_0.15))] dark:hover:bg-[var(--zui-file-upload-amber-bg-hover-dark,oklch(76.9%_0.188_70.08_/_0.15))]\",\n  pink: \"border-[color:var(--zui-file-upload-pink-border,oklch(71.8%_0.202_349.761_/_0.7))] dark:border-[color:var(--zui-file-upload-pink-border-dark,oklch(71.8%_0.202_349.761_/_0.7))] bg-[var(--zui-file-upload-pink-bg,oklch(65.6%_0.241_354.308_/_0.1))] dark:bg-[var(--zui-file-upload-pink-bg-dark,oklch(65.6%_0.241_354.308_/_0.1))] text-[color:var(--zui-file-upload-pink-fg,oklch(59.2%_0.249_0.584))] dark:text-[color:var(--zui-file-upload-pink-fg-dark,oklch(71.8%_0.202_349.761))] hover:border-[color:var(--zui-file-upload-pink-border-hover,oklch(71.8%_0.202_349.761_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-pink-border-hover-dark,oklch(71.8%_0.202_349.761_/_0.8))] hover:bg-[var(--zui-file-upload-pink-bg-hover,oklch(65.6%_0.241_354.308_/_0.15))] dark:hover:bg-[var(--zui-file-upload-pink-bg-hover-dark,oklch(65.6%_0.241_354.308_/_0.15))]\",\n  orange:\n    \"border-[color:var(--zui-file-upload-orange-border,oklch(75%_0.183_55.934_/_0.7))] dark:border-[color:var(--zui-file-upload-orange-border-dark,oklch(75%_0.183_55.934_/_0.7))] bg-[var(--zui-file-upload-orange-bg,oklch(70.5%_0.213_47.604_/_0.1))] dark:bg-[var(--zui-file-upload-orange-bg-dark,oklch(70.5%_0.213_47.604_/_0.1))] text-[color:var(--zui-file-upload-orange-fg,oklch(64.6%_0.222_41.116))] dark:text-[color:var(--zui-file-upload-orange-fg-dark,oklch(75%_0.183_55.934))] hover:border-[color:var(--zui-file-upload-orange-border-hover,oklch(75%_0.183_55.934_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-orange-border-hover-dark,oklch(75%_0.183_55.934_/_0.8))] hover:bg-[var(--zui-file-upload-orange-bg-hover,oklch(70.5%_0.213_47.604_/_0.15))] dark:hover:bg-[var(--zui-file-upload-orange-bg-hover-dark,oklch(70.5%_0.213_47.604_/_0.15))]\",\n  teal: \"border-[color:var(--zui-file-upload-teal-border,oklch(77.7%_0.152_181.912_/_0.7))] dark:border-[color:var(--zui-file-upload-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.7))] bg-[var(--zui-file-upload-teal-bg,oklch(70.4%_0.14_182.503_/_0.1))] dark:bg-[var(--zui-file-upload-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.1))] text-[color:var(--zui-file-upload-teal-fg,oklch(60%_0.118_184.704))] dark:text-[color:var(--zui-file-upload-teal-fg-dark,oklch(77.7%_0.152_181.912))] hover:border-[color:var(--zui-file-upload-teal-border-hover,oklch(77.7%_0.152_181.912_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-teal-border-hover-dark,oklch(77.7%_0.152_181.912_/_0.8))] hover:bg-[var(--zui-file-upload-teal-bg-hover,oklch(70.4%_0.14_182.503_/_0.15))] dark:hover:bg-[var(--zui-file-upload-teal-bg-hover-dark,oklch(70.4%_0.14_182.503_/_0.15))]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiFileUploadAppearances,\n  zuiFileUploadBase,\n} from \"../../design-system/file-upload\";\n\nexport const fileUploadVariants = cva(zuiFileUploadBase, {\n  variants: {\n    appearance: zuiFileUploadAppearances,\n  },\n  defaultVariants: {\n    appearance: \"idle\",\n  },\n});\n","\"use client\";\n\nimport { useCallback, useId, useState } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { FileUploadProps } from \"./types\";\nimport { fileUploadVariants } from \"./variants\";\n\nexport function FileUpload({\n  className,\n  onFiles,\n  accept,\n  multiple = false,\n  disabled = false,\n  name,\n  children,\n  onChange,\n  ref,\n  appearance = \"idle\",\n  ...rest\n}: FileUploadProps & { ref?: React.Ref<HTMLDivElement> }) {\n  const inputId = useId();\n  const [dragOver, setDragOver] = useState(false);\n\n  const emitFiles = useCallback(\n    (fileList: FileList | null) => {\n      if (!fileList?.length) {\n        return;\n      }\n      onFiles?.(Array.from(fileList));\n    },\n    [onFiles],\n  );\n\n  const handleChange = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(event);\n      emitFiles(event.target.files);\n      event.target.value = \"\";\n    },\n    [emitFiles, onChange],\n  );\n\n  const handleDrop = useCallback(\n    (event: React.DragEvent<HTMLLabelElement>) => {\n      event.preventDefault();\n      setDragOver(false);\n      if (disabled) {\n        return;\n      }\n      emitFiles(event.dataTransfer.files);\n    },\n    [disabled, emitFiles],\n  );\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"file-upload\"\n      className={cn(fileUploadVariants({ appearance }), className)}\n      {...rest}\n    >\n      <input\n        id={inputId}\n        name={name}\n        type=\"file\"\n        className=\"sr-only\"\n        accept={accept}\n        multiple={multiple}\n        disabled={disabled}\n        onChange={handleChange}\n      />\n      <label\n        htmlFor={inputId}\n        className={cn(\n          \"flex w-full cursor-pointer flex-col items-center gap-2\",\n          disabled && \"cursor-not-allowed\",\n        )}\n        onDragEnter={(e) => {\n          e.preventDefault();\n          if (!disabled) {\n            setDragOver(true);\n          }\n        }}\n        onDragOver={(e) => {\n          e.preventDefault();\n          if (!disabled) {\n            setDragOver(true);\n          }\n        }}\n        onDragLeave={() => setDragOver(false)}\n        onDrop={handleDrop}\n      >\n        {children ?? (\n          <>\n            <span className=\"text-base font-semibold text-slate-900 dark:text-slate-100\">\n              Drop files here\n            </span>\n            <span className=\"text-xs text-slate-600 dark:text-slate-400\">\n              or click to browse from your device\n            </span>\n          </>\n        )}\n        {dragOver && (\n          <span className=\"text-xs text-slate-600 dark:text-slate-400\">\n            Drop files here\n          </span>\n        )}\n      </label>\n    </div>\n  );\n}\n\nFileUpload.displayName = \"FileUpload\";\n"]}
+{"version":3,"sources":["../../src/design-system/file-upload.ts","../../src/ui/file-upload/variants.ts","../../src/ui/file-upload/file-upload.tsx"],"names":[],"mappings":"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","file":"file-upload.mjs","sourcesContent":["export const zuiFileUploadBase =\n  \"relative flex cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border border-dashed px-6 py-10 text-center text-sm transition-colors outline-none focus-visible:ring-2 focus-visible:ring-[var(--zui-file-upload-ring-focus,oklch(70.2%_0.183_293.541_/_0.6))] dark:focus-visible:ring-[var(--zui-file-upload-ring-focus-dark,oklch(70.2%_0.183_293.541_/_0.6))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-file-upload-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:focus-visible:ring-offset-[var(--zui-file-upload-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))]\";\n\nexport const zuiFileUploadAppearances = {\n  idle: \"border-[color:var(--zui-file-upload-idle-border,#00000026)] dark:border-[color:var(--zui-file-upload-idle-border-dark,#ffffff26)] bg-[var(--zui-file-upload-idle-bg,#0000000d)] dark:bg-[var(--zui-file-upload-idle-bg-dark,#ffffff0d)] text-[color:var(--zui-file-upload-idle-fg,oklch(44.6%_0.043_257.281))] dark:text-[color:var(--zui-file-upload-idle-fg-dark,oklch(86.9%_0.022_252.894))] hover:border-[color:var(--zui-file-upload-idle-border-hover,#00000040)] dark:hover:border-[color:var(--zui-file-upload-idle-border-hover-dark,#ffffff40)] hover:bg-[var(--zui-file-upload-idle-bg-hover,#00000012)] dark:hover:bg-[var(--zui-file-upload-idle-bg-hover-dark,#ffffff12)] dark:bg-[var(--zui-file-upload-idle-bg-dark,#ffffff12)]\",\n  active:\n    \"border-[color:var(--zui-file-upload-active-border,oklch(70.2%_0.183_293.541_/_0.7))] dark:border-[color:var(--zui-file-upload-active-border-dark,oklch(70.2%_0.183_293.541_/_0.7))] bg-[var(--zui-file-upload-active-bg,oklch(60.6%_0.25_292.717_/_0.1))] dark:bg-[var(--zui-file-upload-active-bg-dark,oklch(60.6%_0.25_292.717_/_0.1))] text-[color:var(--zui-file-upload-active-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-file-upload-active-fg-dark,#ffffff)]\",\n  disabled: \"cursor-not-allowed opacity-50\",\n  error:\n    \"border-[color:var(--zui-file-upload-error-border,oklch(70.4%_0.191_22.216_/_0.7))] dark:border-[color:var(--zui-file-upload-error-border-dark,oklch(70.4%_0.191_22.216_/_0.7))] bg-[var(--zui-file-upload-error-bg,oklch(63.7%_0.237_25.331_/_0.1))] dark:bg-[var(--zui-file-upload-error-bg-dark,oklch(63.7%_0.237_25.331_/_0.1))] text-[color:var(--zui-file-upload-error-fg,oklch(57.7%_0.245_27.325))] dark:text-[color:var(--zui-file-upload-error-fg-dark,oklch(70.4%_0.191_22.216))] hover:border-[color:var(--zui-file-upload-error-border-hover,oklch(70.4%_0.191_22.216_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-error-border-hover-dark,oklch(70.4%_0.191_22.216_/_0.8))] hover:bg-[var(--zui-file-upload-error-bg-hover,oklch(63.7%_0.237_25.331_/_0.15))] dark:hover:bg-[var(--zui-file-upload-error-bg-hover-dark,oklch(63.7%_0.237_25.331_/_0.15))]\",\n  success:\n    \"border-[color:var(--zui-file-upload-success-border,oklch(79.2%_0.209_151.711_/_0.7))] dark:border-[color:var(--zui-file-upload-success-border-dark,oklch(79.2%_0.209_151.711_/_0.7))] bg-[var(--zui-file-upload-success-bg,oklch(72.3%_0.219_149.579_/_0.1))] dark:bg-[var(--zui-file-upload-success-bg-dark,oklch(72.3%_0.219_149.579_/_0.1))] text-[color:var(--zui-file-upload-success-fg,oklch(62.7%_0.194_149.214))] dark:text-[color:var(--zui-file-upload-success-fg-dark,oklch(79.2%_0.209_151.711))] hover:border-[color:var(--zui-file-upload-success-border-hover,oklch(79.2%_0.209_151.711_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-success-border-hover-dark,oklch(79.2%_0.209_151.711_/_0.8))] hover:bg-[var(--zui-file-upload-success-bg-hover,oklch(72.3%_0.219_149.579_/_0.15))] dark:hover:bg-[var(--zui-file-upload-success-bg-hover-dark,oklch(72.3%_0.219_149.579_/_0.15))]\",\n  warning:\n    \"border-[color:var(--zui-file-upload-warning-border,oklch(85.2%_0.199_91.936_/_0.7))] dark:border-[color:var(--zui-file-upload-warning-border-dark,oklch(85.2%_0.199_91.936_/_0.7))] bg-[var(--zui-file-upload-warning-bg,oklch(79.5%_0.184_86.047_/_0.1))] dark:bg-[var(--zui-file-upload-warning-bg-dark,oklch(79.5%_0.184_86.047_/_0.1))] text-[color:var(--zui-file-upload-warning-fg,oklch(68.1%_0.162_75.834))] dark:text-[color:var(--zui-file-upload-warning-fg-dark,oklch(85.2%_0.199_91.936))] hover:border-[color:var(--zui-file-upload-warning-border-hover,oklch(85.2%_0.199_91.936_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-warning-border-hover-dark,oklch(85.2%_0.199_91.936_/_0.8))] hover:bg-[var(--zui-file-upload-warning-bg-hover,oklch(79.5%_0.184_86.047_/_0.15))] dark:hover:bg-[var(--zui-file-upload-warning-bg-hover-dark,oklch(79.5%_0.184_86.047_/_0.15))]\",\n  info: \"border-[color:var(--zui-file-upload-info-border,oklch(70.7%_0.165_254.624_/_0.7))] dark:border-[color:var(--zui-file-upload-info-border-dark,oklch(70.7%_0.165_254.624_/_0.7))] bg-[var(--zui-file-upload-info-bg,oklch(62.3%_0.214_259.815_/_0.1))] dark:bg-[var(--zui-file-upload-info-bg-dark,oklch(62.3%_0.214_259.815_/_0.1))] text-[color:var(--zui-file-upload-info-fg,oklch(54.6%_0.245_262.881))] dark:text-[color:var(--zui-file-upload-info-fg-dark,oklch(70.7%_0.165_254.624))] hover:border-[color:var(--zui-file-upload-info-border-hover,oklch(70.7%_0.165_254.624_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-info-border-hover-dark,oklch(70.7%_0.165_254.624_/_0.8))] hover:bg-[var(--zui-file-upload-info-bg-hover,oklch(62.3%_0.214_259.815_/_0.15))] dark:hover:bg-[var(--zui-file-upload-info-bg-hover-dark,oklch(62.3%_0.214_259.815_/_0.15))]\",\n  neutral:\n    \"border-[color:var(--zui-file-upload-neutral-border,oklch(70.7%_0.022_261.325_/_0.7))] dark:border-[color:var(--zui-file-upload-neutral-border-dark,oklch(70.7%_0.022_261.325_/_0.7))] bg-[var(--zui-file-upload-neutral-bg,oklch(55.1%_0.027_264.364_/_0.1))] dark:bg-[var(--zui-file-upload-neutral-bg-dark,oklch(55.1%_0.027_264.364_/_0.1))] text-[color:var(--zui-file-upload-neutral-fg,oklch(44.6%_0.03_256.802))] dark:text-[color:var(--zui-file-upload-neutral-fg-dark,oklch(70.7%_0.022_261.325))] hover:border-[color:var(--zui-file-upload-neutral-border-hover,oklch(70.7%_0.022_261.325_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-neutral-border-hover-dark,oklch(70.7%_0.022_261.325_/_0.8))] hover:bg-[var(--zui-file-upload-neutral-bg-hover,oklch(55.1%_0.027_264.364_/_0.15))] dark:hover:bg-[var(--zui-file-upload-neutral-bg-hover-dark,oklch(55.1%_0.027_264.364_/_0.15))]\",\n  purple:\n    \"border-[color:var(--zui-file-upload-purple-border,oklch(71.4%_0.203_305.504_/_0.7))] dark:border-[color:var(--zui-file-upload-purple-border-dark,oklch(71.4%_0.203_305.504_/_0.7))] bg-[var(--zui-file-upload-purple-bg,oklch(62.7%_0.265_303.9_/_0.1))] dark:bg-[var(--zui-file-upload-purple-bg-dark,oklch(62.7%_0.265_303.9_/_0.1))] text-[color:var(--zui-file-upload-purple-fg,oklch(55.8%_0.288_302.321))] dark:text-[color:var(--zui-file-upload-purple-fg-dark,oklch(71.4%_0.203_305.504))] hover:border-[color:var(--zui-file-upload-purple-border-hover,oklch(71.4%_0.203_305.504_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-purple-border-hover-dark,oklch(71.4%_0.203_305.504_/_0.8))] hover:bg-[var(--zui-file-upload-purple-bg-hover,oklch(62.7%_0.265_303.9_/_0.15))] dark:hover:bg-[var(--zui-file-upload-purple-bg-hover-dark,oklch(62.7%_0.265_303.9_/_0.15))]\",\n  indigo:\n    \"border-[color:var(--zui-file-upload-indigo-border,oklch(67.3%_0.182_276.935_/_0.7))] dark:border-[color:var(--zui-file-upload-indigo-border-dark,oklch(67.3%_0.182_276.935_/_0.7))] bg-[var(--zui-file-upload-indigo-bg,oklch(58.5%_0.233_277.117_/_0.1))] dark:bg-[var(--zui-file-upload-indigo-bg-dark,oklch(58.5%_0.233_277.117_/_0.1))] text-[color:var(--zui-file-upload-indigo-fg,oklch(51.1%_0.262_276.966))] dark:text-[color:var(--zui-file-upload-indigo-fg-dark,oklch(67.3%_0.182_276.935))] hover:border-[color:var(--zui-file-upload-indigo-border-hover,oklch(67.3%_0.182_276.935_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-indigo-border-hover-dark,oklch(67.3%_0.182_276.935_/_0.8))] hover:bg-[var(--zui-file-upload-indigo-bg-hover,oklch(58.5%_0.233_277.117_/_0.15))] dark:hover:bg-[var(--zui-file-upload-indigo-bg-hover-dark,oklch(58.5%_0.233_277.117_/_0.15))]\",\n  emerald:\n    \"border-[color:var(--zui-file-upload-emerald-border,oklch(76.5%_0.177_163.223_/_0.7))] dark:border-[color:var(--zui-file-upload-emerald-border-dark,oklch(76.5%_0.177_163.223_/_0.7))] bg-[var(--zui-file-upload-emerald-bg,oklch(69.6%_0.17_162.48_/_0.1))] dark:bg-[var(--zui-file-upload-emerald-bg-dark,oklch(69.6%_0.17_162.48_/_0.1))] text-[color:var(--zui-file-upload-emerald-fg,oklch(59.6%_0.145_163.225))] dark:text-[color:var(--zui-file-upload-emerald-fg-dark,oklch(76.5%_0.177_163.223))] hover:border-[color:var(--zui-file-upload-emerald-border-hover,oklch(76.5%_0.177_163.223_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-emerald-border-hover-dark,oklch(76.5%_0.177_163.223_/_0.8))] hover:bg-[var(--zui-file-upload-emerald-bg-hover,oklch(69.6%_0.17_162.48_/_0.15))] dark:hover:bg-[var(--zui-file-upload-emerald-bg-hover-dark,oklch(69.6%_0.17_162.48_/_0.15))]\",\n  amber:\n    \"border-[color:var(--zui-file-upload-amber-border,oklch(82.8%_0.189_84.429_/_0.7))] dark:border-[color:var(--zui-file-upload-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.7))] bg-[var(--zui-file-upload-amber-bg,oklch(76.9%_0.188_70.08_/_0.1))] dark:bg-[var(--zui-file-upload-amber-bg-dark,oklch(76.9%_0.188_70.08_/_0.1))] text-[color:var(--zui-file-upload-amber-fg,oklch(66.6%_0.179_58.318))] dark:text-[color:var(--zui-file-upload-amber-fg-dark,oklch(82.8%_0.189_84.429))] hover:border-[color:var(--zui-file-upload-amber-border-hover,oklch(82.8%_0.189_84.429_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-amber-border-hover-dark,oklch(82.8%_0.189_84.429_/_0.8))] hover:bg-[var(--zui-file-upload-amber-bg-hover,oklch(76.9%_0.188_70.08_/_0.15))] dark:hover:bg-[var(--zui-file-upload-amber-bg-hover-dark,oklch(76.9%_0.188_70.08_/_0.15))]\",\n  pink: \"border-[color:var(--zui-file-upload-pink-border,oklch(71.8%_0.202_349.761_/_0.7))] dark:border-[color:var(--zui-file-upload-pink-border-dark,oklch(71.8%_0.202_349.761_/_0.7))] bg-[var(--zui-file-upload-pink-bg,oklch(65.6%_0.241_354.308_/_0.1))] dark:bg-[var(--zui-file-upload-pink-bg-dark,oklch(65.6%_0.241_354.308_/_0.1))] text-[color:var(--zui-file-upload-pink-fg,oklch(59.2%_0.249_0.584))] dark:text-[color:var(--zui-file-upload-pink-fg-dark,oklch(71.8%_0.202_349.761))] hover:border-[color:var(--zui-file-upload-pink-border-hover,oklch(71.8%_0.202_349.761_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-pink-border-hover-dark,oklch(71.8%_0.202_349.761_/_0.8))] hover:bg-[var(--zui-file-upload-pink-bg-hover,oklch(65.6%_0.241_354.308_/_0.15))] dark:hover:bg-[var(--zui-file-upload-pink-bg-hover-dark,oklch(65.6%_0.241_354.308_/_0.15))]\",\n  orange:\n    \"border-[color:var(--zui-file-upload-orange-border,oklch(75%_0.183_55.934_/_0.7))] dark:border-[color:var(--zui-file-upload-orange-border-dark,oklch(75%_0.183_55.934_/_0.7))] bg-[var(--zui-file-upload-orange-bg,oklch(70.5%_0.213_47.604_/_0.1))] dark:bg-[var(--zui-file-upload-orange-bg-dark,oklch(70.5%_0.213_47.604_/_0.1))] text-[color:var(--zui-file-upload-orange-fg,oklch(64.6%_0.222_41.116))] dark:text-[color:var(--zui-file-upload-orange-fg-dark,oklch(75%_0.183_55.934))] hover:border-[color:var(--zui-file-upload-orange-border-hover,oklch(75%_0.183_55.934_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-orange-border-hover-dark,oklch(75%_0.183_55.934_/_0.8))] hover:bg-[var(--zui-file-upload-orange-bg-hover,oklch(70.5%_0.213_47.604_/_0.15))] dark:hover:bg-[var(--zui-file-upload-orange-bg-hover-dark,oklch(70.5%_0.213_47.604_/_0.15))]\",\n  teal: \"border-[color:var(--zui-file-upload-teal-border,oklch(77.7%_0.152_181.912_/_0.7))] dark:border-[color:var(--zui-file-upload-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.7))] bg-[var(--zui-file-upload-teal-bg,oklch(70.4%_0.14_182.503_/_0.1))] dark:bg-[var(--zui-file-upload-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.1))] text-[color:var(--zui-file-upload-teal-fg,oklch(60%_0.118_184.704))] dark:text-[color:var(--zui-file-upload-teal-fg-dark,oklch(77.7%_0.152_181.912))] hover:border-[color:var(--zui-file-upload-teal-border-hover,oklch(77.7%_0.152_181.912_/_0.8))] dark:hover:border-[color:var(--zui-file-upload-teal-border-hover-dark,oklch(77.7%_0.152_181.912_/_0.8))] hover:bg-[var(--zui-file-upload-teal-bg-hover,oklch(70.4%_0.14_182.503_/_0.15))] dark:hover:bg-[var(--zui-file-upload-teal-bg-hover-dark,oklch(70.4%_0.14_182.503_/_0.15))]\",\n  blue: \"border border-[color:var(--zui-file-upload-blue-border,#2563eb)] dark:border-[color:var(--zui-file-upload-blue-border-dark,#3b82f6)] bg-[var(--zui-file-upload-blue-bg,#2563eb14)] dark:bg-[var(--zui-file-upload-blue-bg-dark,#3b82f624)] text-[color:var(--zui-file-upload-blue-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-blue-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-blue-bg-hover,#2563eb24)] dark:hover:bg-[var(--zui-file-upload-blue-bg-hover-dark,#3b82f633)]\",\n  cyan: \"border border-[color:var(--zui-file-upload-cyan-border,#0891b2)] dark:border-[color:var(--zui-file-upload-cyan-border-dark,#22d3ee)] bg-[var(--zui-file-upload-cyan-bg,#0891b214)] dark:bg-[var(--zui-file-upload-cyan-bg-dark,#22d3ee24)] text-[color:var(--zui-file-upload-cyan-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-cyan-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-cyan-bg-hover,#0891b224)] dark:hover:bg-[var(--zui-file-upload-cyan-bg-hover-dark,#22d3ee33)]\",\n  green:\n    \"border border-[color:var(--zui-file-upload-green-border,#16a34a)] dark:border-[color:var(--zui-file-upload-green-border-dark,#22c55e)] bg-[var(--zui-file-upload-green-bg,#16a34a14)] dark:bg-[var(--zui-file-upload-green-bg-dark,#22c55e24)] text-[color:var(--zui-file-upload-green-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-green-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-green-bg-hover,#16a34a24)] dark:hover:bg-[var(--zui-file-upload-green-bg-hover-dark,#22c55e33)]\",\n  lime: \"border border-[color:var(--zui-file-upload-lime-border,#65a30d)] dark:border-[color:var(--zui-file-upload-lime-border-dark,#a3e635)] bg-[var(--zui-file-upload-lime-bg,#65a30d14)] dark:bg-[var(--zui-file-upload-lime-bg-dark,#a3e63524)] text-[color:var(--zui-file-upload-lime-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-lime-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-lime-bg-hover,#65a30d24)] dark:hover:bg-[var(--zui-file-upload-lime-bg-hover-dark,#a3e63533)]\",\n  mint: \"border border-[color:var(--zui-file-upload-mint-border,#10b981)] dark:border-[color:var(--zui-file-upload-mint-border-dark,#6ee7b7)] bg-[var(--zui-file-upload-mint-bg,#10b98114)] dark:bg-[var(--zui-file-upload-mint-bg-dark,#6ee7b724)] text-[color:var(--zui-file-upload-mint-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-mint-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-mint-bg-hover,#10b98124)] dark:hover:bg-[var(--zui-file-upload-mint-bg-hover-dark,#6ee7b733)]\",\n  ocean:\n    \"border border-[color:var(--zui-file-upload-ocean-border,#0284c7)] dark:border-[color:var(--zui-file-upload-ocean-border-dark,#38bdf8)] bg-[var(--zui-file-upload-ocean-bg,#0284c714)] dark:bg-[var(--zui-file-upload-ocean-bg-dark,#38bdf824)] text-[color:var(--zui-file-upload-ocean-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-ocean-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-ocean-bg-hover,#0284c724)] dark:hover:bg-[var(--zui-file-upload-ocean-bg-hover-dark,#38bdf833)]\",\n  sapphire:\n    \"border border-[color:var(--zui-file-upload-sapphire-border,#1d4ed8)] dark:border-[color:var(--zui-file-upload-sapphire-border-dark,#60a5fa)] bg-[var(--zui-file-upload-sapphire-bg,#1d4ed814)] dark:bg-[var(--zui-file-upload-sapphire-bg-dark,#60a5fa24)] text-[color:var(--zui-file-upload-sapphire-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-sapphire-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-sapphire-bg-hover,#1d4ed824)] dark:hover:bg-[var(--zui-file-upload-sapphire-bg-hover-dark,#60a5fa33)]\",\n  lavender:\n    \"border border-[color:var(--zui-file-upload-lavender-border,#8b5cf6)] dark:border-[color:var(--zui-file-upload-lavender-border-dark,#a78bfa)] bg-[var(--zui-file-upload-lavender-bg,#8b5cf614)] dark:bg-[var(--zui-file-upload-lavender-bg-dark,#a78bfa24)] text-[color:var(--zui-file-upload-lavender-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-lavender-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-lavender-bg-hover,#8b5cf624)] dark:hover:bg-[var(--zui-file-upload-lavender-bg-hover-dark,#a78bfa33)]\",\n  ruby: \"border border-[color:var(--zui-file-upload-ruby-border,#be123c)] dark:border-[color:var(--zui-file-upload-ruby-border-dark,#fb7185)] bg-[var(--zui-file-upload-ruby-bg,#be123c14)] dark:bg-[var(--zui-file-upload-ruby-bg-dark,#fb718524)] text-[color:var(--zui-file-upload-ruby-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-ruby-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-ruby-bg-hover,#be123c24)] dark:hover:bg-[var(--zui-file-upload-ruby-bg-hover-dark,#fb718533)]\",\n  red: \"border border-[color:var(--zui-file-upload-red-border,#dc2626)] dark:border-[color:var(--zui-file-upload-red-border-dark,#ef4444)] bg-[var(--zui-file-upload-red-bg,#dc262614)] dark:bg-[var(--zui-file-upload-red-bg-dark,#ef444424)] text-[color:var(--zui-file-upload-red-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-red-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-red-bg-hover,#dc262624)] dark:hover:bg-[var(--zui-file-upload-red-bg-hover-dark,#ef444433)]\",\n  slate:\n    \"border border-[color:var(--zui-file-upload-slate-border,#475569)] dark:border-[color:var(--zui-file-upload-slate-border-dark,#64748b)] bg-[var(--zui-file-upload-slate-bg,#47556914)] dark:bg-[var(--zui-file-upload-slate-bg-dark,#64748b24)] text-[color:var(--zui-file-upload-slate-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-slate-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-slate-bg-hover,#47556924)] dark:hover:bg-[var(--zui-file-upload-slate-bg-hover-dark,#64748b33)]\",\n  zinc: \"border border-[color:var(--zui-file-upload-zinc-border,#52525b)] dark:border-[color:var(--zui-file-upload-zinc-border-dark,#71717a)] bg-[var(--zui-file-upload-zinc-bg,#52525b14)] dark:bg-[var(--zui-file-upload-zinc-bg-dark,#71717a24)] text-[color:var(--zui-file-upload-zinc-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-zinc-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-zinc-bg-hover,#52525b24)] dark:hover:bg-[var(--zui-file-upload-zinc-bg-hover-dark,#71717a33)]\",\n  stone:\n    \"border border-[color:var(--zui-file-upload-stone-border,#57534e)] dark:border-[color:var(--zui-file-upload-stone-border-dark,#78716c)] bg-[var(--zui-file-upload-stone-bg,#57534e14)] dark:bg-[var(--zui-file-upload-stone-bg-dark,#78716c24)] text-[color:var(--zui-file-upload-stone-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-stone-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-stone-bg-hover,#57534e24)] dark:hover:bg-[var(--zui-file-upload-stone-bg-hover-dark,#78716c33)]\",\n  royal:\n    \"border border-[color:var(--zui-file-upload-royal-border,#4338ca)] dark:border-[color:var(--zui-file-upload-royal-border-dark,#818cf8)] bg-[var(--zui-file-upload-royal-bg,#4338ca14)] dark:bg-[var(--zui-file-upload-royal-bg-dark,#818cf824)] text-[color:var(--zui-file-upload-royal-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-royal-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-royal-bg-hover,#4338ca24)] dark:hover:bg-[var(--zui-file-upload-royal-bg-hover-dark,#818cf833)]\",\n  electric:\n    \"border border-[color:var(--zui-file-upload-electric-border,#0ea5e9)] dark:border-[color:var(--zui-file-upload-electric-border-dark,#38bdf8)] bg-[var(--zui-file-upload-electric-bg,#0ea5e914)] dark:bg-[var(--zui-file-upload-electric-bg-dark,#38bdf824)] text-[color:var(--zui-file-upload-electric-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-electric-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-electric-bg-hover,#0ea5e924)] dark:hover:bg-[var(--zui-file-upload-electric-bg-hover-dark,#38bdf833)]\",\n  forest:\n    \"border border-[color:var(--zui-file-upload-forest-border,#166534)] dark:border-[color:var(--zui-file-upload-forest-border-dark,#4ade80)] bg-[var(--zui-file-upload-forest-bg,#16653414)] dark:bg-[var(--zui-file-upload-forest-bg-dark,#4ade8024)] text-[color:var(--zui-file-upload-forest-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-forest-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-forest-bg-hover,#16653424)] dark:hover:bg-[var(--zui-file-upload-forest-bg-hover-dark,#4ade8033)]\",\n  sunset:\n    \"border border-[color:var(--zui-file-upload-sunset-border,#ea580c)] dark:border-[color:var(--zui-file-upload-sunset-border-dark,#fb923c)] bg-[var(--zui-file-upload-sunset-bg,#ea580c14)] dark:bg-[var(--zui-file-upload-sunset-bg-dark,#fb923c24)] text-[color:var(--zui-file-upload-sunset-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-sunset-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-sunset-bg-hover,#ea580c24)] dark:hover:bg-[var(--zui-file-upload-sunset-bg-hover-dark,#fb923c33)]\",\n  magenta:\n    \"border border-[color:var(--zui-file-upload-magenta-border,#c026d3)] dark:border-[color:var(--zui-file-upload-magenta-border-dark,#e879f9)] bg-[var(--zui-file-upload-magenta-bg,#c026d314)] dark:bg-[var(--zui-file-upload-magenta-bg-dark,#e879f924)] text-[color:var(--zui-file-upload-magenta-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-magenta-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-magenta-bg-hover,#c026d324)] dark:hover:bg-[var(--zui-file-upload-magenta-bg-hover-dark,#e879f933)]\",\n  crimson:\n    \"border border-[color:var(--zui-file-upload-crimson-border,#b91c1c)] dark:border-[color:var(--zui-file-upload-crimson-border-dark,#f87171)] bg-[var(--zui-file-upload-crimson-bg,#b91c1c14)] dark:bg-[var(--zui-file-upload-crimson-bg-dark,#f8717124)] text-[color:var(--zui-file-upload-crimson-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-crimson-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-crimson-bg-hover,#b91c1c24)] dark:hover:bg-[var(--zui-file-upload-crimson-bg-hover-dark,#f8717133)]\",\n  aqua: \"border border-[color:var(--zui-file-upload-aqua-border,#0f766e)] dark:border-[color:var(--zui-file-upload-aqua-border-dark,#2dd4bf)] bg-[var(--zui-file-upload-aqua-bg,#0f766e14)] dark:bg-[var(--zui-file-upload-aqua-bg-dark,#2dd4bf24)] text-[color:var(--zui-file-upload-aqua-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-aqua-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-aqua-bg-hover,#0f766e24)] dark:hover:bg-[var(--zui-file-upload-aqua-bg-hover-dark,#2dd4bf33)]\",\n  plum: \"border border-[color:var(--zui-file-upload-plum-border,#7e22ce)] dark:border-[color:var(--zui-file-upload-plum-border-dark,#c084fc)] bg-[var(--zui-file-upload-plum-bg,#7e22ce14)] dark:bg-[var(--zui-file-upload-plum-bg-dark,#c084fc24)] text-[color:var(--zui-file-upload-plum-fg,#0f172a)] dark:text-[color:var(--zui-file-upload-plum-fg-dark,#f8fafc)] hover:bg-[var(--zui-file-upload-plum-bg-hover,#7e22ce24)] dark:hover:bg-[var(--zui-file-upload-plum-bg-hover-dark,#c084fc33)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiFileUploadAppearances,\n  zuiFileUploadBase,\n} from \"../../design-system/file-upload\";\n\nexport const fileUploadVariants = cva(zuiFileUploadBase, {\n  variants: {\n    appearance: zuiFileUploadAppearances,\n  },\n  defaultVariants: {\n    appearance: \"idle\",\n  },\n});\n","\"use client\";\n\nimport { useCallback, useId, useState } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { FileUploadProps } from \"./types\";\nimport { fileUploadVariants } from \"./variants\";\n\nexport function FileUpload({\n  className,\n  onFiles,\n  accept,\n  multiple = false,\n  disabled = false,\n  name,\n  children,\n  onChange,\n  ref,\n  appearance = \"idle\",\n  ...rest\n}: FileUploadProps & { ref?: React.Ref<HTMLDivElement> }) {\n  const inputId = useId();\n  const [dragOver, setDragOver] = useState(false);\n\n  const emitFiles = useCallback(\n    (fileList: FileList | null) => {\n      if (!fileList?.length) {\n        return;\n      }\n      onFiles?.(Array.from(fileList));\n    },\n    [onFiles],\n  );\n\n  const handleChange = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(event);\n      emitFiles(event.target.files);\n      event.target.value = \"\";\n    },\n    [emitFiles, onChange],\n  );\n\n  const handleDrop = useCallback(\n    (event: React.DragEvent<HTMLLabelElement>) => {\n      event.preventDefault();\n      setDragOver(false);\n      if (disabled) {\n        return;\n      }\n      emitFiles(event.dataTransfer.files);\n    },\n    [disabled, emitFiles],\n  );\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"file-upload\"\n      className={cn(fileUploadVariants({ appearance }), className)}\n      {...rest}\n    >\n      <input\n        id={inputId}\n        name={name}\n        type=\"file\"\n        className=\"sr-only\"\n        accept={accept}\n        multiple={multiple}\n        disabled={disabled}\n        onChange={handleChange}\n      />\n      <label\n        htmlFor={inputId}\n        className={cn(\n          \"flex w-full cursor-pointer flex-col items-center gap-2\",\n          disabled && \"cursor-not-allowed\",\n        )}\n        onDragEnter={(e) => {\n          e.preventDefault();\n          if (!disabled) {\n            setDragOver(true);\n          }\n        }}\n        onDragOver={(e) => {\n          e.preventDefault();\n          if (!disabled) {\n            setDragOver(true);\n          }\n        }}\n        onDragLeave={() => setDragOver(false)}\n        onDrop={handleDrop}\n      >\n        {children ?? (\n          <>\n            <span className=\"text-base font-semibold text-slate-900 dark:text-slate-100\">\n              Drop files here\n            </span>\n            <span className=\"text-xs text-slate-600 dark:text-slate-400\">\n              or click to browse from your device\n            </span>\n          </>\n        )}\n        {dragOver && (\n          <span className=\"text-xs text-slate-600 dark:text-slate-400\">\n            Drop files here\n          </span>\n        )}\n      </label>\n    </div>\n  );\n}\n\nFileUpload.displayName = \"FileUpload\";\n"]}

package/dist/ui/inputs/animated.js

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var chunkUGH23TAH_js = require('../../chunk-UGH23TAH.js');
+var chunkXYKDSHRG_js = require('../../chunk-XYKDSHRG.js');
 var chunkZS5756ZC_js = require('../../chunk-ZS5756ZC.js');
 var react = require('react');
 var framerMotion = require('framer-motion');
@@ -68,7 +68,7 @@ var InputAnimated = (props) => {
           id: controlId2,
           "data-slot": "input",
           className: chunkZS5756ZC_js.cn(
-            chunkUGH23TAH_js.inputVariants({ appearance: appearance2, size: size2, ring: ring2, as: as2 }),
+            chunkXYKDSHRG_js.inputVariants({ appearance: appearance2, size: size2, ring: ring2, as: as2 }),
             className2
           ),
           initial: false,
@@ -113,7 +113,7 @@ var InputAnimated = (props) => {
         id: controlId,
         "data-slot": "input",
         className: chunkZS5756ZC_js.cn(
-          chunkUGH23TAH_js.inputVariants({ appearance, size, ring, as: as ?? "input" }),
+          chunkXYKDSHRG_js.inputVariants({ appearance, size, ring, as: as ?? "input" }),
           className
         ),
         initial: false,

package/dist/ui/inputs/animated.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { inputVariants } from '../../chunk-D3VZKUMH.mjs';
+import { inputVariants } from '../../chunk-4WRCXG5E.mjs';
 import { cn } from '../../chunk-4D54YOL6.mjs';
 import { useId } from 'react';
 import { motion } from 'framer-motion';

package/dist/ui/inputs/variants.d.ts

@@ -1,6 +1,6 @@
 export declare const inputVariants: (props?: ({
     as?: "input" | "textarea" | "checkbox" | "radio" | "date" | "file" | null | undefined;
-    appearance?: "default" | "violet" | "amber" | "indigo" | "orange" | "pink" | "error" | "success" | "warning" | "info" | null | undefined;
+    appearance?: "ruby" | "default" | "violet" | "amber" | "slate" | "indigo" | "cyan" | "aqua" | "blue" | "crimson" | "green" | "lavender" | "lime" | "magenta" | "orange" | "pink" | "plum" | "red" | "error" | "mint" | "ocean" | "sapphire" | "zinc" | "stone" | "royal" | "electric" | "forest" | "sunset" | "success" | "warning" | "info" | null | undefined;
     size?: "md" | "sm" | "lg" | null | undefined;
     ring?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/ui/inputs/variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/inputs/variants.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,aAAa;;;;;8EA6SxB,CAAC"}
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/inputs/variants.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,aAAa;;;;;8EAurBxB,CAAC"}

package/dist/ui/inputs.js

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var chunkUGH23TAH_js = require('../chunk-UGH23TAH.js');
+var chunkXYKDSHRG_js = require('../chunk-XYKDSHRG.js');
 var chunkZS5756ZC_js = require('../chunk-ZS5756ZC.js');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -58,7 +58,7 @@ var InputBase = (props) => {
           id: controlId2,
           "data-slot": "input",
           className: chunkZS5756ZC_js.cn(
-            chunkUGH23TAH_js.inputVariants({ appearance: appearance2, size: size2, ring: ring2, as: as2 }),
+            chunkXYKDSHRG_js.inputVariants({ appearance: appearance2, size: size2, ring: ring2, as: as2 }),
             className2
           ),
           "aria-invalid": ariaInvalid2,
@@ -117,7 +117,7 @@ var InputBase = (props) => {
         id: controlId,
         "data-slot": "input",
         className: chunkZS5756ZC_js.cn(
-          chunkUGH23TAH_js.inputVariants({ appearance, size, ring, as: as ?? "input" }),
+          chunkXYKDSHRG_js.inputVariants({ appearance, size, ring, as: as ?? "input" }),
           className
         ),
         "aria-invalid": ariaInvalid,
@@ -143,7 +143,7 @@ Input.displayName = "Input";
 
 Object.defineProperty(exports, "inputVariants", {
   enumerable: true,
-  get: function () { return chunkUGH23TAH_js.inputVariants; }
+  get: function () { return chunkXYKDSHRG_js.inputVariants; }
 });
 exports.Input = Input;
 //# sourceMappingURL=inputs.js.map

package/dist/ui/inputs.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { inputVariants } from '../chunk-D3VZKUMH.mjs';
-export { inputVariants } from '../chunk-D3VZKUMH.mjs';
+import { inputVariants } from '../chunk-4WRCXG5E.mjs';
+export { inputVariants } from '../chunk-4WRCXG5E.mjs';
 import { cn } from '../chunk-4D54YOL6.mjs';
 import { useId } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';

package/dist/ui/kbd/animated.js

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var chunkRFT2FLQT_js = require('../../chunk-RFT2FLQT.js');
+var chunkXIG2QDVN_js = require('../../chunk-XIG2QDVN.js');
 require('../../chunk-ZS5756ZC.js');
 var framerMotion = require('framer-motion');
 var jsxRuntime = require('react/jsx-runtime');
@@ -26,7 +26,7 @@ function KbdAnimated({
 }) {
   const motionProps = kbdAnimationPresets[animation];
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkRFT2FLQT_js.KbdBase,
+    chunkXIG2QDVN_js.KbdBase,
     {
       ...{
         as: framerMotion.motion.span,

package/dist/ui/kbd/animated.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { KbdBase } from '../../chunk-CJXGDY7A.mjs';
+import { KbdBase } from '../../chunk-OEDD43IT.mjs';
 import '../../chunk-4D54YOL6.mjs';
 import { motion } from 'framer-motion';
 import { jsx } from 'react/jsx-runtime';

package/dist/ui/kbd/variants.d.ts

@@ -1,5 +1,5 @@
 export declare const kbdKeyVariants: (props?: ({
-    appearance?: "outline" | "default" | "glass" | "sky" | "emerald" | "violet" | "amber" | "rose" | "gray" | "indigo" | "orange" | "pink" | "purple" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "secondary" | "destructive" | "ghost" | null | undefined;
+    appearance?: "ruby" | "outline" | "default" | "glass" | "sky" | "emerald" | "violet" | "amber" | "rose" | "slate" | "gray" | "indigo" | "cyan" | "aqua" | "blue" | "crimson" | "green" | "lavender" | "lime" | "magenta" | "orange" | "pink" | "plum" | "purple" | "red" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "secondary" | "destructive" | "ghost" | "mint" | "ocean" | "sapphire" | "zinc" | "stone" | "royal" | "electric" | "forest" | "sunset" | null | undefined;
     size?: "md" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare const kbdSeparatorVariants: (props?: ({

package/dist/ui/kbd/variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/variants.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,cAAc;;;8EASzB,CAAC;AAEH,eAAO,MAAM,oBAAoB;;8EAUhC,CAAC"}
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/variants.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,cAAc;;;8EASzB,CAAC;AAEH,eAAO,MAAM,oBAAoB;;8EAO/B,CAAC"}

package/dist/ui/kbd.js

@@ -1,22 +1,22 @@
 "use client";
 'use strict';
 
-var chunkRFT2FLQT_js = require('../chunk-RFT2FLQT.js');
+var chunkXIG2QDVN_js = require('../chunk-XIG2QDVN.js');
 require('../chunk-ZS5756ZC.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function Kbd(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkRFT2FLQT_js.KbdBase, { ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkXIG2QDVN_js.KbdBase, { ...props });
 }
 Kbd.displayName = "Kbd";
 
 Object.defineProperty(exports, "kbdKeyVariants", {
   enumerable: true,
-  get: function () { return chunkRFT2FLQT_js.kbdKeyVariants; }
+  get: function () { return chunkXIG2QDVN_js.kbdKeyVariants; }
 });
 Object.defineProperty(exports, "kbdSeparatorVariants", {
   enumerable: true,
-  get: function () { return chunkRFT2FLQT_js.kbdSeparatorVariants; }
+  get: function () { return chunkXIG2QDVN_js.kbdSeparatorVariants; }
 });
 exports.Kbd = Kbd;
 //# sourceMappingURL=kbd.js.map

package/dist/ui/kbd.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { KbdBase } from '../chunk-CJXGDY7A.mjs';
-export { kbdKeyVariants, kbdSeparatorVariants } from '../chunk-CJXGDY7A.mjs';
+import { KbdBase } from '../chunk-OEDD43IT.mjs';
+export { kbdKeyVariants, kbdSeparatorVariants } from '../chunk-OEDD43IT.mjs';
 import '../chunk-4D54YOL6.mjs';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/ui/marquee/variants.d.ts

@@ -1,5 +1,5 @@
 export declare const marqueeVariants: (props?: ({
-    appearance?: "outline" | "default" | "sky" | "emerald" | "rose" | "indigo" | "orange" | "pink" | "purple" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "ghost" | "card" | "separated" | null | undefined;
+    appearance?: "ruby" | "outline" | "default" | "sky" | "emerald" | "rose" | "slate" | "indigo" | "cyan" | "aqua" | "blue" | "crimson" | "green" | "lavender" | "lime" | "magenta" | "orange" | "pink" | "plum" | "purple" | "red" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "ghost" | "mint" | "ocean" | "sapphire" | "zinc" | "stone" | "royal" | "electric" | "forest" | "sunset" | "card" | "separated" | null | undefined;
     fade?: boolean | null | undefined;
     orientation?: "horizontal" | "vertical" | null | undefined;
     size?: "md" | "sm" | "lg" | null | undefined;

package/dist/ui/marquee.js

@@ -24,15 +24,36 @@ var zuiMarqueeAppearances = {
   teal: "border-[color:var(--zui-marquee-teal-border,oklch(70.4%_0.14_182.503_/_0.28))] [--zui-marquee-bg:oklch(98.4%_0.014_180.72)] [--zui-marquee-fg:oklch(38.6%_0.063_188.416)] dark:border-[color:var(--zui-marquee-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.32))] dark:[--zui-marquee-bg:oklch(38.6%_0.063_188.416_/_0.28)] dark:[--zui-marquee-fg:oklch(95.3%_0.051_180.801)]",
   indigo: "border-[color:var(--zui-marquee-indigo-border,oklch(58.5%_0.233_277.117_/_0.24))] [--zui-marquee-bg:oklch(96.2%_0.018_272.314)] [--zui-marquee-fg:oklch(35.9%_0.144_278.697)] dark:border-[color:var(--zui-marquee-indigo-border-dark,oklch(67.3%_0.182_276.935_/_0.32))] dark:[--zui-marquee-bg:oklch(35.9%_0.144_278.697_/_0.28)] dark:[--zui-marquee-fg:oklch(93%_0.034_272.788)]",
   emerald: "border-[color:var(--zui-marquee-emerald-border,oklch(69.6%_0.17_162.48_/_0.28))] [--zui-marquee-bg:oklch(97.9%_0.021_166.113)] [--zui-marquee-fg:oklch(37.8%_0.077_168.94)] dark:border-[color:var(--zui-marquee-emerald-border-dark,oklch(76.5%_0.177_163.223_/_0.32))] dark:[--zui-marquee-bg:oklch(37.8%_0.077_168.94_/_0.28)] dark:[--zui-marquee-fg:oklch(95%_0.052_163.051)]",
-  "gradient-blue": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-blue-from,oklch(62.3%_0.214_259.815))] to-[var(--zui-marquee-gradient-blue-to,oklch(54.6%_0.245_262.881))] [--zui-marquee-fg:#ffffff]",
-  "gradient-green": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-green-from,oklch(72.3%_0.219_149.579))] to-[var(--zui-marquee-gradient-green-to,oklch(62.7%_0.194_149.214))] [--zui-marquee-fg:#ffffff]",
-  "gradient-red": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-red-from,oklch(63.7%_0.237_25.331))] to-[var(--zui-marquee-gradient-red-to,oklch(57.7%_0.245_27.325))] [--zui-marquee-fg:#ffffff]",
-  "gradient-yellow": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-yellow-from,oklch(85.2%_0.199_91.936))] to-[var(--zui-marquee-gradient-yellow-to,oklch(79.5%_0.184_86.047))] [--zui-marquee-fg:oklch(27.9%_0.077_45.635)]",
-  "gradient-purple": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-purple-from,oklch(71.4%_0.203_305.504))] to-[var(--zui-marquee-gradient-purple-to,oklch(62.7%_0.265_303.9))] [--zui-marquee-fg:#ffffff]",
-  "gradient-teal": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-teal-from,oklch(77.7%_0.152_181.912))] to-[var(--zui-marquee-gradient-teal-to,oklch(70.4%_0.14_182.503))] [--zui-marquee-fg:#ffffff]",
-  "gradient-indigo": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-indigo-from,oklch(67.3%_0.182_276.935))] to-[var(--zui-marquee-gradient-indigo-to,oklch(58.5%_0.233_277.117))] [--zui-marquee-fg:#ffffff]",
-  "gradient-pink": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-pink-from,oklch(71.8%_0.202_349.761))] to-[var(--zui-marquee-gradient-pink-to,oklch(65.6%_0.241_354.308))] [--zui-marquee-fg:#ffffff]",
-  "gradient-orange": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-orange-from,oklch(75%_0.183_55.934))] to-[var(--zui-marquee-gradient-orange-to,oklch(70.5%_0.213_47.604))] [--zui-marquee-fg:#ffffff]"
+  "gradient-blue": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-blue-from,oklch(62.3%_0.214_259.815))] dark:from-[var(--zui-marquee-gradient-blue-from-dark,oklch(42.4%_0.199_265.638))] to-[var(--zui-marquee-gradient-blue-to,oklch(54.6%_0.245_262.881))] dark:to-[var(--zui-marquee-gradient-blue-to-dark,oklch(37.9%_0.146_265.522))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-green": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-green-from,oklch(72.3%_0.219_149.579))] dark:from-[var(--zui-marquee-gradient-green-from-dark,oklch(44.8%_0.119_151.328))] to-[var(--zui-marquee-gradient-green-to,oklch(62.7%_0.194_149.214))] dark:to-[var(--zui-marquee-gradient-green-to-dark,oklch(39.3%_0.095_152.535))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-red": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-red-from,oklch(63.7%_0.237_25.331))] dark:from-[var(--zui-marquee-gradient-red-from-dark,oklch(44.4%_0.177_26.899))] to-[var(--zui-marquee-gradient-red-to,oklch(57.7%_0.245_27.325))] dark:to-[var(--zui-marquee-gradient-red-to-dark,oklch(39.6%_0.141_25.723))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-yellow": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-yellow-from,oklch(85.2%_0.199_91.936))] dark:from-[var(--zui-marquee-gradient-yellow-from-dark,oklch(47.6%_0.114_61.907))] to-[var(--zui-marquee-gradient-yellow-to,oklch(79.5%_0.184_86.047))] dark:to-[var(--zui-marquee-gradient-yellow-to-dark,oklch(42.1%_0.095_57.708))] [--zui-marquee-fg:oklch(27.9%_0.077_45.635)] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-purple": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-purple-from,oklch(71.4%_0.203_305.504))] dark:from-[var(--zui-marquee-gradient-purple-from-dark,oklch(43.8%_0.218_303.724))] to-[var(--zui-marquee-gradient-purple-to,oklch(62.7%_0.265_303.9))] dark:to-[var(--zui-marquee-gradient-purple-to-dark,oklch(38.1%_0.176_304.987))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-teal": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-teal-from,oklch(77.7%_0.152_181.912))] dark:from-[var(--zui-marquee-gradient-teal-from-dark,oklch(43.7%_0.078_188.216))] to-[var(--zui-marquee-gradient-teal-to,oklch(70.4%_0.14_182.503))] dark:to-[var(--zui-marquee-gradient-teal-to-dark,oklch(38.6%_0.063_188.416))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-indigo": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-indigo-from,oklch(67.3%_0.182_276.935))] dark:from-[var(--zui-marquee-gradient-indigo-from-dark,oklch(39.8%_0.195_277.366))] to-[var(--zui-marquee-gradient-indigo-to,oklch(58.5%_0.233_277.117))] dark:to-[var(--zui-marquee-gradient-indigo-to-dark,oklch(35.9%_0.144_278.697))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-pink": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-pink-from,oklch(71.8%_0.202_349.761))] dark:from-[var(--zui-marquee-gradient-pink-from-dark,oklch(45.9%_0.187_3.815))] to-[var(--zui-marquee-gradient-pink-to,oklch(65.6%_0.241_354.308))] dark:to-[var(--zui-marquee-gradient-pink-to-dark,oklch(40.8%_0.153_2.432))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  "gradient-orange": "border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-orange-from,oklch(75%_0.183_55.934))] dark:from-[var(--zui-marquee-gradient-orange-from-dark,oklch(47%_0.157_37.304))] to-[var(--zui-marquee-gradient-orange-to,oklch(70.5%_0.213_47.604))] dark:to-[var(--zui-marquee-gradient-orange-to-dark,oklch(40.8%_0.123_38.172))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]",
+  blue: "border border-[color:var(--zui-marquee-blue-border,#2563eb)] dark:border-[color:var(--zui-marquee-blue-border-dark,#3b82f6)] bg-[var(--zui-marquee-blue-bg,#2563eb14)] dark:bg-[var(--zui-marquee-blue-bg-dark,#3b82f624)] text-[color:var(--zui-marquee-blue-fg,#0f172a)] dark:text-[color:var(--zui-marquee-blue-fg-dark,#f8fafc)]",
+  cyan: "border border-[color:var(--zui-marquee-cyan-border,#0891b2)] dark:border-[color:var(--zui-marquee-cyan-border-dark,#22d3ee)] bg-[var(--zui-marquee-cyan-bg,#0891b214)] dark:bg-[var(--zui-marquee-cyan-bg-dark,#22d3ee24)] text-[color:var(--zui-marquee-cyan-fg,#0f172a)] dark:text-[color:var(--zui-marquee-cyan-fg-dark,#f8fafc)]",
+  green: "border border-[color:var(--zui-marquee-green-border,#16a34a)] dark:border-[color:var(--zui-marquee-green-border-dark,#22c55e)] bg-[var(--zui-marquee-green-bg,#16a34a14)] dark:bg-[var(--zui-marquee-green-bg-dark,#22c55e24)] text-[color:var(--zui-marquee-green-fg,#0f172a)] dark:text-[color:var(--zui-marquee-green-fg-dark,#f8fafc)]",
+  lime: "border border-[color:var(--zui-marquee-lime-border,#65a30d)] dark:border-[color:var(--zui-marquee-lime-border-dark,#a3e635)] bg-[var(--zui-marquee-lime-bg,#65a30d14)] dark:bg-[var(--zui-marquee-lime-bg-dark,#a3e63524)] text-[color:var(--zui-marquee-lime-fg,#0f172a)] dark:text-[color:var(--zui-marquee-lime-fg-dark,#f8fafc)]",
+  mint: "border border-[color:var(--zui-marquee-mint-border,#10b981)] dark:border-[color:var(--zui-marquee-mint-border-dark,#6ee7b7)] bg-[var(--zui-marquee-mint-bg,#10b98114)] dark:bg-[var(--zui-marquee-mint-bg-dark,#6ee7b724)] text-[color:var(--zui-marquee-mint-fg,#0f172a)] dark:text-[color:var(--zui-marquee-mint-fg-dark,#f8fafc)]",
+  ocean: "border border-[color:var(--zui-marquee-ocean-border,#0284c7)] dark:border-[color:var(--zui-marquee-ocean-border-dark,#38bdf8)] bg-[var(--zui-marquee-ocean-bg,#0284c714)] dark:bg-[var(--zui-marquee-ocean-bg-dark,#38bdf824)] text-[color:var(--zui-marquee-ocean-fg,#0f172a)] dark:text-[color:var(--zui-marquee-ocean-fg-dark,#f8fafc)]",
+  sapphire: "border border-[color:var(--zui-marquee-sapphire-border,#1d4ed8)] dark:border-[color:var(--zui-marquee-sapphire-border-dark,#60a5fa)] bg-[var(--zui-marquee-sapphire-bg,#1d4ed814)] dark:bg-[var(--zui-marquee-sapphire-bg-dark,#60a5fa24)] text-[color:var(--zui-marquee-sapphire-fg,#0f172a)] dark:text-[color:var(--zui-marquee-sapphire-fg-dark,#f8fafc)]",
+  lavender: "border border-[color:var(--zui-marquee-lavender-border,#8b5cf6)] dark:border-[color:var(--zui-marquee-lavender-border-dark,#a78bfa)] bg-[var(--zui-marquee-lavender-bg,#8b5cf614)] dark:bg-[var(--zui-marquee-lavender-bg-dark,#a78bfa24)] text-[color:var(--zui-marquee-lavender-fg,#0f172a)] dark:text-[color:var(--zui-marquee-lavender-fg-dark,#f8fafc)]",
+  ruby: "border border-[color:var(--zui-marquee-ruby-border,#be123c)] dark:border-[color:var(--zui-marquee-ruby-border-dark,#fb7185)] bg-[var(--zui-marquee-ruby-bg,#be123c14)] dark:bg-[var(--zui-marquee-ruby-bg-dark,#fb718524)] text-[color:var(--zui-marquee-ruby-fg,#0f172a)] dark:text-[color:var(--zui-marquee-ruby-fg-dark,#f8fafc)]",
+  red: "border border-[color:var(--zui-marquee-red-border,#dc2626)] dark:border-[color:var(--zui-marquee-red-border-dark,#ef4444)] bg-[var(--zui-marquee-red-bg,#dc262614)] dark:bg-[var(--zui-marquee-red-bg-dark,#ef444424)] text-[color:var(--zui-marquee-red-fg,#0f172a)] dark:text-[color:var(--zui-marquee-red-fg-dark,#f8fafc)]",
+  slate: "border border-[color:var(--zui-marquee-slate-border,#475569)] dark:border-[color:var(--zui-marquee-slate-border-dark,#64748b)] bg-[var(--zui-marquee-slate-bg,#47556914)] dark:bg-[var(--zui-marquee-slate-bg-dark,#64748b24)] text-[color:var(--zui-marquee-slate-fg,#0f172a)] dark:text-[color:var(--zui-marquee-slate-fg-dark,#f8fafc)]",
+  zinc: "border border-[color:var(--zui-marquee-zinc-border,#52525b)] dark:border-[color:var(--zui-marquee-zinc-border-dark,#71717a)] bg-[var(--zui-marquee-zinc-bg,#52525b14)] dark:bg-[var(--zui-marquee-zinc-bg-dark,#71717a24)] text-[color:var(--zui-marquee-zinc-fg,#0f172a)] dark:text-[color:var(--zui-marquee-zinc-fg-dark,#f8fafc)]",
+  stone: "border border-[color:var(--zui-marquee-stone-border,#57534e)] dark:border-[color:var(--zui-marquee-stone-border-dark,#78716c)] bg-[var(--zui-marquee-stone-bg,#57534e14)] dark:bg-[var(--zui-marquee-stone-bg-dark,#78716c24)] text-[color:var(--zui-marquee-stone-fg,#0f172a)] dark:text-[color:var(--zui-marquee-stone-fg-dark,#f8fafc)]",
+  royal: "border border-[color:var(--zui-marquee-royal-border,#4338ca)] dark:border-[color:var(--zui-marquee-royal-border-dark,#818cf8)] bg-[var(--zui-marquee-royal-bg,#4338ca14)] dark:bg-[var(--zui-marquee-royal-bg-dark,#818cf824)] text-[color:var(--zui-marquee-royal-fg,#0f172a)] dark:text-[color:var(--zui-marquee-royal-fg-dark,#f8fafc)]",
+  electric: "border border-[color:var(--zui-marquee-electric-border,#0ea5e9)] dark:border-[color:var(--zui-marquee-electric-border-dark,#38bdf8)] bg-[var(--zui-marquee-electric-bg,#0ea5e914)] dark:bg-[var(--zui-marquee-electric-bg-dark,#38bdf824)] text-[color:var(--zui-marquee-electric-fg,#0f172a)] dark:text-[color:var(--zui-marquee-electric-fg-dark,#f8fafc)]",
+  forest: "border border-[color:var(--zui-marquee-forest-border,#166534)] dark:border-[color:var(--zui-marquee-forest-border-dark,#4ade80)] bg-[var(--zui-marquee-forest-bg,#16653414)] dark:bg-[var(--zui-marquee-forest-bg-dark,#4ade8024)] text-[color:var(--zui-marquee-forest-fg,#0f172a)] dark:text-[color:var(--zui-marquee-forest-fg-dark,#f8fafc)]",
+  sunset: "border border-[color:var(--zui-marquee-sunset-border,#ea580c)] dark:border-[color:var(--zui-marquee-sunset-border-dark,#fb923c)] bg-[var(--zui-marquee-sunset-bg,#ea580c14)] dark:bg-[var(--zui-marquee-sunset-bg-dark,#fb923c24)] text-[color:var(--zui-marquee-sunset-fg,#0f172a)] dark:text-[color:var(--zui-marquee-sunset-fg-dark,#f8fafc)]",
+  magenta: "border border-[color:var(--zui-marquee-magenta-border,#c026d3)] dark:border-[color:var(--zui-marquee-magenta-border-dark,#e879f9)] bg-[var(--zui-marquee-magenta-bg,#c026d314)] dark:bg-[var(--zui-marquee-magenta-bg-dark,#e879f924)] text-[color:var(--zui-marquee-magenta-fg,#0f172a)] dark:text-[color:var(--zui-marquee-magenta-fg-dark,#f8fafc)]",
+  crimson: "border border-[color:var(--zui-marquee-crimson-border,#b91c1c)] dark:border-[color:var(--zui-marquee-crimson-border-dark,#f87171)] bg-[var(--zui-marquee-crimson-bg,#b91c1c14)] dark:bg-[var(--zui-marquee-crimson-bg-dark,#f8717124)] text-[color:var(--zui-marquee-crimson-fg,#0f172a)] dark:text-[color:var(--zui-marquee-crimson-fg-dark,#f8fafc)]",
+  aqua: "border border-[color:var(--zui-marquee-aqua-border,#0f766e)] dark:border-[color:var(--zui-marquee-aqua-border-dark,#2dd4bf)] bg-[var(--zui-marquee-aqua-bg,#0f766e14)] dark:bg-[var(--zui-marquee-aqua-bg-dark,#2dd4bf24)] text-[color:var(--zui-marquee-aqua-fg,#0f172a)] dark:text-[color:var(--zui-marquee-aqua-fg-dark,#f8fafc)]",
+  plum: "border border-[color:var(--zui-marquee-plum-border,#7e22ce)] dark:border-[color:var(--zui-marquee-plum-border-dark,#c084fc)] bg-[var(--zui-marquee-plum-bg,#7e22ce14)] dark:bg-[var(--zui-marquee-plum-bg-dark,#c084fc24)] text-[color:var(--zui-marquee-plum-fg,#0f172a)] dark:text-[color:var(--zui-marquee-plum-fg-dark,#f8fafc)]"
 };
 var zuiMarqueeOrientations = {
   horizontal: "w-full flex-row",

package/dist/ui/marquee.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/design-system/marquee.ts","../../src/ui/marquee/variants.ts","../../src/ui/marquee/marquee.tsx"],"names":["cva","useRef","useState","useMemo","Children","useCallback","cn","jsx","useIsomorphicLayoutEffect","jsxs"],"mappings":"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","file":"marquee.js","sourcesContent":["export const zuiMarqueeBase =\n  \"group/marquee relative isolate flex min-w-0 overflow-hidden rounded-xl border border-transparent bg-[var(--zui-marquee-bg,transparent)] text-[color:var(--zui-marquee-fg,inherit)] [--zui-marquee-gap:1rem]\";\n\nexport const zuiMarqueeAppearances = {\n  default:\n    \"[--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:[--zui-marquee-fg:#ffffff]\",\n  outline:\n    \"border-[color:var(--zui-marquee-outline-border,oklch(86.9%_0.022_252.894))] [--zui-marquee-bg:#ffffff] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-outline-border-dark,oklch(37.2%_0.044_257.287))] dark:[--zui-marquee-bg:oklch(20.8%_0.042_265.755)] dark:[--zui-marquee-fg:#ffffff]\",\n  ghost:\n    \"[--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(27.9%_0.041_260.031)] dark:[--zui-marquee-fg:oklch(96.8%_0.007_247.896)]\",\n  card: \"border-[color:var(--zui-marquee-card-border,oklch(92.9%_0.013_255.508))] bg-[var(--zui-marquee-card-bg,#ffffff)] shadow-sm shadow-slate-950/5 [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-card-border-dark,oklch(37.2%_0.044_257.287))] dark:bg-[var(--zui-marquee-card-bg-dark,oklch(20.8%_0.042_265.755_/_0.9))] dark:shadow-black/20 dark:[--zui-marquee-fg:#ffffff]\",\n  separated:\n    \"border-y border-x-0 rounded-none border-[color:var(--zui-marquee-separated-border,oklch(86.9%_0.022_252.894))] [--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-separated-border-dark,oklch(37.2%_0.044_257.287))] dark:[--zui-marquee-fg:#ffffff]\",\n  sky: \"border-[color:var(--zui-marquee-sky-border,oklch(62.3%_0.214_259.815_/_0.28))] [--zui-marquee-bg:oklch(97.7%_0.013_236.62)] [--zui-marquee-fg:oklch(39.1%_0.09_240.876)] dark:border-[color:var(--zui-marquee-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.3))] dark:[--zui-marquee-bg:oklch(39.1%_0.09_240.876_/_0.28)] dark:[--zui-marquee-fg:oklch(95.1%_0.026_236.824)]\",\n  rose: \"border-[color:var(--zui-marquee-rose-border,oklch(58.6%_0.253_17.585_/_0.24))] [--zui-marquee-bg:oklch(96.9%_0.015_12.422)] [--zui-marquee-fg:oklch(41%_0.159_10.272)] dark:border-[color:var(--zui-marquee-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.3))] dark:[--zui-marquee-bg:oklch(41%_0.159_10.272_/_0.28)] dark:[--zui-marquee-fg:oklch(94.1%_0.03_12.58)]\",\n  purple:\n    \"border-[color:var(--zui-marquee-purple-border,oklch(62.7%_0.265_303.9_/_0.24))] [--zui-marquee-bg:oklch(97.7%_0.014_308.299)] [--zui-marquee-fg:oklch(38.1%_0.176_304.987)] dark:border-[color:var(--zui-marquee-purple-border-dark,oklch(71.4%_0.203_305.504_/_0.3))] dark:[--zui-marquee-bg:oklch(38.1%_0.176_304.987_/_0.28)] dark:[--zui-marquee-fg:oklch(94.6%_0.033_307.174)]\",\n  pink: \"border-[color:var(--zui-marquee-pink-border,oklch(65.6%_0.241_354.308_/_0.24))] [--zui-marquee-bg:oklch(97.1%_0.014_343.198)] [--zui-marquee-fg:oklch(40.8%_0.153_2.432)] dark:border-[color:var(--zui-marquee-pink-border-dark,oklch(71.8%_0.202_349.761_/_0.3))] dark:[--zui-marquee-bg:oklch(40.8%_0.153_2.432_/_0.28)] dark:[--zui-marquee-fg:oklch(94.8%_0.028_342.258)]\",\n  orange:\n    \"border-[color:var(--zui-marquee-orange-border,oklch(70.5%_0.213_47.604_/_0.26))] [--zui-marquee-bg:oklch(98%_0.016_73.684)] [--zui-marquee-fg:oklch(40.8%_0.123_38.172)] dark:border-[color:var(--zui-marquee-orange-border-dark,oklch(75%_0.183_55.934_/_0.32))] dark:[--zui-marquee-bg:oklch(40.8%_0.123_38.172_/_0.28)] dark:[--zui-marquee-fg:oklch(95.4%_0.038_75.164)]\",\n  yellow:\n    \"border-[color:var(--zui-marquee-yellow-border,oklch(79.5%_0.184_86.047_/_0.3))] [--zui-marquee-bg:oklch(98.7%_0.026_102.212)] [--zui-marquee-fg:oklch(42.1%_0.095_57.708)] dark:border-[color:var(--zui-marquee-yellow-border-dark,oklch(85.2%_0.199_91.936_/_0.32))] dark:[--zui-marquee-bg:oklch(42.1%_0.095_57.708_/_0.28)] dark:[--zui-marquee-fg:oklch(97.3%_0.071_103.193)]\",\n  teal: \"border-[color:var(--zui-marquee-teal-border,oklch(70.4%_0.14_182.503_/_0.28))] [--zui-marquee-bg:oklch(98.4%_0.014_180.72)] [--zui-marquee-fg:oklch(38.6%_0.063_188.416)] dark:border-[color:var(--zui-marquee-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.32))] dark:[--zui-marquee-bg:oklch(38.6%_0.063_188.416_/_0.28)] dark:[--zui-marquee-fg:oklch(95.3%_0.051_180.801)]\",\n  indigo:\n    \"border-[color:var(--zui-marquee-indigo-border,oklch(58.5%_0.233_277.117_/_0.24))] [--zui-marquee-bg:oklch(96.2%_0.018_272.314)] [--zui-marquee-fg:oklch(35.9%_0.144_278.697)] dark:border-[color:var(--zui-marquee-indigo-border-dark,oklch(67.3%_0.182_276.935_/_0.32))] dark:[--zui-marquee-bg:oklch(35.9%_0.144_278.697_/_0.28)] dark:[--zui-marquee-fg:oklch(93%_0.034_272.788)]\",\n  emerald:\n    \"border-[color:var(--zui-marquee-emerald-border,oklch(69.6%_0.17_162.48_/_0.28))] [--zui-marquee-bg:oklch(97.9%_0.021_166.113)] [--zui-marquee-fg:oklch(37.8%_0.077_168.94)] dark:border-[color:var(--zui-marquee-emerald-border-dark,oklch(76.5%_0.177_163.223_/_0.32))] dark:[--zui-marquee-bg:oklch(37.8%_0.077_168.94_/_0.28)] dark:[--zui-marquee-fg:oklch(95%_0.052_163.051)]\",\n  \"gradient-blue\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-blue-from,oklch(62.3%_0.214_259.815))] to-[var(--zui-marquee-gradient-blue-to,oklch(54.6%_0.245_262.881))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-green\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-green-from,oklch(72.3%_0.219_149.579))] to-[var(--zui-marquee-gradient-green-to,oklch(62.7%_0.194_149.214))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-red\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-red-from,oklch(63.7%_0.237_25.331))] to-[var(--zui-marquee-gradient-red-to,oklch(57.7%_0.245_27.325))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-yellow\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-yellow-from,oklch(85.2%_0.199_91.936))] to-[var(--zui-marquee-gradient-yellow-to,oklch(79.5%_0.184_86.047))] [--zui-marquee-fg:oklch(27.9%_0.077_45.635)]\",\n  \"gradient-purple\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-purple-from,oklch(71.4%_0.203_305.504))] to-[var(--zui-marquee-gradient-purple-to,oklch(62.7%_0.265_303.9))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-teal\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-teal-from,oklch(77.7%_0.152_181.912))] to-[var(--zui-marquee-gradient-teal-to,oklch(70.4%_0.14_182.503))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-indigo\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-indigo-from,oklch(67.3%_0.182_276.935))] to-[var(--zui-marquee-gradient-indigo-to,oklch(58.5%_0.233_277.117))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-pink\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-pink-from,oklch(71.8%_0.202_349.761))] to-[var(--zui-marquee-gradient-pink-to,oklch(65.6%_0.241_354.308))] [--zui-marquee-fg:#ffffff]\",\n  \"gradient-orange\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-orange-from,oklch(75%_0.183_55.934))] to-[var(--zui-marquee-gradient-orange-to,oklch(70.5%_0.213_47.604))] [--zui-marquee-fg:#ffffff]\",\n} as const;\n\nexport const zuiMarqueeOrientations = {\n  horizontal: \"w-full flex-row\",\n  vertical: \"h-64 flex-col\",\n} as const;\n\nexport const zuiMarqueeSizes = {\n  sm: \"p-2 text-xs\",\n  md: \"p-3 text-sm\",\n  lg: \"p-4 text-base\",\n} as const;\n\nexport const zuiMarqueeFade = {\n  false: \"\",\n  true: \"[mask-image:linear-gradient(to_right,transparent,black_12%,black_88%,transparent)] data-[orientation=vertical]:[mask-image:linear-gradient(to_bottom,transparent,black_12%,black_88%,transparent)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiMarqueeAppearances,\n  zuiMarqueeBase,\n  zuiMarqueeFade,\n  zuiMarqueeOrientations,\n  zuiMarqueeSizes,\n} from \"../../design-system/marquee\";\n\nexport const marqueeVariants = cva(zuiMarqueeBase, {\n  variants: {\n    appearance: zuiMarqueeAppearances,\n    fade: zuiMarqueeFade,\n    orientation: zuiMarqueeOrientations,\n    size: zuiMarqueeSizes,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    fade: true,\n    orientation: \"horizontal\",\n    size: \"md\",\n  },\n});\n","\"use client\";\n\nimport { Children, useCallback, useMemo, useRef, useState } from \"react\";\nimport type { CSSProperties, Ref } from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"../../hooks/useIsomorphicLayoutEffect\";\nimport { cn } from \"../../lib/utils\";\n\nimport type { MarqueeProps } from \"./types\";\nimport { marqueeVariants } from \"./variants\";\n\nconst marqueeKeyframes = `@keyframes zui-marquee-x{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - var(--zui-marquee-gap)/2),0,0)}}@keyframes zui-marquee-y{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(-50% - var(--zui-marquee-gap)/2),0)}}`;\n\nfunction toCssLength(value: number | string | undefined) {\n  if (value === undefined) {\n    return undefined;\n  }\n  return typeof value === \"number\" ? `${value}px` : value;\n}\n\nfunction assignRef<TElement>(\n  ref: Ref<TElement> | undefined,\n  value: TElement | null,\n) {\n  if (typeof ref === \"function\") {\n    ref(value);\n  } else if (ref) {\n    (ref as { current: TElement | null }).current = value;\n  }\n}\n\nexport function Marquee(props: MarqueeProps) {\n  const {\n    appearance,\n    children,\n    className,\n    direction,\n    fade,\n    gap,\n    itemClassName,\n    orientation,\n    pauseOnHover = false,\n    ref,\n    size,\n    speed = 30,\n    style,\n    trackClassName,\n    ...rest\n  } = props;\n\n  const resolvedOrientation =\n    orientation ??\n    (direction === \"up\" || direction === \"down\" ? \"vertical\" : \"horizontal\");\n  const resolvedDirection =\n    direction ?? (resolvedOrientation === \"vertical\" ? \"up\" : \"left\");\n  const isReverse =\n    resolvedDirection === \"right\" || resolvedDirection === \"down\";\n  const animationName =\n    resolvedOrientation === \"vertical\" ? \"zui-marquee-y\" : \"zui-marquee-x\";\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const measureRef = useRef<HTMLDivElement | null>(null);\n  const [copyCount, setCopyCount] = useState(1);\n  const childArray = useMemo(() => Children.toArray(children), [children]);\n  const setRootRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      rootRef.current = node;\n      assignRef(ref, node);\n    },\n    [ref],\n  );\n  const marqueeStyle = {\n    ...(gap !== undefined ? { \"--zui-marquee-gap\": toCssLength(gap) } : null),\n    ...style,\n  } as CSSProperties;\n  const groupClassName = cn(\n    \"flex shrink-0 items-center justify-around gap-(--zui-marquee-gap)\",\n    resolvedOrientation === \"vertical\" ? \"flex-col\" : \"flex-row\",\n    itemClassName,\n  );\n  const fillerChildren = Array.from(\n    { length: Math.max(0, copyCount - 1) },\n    (_, index) => (\n      <div key={index} aria-hidden=\"true\" inert className=\"contents\">\n        {childArray}\n      </div>\n    ),\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    const updateCopyCount = () => {\n      const root = rootRef.current;\n      const measure = measureRef.current;\n\n      if (!root || !measure) {\n        return;\n      }\n\n      const rootSize =\n        resolvedOrientation === \"vertical\"\n          ? root.offsetHeight\n          : root.offsetWidth;\n      const contentSize =\n        resolvedOrientation === \"vertical\"\n          ? measure.scrollHeight\n          : measure.scrollWidth;\n\n      if (!rootSize || !contentSize) {\n        setCopyCount(1);\n        return;\n      }\n\n      setCopyCount(Math.max(1, Math.ceil(rootSize / contentSize)));\n    };\n\n    updateCopyCount();\n\n    if (typeof ResizeObserver === \"undefined\") {\n      return;\n    }\n\n    const observer = new ResizeObserver(updateCopyCount);\n    if (rootRef.current) {\n      observer.observe(rootRef.current);\n    }\n    if (measureRef.current) {\n      observer.observe(measureRef.current);\n    }\n\n    return () => observer.disconnect();\n  }, [childArray, gap, resolvedOrientation]);\n\n  return (\n    <div\n      ref={setRootRef}\n      data-direction={resolvedDirection}\n      data-orientation={resolvedOrientation}\n      data-slot=\"marquee\"\n      className={cn(\n        marqueeVariants({\n          appearance,\n          fade,\n          orientation: resolvedOrientation,\n          size,\n        }),\n        className,\n      )}\n      style={marqueeStyle}\n      {...rest}\n    >\n      <style>{marqueeKeyframes}</style>\n      <div\n        aria-hidden=\"true\"\n        data-slot=\"marquee-measure\"\n        ref={measureRef}\n        className={cn(\n          \"pointer-events-none invisible absolute -z-10\",\n          groupClassName,\n        )}\n      >\n        {childArray}\n      </div>\n      <div\n        data-slot=\"marquee-track\"\n        className={cn(\n          \"flex shrink-0 gap-(--zui-marquee-gap) will-change-transform [animation-iteration-count:infinite] [animation-timing-function:linear] motion-reduce:[animation-play-state:paused]\",\n          resolvedOrientation === \"vertical\" ? \"flex-col\" : \"w-max flex-row\",\n          pauseOnHover && \"group-hover/marquee:[animation-play-state:paused]\",\n          isReverse && \"[animation-direction:reverse]\",\n          trackClassName,\n        )}\n        style={\n          {\n            animationDuration: `${speed}s`,\n            animationName,\n          } as CSSProperties\n        }\n      >\n        <div data-slot=\"marquee-item-group\" className={groupClassName}>\n          {childArray}\n          {fillerChildren}\n        </div>\n        <div\n          aria-hidden=\"true\"\n          inert\n          data-slot=\"marquee-item-group\"\n          className={groupClassName}\n        >\n          {childArray}\n          {fillerChildren}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nMarquee.displayName = \"Marquee\";\n"]}
+{"version":3,"sources":["../../src/design-system/marquee.ts","../../src/ui/marquee/variants.ts","../../src/ui/marquee/marquee.tsx"],"names":["cva","useRef","useState","useMemo","Children","useCallback","cn","jsx","useIsomorphicLayoutEffect","jsxs"],"mappings":";;;;;;;;;AAAO,IAAM,cAAA,GACX,6MAAA;AAEK,IAAM,qBAAA,GAAwB;AAAA,EACnC,OAAA,EACE,8GAAA;AAAA,EACF,OAAA,EACE,+TAAA;AAAA,EACF,KAAA,EACE,iIAAA;AAAA,EACF,IAAA,EAAM,gZAAA;AAAA,EACN,SAAA,EACE,qTAAA;AAAA,EACF,GAAA,EAAK,8WAAA;AAAA,EACL,IAAA,EAAM,uWAAA;AAAA,EACN,MAAA,EACE,qXAAA;AAAA,EACF,IAAA,EAAM,+WAAA;AAAA,EACN,MAAA,EACE,8WAAA;AAAA,EACF,MAAA,EACE,mXAAA;AAAA,EACF,IAAA,EAAM,kXAAA;AAAA,EACN,MAAA,EACE,sXAAA;AAAA,EACF,OAAA,EACE,oXAAA;AAAA,EACF,eAAA,EACE,0YAAA;AAAA,EACF,gBAAA,EACE,8YAAA;AAAA,EACF,cAAA,EACE,kYAAA;AAAA,EACF,iBAAA,EACE,gaAAA;AAAA,EACF,iBAAA,EACE,gZAAA;AAAA,EACF,eAAA,EACE,yYAAA;AAAA,EACF,iBAAA,EACE,kZAAA;AAAA,EACF,eAAA,EACE,sYAAA;AAAA,EACF,iBAAA,EACE,0YAAA;AAAA,EACF,IAAA,EAAM,sUAAA;AAAA,EACN,IAAA,EAAM,sUAAA;AAAA,EACN,KAAA,EACE,4UAAA;AAAA,EACF,IAAA,EAAM,sUAAA;AAAA,EACN,IAAA,EAAM,sUAAA;AAAA,EACN,KAAA,EACE,4UAAA;AAAA,EACF,QAAA,EACE,8VAAA;AAAA,EACF,QAAA,EACE,8VAAA;AAAA,EACF,IAAA,EAAM,sUAAA;AAAA,EACN,GAAA,EAAK,gUAAA;AAAA,EACL,KAAA,EACE,4UAAA;AAAA,EACF,IAAA,EAAM,sUAAA;AAAA,EACN,KAAA,EACE,4UAAA;AAAA,EACF,KAAA,EACE,4UAAA;AAAA,EACF,QAAA,EACE,8VAAA;AAAA,EACF,MAAA,EACE,kVAAA;AAAA,EACF,MAAA,EACE,kVAAA;AAAA,EACF,OAAA,EACE,wVAAA;AAAA,EACF,OAAA,EACE,wVAAA;AAAA,EACF,IAAA,EAAM,sUAAA;AAAA,EACN,IAAA,EAAM;AACR,CAAA;AAEO,IAAM,sBAAA,GAAyB;AAAA,EACpC,UAAA,EAAY,iBAAA;AAAA,EACZ,QAAA,EAAU;AACZ,CAAA;AAEO,IAAM,eAAA,GAAkB;AAAA,EAC7B,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEO,IAAM,cAAA,GAAiB;AAAA,EAC5B,KAAA,EAAO,EAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;;;ACpFO,IAAM,eAAA,GAAkBA,2BAAI,cAAA,EAAgB;AAAA,EACjD,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,qBAAA;AAAA,IACZ,IAAA,EAAM,cAAA;AAAA,IACN,WAAA,EAAa,sBAAA;AAAA,IACb,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM,IAAA;AAAA,IACN,WAAA,EAAa,YAAA;AAAA,IACb,IAAA,EAAM;AAAA;AAEV,CAAC;ACZD,IAAM,gBAAA,GAAmB,CAAA,gQAAA,CAAA;AAEzB,SAAS,YAAY,KAAA,EAAoC;AACvD,EAAA,IAAI,UAAU,MAAA,EAAW;AACvB,IAAA,OAAO,MAAA;AAAA,EACT;AACA,EAAA,OAAO,OAAO,KAAA,KAAU,QAAA,GAAW,CAAA,EAAG,KAAK,CAAA,EAAA,CAAA,GAAO,KAAA;AACpD;AAEA,SAAS,SAAA,CACP,KACA,KAAA,EACA;AACA,EAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,IAAA,GAAA,CAAI,KAAK,CAAA;AAAA,EACX,WAAW,GAAA,EAAK;AACd,IAAC,IAAqC,OAAA,GAAU,KAAA;AAAA,EAClD;AACF;AAEO,SAAS,QAAQ,KAAA,EAAqB;AAC3C,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAA;AAAA,IACA,aAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA,GAAe,KAAA;AAAA,IACf,GAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA,GAAQ,EAAA;AAAA,IACR,KAAA;AAAA,IACA,cAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,sBACJ,WAAA,KACC,SAAA,KAAc,IAAA,IAAQ,SAAA,KAAc,SAAS,UAAA,GAAa,YAAA,CAAA;AAC7D,EAAA,MAAM,iBAAA,GACJ,SAAA,KAAc,mBAAA,KAAwB,UAAA,GAAa,IAAA,GAAO,MAAA,CAAA;AAC5D,EAAA,MAAM,SAAA,GACJ,iBAAA,KAAsB,OAAA,IAAW,iBAAA,KAAsB,MAAA;AACzD,EAAA,MAAM,aAAA,GACJ,mBAAA,KAAwB,UAAA,GAAa,eAAA,GAAkB,eAAA;AACzD,EAAA,MAAM,OAAA,GAAUC,aAA8B,IAAI,CAAA;AAClD,EAAA,MAAM,UAAA,GAAaA,aAA8B,IAAI,CAAA;AACrD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,eAAS,CAAC,CAAA;AAC5C,EAAA,MAAM,UAAA,GAAaC,cAAQ,MAAMC,cAAA,CAAS,QAAQ,QAAQ,CAAA,EAAG,CAAC,QAAQ,CAAC,CAAA;AACvE,EAAA,MAAM,UAAA,GAAaC,iBAAA;AAAA,IACjB,CAAC,IAAA,KAAgC;AAC/B,MAAA,OAAA,CAAQ,OAAA,GAAU,IAAA;AAClB,MAAA,SAAA,CAAU,KAAK,IAAI,CAAA;AAAA,IACrB,CAAA;AAAA,IACA,CAAC,GAAG;AAAA,GACN;AACA,EAAA,MAAM,YAAA,GAAe;AAAA,IACnB,GAAI,QAAQ,MAAA,GAAY,EAAE,qBAAqB,WAAA,CAAY,GAAG,GAAE,GAAI,IAAA;AAAA,IACpE,GAAG;AAAA,GACL;AACA,EAAA,MAAM,cAAA,GAAiBC,mBAAA;AAAA,IACrB,mEAAA;AAAA,IACA,mBAAA,KAAwB,aAAa,UAAA,GAAa,UAAA;AAAA,IAClD;AAAA,GACF;AACA,EAAA,MAAM,iBAAiB,KAAA,CAAM,IAAA;AAAA,IAC3B,EAAE,MAAA,EAAQ,IAAA,CAAK,IAAI,CAAA,EAAG,SAAA,GAAY,CAAC,CAAA,EAAE;AAAA,IACrC,CAAC,CAAA,EAAG,KAAA,qBACFC,cAAA,CAAC,KAAA,EAAA,EAAgB,aAAA,EAAY,MAAA,EAAO,KAAA,EAAK,IAAA,EAAC,SAAA,EAAU,UAAA,EACjD,QAAA,EAAA,UAAA,EAAA,EADO,KAEV;AAAA,GAEJ;AAEA,EAAAC,0CAAA,CAA0B,MAAM;AAC9B,IAAA,MAAM,kBAAkB,MAAM;AAC5B,MAAA,MAAM,OAAO,OAAA,CAAQ,OAAA;AACrB,MAAA,MAAM,UAAU,UAAA,CAAW,OAAA;AAE3B,MAAA,IAAI,CAAC,IAAA,IAAQ,CAAC,OAAA,EAAS;AACrB,QAAA;AAAA,MACF;AAEA,MAAA,MAAM,QAAA,GACJ,mBAAA,KAAwB,UAAA,GACpB,IAAA,CAAK,eACL,IAAA,CAAK,WAAA;AACX,MAAA,MAAM,WAAA,GACJ,mBAAA,KAAwB,UAAA,GACpB,OAAA,CAAQ,eACR,OAAA,CAAQ,WAAA;AAEd,MAAA,IAAI,CAAC,QAAA,IAAY,CAAC,WAAA,EAAa;AAC7B,QAAA,YAAA,CAAa,CAAC,CAAA;AACd,QAAA;AAAA,MACF;AAEA,MAAA,YAAA,CAAa,IAAA,CAAK,IAAI,CAAA,EAAG,IAAA,CAAK,KAAK,QAAA,GAAW,WAAW,CAAC,CAAC,CAAA;AAAA,IAC7D,CAAA;AAEA,IAAA,eAAA,EAAgB;AAEhB,IAAA,IAAI,OAAO,mBAAmB,WAAA,EAAa;AACzC,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,QAAA,GAAW,IAAI,cAAA,CAAe,eAAe,CAAA;AACnD,IAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,MAAA,QAAA,CAAS,OAAA,CAAQ,QAAQ,OAAO,CAAA;AAAA,IAClC;AACA,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,QAAA,CAAS,OAAA,CAAQ,WAAW,OAAO,CAAA;AAAA,IACrC;AAEA,IAAA,OAAO,MAAM,SAAS,UAAA,EAAW;AAAA,EACnC,CAAA,EAAG,CAAC,UAAA,EAAY,GAAA,EAAK,mBAAmB,CAAC,CAAA;AAEzC,EAAA,uBACEC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,UAAA;AAAA,MACL,gBAAA,EAAgB,iBAAA;AAAA,MAChB,kBAAA,EAAkB,mBAAA;AAAA,MAClB,WAAA,EAAU,SAAA;AAAA,MACV,SAAA,EAAWH,mBAAA;AAAA,QACT,eAAA,CAAgB;AAAA,UACd,UAAA;AAAA,UACA,IAAA;AAAA,UACA,WAAA,EAAa,mBAAA;AAAA,UACb;AAAA,SACD,CAAA;AAAA,QACD;AAAA,OACF;AAAA,MACA,KAAA,EAAO,YAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,WAAO,QAAA,EAAA,gBAAA,EAAiB,CAAA;AAAA,wBACzBA,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAY,MAAA;AAAA,YACZ,WAAA,EAAU,iBAAA;AAAA,YACV,GAAA,EAAK,UAAA;AAAA,YACL,SAAA,EAAWD,mBAAA;AAAA,cACT,8CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACAG,eAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,WAAA,EAAU,eAAA;AAAA,YACV,SAAA,EAAWH,mBAAA;AAAA,cACT,iLAAA;AAAA,cACA,mBAAA,KAAwB,aAAa,UAAA,GAAa,gBAAA;AAAA,cAClD,YAAA,IAAgB,mDAAA;AAAA,cAChB,SAAA,IAAa,+BAAA;AAAA,cACb;AAAA,aACF;AAAA,YACA,KAAA,EACE;AAAA,cACE,iBAAA,EAAmB,GAAG,KAAK,CAAA,CAAA,CAAA;AAAA,cAC3B;AAAA,aACF;AAAA,YAGF,QAAA,EAAA;AAAA,8BAAAG,eAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,oBAAA,EAAqB,SAAA,EAAW,cAAA,EAC5C,QAAA,EAAA;AAAA,gBAAA,UAAA;AAAA,gBACA;AAAA,eAAA,EACH,CAAA;AAAA,8BACAA,eAAA;AAAA,gBAAC,KAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAY,MAAA;AAAA,kBACZ,KAAA,EAAK,IAAA;AAAA,kBACL,WAAA,EAAU,oBAAA;AAAA,kBACV,SAAA,EAAW,cAAA;AAAA,kBAEV,QAAA,EAAA;AAAA,oBAAA,UAAA;AAAA,oBACA;AAAA;AAAA;AAAA;AACH;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"marquee.js","sourcesContent":["export const zuiMarqueeBase =\n  \"group/marquee relative isolate flex min-w-0 overflow-hidden rounded-xl border border-transparent bg-[var(--zui-marquee-bg,transparent)] text-[color:var(--zui-marquee-fg,inherit)] [--zui-marquee-gap:1rem]\";\n\nexport const zuiMarqueeAppearances = {\n  default:\n    \"[--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:[--zui-marquee-fg:#ffffff]\",\n  outline:\n    \"border-[color:var(--zui-marquee-outline-border,oklch(86.9%_0.022_252.894))] [--zui-marquee-bg:#ffffff] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-outline-border-dark,oklch(37.2%_0.044_257.287))] dark:[--zui-marquee-bg:oklch(20.8%_0.042_265.755)] dark:[--zui-marquee-fg:#ffffff]\",\n  ghost:\n    \"[--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(27.9%_0.041_260.031)] dark:[--zui-marquee-fg:oklch(96.8%_0.007_247.896)]\",\n  card: \"border-[color:var(--zui-marquee-card-border,oklch(92.9%_0.013_255.508))] bg-[var(--zui-marquee-card-bg,#ffffff)] shadow-sm shadow-slate-950/5 [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-card-border-dark,oklch(37.2%_0.044_257.287))] dark:bg-[var(--zui-marquee-card-bg-dark,oklch(20.8%_0.042_265.755_/_0.9))] dark:shadow-black/20 dark:[--zui-marquee-fg:#ffffff]\",\n  separated:\n    \"border-y border-x-0 rounded-none border-[color:var(--zui-marquee-separated-border,oklch(86.9%_0.022_252.894))] [--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:border-[color:var(--zui-marquee-separated-border-dark,oklch(37.2%_0.044_257.287))] dark:[--zui-marquee-fg:#ffffff]\",\n  sky: \"border-[color:var(--zui-marquee-sky-border,oklch(62.3%_0.214_259.815_/_0.28))] [--zui-marquee-bg:oklch(97.7%_0.013_236.62)] [--zui-marquee-fg:oklch(39.1%_0.09_240.876)] dark:border-[color:var(--zui-marquee-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.3))] dark:[--zui-marquee-bg:oklch(39.1%_0.09_240.876_/_0.28)] dark:[--zui-marquee-fg:oklch(95.1%_0.026_236.824)]\",\n  rose: \"border-[color:var(--zui-marquee-rose-border,oklch(58.6%_0.253_17.585_/_0.24))] [--zui-marquee-bg:oklch(96.9%_0.015_12.422)] [--zui-marquee-fg:oklch(41%_0.159_10.272)] dark:border-[color:var(--zui-marquee-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.3))] dark:[--zui-marquee-bg:oklch(41%_0.159_10.272_/_0.28)] dark:[--zui-marquee-fg:oklch(94.1%_0.03_12.58)]\",\n  purple:\n    \"border-[color:var(--zui-marquee-purple-border,oklch(62.7%_0.265_303.9_/_0.24))] [--zui-marquee-bg:oklch(97.7%_0.014_308.299)] [--zui-marquee-fg:oklch(38.1%_0.176_304.987)] dark:border-[color:var(--zui-marquee-purple-border-dark,oklch(71.4%_0.203_305.504_/_0.3))] dark:[--zui-marquee-bg:oklch(38.1%_0.176_304.987_/_0.28)] dark:[--zui-marquee-fg:oklch(94.6%_0.033_307.174)]\",\n  pink: \"border-[color:var(--zui-marquee-pink-border,oklch(65.6%_0.241_354.308_/_0.24))] [--zui-marquee-bg:oklch(97.1%_0.014_343.198)] [--zui-marquee-fg:oklch(40.8%_0.153_2.432)] dark:border-[color:var(--zui-marquee-pink-border-dark,oklch(71.8%_0.202_349.761_/_0.3))] dark:[--zui-marquee-bg:oklch(40.8%_0.153_2.432_/_0.28)] dark:[--zui-marquee-fg:oklch(94.8%_0.028_342.258)]\",\n  orange:\n    \"border-[color:var(--zui-marquee-orange-border,oklch(70.5%_0.213_47.604_/_0.26))] [--zui-marquee-bg:oklch(98%_0.016_73.684)] [--zui-marquee-fg:oklch(40.8%_0.123_38.172)] dark:border-[color:var(--zui-marquee-orange-border-dark,oklch(75%_0.183_55.934_/_0.32))] dark:[--zui-marquee-bg:oklch(40.8%_0.123_38.172_/_0.28)] dark:[--zui-marquee-fg:oklch(95.4%_0.038_75.164)]\",\n  yellow:\n    \"border-[color:var(--zui-marquee-yellow-border,oklch(79.5%_0.184_86.047_/_0.3))] [--zui-marquee-bg:oklch(98.7%_0.026_102.212)] [--zui-marquee-fg:oklch(42.1%_0.095_57.708)] dark:border-[color:var(--zui-marquee-yellow-border-dark,oklch(85.2%_0.199_91.936_/_0.32))] dark:[--zui-marquee-bg:oklch(42.1%_0.095_57.708_/_0.28)] dark:[--zui-marquee-fg:oklch(97.3%_0.071_103.193)]\",\n  teal: \"border-[color:var(--zui-marquee-teal-border,oklch(70.4%_0.14_182.503_/_0.28))] [--zui-marquee-bg:oklch(98.4%_0.014_180.72)] [--zui-marquee-fg:oklch(38.6%_0.063_188.416)] dark:border-[color:var(--zui-marquee-teal-border-dark,oklch(77.7%_0.152_181.912_/_0.32))] dark:[--zui-marquee-bg:oklch(38.6%_0.063_188.416_/_0.28)] dark:[--zui-marquee-fg:oklch(95.3%_0.051_180.801)]\",\n  indigo:\n    \"border-[color:var(--zui-marquee-indigo-border,oklch(58.5%_0.233_277.117_/_0.24))] [--zui-marquee-bg:oklch(96.2%_0.018_272.314)] [--zui-marquee-fg:oklch(35.9%_0.144_278.697)] dark:border-[color:var(--zui-marquee-indigo-border-dark,oklch(67.3%_0.182_276.935_/_0.32))] dark:[--zui-marquee-bg:oklch(35.9%_0.144_278.697_/_0.28)] dark:[--zui-marquee-fg:oklch(93%_0.034_272.788)]\",\n  emerald:\n    \"border-[color:var(--zui-marquee-emerald-border,oklch(69.6%_0.17_162.48_/_0.28))] [--zui-marquee-bg:oklch(97.9%_0.021_166.113)] [--zui-marquee-fg:oklch(37.8%_0.077_168.94)] dark:border-[color:var(--zui-marquee-emerald-border-dark,oklch(76.5%_0.177_163.223_/_0.32))] dark:[--zui-marquee-bg:oklch(37.8%_0.077_168.94_/_0.28)] dark:[--zui-marquee-fg:oklch(95%_0.052_163.051)]\",\n  \"gradient-blue\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-blue-from,oklch(62.3%_0.214_259.815))] dark:from-[var(--zui-marquee-gradient-blue-from-dark,oklch(42.4%_0.199_265.638))] to-[var(--zui-marquee-gradient-blue-to,oklch(54.6%_0.245_262.881))] dark:to-[var(--zui-marquee-gradient-blue-to-dark,oklch(37.9%_0.146_265.522))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-green\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-green-from,oklch(72.3%_0.219_149.579))] dark:from-[var(--zui-marquee-gradient-green-from-dark,oklch(44.8%_0.119_151.328))] to-[var(--zui-marquee-gradient-green-to,oklch(62.7%_0.194_149.214))] dark:to-[var(--zui-marquee-gradient-green-to-dark,oklch(39.3%_0.095_152.535))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-red\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-red-from,oklch(63.7%_0.237_25.331))] dark:from-[var(--zui-marquee-gradient-red-from-dark,oklch(44.4%_0.177_26.899))] to-[var(--zui-marquee-gradient-red-to,oklch(57.7%_0.245_27.325))] dark:to-[var(--zui-marquee-gradient-red-to-dark,oklch(39.6%_0.141_25.723))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-yellow\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-yellow-from,oklch(85.2%_0.199_91.936))] dark:from-[var(--zui-marquee-gradient-yellow-from-dark,oklch(47.6%_0.114_61.907))] to-[var(--zui-marquee-gradient-yellow-to,oklch(79.5%_0.184_86.047))] dark:to-[var(--zui-marquee-gradient-yellow-to-dark,oklch(42.1%_0.095_57.708))] [--zui-marquee-fg:oklch(27.9%_0.077_45.635)] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-purple\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-purple-from,oklch(71.4%_0.203_305.504))] dark:from-[var(--zui-marquee-gradient-purple-from-dark,oklch(43.8%_0.218_303.724))] to-[var(--zui-marquee-gradient-purple-to,oklch(62.7%_0.265_303.9))] dark:to-[var(--zui-marquee-gradient-purple-to-dark,oklch(38.1%_0.176_304.987))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-teal\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-teal-from,oklch(77.7%_0.152_181.912))] dark:from-[var(--zui-marquee-gradient-teal-from-dark,oklch(43.7%_0.078_188.216))] to-[var(--zui-marquee-gradient-teal-to,oklch(70.4%_0.14_182.503))] dark:to-[var(--zui-marquee-gradient-teal-to-dark,oklch(38.6%_0.063_188.416))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-indigo\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-indigo-from,oklch(67.3%_0.182_276.935))] dark:from-[var(--zui-marquee-gradient-indigo-from-dark,oklch(39.8%_0.195_277.366))] to-[var(--zui-marquee-gradient-indigo-to,oklch(58.5%_0.233_277.117))] dark:to-[var(--zui-marquee-gradient-indigo-to-dark,oklch(35.9%_0.144_278.697))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-pink\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-pink-from,oklch(71.8%_0.202_349.761))] dark:from-[var(--zui-marquee-gradient-pink-from-dark,oklch(45.9%_0.187_3.815))] to-[var(--zui-marquee-gradient-pink-to,oklch(65.6%_0.241_354.308))] dark:to-[var(--zui-marquee-gradient-pink-to-dark,oklch(40.8%_0.153_2.432))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  \"gradient-orange\":\n    \"border-transparent bg-linear-to-r from-[var(--zui-marquee-gradient-orange-from,oklch(75%_0.183_55.934))] dark:from-[var(--zui-marquee-gradient-orange-from-dark,oklch(47%_0.157_37.304))] to-[var(--zui-marquee-gradient-orange-to,oklch(70.5%_0.213_47.604))] dark:to-[var(--zui-marquee-gradient-orange-to-dark,oklch(40.8%_0.123_38.172))] [--zui-marquee-fg:#ffffff] dark:[--zui-marquee-fg:#ffffff]\",\n  blue: \"border border-[color:var(--zui-marquee-blue-border,#2563eb)] dark:border-[color:var(--zui-marquee-blue-border-dark,#3b82f6)] bg-[var(--zui-marquee-blue-bg,#2563eb14)] dark:bg-[var(--zui-marquee-blue-bg-dark,#3b82f624)] text-[color:var(--zui-marquee-blue-fg,#0f172a)] dark:text-[color:var(--zui-marquee-blue-fg-dark,#f8fafc)]\",\n  cyan: \"border border-[color:var(--zui-marquee-cyan-border,#0891b2)] dark:border-[color:var(--zui-marquee-cyan-border-dark,#22d3ee)] bg-[var(--zui-marquee-cyan-bg,#0891b214)] dark:bg-[var(--zui-marquee-cyan-bg-dark,#22d3ee24)] text-[color:var(--zui-marquee-cyan-fg,#0f172a)] dark:text-[color:var(--zui-marquee-cyan-fg-dark,#f8fafc)]\",\n  green:\n    \"border border-[color:var(--zui-marquee-green-border,#16a34a)] dark:border-[color:var(--zui-marquee-green-border-dark,#22c55e)] bg-[var(--zui-marquee-green-bg,#16a34a14)] dark:bg-[var(--zui-marquee-green-bg-dark,#22c55e24)] text-[color:var(--zui-marquee-green-fg,#0f172a)] dark:text-[color:var(--zui-marquee-green-fg-dark,#f8fafc)]\",\n  lime: \"border border-[color:var(--zui-marquee-lime-border,#65a30d)] dark:border-[color:var(--zui-marquee-lime-border-dark,#a3e635)] bg-[var(--zui-marquee-lime-bg,#65a30d14)] dark:bg-[var(--zui-marquee-lime-bg-dark,#a3e63524)] text-[color:var(--zui-marquee-lime-fg,#0f172a)] dark:text-[color:var(--zui-marquee-lime-fg-dark,#f8fafc)]\",\n  mint: \"border border-[color:var(--zui-marquee-mint-border,#10b981)] dark:border-[color:var(--zui-marquee-mint-border-dark,#6ee7b7)] bg-[var(--zui-marquee-mint-bg,#10b98114)] dark:bg-[var(--zui-marquee-mint-bg-dark,#6ee7b724)] text-[color:var(--zui-marquee-mint-fg,#0f172a)] dark:text-[color:var(--zui-marquee-mint-fg-dark,#f8fafc)]\",\n  ocean:\n    \"border border-[color:var(--zui-marquee-ocean-border,#0284c7)] dark:border-[color:var(--zui-marquee-ocean-border-dark,#38bdf8)] bg-[var(--zui-marquee-ocean-bg,#0284c714)] dark:bg-[var(--zui-marquee-ocean-bg-dark,#38bdf824)] text-[color:var(--zui-marquee-ocean-fg,#0f172a)] dark:text-[color:var(--zui-marquee-ocean-fg-dark,#f8fafc)]\",\n  sapphire:\n    \"border border-[color:var(--zui-marquee-sapphire-border,#1d4ed8)] dark:border-[color:var(--zui-marquee-sapphire-border-dark,#60a5fa)] bg-[var(--zui-marquee-sapphire-bg,#1d4ed814)] dark:bg-[var(--zui-marquee-sapphire-bg-dark,#60a5fa24)] text-[color:var(--zui-marquee-sapphire-fg,#0f172a)] dark:text-[color:var(--zui-marquee-sapphire-fg-dark,#f8fafc)]\",\n  lavender:\n    \"border border-[color:var(--zui-marquee-lavender-border,#8b5cf6)] dark:border-[color:var(--zui-marquee-lavender-border-dark,#a78bfa)] bg-[var(--zui-marquee-lavender-bg,#8b5cf614)] dark:bg-[var(--zui-marquee-lavender-bg-dark,#a78bfa24)] text-[color:var(--zui-marquee-lavender-fg,#0f172a)] dark:text-[color:var(--zui-marquee-lavender-fg-dark,#f8fafc)]\",\n  ruby: \"border border-[color:var(--zui-marquee-ruby-border,#be123c)] dark:border-[color:var(--zui-marquee-ruby-border-dark,#fb7185)] bg-[var(--zui-marquee-ruby-bg,#be123c14)] dark:bg-[var(--zui-marquee-ruby-bg-dark,#fb718524)] text-[color:var(--zui-marquee-ruby-fg,#0f172a)] dark:text-[color:var(--zui-marquee-ruby-fg-dark,#f8fafc)]\",\n  red: \"border border-[color:var(--zui-marquee-red-border,#dc2626)] dark:border-[color:var(--zui-marquee-red-border-dark,#ef4444)] bg-[var(--zui-marquee-red-bg,#dc262614)] dark:bg-[var(--zui-marquee-red-bg-dark,#ef444424)] text-[color:var(--zui-marquee-red-fg,#0f172a)] dark:text-[color:var(--zui-marquee-red-fg-dark,#f8fafc)]\",\n  slate:\n    \"border border-[color:var(--zui-marquee-slate-border,#475569)] dark:border-[color:var(--zui-marquee-slate-border-dark,#64748b)] bg-[var(--zui-marquee-slate-bg,#47556914)] dark:bg-[var(--zui-marquee-slate-bg-dark,#64748b24)] text-[color:var(--zui-marquee-slate-fg,#0f172a)] dark:text-[color:var(--zui-marquee-slate-fg-dark,#f8fafc)]\",\n  zinc: \"border border-[color:var(--zui-marquee-zinc-border,#52525b)] dark:border-[color:var(--zui-marquee-zinc-border-dark,#71717a)] bg-[var(--zui-marquee-zinc-bg,#52525b14)] dark:bg-[var(--zui-marquee-zinc-bg-dark,#71717a24)] text-[color:var(--zui-marquee-zinc-fg,#0f172a)] dark:text-[color:var(--zui-marquee-zinc-fg-dark,#f8fafc)]\",\n  stone:\n    \"border border-[color:var(--zui-marquee-stone-border,#57534e)] dark:border-[color:var(--zui-marquee-stone-border-dark,#78716c)] bg-[var(--zui-marquee-stone-bg,#57534e14)] dark:bg-[var(--zui-marquee-stone-bg-dark,#78716c24)] text-[color:var(--zui-marquee-stone-fg,#0f172a)] dark:text-[color:var(--zui-marquee-stone-fg-dark,#f8fafc)]\",\n  royal:\n    \"border border-[color:var(--zui-marquee-royal-border,#4338ca)] dark:border-[color:var(--zui-marquee-royal-border-dark,#818cf8)] bg-[var(--zui-marquee-royal-bg,#4338ca14)] dark:bg-[var(--zui-marquee-royal-bg-dark,#818cf824)] text-[color:var(--zui-marquee-royal-fg,#0f172a)] dark:text-[color:var(--zui-marquee-royal-fg-dark,#f8fafc)]\",\n  electric:\n    \"border border-[color:var(--zui-marquee-electric-border,#0ea5e9)] dark:border-[color:var(--zui-marquee-electric-border-dark,#38bdf8)] bg-[var(--zui-marquee-electric-bg,#0ea5e914)] dark:bg-[var(--zui-marquee-electric-bg-dark,#38bdf824)] text-[color:var(--zui-marquee-electric-fg,#0f172a)] dark:text-[color:var(--zui-marquee-electric-fg-dark,#f8fafc)]\",\n  forest:\n    \"border border-[color:var(--zui-marquee-forest-border,#166534)] dark:border-[color:var(--zui-marquee-forest-border-dark,#4ade80)] bg-[var(--zui-marquee-forest-bg,#16653414)] dark:bg-[var(--zui-marquee-forest-bg-dark,#4ade8024)] text-[color:var(--zui-marquee-forest-fg,#0f172a)] dark:text-[color:var(--zui-marquee-forest-fg-dark,#f8fafc)]\",\n  sunset:\n    \"border border-[color:var(--zui-marquee-sunset-border,#ea580c)] dark:border-[color:var(--zui-marquee-sunset-border-dark,#fb923c)] bg-[var(--zui-marquee-sunset-bg,#ea580c14)] dark:bg-[var(--zui-marquee-sunset-bg-dark,#fb923c24)] text-[color:var(--zui-marquee-sunset-fg,#0f172a)] dark:text-[color:var(--zui-marquee-sunset-fg-dark,#f8fafc)]\",\n  magenta:\n    \"border border-[color:var(--zui-marquee-magenta-border,#c026d3)] dark:border-[color:var(--zui-marquee-magenta-border-dark,#e879f9)] bg-[var(--zui-marquee-magenta-bg,#c026d314)] dark:bg-[var(--zui-marquee-magenta-bg-dark,#e879f924)] text-[color:var(--zui-marquee-magenta-fg,#0f172a)] dark:text-[color:var(--zui-marquee-magenta-fg-dark,#f8fafc)]\",\n  crimson:\n    \"border border-[color:var(--zui-marquee-crimson-border,#b91c1c)] dark:border-[color:var(--zui-marquee-crimson-border-dark,#f87171)] bg-[var(--zui-marquee-crimson-bg,#b91c1c14)] dark:bg-[var(--zui-marquee-crimson-bg-dark,#f8717124)] text-[color:var(--zui-marquee-crimson-fg,#0f172a)] dark:text-[color:var(--zui-marquee-crimson-fg-dark,#f8fafc)]\",\n  aqua: \"border border-[color:var(--zui-marquee-aqua-border,#0f766e)] dark:border-[color:var(--zui-marquee-aqua-border-dark,#2dd4bf)] bg-[var(--zui-marquee-aqua-bg,#0f766e14)] dark:bg-[var(--zui-marquee-aqua-bg-dark,#2dd4bf24)] text-[color:var(--zui-marquee-aqua-fg,#0f172a)] dark:text-[color:var(--zui-marquee-aqua-fg-dark,#f8fafc)]\",\n  plum: \"border border-[color:var(--zui-marquee-plum-border,#7e22ce)] dark:border-[color:var(--zui-marquee-plum-border-dark,#c084fc)] bg-[var(--zui-marquee-plum-bg,#7e22ce14)] dark:bg-[var(--zui-marquee-plum-bg-dark,#c084fc24)] text-[color:var(--zui-marquee-plum-fg,#0f172a)] dark:text-[color:var(--zui-marquee-plum-fg-dark,#f8fafc)]\",\n} as const;\n\nexport const zuiMarqueeOrientations = {\n  horizontal: \"w-full flex-row\",\n  vertical: \"h-64 flex-col\",\n} as const;\n\nexport const zuiMarqueeSizes = {\n  sm: \"p-2 text-xs\",\n  md: \"p-3 text-sm\",\n  lg: \"p-4 text-base\",\n} as const;\n\nexport const zuiMarqueeFade = {\n  false: \"\",\n  true: \"[mask-image:linear-gradient(to_right,transparent,black_12%,black_88%,transparent)] data-[orientation=vertical]:[mask-image:linear-gradient(to_bottom,transparent,black_12%,black_88%,transparent)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiMarqueeAppearances,\n  zuiMarqueeBase,\n  zuiMarqueeFade,\n  zuiMarqueeOrientations,\n  zuiMarqueeSizes,\n} from \"../../design-system/marquee\";\n\nexport const marqueeVariants = cva(zuiMarqueeBase, {\n  variants: {\n    appearance: zuiMarqueeAppearances,\n    fade: zuiMarqueeFade,\n    orientation: zuiMarqueeOrientations,\n    size: zuiMarqueeSizes,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    fade: true,\n    orientation: \"horizontal\",\n    size: \"md\",\n  },\n});\n","\"use client\";\n\nimport { Children, useCallback, useMemo, useRef, useState } from \"react\";\nimport type { CSSProperties, Ref } from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"../../hooks/useIsomorphicLayoutEffect\";\nimport { cn } from \"../../lib/utils\";\n\nimport type { MarqueeProps } from \"./types\";\nimport { marqueeVariants } from \"./variants\";\n\nconst marqueeKeyframes = `@keyframes zui-marquee-x{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - var(--zui-marquee-gap)/2),0,0)}}@keyframes zui-marquee-y{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(-50% - var(--zui-marquee-gap)/2),0)}}`;\n\nfunction toCssLength(value: number | string | undefined) {\n  if (value === undefined) {\n    return undefined;\n  }\n  return typeof value === \"number\" ? `${value}px` : value;\n}\n\nfunction assignRef<TElement>(\n  ref: Ref<TElement> | undefined,\n  value: TElement | null,\n) {\n  if (typeof ref === \"function\") {\n    ref(value);\n  } else if (ref) {\n    (ref as { current: TElement | null }).current = value;\n  }\n}\n\nexport function Marquee(props: MarqueeProps) {\n  const {\n    appearance,\n    children,\n    className,\n    direction,\n    fade,\n    gap,\n    itemClassName,\n    orientation,\n    pauseOnHover = false,\n    ref,\n    size,\n    speed = 30,\n    style,\n    trackClassName,\n    ...rest\n  } = props;\n\n  const resolvedOrientation =\n    orientation ??\n    (direction === \"up\" || direction === \"down\" ? \"vertical\" : \"horizontal\");\n  const resolvedDirection =\n    direction ?? (resolvedOrientation === \"vertical\" ? \"up\" : \"left\");\n  const isReverse =\n    resolvedDirection === \"right\" || resolvedDirection === \"down\";\n  const animationName =\n    resolvedOrientation === \"vertical\" ? \"zui-marquee-y\" : \"zui-marquee-x\";\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const measureRef = useRef<HTMLDivElement | null>(null);\n  const [copyCount, setCopyCount] = useState(1);\n  const childArray = useMemo(() => Children.toArray(children), [children]);\n  const setRootRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      rootRef.current = node;\n      assignRef(ref, node);\n    },\n    [ref],\n  );\n  const marqueeStyle = {\n    ...(gap !== undefined ? { \"--zui-marquee-gap\": toCssLength(gap) } : null),\n    ...style,\n  } as CSSProperties;\n  const groupClassName = cn(\n    \"flex shrink-0 items-center justify-around gap-(--zui-marquee-gap)\",\n    resolvedOrientation === \"vertical\" ? \"flex-col\" : \"flex-row\",\n    itemClassName,\n  );\n  const fillerChildren = Array.from(\n    { length: Math.max(0, copyCount - 1) },\n    (_, index) => (\n      <div key={index} aria-hidden=\"true\" inert className=\"contents\">\n        {childArray}\n      </div>\n    ),\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    const updateCopyCount = () => {\n      const root = rootRef.current;\n      const measure = measureRef.current;\n\n      if (!root || !measure) {\n        return;\n      }\n\n      const rootSize =\n        resolvedOrientation === \"vertical\"\n          ? root.offsetHeight\n          : root.offsetWidth;\n      const contentSize =\n        resolvedOrientation === \"vertical\"\n          ? measure.scrollHeight\n          : measure.scrollWidth;\n\n      if (!rootSize || !contentSize) {\n        setCopyCount(1);\n        return;\n      }\n\n      setCopyCount(Math.max(1, Math.ceil(rootSize / contentSize)));\n    };\n\n    updateCopyCount();\n\n    if (typeof ResizeObserver === \"undefined\") {\n      return;\n    }\n\n    const observer = new ResizeObserver(updateCopyCount);\n    if (rootRef.current) {\n      observer.observe(rootRef.current);\n    }\n    if (measureRef.current) {\n      observer.observe(measureRef.current);\n    }\n\n    return () => observer.disconnect();\n  }, [childArray, gap, resolvedOrientation]);\n\n  return (\n    <div\n      ref={setRootRef}\n      data-direction={resolvedDirection}\n      data-orientation={resolvedOrientation}\n      data-slot=\"marquee\"\n      className={cn(\n        marqueeVariants({\n          appearance,\n          fade,\n          orientation: resolvedOrientation,\n          size,\n        }),\n        className,\n      )}\n      style={marqueeStyle}\n      {...rest}\n    >\n      <style>{marqueeKeyframes}</style>\n      <div\n        aria-hidden=\"true\"\n        data-slot=\"marquee-measure\"\n        ref={measureRef}\n        className={cn(\n          \"pointer-events-none invisible absolute -z-10\",\n          groupClassName,\n        )}\n      >\n        {childArray}\n      </div>\n      <div\n        data-slot=\"marquee-track\"\n        className={cn(\n          \"flex shrink-0 gap-(--zui-marquee-gap) will-change-transform [animation-iteration-count:infinite] [animation-timing-function:linear] motion-reduce:[animation-play-state:paused]\",\n          resolvedOrientation === \"vertical\" ? \"flex-col\" : \"w-max flex-row\",\n          pauseOnHover && \"group-hover/marquee:[animation-play-state:paused]\",\n          isReverse && \"[animation-direction:reverse]\",\n          trackClassName,\n        )}\n        style={\n          {\n            animationDuration: `${speed}s`,\n            animationName,\n          } as CSSProperties\n        }\n      >\n        <div data-slot=\"marquee-item-group\" className={groupClassName}>\n          {childArray}\n          {fillerChildren}\n        </div>\n        <div\n          aria-hidden=\"true\"\n          inert\n          data-slot=\"marquee-item-group\"\n          className={groupClassName}\n        >\n          {childArray}\n          {fillerChildren}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nMarquee.displayName = \"Marquee\";\n"]}