64:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 65:T3115,"use client"; import { useId, useRef, useState, type CSSProperties, type PointerEvent as ReactPointerEvent, type KeyboardEvent as ReactKeyboardEvent } from "react"; const SAFE_COLOR = /^(#[0-9a-f]{3,8}|(rgb|hsl)a?$[\d\s.,%/-]+$)$/i; const SAFE_SIZE = /^(\d+(\.\d+)?(px|rem|em|cqw|vw)|(min|max|clamp|calc)$[\d\s.,%+*/()a-z-]+$)$/i; const STAR = "M12 2.6l2.9 5.9 6.5.95-4.7 4.58 1.1 6.47L12 17.45l-5.8 3.05 1.1-6.47L2.6 9.45l6.5-.95z"; const DEFAULT_LABELS = ["Poor", "Fair", "Good", "Great", "Excellent"]; const SPARKS = [0, 1, 2, 3, 4, 5]; const CSS = [ ":where(.sr){display:flex;align-items:center;gap:14px;-webkit-tap-highlight-color:transparent}", ".sr[data-disabled]{opacity:.45}", ".sr-row{position:relative;display:flex;gap:var(--sr-gap,4px);padding:6px 0;margin:-6px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none}", ".sr[data-live] .sr-row{cursor:pointer}", ".sr-star{position:relative;flex:none;width:var(--sr-size,28px);height:var(--sr-size,28px);transition:transform .38s cubic-bezier(.34,1.56,.64,1)}", ".sr-star[data-hot]{transform:scale(1.13)}", ".sr-star[data-hot][data-down]{transform:scale(.94);transition-duration:.12s}", ".sr-in{position:absolute;inset:0}", ".sr-in[data-pop]{animation:sr-pop .6s cubic-bezier(.34,1.56,.64,1) both}", ".sr-svg{display:block;width:var(--sr-size,28px);height:var(--sr-size,28px);overflow:visible}", ".sr-back{position:absolute;left:0;top:0;opacity:.5}", ".sr-clip{position:absolute;left:0;top:0;bottom:0;overflow:hidden;transition:width .22s cubic-bezier(.2,.8,.2,1),opacity .2s}", ".sr[data-preview] .sr-clip{opacity:.78}", ".sr-r{position:absolute;inset:-3px;margin:0;padding:0;border:0;border-radius:30%;background:none;appearance:none;-webkit-appearance:none;pointer-events:none;color:inherit}", ".sr-r:focus{outline:none}", ".sr-r:focus-visible{outline:2px solid currentColor;outline-offset:1px;border-radius:30%}", ".sr-sp{position:absolute;left:50%;top:50%;width:calc(var(--sr-size,28px)*.26);height:calc(var(--sr-size,28px)*.26);min-width:6px;min-height:6px;background:currentColor;clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%);pointer-events:none;animation:sr-spark .62s cubic-bezier(.2,.8,.2,1) both}", ".sr-label{display:flex;align-items:baseline;gap:.5em;min-width:7.4em;font-size:max(13px,calc(var(--sr-size,28px)*.36));line-height:1.2;font-variant-numeric:tabular-nums}", ".sr-word{display:inline-block;font-weight:600;animation:sr-word .3s cubic-bezier(.2,.8,.2,1) both}", ".sr-word[data-empty]{font-weight:500;opacity:.55}", ".sr-num{opacity:.5;font-size:.85em}", ".sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}", "@keyframes sr-pop{0%{transform:scale(.7) rotate(-14deg)}45%{transform:scale(1.34) rotate(6deg)}100%{transform:scale(1) rotate(0)}}", "@keyframes sr-spark{0%{opacity:1;transform:translate(-50%,-50%) rotate(var(--a)) translateX(calc(var(--sr-size,28px)*.28)) scale(.35)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateX(calc(var(--sr-size,28px)*var(--d,.95))) scale(1) rotate(80deg)}}", "@keyframes sr-word{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}", "@media (prefers-reduced-motion:reduce){.sr-star,.sr-clip{transition-duration:.01ms!important}.sr-star[data-hot]{transform:none}.sr-in[data-pop],.sr-sp,.sr-word{animation:none!important}.sr-sp{display:none}}", ].join("\n"); const clamp = (v: number, lo: number, hi: number) => Math.min(hi, Math.max(lo, v)); const fmt = (v: number) => (Number.isInteger(v) ? String(v) : v.toFixed(1)); export interface StarRatingProps { /** Number of stars. Default 5. */ max?: number; /** Starting rating when uncontrolled. Default 0. */ defaultRating?: number; /** Controlled rating. */ value?: number; /** Called with the new rating on every commit. */ onChange?: (rating: number) => void; /** 1 = whole stars (default), 0.5 = half stars. */ precision?: 1 | 0.5; /** Display only. Fractional ratings (4.3) draw a partly filled star. */ readOnly?: boolean; disabled?: boolean; /** Star size: a number of px, or a CSS length like "min(10cqw, 56px)". Default 28. */ size?: number | string; /** Hex / rgb / hsl. Default #ef4444. */ color?: string; /** Show the word label ("Great") beside the stars. Default false. */ showLabel?: boolean; /** Words for the label, lowest to highest. */ labels?: string[]; /** Label while nothing is rated. */ emptyLabel?: string; /** Accessible name of the group. */ label?: string; className?: string; } type Burst = { id: number; from: number; to: number }; export function StarRating({ max = 5, defaultRating = 0, value, onChange, precision = 1, readOnly = false, disabled = false, size, color = "#ef4444", showLabel = false, labels = DEFAULT_LABELS, emptyLabel = "Tap to rate", label = "Rating", className = "", }: StarRatingProps) { const n = clamp(Math.round(Number.isFinite(max) ? max : 5), 1, 12); const step = precision === 0.5 ? 0.5 : 1; const isControlled = value !== undefined; const [inner, setInner] = useState(defaultRating); const rating = clamp((isControlled ? value : inner) || 0, 0, n); const [hover, setHover] = useState(null); const [drag, setDrag] = useState(null); const [burst, setBurst] = useState(null); const rowRef = useRef(null); const gid = "sr" + useId().replace(/[^a-zA-Z0-9]/g, ""); const live = !readOnly && !disabled; const pointed = live ? (drag ?? hover) : null; const shown = pointed ?? rating; const accent = SAFE_COLOR.test(color) ? color : "#ef4444"; const vars: CSSProperties = {}; if (size !== undefined) { const s = typeof size === "number" ? (size > 0 ? size + "px" : "") : SAFE_SIZE.test(size) ? size : ""; if (s) (vars as Record)["--sr-size"] = s; } const wordFor = (v: number) => v <= 0 || labels.length === 0 ? emptyLabel : (labels[Math.min(labels.length - 1, Math.max(0, Math.ceil((v / n) * labels.length) - 1))] ?? ""); const commit = (v: number) => { const to = Math.ceil(v) - 1; const from = v > rating ? Math.max(0, Math.floor(rating)) : to; setBurst((b) => ({ id: (b?.id ?? 0) + 1, from: Math.min(from, to), to })); if (!isControlled) setInner(v); onChange?.(v); }; const valueAt = (clientX: number): number => { const stars = rowRef.current?.children; if (!stars || stars.length === 0) return step; const first = stars[0]!.getBoundingClientRect(); const second = stars[1]?.getBoundingClientRect(); const gap = second ? Math.max(0, second.left - first.right) : 0; for (let i = 0; i < stars.length; i++) { const r = stars[i]!.getBoundingClientRect(); if (clientX <= r.right + gap / 2) { const f = clamp((clientX - r.left) / r.width, 0, 1); return i + (step === 0.5 ? (f <= 0.5 ? 0.5 : 1) : 1); } } return n; }; const onPointerDown = (e: ReactPointerEvent) => { if (!live || (e.pointerType === "mouse" && e.button !== 0)) return; e.currentTarget.setPointerCapture(e.pointerId); setDrag(valueAt(e.clientX)); }; const onPointerMove = (e: ReactPointerEvent) => { if (!live) return; if (drag !== null) setDrag(valueAt(e.clientX)); else if (e.pointerType === "mouse") setHover(valueAt(e.clientX)); }; const onPointerUp = (e: ReactPointerEvent) => { if (drag === null) return; const v = valueAt(e.clientX); setDrag(null); setHover(e.pointerType === "mouse" ? v : null); commit(v); }; const onKeyDown = (e: ReactKeyboardEvent) => { if (!live) return; const cur = rating > 0 ? Math.ceil(rating / step) * step : 0; let next: number | null = null; if (e.key === "ArrowRight" || e.key === "ArrowUp") next = Math.min(n, cur + step); else if (e.key === "ArrowLeft" || e.key === "ArrowDown") next = Math.max(step, cur - step); else if (e.key === "Home") next = step; else if (e.key === "End") next = n; if (next === null) return; e.preventDefault(); commit(next); rowRef.current?.querySelector('[data-v="' + next + '"]')?.focus(); }; const tabTarget = rating > 0 ? Math.ceil(rating / step) * step : step; const hotIndex = pointed !== null && pointed > 0 ? Math.ceil(pointed) - 1 : -1; const radioValues = (i: number) => (step === 0.5 ? [i + 0.5, i + 1] : [i + 1]); const stars = Array.from({ length: n }, (_, i) => { const fill = clamp(shown - i, 0, 1); const inWave = burst !== null && i >= burst.from && i <= burst.to; return ( {live && radioValues(i).map((v) => (