@spark-ui/components 15.1.0 → 16.0.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(\n  ['peer', 'after:inset-0', 'group', 'relative', 'after:block after:absolute'],\n  {\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(emptyRemainingStarsOnHoverClass, 'cursor-pointer'),\n      },\n    ],\n    defaultVariants: {\n      disabled: false,\n      readOnly: false,\n      gap: 'sm',\n    },\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 MouseEvent, Ref } 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 extends RatingStarstylesProps, RatingStarIconStylesProps {\n  value: StarValue\n  onClick?: (event: MouseEvent<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  onClick,\n  onMouseEnter,\n  ref: forwardedRef,\n}: RatingStarProps) => {\n  return (\n    <div\n      data-spark-component=\"rating-star\"\n      ref={forwardedRef}\n      onMouseEnter={onMouseEnter}\n      className={ratingStarStyles({\n        gap: size === 'lg' ? 'md' : 'sm',\n        disabled,\n        readOnly,\n      })}\n      data-part=\"star\"\n      onClick={onClick}\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    </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 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 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 { getNearestHalfDecimal, getStarValue, splitAt }\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { cx } from 'class-variance-authority'\nimport {\n  type ChangeEvent,\n  type ComponentPropsWithRef,\n  type MouseEvent,\n  type PropsWithChildren,\n  useCallback,\n  useRef,\n} from 'react'\n\nimport { RatingStar, type RatingStarProps } from './RatingStar'\nimport { getNearestHalfDecimal, getStarValue, splitAt } from './utils'\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?: number\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?: number\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: number) => 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   * Sets the size of the stars.\n   * @default 'md'\n   */\n  size?: RatingStarProps['size']\n  /**\n   * Name of the underlying input.\n   * @default undefined\n   */\n  name?: string\n  /**\n   * id of the underlying input.\n   * @default undefined\n   */\n  id?: string\n  /**\n   * aria-label of the underlying input.\n   * @default undefined\n   */\n  'aria-label': string\n}\n\nexport const Rating = ({\n  defaultValue,\n  value: propValue,\n  onValueChange,\n  size = 'md',\n  disabled,\n  readOnly,\n  name,\n  id,\n  'aria-label': ariaLabel,\n  ref,\n  ...rest\n}: RatingProps) => {\n  const inputRef = useRef<HTMLInputElement>(null)\n  const starRefList = useRef<HTMLDivElement[]>([])\n\n  const [value, setRatingValue] = useCombinedState(propValue, defaultValue, onValueChange)\n\n  const valueRef = useRef(value)\n  const isInteractive = !(disabled || readOnly)\n\n  function onStarClick(index: number) {\n    if (!inputRef.current) return\n\n    setRatingValue(index + 1)\n    valueRef.current = index + 1\n\n    inputRef.current.focus()\n    inputRef.current.setAttribute('data-clicked', '')\n  }\n\n  function onInputChange(event: ChangeEvent<HTMLInputElement>) {\n    // 1. Avoiding unnecessary calls to onValueChange prop if value doesn't change\n    // 2. Preventing value to be resetted to 0\n    if (valueRef.current === Number(event.target.value) || Number(event.target.value) === 0) {\n      return\n    }\n    valueRef.current = Number(event.target.value)\n\n    setRatingValue(Number(event.target.value))\n  }\n\n  function onStarMouseEnter({ currentTarget }: MouseEvent<HTMLDivElement>) {\n    const currentStarIndex = starRefList.current.findIndex(star => star === currentTarget)\n\n    const [previousStars, followingStars] = splitAt(starRefList.current, currentStarIndex + 1)\n\n    previousStars.forEach(star => star.setAttribute('data-hovered', ''))\n    followingStars.forEach(star => star.removeAttribute('data-hovered'))\n  }\n\n  const handleStarRef = useCallback((elm: HTMLDivElement | null) => {\n    if (!elm) return\n    starRefList.current.push(elm)\n  }, [])\n\n  function resetDataPartInputAttr() {\n    inputRef.current?.removeAttribute('data-clicked')\n  }\n\n  function resetDataPartStarAttr() {\n    starRefList.current.forEach(star => star.removeAttribute('data-hovered'))\n  }\n\n  return (\n    <div\n      className=\"relative inline-flex\"\n      ref={ref}\n      data-spark-component=\"rating\"\n      {...rest}\n      onMouseLeave={resetDataPartStarAttr}\n    >\n      <input\n        name={name}\n        id={id}\n        aria-label={ariaLabel}\n        ref={inputRef}\n        data-part=\"input\"\n        className=\"peer absolute inset-0 opacity-0\"\n        type=\"range\"\n        min=\"0\"\n        max=\"5\"\n        step={readOnly ? 0.5 : 1}\n        disabled={disabled}\n        readOnly={readOnly}\n        value={getNearestHalfDecimal(value ?? 0)}\n        onChange={event => isInteractive && onInputChange(event)}\n        onBlur={resetDataPartInputAttr}\n      />\n      <div\n        className={cx(\n          size === 'lg' ? 'gap-x-md' : 'gap-x-sm',\n          'flex',\n          'peer-focus-visible:u-outline peer-[[data-part=input][data-clicked]]:shadow-none'\n        )}\n      >\n        {Array.from({ length: 5 }).map((_, index) => (\n          <RatingStar\n            disabled={disabled}\n            readOnly={readOnly}\n            size={size}\n            onClick={() => isInteractive && onStarClick(index)}\n            onMouseEnter={event => isInteractive && onStarMouseEnter(event)}\n            ref={handleStarRef}\n            key={index}\n            value={getStarValue({ index, value })}\n          />\n        ))}\n      </div>\n    </div>\n  )\n}\n"],"names":["emptyRemainingStarsOnHoverClass","cx","ratingStarStyles","cva","ratingStarIconStyles","RatingStar","value","size","disabled","readOnly","onClick","onMouseEnter","forwardedRef","jsxs","jsx","Icon","StarFill","StarOutline","getNearestHalfDecimal","num","getStarValue","index","starPosition","formattedValue","splitAt","arr","prev","next","Rating","defaultValue","propValue","onValueChange","name","id","ariaLabel","ref","rest","inputRef","useRef","starRefList","setRatingValue","useCombinedState","valueRef","isInteractive","onStarClick","onInputChange","event","onStarMouseEnter","currentTarget","currentStarIndex","star","previousStars","followingStars","handleStarRef","useCallback","elm","resetDataPartInputAttr","resetDataPartStarAttr","_"],"mappings":";;;;;;;AAEA,MAAMA,IAAkCC,EAAG,2BAA2B,GAEhEC,IAAmBC;AAAA,EACvB,CAAC,QAAQ,iBAAiB,SAAS,YAAY,4BAA4B;AAAA,EAC3E;AAAA,IACE,UAAU;AAAA,MACR,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,KAAK;AAAA,QACH,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,QAClF,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,MAAA;AAAA,IACpF;AAAA,IAEF,kBAAkB;AAAA,MAChB;AAAA,QACE,UAAU;AAAA,QACV,UAAU;AAAA,QACV,WAAWF,EAAGD,GAAiC,gBAAgB;AAAA,MAAA;AAAA,IACjE;AAAA,IAEF,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ,GAEMI,IAAuBD,EAAI,IAAI;AAAA,EACnC,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA;AAAA,IAEN,QAAQ;AAAA,MACN,QAAQ;AAAA,QACN;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,UAAU,CAAC,uBAAuB;AAAA,IAAA;AAAA,EACpC;AAEJ,CAAC,GC9BYE,IAAa,CAAC;AAAA,EACzB,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,KAAKC;AACP,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,wBAAqB;AAAA,IACrB,KAAKD;AAAA,IACL,cAAAD;AAAA,IACA,WAAWT,EAAiB;AAAA,MAC1B,KAAKK,MAAS,OAAO,OAAO;AAAA,MAC5B,UAAAC;AAAA,MACA,UAAAC;AAAA,IAAA,CACD;AAAA,IACD,aAAU;AAAA,IACV,SAAAC;AAAA,IAEA,UAAA;AAAA,MAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWb;AAAA,YACT;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,OAAO,EAAE,OAAOK,IAAQ,MAAM,IAAA;AAAA,UAE9B,UAAA,gBAAAQ;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAWX,EAAqB;AAAA,gBAC9B,MAAAG;AAAA,gBACA,QAAQ;AAAA,cAAA,CACT;AAAA,cAED,4BAACS,GAAA,CAAA,CAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QACZ;AAAA,MAAA;AAAA,MAGF,gBAAAF,EAACC,GAAA,EAAK,WAAWX,EAAqB,EAAE,MAAAG,GAAM,QAAQ,WAAA,CAAY,GAChE,UAAA,gBAAAO,EAACG,GAAA,CAAA,CAAY,EAAA,CACf;AAAA,IAAA;AAAA,EAAA;AAAA;AC5DN,SAASC,EAAsBC,GAAqB;AAClD,SAAO,KAAK,MAAMA,IAAM,GAAG,IAAI;AACjC;AAEA,SAASC,EAAa,EAAE,OAAAd,GAAO,OAAAe,KAAuD;AACpF,MAAIf,MAAU,OAAW,QAAO;AAEhC,QAAMgB,IAAeD,IAAQ,GACvBE,IAAiBL,EAAsBZ,CAAK;AAElD,SAAI,KAAK,KAAKiB,CAAc,IAAID,IAAqB,IAE9CC,KAAkBD,IAAe,IAAI;AAC9C;AAEA,SAASE,EAAWC,GAAUJ,GAA2B;AACvD,QAAMK,IAAOD,EAAI,MAAM,GAAGJ,CAAK,GACzBM,IAAOF,EAAI,MAAMJ,CAAK;AAE5B,SAAO,CAACK,GAAMC,CAAI;AACpB;AC0CO,MAAMC,IAAS,CAAC;AAAA,EACrB,cAAAC;AAAA,EACA,OAAOC;AAAA,EACP,eAAAC;AAAA,EACA,MAAAxB,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAuB;AAAA,EACA,IAAAC;AAAA,EACA,cAAcC;AAAA,EACd,KAAAC;AAAA,EACA,GAAGC;AACL,MAAmB;AACjB,QAAMC,IAAWC,EAAyB,IAAI,GACxCC,IAAcD,EAAyB,EAAE,GAEzC,CAAChC,GAAOkC,CAAc,IAAIC,EAAiBX,GAAWD,GAAcE,CAAa,GAEjFW,IAAWJ,EAAOhC,CAAK,GACvBqC,IAAgB,EAAEnC,KAAYC;AAEpC,WAASmC,EAAYvB,GAAe;AAClC,IAAKgB,EAAS,YAEdG,EAAenB,IAAQ,CAAC,GACxBqB,EAAS,UAAUrB,IAAQ,GAE3BgB,EAAS,QAAQ,MAAA,GACjBA,EAAS,QAAQ,aAAa,gBAAgB,EAAE;AAAA,EAClD;AAEA,WAASQ,EAAcC,GAAsC;AAG3D,IAAIJ,EAAS,YAAY,OAAOI,EAAM,OAAO,KAAK,KAAK,OAAOA,EAAM,OAAO,KAAK,MAAM,MAGtFJ,EAAS,UAAU,OAAOI,EAAM,OAAO,KAAK,GAE5CN,EAAe,OAAOM,EAAM,OAAO,KAAK,CAAC;AAAA,EAC3C;AAEA,WAASC,EAAiB,EAAE,eAAAC,KAA6C;AACvE,UAAMC,IAAmBV,EAAY,QAAQ,UAAU,CAAAW,MAAQA,MAASF,CAAa,GAE/E,CAACG,GAAeC,CAAc,IAAI5B,EAAQe,EAAY,SAASU,IAAmB,CAAC;AAEzF,IAAAE,EAAc,QAAQ,CAAAD,MAAQA,EAAK,aAAa,gBAAgB,EAAE,CAAC,GACnEE,EAAe,QAAQ,CAAAF,MAAQA,EAAK,gBAAgB,cAAc,CAAC;AAAA,EACrE;AAEA,QAAMG,IAAgBC,EAAY,CAACC,MAA+B;AAChE,IAAKA,KACLhB,EAAY,QAAQ,KAAKgB,CAAG;AAAA,EAC9B,GAAG,CAAA,CAAE;AAEL,WAASC,IAAyB;AAChC,IAAAnB,EAAS,SAAS,gBAAgB,cAAc;AAAA,EAClD;AAEA,WAASoB,IAAwB;AAC/B,IAAAlB,EAAY,QAAQ,QAAQ,CAAAW,MAAQA,EAAK,gBAAgB,cAAc,CAAC;AAAA,EAC1E;AAEA,SACE,gBAAArC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAAsB;AAAA,MACA,wBAAqB;AAAA,MACpB,GAAGC;AAAA,MACJ,cAAcqB;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAA3C;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAAkB;AAAA,YACA,IAAAC;AAAA,YACA,cAAYC;AAAA,YACZ,KAAKG;AAAA,YACL,aAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,KAAI;AAAA,YACJ,KAAI;AAAA,YACJ,MAAM5B,IAAW,MAAM;AAAA,YACvB,UAAAD;AAAA,YACA,UAAAC;AAAA,YACA,OAAOS,EAAsBZ,KAAS,CAAC;AAAA,YACvC,UAAU,CAAAwC,MAASH,KAAiBE,EAAcC,CAAK;AAAA,YACvD,QAAQU;AAAA,UAAA;AAAA,QAAA;AAAA,QAEV,gBAAA1C;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWb;AAAA,cACTM,MAAS,OAAO,aAAa;AAAA,cAC7B;AAAA,cACA;AAAA,YAAA;AAAA,YAGD,UAAA,MAAM,KAAK,EAAE,QAAQ,GAAG,EAAE,IAAI,CAACmD,GAAGrC,MACjC,gBAAAP;AAAA,cAACT;AAAA,cAAA;AAAA,gBACC,UAAAG;AAAA,gBACA,UAAAC;AAAA,gBACA,MAAAF;AAAA,gBACA,SAAS,MAAMoC,KAAiBC,EAAYvB,CAAK;AAAA,gBACjD,cAAc,CAAAyB,MAASH,KAAiBI,EAAiBD,CAAK;AAAA,gBAC9D,KAAKO;AAAA,gBAEL,OAAOjC,EAAa,EAAE,OAAAC,GAAO,OAAAf,GAAO;AAAA,cAAA;AAAA,cAD/Be;AAAA,YAAA,CAGR;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"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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"}

package/dist/rating/types.d.ts

@@ -1 +1,2 @@
-export type StarValue = 0 | 0.5 | 1;
+export type RatingValue = 0 | 1 | 2 | 3 | 4 | 5;
+export type StarValue = 0 | 1;

package/dist/rating/utils.d.ts

@@ -1,8 +1,7 @@
 import { StarValue } from './types';
-declare function getNearestHalfDecimal(num: number): number;
 declare function getStarValue({ value, index }: {
     value?: number;
     index: number;
 }): StarValue;
 declare function splitAt<T>(arr: T[], index: number): [T[], T[]];
-export { getNearestHalfDecimal, getStarValue, splitAt };
+export { getStarValue, splitAt };

package/dist/rating-display/RatingDisplay.d.ts

@@ -0,0 +1,26 @@
+import { ComponentPropsWithRef, PropsWithChildren } from 'react';
+import { RatingDisplayStarProps } from './RatingDisplayStar';
+export interface RatingDisplayProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {
+    /**
+     * The rating value to display, on a scale from 0 to 5.
+     */
+    value?: number;
+    /**
+     * Sets the size of the stars.
+     * @default 'md'
+     */
+    size?: RatingDisplayStarProps['size'];
+    /**
+     * Optional count value available to `RatingDisplay.Count`.
+     */
+    count?: number;
+    /**
+     * Accessible description of the rating content.
+     */
+    'aria-label': string;
+}
+export type RatingDisplayRootProps = RatingDisplayProps;
+export declare const RatingDisplay: {
+    ({ value, size, count, ref, children, ...rest }: RatingDisplayProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/rating-display/RatingDisplayContext.d.ts

@@ -0,0 +1,12 @@
+import { PropsWithChildren } from 'react';
+import { RatingDisplayStarProps } from './RatingDisplayStar';
+interface RatingDisplayContextValue {
+    value: number;
+    size: RatingDisplayStarProps['size'];
+    count?: number;
+}
+interface RatingDisplayProviderProps extends PropsWithChildren<RatingDisplayContextValue> {
+}
+export declare const RatingDisplayProvider: ({ value, size, count, children, }: RatingDisplayProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useRatingDisplay: () => RatingDisplayContextValue;
+export {};

package/dist/rating-display/RatingDisplayCount.d.ts

@@ -0,0 +1,12 @@
+import { ComponentPropsWithRef, ReactNode } from 'react';
+export interface RatingDisplayCountProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {
+    /**
+     * Custom count content.
+     * Pass a render function to receive the count value and return the content to render.
+     */
+    children?: ReactNode | ((count: number) => ReactNode);
+}
+export declare const RatingDisplayCount: {
+    ({ className, children, ...rest }: RatingDisplayCountProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};

package/dist/rating-display/RatingDisplayStar.d.ts

@@ -0,0 +1,16 @@
+import { VariantProps } from 'class-variance-authority';
+import { StarValue } from './types';
+declare const ratingDisplayStarStyles: (props?: ({
+    gap?: "sm" | "md" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const ratingDisplayStarIconStyles: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    design?: "filled" | "outlined" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type RatingDisplayStarstylesProps = Omit<VariantProps<typeof ratingDisplayStarStyles>, never>;
+type RatingDisplayStarIconStylesProps = Omit<VariantProps<typeof ratingDisplayStarIconStyles>, 'design'>;
+export interface RatingDisplayStarProps extends RatingDisplayStarstylesProps, RatingDisplayStarIconStylesProps {
+    value: StarValue;
+}
+export declare const RatingDisplayStar: ({ value, size }: RatingDisplayStarProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/rating-display/RatingDisplayStars.d.ts

@@ -0,0 +1,22 @@
+import { RatingDisplayStarProps } from './RatingDisplayStar';
+import { StarValue } from './types';
+export interface RatingDisplayStarsProps {
+    size?: RatingDisplayStarProps['size'];
+    /**
+     * Sets the rendering mode for stars.
+     * @default 'default'
+     */
+    variant?: 'default' | 'single-star';
+    /**
+     * Custom fill algorithm for each star.
+     * By default, stars are rounded to the nearest 0.5.
+     */
+    getFillMode?: ({ value, index }: {
+        value?: number;
+        index: number;
+    }) => StarValue;
+}
+export declare const RatingDisplayStars: {
+    ({ size, variant, getFillMode, }: RatingDisplayStarsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/rating-display/RatingDisplayValue.d.ts

@@ -0,0 +1,13 @@
+import { ComponentPropsWithRef, ReactNode } from 'react';
+export interface RatingDisplayValueProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {
+    /**
+     * Custom value content.
+     * Pass a render function to receive the formatted value (first arg) and raw value (second arg),
+     * then return the content to render.
+     */
+    children?: ReactNode | ((formattedValue: string, value: number) => ReactNode);
+}
+export declare const RatingDisplayValue: {
+    ({ className, children, ...rest }: RatingDisplayValueProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/rating-display/index.d.mts

@@ -0,0 +1,14 @@
+import { RatingDisplay as Root } from './RatingDisplay';
+import { RatingDisplayCount as Count } from './RatingDisplayCount';
+import { RatingDisplayStars as Stars } from './RatingDisplayStars';
+import { RatingDisplayValue as Value } from './RatingDisplayValue';
+export declare const RatingDisplay: typeof Root & {
+    Stars: typeof Stars;
+    Value: typeof Value;
+    Count: typeof Count;
+};
+export { type RatingDisplayProps, type RatingDisplayRootProps } from './RatingDisplay';
+export { type RatingDisplayStarsProps } from './RatingDisplayStars';
+export { type RatingDisplayValueProps } from './RatingDisplayValue';
+export { type RatingDisplayCountProps } from './RatingDisplayCount';
+export type { StarValue } from './types';

package/dist/rating-display/index.d.ts

@@ -0,0 +1,14 @@
+import { RatingDisplay as Root } from './RatingDisplay';
+import { RatingDisplayCount as Count } from './RatingDisplayCount';
+import { RatingDisplayStars as Stars } from './RatingDisplayStars';
+import { RatingDisplayValue as Value } from './RatingDisplayValue';
+export declare const RatingDisplay: typeof Root & {
+    Stars: typeof Stars;
+    Value: typeof Value;
+    Count: typeof Count;
+};
+export { type RatingDisplayProps, type RatingDisplayRootProps } from './RatingDisplay';
+export { type RatingDisplayStarsProps } from './RatingDisplayStars';
+export { type RatingDisplayValueProps } from './RatingDisplayValue';
+export { type RatingDisplayCountProps } from './RatingDisplayCount';
+export type { StarValue } from './types';

package/dist/rating-display/index.js

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

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

@@ -0,0 +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 { RatingDisplayProvider } from './RatingDisplayContext'\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\nexport interface RatingDisplayProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\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  ref,\n  children,\n  ...rest\n}: RatingDisplayProps) => {\n  const ratingValue = value ?? 0\n\n  return (\n    <RatingDisplayProvider value={ratingValue} size={size} count={count}>\n      <div\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      </div>\n    </RatingDisplayProvider>\n  )\n}\n\nRatingDisplay.displayName = 'RatingDisplay'\n","import { cx } 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\nexport const RatingDisplayCount = ({ className, children, ...rest }: RatingDisplayCountProps) => {\n  const { count } = useRatingDisplay()\n  if (count === undefined) return null\n  const renderedCount = typeof children === 'function' ? children(count) : (children ?? count)\n\n  return (\n    <span className={cx('text-on-surface/dim-1', 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 { cx } 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\nexport const RatingDisplayValue = ({ className, children, ...rest }: RatingDisplayValueProps) => {\n  const { value } = 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={cx('text-on-surface font-bold', 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","ref","rest","ratingValue","RatingDisplayCount","className","renderedCount","jsxs","cx","ratingDisplayStarStyles","cva","ratingDisplayStarIconStyles","RatingDisplayStar","Icon","StarFill","StarOutline","getNearestHalfDecimal","num","formatRatingValue","locale","getStarValue","index","starPosition","formattedValue","getSingleStarValue","RatingDisplayStars","variant","getFillMode","contextSize","resolvedSize","getDisplayValue","stars","_","starValue","RatingDisplayValue","renderedValue","Root","Stars","Value","Count"],"mappings":"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"}

package/dist/rating-display/index.mjs

@@ -0,0 +1,150 @@
+import { jsx as i, jsxs as D } from "react/jsx-runtime";
+import { createContext as S, useContext as V } from "react";
+import { cx as l, cva as v } from "class-variance-authority";
+import { StarFill as h } from "@spark-ui/icons/StarFill";
+import { StarOutline as b } from "@spark-ui/icons/StarOutline";
+import { I as f } from "../Icon-Ck-dhfLd.mjs";
+const x = S(null), w = ({
+  value: t,
+  size: a,
+  count: e,
+  children: n
+}) => /* @__PURE__ */ i(x.Provider, { value: { value: t, size: a, count: e }, children: n }), m = () => {
+  const t = V(x);
+  if (!t)
+    throw new Error("RatingDisplay compound components must be used within RatingDisplay.");
+  return t;
+}, R = ({
+  value: t = 0,
+  size: a = "md",
+  count: e,
+  ref: n,
+  children: s,
+  ...r
+}) => /* @__PURE__ */ i(w, { value: t ?? 0, size: a, count: e, children: /* @__PURE__ */ i(
+  "div",
+  {
+    ref: n,
+    className: "gap-x-sm relative inline-flex items-center",
+    "data-spark-component": "rating-display",
+    ...r,
+    children: s
+  }
+) });
+R.displayName = "RatingDisplay";
+const u = ({ className: t, children: a, ...e }) => {
+  const { count: n } = m();
+  if (n === void 0) return null;
+  const s = typeof a == "function" ? a(n) : a ?? n;
+  return /* @__PURE__ */ D("span", { className: l("text-on-surface/dim-1", t), ...e, children: [
+    "(",
+    s,
+    ")"
+  ] });
+};
+u.displayName = "RatingDisplay.Count";
+const C = v(["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"
+  }
+}), y = v("", {
+  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"]
+    }
+  }
+}), k = ({ value: t, size: a }) => /* @__PURE__ */ D(
+  "div",
+  {
+    "data-spark-component": "rating-display-star",
+    "data-part": "star",
+    className: C({
+      gap: a === "lg" ? "md" : "sm"
+    }),
+    children: [
+      /* @__PURE__ */ i("div", { className: l("z-raised absolute overflow-hidden"), style: { width: t * 100 + "%" }, children: /* @__PURE__ */ i(
+        f,
+        {
+          className: y({
+            size: a,
+            design: "filled"
+          }),
+          children: /* @__PURE__ */ i(h, {})
+        }
+      ) }),
+      /* @__PURE__ */ i(f, { className: y({ size: a, design: "outlined" }), children: /* @__PURE__ */ i(b, {}) })
+    ]
+  }
+);
+function I(t) {
+  return Math.round(t / 0.5) * 0.5;
+}
+function z(t) {
+  const a = Intl.DateTimeFormat().resolvedOptions().locale;
+  return new Intl.NumberFormat(a, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 1
+  }).format(t);
+}
+function F({ value: t, index: a }) {
+  if (t === void 0) return 0;
+  const e = a + 1, n = I(t);
+  return Math.ceil(n) < e ? 0 : n >= e ? 1 : 0.5;
+}
+function j(t) {
+  return t === void 0 || t < 1 ? 0 : t < 4 ? 0.5 : 1;
+}
+const d = ({
+  size: t,
+  variant: a = "default",
+  getFillMode: e
+}) => {
+  const { value: n, size: s } = m(), r = t ?? s, c = (o) => e ? e({ index: o, value: n }) : a === "single-star" ? j(n) : F({ index: o, value: n }), N = a === "single-star" ? [c(0)] : Array.from({ length: 5 }, (o, p) => c(p));
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      "data-spark-component": "rating-display-stars",
+      className: l(r === "lg" ? "gap-x-md" : "gap-x-sm", "flex"),
+      children: N.map((o, p) => /* @__PURE__ */ i(k, { size: r, value: o }, p))
+    }
+  );
+};
+d.displayName = "RatingDisplay.Stars";
+const g = ({ className: t, children: a, ...e }) => {
+  const { value: n } = m(), s = z(n), r = typeof a == "function" ? a(s, n) : a ?? s;
+  return /* @__PURE__ */ i(
+    "span",
+    {
+      "data-spark-component": "rating-display-value",
+      className: l("text-on-surface font-bold", t),
+      ...e,
+      children: r
+    }
+  );
+};
+g.displayName = "RatingDisplay.Value";
+const O = Object.assign(R, {
+  Stars: d,
+  Value: g,
+  Count: u
+});
+O.displayName = "RatingDisplay";
+d.displayName = "RatingDisplay.Stars";
+g.displayName = "RatingDisplay.Value";
+u.displayName = "RatingDisplay.Count";
+export {
+  O as RatingDisplay
+};
+//# sourceMappingURL=index.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","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 { RatingDisplayProvider } from './RatingDisplayContext'\nimport type { RatingDisplayStarProps } from './RatingDisplayStar'\n\nexport interface RatingDisplayProps extends PropsWithChildren<ComponentPropsWithRef<'div'>> {\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  ref,\n  children,\n  ...rest\n}: RatingDisplayProps) => {\n  const ratingValue = value ?? 0\n\n  return (\n    <RatingDisplayProvider value={ratingValue} size={size} count={count}>\n      <div\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      </div>\n    </RatingDisplayProvider>\n  )\n}\n\nRatingDisplay.displayName = 'RatingDisplay'\n","import { cx } 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\nexport const RatingDisplayCount = ({ className, children, ...rest }: RatingDisplayCountProps) => {\n  const { count } = useRatingDisplay()\n  if (count === undefined) return null\n  const renderedCount = typeof children === 'function' ? children(count) : (children ?? count)\n\n  return (\n    <span className={cx('text-on-surface/dim-1', 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 { cx } 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\nexport const RatingDisplayValue = ({ className, children, ...rest }: RatingDisplayValueProps) => {\n  const { value } = 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={cx('text-on-surface font-bold', 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","ref","rest","RatingDisplayCount","className","renderedCount","jsxs","cx","ratingDisplayStarStyles","cva","ratingDisplayStarIconStyles","RatingDisplayStar","Icon","StarFill","StarOutline","getNearestHalfDecimal","num","formatRatingValue","locale","getStarValue","index","starPosition","formattedValue","getSingleStarValue","RatingDisplayStars","variant","getFillMode","contextSize","resolvedSize","getDisplayValue","stars","_","starValue","RatingDisplayValue","renderedValue","Root","Stars","Value","Count"],"mappings":"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"}

package/dist/rating-display/types.d.ts

@@ -0,0 +1 @@
+export type StarValue = 0 | 0.5 | 1;

package/dist/rating-display/utils.d.ts

@@ -0,0 +1,10 @@
+import { StarValue } from './types';
+declare function getNearestHalfDecimal(num: number): number;
+declare function formatRatingValue(value: number): string;
+declare function getStarValue({ value, index }: {
+    value?: number;
+    index: number;
+}): StarValue;
+declare function getSingleStarValue(value?: number): StarValue;
+declare function splitAt<T>(arr: T[], index: number): [T[], T[]];
+export { formatRatingValue, getNearestHalfDecimal, getSingleStarValue, getStarValue, splitAt };

package/dist/switch/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("@spark-ui/components/form-field"),c=require("class-variance-authority"),v=require("react"),D=require("@spark-ui/hooks/use-combined-state"),$=require("@spark-ui/icons/Check"),L=require("@spark-ui/icons/Close"),w=require("radix-ui"),k=require("../Slot-DQ8z2zsy.js"),a=require("@spark-ui/internal-utils"),P=require("../label/index.js"),T=c.cva(a.tw(["relative shrink-0 self-baseline","cursor-pointer","rounded-full border-transparent","hover:ring-4","transition-colors duration-200 ease-in-out","disabled:hover:ring-transparent disabled:cursor-not-allowed disabled:opacity-dim-3","focus-visible:u-outline","data-[state=unchecked]:bg-on-surface/dim-3","u-shadow-border-transition","overflow-x-hidden"]),{variants:{size:a.makeVariants({sm:a.tw(["h-sz-24","w-sz-40","border-md"]),md:a.tw(["h-sz-32","w-sz-56","border-[4px]"])}),intent:a.makeVariants({main:["data-[state=checked]:bg-main","hover:ring-main-container","text-main"],support:["data-[state=checked]:bg-support","hover:ring-support-container","text-support"],accent:["data-[state=checked]:bg-accent","hover:ring-accent-container","text-accent"],basic:["data-[state=checked]:bg-basic","hover:ring-basic-container","text-basic"],success:["data-[state=checked]:bg-success","hover:ring-success-container","text-success"],alert:["data-[state=checked]:bg-alert","hover:ring-alert-container","text-alert"],error:["data-[state=checked]:bg-error","hover:ring-error-container","text-error"],info:["data-[state=checked]:bg-info","hover:ring-info-container","text-info"],neutral:["data-[state=checked]:bg-neutral","hover:ring-neutral-container","text-neutral"]})},defaultVariants:{intent:"basic",size:"sm"}}),U=c.cva(["pointer-events-none absolute inset-0 flex items-center","transition-all duration-200 ease-in-out"],{variants:{checked:{true:"translate-x-full",false:"translate-x-0"}}}),A=c.cva(["absolute left-0 top-0 flex items-center justify-center","bg-surface","rounded-full","ring-0","transition-all duration-200 ease-in-out"],{variants:{size:a.makeVariants({sm:["h-sz-20","w-sz-20"],md:["h-sz-24","w-sz-24"]}),checked:{true:"-translate-x-full",false:"translate-x-0 text-on-surface/dim-2"}},defaultVariants:{size:"sm",checked:!1}}),S=c.cva(["transition-opacity duration-200"],{variants:{size:a.makeVariants({sm:["h-sz-10 w-sz-10"],md:["h-sz-12 w-sz-12"]})},defaultVariants:{size:"sm"}}),z=({checked:n,checkedIcon:t=e.jsx($.Check,{}),defaultChecked:r,intent:m,uncheckedIcon:o=e.jsx(L.Close,{}),size:i="md",value:b="on",onCheckedChange:x,className:l,required:d,ref:p,...u})=>{const[s,h]=D.useCombinedState(n,r),{name:f,description:q,state:I,isRequired:F,isInvalid:N}=y.useFormFieldControl(),V=I??m,R=g=>{h(g),x?.(g)};return e.jsx(w.Switch.Root,{"data-spark-component":"switch-input",ref:p,className:T({intent:V,size:i,className:l}),value:b,checked:n,defaultChecked:r,onCheckedChange:R,name:f,required:d||F,"aria-invalid":N,"aria-describedby":q,...u,children:e.jsx("span",{className:U({checked:s}),children:e.jsxs(w.Switch.Thumb,{className:A({size:i,checked:s}),children:[s&&t&&e.jsx(k.Slot,{className:S({size:i}),children:t}),!s&&o&&e.jsx(k.Slot,{className:S({size:i}),children:o})]})})})};z.displayName="SwitchInput";const E=c.cva("",{variants:{disabled:{true:["text-neutral/dim-2","cursor-not-allowed"],false:["cursor-pointer"]}},defaultVariants:{disabled:!1}}),G=({className:n,disabled:t,...r})=>e.jsx(P.Label,{"data-spark-component":"switch-label",className:E({disabled:t,className:n}),...r}),j=":switch",C=({size:n="md",children:t,className:r,id:m,disabled:o,reverse:i=!1,ref:b,...x})=>{const l=y.useFormFieldControl(),d=`${j}-label-${v.useId()}`,p=`${j}-input-${v.useId()}`,u=l.id||m||p,s=t&&e.jsx(G,{disabled:o,htmlFor:u,id:d,children:t}),h=e.jsx(z,{ref:b,size:n,id:u,disabled:o,"aria-labelledby":t?d:l.labelId,...x}),f=i?e.jsxs(e.Fragment,{children:[s,h]}):e.jsxs(e.Fragment,{children:[h,s]});return e.jsx("div",{"data-spark-component":"switch",className:c.cx("gap-md text-body-1 flex items-center",r),children:f})};C.displayName="Switch";exports.Switch=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("@spark-ui/components/form-field"),c=require("class-variance-authority"),v=require("react"),D=require("@spark-ui/hooks/use-combined-state"),$=require("@spark-ui/icons/Check"),L=require("@spark-ui/icons/Close"),w=require("radix-ui"),k=require("../Slot-DQ8z2zsy.js"),a=require("@spark-ui/internal-utils"),P=require("../label/index.js"),T=c.cva(a.tw(["relative shrink-0 self-baseline","cursor-pointer","rounded-full border-transparent","hover:ring-4","transition-colors duration-200 ease-in-out","disabled:hover:ring-transparent disabled:cursor-not-allowed disabled:opacity-dim-3","focus-visible:u-outline","data-[state=unchecked]:bg-on-surface/dim-3","u-shadow-border-transition","overflow-x-hidden"]),{variants:{size:a.makeVariants({sm:a.tw(["h-sz-24","w-sz-40","border-md"]),md:a.tw(["h-sz-32","w-sz-56","border-[4px]"])}),intent:a.makeVariants({main:["data-[state=checked]:bg-main","hover:ring-main-container","text-main"],support:["data-[state=checked]:bg-support","hover:ring-support-container","text-support"],accent:["data-[state=checked]:bg-accent","hover:ring-accent-container","text-accent"],basic:["data-[state=checked]:bg-basic","hover:ring-basic-container","text-basic"],success:["data-[state=checked]:bg-success","hover:ring-success-container","text-success"],alert:["data-[state=checked]:bg-alert","hover:ring-alert-container","text-alert"],error:["data-[state=checked]:bg-error","hover:ring-error-container","text-error"],info:["data-[state=checked]:bg-info","hover:ring-info-container","text-info"],neutral:["data-[state=checked]:bg-neutral","hover:ring-neutral-container","text-neutral"]})},defaultVariants:{intent:"basic",size:"sm"}}),U=c.cva(["pointer-events-none absolute inset-0 flex items-center","transition-all duration-200 ease-in-out"],{variants:{checked:{true:"translate-x-full",false:"translate-x-0"}}}),A=c.cva(["absolute left-0 top-0 flex items-center justify-center","bg-surface","rounded-full","ring-0","transition-all duration-200 ease-in-out"],{variants:{size:a.makeVariants({sm:["h-sz-20","w-sz-20"],md:["h-sz-24","w-sz-24"]}),checked:{true:"-translate-x-full",false:"translate-x-0 text-on-surface/dim-2"}},defaultVariants:{size:"sm",checked:!1}}),S=c.cva(["transition-opacity duration-200"],{variants:{size:a.makeVariants({sm:["h-sz-10 w-sz-10"],md:["h-sz-12 w-sz-12"]})},defaultVariants:{size:"sm"}}),z=({checked:n,checkedIcon:t=e.jsx($.Check,{}),defaultChecked:r,intent:m,uncheckedIcon:o=e.jsx(L.Close,{}),size:i="md",value:b="on",onCheckedChange:x,className:l,required:d,ref:p,...u})=>{const[s,h]=D.useCombinedState(n,r),{name:f,description:q,state:I,isRequired:F,isInvalid:N}=y.useFormFieldControl(),V=I??m,R=g=>{h(g),x?.(g)};return e.jsx(w.Switch.Root,{"data-spark-component":"switch-input",ref:p,className:T({intent:V,size:i,className:l}),value:b,checked:n,defaultChecked:r,onCheckedChange:R,name:f,required:d||F,"aria-invalid":N,"aria-describedby":q,...u,children:e.jsx("span",{className:U({checked:s}),children:e.jsxs(w.Switch.Thumb,{className:A({size:i,checked:s}),children:[s&&t&&e.jsx(k.Slot,{className:S({size:i}),children:t}),!s&&o&&e.jsx(k.Slot,{className:S({size:i}),children:o})]})})})};z.displayName="SwitchInput";const E=c.cva("default:text-on-surface",{variants:{disabled:{true:["text-neutral/dim-2","cursor-not-allowed"],false:["cursor-pointer"]}},defaultVariants:{disabled:!1}}),G=({className:n,disabled:t,...r})=>e.jsx(P.Label,{"data-spark-component":"switch-label",className:E({disabled:t,className:n}),...r}),j=":switch",C=({size:n="md",children:t,className:r,id:m,disabled:o,reverse:i=!1,ref:b,...x})=>{const l=y.useFormFieldControl(),d=`${j}-label-${v.useId()}`,p=`${j}-input-${v.useId()}`,u=l.id||m||p,s=t&&e.jsx(G,{disabled:o,htmlFor:u,id:d,children:t}),h=e.jsx(z,{ref:b,size:n,id:u,disabled:o,"aria-labelledby":t?d:l.labelId,...x}),f=i?e.jsxs(e.Fragment,{children:[s,h]}):e.jsxs(e.Fragment,{children:[h,s]});return e.jsx("div",{"data-spark-component":"switch",className:c.cx("gap-md text-body-1 flex items-center",r),children:f})};C.displayName="Switch";exports.Switch=C;
 //# sourceMappingURL=index.js.map

package/dist/switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/switch/SwitchInput.styles.ts","../../src/switch/SwitchInput.tsx","../../src/switch/SwitchLabel.styles.ts","../../src/switch/SwitchLabel.tsx","../../src/switch/Switch.tsx"],"sourcesContent":["import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const styles = cva(\n  tw([\n    'relative shrink-0 self-baseline',\n    'cursor-pointer',\n    'rounded-full border-transparent',\n    'hover:ring-4',\n    'transition-colors duration-200 ease-in-out',\n    'disabled:hover:ring-transparent disabled:cursor-not-allowed disabled:opacity-dim-3',\n    'focus-visible:u-outline',\n    'data-[state=unchecked]:bg-on-surface/dim-3',\n    'u-shadow-border-transition',\n    'overflow-x-hidden',\n  ]),\n  {\n    variants: {\n      /**\n       * Size of the switch input.\n       */\n      size: makeVariants<'size', ['sm', 'md']>({\n        sm: tw(['h-sz-24', 'w-sz-40', 'border-md']),\n        md: tw(['h-sz-32', 'w-sz-56', 'border-[4px]']),\n      }),\n      /**\n       * Color scheme of the switch input.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n      >({\n        main: ['data-[state=checked]:bg-main', 'hover:ring-main-container', 'text-main'],\n        support: [\n          'data-[state=checked]:bg-support',\n          'hover:ring-support-container',\n          'text-support',\n        ],\n        accent: ['data-[state=checked]:bg-accent', 'hover:ring-accent-container', 'text-accent'],\n        basic: ['data-[state=checked]:bg-basic', 'hover:ring-basic-container', 'text-basic'],\n        success: [\n          'data-[state=checked]:bg-success',\n          'hover:ring-success-container',\n          'text-success',\n        ],\n        alert: ['data-[state=checked]:bg-alert', 'hover:ring-alert-container', 'text-alert'],\n        error: ['data-[state=checked]:bg-error', 'hover:ring-error-container', 'text-error'],\n        info: ['data-[state=checked]:bg-info', 'hover:ring-info-container', 'text-info'],\n        neutral: [\n          'data-[state=checked]:bg-neutral',\n          'hover:ring-neutral-container',\n          'text-neutral',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'basic',\n      size: 'sm',\n    },\n  }\n)\n\nexport type StylesProps = VariantProps<typeof styles>\n\nexport const thumbWrapperStyles = cva(\n  [\n    'pointer-events-none absolute inset-0 flex items-center',\n    'transition-all duration-200 ease-in-out',\n  ],\n  {\n    variants: {\n      checked: {\n        true: 'translate-x-full',\n        false: 'translate-x-0',\n      },\n    },\n  }\n)\n\nexport const thumbStyles = cva(\n  [\n    'absolute left-0 top-0 flex items-center justify-center',\n    'bg-surface',\n    'rounded-full',\n    'ring-0',\n    'transition-all duration-200 ease-in-out',\n  ],\n  {\n    variants: {\n      size: makeVariants<'size', ['sm', 'md']>({\n        sm: ['h-sz-20', 'w-sz-20'],\n        md: ['h-sz-24', 'w-sz-24'],\n      }),\n      checked: {\n        true: '-translate-x-full',\n        false: 'translate-x-0 text-on-surface/dim-2',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n      checked: false,\n    },\n  }\n)\n\nexport const thumbCheckSVGStyles = cva(['transition-opacity duration-200'], {\n  variants: {\n    size: makeVariants<'size', ['sm', 'md']>({\n      sm: ['h-sz-10 w-sz-10'],\n      md: ['h-sz-12 w-sz-12'],\n    }),\n  },\n  defaultVariants: {\n    size: 'sm',\n  },\n})\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { Check } from '@spark-ui/icons/Check'\nimport { Close } from '@spark-ui/icons/Close'\nimport { Switch as RadixSwitch } from 'radix-ui'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { Slot } from '../slot'\nimport {\n  styles,\n  type StylesProps,\n  thumbCheckSVGStyles,\n  thumbStyles,\n  thumbWrapperStyles,\n} from './SwitchInput.styles'\n\nexport interface SwitchInputProps\n  extends StylesProps,\n    Omit<ComponentPropsWithRef<'button'>, 'value'> {\n  /**\n   * The state of the switch when it is initially rendered. Use when you do not need to control its state.\n   */\n  defaultChecked?: boolean\n  /**\n   * The controlled state of the switch. Must be used in conjunction with `onCheckedChange`.\n   */\n  checked?: boolean\n  /**\n   * When true, prevents the user from interacting with the switch.\n   */\n  /**\n   * Event handler called when the state of the switch changes.\n   */\n  onCheckedChange?: (checked: boolean) => void\n  /**\n   * When `true`, prevents the user from interacting with the switch.\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must check the switch before the owning form can be submitted.\n   */\n  required?: boolean\n  /**\n   * The name of the switch. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value given as data when submitted with a name.\n   */\n  value?: string\n  /**\n   * Icon shown inside the thumb of the Switch whenever it is checked\n   */\n  checkedIcon?: ReactNode\n  /**\n   * Icon shown inside the thumb of the Switch whenever it is unchecked\n   */\n  uncheckedIcon?: ReactNode\n  /**\n   * When true, the label will be placed on the left side of the Switch\n   */\n  reverse?: boolean\n}\n\nexport const SwitchInput = ({\n  checked,\n  checkedIcon = <Check />,\n  defaultChecked,\n  intent: intentProp,\n  uncheckedIcon = <Close />,\n  size = 'md',\n  value = 'on',\n  onCheckedChange,\n  className,\n  required,\n  ref,\n  ...rest\n}: SwitchInputProps) => {\n  const [isChecked, setIsChecked] = useCombinedState(checked, defaultChecked)\n  const { name, description, state, isRequired, isInvalid } = useFormFieldControl()\n  const intent = state ?? intentProp\n\n  const handleCheckedChange = (updatedValue: boolean): void => {\n    setIsChecked(updatedValue)\n    onCheckedChange?.(updatedValue)\n  }\n\n  return (\n    <RadixSwitch.Root\n      data-spark-component=\"switch-input\"\n      ref={ref}\n      className={styles({ intent, size, className })}\n      value={value}\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={handleCheckedChange}\n      name={name}\n      required={required || isRequired}\n      aria-invalid={isInvalid}\n      aria-describedby={description}\n      {...rest}\n    >\n      <span className={thumbWrapperStyles({ checked: isChecked })}>\n        <RadixSwitch.Thumb className={thumbStyles({ size, checked: isChecked })}>\n          {isChecked && checkedIcon && (\n            <Slot className={thumbCheckSVGStyles({ size })}>{checkedIcon}</Slot>\n          )}\n          {!isChecked && uncheckedIcon && (\n            <Slot className={thumbCheckSVGStyles({ size })}>{uncheckedIcon}</Slot>\n          )}\n        </RadixSwitch.Thumb>\n      </span>\n    </RadixSwitch.Root>\n  )\n}\n\nSwitchInput.displayName = 'SwitchInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const labelStyles = cva('', {\n  variants: {\n    disabled: {\n      true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n      false: ['cursor-pointer'],\n    },\n  },\n  defaultVariants: {\n    disabled: false,\n  },\n})\n\nexport type LabelStylesProps = VariantProps<typeof labelStyles>\n","import { Label, LabelProps } from '../label'\nimport { labelStyles, LabelStylesProps } from './SwitchLabel.styles'\n\nexport interface SwitchLabelProps extends LabelStylesProps, LabelProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * The id of the element the label is associated with.\n   */\n  htmlFor?: string\n  /**\n   * When true, prevents the user from interacting with the switch item.\n   */\n  disabled?: boolean\n}\n\nexport const SwitchLabel = ({ className, disabled, ...others }: SwitchLabelProps) => (\n  <Label\n    data-spark-component=\"switch-label\"\n    className={labelStyles({ disabled, className })}\n    {...others}\n  />\n)\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { cx } from 'class-variance-authority'\nimport { useId } from 'react'\n\nimport { SwitchInput, SwitchInputProps } from './SwitchInput'\nimport { SwitchLabel } from './SwitchLabel'\n\nexport type SwitchProps = SwitchInputProps\n\nconst ID_PREFIX = ':switch'\n\nexport const Switch = ({\n  size = 'md',\n  children,\n  className,\n  id,\n  disabled,\n  reverse = false,\n  ref,\n  ...rest\n}: SwitchProps) => {\n  const field = useFormFieldControl()\n\n  const labelID = `${ID_PREFIX}-label-${useId()}`\n  const innerID = `${ID_PREFIX}-input-${useId()}`\n  const fieldID = field.id || id || innerID\n\n  const switchLabel = children && (\n    <SwitchLabel disabled={disabled} htmlFor={fieldID} id={labelID}>\n      {children}\n    </SwitchLabel>\n  )\n\n  const switchInput = (\n    <SwitchInput\n      ref={ref}\n      size={size}\n      id={fieldID}\n      disabled={disabled}\n      /**\n       * If the switch doesn't have any direct label (children) then we should try to\n       * get an eventual alternative label from FormField.\n       * On last resort, we shouldn't forget to define an aria-label attribute.\n       */\n      aria-labelledby={children ? labelID : field.labelId}\n      {...rest}\n    />\n  )\n\n  const content = reverse ? (\n    <>\n      {switchLabel}\n      {switchInput}\n    </>\n  ) : (\n    <>\n      {switchInput}\n      {switchLabel}\n    </>\n  )\n\n  return (\n    <div\n      data-spark-component=\"switch\"\n      className={cx('gap-md text-body-1 flex items-center', className)}\n    >\n      {content}\n    </div>\n  )\n}\n\nSwitch.displayName = 'Switch'\n"],"names":["styles","cva","tw","makeVariants","thumbWrapperStyles","thumbStyles","thumbCheckSVGStyles","SwitchInput","checked","checkedIcon","Check","defaultChecked","intentProp","uncheckedIcon","Close","size","value","onCheckedChange","className","required","ref","rest","isChecked","setIsChecked","useCombinedState","name","description","state","isRequired","isInvalid","useFormFieldControl","intent","handleCheckedChange","updatedValue","jsx","RadixSwitch","jsxs","Slot","labelStyles","SwitchLabel","disabled","others","Label","ID_PREFIX","Switch","children","id","reverse","field","labelID","useId","innerID","fieldID","switchLabel","switchInput","content","Fragment","cx"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/switch/SwitchInput.styles.ts","../../src/switch/SwitchInput.tsx","../../src/switch/SwitchLabel.styles.ts","../../src/switch/SwitchLabel.tsx","../../src/switch/Switch.tsx"],"sourcesContent":["import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const styles = cva(\n  tw([\n    'relative shrink-0 self-baseline',\n    'cursor-pointer',\n    'rounded-full border-transparent',\n    'hover:ring-4',\n    'transition-colors duration-200 ease-in-out',\n    'disabled:hover:ring-transparent disabled:cursor-not-allowed disabled:opacity-dim-3',\n    'focus-visible:u-outline',\n    'data-[state=unchecked]:bg-on-surface/dim-3',\n    'u-shadow-border-transition',\n    'overflow-x-hidden',\n  ]),\n  {\n    variants: {\n      /**\n       * Size of the switch input.\n       */\n      size: makeVariants<'size', ['sm', 'md']>({\n        sm: tw(['h-sz-24', 'w-sz-40', 'border-md']),\n        md: tw(['h-sz-32', 'w-sz-56', 'border-[4px]']),\n      }),\n      /**\n       * Color scheme of the switch input.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n      >({\n        main: ['data-[state=checked]:bg-main', 'hover:ring-main-container', 'text-main'],\n        support: [\n          'data-[state=checked]:bg-support',\n          'hover:ring-support-container',\n          'text-support',\n        ],\n        accent: ['data-[state=checked]:bg-accent', 'hover:ring-accent-container', 'text-accent'],\n        basic: ['data-[state=checked]:bg-basic', 'hover:ring-basic-container', 'text-basic'],\n        success: [\n          'data-[state=checked]:bg-success',\n          'hover:ring-success-container',\n          'text-success',\n        ],\n        alert: ['data-[state=checked]:bg-alert', 'hover:ring-alert-container', 'text-alert'],\n        error: ['data-[state=checked]:bg-error', 'hover:ring-error-container', 'text-error'],\n        info: ['data-[state=checked]:bg-info', 'hover:ring-info-container', 'text-info'],\n        neutral: [\n          'data-[state=checked]:bg-neutral',\n          'hover:ring-neutral-container',\n          'text-neutral',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'basic',\n      size: 'sm',\n    },\n  }\n)\n\nexport type StylesProps = VariantProps<typeof styles>\n\nexport const thumbWrapperStyles = cva(\n  [\n    'pointer-events-none absolute inset-0 flex items-center',\n    'transition-all duration-200 ease-in-out',\n  ],\n  {\n    variants: {\n      checked: {\n        true: 'translate-x-full',\n        false: 'translate-x-0',\n      },\n    },\n  }\n)\n\nexport const thumbStyles = cva(\n  [\n    'absolute left-0 top-0 flex items-center justify-center',\n    'bg-surface',\n    'rounded-full',\n    'ring-0',\n    'transition-all duration-200 ease-in-out',\n  ],\n  {\n    variants: {\n      size: makeVariants<'size', ['sm', 'md']>({\n        sm: ['h-sz-20', 'w-sz-20'],\n        md: ['h-sz-24', 'w-sz-24'],\n      }),\n      checked: {\n        true: '-translate-x-full',\n        false: 'translate-x-0 text-on-surface/dim-2',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n      checked: false,\n    },\n  }\n)\n\nexport const thumbCheckSVGStyles = cva(['transition-opacity duration-200'], {\n  variants: {\n    size: makeVariants<'size', ['sm', 'md']>({\n      sm: ['h-sz-10 w-sz-10'],\n      md: ['h-sz-12 w-sz-12'],\n    }),\n  },\n  defaultVariants: {\n    size: 'sm',\n  },\n})\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { Check } from '@spark-ui/icons/Check'\nimport { Close } from '@spark-ui/icons/Close'\nimport { Switch as RadixSwitch } from 'radix-ui'\nimport { type ComponentPropsWithRef, type ReactNode } from 'react'\n\nimport { Slot } from '../slot'\nimport {\n  styles,\n  type StylesProps,\n  thumbCheckSVGStyles,\n  thumbStyles,\n  thumbWrapperStyles,\n} from './SwitchInput.styles'\n\nexport interface SwitchInputProps\n  extends StylesProps,\n    Omit<ComponentPropsWithRef<'button'>, 'value'> {\n  /**\n   * The state of the switch when it is initially rendered. Use when you do not need to control its state.\n   */\n  defaultChecked?: boolean\n  /**\n   * The controlled state of the switch. Must be used in conjunction with `onCheckedChange`.\n   */\n  checked?: boolean\n  /**\n   * When true, prevents the user from interacting with the switch.\n   */\n  /**\n   * Event handler called when the state of the switch changes.\n   */\n  onCheckedChange?: (checked: boolean) => void\n  /**\n   * When `true`, prevents the user from interacting with the switch.\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must check the switch before the owning form can be submitted.\n   */\n  required?: boolean\n  /**\n   * The name of the switch. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value given as data when submitted with a name.\n   */\n  value?: string\n  /**\n   * Icon shown inside the thumb of the Switch whenever it is checked\n   */\n  checkedIcon?: ReactNode\n  /**\n   * Icon shown inside the thumb of the Switch whenever it is unchecked\n   */\n  uncheckedIcon?: ReactNode\n  /**\n   * When true, the label will be placed on the left side of the Switch\n   */\n  reverse?: boolean\n}\n\nexport const SwitchInput = ({\n  checked,\n  checkedIcon = <Check />,\n  defaultChecked,\n  intent: intentProp,\n  uncheckedIcon = <Close />,\n  size = 'md',\n  value = 'on',\n  onCheckedChange,\n  className,\n  required,\n  ref,\n  ...rest\n}: SwitchInputProps) => {\n  const [isChecked, setIsChecked] = useCombinedState(checked, defaultChecked)\n  const { name, description, state, isRequired, isInvalid } = useFormFieldControl()\n  const intent = state ?? intentProp\n\n  const handleCheckedChange = (updatedValue: boolean): void => {\n    setIsChecked(updatedValue)\n    onCheckedChange?.(updatedValue)\n  }\n\n  return (\n    <RadixSwitch.Root\n      data-spark-component=\"switch-input\"\n      ref={ref}\n      className={styles({ intent, size, className })}\n      value={value}\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={handleCheckedChange}\n      name={name}\n      required={required || isRequired}\n      aria-invalid={isInvalid}\n      aria-describedby={description}\n      {...rest}\n    >\n      <span className={thumbWrapperStyles({ checked: isChecked })}>\n        <RadixSwitch.Thumb className={thumbStyles({ size, checked: isChecked })}>\n          {isChecked && checkedIcon && (\n            <Slot className={thumbCheckSVGStyles({ size })}>{checkedIcon}</Slot>\n          )}\n          {!isChecked && uncheckedIcon && (\n            <Slot className={thumbCheckSVGStyles({ size })}>{uncheckedIcon}</Slot>\n          )}\n        </RadixSwitch.Thumb>\n      </span>\n    </RadixSwitch.Root>\n  )\n}\n\nSwitchInput.displayName = 'SwitchInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const labelStyles = cva('default:text-on-surface', {\n  variants: {\n    disabled: {\n      true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n      false: ['cursor-pointer'],\n    },\n  },\n  defaultVariants: {\n    disabled: false,\n  },\n})\n\nexport type LabelStylesProps = VariantProps<typeof labelStyles>\n","import { Label, LabelProps } from '../label'\nimport { labelStyles, LabelStylesProps } from './SwitchLabel.styles'\n\nexport interface SwitchLabelProps extends LabelStylesProps, LabelProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * The id of the element the label is associated with.\n   */\n  htmlFor?: string\n  /**\n   * When true, prevents the user from interacting with the switch item.\n   */\n  disabled?: boolean\n}\n\nexport const SwitchLabel = ({ className, disabled, ...others }: SwitchLabelProps) => (\n  <Label\n    data-spark-component=\"switch-label\"\n    className={labelStyles({ disabled, className })}\n    {...others}\n  />\n)\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { cx } from 'class-variance-authority'\nimport { useId } from 'react'\n\nimport { SwitchInput, SwitchInputProps } from './SwitchInput'\nimport { SwitchLabel } from './SwitchLabel'\n\nexport type SwitchProps = SwitchInputProps\n\nconst ID_PREFIX = ':switch'\n\nexport const Switch = ({\n  size = 'md',\n  children,\n  className,\n  id,\n  disabled,\n  reverse = false,\n  ref,\n  ...rest\n}: SwitchProps) => {\n  const field = useFormFieldControl()\n\n  const labelID = `${ID_PREFIX}-label-${useId()}`\n  const innerID = `${ID_PREFIX}-input-${useId()}`\n  const fieldID = field.id || id || innerID\n\n  const switchLabel = children && (\n    <SwitchLabel disabled={disabled} htmlFor={fieldID} id={labelID}>\n      {children}\n    </SwitchLabel>\n  )\n\n  const switchInput = (\n    <SwitchInput\n      ref={ref}\n      size={size}\n      id={fieldID}\n      disabled={disabled}\n      /**\n       * If the switch doesn't have any direct label (children) then we should try to\n       * get an eventual alternative label from FormField.\n       * On last resort, we shouldn't forget to define an aria-label attribute.\n       */\n      aria-labelledby={children ? labelID : field.labelId}\n      {...rest}\n    />\n  )\n\n  const content = reverse ? (\n    <>\n      {switchLabel}\n      {switchInput}\n    </>\n  ) : (\n    <>\n      {switchInput}\n      {switchLabel}\n    </>\n  )\n\n  return (\n    <div\n      data-spark-component=\"switch\"\n      className={cx('gap-md text-body-1 flex items-center', className)}\n    >\n      {content}\n    </div>\n  )\n}\n\nSwitch.displayName = 'Switch'\n"],"names":["styles","cva","tw","makeVariants","thumbWrapperStyles","thumbStyles","thumbCheckSVGStyles","SwitchInput","checked","checkedIcon","Check","defaultChecked","intentProp","uncheckedIcon","Close","size","value","onCheckedChange","className","required","ref","rest","isChecked","setIsChecked","useCombinedState","name","description","state","isRequired","isInvalid","useFormFieldControl","intent","handleCheckedChange","updatedValue","jsx","RadixSwitch","jsxs","Slot","labelStyles","SwitchLabel","disabled","others","Label","ID_PREFIX","Switch","children","id","reverse","field","labelID","useId","innerID","fieldID","switchLabel","switchInput","content","Fragment","cx"],"mappings":"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"}