@spark-ui/components 17.2.3-beta.1 → 17.2.4-beta.0

package/dist/rating/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/rating/RatingStar.styles.ts","../../src/rating/RatingStar.tsx","../../src/rating/utils.ts","../../src/rating/Rating.tsx"],"sourcesContent":["import { cva, cx, VariantProps } from 'class-variance-authority'\n\nconst emptyRemainingStarsOnHoverClass = cx('[&_>_div]:peer-hover:w-0!')\n\nconst ratingStarStyles = cva(['peer after:inset-0 group relative after:block after:absolute'], {\n  variants: {\n    disabled: {\n      true: 'opacity-dim-3',\n      false: '',\n    },\n    readOnly: {\n      true: '',\n      false: '',\n    },\n    gap: {\n      sm: ['after:w-[calc(100%+(var(--spacing-sm)))]', 'last-of-type:after:content-none'],\n      md: ['after:w-[calc(100%+(var(--spacing-md)))]', 'last-of-type:after:content-none'],\n    },\n  },\n  compoundVariants: [\n    {\n      readOnly: false,\n      disabled: false,\n      className: cx(\n        emptyRemainingStarsOnHoverClass,\n        'cursor-pointer transition-all duration-200 scale-100',\n        /* mouseOver / focusIn => scale 150 */\n        'hover:scale-150 focus-visible:scale-150',\n        /* mouseOut / focusOut / selection (click) => no scale; mouseMove clears selection => scale again */\n        '[&[data-suppress-scale]]:hover:scale-100 [&[data-suppress-scale]]:focus-visible:scale-100'\n      ),\n    },\n  ],\n  defaultVariants: {\n    disabled: false,\n    readOnly: false,\n    gap: 'sm',\n  },\n})\n\nconst ratingStarIconStyles = cva('', {\n  variants: {\n    size: {\n      sm: 'text-caption-link',\n      md: 'text-body-1',\n      lg: 'text-display-1',\n    },\n    design: {\n      filled: [\n        'text-main-variant',\n        'group-[[data-part=star][data-hovered]]:text-main-variant-hovered',\n      ],\n      outlined: ['text-on-surface/dim-3'],\n    },\n  },\n})\n\ntype RatingStarstylesProps = Omit<VariantProps<typeof ratingStarStyles>, 'gap'>\ntype RatingStarIconStylesProps = Omit<VariantProps<typeof ratingStarIconStyles>, 'design'>\n\nexport { ratingStarStyles, ratingStarIconStyles }\nexport type { RatingStarstylesProps, RatingStarIconStylesProps }\n","import { StarFill } from '@spark-ui/icons/StarFill'\nimport { StarOutline } from '@spark-ui/icons/StarOutline'\nimport { cx } from 'class-variance-authority'\nimport { type KeyboardEvent, type MouseEvent, type PropsWithChildren, Ref, useState } from 'react'\n\nimport { Icon } from '../icon'\nimport {\n  ratingStarIconStyles,\n  type RatingStarIconStylesProps,\n  ratingStarStyles,\n  type RatingStarstylesProps,\n} from './RatingStar.styles'\nimport type { StarValue } from './types'\n\nexport interface RatingStarProps\n  extends PropsWithChildren<RatingStarstylesProps>,\n    RatingStarIconStylesProps {\n  value: StarValue\n  /** Whether this radio option is selected (for radiogroup pattern). */\n  checked?: boolean\n  /** Accessible name for the radio (e.g. \"one star\", \"two stars\"). */\n  ariaLabel?: string\n  /** Accessible ids used to compose the radio name. */\n  ariaLabelledBy?: string\n  /** Tab index for roving tabindex (0 or -1). */\n  tabIndex?: number\n  onClick?: (event: MouseEvent<HTMLDivElement>) => void\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n  onMouseEnter?: (event: MouseEvent<HTMLDivElement>) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const RatingStar = ({\n  value,\n  size,\n  disabled,\n  readOnly,\n  checked = false,\n  ariaLabel,\n  ariaLabelledBy,\n  tabIndex,\n  onClick,\n  onKeyDown,\n  onMouseEnter,\n  children,\n  ref: forwardedRef,\n}: RatingStarProps) => {\n  const isInteractive = !disabled && !readOnly\n  const [justClicked, setJustClicked] = useState(false)\n\n  const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n    onClick?.(event)\n    if (isInteractive) setJustClicked(true)\n  }\n\n  const clearJustClicked = () => setJustClicked(false)\n\n  return (\n    <div\n      ref={forwardedRef}\n      role=\"radio\"\n      aria-checked={checked}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={tabIndex}\n      data-spark-component=\"rating-star\"\n      data-part=\"star\"\n      {...(isInteractive && justClicked && { 'data-suppress-scale': '' })}\n      className={ratingStarStyles({\n        gap: size === 'lg' ? 'md' : 'sm',\n        disabled,\n        readOnly,\n      })}\n      onClick={handleClick}\n      onKeyDown={onKeyDown}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={clearJustClicked}\n      onMouseMove={clearJustClicked}\n    >\n      <div\n        className={cx(\n          'z-raised absolute overflow-hidden',\n          'group-[[data-part=star][data-hovered]]:overflow-visible'\n        )}\n        style={{ width: value * 100 + '%' }}\n      >\n        <Icon\n          className={ratingStarIconStyles({\n            size,\n            design: 'filled',\n          })}\n        >\n          <StarFill />\n        </Icon>\n      </div>\n\n      <Icon className={ratingStarIconStyles({ size, design: 'outlined' })}>\n        <StarOutline />\n      </Icon>\n      {children}\n    </div>\n  )\n}\n","import { type StarValue } from './types'\n\nfunction getStarValue({ value, index }: { value?: number; index: number }): StarValue {\n  if (value === undefined) return 0\n\n  const starPosition = index + 1\n\n  return value >= starPosition ? 1 : 0\n}\n\nfunction splitAt<T>(arr: T[], index: number): [T[], T[]] {\n  const prev = arr.slice(0, index)\n  const next = arr.slice(index)\n\n  return [prev, next]\n}\n\nexport { getStarValue, splitAt }\n","/* eslint-disable max-lines-per-function */\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { cx } from 'class-variance-authority'\nimport {\n  type ComponentPropsWithRef,\n  type KeyboardEvent,\n  type MouseEvent,\n  type PropsWithChildren,\n  type RefObject,\n  useCallback,\n  useId,\n  useRef,\n  useState,\n} from 'react'\n\nimport { useFormFieldControl } from '../form-field'\nimport { RatingStar } from './RatingStar'\nimport type { RatingValue } from './types'\nimport { getStarValue, splitAt } from './utils'\n\nconst getRatingInteger = (value: number | undefined): RatingValue => {\n  if (value === undefined || !Number.isInteger(value) || value < 1) {\n    return 0\n  }\n\n  return Math.min(5, Math.max(1, value)) as RatingValue\n}\n\nfunction createStarKeyDownHandler(\n  index: number,\n  starRefList: RefObject<(HTMLDivElement | null)[]>,\n  setRatingValue: (value: RatingValue) => void,\n  isInteractive: boolean\n) {\n  return (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!isInteractive) return\n\n    switch (event.key) {\n      case 'ArrowRight':\n      case 'ArrowDown':\n        event.preventDefault()\n        const nextIndex = Math.min(4, index + 1)\n        setRatingValue((nextIndex + 1) as RatingValue)\n        starRefList.current[nextIndex]?.focus()\n        break\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        event.preventDefault()\n        const prevIndex = Math.max(0, index - 1)\n        setRatingValue((prevIndex + 1) as RatingValue)\n        starRefList.current[prevIndex]?.focus()\n        break\n      case ' ':\n        event.preventDefault()\n        setRatingValue((index + 1) as RatingValue)\n        break\n      default:\n        break\n    }\n  }\n}\n\nfunction getStarTabIndex(index: number, ratingValue: RatingValue): number {\n  if (ratingValue >= 1) {\n    return ratingValue - 1 === index ? 0 : -1\n  }\n\n  return index === 0 ? 0 : -1\n}\n\nexport interface RatingProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\n  /**\n   * Use the `defaultValue` prop to set the default value of the input, on a from 0 to 5.\n   *\n   * Use this when you want to use it in an uncontrolled manner\n   */\n  defaultValue?: RatingValue\n  /**\n   * The value is the number of the rating selected, on a scale from 0 to 5.\n   *\n   * Use this when you want to use it in a controlled manner,\n   * in conjunction with the `onValueChange` prop\n   */\n  value?: RatingValue\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: RatingValue) => void\n  /**\n   * Sets the component as interactive or not.\n   * @default undefined\n   */\n  readOnly?: boolean\n  /**\n   * When `true`, prevents the user from interacting.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must select a rating before form submission.\n   * @default false\n   */\n  required?: boolean\n  /**\n   * Name of the underlying hidden input (for form submission).\n   * @default undefined\n   */\n  name?: string\n  /**\n   * id of the underlying hidden input.\n   * @default undefined\n   */\n  id?: string\n  /**\n   * aria-label of the radiogroup.\n   * @default undefined\n   */\n  'aria-label'?: string\n  /**\n   * Returns the aria-label applied to each radio star.\n   * Defaults to `${aria-label} ${index + 1}`.\n   */\n  getStarLabel?: (index: number) => string\n}\n\nexport const Rating = ({\n  defaultValue,\n  value: propValue,\n  onValueChange,\n  disabled,\n  readOnly,\n  required: requiredProp,\n  name,\n  id,\n  'aria-label': ariaLabel,\n  getStarLabel,\n  ref,\n  ...rest\n}: RatingProps) => {\n  const {\n    labelId,\n    isInvalid,\n    isRequired,\n    description,\n    name: formFieldName,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n  } = useFormFieldControl()\n  const starRefList = useRef<(HTMLDivElement | null)[]>([])\n  const ratingId = useId()\n  const [hoveredStarIndex, setHoveredStarIndex] = useState<number | null>(null)\n  const [value, setRatingValue] = useCombinedState(propValue, defaultValue, onValueChange)\n  const ratingValue = getRatingInteger(value ?? 0)\n  const resolvedDisabled = disabled ?? formFieldDisabled\n  const resolvedReadOnly = readOnly ?? formFieldReadOnly\n  const required = requiredProp !== undefined ? requiredProp : isRequired\n  const groupName = name ?? formFieldName\n  const isInteractive = !(resolvedDisabled || resolvedReadOnly)\n  const hasExplicitStarLabel = getStarLabel !== undefined || ariaLabel !== undefined\n  const displayValue = hoveredStarIndex !== null ? hoveredStarIndex + 1 : ratingValue\n\n  function onStarClick(index: number) {\n    if (!isInteractive) return\n\n    const newValue = (index + 1) as RatingValue\n    setRatingValue(newValue)\n    starRefList.current[index]?.focus()\n  }\n\n  const onStarKeyDown = useCallback(\n    (index: number) => createStarKeyDownHandler(index, starRefList, setRatingValue, isInteractive),\n    [isInteractive, setRatingValue]\n  )\n\n  function onStarMouseEnter({ currentTarget }: MouseEvent<HTMLDivElement>) {\n    const currentStarIndex = starRefList.current.findIndex(star => star === currentTarget)\n    setHoveredStarIndex(currentStarIndex >= 0 ? currentStarIndex : null)\n    const [previousStars, followingStars] = splitAt(starRefList.current, currentStarIndex + 1)\n    previousStars.forEach(star => star?.setAttribute('data-hovered', ''))\n    followingStars.forEach(star => star?.removeAttribute('data-hovered'))\n  }\n\n  const handleStarRef = useCallback(\n    (index: number) => (elm: HTMLDivElement | null) => {\n      starRefList.current[index] = elm\n    },\n    []\n  )\n\n  function resetDataPartStarAttr() {\n    setHoveredStarIndex(null)\n    starRefList.current.forEach(star => star?.removeAttribute('data-hovered'))\n  }\n\n  return (\n    <div\n      ref={ref}\n      id={id}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      aria-labelledby={labelId}\n      aria-invalid={isInvalid}\n      aria-required={required}\n      aria-describedby={description}\n      className=\"relative inline-flex\"\n      data-spark-component=\"rating\"\n      {...rest}\n      onMouseLeave={resetDataPartStarAttr}\n    >\n      {groupName !== undefined && (\n        <input type=\"hidden\" name={groupName} value={ratingValue} aria-hidden data-part=\"input\" />\n      )}\n      <div className={cx('gap-x-md', 'flex')}>\n        {Array.from({ length: 5 }).map((_, index) => (\n          <RatingStar\n            ref={handleStarRef(index)}\n            key={index}\n            disabled={resolvedDisabled}\n            readOnly={resolvedReadOnly}\n            size=\"lg\"\n            value={getStarValue({ index, value: displayValue })}\n            checked={ratingValue === index + 1}\n            ariaLabel={\n              hasExplicitStarLabel\n                ? (getStarLabel?.(index) ?? `${ariaLabel} ${index + 1}`)\n                : undefined\n            }\n            ariaLabelledBy={\n              !hasExplicitStarLabel && labelId\n                ? `${labelId} ${ratingId}-star-${index + 1}`\n                : undefined\n            }\n            tabIndex={isInteractive ? getStarTabIndex(index, ratingValue) : -1}\n            onClick={() => onStarClick(index)}\n            onKeyDown={onStarKeyDown(index)}\n            onMouseEnter={event => isInteractive && onStarMouseEnter(event)}\n          >\n            {!hasExplicitStarLabel && (\n              <span id={`${ratingId}-star-${index + 1}`} className=\"sr-only\">\n                {index + 1}\n              </span>\n            )}\n          </RatingStar>\n        ))}\n      </div>\n    </div>\n  )\n}\n"],"names":["emptyRemainingStarsOnHoverClass","cx","ratingStarStyles","cva","ratingStarIconStyles","RatingStar","value","size","disabled","readOnly","checked","ariaLabel","ariaLabelledBy","tabIndex","onClick","onKeyDown","onMouseEnter","children","forwardedRef","isInteractive","justClicked","setJustClicked","useState","handleClick","event","clearJustClicked","jsxs","jsx","Icon","StarFill","StarOutline","getStarValue","index","starPosition","splitAt","arr","prev","next","getRatingInteger","createStarKeyDownHandler","starRefList","setRatingValue","nextIndex","prevIndex","getStarTabIndex","ratingValue","Rating","defaultValue","propValue","onValueChange","requiredProp","name","id","getStarLabel","ref","rest","labelId","isInvalid","isRequired","description","formFieldName","formFieldDisabled","formFieldReadOnly","useFormFieldControl","useRef","ratingId","useId","hoveredStarIndex","setHoveredStarIndex","useCombinedState","resolvedDisabled","resolvedReadOnly","required","groupName","hasExplicitStarLabel","displayValue","onStarClick","newValue","onStarKeyDown","useCallback","onStarMouseEnter","currentTarget","currentStarIndex","star","previousStars","followingStars","handleStarRef","elm","resetDataPartStarAttr","_"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/rating/RatingStar.styles.ts","../../src/rating/RatingStar.tsx","../../src/rating/utils.ts","../../src/rating/Rating.tsx"],"sourcesContent":["import { cva, cx, VariantProps } from 'class-variance-authority'\n\nconst emptyRemainingStarsOnHoverClass = cx('[&_>_div]:peer-hover:w-0!')\n\nconst ratingStarStyles = cva(['peer after:inset-0 group relative after:block after:absolute'], {\n  variants: {\n    disabled: {\n      true: 'opacity-dim-3',\n      false: '',\n    },\n    readOnly: {\n      true: '',\n      false: '',\n    },\n    gap: {\n      sm: ['after:w-[calc(100%+(var(--spacing-sm)))]', 'last-of-type:after:content-none'],\n      md: ['after:w-[calc(100%+(var(--spacing-md)))]', 'last-of-type:after:content-none'],\n    },\n  },\n  compoundVariants: [\n    {\n      readOnly: false,\n      disabled: false,\n      className: cx(\n        emptyRemainingStarsOnHoverClass,\n        'cursor-pointer transition-all duration-200 scale-100',\n        /* mouseOver / focusIn => scale 150 */\n        'hover:scale-150 focus-visible:scale-150',\n        /* mouseOut / focusOut / selection (click) => no scale; mouseMove clears selection => scale again */\n        '[&[data-suppress-scale]]:hover:scale-100 [&[data-suppress-scale]]:focus-visible:scale-100'\n      ),\n    },\n  ],\n  defaultVariants: {\n    disabled: false,\n    readOnly: false,\n    gap: 'sm',\n  },\n})\n\nconst ratingStarIconStyles = cva('', {\n  variants: {\n    size: {\n      sm: 'text-caption-link',\n      md: 'text-body-1',\n      lg: 'text-display-1',\n    },\n    design: {\n      filled: [\n        'text-main-variant',\n        'group-[[data-part=star][data-hovered]]:text-main-variant-hovered',\n      ],\n      outlined: ['text-on-surface/dim-3'],\n    },\n  },\n})\n\ntype RatingStarstylesProps = Omit<VariantProps<typeof ratingStarStyles>, 'gap'>\ntype RatingStarIconStylesProps = Omit<VariantProps<typeof ratingStarIconStyles>, 'design'>\n\nexport { ratingStarStyles, ratingStarIconStyles }\nexport type { RatingStarstylesProps, RatingStarIconStylesProps }\n","import { StarFill } from '@spark-ui/icons/StarFill'\nimport { StarOutline } from '@spark-ui/icons/StarOutline'\nimport { cx } from 'class-variance-authority'\nimport { type KeyboardEvent, type MouseEvent, type PropsWithChildren, Ref, useState } from 'react'\n\nimport { Icon } from '../icon'\nimport {\n  ratingStarIconStyles,\n  type RatingStarIconStylesProps,\n  ratingStarStyles,\n  type RatingStarstylesProps,\n} from './RatingStar.styles'\nimport type { StarValue } from './types'\n\nexport interface RatingStarProps\n  extends PropsWithChildren<RatingStarstylesProps>, RatingStarIconStylesProps {\n  value: StarValue\n  /** Whether this radio option is selected (for radiogroup pattern). */\n  checked?: boolean\n  /** Accessible name for the radio (e.g. \"one star\", \"two stars\"). */\n  ariaLabel?: string\n  /** Accessible ids used to compose the radio name. */\n  ariaLabelledBy?: string\n  /** Tab index for roving tabindex (0 or -1). */\n  tabIndex?: number\n  onClick?: (event: MouseEvent<HTMLDivElement>) => void\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n  onMouseEnter?: (event: MouseEvent<HTMLDivElement>) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const RatingStar = ({\n  value,\n  size,\n  disabled,\n  readOnly,\n  checked = false,\n  ariaLabel,\n  ariaLabelledBy,\n  tabIndex,\n  onClick,\n  onKeyDown,\n  onMouseEnter,\n  children,\n  ref: forwardedRef,\n}: RatingStarProps) => {\n  const isInteractive = !disabled && !readOnly\n  const [justClicked, setJustClicked] = useState(false)\n\n  const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n    onClick?.(event)\n    if (isInteractive) setJustClicked(true)\n  }\n\n  const clearJustClicked = () => setJustClicked(false)\n\n  return (\n    <div\n      ref={forwardedRef}\n      role=\"radio\"\n      aria-checked={checked}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={tabIndex}\n      data-spark-component=\"rating-star\"\n      data-part=\"star\"\n      {...(isInteractive && justClicked && { 'data-suppress-scale': '' })}\n      className={ratingStarStyles({\n        gap: size === 'lg' ? 'md' : 'sm',\n        disabled,\n        readOnly,\n      })}\n      onClick={handleClick}\n      onKeyDown={onKeyDown}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={clearJustClicked}\n      onMouseMove={clearJustClicked}\n    >\n      <div\n        className={cx(\n          'z-raised absolute overflow-hidden',\n          'group-[[data-part=star][data-hovered]]:overflow-visible'\n        )}\n        style={{ width: value * 100 + '%' }}\n      >\n        <Icon\n          className={ratingStarIconStyles({\n            size,\n            design: 'filled',\n          })}\n        >\n          <StarFill />\n        </Icon>\n      </div>\n\n      <Icon className={ratingStarIconStyles({ size, design: 'outlined' })}>\n        <StarOutline />\n      </Icon>\n      {children}\n    </div>\n  )\n}\n","import { type StarValue } from './types'\n\nfunction getStarValue({ value, index }: { value?: number; index: number }): StarValue {\n  if (value === undefined) return 0\n\n  const starPosition = index + 1\n\n  return value >= starPosition ? 1 : 0\n}\n\nfunction splitAt<T>(arr: T[], index: number): [T[], T[]] {\n  const prev = arr.slice(0, index)\n  const next = arr.slice(index)\n\n  return [prev, next]\n}\n\nexport { getStarValue, splitAt }\n","/* eslint-disable max-lines-per-function */\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { cx } from 'class-variance-authority'\nimport {\n  type ComponentPropsWithRef,\n  type KeyboardEvent,\n  type MouseEvent,\n  type PropsWithChildren,\n  type RefObject,\n  useCallback,\n  useId,\n  useRef,\n  useState,\n} from 'react'\n\nimport { useFormFieldControl } from '../form-field'\nimport { RatingStar } from './RatingStar'\nimport type { RatingValue } from './types'\nimport { getStarValue, splitAt } from './utils'\n\nconst getRatingInteger = (value: number | undefined): RatingValue => {\n  if (value === undefined || !Number.isInteger(value) || value < 1) {\n    return 0\n  }\n\n  return Math.min(5, Math.max(1, value)) as RatingValue\n}\n\nfunction createStarKeyDownHandler(\n  index: number,\n  starRefList: RefObject<(HTMLDivElement | null)[]>,\n  setRatingValue: (value: RatingValue) => void,\n  isInteractive: boolean\n) {\n  return (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!isInteractive) return\n\n    switch (event.key) {\n      case 'ArrowRight':\n      case 'ArrowDown':\n        event.preventDefault()\n        const nextIndex = Math.min(4, index + 1)\n        setRatingValue((nextIndex + 1) as RatingValue)\n        starRefList.current[nextIndex]?.focus()\n        break\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        event.preventDefault()\n        const prevIndex = Math.max(0, index - 1)\n        setRatingValue((prevIndex + 1) as RatingValue)\n        starRefList.current[prevIndex]?.focus()\n        break\n      case ' ':\n        event.preventDefault()\n        setRatingValue((index + 1) as RatingValue)\n        break\n      default:\n        break\n    }\n  }\n}\n\nfunction getStarTabIndex(index: number, ratingValue: RatingValue): number {\n  if (ratingValue >= 1) {\n    return ratingValue - 1 === index ? 0 : -1\n  }\n\n  return index === 0 ? 0 : -1\n}\n\nexport interface RatingProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\n  /**\n   * Use the `defaultValue` prop to set the default value of the input, on a from 0 to 5.\n   *\n   * Use this when you want to use it in an uncontrolled manner\n   */\n  defaultValue?: RatingValue\n  /**\n   * The value is the number of the rating selected, on a scale from 0 to 5.\n   *\n   * Use this when you want to use it in a controlled manner,\n   * in conjunction with the `onValueChange` prop\n   */\n  value?: RatingValue\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: RatingValue) => void\n  /**\n   * Sets the component as interactive or not.\n   * @default undefined\n   */\n  readOnly?: boolean\n  /**\n   * When `true`, prevents the user from interacting.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must select a rating before form submission.\n   * @default false\n   */\n  required?: boolean\n  /**\n   * Name of the underlying hidden input (for form submission).\n   * @default undefined\n   */\n  name?: string\n  /**\n   * id of the underlying hidden input.\n   * @default undefined\n   */\n  id?: string\n  /**\n   * aria-label of the radiogroup.\n   * @default undefined\n   */\n  'aria-label'?: string\n  /**\n   * Returns the aria-label applied to each radio star.\n   * Defaults to `${aria-label} ${index + 1}`.\n   */\n  getStarLabel?: (index: number) => string\n}\n\nexport const Rating = ({\n  defaultValue,\n  value: propValue,\n  onValueChange,\n  disabled,\n  readOnly,\n  required: requiredProp,\n  name,\n  id,\n  'aria-label': ariaLabel,\n  getStarLabel,\n  ref,\n  ...rest\n}: RatingProps) => {\n  const {\n    labelId,\n    isInvalid,\n    isRequired,\n    description,\n    name: formFieldName,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n  } = useFormFieldControl()\n  const starRefList = useRef<(HTMLDivElement | null)[]>([])\n  const ratingId = useId()\n  const [hoveredStarIndex, setHoveredStarIndex] = useState<number | null>(null)\n  const [value, setRatingValue] = useCombinedState(propValue, defaultValue, onValueChange)\n  const ratingValue = getRatingInteger(value ?? 0)\n  const resolvedDisabled = disabled ?? formFieldDisabled\n  const resolvedReadOnly = readOnly ?? formFieldReadOnly\n  const required = requiredProp !== undefined ? requiredProp : isRequired\n  const groupName = name ?? formFieldName\n  const isInteractive = !(resolvedDisabled || resolvedReadOnly)\n  const hasExplicitStarLabel = getStarLabel !== undefined || ariaLabel !== undefined\n  const displayValue = hoveredStarIndex !== null ? hoveredStarIndex + 1 : ratingValue\n\n  function onStarClick(index: number) {\n    if (!isInteractive) return\n\n    const newValue = (index + 1) as RatingValue\n    setRatingValue(newValue)\n    starRefList.current[index]?.focus()\n  }\n\n  const onStarKeyDown = useCallback(\n    (index: number) => createStarKeyDownHandler(index, starRefList, setRatingValue, isInteractive),\n    [isInteractive, setRatingValue]\n  )\n\n  function onStarMouseEnter({ currentTarget }: MouseEvent<HTMLDivElement>) {\n    const currentStarIndex = starRefList.current.findIndex(star => star === currentTarget)\n    setHoveredStarIndex(currentStarIndex >= 0 ? currentStarIndex : null)\n    const [previousStars, followingStars] = splitAt(starRefList.current, currentStarIndex + 1)\n    previousStars.forEach(star => star?.setAttribute('data-hovered', ''))\n    followingStars.forEach(star => star?.removeAttribute('data-hovered'))\n  }\n\n  const handleStarRef = useCallback(\n    (index: number) => (elm: HTMLDivElement | null) => {\n      starRefList.current[index] = elm\n    },\n    []\n  )\n\n  function resetDataPartStarAttr() {\n    setHoveredStarIndex(null)\n    starRefList.current.forEach(star => star?.removeAttribute('data-hovered'))\n  }\n\n  return (\n    <div\n      ref={ref}\n      id={id}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      aria-labelledby={labelId}\n      aria-invalid={isInvalid}\n      aria-required={required}\n      aria-describedby={description}\n      className=\"relative inline-flex\"\n      data-spark-component=\"rating\"\n      {...rest}\n      onMouseLeave={resetDataPartStarAttr}\n    >\n      {groupName !== undefined && (\n        <input type=\"hidden\" name={groupName} value={ratingValue} aria-hidden data-part=\"input\" />\n      )}\n      <div className={cx('gap-x-md', 'flex')}>\n        {Array.from({ length: 5 }).map((_, index) => (\n          <RatingStar\n            ref={handleStarRef(index)}\n            key={index}\n            disabled={resolvedDisabled}\n            readOnly={resolvedReadOnly}\n            size=\"lg\"\n            value={getStarValue({ index, value: displayValue })}\n            checked={ratingValue === index + 1}\n            ariaLabel={\n              hasExplicitStarLabel\n                ? (getStarLabel?.(index) ?? `${ariaLabel} ${index + 1}`)\n                : undefined\n            }\n            ariaLabelledBy={\n              !hasExplicitStarLabel && labelId\n                ? `${labelId} ${ratingId}-star-${index + 1}`\n                : undefined\n            }\n            tabIndex={isInteractive ? getStarTabIndex(index, ratingValue) : -1}\n            onClick={() => onStarClick(index)}\n            onKeyDown={onStarKeyDown(index)}\n            onMouseEnter={event => isInteractive && onStarMouseEnter(event)}\n          >\n            {!hasExplicitStarLabel && (\n              <span id={`${ratingId}-star-${index + 1}`} className=\"sr-only\">\n                {index + 1}\n              </span>\n            )}\n          </RatingStar>\n        ))}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/rating-display/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),N=require("../Slot-DQ8z2zsy.js"),D=require("react"),c=require("class-variance-authority"),V=require("@spark-ui/icons/StarFill"),j=require("@spark-ui/icons/StarOutline"),f=require("../Icon-C-cNTnzd.js"),v=D.createContext(null),b=({value:t,size:a,count:n,children:e})=>s.jsx(v.Provider,{value:{value:t,size:a,count:n},children:e}),p=()=>{const t=D.useContext(v);if(!t)throw new Error("RatingDisplay compound components must be used within RatingDisplay.");return t},S=({value:t=0,size:a="md",count:n,asChild:e=!1,ref:r,children:i,...o})=>{const u=t??0,l=e?N.Slot:"div";return s.jsx(b,{value:u,size:a,count:n,children:s.jsx(l,{ref:r,className:"gap-x-sm relative inline-flex items-center","data-spark-component":"rating-display",...o,children:i})})};S.displayName="RatingDisplay";const h=c.cva("text-on-surface/dim-1",{variants:{size:{sm:"text-caption",md:"text-body-2",lg:"text-display-3"}},defaultVariants:{size:"md"}}),m=({className:t,children:a,...n})=>{const{count:e,size:r}=p();if(e===void 0)return null;const i=typeof a=="function"?a(e):a??e;return s.jsxs("span",{className:h({size:r??"md",className:t}),...n,children:["(",i,")"]})};m.displayName="RatingDisplay.Count";const z=c.cva(["relative block after:absolute after:block after:inset-0"],{variants:{gap:{sm:["after:w-[calc(100%+(var(--spacing-sm)))]","last-of-type:after:content-none"],md:["after:w-[calc(100%+(var(--spacing-md)))]","last-of-type:after:content-none"]}},defaultVariants:{gap:"sm"}}),x=c.cva("",{variants:{size:{sm:"text-caption-link",md:"text-body-1",lg:"text-display-3"},design:{filled:["text-main-variant"],outlined:["text-on-surface/dim-3"]}}}),C=({value:t,size:a})=>s.jsxs("div",{"data-spark-component":"rating-display-star","data-part":"star",className:z({gap:a==="lg"?"md":"sm"}),children:[s.jsx("div",{className:c.cx("z-raised absolute overflow-hidden"),style:{width:t*100+"%"},children:s.jsx(f.Icon,{className:x({size:a,design:"filled"}),children:s.jsx(V.StarFill,{})})}),s.jsx(f.Icon,{className:x({size:a,design:"outlined"}),children:s.jsx(j.StarOutline,{})})]});function w(t){return Math.round(t/.5)*.5}function k(t){const a=Intl.DateTimeFormat().resolvedOptions().locale;return new Intl.NumberFormat(a,{minimumFractionDigits:0,maximumFractionDigits:1}).format(t)}function q({value:t,index:a}){if(t===void 0)return 0;const n=a+1,e=w(t);return Math.ceil(e)<n?0:e>=n?1:.5}function I(t){return t===void 0||t<1?0:t<4?.5:1}const g=({size:t,variant:a="default",getFillMode:n})=>{const{value:e,size:r}=p(),i=t??r,o=l=>n?n({index:l,value:e}):a==="single-star"?I(e):q({index:l,value:e}),u=a==="single-star"?[o(0)]:Array.from({length:5},(l,d)=>o(d));return s.jsx("div",{"data-spark-component":"rating-display-stars",className:c.cx(i==="lg"?"gap-x-md":"gap-x-sm","flex"),children:u.map((l,d)=>s.jsx(C,{size:i,value:l},d))})};g.displayName="RatingDisplay.Stars";const F=c.cva("text-on-surface font-bold",{variants:{size:{sm:"text-caption",md:"text-body-2",lg:"text-display-3"}},defaultVariants:{size:"md"}}),y=({className:t,children:a,...n})=>{const{value:e,size:r}=p(),i=k(e),o=typeof a=="function"?a(i,e):a??i;return s.jsx("span",{"data-spark-component":"rating-display-value",className:F({size:r??"md",className:t}),...n,children:o})};y.displayName="RatingDisplay.Value";const R=Object.assign(S,{Stars:g,Value:y,Count:m});R.displayName="RatingDisplay";g.displayName="RatingDisplay.Stars";y.displayName="RatingDisplay.Value";m.displayName="RatingDisplay.Count";exports.RatingDisplay=R;
-//# sourceMappingURL=index.js.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`);let n=require(`class-variance-authority`),r=require(`react`),i=require(`react/jsx-runtime`),a=require(`@spark-ui/icons/StarFill`),o=require(`@spark-ui/icons/StarOutline`);var s=(0,r.createContext)(null),c=({value:e,size:t,count:n,children:r})=>(0,i.jsx)(s.Provider,{value:{value:e,size:t,count:n},children:r}),l=()=>{let e=(0,r.useContext)(s);if(!e)throw Error(`RatingDisplay compound components must be used within RatingDisplay.`);return e},u=({value:t=0,size:n=`md`,count:r,asChild:a=!1,ref:o,children:s,...l})=>(0,i.jsx)(c,{value:t??0,size:n,count:r,children:(0,i.jsx)(a?e.Slot:`div`,{ref:o,className:`gap-x-sm relative inline-flex items-center`,"data-spark-component":`rating-display`,...l,children:s})});u.displayName=`RatingDisplay`;var d=(0,n.cva)(`text-on-surface/dim-1`,{variants:{size:{sm:`text-caption`,md:`text-body-2`,lg:`text-display-3`}},defaultVariants:{size:`md`}}),f=({className:e,children:t,...n})=>{let{count:r,size:a}=l();if(r===void 0)return null;let o=typeof t==`function`?t(r):t??r;return(0,i.jsxs)(`span`,{className:d({size:a??`md`,className:e}),...n,children:[`(`,o,`)`]})};f.displayName=`RatingDisplay.Count`;var p=(0,n.cva)([`relative block after:absolute after:block after:inset-0`],{variants:{gap:{sm:[`after:w-[calc(100%+(var(--spacing-sm)))]`,`last-of-type:after:content-none`],md:[`after:w-[calc(100%+(var(--spacing-md)))]`,`last-of-type:after:content-none`]}},defaultVariants:{gap:`sm`}}),m=(0,n.cva)(``,{variants:{size:{sm:`text-caption-link`,md:`text-body-1`,lg:`text-display-3`},design:{filled:[`text-main-variant`],outlined:[`text-on-surface/dim-3`]}}}),h=({value:e,size:r})=>(0,i.jsxs)(`div`,{"data-spark-component":`rating-display-star`,"data-part":`star`,className:p({gap:r===`lg`?`md`:`sm`}),children:[(0,i.jsx)(`div`,{className:(0,n.cx)(`z-raised absolute overflow-hidden`),style:{width:e*100+`%`},children:(0,i.jsx)(t.t,{className:m({size:r,design:`filled`}),children:(0,i.jsx)(a.StarFill,{})})}),(0,i.jsx)(t.t,{className:m({size:r,design:`outlined`}),children:(0,i.jsx)(o.StarOutline,{})})]});function g(e){return Math.round(e/.5)*.5}function _(e){let t=Intl.DateTimeFormat().resolvedOptions().locale;return new Intl.NumberFormat(t,{minimumFractionDigits:0,maximumFractionDigits:1}).format(e)}function v({value:e,index:t}){if(e===void 0)return 0;let n=t+1,r=g(e);return Math.ceil(r)<n?0:r>=n?1:.5}function y(e){return e===void 0||e<1?0:e<4?.5:1}var b=({size:e,variant:t=`default`,getFillMode:r})=>{let{value:a,size:o}=l(),s=e??o,c=e=>r?r({index:e,value:a}):t===`single-star`?y(a):v({index:e,value:a}),u=t===`single-star`?[c(0)]:Array.from({length:5},(e,t)=>c(t));return(0,i.jsx)(`div`,{"data-spark-component":`rating-display-stars`,className:(0,n.cx)(s===`lg`?`gap-x-md`:`gap-x-sm`,`flex`),children:u.map((e,t)=>(0,i.jsx)(h,{size:s,value:e},t))})};b.displayName=`RatingDisplay.Stars`;var x=(0,n.cva)(`text-on-surface font-bold`,{variants:{size:{sm:`text-caption`,md:`text-body-2`,lg:`text-display-3`}},defaultVariants:{size:`md`}}),S=({className:e,children:t,...n})=>{let{value:r,size:a}=l(),o=_(r),s=typeof t==`function`?t(o,r):t??o;return(0,i.jsx)(`span`,{"data-spark-component":`rating-display-value`,className:x({size:a??`md`,className:e}),...n,children:s})};S.displayName=`RatingDisplay.Value`;var C=Object.assign(u,{Stars:b,Value:S,Count:f});C.displayName=`RatingDisplay`,b.displayName=`RatingDisplay.Stars`,S.displayName=`RatingDisplay.Value`,f.displayName=`RatingDisplay.Count`,exports.RatingDisplay=C;
+//# sourceMappingURL=index.js.map

package/dist/rating-display/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/rating-display/RatingDisplayContext.tsx","../../src/rating-display/RatingDisplay.tsx","../../src/rating-display/RatingDisplayCount.tsx","../../src/rating-display/RatingDisplayStar.tsx","../../src/rating-display/utils.ts","../../src/rating-display/RatingDisplayStars.tsx","../../src/rating-display/RatingDisplayValue.tsx","../../src/rating-display/index.ts"],"sourcesContent":["import { createContext, type PropsWithChildren, useContext } from 'react'\n\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\ninterface RatingDisplayContextValue {\n  value: number\n  size: RatingDisplayStarProps['size']\n  count?: number\n}\n\nconst RatingDisplayContext = createContext<RatingDisplayContextValue | null>(null)\n\ninterface RatingDisplayProviderProps extends PropsWithChildren<RatingDisplayContextValue> {}\n\nexport const RatingDisplayProvider = ({\n  value,\n  size,\n  count,\n  children,\n}: RatingDisplayProviderProps) => {\n  return (\n    <RatingDisplayContext.Provider value={{ value, size, count }}>\n      {children}\n    </RatingDisplayContext.Provider>\n  )\n}\n\nexport const useRatingDisplay = () => {\n  const context = useContext(RatingDisplayContext)\n  if (!context) {\n    throw new Error('RatingDisplay compound components must be used within RatingDisplay.')\n  }\n\n  return context\n}\n","import { type ComponentPropsWithRef, type PropsWithChildren } from 'react'\n\nimport { Slot } from '../slot'\nimport { RatingDisplayProvider } from './RatingDisplayContext'\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\nexport interface RatingDisplayProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\n  /**\n   * When true, merges props onto the single child element instead of rendering a div.\n   * Use to render the root as a link or another custom element.\n   */\n  asChild?: boolean\n  /**\n   * The rating value to display, on a scale from 0 to 5.\n   */\n  value?: number\n  /**\n   * Sets the size of the stars.\n   * @default 'md'\n   */\n  size?: RatingDisplayStarProps['size']\n  /**\n   * Optional count value available to `RatingDisplay.Count`.\n   */\n  count?: number\n  /**\n   * Accessible description of the rating content.\n   */\n  'aria-label': string\n}\n\nexport type RatingDisplayRootProps = RatingDisplayProps\n\nexport const RatingDisplay = ({\n  value = 0,\n  size = 'md',\n  count,\n  asChild = false,\n  ref,\n  children,\n  ...rest\n}: RatingDisplayProps) => {\n  const ratingValue = value ?? 0\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <RatingDisplayProvider value={ratingValue} size={size} count={count}>\n      <Component\n        ref={ref}\n        className=\"gap-x-sm relative inline-flex items-center\"\n        data-spark-component=\"rating-display\"\n        {...rest}\n      >\n        {children}\n      </Component>\n    </RatingDisplayProvider>\n  )\n}\n\nRatingDisplay.displayName = 'RatingDisplay'\n","import { cva } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\n\nexport interface RatingDisplayCountProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {\n  /**\n   * Custom count content.\n   * Pass a render function to receive the count value and return the content to render.\n   */\n  children?: ReactNode | ((count: number) => ReactNode)\n}\n\nconst ratingDisplayCountStyles = cva('text-on-surface/dim-1', {\n  variants: {\n    size: {\n      sm: 'text-caption',\n      md: 'text-body-2',\n      lg: 'text-display-3',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nexport const RatingDisplayCount = ({ className, children, ...rest }: RatingDisplayCountProps) => {\n  const { count, size } = useRatingDisplay()\n  if (count === undefined) return null\n  const renderedCount = typeof children === 'function' ? children(count) : (children ?? count)\n\n  return (\n    <span className={ratingDisplayCountStyles({ size: size ?? 'md', className })} {...rest}>\n      ({renderedCount})\n    </span>\n  )\n}\n\nRatingDisplayCount.displayName = 'RatingDisplay.Count'\n","import { StarFill } from '@spark-ui/icons/StarFill'\nimport { StarOutline } from '@spark-ui/icons/StarOutline'\nimport { cva, cx, type VariantProps } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport type { StarValue } from './types'\n\nconst ratingDisplayStarStyles = cva(['relative block after:absolute after:block after:inset-0'], {\n  variants: {\n    gap: {\n      sm: ['after:w-[calc(100%+(var(--spacing-sm)))]', 'last-of-type:after:content-none'],\n      md: ['after:w-[calc(100%+(var(--spacing-md)))]', 'last-of-type:after:content-none'],\n    },\n  },\n  defaultVariants: {\n    gap: 'sm',\n  },\n})\n\nconst ratingDisplayStarIconStyles = cva('', {\n  variants: {\n    size: {\n      sm: 'text-caption-link',\n      md: 'text-body-1',\n      lg: 'text-display-3',\n    },\n    design: {\n      filled: ['text-main-variant'],\n      outlined: ['text-on-surface/dim-3'],\n    },\n  },\n})\n\ntype RatingDisplayStarstylesProps = Omit<VariantProps<typeof ratingDisplayStarStyles>, never>\ntype RatingDisplayStarIconStylesProps = Omit<\n  VariantProps<typeof ratingDisplayStarIconStyles>,\n  'design'\n>\n\nexport interface RatingDisplayStarProps\n  extends RatingDisplayStarstylesProps,\n    RatingDisplayStarIconStylesProps {\n  value: StarValue\n}\n\nexport const RatingDisplayStar = ({ value, size }: RatingDisplayStarProps) => {\n  return (\n    <div\n      data-spark-component=\"rating-display-star\"\n      data-part=\"star\"\n      className={ratingDisplayStarStyles({\n        gap: size === 'lg' ? 'md' : 'sm',\n      })}\n    >\n      <div className={cx('z-raised absolute overflow-hidden')} style={{ width: value * 100 + '%' }}>\n        <Icon\n          className={ratingDisplayStarIconStyles({\n            size,\n            design: 'filled',\n          })}\n        >\n          <StarFill />\n        </Icon>\n      </div>\n\n      <Icon className={ratingDisplayStarIconStyles({ size, design: 'outlined' })}>\n        <StarOutline />\n      </Icon>\n    </div>\n  )\n}\n","import { type StarValue } from './types'\n\nfunction getNearestHalfDecimal(num: number): number {\n  return Math.round(num / 0.5) * 0.5\n}\n\nfunction formatRatingValue(value: number): string {\n  const locale = Intl.DateTimeFormat().resolvedOptions().locale\n\n  return new Intl.NumberFormat(locale, {\n    minimumFractionDigits: 0,\n    maximumFractionDigits: 1,\n  }).format(value)\n}\n\nfunction getStarValue({ value, index }: { value?: number; index: number }): StarValue {\n  if (value === undefined) return 0\n\n  const starPosition = index + 1\n  const formattedValue = getNearestHalfDecimal(value)\n\n  if (Math.ceil(formattedValue) < starPosition) return 0\n\n  return formattedValue >= starPosition ? 1 : 0.5\n}\n\nfunction getSingleStarValue(value?: number): StarValue {\n  if (value === undefined) return 0\n  if (value < 1) return 0\n  if (value < 4) return 0.5\n  return 1\n}\n\nfunction splitAt<T>(arr: T[], index: number): [T[], T[]] {\n  const prev = arr.slice(0, index)\n  const next = arr.slice(index)\n\n  return [prev, next]\n}\n\nexport { formatRatingValue, getNearestHalfDecimal, getSingleStarValue, getStarValue, splitAt }\n","import { cx } from 'class-variance-authority'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\nimport { RatingDisplayStar, type RatingDisplayStarProps } from './RatingDisplayStar'\nimport type { StarValue } from './types'\nimport { getSingleStarValue, getStarValue } from './utils'\n\nexport interface RatingDisplayStarsProps {\n  size?: RatingDisplayStarProps['size']\n  /**\n   * Sets the rendering mode for stars.\n   * @default 'default'\n   */\n  variant?: 'default' | 'single-star'\n  /**\n   * Custom fill algorithm for each star.\n   * By default, stars are rounded to the nearest 0.5.\n   */\n  getFillMode?: ({ value, index }: { value?: number; index: number }) => StarValue\n}\n\nexport const RatingDisplayStars = ({\n  size,\n  variant = 'default',\n  getFillMode,\n}: RatingDisplayStarsProps) => {\n  const { value, size: contextSize } = useRatingDisplay()\n  const resolvedSize = size ?? contextSize\n  const getDisplayValue = (index: number) => {\n    if (getFillMode) {\n      return getFillMode({ index, value })\n    }\n\n    return variant === 'single-star' ? getSingleStarValue(value) : getStarValue({ index, value })\n  }\n\n  const stars =\n    variant === 'single-star'\n      ? [getDisplayValue(0)]\n      : Array.from({ length: 5 }, (_, index) => getDisplayValue(index))\n\n  return (\n    <div\n      data-spark-component=\"rating-display-stars\"\n      className={cx(resolvedSize === 'lg' ? 'gap-x-md' : 'gap-x-sm', 'flex')}\n    >\n      {stars.map((starValue, index) => (\n        <RatingDisplayStar key={index} size={resolvedSize} value={starValue} />\n      ))}\n    </div>\n  )\n}\n\nRatingDisplayStars.displayName = 'RatingDisplay.Stars'\n","import { cva } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\nimport { formatRatingValue } from './utils'\n\nexport interface RatingDisplayValueProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {\n  /**\n   * Custom value content.\n   * Pass a render function to receive the formatted value (first arg) and raw value (second arg),\n   * then return the content to render.\n   */\n  children?: ReactNode | ((formattedValue: string, value: number) => ReactNode)\n}\n\nconst ratingDisplayValueStyles = cva('text-on-surface font-bold', {\n  variants: {\n    size: {\n      sm: 'text-caption',\n      md: 'text-body-2',\n      lg: 'text-display-3',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nexport const RatingDisplayValue = ({ className, children, ...rest }: RatingDisplayValueProps) => {\n  const { value, size } = useRatingDisplay()\n  const formattedValue = formatRatingValue(value)\n  const renderedValue =\n    typeof children === 'function' ? children(formattedValue, value) : (children ?? formattedValue)\n\n  return (\n    <span\n      data-spark-component=\"rating-display-value\"\n      className={ratingDisplayValueStyles({ size: size ?? 'md', className })}\n      {...rest}\n    >\n      {renderedValue}\n    </span>\n  )\n}\n\nRatingDisplayValue.displayName = 'RatingDisplay.Value'\n","import { RatingDisplay as Root } from './RatingDisplay'\nimport { RatingDisplayCount as Count } from './RatingDisplayCount'\nimport { RatingDisplayStars as Stars } from './RatingDisplayStars'\nimport { RatingDisplayValue as Value } from './RatingDisplayValue'\n\nexport const RatingDisplay: typeof Root & {\n  Stars: typeof Stars\n  Value: typeof Value\n  Count: typeof Count\n} = Object.assign(Root, {\n  Stars,\n  Value,\n  Count,\n})\n\nRatingDisplay.displayName = 'RatingDisplay'\nStars.displayName = 'RatingDisplay.Stars'\nValue.displayName = 'RatingDisplay.Value'\nCount.displayName = 'RatingDisplay.Count'\n\nexport { type RatingDisplayProps, type RatingDisplayRootProps } from './RatingDisplay'\nexport { type RatingDisplayStarsProps } from './RatingDisplayStars'\nexport { type RatingDisplayValueProps } from './RatingDisplayValue'\nexport { type RatingDisplayCountProps } from './RatingDisplayCount'\nexport type { StarValue } from './types'\n"],"names":["RatingDisplayContext","createContext","RatingDisplayProvider","value","size","count","children","jsx","useRatingDisplay","context","useContext","RatingDisplay","asChild","ref","rest","ratingValue","Component","Slot","ratingDisplayCountStyles","cva","RatingDisplayCount","className","renderedCount","jsxs","ratingDisplayStarStyles","ratingDisplayStarIconStyles","RatingDisplayStar","cx","Icon","StarFill","StarOutline","getNearestHalfDecimal","num","formatRatingValue","locale","getStarValue","index","starPosition","formattedValue","getSingleStarValue","RatingDisplayStars","variant","getFillMode","contextSize","resolvedSize","getDisplayValue","stars","_","starValue","ratingDisplayValueStyles","RatingDisplayValue","renderedValue","Root","Stars","Value","Count"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/rating-display/RatingDisplayContext.tsx","../../src/rating-display/RatingDisplay.tsx","../../src/rating-display/RatingDisplayCount.tsx","../../src/rating-display/RatingDisplayStar.tsx","../../src/rating-display/utils.ts","../../src/rating-display/RatingDisplayStars.tsx","../../src/rating-display/RatingDisplayValue.tsx","../../src/rating-display/index.ts"],"sourcesContent":["import { createContext, type PropsWithChildren, useContext } from 'react'\n\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\ninterface RatingDisplayContextValue {\n  value: number\n  size: RatingDisplayStarProps['size']\n  count?: number\n}\n\nconst RatingDisplayContext = createContext<RatingDisplayContextValue | null>(null)\n\ninterface RatingDisplayProviderProps extends PropsWithChildren<RatingDisplayContextValue> {}\n\nexport const RatingDisplayProvider = ({\n  value,\n  size,\n  count,\n  children,\n}: RatingDisplayProviderProps) => {\n  return (\n    <RatingDisplayContext.Provider value={{ value, size, count }}>\n      {children}\n    </RatingDisplayContext.Provider>\n  )\n}\n\nexport const useRatingDisplay = () => {\n  const context = useContext(RatingDisplayContext)\n  if (!context) {\n    throw new Error('RatingDisplay compound components must be used within RatingDisplay.')\n  }\n\n  return context\n}\n","import { type ComponentPropsWithRef, type PropsWithChildren } from 'react'\n\nimport { Slot } from '../slot'\nimport { RatingDisplayProvider } from './RatingDisplayContext'\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\nexport interface RatingDisplayProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\n  /**\n   * When true, merges props onto the single child element instead of rendering a div.\n   * Use to render the root as a link or another custom element.\n   */\n  asChild?: boolean\n  /**\n   * The rating value to display, on a scale from 0 to 5.\n   */\n  value?: number\n  /**\n   * Sets the size of the stars.\n   * @default 'md'\n   */\n  size?: RatingDisplayStarProps['size']\n  /**\n   * Optional count value available to `RatingDisplay.Count`.\n   */\n  count?: number\n  /**\n   * Accessible description of the rating content.\n   */\n  'aria-label': string\n}\n\nexport type RatingDisplayRootProps = RatingDisplayProps\n\nexport const RatingDisplay = ({\n  value = 0,\n  size = 'md',\n  count,\n  asChild = false,\n  ref,\n  children,\n  ...rest\n}: RatingDisplayProps) => {\n  const ratingValue = value ?? 0\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <RatingDisplayProvider value={ratingValue} size={size} count={count}>\n      <Component\n        ref={ref}\n        className=\"gap-x-sm relative inline-flex items-center\"\n        data-spark-component=\"rating-display\"\n        {...rest}\n      >\n        {children}\n      </Component>\n    </RatingDisplayProvider>\n  )\n}\n\nRatingDisplay.displayName = 'RatingDisplay'\n","import { cva } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\n\nexport interface RatingDisplayCountProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {\n  /**\n   * Custom count content.\n   * Pass a render function to receive the count value and return the content to render.\n   */\n  children?: ReactNode | ((count: number) => ReactNode)\n}\n\nconst ratingDisplayCountStyles = cva('text-on-surface/dim-1', {\n  variants: {\n    size: {\n      sm: 'text-caption',\n      md: 'text-body-2',\n      lg: 'text-display-3',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nexport const RatingDisplayCount = ({ className, children, ...rest }: RatingDisplayCountProps) => {\n  const { count, size } = useRatingDisplay()\n  if (count === undefined) return null\n  const renderedCount = typeof children === 'function' ? children(count) : (children ?? count)\n\n  return (\n    <span className={ratingDisplayCountStyles({ size: size ?? 'md', className })} {...rest}>\n      ({renderedCount})\n    </span>\n  )\n}\n\nRatingDisplayCount.displayName = 'RatingDisplay.Count'\n","import { StarFill } from '@spark-ui/icons/StarFill'\nimport { StarOutline } from '@spark-ui/icons/StarOutline'\nimport { cva, cx, type VariantProps } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport type { StarValue } from './types'\n\nconst ratingDisplayStarStyles = cva(['relative block after:absolute after:block after:inset-0'], {\n  variants: {\n    gap: {\n      sm: ['after:w-[calc(100%+(var(--spacing-sm)))]', 'last-of-type:after:content-none'],\n      md: ['after:w-[calc(100%+(var(--spacing-md)))]', 'last-of-type:after:content-none'],\n    },\n  },\n  defaultVariants: {\n    gap: 'sm',\n  },\n})\n\nconst ratingDisplayStarIconStyles = cva('', {\n  variants: {\n    size: {\n      sm: 'text-caption-link',\n      md: 'text-body-1',\n      lg: 'text-display-3',\n    },\n    design: {\n      filled: ['text-main-variant'],\n      outlined: ['text-on-surface/dim-3'],\n    },\n  },\n})\n\ntype RatingDisplayStarstylesProps = Omit<VariantProps<typeof ratingDisplayStarStyles>, never>\ntype RatingDisplayStarIconStylesProps = Omit<\n  VariantProps<typeof ratingDisplayStarIconStyles>,\n  'design'\n>\n\nexport interface RatingDisplayStarProps\n  extends RatingDisplayStarstylesProps, RatingDisplayStarIconStylesProps {\n  value: StarValue\n}\n\nexport const RatingDisplayStar = ({ value, size }: RatingDisplayStarProps) => {\n  return (\n    <div\n      data-spark-component=\"rating-display-star\"\n      data-part=\"star\"\n      className={ratingDisplayStarStyles({\n        gap: size === 'lg' ? 'md' : 'sm',\n      })}\n    >\n      <div className={cx('z-raised absolute overflow-hidden')} style={{ width: value * 100 + '%' }}>\n        <Icon\n          className={ratingDisplayStarIconStyles({\n            size,\n            design: 'filled',\n          })}\n        >\n          <StarFill />\n        </Icon>\n      </div>\n\n      <Icon className={ratingDisplayStarIconStyles({ size, design: 'outlined' })}>\n        <StarOutline />\n      </Icon>\n    </div>\n  )\n}\n","import { type StarValue } from './types'\n\nfunction getNearestHalfDecimal(num: number): number {\n  return Math.round(num / 0.5) * 0.5\n}\n\nfunction formatRatingValue(value: number): string {\n  const locale = Intl.DateTimeFormat().resolvedOptions().locale\n\n  return new Intl.NumberFormat(locale, {\n    minimumFractionDigits: 0,\n    maximumFractionDigits: 1,\n  }).format(value)\n}\n\nfunction getStarValue({ value, index }: { value?: number; index: number }): StarValue {\n  if (value === undefined) return 0\n\n  const starPosition = index + 1\n  const formattedValue = getNearestHalfDecimal(value)\n\n  if (Math.ceil(formattedValue) < starPosition) return 0\n\n  return formattedValue >= starPosition ? 1 : 0.5\n}\n\nfunction getSingleStarValue(value?: number): StarValue {\n  if (value === undefined) return 0\n  if (value < 1) return 0\n  if (value < 4) return 0.5\n  return 1\n}\n\nfunction splitAt<T>(arr: T[], index: number): [T[], T[]] {\n  const prev = arr.slice(0, index)\n  const next = arr.slice(index)\n\n  return [prev, next]\n}\n\nexport { formatRatingValue, getNearestHalfDecimal, getSingleStarValue, getStarValue, splitAt }\n","import { cx } from 'class-variance-authority'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\nimport { RatingDisplayStar, type RatingDisplayStarProps } from './RatingDisplayStar'\nimport type { StarValue } from './types'\nimport { getSingleStarValue, getStarValue } from './utils'\n\nexport interface RatingDisplayStarsProps {\n  size?: RatingDisplayStarProps['size']\n  /**\n   * Sets the rendering mode for stars.\n   * @default 'default'\n   */\n  variant?: 'default' | 'single-star'\n  /**\n   * Custom fill algorithm for each star.\n   * By default, stars are rounded to the nearest 0.5.\n   */\n  getFillMode?: ({ value, index }: { value?: number; index: number }) => StarValue\n}\n\nexport const RatingDisplayStars = ({\n  size,\n  variant = 'default',\n  getFillMode,\n}: RatingDisplayStarsProps) => {\n  const { value, size: contextSize } = useRatingDisplay()\n  const resolvedSize = size ?? contextSize\n  const getDisplayValue = (index: number) => {\n    if (getFillMode) {\n      return getFillMode({ index, value })\n    }\n\n    return variant === 'single-star' ? getSingleStarValue(value) : getStarValue({ index, value })\n  }\n\n  const stars =\n    variant === 'single-star'\n      ? [getDisplayValue(0)]\n      : Array.from({ length: 5 }, (_, index) => getDisplayValue(index))\n\n  return (\n    <div\n      data-spark-component=\"rating-display-stars\"\n      className={cx(resolvedSize === 'lg' ? 'gap-x-md' : 'gap-x-sm', 'flex')}\n    >\n      {stars.map((starValue, index) => (\n        <RatingDisplayStar key={index} size={resolvedSize} value={starValue} />\n      ))}\n    </div>\n  )\n}\n\nRatingDisplayStars.displayName = 'RatingDisplay.Stars'\n","import { cva } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { useRatingDisplay } from './RatingDisplayContext'\nimport { formatRatingValue } from './utils'\n\nexport interface RatingDisplayValueProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {\n  /**\n   * Custom value content.\n   * Pass a render function to receive the formatted value (first arg) and raw value (second arg),\n   * then return the content to render.\n   */\n  children?: ReactNode | ((formattedValue: string, value: number) => ReactNode)\n}\n\nconst ratingDisplayValueStyles = cva('text-on-surface font-bold', {\n  variants: {\n    size: {\n      sm: 'text-caption',\n      md: 'text-body-2',\n      lg: 'text-display-3',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nexport const RatingDisplayValue = ({ className, children, ...rest }: RatingDisplayValueProps) => {\n  const { value, size } = useRatingDisplay()\n  const formattedValue = formatRatingValue(value)\n  const renderedValue =\n    typeof children === 'function' ? children(formattedValue, value) : (children ?? formattedValue)\n\n  return (\n    <span\n      data-spark-component=\"rating-display-value\"\n      className={ratingDisplayValueStyles({ size: size ?? 'md', className })}\n      {...rest}\n    >\n      {renderedValue}\n    </span>\n  )\n}\n\nRatingDisplayValue.displayName = 'RatingDisplay.Value'\n","import { RatingDisplay as Root } from './RatingDisplay'\nimport { RatingDisplayCount as Count } from './RatingDisplayCount'\nimport { RatingDisplayStars as Stars } from './RatingDisplayStars'\nimport { RatingDisplayValue as Value } from './RatingDisplayValue'\n\nexport const RatingDisplay: typeof Root & {\n  Stars: typeof Stars\n  Value: typeof Value\n  Count: typeof Count\n} = Object.assign(Root, {\n  Stars,\n  Value,\n  Count,\n})\n\nRatingDisplay.displayName = 'RatingDisplay'\nStars.displayName = 'RatingDisplay.Stars'\nValue.displayName = 'RatingDisplay.Value'\nCount.displayName = 'RatingDisplay.Count'\n\nexport { type RatingDisplayProps, type RatingDisplayRootProps } from './RatingDisplay'\nexport { type RatingDisplayStarsProps } from './RatingDisplayStars'\nexport { type RatingDisplayValueProps } from './RatingDisplayValue'\nexport { type RatingDisplayCountProps } from './RatingDisplayCount'\nexport type { StarValue } from './types'\n"],"mappings":"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"}

package/dist/rating-display/index.mjs

@@ -1,174 +1,173 @@
-import { jsx as s, jsxs as x } from "react/jsx-runtime";
-import { S as N } from "../Slot-DLY1rJrG.mjs";
-import { createContext as V, useContext as z } from "react";
-import { cva as c, cx as v } from "class-variance-authority";
-import { StarFill as b } from "@spark-ui/icons/StarFill";
-import { StarOutline as h } from "@spark-ui/icons/StarOutline";
-import { I as y } from "../Icon-BO327oHU.mjs";
-const R = V(null), C = ({
-  value: t,
-  size: a,
-  count: n,
-  children: e
-}) => /* @__PURE__ */ s(R.Provider, { value: { value: t, size: a, count: n }, children: e }), p = () => {
-  const t = z(R);
-  if (!t)
-    throw new Error("RatingDisplay compound components must be used within RatingDisplay.");
-  return t;
-}, S = ({
-  value: t = 0,
-  size: a = "md",
-  count: n,
-  asChild: e = !1,
-  ref: r,
-  children: i,
-  ...o
-}) => /* @__PURE__ */ s(C, { value: t ?? 0, size: a, count: n, children: /* @__PURE__ */ s(
-  e ? N : "div",
-  {
-    ref: r,
-    className: "gap-x-sm relative inline-flex items-center",
-    "data-spark-component": "rating-display",
-    ...o,
-    children: i
-  }
-) });
-S.displayName = "RatingDisplay";
-const w = c("text-on-surface/dim-1", {
-  variants: {
-    size: {
-      sm: "text-caption",
-      md: "text-body-2",
-      lg: "text-display-3"
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-}), d = ({ className: t, children: a, ...n }) => {
-  const { count: e, size: r } = p();
-  if (e === void 0) return null;
-  const i = typeof a == "function" ? a(e) : a ?? e;
-  return /* @__PURE__ */ x("span", { className: w({ size: r ?? "md", className: t }), ...n, children: [
-    "(",
-    i,
-    ")"
-  ] });
+import { Slot as e } from "../slot/index.mjs";
+import { t } from "../icon-D05Uqh8_.mjs";
+import { cva as n, cx as r } from "class-variance-authority";
+import { createContext as i, useContext as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { StarFill as c } from "@spark-ui/icons/StarFill";
+import { StarOutline as l } from "@spark-ui/icons/StarOutline";
+//#region src/rating-display/RatingDisplayContext.tsx
+var u = i(null), d = ({ value: e, size: t, count: n, children: r }) => /* @__PURE__ */ o(u.Provider, {
+	value: {
+		value: e,
+		size: t,
+		count: n
+	},
+	children: r
+}), f = () => {
+	let e = a(u);
+	if (!e) throw Error("RatingDisplay compound components must be used within RatingDisplay.");
+	return e;
+}, p = ({ value: t = 0, size: n = "md", count: r, asChild: i = !1, ref: a, children: s, ...c }) => /* @__PURE__ */ o(d, {
+	value: t ?? 0,
+	size: n,
+	count: r,
+	children: /* @__PURE__ */ o(i ? e : "div", {
+		ref: a,
+		className: "gap-x-sm relative inline-flex items-center",
+		"data-spark-component": "rating-display",
+		...c,
+		children: s
+	})
+});
+p.displayName = "RatingDisplay";
+//#endregion
+//#region src/rating-display/RatingDisplayCount.tsx
+var m = n("text-on-surface/dim-1", {
+	variants: { size: {
+		sm: "text-caption",
+		md: "text-body-2",
+		lg: "text-display-3"
+	} },
+	defaultVariants: { size: "md" }
+}), h = ({ className: e, children: t, ...n }) => {
+	let { count: r, size: i } = f();
+	if (r === void 0) return null;
+	let a = typeof t == "function" ? t(r) : t ?? r;
+	return /* @__PURE__ */ s("span", {
+		className: m({
+			size: i ?? "md",
+			className: e
+		}),
+		...n,
+		children: [
+			"(",
+			a,
+			")"
+		]
+	});
 };
-d.displayName = "RatingDisplay.Count";
-const k = c(["relative block after:absolute after:block after:inset-0"], {
-  variants: {
-    gap: {
-      sm: ["after:w-[calc(100%+(var(--spacing-sm)))]", "last-of-type:after:content-none"],
-      md: ["after:w-[calc(100%+(var(--spacing-md)))]", "last-of-type:after:content-none"]
-    }
-  },
-  defaultVariants: {
-    gap: "sm"
-  }
-}), D = c("", {
-  variants: {
-    size: {
-      sm: "text-caption-link",
-      md: "text-body-1",
-      lg: "text-display-3"
-    },
-    design: {
-      filled: ["text-main-variant"],
-      outlined: ["text-on-surface/dim-3"]
-    }
-  }
-}), I = ({ value: t, size: a }) => /* @__PURE__ */ x(
-  "div",
-  {
-    "data-spark-component": "rating-display-star",
-    "data-part": "star",
-    className: k({
-      gap: a === "lg" ? "md" : "sm"
-    }),
-    children: [
-      /* @__PURE__ */ s("div", { className: v("z-raised absolute overflow-hidden"), style: { width: t * 100 + "%" }, children: /* @__PURE__ */ s(
-        y,
-        {
-          className: D({
-            size: a,
-            design: "filled"
-          }),
-          children: /* @__PURE__ */ s(b, {})
-        }
-      ) }),
-      /* @__PURE__ */ s(y, { className: D({ size: a, design: "outlined" }), children: /* @__PURE__ */ s(h, {}) })
-    ]
-  }
-);
-function F(t) {
-  return Math.round(t / 0.5) * 0.5;
+h.displayName = "RatingDisplay.Count";
+//#endregion
+//#region src/rating-display/RatingDisplayStar.tsx
+var g = n(["relative block after:absolute after:block after:inset-0"], {
+	variants: { gap: {
+		sm: ["after:w-[calc(100%+(var(--spacing-sm)))]", "last-of-type:after:content-none"],
+		md: ["after:w-[calc(100%+(var(--spacing-md)))]", "last-of-type:after:content-none"]
+	} },
+	defaultVariants: { gap: "sm" }
+}), _ = n("", { variants: {
+	size: {
+		sm: "text-caption-link",
+		md: "text-body-1",
+		lg: "text-display-3"
+	},
+	design: {
+		filled: ["text-main-variant"],
+		outlined: ["text-on-surface/dim-3"]
+	}
+} }), v = ({ value: e, size: n }) => /* @__PURE__ */ s("div", {
+	"data-spark-component": "rating-display-star",
+	"data-part": "star",
+	className: g({ gap: n === "lg" ? "md" : "sm" }),
+	children: [/* @__PURE__ */ o("div", {
+		className: r("z-raised absolute overflow-hidden"),
+		style: { width: e * 100 + "%" },
+		children: /* @__PURE__ */ o(t, {
+			className: _({
+				size: n,
+				design: "filled"
+			}),
+			children: /* @__PURE__ */ o(c, {})
+		})
+	}), /* @__PURE__ */ o(t, {
+		className: _({
+			size: n,
+			design: "outlined"
+		}),
+		children: /* @__PURE__ */ o(l, {})
+	})]
+});
+//#endregion
+//#region src/rating-display/utils.ts
+function y(e) {
+	return Math.round(e / .5) * .5;
 }
-function j(t) {
-  const a = Intl.DateTimeFormat().resolvedOptions().locale;
-  return new Intl.NumberFormat(a, {
-    minimumFractionDigits: 0,
-    maximumFractionDigits: 1
-  }).format(t);
+function b(e) {
+	let t = Intl.DateTimeFormat().resolvedOptions().locale;
+	return new Intl.NumberFormat(t, {
+		minimumFractionDigits: 0,
+		maximumFractionDigits: 1
+	}).format(e);
 }
-function O({ value: t, index: a }) {
-  if (t === void 0) return 0;
-  const n = a + 1, e = F(t);
-  return Math.ceil(e) < n ? 0 : e >= n ? 1 : 0.5;
+function x({ value: e, index: t }) {
+	if (e === void 0) return 0;
+	let n = t + 1, r = y(e);
+	return Math.ceil(r) < n ? 0 : r >= n ? 1 : .5;
 }
-function P(t) {
-  return t === void 0 || t < 1 ? 0 : t < 4 ? 0.5 : 1;
+function S(e) {
+	return e === void 0 || e < 1 ? 0 : e < 4 ? .5 : 1;
 }
-const u = ({
-  size: t,
-  variant: a = "default",
-  getFillMode: n
-}) => {
-  const { value: e, size: r } = p(), i = t ?? r, o = (l) => n ? n({ index: l, value: e }) : a === "single-star" ? P(e) : O({ index: l, value: e }), f = a === "single-star" ? [o(0)] : Array.from({ length: 5 }, (l, m) => o(m));
-  return /* @__PURE__ */ s(
-    "div",
-    {
-      "data-spark-component": "rating-display-stars",
-      className: v(i === "lg" ? "gap-x-md" : "gap-x-sm", "flex"),
-      children: f.map((l, m) => /* @__PURE__ */ s(I, { size: i, value: l }, m))
-    }
-  );
+//#endregion
+//#region src/rating-display/RatingDisplayStars.tsx
+var C = ({ size: e, variant: t = "default", getFillMode: n }) => {
+	let { value: i, size: a } = f(), s = e ?? a, c = (e) => n ? n({
+		index: e,
+		value: i
+	}) : t === "single-star" ? S(i) : x({
+		index: e,
+		value: i
+	}), l = t === "single-star" ? [c(0)] : Array.from({ length: 5 }, (e, t) => c(t));
+	return /* @__PURE__ */ o("div", {
+		"data-spark-component": "rating-display-stars",
+		className: r(s === "lg" ? "gap-x-md" : "gap-x-sm", "flex"),
+		children: l.map((e, t) => /* @__PURE__ */ o(v, {
+			size: s,
+			value: e
+		}, t))
+	});
 };
-u.displayName = "RatingDisplay.Stars";
-const A = c("text-on-surface font-bold", {
-  variants: {
-    size: {
-      sm: "text-caption",
-      md: "text-body-2",
-      lg: "text-display-3"
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-}), g = ({ className: t, children: a, ...n }) => {
-  const { value: e, size: r } = p(), i = j(e), o = typeof a == "function" ? a(i, e) : a ?? i;
-  return /* @__PURE__ */ s(
-    "span",
-    {
-      "data-spark-component": "rating-display-value",
-      className: A({ size: r ?? "md", className: t }),
-      ...n,
-      children: o
-    }
-  );
+C.displayName = "RatingDisplay.Stars";
+//#endregion
+//#region src/rating-display/RatingDisplayValue.tsx
+var w = n("text-on-surface font-bold", {
+	variants: { size: {
+		sm: "text-caption",
+		md: "text-body-2",
+		lg: "text-display-3"
+	} },
+	defaultVariants: { size: "md" }
+}), T = ({ className: e, children: t, ...n }) => {
+	let { value: r, size: i } = f(), a = b(r), s = typeof t == "function" ? t(a, r) : t ?? a;
+	return /* @__PURE__ */ o("span", {
+		"data-spark-component": "rating-display-value",
+		className: w({
+			size: i ?? "md",
+			className: e
+		}),
+		...n,
+		children: s
+	});
 };
-g.displayName = "RatingDisplay.Value";
-const E = Object.assign(S, {
-  Stars: u,
-  Value: g,
-  Count: d
+T.displayName = "RatingDisplay.Value";
+//#endregion
+//#region src/rating-display/index.ts
+var E = Object.assign(p, {
+	Stars: C,
+	Value: T,
+	Count: h
 });
-E.displayName = "RatingDisplay";
-u.displayName = "RatingDisplay.Stars";
-g.displayName = "RatingDisplay.Value";
-d.displayName = "RatingDisplay.Count";
-export {
-  E as RatingDisplay
-};
-//# sourceMappingURL=index.mjs.map
+E.displayName = "RatingDisplay", C.displayName = "RatingDisplay.Stars", T.displayName = "RatingDisplay.Value", h.displayName = "RatingDisplay.Count";
+//#endregion
+export { E as RatingDisplay };
+
+//# sourceMappingURL=index.mjs.map