@zentauri-ui/zentauri-components 1.7.7 → 1.7.9

package/dist/ui/marquee.mjs

@@ -0,0 +1,168 @@
+"use client";
+import { cn } from '../chunk-4D54YOL6.mjs';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/design-system/marquee.ts
+var zuiMarqueeBase = "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]";
+var zuiMarqueeAppearances = {
+  default: "[--zui-marquee-bg:transparent] [--zui-marquee-fg:oklch(20.8%_0.042_265.755)] dark:[--zui-marquee-fg:#ffffff]",
+  outline: "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]",
+  ghost: "[--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)]",
+  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]",
+  separated: "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]",
+  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)]",
+  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)]",
+  purple: "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)]",
+  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)]",
+  orange: "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)]",
+  yellow: "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)]",
+  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]"
+};
+var zuiMarqueeOrientations = {
+  horizontal: "w-full flex-row",
+  vertical: "h-64 flex-col"
+};
+var zuiMarqueeSizes = {
+  sm: "p-2 text-xs",
+  md: "p-3 text-sm",
+  lg: "p-4 text-base"
+};
+var zuiMarqueeFade = {
+  false: "",
+  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)]"
+};
+
+// src/ui/marquee/variants.ts
+var marqueeVariants = cva(zuiMarqueeBase, {
+  variants: {
+    appearance: zuiMarqueeAppearances,
+    fade: zuiMarqueeFade,
+    orientation: zuiMarqueeOrientations,
+    size: zuiMarqueeSizes
+  },
+  defaultVariants: {
+    appearance: "default",
+    fade: true,
+    orientation: "horizontal",
+    size: "md"
+  }
+});
+var 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)}}`;
+function toCssLength(value) {
+  if (value === void 0) {
+    return void 0;
+  }
+  return typeof value === "number" ? `${value}px` : value;
+}
+function Marquee(props) {
+  const {
+    appearance,
+    children,
+    className,
+    direction,
+    fade,
+    gap,
+    itemClassName,
+    orientation,
+    pauseOnHover = false,
+    ref,
+    size,
+    speed = 30,
+    style,
+    trackClassName,
+    ...rest
+  } = props;
+  const resolvedOrientation = orientation ?? (direction === "up" || direction === "down" ? "vertical" : "horizontal");
+  const resolvedDirection = direction ?? (resolvedOrientation === "vertical" ? "up" : "left");
+  const isReverse = resolvedDirection === "right" || resolvedDirection === "down";
+  const animationName = resolvedOrientation === "vertical" ? "zui-marquee-y" : "zui-marquee-x";
+  const marqueeStyle = {
+    ...gap !== void 0 ? { "--zui-marquee-gap": toCssLength(gap) } : null,
+    ...style
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      "data-direction": resolvedDirection,
+      "data-orientation": resolvedOrientation,
+      "data-slot": "marquee",
+      className: cn(
+        marqueeVariants({
+          appearance,
+          fade,
+          orientation: resolvedOrientation,
+          size
+        }),
+        className
+      ),
+      style: marqueeStyle,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx("style", { children: marqueeKeyframes }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-slot": "marquee-track",
+            className: cn(
+              "flex shrink-0 gap-[var(--zui-marquee-gap)] will-change-transform [animation-iteration-count:infinite] [animation-timing-function:linear] motion-reduce:[animation-play-state:paused]",
+              resolvedOrientation === "vertical" ? "flex-col" : "w-max flex-row",
+              pauseOnHover && "group-hover/marquee:[animation-play-state:paused]",
+              isReverse && "[animation-direction:reverse]",
+              trackClassName
+            ),
+            style: {
+              animationDuration: `${speed}s`,
+              animationName
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-slot": "marquee-item-group",
+                  className: cn(
+                    "flex shrink-0 items-center justify-around gap-[var(--zui-marquee-gap)]",
+                    resolvedOrientation === "vertical" ? "flex-col" : "flex-row",
+                    itemClassName
+                  ),
+                  children
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "aria-hidden": "true",
+                  inert: true,
+                  "data-slot": "marquee-item-group",
+                  className: cn(
+                    "flex shrink-0 items-center justify-around gap-[var(--zui-marquee-gap)]",
+                    resolvedOrientation === "vertical" ? "flex-col" : "flex-row",
+                    itemClassName
+                  ),
+                  children
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+Marquee.displayName = "Marquee";
+
+export { Marquee, marqueeVariants };
+//# sourceMappingURL=marquee.mjs.map
+//# sourceMappingURL=marquee.mjs.map

package/dist/ui/marquee.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/design-system/marquee.ts","../../src/ui/marquee/variants.ts","../../src/ui/marquee/marquee.tsx"],"names":[],"mappings":"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","file":"marquee.mjs","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 type { CSSProperties } from \"react\";\n\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\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 marqueeStyle = {\n    ...(gap !== undefined ? { \"--zui-marquee-gap\": toCssLength(gap) } : null),\n    ...style,\n  } as CSSProperties;\n\n  return (\n    <div\n      ref={ref}\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        data-slot=\"marquee-track\"\n        className={cn(\n          \"flex shrink-0 gap-[var(--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\n          data-slot=\"marquee-item-group\"\n          className={cn(\n            \"flex shrink-0 items-center justify-around gap-[var(--zui-marquee-gap)]\",\n            resolvedOrientation === \"vertical\" ? \"flex-col\" : \"flex-row\",\n            itemClassName,\n          )}\n        >\n          {children}\n        </div>\n        <div\n          aria-hidden=\"true\"\n          inert\n          data-slot=\"marquee-item-group\"\n          className={cn(\n            \"flex shrink-0 items-center justify-around gap-[var(--zui-marquee-gap)]\",\n            resolvedOrientation === \"vertical\" ? \"flex-col\" : \"flex-row\",\n            itemClassName,\n          )}\n        >\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nMarquee.displayName = \"Marquee\";\n"]}

package/dist/ui/rating/index.d.ts

@@ -0,0 +1,4 @@
+export { Rating } from "./rating";
+export type { RatingIconVariantProps, RatingItemVariantProps, RatingPresetIcon, RatingProps, } from "./types";
+export { ratingIconVariants, ratingItemVariants } from "./variants";
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/rating/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/rating/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EACV,sBAAsB,EACtB,sBAAsB,EACtB,gBAAgB,EAChB,WAAW,GACZ,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC"}

package/dist/ui/rating/rating.d.ts

@@ -0,0 +1,6 @@
+import type { RatingProps } from "./types";
+export declare function Rating(props: RatingProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Rating {
+    var displayName: string;
+}
+//# sourceMappingURL=rating.d.ts.map

package/dist/ui/rating/rating.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating.d.ts","sourceRoot":"","sources":["../../../src/ui/rating/rating.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAoB,WAAW,EAAE,MAAM,SAAS,CAAC;AA6C7D,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,2CA2OxC;yBA3Oe,MAAM"}

package/dist/ui/rating/types.d.ts

@@ -0,0 +1,25 @@
+import type { VariantProps } from "class-variance-authority";
+import type { ComponentPropsWithRef, ReactNode } from "react";
+import type { IconType } from "react-icons";
+import type { ratingIconVariants, ratingItemVariants } from "./variants";
+export type RatingPresetIcon = "star" | "heart" | "flame" | "thumb";
+export type RatingItemVariantProps = VariantProps<typeof ratingItemVariants>;
+export type RatingIconVariantProps = VariantProps<typeof ratingIconVariants>;
+export type RatingProps = RatingItemVariantProps & RatingIconVariantProps & Omit<ComponentPropsWithRef<"div">, "children" | "defaultValue" | "onChange"> & {
+    allowClear?: boolean;
+    allowHalf?: boolean;
+    defaultValue?: number;
+    disabled?: boolean;
+    errorMessage?: ReactNode;
+    getLabel?: (value: number, max: number) => string;
+    hint?: ReactNode;
+    icon?: RatingPresetIcon | IconType;
+    iconClassName?: string;
+    label?: ReactNode;
+    max?: number;
+    name?: string;
+    onValueChange?: (value: number) => void;
+    readOnly?: boolean;
+    value?: number;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/ui/rating/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/ui/rating/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAEzE,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAEpE,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAC7E,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE7E,MAAM,MAAM,WAAW,GAAG,sBAAsB,GAC9C,sBAAsB,GACtB,IAAI,CACF,qBAAqB,CAAC,KAAK,CAAC,EAC5B,UAAU,GAAG,cAAc,GAAG,UAAU,CACzC,GAAG;IACF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IAClD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,gBAAgB,GAAG,QAAQ,CAAC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}

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

@@ -0,0 +1,7 @@
+export declare const ratingItemVariants: (props?: ({
+    size?: "md" | "sm" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const ratingIconVariants: (props?: ({
+    appearance?: "default" | "outline" | "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;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//# sourceMappingURL=variants.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/rating/variants.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,kBAAkB;;8EAO7B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;8EAO7B,CAAC"}

package/dist/ui/rating.js

@@ -0,0 +1,319 @@
+"use client";
+'use strict';
+
+var chunkZS5756ZC_js = require('../chunk-ZS5756ZC.js');
+var react = require('react');
+var fa = require('react-icons/fa');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/design-system/rating.ts
+var zuiRatingRootBase = "grid w-fit gap-2 text-[color:var(--zui-rating-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-rating-label-fg-dark,oklch(98.4%_0.003_247.858))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50";
+var zuiRatingLabelBase = "text-sm font-medium leading-6 text-[color:var(--zui-rating-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-rating-label-fg-dark,oklch(98.4%_0.003_247.858))]";
+var zuiRatingHintBase = "max-w-sm text-xs leading-5 text-[color:var(--zui-rating-hint-fg,oklch(55.4%_0.046_257.417))] dark:text-[color:var(--zui-rating-hint-fg-dark,oklch(70.4%_0.04_256.788))]";
+var zuiRatingGroupBase = "flex w-fit flex-wrap items-center gap-[var(--zui-rating-gap,0.25rem)]";
+var zuiRatingItemBase = "relative inline-grid shrink-0 place-items-center text-[color:var(--zui-rating-empty,oklch(86.9%_0.022_252.894))] transition-transform duration-200 data-[interactive=true]:hover:-translate-y-0.5 dark:text-[color:var(--zui-rating-empty-dark,oklch(37.2%_0.044_257.287))]";
+var zuiRatingIconBase = "pointer-events-none col-start-1 row-start-1 transition-[clip-path,color,transform] duration-200 ease-out";
+var zuiRatingControlBase = "absolute inset-y-0 z-[1] cursor-pointer rounded-md bg-transparent outline-none transition-shadow focus-visible:ring-2 focus-visible:ring-[var(--zui-rating-ring-focus,oklch(54.6%_0.245_262.881_/_0.32))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus,#ffffff)] disabled:cursor-not-allowed dark:focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))]";
+var zuiRatingErrorBase = "text-sm leading-6 text-[color:var(--zui-rating-error-fg,oklch(58.6%_0.253_17.585))] dark:text-[color:var(--zui-rating-error-fg-dark,oklch(71.2%_0.194_13.428))]";
+var zuiRatingSizes = {
+  sm: "size-5 text-lg",
+  md: "size-7 text-2xl",
+  lg: "size-9 text-3xl"
+};
+var zuiRatingAppearances = {
+  default: "text-[color:var(--zui-rating-default-active,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-rating-default-active-dark,oklch(98.4%_0.003_247.858))]",
+  secondary: "text-[color:var(--zui-rating-secondary-active,oklch(44.6%_0.043_257.281))] dark:text-[color:var(--zui-rating-secondary-active-dark,oklch(86.9%_0.022_252.894))]",
+  destructive: "text-[color:var(--zui-rating-destructive-active,oklch(58.6%_0.253_17.585))] dark:text-[color:var(--zui-rating-destructive-active-dark,oklch(71.2%_0.194_13.428))]",
+  outline: "text-[color:var(--zui-rating-outline-active,oklch(44.6%_0.043_257.281))] dark:text-[color:var(--zui-rating-outline-active-dark,oklch(86.9%_0.022_252.894))]",
+  ghost: "text-[color:var(--zui-rating-ghost-active,oklch(37.2%_0.044_257.287))] dark:text-[color:var(--zui-rating-ghost-active-dark,oklch(92.9%_0.013_255.508))]",
+  glass: "text-[color:var(--zui-rating-glass-active,oklch(54.6%_0.245_262.881))] drop-shadow-[0_2px_12px_rgba(59,130,246,0.25)] dark:text-[color:var(--zui-rating-glass-active-dark,oklch(78.9%_0.154_211.53))]",
+  emerald: "text-[color:var(--zui-rating-emerald-active,oklch(59.6%_0.145_163.225))] dark:text-[color:var(--zui-rating-emerald-active-dark,oklch(77.7%_0.152_181.912))]",
+  indigo: "text-[color:var(--zui-rating-indigo-active,oklch(51.1%_0.262_276.966))] dark:text-[color:var(--zui-rating-indigo-active-dark,oklch(67.3%_0.182_276.935))]",
+  purple: "text-[color:var(--zui-rating-purple-active,oklch(55.8%_0.288_302.321))] dark:text-[color:var(--zui-rating-purple-active-dark,oklch(71.4%_0.203_305.504))]",
+  pink: "text-[color:var(--zui-rating-pink-active,oklch(59.2%_0.249_0.584))] dark:text-[color:var(--zui-rating-pink-active-dark,oklch(71.8%_0.202_349.761))]",
+  rose: "text-[color:var(--zui-rating-rose-active,oklch(58.6%_0.253_17.585))] dark:text-[color:var(--zui-rating-rose-active-dark,oklch(71.2%_0.194_13.428))]",
+  sky: "text-[color:var(--zui-rating-sky-active,oklch(62.3%_0.214_259.815))] dark:text-[color:var(--zui-rating-sky-active-dark,oklch(74.6%_0.16_232.661))]",
+  teal: "text-[color:var(--zui-rating-teal-active,oklch(60%_0.118_184.704))] dark:text-[color:var(--zui-rating-teal-active-dark,oklch(77.7%_0.152_181.912))]",
+  yellow: "text-[color:var(--zui-rating-yellow-active,oklch(79.5%_0.184_86.047))] dark:text-[color:var(--zui-rating-yellow-active-dark,oklch(85.2%_0.199_91.936))]",
+  orange: "text-[color:var(--zui-rating-orange-active,oklch(64.6%_0.222_41.116))] dark:text-[color:var(--zui-rating-orange-active-dark,oklch(75%_0.183_55.934))]",
+  gray: "text-[color:var(--zui-rating-gray-active,oklch(55.1%_0.027_264.364))] dark:text-[color:var(--zui-rating-gray-active-dark,oklch(70.7%_0.022_261.325))]",
+  amber: "text-[color:var(--zui-rating-amber-active,oklch(76.9%_0.188_70.08))] dark:text-[color:var(--zui-rating-amber-active-dark,oklch(82.8%_0.189_84.429))]",
+  violet: "text-[color:var(--zui-rating-violet-active,oklch(54.1%_0.281_293.009))] dark:text-[color:var(--zui-rating-violet-active-dark,oklch(70.2%_0.183_293.541))]",
+  "gradient-blue": "text-[color:var(--zui-rating-gradient-blue-active,oklch(54.6%_0.245_262.881))] drop-shadow-[0_2px_12px_rgba(37,99,235,0.28)] dark:text-[color:var(--zui-rating-gradient-blue-active-dark,oklch(70.7%_0.165_254.624))]",
+  "gradient-green": "text-[color:var(--zui-rating-gradient-green-active,oklch(62.7%_0.194_149.214))] drop-shadow-[0_2px_12px_rgba(22,163,74,0.24)] dark:text-[color:var(--zui-rating-gradient-green-active-dark,oklch(79.2%_0.209_151.711))]",
+  "gradient-red": "text-[color:var(--zui-rating-gradient-red-active,oklch(57.7%_0.245_27.325))] drop-shadow-[0_2px_12px_rgba(220,38,38,0.24)] dark:text-[color:var(--zui-rating-gradient-red-active-dark,oklch(70.4%_0.191_22.216))]",
+  "gradient-yellow": "text-[color:var(--zui-rating-gradient-yellow-active,oklch(79.5%_0.184_86.047))] drop-shadow-[0_2px_12px_rgba(234,179,8,0.24)] dark:text-[color:var(--zui-rating-gradient-yellow-active-dark,oklch(85.2%_0.199_91.936))]",
+  "gradient-purple": "text-[color:var(--zui-rating-gradient-purple-active,oklch(62.7%_0.265_303.9))] drop-shadow-[0_2px_12px_rgba(147,51,234,0.24)] dark:text-[color:var(--zui-rating-gradient-purple-active-dark,oklch(71.4%_0.203_305.504))]",
+  "gradient-teal": "text-[color:var(--zui-rating-gradient-teal-active,oklch(60%_0.118_184.704))] drop-shadow-[0_2px_12px_rgba(13,148,136,0.24)] dark:text-[color:var(--zui-rating-gradient-teal-active-dark,oklch(77.7%_0.152_181.912))]",
+  "gradient-indigo": "text-[color:var(--zui-rating-gradient-indigo-active,oklch(51.1%_0.262_276.966))] drop-shadow-[0_2px_12px_rgba(79,70,229,0.24)] dark:text-[color:var(--zui-rating-gradient-indigo-active-dark,oklch(67.3%_0.182_276.935))]",
+  "gradient-pink": "text-[color:var(--zui-rating-gradient-pink-active,oklch(59.2%_0.249_0.584))] drop-shadow-[0_2px_12px_rgba(219,39,119,0.24)] dark:text-[color:var(--zui-rating-gradient-pink-active-dark,oklch(71.8%_0.202_349.761))]",
+  "gradient-orange": "text-[color:var(--zui-rating-gradient-orange-active,oklch(64.6%_0.222_41.116))] drop-shadow-[0_2px_12px_rgba(234,88,12,0.24)] dark:text-[color:var(--zui-rating-gradient-orange-active-dark,oklch(75%_0.183_55.934))]"
+};
+var ratingItemVariants = classVarianceAuthority.cva(zuiRatingItemBase, {
+  variants: {
+    size: zuiRatingSizes
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var ratingIconVariants = classVarianceAuthority.cva(zuiRatingIconBase, {
+  variants: {
+    appearance: zuiRatingAppearances
+  },
+  defaultVariants: {
+    appearance: "amber"
+  }
+});
+var PRESET_ICONS = {
+  star: fa.FaStar,
+  heart: fa.FaHeart,
+  flame: fa.FaFire,
+  thumb: fa.FaThumbsUp
+};
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function normalizeMax(max) {
+  const resolved = Number.isFinite(max) ? Number(max) : 5;
+  return Math.max(1, Math.min(10, Math.floor(resolved)));
+}
+function normalizeValue(value, max, allowHalf) {
+  const resolved = Number.isFinite(value) ? Number(value) : 0;
+  const step = allowHalf ? 0.5 : 1;
+  return clamp(Math.round(resolved / step) * step, 0, max);
+}
+function defaultGetLabel(value, max) {
+  return `${value} of ${max}`;
+}
+function resolveIcon(icon) {
+  if (!icon) {
+    return PRESET_ICONS.star;
+  }
+  if (typeof icon === "string") {
+    return PRESET_ICONS[icon] ?? PRESET_ICONS.star;
+  }
+  return icon;
+}
+function Rating(props) {
+  const {
+    allowClear = false,
+    allowHalf = false,
+    appearance,
+    className,
+    defaultValue = 0,
+    disabled,
+    errorMessage,
+    getLabel = defaultGetLabel,
+    hint,
+    icon,
+    iconClassName,
+    id,
+    label,
+    max = 5,
+    name,
+    onValueChange,
+    readOnly,
+    ref,
+    size,
+    value,
+    ...rest
+  } = props;
+  const generatedId = react.useId();
+  const rootId = id ?? generatedId;
+  const resolvedMax = normalizeMax(max);
+  const isControlled = value !== void 0;
+  const [uncontrolledValue, setUncontrolledValue] = react.useState(
+    () => normalizeValue(defaultValue, resolvedMax, allowHalf)
+  );
+  const [hoverValue, setHoverValue] = react.useState();
+  const resolvedValue = normalizeValue(
+    isControlled ? value : uncontrolledValue,
+    resolvedMax,
+    allowHalf
+  );
+  const displayValue = hoverValue ?? resolvedValue;
+  const Icon = resolveIcon(icon);
+  const interactive = !disabled && !readOnly;
+  const controlsDisabled = disabled || readOnly;
+  const step = allowHalf ? 0.5 : 1;
+  const labelId = `${rootId}-label`;
+  const hintId = `${rootId}-hint`;
+  const errorId = `${rootId}-error`;
+  const describedBy = [
+    hint !== void 0 ? hintId : void 0,
+    errorMessage !== void 0 ? errorId : void 0
+  ].filter(Boolean).join(" ");
+  const commitValue = react.useCallback(
+    (nextValue) => {
+      const normalized = normalizeValue(nextValue, resolvedMax, allowHalf);
+      const next = allowClear && normalized === resolvedValue ? 0 : normalized;
+      if (!isControlled) {
+        setUncontrolledValue(next);
+      }
+      onValueChange?.(next);
+    },
+    [
+      allowClear,
+      allowHalf,
+      isControlled,
+      onValueChange,
+      resolvedMax,
+      resolvedValue
+    ]
+  );
+  const handleKeyDown = react.useCallback(
+    (event) => {
+      if (!interactive) {
+        return;
+      }
+      const root = event.currentTarget.closest('[data-slot="rating"]');
+      const focusValue = (nextValue) => {
+        const control = root?.querySelector(
+          `button[data-value="${nextValue}"]`
+        );
+        control?.focus();
+      };
+      if (event.key === "ArrowRight" || event.key === "ArrowUp") {
+        event.preventDefault();
+        const nextValue = clamp(resolvedValue + step, step, resolvedMax);
+        commitValue(nextValue);
+        focusValue(nextValue);
+        return;
+      }
+      if (event.key === "ArrowLeft" || event.key === "ArrowDown") {
+        event.preventDefault();
+        const nextValue = clamp(resolvedValue - step, 0, resolvedMax);
+        commitValue(nextValue);
+        focusValue(nextValue === 0 ? step : nextValue);
+        return;
+      }
+      if (event.key === "Home") {
+        event.preventDefault();
+        commitValue(step);
+        focusValue(step);
+        return;
+      }
+      if (event.key === "End") {
+        event.preventDefault();
+        commitValue(resolvedMax);
+        focusValue(resolvedMax);
+      }
+    },
+    [commitValue, interactive, resolvedMax, resolvedValue, step]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      id: rootId,
+      className: chunkZS5756ZC_js.cn(zuiRatingRootBase, className),
+      "data-disabled": disabled ? "true" : void 0,
+      "data-readonly": readOnly ? "true" : void 0,
+      "data-slot": "rating",
+      ...rest,
+      children: [
+        label !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { id: labelId, className: zuiRatingLabelBase, children: label }),
+        hint !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { id: hintId, className: zuiRatingHintBase, children: hint }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "aria-describedby": describedBy || void 0,
+            "aria-invalid": errorMessage !== void 0 ? true : void 0,
+            "aria-labelledby": label !== void 0 ? labelId : void 0,
+            "aria-label": label === void 0 ? "Rating" : void 0,
+            className: zuiRatingGroupBase,
+            "data-slot": "rating-group",
+            onPointerLeave: () => setHoverValue(void 0),
+            role: "radiogroup",
+            children: Array.from({ length: resolvedMax }, (_, index) => {
+              const fullValue = index + 1;
+              const fillAmount = clamp(displayValue - index, 0, 1);
+              const clipStyle = {
+                clipPath: `inset(0 ${100 - fillAmount * 100}% 0 0)`
+              };
+              const itemOptions = allowHalf ? [fullValue - 0.5, fullValue] : [fullValue];
+              return /* @__PURE__ */ jsxRuntime.jsxs(
+                "span",
+                {
+                  className: ratingItemVariants({ size }),
+                  "data-interactive": interactive ? "true" : void 0,
+                  "data-slot": "rating-item",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Icon,
+                      {
+                        "aria-hidden": "true",
+                        className: chunkZS5756ZC_js.cn("col-start-1 row-start-1", iconClassName)
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Icon,
+                      {
+                        "aria-hidden": "true",
+                        className: chunkZS5756ZC_js.cn(
+                          ratingIconVariants({ appearance }),
+                          iconClassName
+                        ),
+                        "data-slot": "rating-icon-fill",
+                        style: clipStyle
+                      }
+                    ),
+                    itemOptions.map((optionValue, optionIndex) => /* @__PURE__ */ jsxRuntime.jsx(
+                      "button",
+                      {
+                        type: "button",
+                        "aria-checked": resolvedValue === optionValue,
+                        "aria-label": getLabel(optionValue, resolvedMax),
+                        className: chunkZS5756ZC_js.cn(
+                          zuiRatingControlBase,
+                          allowHalf ? optionIndex === 0 ? "left-0 w-1/2" : "right-0 w-1/2" : "inset-x-0"
+                        ),
+                        "data-slot": "rating-control",
+                        "data-value": optionValue,
+                        disabled: controlsDisabled,
+                        onClick: () => {
+                          if (interactive) {
+                            commitValue(optionValue);
+                          }
+                        },
+                        onKeyDown: handleKeyDown,
+                        onPointerEnter: () => {
+                          if (interactive) {
+                            setHoverValue(optionValue);
+                          }
+                        },
+                        role: "radio",
+                        tabIndex: resolvedValue === optionValue || resolvedValue === 0 && optionValue === step ? 0 : -1
+                      },
+                      optionValue
+                    ))
+                  ]
+                },
+                fullValue
+              );
+            })
+          }
+        ),
+        name !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "hidden",
+            name,
+            value: resolvedValue,
+            disabled
+          }
+        ),
+        errorMessage !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: zuiRatingErrorBase, children: errorMessage })
+      ]
+    }
+  );
+}
+Rating.displayName = "Rating";
+
+exports.Rating = Rating;
+exports.ratingIconVariants = ratingIconVariants;
+exports.ratingItemVariants = ratingItemVariants;
+//# sourceMappingURL=rating.js.map
+//# sourceMappingURL=rating.js.map