@zentauri-ui/zentauri-components 1.8.42 → 1.9.1

package/src/design-system/stepper.ts

@@ -1,66 +0,0 @@
-export const zuiStepperBase = "flex w-full";
-
-export const zuiStepperOrientations = {
-  horizontal: "flex-row flex-wrap items-start gap-4",
-  vertical: "flex-col gap-6",
-} as const;
-
-export const zuiStepperItemBase = "relative flex gap-3";
-
-export const zuiStepperItemOrientations = {
-  horizontal: "min-w-0 flex-col items-center text-center",
-  vertical: "flex-row items-center text-left",
-} as const;
-
-export const zuiStepperIndicatorBase =
-  "grid size-9 shrink-0 place-items-center rounded-full border text-sm font-semibold transition-colors";
-
-export const zuiStepperIndicatorAppearances = {
-  complete:
-    "border-[color:var(--zui-stepper-indicator-complete-border,oklch(69.6%_0.17_162.48_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-complete-border-dark,oklch(69.6%_0.17_162.48_/_0.6))] bg-[var(--zui-stepper-indicator-complete-bg,oklch(69.6%_0.17_162.48_/_0.2))] dark:bg-[var(--zui-stepper-indicator-complete-bg-dark,oklch(69.6%_0.17_162.48_/_0.2))] text-[color:var(--zui-stepper-indicator-complete-fg,oklch(37.8%_0.077_168.94))] dark:text-[color:var(--zui-stepper-indicator-complete-fg-dark,oklch(95%_0.052_163.051))] ring-2 ring-[var(--zui-stepper-indicator-complete-ring,oklch(76.5%_0.177_163.223_/_0.3))] dark:ring-[var(--zui-stepper-indicator-complete-ring-dark,oklch(76.5%_0.177_163.223_/_0.3))]",
-  current:
-    "border-[color:var(--zui-stepper-indicator-current-border,oklch(54.1%_0.281_293.009))] dark:border-[color:var(--zui-stepper-indicator-current-border-dark,oklch(70.2%_0.183_293.541))] bg-[var(--zui-stepper-indicator-current-bg,oklch(60.6%_0.25_292.717_/_0.2))] dark:bg-[var(--zui-stepper-indicator-current-bg-dark,oklch(60.6%_0.25_292.717_/_0.2))] text-[color:var(--zui-stepper-indicator-current-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-stepper-indicator-current-fg-dark,#ffffff)] ring-2 ring-[var(--zui-stepper-indicator-current-ring,oklch(70.2%_0.183_293.541_/_0.5))] dark:ring-[var(--zui-stepper-indicator-current-ring-dark,oklch(70.2%_0.183_293.541_/_0.5))]",
-  upcoming:
-    "border-[color:var(--zui-stepper-indicator-upcoming-border,#00000026)] dark:border-[color:var(--zui-stepper-indicator-upcoming-border-dark,#ffffff26)] bg-[var(--zui-stepper-indicator-upcoming-bg,#0000000d)] dark:bg-[var(--zui-stepper-indicator-upcoming-bg-dark,#ffffff0d)] text-[color:var(--zui-stepper-indicator-upcoming-fg,oklch(55.4%_0.046_257.417))] dark:text-[color:var(--zui-stepper-indicator-upcoming-fg-dark,oklch(70.4%_0.04_256.788))]",
-  sky: "border-[color:var(--zui-stepper-indicator-sky-border,oklch(68.5%_0.169_237.323_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-sky-border-dark,oklch(68.5%_0.169_237.323_/_0.6))] bg-[var(--zui-stepper-indicator-sky-bg,oklch(68.5%_0.169_237.323_/_0.2))] dark:bg-[var(--zui-stepper-indicator-sky-bg-dark,oklch(68.5%_0.169_237.323_/_0.2))] text-[color:var(--zui-stepper-indicator-sky-fg,oklch(39.1%_0.09_240.876))] dark:text-[color:var(--zui-stepper-indicator-sky-fg-dark,oklch(95.1%_0.026_236.824))] ring-2 ring-[var(--zui-stepper-indicator-sky-ring,oklch(74.6%_0.16_232.661_/_0.3))] dark:ring-[var(--zui-stepper-indicator-sky-ring-dark,oklch(74.6%_0.16_232.661_/_0.3))]",
-  rose: "border-[color:var(--zui-stepper-indicator-rose-border,oklch(64.5%_0.246_16.439_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-rose-border-dark,oklch(64.5%_0.246_16.439_/_0.6))] bg-[var(--zui-stepper-indicator-rose-bg,oklch(64.5%_0.246_16.439_/_0.2))] dark:bg-[var(--zui-stepper-indicator-rose-bg-dark,oklch(64.5%_0.246_16.439_/_0.2))] text-[color:var(--zui-stepper-indicator-rose-fg,oklch(41%_0.159_10.272))] dark:text-[color:var(--zui-stepper-indicator-rose-fg-dark,oklch(94.1%_0.03_12.58))] ring-2 ring-[var(--zui-stepper-indicator-rose-ring,oklch(71.2%_0.194_13.428_/_0.3))] dark:ring-[var(--zui-stepper-indicator-rose-ring-dark,oklch(71.2%_0.194_13.428_/_0.3))]",
-  purple:
-    "border-[color:var(--zui-stepper-indicator-purple-border,oklch(62.7%_0.265_303.9_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-purple-border-dark,oklch(62.7%_0.265_303.9_/_0.6))] bg-[var(--zui-stepper-indicator-purple-bg,oklch(62.7%_0.265_303.9_/_0.2))] dark:bg-[var(--zui-stepper-indicator-purple-bg-dark,oklch(62.7%_0.265_303.9_/_0.2))] text-[color:var(--zui-stepper-indicator-purple-fg,oklch(38.1%_0.176_304.987))] dark:text-[color:var(--zui-stepper-indicator-purple-fg-dark,oklch(94.6%_0.033_307.174))] ring-2 ring-[var(--zui-stepper-indicator-purple-ring,oklch(71.4%_0.203_305.504_/_0.3))] dark:ring-[var(--zui-stepper-indicator-purple-ring-dark,oklch(71.4%_0.203_305.504_/_0.3))]",
-  pink: "border-[color:var(--zui-stepper-indicator-pink-border,oklch(65.6%_0.241_354.308_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-pink-border-dark,oklch(65.6%_0.241_354.308_/_0.6))] bg-[var(--zui-stepper-indicator-pink-bg,oklch(65.6%_0.241_354.308_/_0.2))] dark:bg-[var(--zui-stepper-indicator-pink-bg-dark,oklch(65.6%_0.241_354.308_/_0.2))] text-[color:var(--zui-stepper-indicator-pink-fg,oklch(40.8%_0.153_2.432))] dark:text-[color:var(--zui-stepper-indicator-pink-fg-dark,oklch(94.8%_0.028_342.258))] ring-2 ring-[var(--zui-stepper-indicator-pink-ring,oklch(71.8%_0.202_349.761_/_0.3))] dark:ring-[var(--zui-stepper-indicator-pink-ring-dark,oklch(71.8%_0.202_349.761_/_0.3))]",
-  orange:
-    "border-[color:var(--zui-stepper-indicator-orange-border,oklch(70.5%_0.213_47.604_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-orange-border-dark,oklch(70.5%_0.213_47.604_/_0.6))] bg-[var(--zui-stepper-indicator-orange-bg,oklch(70.5%_0.213_47.604_/_0.2))] dark:bg-[var(--zui-stepper-indicator-orange-bg-dark,oklch(70.5%_0.213_47.604_/_0.2))] text-[color:var(--zui-stepper-indicator-orange-fg,oklch(40.8%_0.123_38.172))] dark:text-[color:var(--zui-stepper-indicator-orange-fg-dark,oklch(95.4%_0.038_75.164))] ring-2 ring-[var(--zui-stepper-indicator-orange-ring,oklch(75%_0.183_55.934_/_0.3))] dark:ring-[var(--zui-stepper-indicator-orange-ring-dark,oklch(75%_0.183_55.934_/_0.3))]",
-  yellow:
-    "border-[color:var(--zui-stepper-indicator-yellow-border,oklch(79.5%_0.184_86.047_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-yellow-border-dark,oklch(79.5%_0.184_86.047_/_0.6))] bg-[var(--zui-stepper-indicator-yellow-bg,oklch(79.5%_0.184_86.047_/_0.2))] dark:bg-[var(--zui-stepper-indicator-yellow-bg-dark,oklch(79.5%_0.184_86.047_/_0.2))] text-[color:var(--zui-stepper-indicator-yellow-fg,oklch(42.1%_0.095_57.708))] dark:text-[color:var(--zui-stepper-indicator-yellow-fg-dark,oklch(97.3%_0.071_103.193))] ring-2 ring-[var(--zui-stepper-indicator-yellow-ring,oklch(85.2%_0.199_91.936_/_0.3))] dark:ring-[var(--zui-stepper-indicator-yellow-ring-dark,oklch(85.2%_0.199_91.936_/_0.3))]",
-  teal: "border-[color:var(--zui-stepper-indicator-teal-border,oklch(70.4%_0.14_182.503_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-teal-border-dark,oklch(70.4%_0.14_182.503_/_0.6))] bg-[var(--zui-stepper-indicator-teal-bg,oklch(70.4%_0.14_182.503_/_0.2))] dark:bg-[var(--zui-stepper-indicator-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.2))] text-[color:var(--zui-stepper-indicator-teal-fg,oklch(38.6%_0.063_188.416))] dark:text-[color:var(--zui-stepper-indicator-teal-fg-dark,oklch(95.3%_0.051_180.801))] ring-2 ring-[var(--zui-stepper-indicator-teal-ring,oklch(77.7%_0.152_181.912_/_0.3))] dark:ring-[var(--zui-stepper-indicator-teal-ring-dark,oklch(77.7%_0.152_181.912_/_0.3))]",
-  indigo:
-    "border-[color:var(--zui-stepper-indicator-indigo-border,oklch(58.5%_0.233_277.117_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-indigo-border-dark,oklch(58.5%_0.233_277.117_/_0.6))] bg-[var(--zui-stepper-indicator-indigo-bg,oklch(58.5%_0.233_277.117_/_0.2))] dark:bg-[var(--zui-stepper-indicator-indigo-bg-dark,oklch(58.5%_0.233_277.117_/_0.2))] text-[color:var(--zui-stepper-indicator-indigo-fg,oklch(35.9%_0.144_278.697))] dark:text-[color:var(--zui-stepper-indicator-indigo-fg-dark,oklch(93%_0.034_272.788))] ring-2 ring-[var(--zui-stepper-indicator-indigo-ring,oklch(67.3%_0.182_276.935_/_0.3))] dark:ring-[var(--zui-stepper-indicator-indigo-ring-dark,oklch(67.3%_0.182_276.935_/_0.3))]",
-  emerald:
-    "border-[color:var(--zui-stepper-indicator-emerald-border,oklch(69.6%_0.17_162.48_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-emerald-border-dark,oklch(69.6%_0.17_162.48_/_0.6))] bg-[var(--zui-stepper-indicator-emerald-bg,oklch(69.6%_0.17_162.48_/_0.2))] dark:bg-[var(--zui-stepper-indicator-emerald-bg-dark,oklch(69.6%_0.17_162.48_/_0.2))] text-[color:var(--zui-stepper-indicator-emerald-fg,oklch(37.8%_0.077_168.94))] dark:text-[color:var(--zui-stepper-indicator-emerald-fg-dark,oklch(95%_0.052_163.051))] ring-2 ring-[var(--zui-stepper-indicator-emerald-ring,oklch(76.5%_0.177_163.223_/_0.3))] dark:ring-[var(--zui-stepper-indicator-emerald-ring-dark,oklch(76.5%_0.177_163.223_/_0.3))]",
-  gray: "border-[color:var(--zui-stepper-indicator-gray-border,oklch(55.1%_0.027_264.364_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gray-border-dark,oklch(55.1%_0.027_264.364_/_0.6))] bg-[var(--zui-stepper-indicator-gray-bg,oklch(55.1%_0.027_264.364_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gray-bg-dark,oklch(55.1%_0.027_264.364_/_0.2))] text-[color:var(--zui-stepper-indicator-gray-fg,oklch(21%_0.034_264.665))] dark:text-[color:var(--zui-stepper-indicator-gray-fg-dark,oklch(96.7%_0.003_264.542))] ring-2 ring-[var(--zui-stepper-indicator-gray-ring,oklch(70.7%_0.022_261.325_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gray-ring-dark,oklch(70.7%_0.022_261.325_/_0.3))]",
-  violet:
-    "border-[color:var(--zui-stepper-indicator-violet-border,oklch(60.6%_0.25_292.717_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-violet-border-dark,oklch(60.6%_0.25_292.717_/_0.6))] bg-[var(--zui-stepper-indicator-violet-bg,oklch(60.6%_0.25_292.717_/_0.2))] dark:bg-[var(--zui-stepper-indicator-violet-bg-dark,oklch(60.6%_0.25_292.717_/_0.2))] text-[color:var(--zui-stepper-indicator-violet-fg,oklch(38%_0.189_293.745))] dark:text-[color:var(--zui-stepper-indicator-violet-fg-dark,oklch(94.3%_0.029_294.588))] ring-2 ring-[var(--zui-stepper-indicator-violet-ring,oklch(70.2%_0.183_293.541_/_0.3))] dark:ring-[var(--zui-stepper-indicator-violet-ring-dark,oklch(70.2%_0.183_293.541_/_0.3))]",
-  "gradient-blue":
-    "border-[color:var(--zui-stepper-indicator-gradient-blue-border,oklch(62.3%_0.214_259.815_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-blue-border-dark,oklch(62.3%_0.214_259.815_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-blue-bg,oklch(62.3%_0.214_259.815_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-blue-bg-dark,oklch(62.3%_0.214_259.815_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-blue-fg,oklch(37.9%_0.146_265.522))] dark:text-[color:var(--zui-stepper-indicator-gradient-blue-fg-dark,oklch(93.2%_0.032_255.585))] ring-2 ring-[var(--zui-stepper-indicator-gradient-blue-ring,oklch(70.7%_0.165_254.624_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-blue-ring-dark,oklch(70.7%_0.165_254.624_/_0.3))]",
-  "gradient-green":
-    "border-[color:var(--zui-stepper-indicator-gradient-green-border,oklch(72.3%_0.219_149.579_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-green-border-dark,oklch(72.3%_0.219_149.579_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-green-bg,oklch(72.3%_0.219_149.579_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-green-bg-dark,oklch(72.3%_0.219_149.579_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-green-fg,oklch(39.3%_0.095_152.535))] dark:text-[color:var(--zui-stepper-indicator-gradient-green-fg-dark,oklch(96.2%_0.044_156.743))] ring-2 ring-[var(--zui-stepper-indicator-gradient-green-ring,oklch(79.2%_0.209_151.711_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-green-ring-dark,oklch(79.2%_0.209_151.711_/_0.3))]",
-  "gradient-red":
-    "border-[color:var(--zui-stepper-indicator-gradient-red-border,oklch(63.7%_0.237_25.331_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-red-border-dark,oklch(63.7%_0.237_25.331_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-red-bg,oklch(63.7%_0.237_25.331_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-red-bg-dark,oklch(63.7%_0.237_25.331_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-red-fg,oklch(39.6%_0.141_25.723))] dark:text-[color:var(--zui-stepper-indicator-gradient-red-fg-dark,oklch(93.6%_0.032_17.717))] ring-2 ring-[var(--zui-stepper-indicator-gradient-red-ring,oklch(70.4%_0.191_22.216_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-red-ring-dark,oklch(70.4%_0.191_22.216_/_0.3))]",
-  "gradient-yellow":
-    "border-[color:var(--zui-stepper-indicator-gradient-yellow-border,oklch(79.5%_0.184_86.047_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-yellow-border-dark,oklch(79.5%_0.184_86.047_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-yellow-bg,oklch(79.5%_0.184_86.047_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-yellow-bg-dark,oklch(79.5%_0.184_86.047_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-yellow-fg,oklch(42.1%_0.095_57.708))] dark:text-[color:var(--zui-stepper-indicator-gradient-yellow-fg-dark,oklch(97.3%_0.071_103.193))] ring-2 ring-[var(--zui-stepper-indicator-gradient-yellow-ring,oklch(85.2%_0.199_91.936_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-yellow-ring-dark,oklch(85.2%_0.199_91.936_/_0.3))]",
-  "gradient-purple":
-    "border-[color:var(--zui-stepper-indicator-gradient-purple-border,oklch(62.7%_0.265_303.9_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-purple-border-dark,oklch(62.7%_0.265_303.9_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-purple-bg,oklch(62.7%_0.265_303.9_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-purple-bg-dark,oklch(62.7%_0.265_303.9_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-purple-fg,oklch(38.1%_0.176_304.987))] dark:text-[color:var(--zui-stepper-indicator-gradient-purple-fg-dark,oklch(94.6%_0.033_307.174))] ring-2 ring-[var(--zui-stepper-indicator-gradient-purple-ring,oklch(71.4%_0.203_305.504_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-purple-ring-dark,oklch(71.4%_0.203_305.504_/_0.3))]",
-  "gradient-teal":
-    "border-[color:var(--zui-stepper-indicator-gradient-teal-border,oklch(70.4%_0.14_182.503_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-teal-border-dark,oklch(70.4%_0.14_182.503_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-teal-bg,oklch(70.4%_0.14_182.503_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-teal-bg-dark,oklch(70.4%_0.14_182.503_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-teal-fg,oklch(38.6%_0.063_188.416))] dark:text-[color:var(--zui-stepper-indicator-gradient-teal-fg-dark,oklch(95.3%_0.051_180.801))] ring-2 ring-[var(--zui-stepper-indicator-gradient-teal-ring,oklch(77.7%_0.152_181.912_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-teal-ring-dark,oklch(77.7%_0.152_181.912_/_0.3))]",
-  "gradient-indigo":
-    "border-[color:var(--zui-stepper-indicator-gradient-indigo-border,oklch(58.5%_0.233_277.117_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-indigo-border-dark,oklch(58.5%_0.233_277.117_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-indigo-bg,oklch(58.5%_0.233_277.117_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-indigo-bg-dark,oklch(58.5%_0.233_277.117_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-indigo-fg,oklch(35.9%_0.144_278.697))] dark:text-[color:var(--zui-stepper-indicator-gradient-indigo-fg-dark,oklch(93%_0.034_272.788))] ring-2 ring-[var(--zui-stepper-indicator-gradient-indigo-ring,oklch(67.3%_0.182_276.935_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-indigo-ring-dark,oklch(67.3%_0.182_276.935_/_0.3))]",
-  "gradient-pink":
-    "border-[color:var(--zui-stepper-indicator-gradient-pink-border,oklch(65.6%_0.241_354.308_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-pink-border-dark,oklch(65.6%_0.241_354.308_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-pink-bg,oklch(65.6%_0.241_354.308_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-pink-bg-dark,oklch(65.6%_0.241_354.308_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-pink-fg,oklch(40.8%_0.153_2.432))] dark:text-[color:var(--zui-stepper-indicator-gradient-pink-fg-dark,oklch(94.8%_0.028_342.258))] ring-2 ring-[var(--zui-stepper-indicator-gradient-pink-ring,oklch(71.8%_0.202_349.761_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-pink-ring-dark,oklch(71.8%_0.202_349.761_/_0.3))]",
-  "gradient-orange":
-    "border-[color:var(--zui-stepper-indicator-gradient-orange-border,oklch(70.5%_0.213_47.604_/_0.6))] dark:border-[color:var(--zui-stepper-indicator-gradient-orange-border-dark,oklch(70.5%_0.213_47.604_/_0.6))] bg-[var(--zui-stepper-indicator-gradient-orange-bg,oklch(70.5%_0.213_47.604_/_0.2))] dark:bg-[var(--zui-stepper-indicator-gradient-orange-bg-dark,oklch(70.5%_0.213_47.604_/_0.2))] text-[color:var(--zui-stepper-indicator-gradient-orange-fg,oklch(40.8%_0.123_38.172))] dark:text-[color:var(--zui-stepper-indicator-gradient-orange-fg-dark,oklch(95.4%_0.038_75.164))] ring-2 ring-[var(--zui-stepper-indicator-gradient-orange-ring,oklch(75%_0.183_55.934_/_0.3))] dark:ring-[var(--zui-stepper-indicator-gradient-orange-ring-dark,oklch(75%_0.183_55.934_/_0.3))]",
-} as const;
-
-export const zuiStepperIndicatorSizes = {
-  sm: "size-8 text-xs",
-  md: "size-9 text-sm",
-  lg: "size-10 text-base",
-} as const;

package/src/ui/stepper/index.ts

@@ -1,22 +0,0 @@
-"use client";
-
-export {
-  Stepper,
-  StepperDescription,
-  StepperIndicator,
-  StepperItem,
-  StepperTitle,
-} from "./stepper";
-export type {
-  StepperDescriptionProps,
-  StepperIndicatorProps,
-  StepperItemProps,
-  StepperProps,
-  StepperTitleProps,
-  StepperAppearance,
-} from "./types";
-export {
-  stepperIndicatorVariants,
-  stepperItemVariants,
-  stepperVariants,
-} from "./variants";

package/src/ui/stepper/stepper.test.tsx

@@ -1,190 +0,0 @@
-import { createRef } from "react";
-import { render, screen } from "@testing-library/react";
-import { describe, expect, it } from "vitest";
-
-import {
-  Stepper,
-  StepperDescription,
-  StepperIndicator,
-  StepperItem,
-  StepperTitle,
-} from "./stepper";
-
-describe("Stepper", () => {
-  it("should expose displayName", () => {
-    expect(Stepper.displayName).toBe("Stepper");
-    expect(StepperItem.displayName).toBe("StepperItem");
-    expect(StepperIndicator.displayName).toBe("StepperIndicator");
-    expect(StepperTitle.displayName).toBe("StepperTitle");
-    expect(StepperDescription.displayName).toBe("StepperDescription");
-  });
-
-  it("should stamp data-slot on stepper root and use ordered list markup", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>One</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const root = document.querySelector('[data-slot="stepper"]');
-    expect(root).toBeTruthy();
-    expect(root?.tagName).toBe("OL");
-    expect(document.querySelector('[data-slot="stepper-item"]')?.tagName).toBe(
-      "LI",
-    );
-  });
-
-  it("should apply default upcoming appearance to indicators", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>Cart</StepperTitle>
-        </StepperItem>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>Pay</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const indicators = document.querySelectorAll(
-      '[data-slot="stepper-indicator"]',
-    );
-    expect(indicators).toHaveLength(2);
-    expect(indicators[0]?.className).toContain(
-      "--zui-stepper-indicator-upcoming-border",
-    );
-    expect(indicators[1]?.className).toContain(
-      "--zui-stepper-indicator-upcoming-border",
-    );
-  });
-
-  it("should honor appearance prop on each indicator", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator appearance="complete" />
-          <StepperTitle>Done</StepperTitle>
-        </StepperItem>
-        <StepperItem>
-          <StepperIndicator appearance="current" />
-          <StepperTitle>Active</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const indicators = document.querySelectorAll(
-      '[data-slot="stepper-indicator"]',
-    );
-    expect(indicators[0]?.className).toMatch(
-      /--zui-stepper-indicator-complete-border/,
-    );
-    expect(indicators[1]?.className).toMatch(
-      /--zui-stepper-indicator-current-border/,
-    );
-  });
-
-  it("should render step index as indicator content when children are omitted", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>First</StepperTitle>
-        </StepperItem>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>Second</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const indicators = screen.getAllByText(/^[12]$/);
-    expect(indicators[0]).toHaveTextContent("1");
-    expect(indicators[1]).toHaveTextContent("2");
-  });
-
-  it("should render custom indicator children instead of the default index", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator>✓</StepperIndicator>
-          <StepperTitle>Check</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    expect(screen.getByText("✓")).toBeInTheDocument();
-  });
-
-  it("should apply vertical orientation classes on the root", () => {
-    const { container } = render(
-      <Stepper orientation="vertical">
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>V</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const root = container.querySelector('[data-slot="stepper"]');
-    expect(root?.className).toMatch(/flex-col/);
-  });
-
-  it("should pass size from Stepper context to indicators", () => {
-    render(
-      <Stepper size="sm">
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>Small</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    const indicator = document.querySelector('[data-slot="stepper-indicator"]');
-    expect(indicator?.className).toMatch(/size-8/);
-  });
-
-  it("should stamp data-slot on title and description", () => {
-    render(
-      <Stepper>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle data-testid="t">T</StepperTitle>
-          <StepperDescription data-testid="d">D</StepperDescription>
-        </StepperItem>
-      </Stepper>,
-    );
-    expect(document.querySelector('[data-slot="stepper-title"]')).toBe(
-      screen.getByTestId("t"),
-    );
-    expect(document.querySelector('[data-slot="stepper-description"]')).toBe(
-      screen.getByTestId("d"),
-    );
-  });
-
-  it("should forward ref on Stepper", () => {
-    const ref = createRef<HTMLOListElement>();
-    render(
-      <Stepper ref={ref}>
-        <StepperItem>
-          <StepperIndicator />
-          <StepperTitle>A</StepperTitle>
-        </StepperItem>
-      </Stepper>,
-    );
-    expect(ref.current?.getAttribute("data-slot")).toBe("stepper");
-  });
-
-  it("should throw when StepperItem is used outside Stepper", () => {
-    expect(() =>
-      render(
-        <StepperItem>
-          <StepperIndicator />
-        </StepperItem>,
-      ),
-    ).toThrow(/must be used within <Stepper>/);
-  });
-
-  it("should throw when StepperIndicator is used outside Stepper", () => {
-    expect(() => render(<StepperIndicator />)).toThrow(
-      /must be used within <Stepper>/,
-    );
-  });
-});

package/src/ui/stepper/stepper.tsx

@@ -1,171 +0,0 @@
-"use client";
-
-import {
-  Children,
-  createContext,
-  isValidElement,
-  useContext,
-  useMemo,
-} from "react";
-
-import { cn } from "../../lib/utils";
-
-import type {
-  StepperCtx,
-  StepperDescriptionProps,
-  StepperIndicatorProps,
-  StepperItemProps,
-  StepperProps,
-  StepperTitleProps,
-} from "./types";
-import {
-  stepperIndicatorVariants,
-  stepperItemVariants,
-  stepperVariants,
-} from "./variants";
-
-const StepperContext = createContext<StepperCtx | null>(null);
-
-function useStepper(component: string): StepperCtx {
-  const ctx = useContext(StepperContext);
-  if (!ctx) {
-    throw new Error(`${component} must be used within <Stepper>`);
-  }
-  return ctx;
-}
-
-const StepperIndexContext = createContext<number | null>(null);
-
-function useStepperIndex(component: string): number {
-  const index = useContext(StepperIndexContext);
-  if (index === null) {
-    throw new Error(`${component} must be used within <StepperItem>`);
-  }
-  return index;
-}
-
-export function Stepper({
-  className,
-  orientation = "horizontal",
-  size = "md",
-  children,
-  ref,
-  ...rest
-}: StepperProps) {
-  const items = useMemo(
-    () => Children.toArray(children).filter(isValidElement),
-    [children],
-  );
-  const ctx = useMemo(
-    () => ({
-      orientation: orientation ?? "horizontal",
-      size: size ?? "md",
-      total: items.length,
-    }),
-    [items.length, orientation, size],
-  );
-
-  return (
-    <StepperContext.Provider value={ctx}>
-      <ol
-        ref={ref}
-        data-slot="stepper"
-        className={cn(
-          stepperVariants({ orientation }),
-          "m-0 list-none p-0",
-          className,
-        )}
-        {...rest}
-      >
-        {items.map((child, index) => (
-          <StepperIndexContext.Provider key={index} value={index}>
-            {child}
-          </StepperIndexContext.Provider>
-        ))}
-      </ol>
-    </StepperContext.Provider>
-  );
-}
-
-Stepper.displayName = "Stepper";
-
-export function StepperItem({
-  className,
-  ref,
-  children,
-  ...rest
-}: StepperItemProps) {
-  const { orientation } = useStepper("StepperItem");
-  return (
-    <li
-      ref={ref}
-      data-slot="stepper-item"
-      className={cn(stepperItemVariants({ orientation }), className)}
-      {...rest}
-    >
-      {children}
-    </li>
-  );
-}
-
-StepperItem.displayName = "StepperItem";
-
-export function StepperIndicator({
-  className,
-  ref,
-  children,
-  appearance,
-  ...rest
-}: StepperIndicatorProps & { ref?: React.Ref<HTMLDivElement> }) {
-  const { size } = useStepper("StepperIndicator");
-  const index = useStepperIndex("StepperIndicator");
-  return (
-    <div
-      ref={ref}
-      data-slot="stepper-indicator"
-      className={cn(stepperIndicatorVariants({ appearance, size }), className)}
-      {...rest}
-    >
-      {children ?? index + 1}
-    </div>
-  );
-}
-
-StepperIndicator.displayName = "StepperIndicator";
-
-export function StepperTitle({
-  className,
-  ref,
-  ...rest
-}: StepperTitleProps & { ref?: React.Ref<HTMLDivElement> }) {
-  return (
-    <div
-      ref={ref}
-      data-slot="stepper-title"
-      className={cn(
-        "text-sm font-semibold text-slate-900 dark:text-white",
-        className,
-      )}
-      {...rest}
-    />
-  );
-}
-
-StepperTitle.displayName = "StepperTitle";
-
-export function StepperDescription({
-  className,
-  ref,
-  ...rest
-}: StepperDescriptionProps & { ref?: React.Ref<HTMLParagraphElement> }) {
-  return (
-    <p
-      ref={ref}
-      data-slot="stepper-description"
-      className={cn("text-xs text-slate-900 dark:text-slate-400", className)}
-      {...rest}
-    />
-  );
-}
-
-StepperDescription.displayName = "StepperDescription";

package/src/ui/stepper/types.ts

@@ -1,38 +0,0 @@
-import type { VariantProps } from "class-variance-authority";
-import type {
-  ComponentPropsWithoutRef,
-  ComponentPropsWithRef,
-  ReactNode,
-} from "react";
-
-import type { stepperIndicatorVariants, stepperVariants } from "./variants";
-
-type StepperVariantProps = VariantProps<typeof stepperVariants>;
-
-export type StepperProps = StepperVariantProps & {
-  size?: VariantProps<typeof stepperIndicatorVariants>["size"];
-  children?: ReactNode;
-} & Omit<ComponentPropsWithRef<"ol">, "children">;
-
-export type StepperItemProps = ComponentPropsWithRef<"li"> & {
-  children?: ReactNode;
-};
-
-export type StepperIndicatorProps = ComponentPropsWithoutRef<"div"> & {
-  children?: ReactNode;
-  appearance?: StepperAppearance;
-};
-
-export type StepperTitleProps = ComponentPropsWithoutRef<"div">;
-
-export type StepperDescriptionProps = ComponentPropsWithoutRef<"p">;
-
-export type StepperAppearance = VariantProps<
-  typeof stepperIndicatorVariants
->["appearance"];
-
-export type StepperCtx = {
-  orientation: NonNullable<StepperProps["orientation"]>;
-  size: NonNullable<StepperProps["size"]>;
-  total: number;
-};

package/src/ui/stepper/variants.ts

@@ -1,40 +0,0 @@
-import { cva } from "class-variance-authority";
-
-import {
-  zuiStepperBase,
-  zuiStepperIndicatorAppearances,
-  zuiStepperIndicatorBase,
-  zuiStepperIndicatorSizes,
-  zuiStepperItemBase,
-  zuiStepperItemOrientations,
-  zuiStepperOrientations,
-} from "../../design-system/stepper";
-
-export const stepperVariants = cva(zuiStepperBase, {
-  variants: {
-    orientation: zuiStepperOrientations,
-  },
-  defaultVariants: {
-    orientation: "horizontal",
-  },
-});
-
-export const stepperItemVariants = cva(zuiStepperItemBase, {
-  variants: {
-    orientation: zuiStepperItemOrientations,
-  },
-  defaultVariants: {
-    orientation: "horizontal",
-  },
-});
-
-export const stepperIndicatorVariants = cva(zuiStepperIndicatorBase, {
-  variants: {
-    appearance: zuiStepperIndicatorAppearances,
-    size: zuiStepperIndicatorSizes,
-  },
-  defaultVariants: {
-    appearance: "upcoming",
-    size: "md",
-  },
-});