@brycks/core-front 0.3.1 → 0.3.2

package/dist/components/form/MultiSelect/MultiSelect.js

@@ -0,0 +1,393 @@
+import { jsxs as u, jsx as n } from "react/jsx-runtime";
+import { forwardRef as we, useState as h, useRef as D, useMemo as T, useCallback as v, useEffect as W } from "react";
+import { createPortal as xe } from "react-dom";
+import { cx as Se } from "../../../utils/styles.js";
+import { durations as $, easings as z } from "../../../design-system/tokens/motion.js";
+import { spacing as r } from "../../../design-system/tokens/spacing.js";
+import { componentPaddingX as j, componentHeights as B, componentGap as Ce } from "../../../design-system/primitives/sizing.js";
+import { fontSizes as k } from "../../../design-system/tokens/typography.js";
+const Ie = {
+  sm: { minHeight: B.sm, fontSize: k.base - 1, chipHeight: r[5], padding: j.xs, gap: r[1] },
+  md: { minHeight: B.md, fontSize: k.base, chipHeight: r[6], padding: j.sm, gap: r[1.5] },
+  lg: { minHeight: B.lg, fontSize: k.md, chipHeight: r[7], padding: j.sm, gap: r[2] }
+};
+function $e() {
+  return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M4 6l4 4 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function Q() {
+  return /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M3 3l6 6M9 3l-6 6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
+}
+function ze() {
+  return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M3 8l3 3 7-7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+const Le = we(function({
+  options: w,
+  value: x,
+  defaultValue: V = [],
+  onChange: P,
+  placeholder: F = "Select options...",
+  size: N = "md",
+  maxSelections: L,
+  searchable: Y = !0,
+  disabled: y = !1,
+  isInvalid: K = !1,
+  clearable: Z = !0,
+  emptyText: ee = "No options found",
+  closeOnSelect: X = !1,
+  "aria-label": q,
+  "aria-labelledby": te,
+  className: re,
+  testId: ne
+}, S) {
+  const [oe, ie] = h(V), [a, f] = h(!1), [p, R] = h(""), [l, c] = h(-1), [G, U] = h(!1), C = D(null), I = D(null), _ = D(null), i = x !== void 0 ? x : oe, s = Ie[N], M = T(
+    () => w.filter((e) => i.includes(e.value)),
+    [w, i]
+  ), E = T(() => {
+    let e = w.filter(
+      (o) => !o.disabled && (o.label.toLowerCase().includes(p.toLowerCase()) || o.description?.toLowerCase().includes(p.toLowerCase()))
+    );
+    const t = /* @__PURE__ */ new Map();
+    return e.forEach((o) => {
+      const g = o.group;
+      t.has(g) || t.set(g, []), t.get(g).push(o);
+    }), t;
+  }, [w, p]), m = T(() => {
+    const e = [];
+    return E.forEach((t) => e.push(...t)), e;
+  }, [E]), d = v(
+    (e) => {
+      x === void 0 && ie(e), P?.(e);
+    },
+    [x, P]
+  ), H = v(
+    (e) => {
+      if (i.includes(e))
+        d(i.filter((o) => o !== e));
+      else {
+        if (L && i.length >= L) return;
+        d([...i, e]);
+      }
+      X && f(!1), R(""), I.current?.focus();
+    },
+    [i, L, X, d]
+  ), O = v(
+    (e, t) => {
+      t?.stopPropagation(), d(i.filter((o) => o !== e));
+    },
+    [i, d]
+  ), ae = v(
+    (e) => {
+      e.stopPropagation(), d([]), I.current?.focus();
+    },
+    [d]
+  ), se = v(
+    (e) => {
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault(), a ? c((t) => Math.min(t + 1, m.length - 1)) : (f(!0), c(0));
+          break;
+        case "ArrowUp":
+          e.preventDefault(), a && c((t) => Math.max(t - 1, 0));
+          break;
+        case "Enter":
+          e.preventDefault(), a && l >= 0 && m[l] && H(m[l].value);
+          break;
+        case "Escape":
+          e.preventDefault(), f(!1), c(-1);
+          break;
+        case "Backspace":
+          !p && i.length > 0 && O(i[i.length - 1]);
+          break;
+      }
+    },
+    [a, l, m, p, i, H, O]
+  );
+  W(() => {
+    if (!a) return;
+    const e = (t) => {
+      C.current?.contains(t.target) || (f(!1), c(-1), R(""));
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, [a]), W(() => {
+    if (!a || l < 0) return;
+    _.current?.querySelectorAll('[role="option"]')?.[l]?.scrollIntoView({ block: "nearest" });
+  }, [a, l]);
+  const [A, le] = h({ top: 0, left: 0, width: 0 });
+  W(() => {
+    if (!a || !C.current) return;
+    const e = () => {
+      const t = C.current.getBoundingClientRect();
+      le({
+        top: t.bottom + window.scrollY + r[1],
+        left: t.left + window.scrollX,
+        width: t.width
+      });
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [a]);
+  const ce = {
+    position: "relative",
+    width: "100%"
+  }, de = {
+    display: "flex",
+    flexWrap: "wrap",
+    alignItems: "center",
+    gap: s.gap,
+    minHeight: s.minHeight,
+    padding: `${r[1]}px ${s.padding}px`,
+    paddingRight: r[10],
+    backgroundColor: y ? "var(--brycks-background-muted)" : "var(--brycks-background-default)",
+    border: `1px solid ${K ? "var(--brycks-error-default)" : G ? "var(--brycks-primary-default)" : "var(--brycks-border-default)"}`,
+    borderRadius: "var(--brycks-radius-md)",
+    transition: `all ${$.fast}ms ${z.easeOut}`,
+    cursor: y ? "not-allowed" : "pointer",
+    boxShadow: G ? "var(--brycks-focus-ring)" : void 0
+  }, ue = {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: r[1],
+    height: s.chipHeight,
+    padding: `0 ${r[2]}px`,
+    fontSize: s.fontSize - 1,
+    fontWeight: 500,
+    color: "var(--brycks-foreground-default)",
+    backgroundColor: "var(--brycks-background-muted)",
+    borderRadius: "var(--brycks-radius-full)",
+    whiteSpace: "nowrap"
+  }, fe = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: r[4],
+    height: r[4],
+    marginLeft: r[0.5],
+    marginRight: -r[1],
+    color: "inherit",
+    opacity: 0.7,
+    cursor: "pointer",
+    borderRadius: "var(--brycks-radius-full)"
+  }, pe = {
+    flex: 1,
+    minWidth: 60,
+    height: s.chipHeight,
+    padding: 0,
+    fontSize: s.fontSize,
+    color: "var(--brycks-foreground-default)",
+    backgroundColor: "transparent",
+    border: "none",
+    outline: "none"
+  }, ge = {
+    position: "absolute",
+    right: s.padding,
+    top: "50%",
+    transform: "translateY(-50%)",
+    display: "flex",
+    alignItems: "center",
+    gap: r[1]
+  }, he = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: r[5],
+    height: r[5],
+    color: "var(--brycks-foreground-muted)",
+    cursor: "pointer",
+    borderRadius: "var(--brycks-radius-sm)",
+    transition: `all ${$.fast}ms ${z.easeOut}`
+  }, ye = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    color: "var(--brycks-foreground-muted)",
+    transform: a ? "rotate(180deg)" : "rotate(0)",
+    transition: `transform ${$.fast}ms ${z.easeOut}`,
+    pointerEvents: "none"
+  }, me = {
+    position: "absolute",
+    top: A.top,
+    left: A.left,
+    width: A.width,
+    maxHeight: 300,
+    overflowY: "auto",
+    backgroundColor: "var(--brycks-background-elevated)",
+    border: "1px solid var(--brycks-border-default)",
+    borderRadius: "var(--brycks-radius-lg)",
+    boxShadow: "var(--brycks-shadow-lg)",
+    zIndex: "var(--brycks-z-dropdown)",
+    padding: r[1]
+  }, be = {
+    padding: `${r[2]}px ${r[3]}px ${r[1]}px`,
+    fontSize: k.xs,
+    fontWeight: 600,
+    color: "var(--brycks-foreground-muted)",
+    textTransform: "uppercase",
+    letterSpacing: "0.05em"
+  }, ve = (e, t) => ({
+    display: "flex",
+    alignItems: "center",
+    gap: Ce.md,
+    padding: `${r[2]}px ${r[3]}px`,
+    fontSize: s.fontSize,
+    color: "var(--brycks-foreground-default)",
+    backgroundColor: e ? "var(--brycks-background-muted)" : "transparent",
+    borderRadius: "var(--brycks-radius-md)",
+    cursor: "pointer",
+    transition: `background-color ${$.fast}ms ${z.easeOut}`
+  }), ke = {
+    padding: `${r[4]}px ${r[3]}px`,
+    fontSize: s.fontSize,
+    color: "var(--brycks-foreground-muted)",
+    textAlign: "center"
+  };
+  let J = -1;
+  return /* @__PURE__ */ u(
+    "div",
+    {
+      ref: (e) => {
+        C.current = e, typeof S == "function" ? S(e) : S && (S.current = e);
+      },
+      className: Se("brycks-multiselect", `brycks-multiselect--${N}`, re),
+      style: ce,
+      "data-testid": ne,
+      children: [
+        /* @__PURE__ */ u(
+          "div",
+          {
+            style: de,
+            onClick: () => {
+              y || (f(!0), I.current?.focus());
+            },
+            children: [
+              M.map((e) => /* @__PURE__ */ u("span", { style: ue, children: [
+                e.label,
+                /* @__PURE__ */ n(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": `Remove ${e.label}`,
+                    style: fe,
+                    onClick: (t) => O(e.value, t),
+                    onMouseEnter: (t) => {
+                      t.currentTarget.style.opacity = "1", t.currentTarget.style.backgroundColor = "rgba(0,0,0,0.1)";
+                    },
+                    onMouseLeave: (t) => {
+                      t.currentTarget.style.opacity = "0.7", t.currentTarget.style.backgroundColor = "transparent";
+                    },
+                    children: /* @__PURE__ */ n(Q, {})
+                  }
+                )
+              ] }, e.value)),
+              Y && /* @__PURE__ */ n(
+                "input",
+                {
+                  ref: I,
+                  type: "text",
+                  role: "combobox",
+                  "aria-label": q,
+                  "aria-labelledby": te,
+                  "aria-expanded": a,
+                  "aria-haspopup": "listbox",
+                  "aria-autocomplete": "list",
+                  "aria-invalid": K,
+                  value: p,
+                  placeholder: M.length === 0 ? F : "",
+                  disabled: y,
+                  style: pe,
+                  onChange: (e) => {
+                    R(e.target.value), a || f(!0), c(0);
+                  },
+                  onKeyDown: se,
+                  onFocus: () => U(!0),
+                  onBlur: () => U(!1)
+                }
+              ),
+              !Y && M.length === 0 && /* @__PURE__ */ n("span", { style: { color: "var(--brycks-foreground-muted)", fontSize: s.fontSize }, children: F }),
+              /* @__PURE__ */ u("div", { style: ge, children: [
+                Z && i.length > 0 && !y && /* @__PURE__ */ n(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": "Clear all",
+                    style: he,
+                    onClick: ae,
+                    onMouseEnter: (e) => {
+                      e.currentTarget.style.backgroundColor = "var(--brycks-background-muted)", e.currentTarget.style.color = "var(--brycks-foreground-default)";
+                    },
+                    onMouseLeave: (e) => {
+                      e.currentTarget.style.backgroundColor = "transparent", e.currentTarget.style.color = "var(--brycks-foreground-muted)";
+                    },
+                    children: /* @__PURE__ */ n(Q, {})
+                  }
+                ),
+                /* @__PURE__ */ n("span", { style: ye, children: /* @__PURE__ */ n($e, {}) })
+              ] })
+            ]
+          }
+        ),
+        a && xe(
+          /* @__PURE__ */ n(
+            "ul",
+            {
+              ref: _,
+              role: "listbox",
+              "aria-label": q || "Options",
+              "aria-multiselectable": "true",
+              style: me,
+              children: m.length > 0 ? Array.from(E.entries()).map(([e, t]) => /* @__PURE__ */ u("li", { role: "group", "aria-label": e, children: [
+                e && /* @__PURE__ */ n("div", { style: be, children: e }),
+                /* @__PURE__ */ n("ul", { role: "presentation", style: { listStyle: "none", margin: 0, padding: 0 }, children: t.map((o) => {
+                  J++;
+                  const g = J, b = i.includes(o.value);
+                  return /* @__PURE__ */ u(
+                    "li",
+                    {
+                      role: "option",
+                      "aria-selected": b,
+                      style: ve(g === l),
+                      onClick: () => H(o.value),
+                      onMouseEnter: () => c(g),
+                      children: [
+                        /* @__PURE__ */ n(
+                          "span",
+                          {
+                            style: {
+                              display: "flex",
+                              alignItems: "center",
+                              justifyContent: "center",
+                              width: r[5],
+                              height: r[5],
+                              borderRadius: "var(--brycks-radius-sm)",
+                              border: b ? "none" : "1px solid var(--brycks-border-default)",
+                              backgroundColor: b ? "var(--brycks-primary-default)" : "transparent",
+                              color: "white",
+                              flexShrink: 0
+                            },
+                            children: b && /* @__PURE__ */ n(ze, {})
+                          }
+                        ),
+                        o.icon && /* @__PURE__ */ n("span", { style: { flexShrink: 0 }, children: o.icon }),
+                        /* @__PURE__ */ u("div", { style: { flex: 1, minWidth: 0 }, children: [
+                          /* @__PURE__ */ n("div", { style: { fontWeight: b ? 500 : 400 }, children: o.label }),
+                          o.description && /* @__PURE__ */ n("div", { style: { fontSize: k.sm, color: "var(--brycks-foreground-muted)" }, children: o.description })
+                        ] })
+                      ]
+                    },
+                    o.value
+                  );
+                }) })
+              ] }, e || "ungrouped")) : /* @__PURE__ */ n("li", { style: ke, children: ee })
+            }
+          ),
+          document.body
+        )
+      ]
+    }
+  );
+});
+Le.displayName = "MultiSelect";
+export {
+  Le as MultiSelect
+};
+//# sourceMappingURL=MultiSelect.js.map

package/dist/components/form/MultiSelect/MultiSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiSelect.js","sources":["../../../../src/components/form/MultiSelect/MultiSelect.tsx"],"sourcesContent":["/**\n * MultiSelect Component\n *\n * A dropdown component for selecting multiple options.\n * Displays selected items as chips with removal capability.\n *\n * @module components/form/MultiSelect\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  useMemo,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentPaddingX, componentGap } from '../../../design-system/primitives'\n\nexport type MultiSelectSize = 'sm' | 'md' | 'lg'\n\nexport interface MultiSelectOption {\n  /** Unique identifier */\n  value: string\n  /** Display label */\n  label: string\n  /** Optional description */\n  description?: string\n  /** Optional icon */\n  icon?: ReactNode\n  /** Whether the option is disabled */\n  disabled?: boolean\n  /** Optional group */\n  group?: string\n}\n\nexport interface MultiSelectProps {\n  /** Available options */\n  options: MultiSelectOption[]\n  /** Selected values (controlled) */\n  value?: string[]\n  /** Default selected values (uncontrolled) */\n  defaultValue?: string[]\n  /** Callback when selection changes */\n  onChange?: (values: string[]) => void\n  /** Placeholder text */\n  placeholder?: string\n  /** Component size */\n  size?: MultiSelectSize\n  /** Maximum selections allowed */\n  maxSelections?: number\n  /** Whether the select is searchable */\n  searchable?: boolean\n  /** Whether the select is disabled */\n  disabled?: boolean\n  /** Whether the select is invalid */\n  isInvalid?: boolean\n  /** Whether to allow clearing all */\n  clearable?: boolean\n  /** Text when no options match search */\n  emptyText?: string\n  /** Whether to close on select */\n  closeOnSelect?: boolean\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** ID of element that labels this select */\n  'aria-labelledby'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<MultiSelectSize, { minHeight: number; fontSize: number; chipHeight: number; padding: number; gap: number }> = {\n  sm: { minHeight: componentHeights.sm, fontSize: fontSizes.base - 1, chipHeight: spacing[5], padding: componentPaddingX.xs, gap: spacing[1] },\n  md: { minHeight: componentHeights.md, fontSize: fontSizes.base, chipHeight: spacing[6], padding: componentPaddingX.sm, gap: spacing[1.5] },\n  lg: { minHeight: componentHeights.lg, fontSize: fontSizes.md, chipHeight: spacing[7], padding: componentPaddingX.sm, gap: spacing[2] },\n}\n\nfunction ChevronDownIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M4 6l4 4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  )\n}\n\nfunction CloseIcon() {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n  )\n}\n\nfunction CheckIcon() {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 8l3 3 7-7\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  )\n}\n\nexport const MultiSelect = forwardRef<HTMLDivElement, MultiSelectProps>(function MultiSelect(\n  {\n    options,\n    value: controlledValue,\n    defaultValue = [],\n    onChange,\n    placeholder = 'Select options...',\n    size = 'md',\n    maxSelections,\n    searchable = true,\n    disabled = false,\n    isInvalid = false,\n    clearable = true,\n    emptyText = 'No options found',\n    closeOnSelect = false,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledby,\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState<string[]>(defaultValue)\n  const [isOpen, setIsOpen] = useState(false)\n  const [searchValue, setSearchValue] = useState('')\n  const [activeIndex, setActiveIndex] = useState(-1)\n  const [isFocused, setIsFocused] = useState(false)\n\n  const containerRef = useRef<HTMLDivElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const listRef = useRef<HTMLUListElement>(null)\n\n  const value = controlledValue !== undefined ? controlledValue : internalValue\n  const config = sizeConfig[size]\n\n  // Get selected options\n  const selectedOptions = useMemo(\n    () => options.filter((opt) => value.includes(opt.value)),\n    [options, value]\n  )\n\n  // Filter and group options\n  const filteredOptions = useMemo(() => {\n    let filtered = options.filter(\n      (opt) =>\n        !opt.disabled &&\n        (opt.label.toLowerCase().includes(searchValue.toLowerCase()) ||\n          opt.description?.toLowerCase().includes(searchValue.toLowerCase()))\n    )\n\n    // Group by group property\n    const groups = new Map<string | undefined, MultiSelectOption[]>()\n    filtered.forEach((opt) => {\n      const group = opt.group\n      if (!groups.has(group)) {\n        groups.set(group, [])\n      }\n      groups.get(group)!.push(opt)\n    })\n\n    return groups\n  }, [options, searchValue])\n\n  // Flatten for keyboard navigation\n  const flatOptions = useMemo(() => {\n    const flat: MultiSelectOption[] = []\n    filteredOptions.forEach((opts) => flat.push(...opts))\n    return flat\n  }, [filteredOptions])\n\n  const updateValue = useCallback(\n    (newValue: string[]) => {\n      if (controlledValue === undefined) {\n        setInternalValue(newValue)\n      }\n      onChange?.(newValue)\n    },\n    [controlledValue, onChange]\n  )\n\n  const toggleOption = useCallback(\n    (optionValue: string) => {\n      const isSelected = value.includes(optionValue)\n\n      if (isSelected) {\n        updateValue(value.filter((v) => v !== optionValue))\n      } else {\n        if (maxSelections && value.length >= maxSelections) return\n        updateValue([...value, optionValue])\n      }\n\n      if (closeOnSelect) {\n        setIsOpen(false)\n      }\n\n      setSearchValue('')\n      inputRef.current?.focus()\n    },\n    [value, maxSelections, closeOnSelect, updateValue]\n  )\n\n  const removeOption = useCallback(\n    (optionValue: string, e?: React.MouseEvent) => {\n      e?.stopPropagation()\n      updateValue(value.filter((v) => v !== optionValue))\n    },\n    [value, updateValue]\n  )\n\n  const clearAll = useCallback(\n    (e: React.MouseEvent) => {\n      e.stopPropagation()\n      updateValue([])\n      inputRef.current?.focus()\n    },\n    [updateValue]\n  )\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault()\n          if (!isOpen) {\n            setIsOpen(true)\n            setActiveIndex(0)\n          } else {\n            setActiveIndex((prev) => Math.min(prev + 1, flatOptions.length - 1))\n          }\n          break\n        case 'ArrowUp':\n          e.preventDefault()\n          if (isOpen) {\n            setActiveIndex((prev) => Math.max(prev - 1, 0))\n          }\n          break\n        case 'Enter':\n          e.preventDefault()\n          if (isOpen && activeIndex >= 0 && flatOptions[activeIndex]) {\n            toggleOption(flatOptions[activeIndex].value)\n          }\n          break\n        case 'Escape':\n          e.preventDefault()\n          setIsOpen(false)\n          setActiveIndex(-1)\n          break\n        case 'Backspace':\n          if (!searchValue && value.length > 0) {\n            removeOption(value[value.length - 1])\n          }\n          break\n      }\n    },\n    [isOpen, activeIndex, flatOptions, searchValue, value, toggleOption, removeOption]\n  )\n\n  // Close on outside click\n  useEffect(() => {\n    if (!isOpen) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (!containerRef.current?.contains(e.target as Node)) {\n        setIsOpen(false)\n        setActiveIndex(-1)\n        setSearchValue('')\n      }\n    }\n\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [isOpen])\n\n  // Scroll active option into view\n  useEffect(() => {\n    if (!isOpen || activeIndex < 0) return\n    const list = listRef.current\n    const items = list?.querySelectorAll('[role=\"option\"]')\n    const activeItem = items?.[activeIndex] as HTMLElement | undefined\n    activeItem?.scrollIntoView({ block: 'nearest' })\n  }, [isOpen, activeIndex])\n\n  // Calculate dropdown position\n  const [dropdownPosition, setDropdownPosition] = useState({ top: 0, left: 0, width: 0 })\n\n  useEffect(() => {\n    if (!isOpen || !containerRef.current) return\n\n    const updatePosition = () => {\n      const rect = containerRef.current!.getBoundingClientRect()\n      setDropdownPosition({\n        top: rect.bottom + window.scrollY + spacing[1],\n        left: rect.left + window.scrollX,\n        width: rect.width,\n      })\n    }\n\n    updatePosition()\n    window.addEventListener('resize', updatePosition)\n    window.addEventListener('scroll', updatePosition, true)\n\n    return () => {\n      window.removeEventListener('resize', updatePosition)\n      window.removeEventListener('scroll', updatePosition, true)\n    }\n  }, [isOpen])\n\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n  }\n\n  const wrapperStyle: CSSProperties = {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: config.gap,\n    minHeight: config.minHeight,\n    padding: `${spacing[1]}px ${config.padding}px`,\n    paddingRight: spacing[10],\n    backgroundColor: disabled ? 'var(--brycks-background-muted)' : 'var(--brycks-background-default)',\n    border: `1px solid ${\n      isInvalid\n        ? 'var(--brycks-error-default)'\n        : isFocused\n        ? 'var(--brycks-primary-default)'\n        : 'var(--brycks-border-default)'\n    }`,\n    borderRadius: 'var(--brycks-radius-md)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n    cursor: disabled ? 'not-allowed' : 'pointer',\n    boxShadow: isFocused ? 'var(--brycks-focus-ring)' : undefined,\n  }\n\n  const chipStyle: CSSProperties = {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: spacing[1],\n    height: config.chipHeight,\n    padding: `0 ${spacing[2]}px`,\n    fontSize: config.fontSize - 1,\n    fontWeight: 500,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'var(--brycks-background-muted)',\n    borderRadius: 'var(--brycks-radius-full)',\n    whiteSpace: 'nowrap',\n  }\n\n  const chipRemoveStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[4],\n    height: spacing[4],\n    marginLeft: spacing[0.5],\n    marginRight: -spacing[1],\n    color: 'inherit',\n    opacity: 0.7,\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-full)',\n  }\n\n  const inputStyle: CSSProperties = {\n    flex: 1,\n    minWidth: 60,\n    height: config.chipHeight,\n    padding: 0,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'transparent',\n    border: 'none',\n    outline: 'none',\n  }\n\n  const iconsStyle: CSSProperties = {\n    position: 'absolute',\n    right: config.padding,\n    top: '50%',\n    transform: 'translateY(-50%)',\n    display: 'flex',\n    alignItems: 'center',\n    gap: spacing[1],\n  }\n\n  const clearButtonStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[5],\n    height: spacing[5],\n    color: 'var(--brycks-foreground-muted)',\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-sm)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n  }\n\n  const chevronStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    color: 'var(--brycks-foreground-muted)',\n    transform: isOpen ? 'rotate(180deg)' : 'rotate(0)',\n    transition: `transform ${durations.fast}ms ${easings.easeOut}`,\n    pointerEvents: 'none',\n  }\n\n  const dropdownStyle: CSSProperties = {\n    position: 'absolute',\n    top: dropdownPosition.top,\n    left: dropdownPosition.left,\n    width: dropdownPosition.width,\n    maxHeight: 300,\n    overflowY: 'auto',\n    backgroundColor: 'var(--brycks-background-elevated)',\n    border: '1px solid var(--brycks-border-default)',\n    borderRadius: 'var(--brycks-radius-lg)',\n    boxShadow: 'var(--brycks-shadow-lg)',\n    zIndex: 'var(--brycks-z-dropdown)' as unknown as number,\n    padding: spacing[1],\n  }\n\n  const groupLabelStyle: CSSProperties = {\n    padding: `${spacing[2]}px ${spacing[3]}px ${spacing[1]}px`,\n    fontSize: fontSizes.xs,\n    fontWeight: 600,\n    color: 'var(--brycks-foreground-muted)',\n    textTransform: 'uppercase',\n    letterSpacing: '0.05em',\n  }\n\n  const optionStyle = (isActive: boolean, _isSelected: boolean): CSSProperties => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.md,\n    padding: `${spacing[2]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: isActive ? 'var(--brycks-background-muted)' : 'transparent',\n    borderRadius: 'var(--brycks-radius-md)',\n    cursor: 'pointer',\n    transition: `background-color ${durations.fast}ms ${easings.easeOut}`,\n  })\n\n  const emptyStyle: CSSProperties = {\n    padding: `${spacing[4]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-muted)',\n    textAlign: 'center',\n  }\n\n  let optionIndex = -1\n\n  return (\n    <div\n      ref={(node) => {\n        (containerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n        if (typeof ref === 'function') ref(node)\n        else if (ref) ref.current = node\n      }}\n      className={cx('brycks-multiselect', `brycks-multiselect--${size}`, className)}\n      style={containerStyle}\n      data-testid={testId}\n    >\n      <div\n        style={wrapperStyle}\n        onClick={() => {\n          if (!disabled) {\n            setIsOpen(true)\n            inputRef.current?.focus()\n          }\n        }}\n      >\n        {selectedOptions.map((opt) => (\n          <span key={opt.value} style={chipStyle}>\n            {opt.label}\n            <button\n              type=\"button\"\n              aria-label={`Remove ${opt.label}`}\n              style={chipRemoveStyle}\n              onClick={(e) => removeOption(opt.value, e)}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.opacity = '1'\n                e.currentTarget.style.backgroundColor = 'rgba(0,0,0,0.1)'\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.opacity = '0.7'\n                e.currentTarget.style.backgroundColor = 'transparent'\n              }}\n            >\n              <CloseIcon />\n            </button>\n          </span>\n        ))}\n        {searchable && (\n          <input\n            ref={inputRef}\n            type=\"text\"\n            role=\"combobox\"\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledby}\n            aria-expanded={isOpen}\n            aria-haspopup=\"listbox\"\n            aria-autocomplete=\"list\"\n            aria-invalid={isInvalid}\n            value={searchValue}\n            placeholder={selectedOptions.length === 0 ? placeholder : ''}\n            disabled={disabled}\n            style={inputStyle}\n            onChange={(e) => {\n              setSearchValue(e.target.value)\n              if (!isOpen) setIsOpen(true)\n              setActiveIndex(0)\n            }}\n            onKeyDown={handleKeyDown}\n            onFocus={() => setIsFocused(true)}\n            onBlur={() => setIsFocused(false)}\n          />\n        )}\n        {!searchable && selectedOptions.length === 0 && (\n          <span style={{ color: 'var(--brycks-foreground-muted)', fontSize: config.fontSize }}>\n            {placeholder}\n          </span>\n        )}\n        <div style={iconsStyle}>\n          {clearable && value.length > 0 && !disabled && (\n            <button\n              type=\"button\"\n              aria-label=\"Clear all\"\n              style={clearButtonStyle}\n              onClick={clearAll}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n                e.currentTarget.style.color = 'var(--brycks-foreground-default)'\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.backgroundColor = 'transparent'\n                e.currentTarget.style.color = 'var(--brycks-foreground-muted)'\n              }}\n            >\n              <CloseIcon />\n            </button>\n          )}\n          <span style={chevronStyle}>\n            <ChevronDownIcon />\n          </span>\n        </div>\n      </div>\n\n      {isOpen &&\n        createPortal(\n          <ul\n            ref={listRef}\n            role=\"listbox\"\n            aria-label={ariaLabel || 'Options'}\n            aria-multiselectable=\"true\"\n            style={dropdownStyle}\n          >\n            {flatOptions.length > 0 ? (\n              Array.from(filteredOptions.entries()).map(([group, opts]) => (\n                <li key={group || 'ungrouped'} role=\"group\" aria-label={group}>\n                  {group && <div style={groupLabelStyle}>{group}</div>}\n                  <ul role=\"presentation\" style={{ listStyle: 'none', margin: 0, padding: 0 }}>\n                    {opts.map((option) => {\n                      optionIndex++\n                      const currentIndex = optionIndex\n                      const isSelected = value.includes(option.value)\n                      const isActive = currentIndex === activeIndex\n\n                      return (\n                        <li\n                          key={option.value}\n                          role=\"option\"\n                          aria-selected={isSelected}\n                          style={optionStyle(isActive, isSelected)}\n                          onClick={() => toggleOption(option.value)}\n                          onMouseEnter={() => setActiveIndex(currentIndex)}\n                        >\n                          <span\n                            style={{\n                              display: 'flex',\n                              alignItems: 'center',\n                              justifyContent: 'center',\n                              width: spacing[5],\n                              height: spacing[5],\n                              borderRadius: 'var(--brycks-radius-sm)',\n                              border: isSelected\n                                ? 'none'\n                                : '1px solid var(--brycks-border-default)',\n                              backgroundColor: isSelected\n                                ? 'var(--brycks-primary-default)'\n                                : 'transparent',\n                              color: 'white',\n                              flexShrink: 0,\n                            }}\n                          >\n                            {isSelected && <CheckIcon />}\n                          </span>\n                          {option.icon && <span style={{ flexShrink: 0 }}>{option.icon}</span>}\n                          <div style={{ flex: 1, minWidth: 0 }}>\n                            <div style={{ fontWeight: isSelected ? 500 : 400 }}>{option.label}</div>\n                            {option.description && (\n                              <div style={{ fontSize: fontSizes.sm, color: 'var(--brycks-foreground-muted)' }}>\n                                {option.description}\n                              </div>\n                            )}\n                          </div>\n                        </li>\n                      )\n                    })}\n                  </ul>\n                </li>\n              ))\n            ) : (\n              <li style={emptyStyle}>{emptyText}</li>\n            )}\n          </ul>,\n          document.body\n        )}\n    </div>\n  )\n})\n\nMultiSelect.displayName = 'MultiSelect'\n"],"names":["sizeConfig","componentHeights","fontSizes","spacing","componentPaddingX","ChevronDownIcon","jsx","CloseIcon","CheckIcon","MultiSelect","forwardRef","options","controlledValue","defaultValue","onChange","placeholder","size","maxSelections","searchable","disabled","isInvalid","clearable","emptyText","closeOnSelect","ariaLabel","ariaLabelledby","className","testId","ref","internalValue","setInternalValue","useState","isOpen","setIsOpen","searchValue","setSearchValue","activeIndex","setActiveIndex","isFocused","setIsFocused","containerRef","useRef","inputRef","listRef","value","config","selectedOptions","useMemo","opt","filteredOptions","filtered","groups","group","flatOptions","flat","opts","updateValue","useCallback","newValue","toggleOption","optionValue","v","removeOption","e","clearAll","handleKeyDown","prev","useEffect","handleClick","dropdownPosition","setDropdownPosition","updatePosition","rect","containerStyle","wrapperStyle","durations","easings","chipStyle","chipRemoveStyle","inputStyle","iconsStyle","clearButtonStyle","chevronStyle","dropdownStyle","groupLabelStyle","optionStyle","isActive","_isSelected","componentGap","emptyStyle","optionIndex","jsxs","node","cx","createPortal","option","currentIndex","isSelected"],"mappings":"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"}

package/dist/components/form/Rating/Rating.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("react"),E=require("../../../utils/styles.cjs"),l=require("../../../design-system/tokens/spacing.cjs"),R=require("../../../design-system/tokens/motion.cjs"),P={sm:{size:l.spacing[4],gap:l.spacing[.5]},md:{size:l.spacing[5],gap:l.spacing[1]},lg:{size:l.spacing[6],gap:l.spacing[1]},xl:{size:l.spacing[8],gap:l.spacing[1.5]}};function j({filled:x,half:u}){return u?s.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",children:[s.jsx("defs",{children:s.jsxs("linearGradient",{id:"halfGradient",children:[s.jsx("stop",{offset:"50%",stopColor:"currentColor"}),s.jsx("stop",{offset:"50%",stopColor:"transparent"})]})}),s.jsx("path",{d:"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z",fill:"url(#halfGradient)",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}):s.jsx("svg",{viewBox:"0 0 24 24",fill:"none",children:s.jsx("path",{d:"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z",fill:x?"currentColor":"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}const M=c.forwardRef(function({value:u,defaultValue:S=0,onChange:L,max:f=5,size:C="md",allowHalf:i=!1,readOnly:v=!1,disabled:g=!1,allowClear:m=!0,filledIcon:z,emptyIcon:w,halfIcon:D,color:q="var(--brycks-warning-default)","aria-label":A="Rating",className:F,testId:$},B){const[V,G]=c.useState(S),[p,k]=c.useState(null),a=u!==void 0?u:V,d=p!==null?p:a,y=P[C],r=!v&&!g,o=c.useCallback(t=>{if(!r)return;const e=m&&t===a?0:t;u===void 0&&G(e),L?.(e)},[r,m,a,u,L]),I=c.useCallback((t,e)=>{if(!r)return;const n=t.currentTarget.getBoundingClientRect(),b=t.clientX-n.left<n.width/2;k(i&&b?e+.5:e+1)},[r,i]),T=c.useCallback((t,e)=>{if(!r)return;const n=t.currentTarget.getBoundingClientRect(),b=t.clientX-n.left<n.width/2;o(i&&b?e+.5:e+1)},[r,i,o]),K=c.useCallback(t=>{if(!r)return;const e=i?.5:1;switch(t.key){case"ArrowRight":case"ArrowUp":t.preventDefault(),o(Math.min(a+e,f));break;case"ArrowLeft":case"ArrowDown":t.preventDefault(),o(Math.max(a-e,0));break;case"Home":t.preventDefault(),o(0);break;case"End":t.preventDefault(),o(f);break}},[r,i,a,f,o]),N={display:"inline-flex",alignItems:"center",gap:y.gap,cursor:r?"pointer":"default",opacity:g?.5:1,outline:"none"},W=t=>{const e=t+1,n=d>=e,h=i&&d>=e-.5&&d<e;return{width:y.size,height:y.size,color:n||h?q:"var(--brycks-border-default)",transition:`all ${R.durations.fast}ms ${R.easings.easeOut}`,transform:p!==null&&p>=e?"scale(1.1)":"scale(1)"}},X=t=>{const e=t+1,n=d>=e;return i&&d>=e-.5&&d<e?D||s.jsx(j,{filled:!1,half:!0}):n?z||s.jsx(j,{filled:!0}):w||s.jsx(j,{filled:!1})};return s.jsx("div",{ref:B,role:"slider","aria-label":A,"aria-valuemin":0,"aria-valuemax":f,"aria-valuenow":a,"aria-valuetext":`${a} out of ${f} stars`,"aria-disabled":g,"aria-readonly":v,tabIndex:r?0:-1,className:E.cx("brycks-rating",`brycks-rating--${C}`,v&&"brycks-rating--readonly",g&&"brycks-rating--disabled",F),style:N,onKeyDown:K,onMouseLeave:()=>r&&k(null),"data-testid":$,children:Array.from({length:f},(t,e)=>s.jsx("span",{style:W(e),onMouseMove:n=>I(n,e),onClick:n=>T(n,e),children:X(e)},e))})});M.displayName="Rating";exports.Rating=M;
+//# sourceMappingURL=Rating.cjs.map

package/dist/components/form/Rating/Rating.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Rating.cjs","sources":["../../../../src/components/form/Rating/Rating.tsx"],"sourcesContent":["/**\n * Rating Component\n *\n * A star rating component for collecting user ratings.\n * Supports half stars, custom icons, and keyboard navigation.\n *\n * @module components/form/Rating\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n  type MouseEvent,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, durations, easings } from '../../../design-system'\n\nexport type RatingSize = 'sm' | 'md' | 'lg' | 'xl'\n\nexport interface RatingProps {\n  /** Current rating value */\n  value?: number\n  /** Default rating value (uncontrolled) */\n  defaultValue?: number\n  /** Callback when rating changes */\n  onChange?: (value: number) => void\n  /** Maximum rating (number of stars) */\n  max?: number\n  /** Component size */\n  size?: RatingSize\n  /** Whether to allow half stars */\n  allowHalf?: boolean\n  /** Whether the rating is read-only */\n  readOnly?: boolean\n  /** Whether the rating is disabled */\n  disabled?: boolean\n  /** Whether to allow clearing (clicking same value again) */\n  allowClear?: boolean\n  /** Custom filled icon */\n  filledIcon?: ReactNode\n  /** Custom empty icon */\n  emptyIcon?: ReactNode\n  /** Custom half-filled icon */\n  halfIcon?: ReactNode\n  /** Color for filled stars */\n  color?: string\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<RatingSize, { size: number; gap: number }> = {\n  sm: { size: spacing[4], gap: spacing[0.5] },\n  md: { size: spacing[5], gap: spacing[1] },\n  lg: { size: spacing[6], gap: spacing[1] },\n  xl: { size: spacing[8], gap: spacing[1.5] },\n}\n\nfunction StarIcon({ filled, half }: { filled: boolean; half?: boolean }) {\n  if (half) {\n    return (\n      <svg viewBox=\"0 0 24 24\" fill=\"none\">\n        <defs>\n          <linearGradient id=\"halfGradient\">\n            <stop offset=\"50%\" stopColor=\"currentColor\" />\n            <stop offset=\"50%\" stopColor=\"transparent\" />\n          </linearGradient>\n        </defs>\n        <path\n          d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n          fill=\"url(#halfGradient)\"\n          stroke=\"currentColor\"\n          strokeWidth=\"1.5\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n      </svg>\n    )\n  }\n\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\">\n      <path\n        d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n        fill={filled ? 'currentColor' : 'none'}\n        stroke=\"currentColor\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  )\n}\n\nexport const Rating = forwardRef<HTMLDivElement, RatingProps>(function Rating(\n  {\n    value: controlledValue,\n    defaultValue = 0,\n    onChange,\n    max = 5,\n    size = 'md',\n    allowHalf = false,\n    readOnly = false,\n    disabled = false,\n    allowClear = true,\n    filledIcon,\n    emptyIcon,\n    halfIcon,\n    color = 'var(--brycks-warning-default)',\n    'aria-label': ariaLabel = 'Rating',\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState(defaultValue)\n  const [hoverValue, setHoverValue] = useState<number | null>(null)\n\n  const value = controlledValue !== undefined ? controlledValue : internalValue\n  const displayValue = hoverValue !== null ? hoverValue : value\n  const config = sizeConfig[size]\n\n  const isInteractive = !readOnly && !disabled\n\n  const handleSelect = useCallback(\n    (newValue: number) => {\n      if (!isInteractive) return\n\n      // Allow clearing if clicking same value\n      const finalValue = allowClear && newValue === value ? 0 : newValue\n\n      if (controlledValue === undefined) {\n        setInternalValue(finalValue)\n      }\n      onChange?.(finalValue)\n    },\n    [isInteractive, allowClear, value, controlledValue, onChange]\n  )\n\n  const handleMouseMove = useCallback(\n    (e: MouseEvent<HTMLSpanElement>, starIndex: number) => {\n      if (!isInteractive) return\n\n      const rect = e.currentTarget.getBoundingClientRect()\n      const x = e.clientX - rect.left\n      const isLeftHalf = x < rect.width / 2\n\n      if (allowHalf && isLeftHalf) {\n        setHoverValue(starIndex + 0.5)\n      } else {\n        setHoverValue(starIndex + 1)\n      }\n    },\n    [isInteractive, allowHalf]\n  )\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLSpanElement>, starIndex: number) => {\n      if (!isInteractive) return\n\n      const rect = e.currentTarget.getBoundingClientRect()\n      const x = e.clientX - rect.left\n      const isLeftHalf = x < rect.width / 2\n\n      if (allowHalf && isLeftHalf) {\n        handleSelect(starIndex + 0.5)\n      } else {\n        handleSelect(starIndex + 1)\n      }\n    },\n    [isInteractive, allowHalf, handleSelect]\n  )\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLDivElement>) => {\n      if (!isInteractive) return\n\n      const step = allowHalf ? 0.5 : 1\n\n      switch (e.key) {\n        case 'ArrowRight':\n        case 'ArrowUp':\n          e.preventDefault()\n          handleSelect(Math.min(value + step, max))\n          break\n        case 'ArrowLeft':\n        case 'ArrowDown':\n          e.preventDefault()\n          handleSelect(Math.max(value - step, 0))\n          break\n        case 'Home':\n          e.preventDefault()\n          handleSelect(0)\n          break\n        case 'End':\n          e.preventDefault()\n          handleSelect(max)\n          break\n      }\n    },\n    [isInteractive, allowHalf, value, max, handleSelect]\n  )\n\n  const containerStyle: CSSProperties = {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: config.gap,\n    cursor: isInteractive ? 'pointer' : 'default',\n    opacity: disabled ? 0.5 : 1,\n    outline: 'none',\n  }\n\n  const starStyle = (index: number): CSSProperties => {\n    const starValue = index + 1\n    const isFilled = displayValue >= starValue\n    const isHalfFilled = allowHalf && displayValue >= starValue - 0.5 && displayValue < starValue\n\n    return {\n      width: config.size,\n      height: config.size,\n      color: isFilled || isHalfFilled ? color : 'var(--brycks-border-default)',\n      transition: `all ${durations.fast}ms ${easings.easeOut}`,\n      transform: hoverValue !== null && hoverValue >= starValue ? 'scale(1.1)' : 'scale(1)',\n    }\n  }\n\n  const renderStar = (index: number) => {\n    const starValue = index + 1\n    const isFilled = displayValue >= starValue\n    const isHalfFilled = allowHalf && displayValue >= starValue - 0.5 && displayValue < starValue\n\n    if (isHalfFilled) {\n      return halfIcon || <StarIcon filled={false} half />\n    }\n    if (isFilled) {\n      return filledIcon || <StarIcon filled />\n    }\n    return emptyIcon || <StarIcon filled={false} />\n  }\n\n  return (\n    <div\n      ref={ref}\n      role=\"slider\"\n      aria-label={ariaLabel}\n      aria-valuemin={0}\n      aria-valuemax={max}\n      aria-valuenow={value}\n      aria-valuetext={`${value} out of ${max} stars`}\n      aria-disabled={disabled}\n      aria-readonly={readOnly}\n      tabIndex={isInteractive ? 0 : -1}\n      className={cx(\n        'brycks-rating',\n        `brycks-rating--${size}`,\n        readOnly && 'brycks-rating--readonly',\n        disabled && 'brycks-rating--disabled',\n        className\n      )}\n      style={containerStyle}\n      onKeyDown={handleKeyDown}\n      onMouseLeave={() => isInteractive && setHoverValue(null)}\n      data-testid={testId}\n    >\n      {Array.from({ length: max }, (_, index) => (\n        <span\n          key={index}\n          style={starStyle(index)}\n          onMouseMove={(e) => handleMouseMove(e, index)}\n          onClick={(e) => handleClick(e, index)}\n        >\n          {renderStar(index)}\n        </span>\n      ))}\n    </div>\n  )\n})\n\nRating.displayName = 'Rating'\n"],"names":["sizeConfig","spacing","StarIcon","filled","half","jsxs","jsx","Rating","forwardRef","controlledValue","defaultValue","onChange","max","size","allowHalf","readOnly","disabled","allowClear","filledIcon","emptyIcon","halfIcon","color","ariaLabel","className","testId","ref","internalValue","setInternalValue","useState","hoverValue","setHoverValue","value","displayValue","config","isInteractive","handleSelect","useCallback","newValue","finalValue","handleMouseMove","e","starIndex","rect","isLeftHalf","handleClick","handleKeyDown","step","containerStyle","starStyle","index","starValue","isFilled","isHalfFilled","durations","easings","renderStar","cx","_"],"mappings":"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"}