rating

1"use client";
2 
3import { Star } from "lucide-react";
4import {
5  Direction as DirectionPrimitive,
6  Slot as SlotPrimitive,
7} from "radix-ui";
8import * as React from "react";
9import { useComposedRefs } from "@/lib/compose-refs";
10import { cn } from "@/lib/utils";
11import { VisuallyHiddenInput } from "@/registry/bases/radix/components/visually-hidden-input";
12import { useAsRef } from "@/registry/bases/radix/hooks/use-as-ref";
13import { useIsomorphicLayoutEffect } from "@/registry/bases/radix/hooks/use-isomorphic-layout-effect";
14import { useLazyRef } from "@/registry/bases/radix/hooks/use-lazy-ref";
15 
16type Direction = "ltr" | "rtl";
17type Orientation = "horizontal" | "vertical";
18type ActivationMode = "automatic" | "manual";
19type Size = "default" | "sm" | "lg";
20type Step = 0.5 | 1;
21type DataState = "full" | "partial" | "empty";
22type FocusIntent = "first" | "last" | "prev" | "next";
23 
24type RootElement = React.ComponentRef<typeof Rating>;
25type ItemElement = React.ComponentRef<typeof RatingItem>;
26 
27const ROOT_NAME = "Rating";
28const ITEM_NAME = "RatingItem";
29 
30const ENTRY_FOCUS = "ratingFocusGroup.onEntryFocus";
31const EVENT_OPTIONS = { bubbles: false, cancelable: true };
32 
33function getItemId(id: string, value: number) {
34  return `${id}-item-${value}`;
35}
36 
37function getPartialFillGradientId(id: string, step: Step) {
38  return `partial-fill-gradient-${id}-${step}`;
39}
40 
41const MAP_KEY_TO_FOCUS_INTENT: Record<string, FocusIntent> = {
42  ArrowLeft: "prev",
43  ArrowUp: "prev",
44  ArrowRight: "next",
45  ArrowDown: "next",
46  Home: "first",
47  End: "last",
48};
49 
50function getDirectionAwareKey(key: string, dir?: Direction) {
51  if (dir !== "rtl") return key;
52  return key === "ArrowLeft"
53    ? "ArrowRight"
54    : key === "ArrowRight"
55      ? "ArrowLeft"
56      : key;
57}
58 
59function getFocusIntent(
60  event: React.KeyboardEvent<ItemElement>,
61  dir?: Direction,
62  orientation?: Orientation,
63) {
64  const key = getDirectionAwareKey(event.key, dir);
65  if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key))
66    return undefined;
67  if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key))
68    return undefined;
69  return MAP_KEY_TO_FOCUS_INTENT[key];
70}
71 
72function focusFirst(
73  candidates: React.RefObject<ItemElement | null>[],
74  preventScroll = false,
75) {
76  const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
77  for (const candidateRef of candidates) {
78    const candidate = candidateRef.current;
79    if (!candidate) continue;
80// … truncated