@spark-ui/components 10.0.10 → 10.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/alert-dialog/index.js.map +1 -1
  3. package/dist/alert-dialog/index.mjs +3 -3
  4. package/dist/badge/index.js.map +1 -1
  5. package/dist/badge/index.mjs.map +1 -1
  6. package/dist/breadcrumb/index.js.map +1 -1
  7. package/dist/breadcrumb/index.mjs +1 -1
  8. package/dist/button/index.js.map +1 -1
  9. package/dist/button/index.mjs +1 -1
  10. package/dist/carousel/index.js.map +1 -1
  11. package/dist/carousel/index.mjs +2 -2
  12. package/dist/chip/index.js.map +1 -1
  13. package/dist/chip/index.mjs.map +1 -1
  14. package/dist/{chunk-PZWESKAR.mjs → chunk-IAR55N4Y.mjs} +2 -2
  15. package/dist/{chunk-2KPFQEAA.mjs → chunk-QLOIAU3C.mjs} +2 -2
  16. package/dist/{chunk-B42LOFIZ.mjs → chunk-QS2FHLSL.mjs} +2 -2
  17. package/dist/chunk-QS2FHLSL.mjs.map +1 -0
  18. package/dist/{chunk-K7VP7DH3.mjs → chunk-STJ7NDWM.mjs} +1 -1
  19. package/dist/chunk-STJ7NDWM.mjs.map +1 -0
  20. package/dist/{chunk-6JOA37TZ.mjs → chunk-USSL4UZ5.mjs} +1 -1
  21. package/dist/chunk-USSL4UZ5.mjs.map +1 -0
  22. package/dist/combobox/index.js.map +1 -1
  23. package/dist/combobox/index.mjs +3 -3
  24. package/dist/combobox/index.mjs.map +1 -1
  25. package/dist/dialog/index.js.map +1 -1
  26. package/dist/dialog/index.mjs +3 -3
  27. package/dist/drawer/index.js.map +1 -1
  28. package/dist/drawer/index.mjs +2 -2
  29. package/dist/dropdown/index.js.map +1 -1
  30. package/dist/dropdown/index.mjs +3 -3
  31. package/dist/dropdown/index.mjs.map +1 -1
  32. package/dist/icon-button/index.js.map +1 -1
  33. package/dist/icon-button/index.mjs +2 -2
  34. package/dist/pagination/index.js.map +1 -1
  35. package/dist/pagination/index.mjs +2 -2
  36. package/dist/popover/index.js.map +1 -1
  37. package/dist/popover/index.mjs +3 -3
  38. package/dist/progress-tracker/index.js.map +1 -1
  39. package/dist/progress-tracker/index.mjs.map +1 -1
  40. package/dist/rating/index.js.map +1 -1
  41. package/dist/rating/index.mjs.map +1 -1
  42. package/dist/scrolling-list/index.js.map +1 -1
  43. package/dist/scrolling-list/index.mjs +2 -2
  44. package/dist/slider/index.js.map +1 -1
  45. package/dist/slider/index.mjs.map +1 -1
  46. package/dist/snackbar/index.js.map +1 -1
  47. package/dist/snackbar/index.mjs +2 -2
  48. package/dist/snackbar/index.mjs.map +1 -1
  49. package/dist/stepper/index.js.map +1 -1
  50. package/dist/stepper/index.mjs +2 -2
  51. package/dist/tabs/index.js.map +1 -1
  52. package/dist/tabs/index.mjs +1 -1
  53. package/dist/tabs/index.mjs.map +1 -1
  54. package/dist/tag/index.js.map +1 -1
  55. package/dist/tag/index.mjs.map +1 -1
  56. package/dist/text-link/index.js.map +1 -1
  57. package/dist/text-link/index.mjs +1 -1
  58. package/package.json +5 -5
  59. package/dist/chunk-6JOA37TZ.mjs.map +0 -1
  60. package/dist/chunk-B42LOFIZ.mjs.map +0 -1
  61. package/dist/chunk-K7VP7DH3.mjs.map +0 -1
  62. /package/dist/{chunk-PZWESKAR.mjs.map → chunk-IAR55N4Y.mjs.map} +0 -0
  63. /package/dist/{chunk-2KPFQEAA.mjs.map → chunk-QLOIAU3C.mjs.map} +0 -0
package/dist/progress-tracker/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/progress-tracker/ProgressTracker.tsx","../../src/progress-tracker/ProgressTracker.styles.ts","../../src/progress-tracker/ProgressTrackerContext.ts","../../src/progress-tracker/ProgressTrackerStep.tsx","../../src/progress-tracker/ProgressTrackerStep.styles.ts","../../src/progress-tracker/ProgressTrackerStepIndicator.tsx","../../src/progress-tracker/ProgressTrackerStepIndicator.styles.ts","../../src/progress-tracker/stepIndicatorVariants/outline.ts","../../src/progress-tracker/stepIndicatorVariants/tinted.ts","../../src/progress-tracker/ProgressTrackerStepLabel.styles.ts","../../src/progress-tracker/ProgressTrackerStepLabel.tsx","../../src/progress-tracker/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type PropsWithChildren, useState } from 'react'\n\nimport { progressList } from './ProgressTracker.styles'\nimport {\n ProgressTrackerContext,\n type ProgressTrackerContextInterface,\n} from './ProgressTrackerContext'\nimport type { StepIndicatorVariantProps } from './ProgressTrackerStepIndicator.styles'\n\nexport interface ProgressTrackerProps\n extends ComponentPropsWithRef<'div'>,\n Pick<StepIndicatorVariantProps, 'size' | 'intent' | 'design'> {\n /**\n * The orientation of the progress tracker\n * @default 'horizontal\"\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The index of the current step.\n * @default 0\n */\n stepIndex?: number\n /**\n * Event handler called when clicking on a step.\n */\n onStepClick?: (stepIndex: number) => void\n /**\n * Sets the component as interactive or not.\n * @default false\n */\n readOnly?: boolean\n}\n\nexport const ProgressTracker = ({\n stepIndex = 0,\n onStepClick,\n readOnly = false,\n intent = 'basic',\n size = 'lg',\n design = 'outline',\n orientation = 'horizontal',\n children,\n className,\n ref,\n ...rest\n}: PropsWithChildren<ProgressTrackerProps>) => {\n const [steps, setSteps] = useState<ProgressTrackerContextInterface['steps']>(new Map())\n\n const Component = readOnly ? 'div' : 'nav'\n\n return (\n <ProgressTrackerContext.Provider\n value={{ stepIndex, onStepClick, steps, setSteps, size, intent, design, readOnly }}\n >\n <Component\n ref={ref}\n data-spark-component=\"progress-tracker\"\n className={cx('inline-flex', className)}\n {...rest}\n >\n <ol\n data-orientation={orientation}\n className={progressList}\n style={{ counterReset: 'step' }}\n >\n {children}\n </ol>\n </Component>\n </ProgressTrackerContext.Provider>\n )\n}\n\nProgressTracker.displayName = 'ProgressTracker'\n","import { cx } from 'class-variance-authority'\n\nexport const progressList = cx([\n 'flex flex-nowrap items-start group/list',\n 'data-[orientation=horizontal]:flex-row data-[orientation=horizontal]:w-full',\n 'data-[orientation=vertical]:flex-col',\n])\n","import { createContext, type Dispatch, type SetStateAction, useContext } from 'react'\n\nimport type { ProgressTrackerProps } from './ProgressTracker'\n\n// Interfaces\nexport type ProgressTrackerContextInterface = Required<\n Pick<ProgressTrackerProps, 'stepIndex' | 'size' | 'intent' | 'design' | 'readOnly'>\n> &\n Pick<ProgressTrackerProps, 'onStepClick'> & {\n steps: Map<string, string[]>\n setSteps: Dispatch<SetStateAction<Map<string, string[]>>>\n }\n\nexport interface ProgressTrackerStepContextInterface {\n index: number\n state: 'active' | 'complete' | 'incomplete'\n}\n\n// Contexts\nexport const ProgressTrackerContext = createContext<ProgressTrackerContextInterface>(\n {} as ProgressTrackerContextInterface\n)\n\nexport const ProgressTrackerStepContext = createContext<ProgressTrackerStepContextInterface>(\n {} as ProgressTrackerStepContextInterface\n)\n\n// Hooks\nexport const useProgressTrackerContext = () => useContext(ProgressTrackerContext)\n\nexport const useProgressTrackerStepContext = () => useContext(ProgressTrackerStepContext)\n\nexport const ID_PREFIX = ':progress-tracker'\n","import { type ComponentPropsWithRef, type ReactNode, useEffect, useId } from 'react'\n\nimport {\n ID_PREFIX,\n ProgressTrackerStepContext,\n useProgressTrackerContext,\n} from './ProgressTrackerContext'\nimport { stepButtonVariant, stepItemVariant } from './ProgressTrackerStep.styles'\nimport { ProgressTrackerStepIndicator } from './ProgressTrackerStepIndicator'\n\nexport type ProgressTrackerStepProps = ComponentPropsWithRef<'li'> &\n (\n | {\n disabled?: boolean\n children: ReactNode\n }\n | {\n disabled?: boolean\n 'aria-label': string\n }\n )\n\nexport const ProgressTrackerStep = ({\n disabled = false,\n children,\n 'aria-label': ariaLabel,\n className,\n ref,\n ...rest\n}: ProgressTrackerStepProps) => {\n const {\n stepIndex: currentStepIndex,\n steps,\n onStepClick,\n setSteps,\n size,\n intent,\n readOnly,\n } = useProgressTrackerContext()\n\n const stepId = `${ID_PREFIX}-step-${useId()}`\n const stepIndex = [...steps.keys()].indexOf(stepId)\n\n const disabledAfter = (() => {\n const nextStepId = [...steps.keys()][stepIndex + 1]\n\n return !!(nextStepId && steps.get(nextStepId)?.includes('disabled'))\n })()\n\n const progressState = (() => {\n if (stepIndex === currentStepIndex) return 'active'\n else if (stepIndex < currentStepIndex) return 'complete'\n else return 'incomplete'\n })()\n\n useEffect(() => {\n setSteps(steps => {\n const newSteps = new Map(steps)\n\n return newSteps.set(\n stepId,\n [progressState, disabled ? 'disabled' : ''].filter(v => !!v)\n )\n })\n\n return () => {\n setSteps(steps => {\n steps.delete(stepId)\n\n return steps\n })\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n return (\n <li\n id={stepId}\n ref={ref}\n data-state={progressState}\n {...(progressState === 'active' && {\n 'aria-current': 'step',\n })}\n className={stepItemVariant({\n size,\n intent,\n disabled,\n disabledAfter,\n })}\n {...rest}\n >\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-interactive={!disabled && !readOnly}\n {...(!disabled &&\n !readOnly && {\n onClick: () => onStepClick?.(stepIndex),\n })}\n disabled={disabled}\n className={stepButtonVariant({\n size,\n readOnly,\n className,\n })}\n >\n <ProgressTrackerStepContext.Provider\n value={{\n index: stepIndex,\n state: progressState,\n }}\n >\n {children || <ProgressTrackerStepIndicator />}\n </ProgressTrackerStepContext.Provider>\n </button>\n </li>\n )\n}\n\nProgressTrackerStep.displayName = 'ProgressTracker.Step'\n","import { cva } from 'class-variance-authority'\n\nexport const stepItemVariant = cva(\n [\n 'relative inline-flex items-start flex-auto first:grow-0 justify-center group/item',\n // Progress Track\n 'after:absolute after:z-base',\n 'last:after:content-none',\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:px-[1px]',\n 'group-data-[orientation=horizontal]/list:before:absolute group-data-[orientation=horizontal]/list:before:z-base',\n 'group-data-[orientation=horizontal]/list:before:left-0 group-data-[orientation=horizontal]/list:after:right-0',\n 'group-data-[orientation=horizontal]/list:before:h-[1px] group-data-[orientation=horizontal]/list:after:h-[1px]',\n 'first:group-data-[orientation=horizontal]/list:before:content-none',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:py-[1px]',\n 'group-data-[orientation=vertical]/list:items-start',\n 'group-data-[orientation=vertical]/list:after:w-[1px] group-data-[orientation=vertical]/list:after:bottom-[-1px]',\n ],\n {\n variants: {\n size: {\n sm: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[8px] group-data-[orientation=horizontal]/list:after:top-[8px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+12px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+12px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+10px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+10px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[8px]',\n 'group-data-[orientation=vertical]/list:after:top-[25px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[21px]',\n ],\n md: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[12px] group-data-[orientation=horizontal]/list:after:top-[12px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+16px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+16px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+14px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+14px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[12px]',\n 'group-data-[orientation=vertical]/list:after:top-[33px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[29px]',\n ],\n lg: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[16px] group-data-[orientation=horizontal]/list:after:top-[16px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+20px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+20px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+18px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+18px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[16px]',\n 'group-data-[orientation=vertical]/list:after:top-[41px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[37px]',\n ],\n },\n intent: {\n basic: ['after:bg-basic', 'group-data-[orientation=horizontal]/list:before:bg-basic'],\n support: ['after:bg-support', 'group-data-[orientation=horizontal]/list:before:bg-support'],\n main: ['after:bg-main', 'group-data-[orientation=horizontal]/list:before:bg-main'],\n neutral: ['after:bg-neutral', 'group-data-[orientation=horizontal]/list:before:bg-neutral'],\n info: ['after:bg-info', 'group-data-[orientation=horizontal]/list:before:bg-info'],\n accent: ['after:bg-accent', 'group-data-[orientation=horizontal]/list:before:bg-accent'],\n danger: ['after:bg-error', 'group-data-[orientation=horizontal]/list:before:bg-error'],\n alert: ['after:bg-alert', 'group-data-[orientation=horizontal]/list:before:bg-alert'],\n success: ['after:bg-success', 'group-data-[orientation=horizontal]/list:before:bg-success'],\n },\n disabled: {\n true: 'before:opacity-dim-3',\n false: '',\n },\n disabledAfter: {\n true: 'after:opacity-dim-3',\n false: '',\n },\n },\n defaultVariants: {\n disabled: false,\n disabledAfter: false,\n size: 'lg',\n intent: 'basic',\n },\n }\n)\n\nexport const stepButtonVariant = cva(\n [\n 'relative flex group/btn disabled:cursor-default',\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:flex-col group-data-[orientation=horizontal]/list:items-center',\n 'group-data-[orientation=horizontal]/list:text-center group-data-[orientation=horizontal]/list:mx-sm',\n 'group-first/item:group-data-[orientation=horizontal]/list:ml-0 group-last/item:group-data-[orientation=horizontal]/list:mr-0',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:flex-row group-data-[orientation=vertical]/list:items-start',\n 'group-data-[orientation=vertical]/list:text-left group-data-[orientation=vertical]/list:my-sm',\n 'group-first/item:group-data-[orientation=vertical]/list:mt-0 group-last/item:group-data-[orientation=vertical]/list:mb-0',\n ],\n {\n variants: {\n size: {\n sm: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-16 group-data-[orientation=horizontal]/list:mt-[16px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-16 group-data-[orientation=vertical]/list:ml-[16px]',\n ],\n md: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-24 group-data-[orientation=horizontal]/list:mt-[24px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-24 group-data-[orientation=vertical]/list:ml-[24px]',\n ],\n lg: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-32 group-data-[orientation=horizontal]/list:mt-[32px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-32 group-data-[orientation=vertical]/list:ml-[32px]',\n ],\n },\n readOnly: {\n true: 'cursor-default',\n false: 'cursor-pointer',\n },\n },\n defaultVariants: {\n size: 'lg',\n readOnly: false,\n },\n }\n)\n","import { Check } from '@spark-ui/icons/Check'\nimport type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { Icon } from '../icon'\nimport { useProgressTrackerContext, useProgressTrackerStepContext } from './ProgressTrackerContext'\nimport { stepIndicatorVariant } from './ProgressTrackerStepIndicator.styles'\n\nexport type ProgressTrackerStepIndicatorProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * The content to be rendered when step status is complete (checkmark icon by default)\n */\n complete?: ReactNode\n /**\n * The content to be rendered when step status is incomplete (step index by default)\n */\n incomplete?: ReactNode\n}\n\nconst CompleteIndicator = () => (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n)\n\nexport const ProgressTrackerStepIndicator = ({\n complete,\n incomplete,\n className,\n}: ProgressTrackerStepIndicatorProps) => {\n const { size, intent, design } = useProgressTrackerContext()\n const { index, state } = useProgressTrackerStepContext()\n\n return (\n <span\n className={stepIndicatorVariant({ size, intent, design, state, className })}\n aria-hidden=\"true\"\n >\n {size !== 'sm' && (\n <>\n {state === 'complete' && (complete === undefined ? <CompleteIndicator /> : complete)}\n {state !== 'complete' && (incomplete === undefined ? `${index + 1}` : incomplete)}\n </>\n )}\n </span>\n )\n}\n\nProgressTrackerStepIndicator.displayName = 'ProgressTracker.StepIndicator'\n","import { cva, type VariantProps } from 'class-variance-authority'\n\nimport { outlineVariants, tintedVariants } from './stepIndicatorVariants'\n\nexport const stepIndicatorVariant = cva(\n [\n 'relative flex shrink-0 justify-center items-center',\n 'rounded-full',\n 'text-body-2 font-bold',\n 'group-disabled/btn:opacity-dim-3',\n ],\n {\n variants: {\n size: {\n sm: [\n 'w-sz-16 h-sz-16',\n 'group-data-[orientation=horizontal]/list:mt-[-16px]',\n 'group-data-[orientation=vertical]/list:ml-[-16px]',\n ],\n md: [\n 'w-sz-24 h-sz-24',\n 'group-data-[orientation=horizontal]/list:mt-[-24px]',\n 'group-data-[orientation=vertical]/list:ml-[-24px]',\n ],\n lg: [\n 'w-sz-32 h-sz-32',\n 'group-data-[orientation=horizontal]/list:mt-[-32px]',\n 'group-data-[orientation=vertical]/list:ml-[-32px]',\n ],\n },\n intent: {\n basic: '',\n support: '',\n main: '',\n neutral: '',\n info: '',\n accent: '',\n danger: '',\n alert: '',\n success: '',\n },\n design: {\n outline: 'border-sm',\n tinted: '',\n },\n state: {\n complete: '',\n incomplete: '',\n active: '',\n },\n },\n /**\n * Known type issue with CVA compoundVariants and VS Code/Intellisense:\n * https://github.com/joe-bell/cva/discussions/195#discussioncomment-6750163\n * */\n /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */\n /* @ts-ignore */\n compoundVariants: [...outlineVariants, ...tintedVariants],\n defaultVariants: {\n size: 'lg',\n state: 'incomplete',\n intent: 'basic',\n design: 'outline',\n },\n }\n)\n\nexport type StepIndicatorVariantProps = VariantProps<typeof stepIndicatorVariant>\n","export const outlineVariants = [\n {\n design: 'outline',\n intent: 'basic',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-basic-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'basic',\n state: 'active',\n class: 'text-on-basic-container bg-basic-container',\n },\n {\n design: 'outline',\n intent: 'support',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-support-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'support',\n state: 'active',\n class: 'text-on-support-container bg-support-container',\n },\n {\n design: 'outline',\n intent: 'main',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-main-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'main',\n state: 'active',\n class: 'text-on-main-container bg-main-container',\n },\n {\n design: 'outline',\n intent: 'neutral',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-neutral-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'neutral',\n state: 'active',\n class: 'text-on-neutral-container bg-neutral-container',\n },\n {\n design: 'outline',\n intent: 'info',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-info-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'info',\n state: 'active',\n class: 'text-on-info-container bg-info-container',\n },\n {\n design: 'outline',\n intent: 'accent',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-accent-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'accent',\n state: 'active',\n class: 'text-on-accent-container bg-accent-container',\n },\n {\n design: 'outline',\n intent: 'danger',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-error-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'danger',\n state: 'active',\n class: 'text-on-error-container bg-error-container',\n },\n {\n design: 'outline',\n intent: 'alert',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-alert-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'alert',\n state: 'active',\n class: 'text-on-alert-container bg-alert-container',\n },\n {\n design: 'outline',\n intent: 'success',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-success-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'success',\n state: 'active',\n class: 'text-on-success-container bg-success-container',\n },\n] as const\n","export const tintedVariants = [\n {\n design: 'tinted',\n intent: 'basic',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-basic-container bg-basic-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-basic-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'basic',\n state: 'active',\n class: 'text-on-basic bg-basic',\n },\n {\n design: 'tinted',\n intent: 'support',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-support-container bg-support-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-support-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'support',\n state: 'active',\n class: 'text-on-support bg-support',\n },\n {\n design: 'tinted',\n intent: 'main',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-main-container bg-main-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-main-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'main',\n state: 'active',\n class: 'text-on-main bg-main',\n },\n {\n design: 'tinted',\n intent: 'neutral',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-neutral-container bg-neutral-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-neutral-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n state: 'active',\n class: 'text-on-neutral bg-neutral',\n },\n {\n design: 'tinted',\n intent: 'info',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-info-container bg-info-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-info-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'info',\n state: 'active',\n class: 'text-on-info bg-info',\n },\n {\n design: 'tinted',\n intent: 'accent',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-accent-container bg-accent-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-accent-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'accent',\n state: 'active',\n class: 'text-on-accent bg-accent',\n },\n {\n design: 'tinted',\n intent: 'danger',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-error-container bg-error-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-error-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'danger',\n state: 'active',\n class: 'text-on-error bg-error',\n },\n {\n design: 'tinted',\n intent: 'alert',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-alert-container bg-alert-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-alert-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'alert',\n state: 'active',\n class: 'text-on-alert bg-alert',\n },\n {\n design: 'tinted',\n intent: 'success',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-success-container bg-success-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-success-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'success',\n state: 'active',\n class: 'text-on-success bg-success',\n },\n] as const\n","import { cva } from 'class-variance-authority'\n\nexport const stepLabel = cva([\n 'flex text-body-2 font-bold',\n 'text-on-surface group-disabled/btn:text-on-surface/dim-1',\n 'group-data-[orientation=horizontal]/list:mt-md',\n 'group-data-[orientation=vertical]/list:ml-md',\n 'group-data-[orientation=vertical]/list:my-auto',\n])\n","import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { stepLabel } from './ProgressTrackerStepLabel.styles'\n\ntype ProgressTrackerStepLabelProps = ComponentPropsWithoutRef<'span'> & {\n children: ReactNode\n}\n\nexport const ProgressTrackerStepLabel = ({\n className,\n children,\n}: ProgressTrackerStepLabelProps) => <span className={stepLabel({ className })}>{children}</span>\n\nProgressTrackerStepLabel.displayName = 'ProgressTracker.StepLabel'\n","import { ProgressTracker as Root, type ProgressTrackerProps } from './ProgressTracker'\nimport { ProgressTrackerStep as Step, type ProgressTrackerStepProps } from './ProgressTrackerStep'\nimport {\n ProgressTrackerStepIndicator as StepIndicator,\n type ProgressTrackerStepIndicatorProps,\n} from './ProgressTrackerStepIndicator'\nimport { ProgressTrackerStepLabel as StepLabel } from './ProgressTrackerStepLabel'\n\nexport const ProgressTracker: typeof Root & {\n Step: typeof Step\n StepLabel: typeof StepLabel\n StepIndicator: typeof StepIndicator\n} = Object.assign(Root, {\n Step,\n StepLabel,\n StepIndicator,\n})\n\nProgressTracker.displayName = 'ProgressTracker'\nStep.displayName = 'ProgressTracker.Step'\nStepLabel.displayName = 'ProgressTracker.StepLabel'\nStepIndicator.displayName = 'ProgressTracker.StepIndicator'\n\nexport type { ProgressTrackerProps, ProgressTrackerStepProps, ProgressTrackerStepIndicatorProps }\n"],"mappings":";;;;;;;AAAA,SAAS,MAAAA,WAAU;AACnB,SAA6D,gBAAgB;;;ACD7E,SAAS,UAAU;AAEZ,IAAM,eAAe,GAAG;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACF,CAAC;;;ACND,SAAS,eAAmD,kBAAkB;AAmBvE,IAAM,yBAAyB;AAAA,EACpC,CAAC;AACH;AAEO,IAAM,6BAA6B;AAAA,EACxC,CAAC;AACH;AAGO,IAAM,4BAA4B,MAAM,WAAW,sBAAsB;AAEzE,IAAM,gCAAgC,MAAM,WAAW,0BAA0B;AAEjF,IAAM,YAAY;;;AF6BjB;AA3BD,IAAM,kBAAkB,CAAC;AAAA,EAC9B,YAAY;AAAA,EACZ;AAAA,EACA,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA+C;AAC7C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAmD,oBAAI,IAAI,CAAC;AAEtF,QAAM,YAAY,WAAW,QAAQ;AAErC,SACE;AAAA,IAAC,uBAAuB;AAAA,IAAvB;AAAA,MACC,OAAO,EAAE,WAAW,aAAa,OAAO,UAAU,MAAM,QAAQ,QAAQ,SAAS;AAAA,MAEjF;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,wBAAqB;AAAA,UACrB,WAAWC,IAAG,eAAe,SAAS;AAAA,UACrC,GAAG;AAAA,UAEJ;AAAA,YAAC;AAAA;AAAA,cACC,oBAAkB;AAAA,cAClB,WAAW;AAAA,cACX,OAAO,EAAE,cAAc,OAAO;AAAA,cAE7B;AAAA;AAAA,UACH;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,gBAAgB,cAAc;;;AGzE9B,SAAqD,WAAW,aAAa;;;ACA7E,SAAS,WAAW;AAEb,IAAM,kBAAkB;AAAA,EAC7B;AAAA,IACE;AAAA;AAAA,IAEA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA;AAAA,UAEF;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA;AAAA,UAEF;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA;AAAA,UAEF;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,MACA,QAAQ;AAAA,QACN,OAAO,CAAC,kBAAkB,0DAA0D;AAAA,QACpF,SAAS,CAAC,oBAAoB,4DAA4D;AAAA,QAC1F,MAAM,CAAC,iBAAiB,yDAAyD;AAAA,QACjF,SAAS,CAAC,oBAAoB,4DAA4D;AAAA,QAC1F,MAAM,CAAC,iBAAiB,yDAAyD;AAAA,QACjF,QAAQ,CAAC,mBAAmB,2DAA2D;AAAA,QACvF,QAAQ,CAAC,kBAAkB,0DAA0D;AAAA,QACrF,OAAO,CAAC,kBAAkB,0DAA0D;AAAA,QACpF,SAAS,CAAC,oBAAoB,4DAA4D;AAAA,MAC5F;AAAA,MACA,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA,eAAe;AAAA,QACb,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,eAAe;AAAA,MACf,MAAM;AAAA,MACN,QAAQ;AAAA,IACV;AAAA,EACF;AACF;AAEO,IAAM,oBAAoB;AAAA,EAC/B;AAAA,IACE;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,MACA,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,EACF;AACF;;;AC3HA,SAAS,aAAa;;;ACAtB,SAAS,OAAAC,YAA8B;;;ACAhC,IAAM,kBAAkB;AAAA,EAC7B;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AACF;;;ACjJO,IAAM,iBAAiB;AAAA,EAC5B;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,CAAC,YAAY,YAAY;AAAA,IAChC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AACF;;;AF7IO,IAAM,uBAAuBC;AAAA,EAClC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,UACF;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA,UACF;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,IAAI;AAAA,UACF;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,MACA,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,MAAM;AAAA,QACN,SAAS;AAAA,QACT,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,SAAS;AAAA,MACX;AAAA,MACA,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,QAAQ;AAAA,MACV;AAAA,MACA,OAAO;AAAA,QACL,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,kBAAkB,CAAC,GAAG,iBAAiB,GAAG,cAAc;AAAA,IACxD,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ;AAAA,IACV;AAAA,EACF;AACF;;;AD7CI,SAkBI,UAlBJ,OAAAC,MAkBI,YAlBJ;AAFJ,IAAM,oBAAoB,MACxB,gBAAAA,KAAC,QAAK,MAAK,MACT,0BAAAA,KAAC,SAAM,GACT;AAGK,IAAM,+BAA+B,CAAC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AACF,MAAyC;AACvC,QAAM,EAAE,MAAM,QAAQ,OAAO,IAAI,0BAA0B;AAC3D,QAAM,EAAE,OAAO,MAAM,IAAI,8BAA8B;AAEvD,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qBAAqB,EAAE,MAAM,QAAQ,QAAQ,OAAO,UAAU,CAAC;AAAA,MAC1E,eAAY;AAAA,MAEX,mBAAS,QACR,iCACG;AAAA,kBAAU,eAAe,aAAa,SAAY,gBAAAA,KAAC,qBAAkB,IAAK;AAAA,QAC1E,UAAU,eAAe,eAAe,SAAY,GAAG,QAAQ,CAAC,KAAK;AAAA,SACxE;AAAA;AAAA,EAEJ;AAEJ;AAEA,6BAA6B,cAAc;;;AFiEpB,gBAAAC,YAAA;AA1FhB,IAAM,sBAAsB,CAAC;AAAA,EAClC,WAAW;AAAA,EACX;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAgC;AAC9B,QAAM;AAAA,IACJ,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,0BAA0B;AAE9B,QAAM,SAAS,GAAG,SAAS,SAAS,MAAM,CAAC;AAC3C,QAAM,YAAY,CAAC,GAAG,MAAM,KAAK,CAAC,EAAE,QAAQ,MAAM;AAElD,QAAM,iBAAiB,MAAM;AAC3B,UAAM,aAAa,CAAC,GAAG,MAAM,KAAK,CAAC,EAAE,YAAY,CAAC;AAElD,WAAO,CAAC,EAAE,cAAc,MAAM,IAAI,UAAU,GAAG,SAAS,UAAU;AAAA,EACpE,GAAG;AAEH,QAAM,iBAAiB,MAAM;AAC3B,QAAI,cAAc,iBAAkB,QAAO;AAAA,aAClC,YAAY,iBAAkB,QAAO;AAAA,QACzC,QAAO;AAAA,EACd,GAAG;AAEH,YAAU,MAAM;AACd,aAAS,CAAAC,WAAS;AAChB,YAAM,WAAW,IAAI,IAAIA,MAAK;AAE9B,aAAO,SAAS;AAAA,QACd;AAAA,QACA,CAAC,eAAe,WAAW,aAAa,EAAE,EAAE,OAAO,OAAK,CAAC,CAAC,CAAC;AAAA,MAC7D;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,eAAS,CAAAA,WAAS;AAChB,QAAAA,OAAM,OAAO,MAAM;AAEnB,eAAOA;AAAA,MACT,CAAC;AAAA,IACH;AAAA,EAEF,GAAG,CAAC,CAAC;AAEL,SACE,gBAAAD;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ;AAAA,MACA,cAAY;AAAA,MACX,GAAI,kBAAkB,YAAY;AAAA,QACjC,gBAAgB;AAAA,MAClB;AAAA,MACA,WAAW,gBAAgB;AAAA,QACzB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACA,GAAG;AAAA,MAEJ,0BAAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAY;AAAA,UACZ,oBAAkB,CAAC,YAAY,CAAC;AAAA,UAC/B,GAAI,CAAC,YACJ,CAAC,YAAY;AAAA,YACX,SAAS,MAAM,cAAc,SAAS;AAAA,UACxC;AAAA,UACF;AAAA,UACA,WAAW,kBAAkB;AAAA,YAC3B;AAAA,YACA;AAAA,YACA;AAAA,UACF,CAAC;AAAA,UAED,0BAAAA;AAAA,YAAC,2BAA2B;AAAA,YAA3B;AAAA,cACC,OAAO;AAAA,gBACL,OAAO;AAAA,gBACP,OAAO;AAAA,cACT;AAAA,cAEC,sBAAY,gBAAAA,KAAC,gCAA6B;AAAA;AAAA,UAC7C;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,oBAAoB,cAAc;;;AMvHlC,SAAS,OAAAE,YAAW;AAEb,IAAM,YAAYA,KAAI;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;;;ACGoC,gBAAAC,YAAA;AAH9B,IAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AACF,MAAqC,gBAAAA,KAAC,UAAK,WAAW,UAAU,EAAE,UAAU,CAAC,GAAI,UAAS;AAE1F,yBAAyB,cAAc;;;ACLhC,IAAMC,mBAIT,OAAO,OAAO,iBAAM;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAEDA,iBAAgB,cAAc;AAC9B,oBAAK,cAAc;AACnB,yBAAU,cAAc;AACxB,6BAAc,cAAc;","names":["cx","cx","cva","cva","jsx","jsx","steps","cva","jsx","ProgressTracker"]}
1
+ {"version":3,"sources":["../../src/progress-tracker/ProgressTracker.tsx","../../src/progress-tracker/ProgressTracker.styles.ts","../../src/progress-tracker/ProgressTrackerContext.ts","../../src/progress-tracker/ProgressTrackerStep.tsx","../../src/progress-tracker/ProgressTrackerStep.styles.ts","../../src/progress-tracker/ProgressTrackerStepIndicator.tsx","../../src/progress-tracker/ProgressTrackerStepIndicator.styles.ts","../../src/progress-tracker/stepIndicatorVariants/outline.ts","../../src/progress-tracker/stepIndicatorVariants/tinted.ts","../../src/progress-tracker/ProgressTrackerStepLabel.styles.ts","../../src/progress-tracker/ProgressTrackerStepLabel.tsx","../../src/progress-tracker/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef, type PropsWithChildren, useState } from 'react'\n\nimport { progressList } from './ProgressTracker.styles'\nimport {\n ProgressTrackerContext,\n type ProgressTrackerContextInterface,\n} from './ProgressTrackerContext'\nimport type { StepIndicatorVariantProps } from './ProgressTrackerStepIndicator.styles'\n\nexport interface ProgressTrackerProps\n extends ComponentPropsWithRef<'div'>,\n Pick<StepIndicatorVariantProps, 'size' | 'intent' | 'design'> {\n /**\n * The orientation of the progress tracker\n * @default 'horizontal\"\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The index of the current step.\n * @default 0\n */\n stepIndex?: number\n /**\n * Event handler called when clicking on a step.\n */\n onStepClick?: (stepIndex: number) => void\n /**\n * Sets the component as interactive or not.\n * @default false\n */\n readOnly?: boolean\n}\n\nexport const ProgressTracker = ({\n stepIndex = 0,\n onStepClick,\n readOnly = false,\n intent = 'basic',\n size = 'lg',\n design = 'outline',\n orientation = 'horizontal',\n children,\n className,\n ref,\n ...rest\n}: PropsWithChildren<ProgressTrackerProps>) => {\n const [steps, setSteps] = useState<ProgressTrackerContextInterface['steps']>(new Map())\n\n const Component = readOnly ? 'div' : 'nav'\n\n return (\n <ProgressTrackerContext.Provider\n value={{ stepIndex, onStepClick, steps, setSteps, size, intent, design, readOnly }}\n >\n <Component\n ref={ref}\n data-spark-component=\"progress-tracker\"\n className={cx('inline-flex', className)}\n {...rest}\n >\n <ol\n data-orientation={orientation}\n className={progressList}\n style={{ counterReset: 'step' }}\n >\n {children}\n </ol>\n </Component>\n </ProgressTrackerContext.Provider>\n )\n}\n\nProgressTracker.displayName = 'ProgressTracker'\n","import { cx } from 'class-variance-authority'\n\nexport const progressList = cx([\n 'flex flex-nowrap items-start group/list',\n 'data-[orientation=horizontal]:flex-row data-[orientation=horizontal]:w-full',\n 'data-[orientation=vertical]:flex-col',\n])\n","import { createContext, type Dispatch, type SetStateAction, useContext } from 'react'\n\nimport type { ProgressTrackerProps } from './ProgressTracker'\n\n// Interfaces\nexport type ProgressTrackerContextInterface = Required<\n Pick<ProgressTrackerProps, 'stepIndex' | 'size' | 'intent' | 'design' | 'readOnly'>\n> &\n Pick<ProgressTrackerProps, 'onStepClick'> & {\n steps: Map<string, string[]>\n setSteps: Dispatch<SetStateAction<Map<string, string[]>>>\n }\n\nexport interface ProgressTrackerStepContextInterface {\n index: number\n state: 'active' | 'complete' | 'incomplete'\n}\n\n// Contexts\nexport const ProgressTrackerContext = createContext<ProgressTrackerContextInterface>(\n {} as ProgressTrackerContextInterface\n)\n\nexport const ProgressTrackerStepContext = createContext<ProgressTrackerStepContextInterface>(\n {} as ProgressTrackerStepContextInterface\n)\n\n// Hooks\nexport const useProgressTrackerContext = () => useContext(ProgressTrackerContext)\n\nexport const useProgressTrackerStepContext = () => useContext(ProgressTrackerStepContext)\n\nexport const ID_PREFIX = ':progress-tracker'\n","import { type ComponentPropsWithRef, type ReactNode, useEffect, useId } from 'react'\n\nimport {\n ID_PREFIX,\n ProgressTrackerStepContext,\n useProgressTrackerContext,\n} from './ProgressTrackerContext'\nimport { stepButtonVariant, stepItemVariant } from './ProgressTrackerStep.styles'\nimport { ProgressTrackerStepIndicator } from './ProgressTrackerStepIndicator'\n\nexport type ProgressTrackerStepProps = ComponentPropsWithRef<'li'> &\n (\n | {\n disabled?: boolean\n children: ReactNode\n }\n | {\n disabled?: boolean\n 'aria-label': string\n }\n )\n\nexport const ProgressTrackerStep = ({\n disabled = false,\n children,\n 'aria-label': ariaLabel,\n className,\n ref,\n ...rest\n}: ProgressTrackerStepProps) => {\n const {\n stepIndex: currentStepIndex,\n steps,\n onStepClick,\n setSteps,\n size,\n intent,\n readOnly,\n } = useProgressTrackerContext()\n\n const stepId = `${ID_PREFIX}-step-${useId()}`\n const stepIndex = [...steps.keys()].indexOf(stepId)\n\n const disabledAfter = (() => {\n const nextStepId = [...steps.keys()][stepIndex + 1]\n\n return !!(nextStepId && steps.get(nextStepId)?.includes('disabled'))\n })()\n\n const progressState = (() => {\n if (stepIndex === currentStepIndex) return 'active'\n else if (stepIndex < currentStepIndex) return 'complete'\n else return 'incomplete'\n })()\n\n useEffect(() => {\n setSteps(steps => {\n const newSteps = new Map(steps)\n\n return newSteps.set(\n stepId,\n [progressState, disabled ? 'disabled' : ''].filter(v => !!v)\n )\n })\n\n return () => {\n setSteps(steps => {\n steps.delete(stepId)\n\n return steps\n })\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n return (\n <li\n id={stepId}\n ref={ref}\n data-state={progressState}\n {...(progressState === 'active' && {\n 'aria-current': 'step',\n })}\n className={stepItemVariant({\n size,\n intent,\n disabled,\n disabledAfter,\n })}\n {...rest}\n >\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-interactive={!disabled && !readOnly}\n {...(!disabled &&\n !readOnly && {\n onClick: () => onStepClick?.(stepIndex),\n })}\n disabled={disabled}\n className={stepButtonVariant({\n size,\n readOnly,\n className,\n })}\n >\n <ProgressTrackerStepContext.Provider\n value={{\n index: stepIndex,\n state: progressState,\n }}\n >\n {children || <ProgressTrackerStepIndicator />}\n </ProgressTrackerStepContext.Provider>\n </button>\n </li>\n )\n}\n\nProgressTrackerStep.displayName = 'ProgressTracker.Step'\n","import { cva } from 'class-variance-authority'\n\nexport const stepItemVariant = cva(\n [\n 'relative inline-flex items-start flex-auto first:grow-0 justify-center group/item',\n // Progress Track\n 'after:absolute after:z-base',\n 'last:after:content-none',\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:px-[1px]',\n 'group-data-[orientation=horizontal]/list:before:absolute group-data-[orientation=horizontal]/list:before:z-base',\n 'group-data-[orientation=horizontal]/list:before:left-0 group-data-[orientation=horizontal]/list:after:right-0',\n 'group-data-[orientation=horizontal]/list:before:h-[1px] group-data-[orientation=horizontal]/list:after:h-[1px]',\n 'first:group-data-[orientation=horizontal]/list:before:content-none',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:py-[1px]',\n 'group-data-[orientation=vertical]/list:items-start',\n 'group-data-[orientation=vertical]/list:after:w-[1px] group-data-[orientation=vertical]/list:after:bottom-[-1px]',\n ],\n {\n variants: {\n size: {\n sm: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[8px] group-data-[orientation=horizontal]/list:after:top-[8px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+12px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+12px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+10px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+10px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[8px]',\n 'group-data-[orientation=vertical]/list:after:top-[25px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[21px]',\n ],\n md: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[12px] group-data-[orientation=horizontal]/list:after:top-[12px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+16px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+16px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+14px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+14px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[12px]',\n 'group-data-[orientation=vertical]/list:after:top-[33px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[29px]',\n ],\n lg: [\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:before:top-[16px] group-data-[orientation=horizontal]/list:after:top-[16px]',\n 'group-data-[orientation=horizontal]/list:before:right-[calc(50%+20px)] group-data-[orientation=horizontal]/list:after:left-[calc(50%+20px)]',\n 'first:group-data-[orientation=horizontal]/list:after:left-[calc(50%+18px)]',\n 'last:group-data-[orientation=horizontal]/list:before:right-[calc(50%+18px)]',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:after:left-[16px]',\n 'group-data-[orientation=vertical]/list:after:top-[41px]',\n 'first:group-data-[orientation=vertical]/list:after:top-[37px]',\n ],\n },\n intent: {\n basic: ['after:bg-basic', 'group-data-[orientation=horizontal]/list:before:bg-basic'],\n support: ['after:bg-support', 'group-data-[orientation=horizontal]/list:before:bg-support'],\n main: ['after:bg-main', 'group-data-[orientation=horizontal]/list:before:bg-main'],\n neutral: ['after:bg-neutral', 'group-data-[orientation=horizontal]/list:before:bg-neutral'],\n info: ['after:bg-info', 'group-data-[orientation=horizontal]/list:before:bg-info'],\n accent: ['after:bg-accent', 'group-data-[orientation=horizontal]/list:before:bg-accent'],\n danger: ['after:bg-error', 'group-data-[orientation=horizontal]/list:before:bg-error'],\n alert: ['after:bg-alert', 'group-data-[orientation=horizontal]/list:before:bg-alert'],\n success: ['after:bg-success', 'group-data-[orientation=horizontal]/list:before:bg-success'],\n },\n disabled: {\n true: 'before:opacity-dim-3',\n false: '',\n },\n disabledAfter: {\n true: 'after:opacity-dim-3',\n false: '',\n },\n },\n defaultVariants: {\n disabled: false,\n disabledAfter: false,\n size: 'lg',\n intent: 'basic',\n },\n }\n)\n\nexport const stepButtonVariant = cva(\n [\n 'relative flex group/btn disabled:cursor-default',\n // Horizontal orientation\n 'group-data-[orientation=horizontal]/list:flex-col group-data-[orientation=horizontal]/list:items-center',\n 'group-data-[orientation=horizontal]/list:text-center group-data-[orientation=horizontal]/list:mx-sm',\n 'group-first/item:group-data-[orientation=horizontal]/list:ml-0 group-last/item:group-data-[orientation=horizontal]/list:mr-0',\n // Vertical orientation\n 'group-data-[orientation=vertical]/list:flex-row group-data-[orientation=vertical]/list:items-start',\n 'group-data-[orientation=vertical]/list:text-left group-data-[orientation=vertical]/list:my-sm',\n 'group-first/item:group-data-[orientation=vertical]/list:mt-0 group-last/item:group-data-[orientation=vertical]/list:mb-0',\n ],\n {\n variants: {\n size: {\n sm: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-16 group-data-[orientation=horizontal]/list:mt-[16px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-16 group-data-[orientation=vertical]/list:ml-[16px]',\n ],\n md: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-24 group-data-[orientation=horizontal]/list:mt-[24px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-24 group-data-[orientation=vertical]/list:ml-[24px]',\n ],\n lg: [\n 'group-data-[orientation=horizontal]/list:min-w-sz-32 group-data-[orientation=horizontal]/list:mt-[32px]',\n 'group-data-[orientation=vertical]/list:min-h-sz-32 group-data-[orientation=vertical]/list:ml-[32px]',\n ],\n },\n readOnly: {\n true: 'cursor-default',\n false: 'cursor-pointer',\n },\n },\n defaultVariants: {\n size: 'lg',\n readOnly: false,\n },\n }\n)\n","import { Check } from '@spark-ui/icons/Check'\nimport type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { Icon } from '../icon'\nimport { useProgressTrackerContext, useProgressTrackerStepContext } from './ProgressTrackerContext'\nimport { stepIndicatorVariant } from './ProgressTrackerStepIndicator.styles'\n\nexport type ProgressTrackerStepIndicatorProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * The content to be rendered when step status is complete (checkmark icon by default)\n */\n complete?: ReactNode\n /**\n * The content to be rendered when step status is incomplete (step index by default)\n */\n incomplete?: ReactNode\n}\n\nconst CompleteIndicator = () => (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n)\n\nexport const ProgressTrackerStepIndicator = ({\n complete,\n incomplete,\n className,\n}: ProgressTrackerStepIndicatorProps) => {\n const { size, intent, design } = useProgressTrackerContext()\n const { index, state } = useProgressTrackerStepContext()\n\n return (\n <span\n className={stepIndicatorVariant({ size, intent, design, state, className })}\n aria-hidden=\"true\"\n >\n {size !== 'sm' && (\n <>\n {state === 'complete' && (complete === undefined ? <CompleteIndicator /> : complete)}\n {state !== 'complete' && (incomplete === undefined ? `${index + 1}` : incomplete)}\n </>\n )}\n </span>\n )\n}\n\nProgressTrackerStepIndicator.displayName = 'ProgressTracker.StepIndicator'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nimport { outlineVariants, tintedVariants } from './stepIndicatorVariants'\n\nexport const stepIndicatorVariant = cva(\n [\n 'relative flex shrink-0 justify-center items-center',\n 'rounded-full',\n 'text-body-2 font-bold',\n 'group-disabled/btn:opacity-dim-3',\n ],\n {\n variants: {\n size: {\n sm: [\n 'w-sz-16 h-sz-16',\n 'group-data-[orientation=horizontal]/list:mt-[-16px]',\n 'group-data-[orientation=vertical]/list:ml-[-16px]',\n ],\n md: [\n 'w-sz-24 h-sz-24',\n 'group-data-[orientation=horizontal]/list:mt-[-24px]',\n 'group-data-[orientation=vertical]/list:ml-[-24px]',\n ],\n lg: [\n 'w-sz-32 h-sz-32',\n 'group-data-[orientation=horizontal]/list:mt-[-32px]',\n 'group-data-[orientation=vertical]/list:ml-[-32px]',\n ],\n },\n intent: {\n basic: '',\n support: '',\n main: '',\n neutral: '',\n info: '',\n accent: '',\n danger: '',\n alert: '',\n success: '',\n },\n design: {\n outline: 'border-sm',\n tinted: '',\n },\n state: {\n complete: '',\n incomplete: '',\n active: '',\n },\n },\n /**\n * Known type issue with CVA compoundVariants and VS Code/Intellisense:\n * https://github.com/joe-bell/cva/discussions/195#discussioncomment-6750163\n * */\n /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */\n /* @ts-ignore */\n compoundVariants: [...outlineVariants, ...tintedVariants],\n defaultVariants: {\n size: 'lg',\n state: 'incomplete',\n intent: 'basic',\n design: 'outline',\n },\n }\n)\n\nexport type StepIndicatorVariantProps = VariantProps<typeof stepIndicatorVariant>\n","export const outlineVariants = [\n {\n design: 'outline',\n intent: 'basic',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-basic-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'basic',\n state: 'active',\n class: 'text-on-basic-container bg-basic-container',\n },\n {\n design: 'outline',\n intent: 'support',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-support-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'support',\n state: 'active',\n class: 'text-on-support-container bg-support-container',\n },\n {\n design: 'outline',\n intent: 'main',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-main-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'main',\n state: 'active',\n class: 'text-on-main-container bg-main-container',\n },\n {\n design: 'outline',\n intent: 'neutral',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-neutral-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'neutral',\n state: 'active',\n class: 'text-on-neutral-container bg-neutral-container',\n },\n {\n design: 'outline',\n intent: 'info',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-info-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'info',\n state: 'active',\n class: 'text-on-info-container bg-info-container',\n },\n {\n design: 'outline',\n intent: 'accent',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-accent-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'accent',\n state: 'active',\n class: 'text-on-accent-container bg-accent-container',\n },\n {\n design: 'outline',\n intent: 'danger',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-error-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'danger',\n state: 'active',\n class: 'text-on-error-container bg-error-container',\n },\n {\n design: 'outline',\n intent: 'alert',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-alert-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'alert',\n state: 'active',\n class: 'text-on-alert-container bg-alert-container',\n },\n {\n design: 'outline',\n intent: 'success',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-success-container bg-transparent',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-transparent',\n ],\n },\n {\n design: 'outline',\n intent: 'success',\n state: 'active',\n class: 'text-on-success-container bg-success-container',\n },\n] as const\n","export const tintedVariants = [\n {\n design: 'tinted',\n intent: 'basic',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-basic-container bg-basic-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-basic-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'basic',\n state: 'active',\n class: 'text-on-basic bg-basic',\n },\n {\n design: 'tinted',\n intent: 'support',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-support-container bg-support-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-support-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'support',\n state: 'active',\n class: 'text-on-support bg-support',\n },\n {\n design: 'tinted',\n intent: 'main',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-main-container bg-main-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-main-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'main',\n state: 'active',\n class: 'text-on-main bg-main',\n },\n {\n design: 'tinted',\n intent: 'neutral',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-neutral-container bg-neutral-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-neutral-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n state: 'active',\n class: 'text-on-neutral bg-neutral',\n },\n {\n design: 'tinted',\n intent: 'info',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-info-container bg-info-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-info-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'info',\n state: 'active',\n class: 'text-on-info bg-info',\n },\n {\n design: 'tinted',\n intent: 'accent',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-accent-container bg-accent-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-accent-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'accent',\n state: 'active',\n class: 'text-on-accent bg-accent',\n },\n {\n design: 'tinted',\n intent: 'danger',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-error-container bg-error-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-error-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'danger',\n state: 'active',\n class: 'text-on-error bg-error',\n },\n {\n design: 'tinted',\n intent: 'alert',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-alert-container bg-alert-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-alert-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'alert',\n state: 'active',\n class: 'text-on-alert bg-alert',\n },\n {\n design: 'tinted',\n intent: 'success',\n state: ['complete', 'incomplete'],\n class: [\n 'text-on-success-container bg-success-container',\n 'group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered',\n 'group-hover/btn:group-data-[interactive=false]/btn:bg-success-container',\n ],\n },\n {\n design: 'tinted',\n intent: 'success',\n state: 'active',\n class: 'text-on-success bg-success',\n },\n] as const\n","import { cva } from 'class-variance-authority'\n\nexport const stepLabel = cva([\n 'flex text-body-2 font-bold',\n 'text-on-surface group-disabled/btn:text-on-surface/dim-1',\n 'group-data-[orientation=horizontal]/list:mt-md',\n 'group-data-[orientation=vertical]/list:ml-md',\n 'group-data-[orientation=vertical]/list:my-auto',\n])\n","import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { stepLabel } from './ProgressTrackerStepLabel.styles'\n\ntype ProgressTrackerStepLabelProps = ComponentPropsWithoutRef<'span'> & {\n children: ReactNode\n}\n\nexport const ProgressTrackerStepLabel = ({\n className,\n children,\n}: ProgressTrackerStepLabelProps) => <span className={stepLabel({ className })}>{children}</span>\n\nProgressTrackerStepLabel.displayName = 'ProgressTracker.StepLabel'\n","import { ProgressTracker as Root, type ProgressTrackerProps } from './ProgressTracker'\nimport { ProgressTrackerStep as Step, type ProgressTrackerStepProps } from './ProgressTrackerStep'\nimport {\n ProgressTrackerStepIndicator as StepIndicator,\n type ProgressTrackerStepIndicatorProps,\n} from './ProgressTrackerStepIndicator'\nimport { ProgressTrackerStepLabel as StepLabel } from './ProgressTrackerStepLabel'\n\nexport const ProgressTracker: typeof Root & {\n Step: typeof Step\n StepLabel: typeof StepLabel\n StepIndicator: typeof StepIndicator\n} = Object.assign(Root, {\n Step,\n StepLabel,\n StepIndicator,\n})\n\nProgressTracker.displayName = 'ProgressTracker'\nStep.displayName = 'ProgressTracker.Step'\nStepLabel.displayName = 'ProgressTracker.StepLabel'\nStepIndicator.displayName = 'ProgressTracker.StepIndicator'\n\nexport type { ProgressTrackerProps, ProgressTrackerStepProps, ProgressTrackerStepIndicatorProps }\n"],"mappings":"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","names":["cx","cx","cva","cva","jsx","jsx","steps","cva","jsx","ProgressTracker"]}
package/dist/rating/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/rating/index.ts","../../src/rating/Rating.tsx","../../src/rating/RatingStar.tsx","../../src/icon/Icon.tsx","../../src/slot/Slot.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/rating/RatingStar.styles.ts","../../src/rating/utils.ts"],"sourcesContent":["export { Rating, type RatingProps } from './Rating'\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","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 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 { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","import { cva, cx, type 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 { 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"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gCAAiC;AACjC,IAAAA,mCAAmB;AACnB,IAAAC,gBAOO;;;ACTP,sBAAyB;AACzB,yBAA4B;AAC5B,IAAAC,mCAAmB;;;ACFnB,IAAAC,gBAA0F;;;ACA1F,sBAAkC;AAClC,mBAOO;AASE;AAPF,IAAM,YAAY,gBAAAC,KAAU;AAM5B,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AACpD,SAAO,4CAAC,gBAAAA,KAAU,MAAV,EAAe,KAAW,GAAG,OAAO;AAC9C;;;ACFI,IAAAC,sBAAA;AAJG,IAAM,iBAAiB,CAAC,EAAE,UAAU,OAAO,KAAK,GAAG,MAAM,MAA2B;AACzF,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,OAAO;AAAA;AAAA,QAEL,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,MAAM;AAAA,QACN,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;;;ACrC7B,4BAA6B;AAC7B,sCAAkC;AAE3B,IAAM,iBAAa,qCAAI,CAAC,uBAAuB,GAAG;AAAA,EACvD,UAAU;AAAA;AAAA;AAAA;AAAA,IAIR,YAAQ,oCAcN;AAAA,MACA,SAAS,CAAC,cAAc;AAAA,MACxB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,MACxB,QAAQ,CAAC,aAAa;AAAA,MACtB,OAAO,CAAC,YAAY;AAAA,MACpB,SAAS,CAAC,cAAc;AAAA,MACxB,OAAO,CAAC,YAAY;AAAA,MACpB,OAAO,CAAC,YAAY;AAAA,MACpB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,IAC1B,CAAC;AAAA;AAAA;AAAA;AAAA,IAID,UAAM,oCAA0D;AAAA,MAC9D,SAAS,CAAC,qBAAqB;AAAA,MAC/B,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,IAC3B,CAAC;AAAA,EACH;AACF,CAAC;;;AHjBG,IAAAC,sBAAA;AAXG,IAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAiB;AACf,QAAM,QAAQ,uBAAS,KAAK,QAAQ;AAEpC,SACE,8EACG;AAAA,oCAAa,OAA4C;AAAA,MACxD,WAAW,WAAW,EAAE,WAAW,MAAM,OAAO,CAAC;AAAA,MACjD,wBAAwB;AAAA,MACxB,eAAe;AAAA,MACf,WAAW;AAAA,MACX,GAAG;AAAA,IACL,CAAC;AAAA,IAEA,SAAS,6CAAC,kBAAgB,iBAAM;AAAA,KACnC;AAEJ;AAEA,KAAK,cAAc;;;AI1CnB,IAAAC,mCAA2C;AAE3C,IAAM,sCAAkC,qCAAG,2BAA2B;AAEtE,IAAM,uBAAmB;AAAA,EACvB,CAAC,QAAQ,iBAAiB,SAAS,YAAY,4BAA4B;AAAA,EAC3E;AAAA,IACE,UAAU;AAAA,MACR,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA,KAAK;AAAA,QACH,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,QAClF,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,MACpF;AAAA,IACF;AAAA,IACA,kBAAkB;AAAA,MAChB;AAAA,QACE,UAAU;AAAA,QACV,UAAU;AAAA,QACV,eAAW,qCAAG,iCAAiC,gBAAgB;AAAA,MACjE;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,UAAU;AAAA,MACV,KAAK;AAAA,IACP;AAAA,EACF;AACF;AAEA,IAAM,2BAAuB,sCAAI,IAAI;AAAA,EACnC,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,QAAQ;AAAA,MACN,QAAQ;AAAA,QACN;AAAA,QACA;AAAA,MACF;AAAA,MACA,UAAU,CAAC,uBAAuB;AAAA,IACpC;AAAA,EACF;AACF,CAAC;;;ALpBG,IAAAC,sBAAA;AAVG,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,KAAK;AACP,MAAuB;AACrB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,WAAW,iBAAiB;AAAA,QAC1B,KAAK,SAAS,OAAO,OAAO;AAAA,QAC5B;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACD,aAAU;AAAA,MACV;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,eAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OAAO,EAAE,OAAO,QAAQ,MAAM,IAAI;AAAA,YAElC;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,qBAAqB;AAAA,kBAC9B;AAAA,kBACA,QAAQ;AAAA,gBACV,CAAC;AAAA,gBAED,uDAAC,4BAAS;AAAA;AAAA,YACZ;AAAA;AAAA,QACF;AAAA,QAEA,6CAAC,QAAK,WAAW,qBAAqB,EAAE,MAAM,QAAQ,WAAW,CAAC,GAChE,uDAAC,kCAAY,GACf;AAAA;AAAA;AAAA,EACF;AAEJ;;;AM9DA,SAAS,sBAAsB,KAAqB;AAClD,SAAO,KAAK,MAAM,MAAM,GAAG,IAAI;AACjC;AAEA,SAAS,aAAa,EAAE,OAAO,MAAM,GAAiD;AACpF,MAAI,UAAU,OAAW,QAAO;AAEhC,QAAM,eAAe,QAAQ;AAC7B,QAAM,iBAAiB,sBAAsB,KAAK;AAElD,MAAI,KAAK,KAAK,cAAc,IAAI,aAAc,QAAO;AAErD,SAAO,kBAAkB,eAAe,IAAI;AAC9C;AAEA,SAAS,QAAW,KAAU,OAA2B;AACvD,QAAM,OAAO,IAAI,MAAM,GAAG,KAAK;AAC/B,QAAM,OAAO,IAAI,MAAM,KAAK;AAE5B,SAAO,CAAC,MAAM,IAAI;AACpB;;;AP2GI,IAAAC,sBAAA;AAjEG,IAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,GAAG;AACL,MAAmB;AACjB,QAAM,eAAW,sBAAyB,IAAI;AAC9C,QAAM,kBAAc,sBAAyB,CAAC,CAAC;AAE/C,QAAM,CAAC,OAAO,cAAc,QAAI,4CAAiB,WAAW,cAAc,aAAa;AAEvF,QAAM,eAAW,sBAAO,KAAK;AAC7B,QAAM,gBAAgB,EAAE,YAAY;AAEpC,WAAS,YAAY,OAAe;AAClC,QAAI,CAAC,SAAS,QAAS;AAEvB,mBAAe,QAAQ,CAAC;AACxB,aAAS,UAAU,QAAQ;AAE3B,aAAS,QAAQ,MAAM;AACvB,aAAS,QAAQ,aAAa,gBAAgB,EAAE;AAAA,EAClD;AAEA,WAAS,cAAc,OAAsC;AAG3D,QAAI,SAAS,YAAY,OAAO,MAAM,OAAO,KAAK,KAAK,OAAO,MAAM,OAAO,KAAK,MAAM,GAAG;AACvF;AAAA,IACF;AACA,aAAS,UAAU,OAAO,MAAM,OAAO,KAAK;AAE5C,mBAAe,OAAO,MAAM,OAAO,KAAK,CAAC;AAAA,EAC3C;AAEA,WAAS,iBAAiB,EAAE,cAAc,GAA+B;AACvE,UAAM,mBAAmB,YAAY,QAAQ,UAAU,UAAQ,SAAS,aAAa;AAErF,UAAM,CAAC,eAAe,cAAc,IAAI,QAAQ,YAAY,SAAS,mBAAmB,CAAC;AAEzF,kBAAc,QAAQ,UAAQ,KAAK,aAAa,gBAAgB,EAAE,CAAC;AACnE,mBAAe,QAAQ,UAAQ,KAAK,gBAAgB,cAAc,CAAC;AAAA,EACrE;AAEA,QAAM,oBAAgB,2BAAY,CAAC,QAA+B;AAChE,QAAI,CAAC,IAAK;AACV,gBAAY,QAAQ,KAAK,GAAG;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,WAAS,yBAAyB;AAChC,aAAS,SAAS,gBAAgB,cAAc;AAAA,EAClD;AAEA,WAAS,wBAAwB;AAC/B,gBAAY,QAAQ,QAAQ,UAAQ,KAAK,gBAAgB,cAAc,CAAC;AAAA,EAC1E;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV;AAAA,MACA,wBAAqB;AAAA,MACpB,GAAG;AAAA,MACJ,cAAc;AAAA,MAEd;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,cAAY;AAAA,YACZ,KAAK;AAAA,YACL,aAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,KAAI;AAAA,YACJ,KAAI;AAAA,YACJ,MAAM,WAAW,MAAM;AAAA,YACvB;AAAA,YACA;AAAA,YACA,OAAO,sBAAsB,SAAS,CAAC;AAAA,YACvC,UAAU,WAAS,iBAAiB,cAAc,KAAK;AAAA,YACvD,QAAQ;AAAA;AAAA,QACV;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAW;AAAA,cACT,SAAS,OAAO,aAAa;AAAA,cAC7B;AAAA,cACA;AAAA,YACF;AAAA,YAEC,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,UACjC;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,SAAS,MAAM,iBAAiB,YAAY,KAAK;AAAA,gBACjD,cAAc,WAAS,iBAAiB,iBAAiB,KAAK;AAAA,gBAC9D,KAAK;AAAA,gBAEL,OAAO,aAAa,EAAE,OAAO,MAAM,CAAC;AAAA;AAAA,cAD/B;AAAA,YAEP,CACD;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;","names":["import_class_variance_authority","import_react","import_class_variance_authority","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime"]}
1
+ {"version":3,"sources":["../../src/rating/index.ts","../../src/rating/Rating.tsx","../../src/rating/RatingStar.tsx","../../src/icon/Icon.tsx","../../src/slot/Slot.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/rating/RatingStar.styles.ts","../../src/rating/utils.ts"],"sourcesContent":["export { Rating, type RatingProps } from './Rating'\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","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 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 { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","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 { 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"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gCAAiC;AACjC,IAAAA,mCAAmB;AACnB,IAAAC,gBAOO;;;ACTP,sBAAyB;AACzB,yBAA4B;AAC5B,IAAAC,mCAAmB;;;ACFnB,IAAAC,gBAA0F;;;ACA1F,sBAAkC;AAClC,mBAOO;AASE;AAPF,IAAM,YAAY,gBAAAC,KAAU;AAM5B,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AACpD,SAAO,4CAAC,gBAAAA,KAAU,MAAV,EAAe,KAAW,GAAG,OAAO;AAC9C;;;ACFI,IAAAC,sBAAA;AAJG,IAAM,iBAAiB,CAAC,EAAE,UAAU,OAAO,KAAK,GAAG,MAAM,MAA2B;AACzF,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,OAAO;AAAA;AAAA,QAEL,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,MAAM;AAAA,QACN,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;;;ACrC7B,4BAA6B;AAC7B,sCAAkC;AAE3B,IAAM,iBAAa,qCAAI,CAAC,uBAAuB,GAAG;AAAA,EACvD,UAAU;AAAA;AAAA;AAAA;AAAA,IAIR,YAAQ,oCAcN;AAAA,MACA,SAAS,CAAC,cAAc;AAAA,MACxB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,MACxB,QAAQ,CAAC,aAAa;AAAA,MACtB,OAAO,CAAC,YAAY;AAAA,MACpB,SAAS,CAAC,cAAc;AAAA,MACxB,OAAO,CAAC,YAAY;AAAA,MACpB,OAAO,CAAC,YAAY;AAAA,MACpB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,IAC1B,CAAC;AAAA;AAAA;AAAA;AAAA,IAID,UAAM,oCAA0D;AAAA,MAC9D,SAAS,CAAC,qBAAqB;AAAA,MAC/B,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,IAC3B,CAAC;AAAA,EACH;AACF,CAAC;;;AHjBG,IAAAC,sBAAA;AAXG,IAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAiB;AACf,QAAM,QAAQ,uBAAS,KAAK,QAAQ;AAEpC,SACE,8EACG;AAAA,oCAAa,OAA4C;AAAA,MACxD,WAAW,WAAW,EAAE,WAAW,MAAM,OAAO,CAAC;AAAA,MACjD,wBAAwB;AAAA,MACxB,eAAe;AAAA,MACf,WAAW;AAAA,MACX,GAAG;AAAA,IACL,CAAC;AAAA,IAEA,SAAS,6CAAC,kBAAgB,iBAAM;AAAA,KACnC;AAEJ;AAEA,KAAK,cAAc;;;AI1CnB,IAAAC,mCAAsC;AAEtC,IAAM,sCAAkC,qCAAG,2BAA2B;AAEtE,IAAM,uBAAmB;AAAA,EACvB,CAAC,QAAQ,iBAAiB,SAAS,YAAY,4BAA4B;AAAA,EAC3E;AAAA,IACE,UAAU;AAAA,MACR,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA,KAAK;AAAA,QACH,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,QAClF,IAAI,CAAC,4CAA4C,iCAAiC;AAAA,MACpF;AAAA,IACF;AAAA,IACA,kBAAkB;AAAA,MAChB;AAAA,QACE,UAAU;AAAA,QACV,UAAU;AAAA,QACV,eAAW,qCAAG,iCAAiC,gBAAgB;AAAA,MACjE;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,UAAU;AAAA,MACV,KAAK;AAAA,IACP;AAAA,EACF;AACF;AAEA,IAAM,2BAAuB,sCAAI,IAAI;AAAA,EACnC,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,QAAQ;AAAA,MACN,QAAQ;AAAA,QACN;AAAA,QACA;AAAA,MACF;AAAA,MACA,UAAU,CAAC,uBAAuB;AAAA,IACpC;AAAA,EACF;AACF,CAAC;;;ALpBG,IAAAC,sBAAA;AAVG,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,KAAK;AACP,MAAuB;AACrB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,WAAW,iBAAiB;AAAA,QAC1B,KAAK,SAAS,OAAO,OAAO;AAAA,QAC5B;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACD,aAAU;AAAA,MACV;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,eAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OAAO,EAAE,OAAO,QAAQ,MAAM,IAAI;AAAA,YAElC;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,qBAAqB;AAAA,kBAC9B;AAAA,kBACA,QAAQ;AAAA,gBACV,CAAC;AAAA,gBAED,uDAAC,4BAAS;AAAA;AAAA,YACZ;AAAA;AAAA,QACF;AAAA,QAEA,6CAAC,QAAK,WAAW,qBAAqB,EAAE,MAAM,QAAQ,WAAW,CAAC,GAChE,uDAAC,kCAAY,GACf;AAAA;AAAA;AAAA,EACF;AAEJ;;;AM9DA,SAAS,sBAAsB,KAAqB;AAClD,SAAO,KAAK,MAAM,MAAM,GAAG,IAAI;AACjC;AAEA,SAAS,aAAa,EAAE,OAAO,MAAM,GAAiD;AACpF,MAAI,UAAU,OAAW,QAAO;AAEhC,QAAM,eAAe,QAAQ;AAC7B,QAAM,iBAAiB,sBAAsB,KAAK;AAElD,MAAI,KAAK,KAAK,cAAc,IAAI,aAAc,QAAO;AAErD,SAAO,kBAAkB,eAAe,IAAI;AAC9C;AAEA,SAAS,QAAW,KAAU,OAA2B;AACvD,QAAM,OAAO,IAAI,MAAM,GAAG,KAAK;AAC/B,QAAM,OAAO,IAAI,MAAM,KAAK;AAE5B,SAAO,CAAC,MAAM,IAAI;AACpB;;;AP2GI,IAAAC,sBAAA;AAjEG,IAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,GAAG;AACL,MAAmB;AACjB,QAAM,eAAW,sBAAyB,IAAI;AAC9C,QAAM,kBAAc,sBAAyB,CAAC,CAAC;AAE/C,QAAM,CAAC,OAAO,cAAc,QAAI,4CAAiB,WAAW,cAAc,aAAa;AAEvF,QAAM,eAAW,sBAAO,KAAK;AAC7B,QAAM,gBAAgB,EAAE,YAAY;AAEpC,WAAS,YAAY,OAAe;AAClC,QAAI,CAAC,SAAS,QAAS;AAEvB,mBAAe,QAAQ,CAAC;AACxB,aAAS,UAAU,QAAQ;AAE3B,aAAS,QAAQ,MAAM;AACvB,aAAS,QAAQ,aAAa,gBAAgB,EAAE;AAAA,EAClD;AAEA,WAAS,cAAc,OAAsC;AAG3D,QAAI,SAAS,YAAY,OAAO,MAAM,OAAO,KAAK,KAAK,OAAO,MAAM,OAAO,KAAK,MAAM,GAAG;AACvF;AAAA,IACF;AACA,aAAS,UAAU,OAAO,MAAM,OAAO,KAAK;AAE5C,mBAAe,OAAO,MAAM,OAAO,KAAK,CAAC;AAAA,EAC3C;AAEA,WAAS,iBAAiB,EAAE,cAAc,GAA+B;AACvE,UAAM,mBAAmB,YAAY,QAAQ,UAAU,UAAQ,SAAS,aAAa;AAErF,UAAM,CAAC,eAAe,cAAc,IAAI,QAAQ,YAAY,SAAS,mBAAmB,CAAC;AAEzF,kBAAc,QAAQ,UAAQ,KAAK,aAAa,gBAAgB,EAAE,CAAC;AACnE,mBAAe,QAAQ,UAAQ,KAAK,gBAAgB,cAAc,CAAC;AAAA,EACrE;AAEA,QAAM,oBAAgB,2BAAY,CAAC,QAA+B;AAChE,QAAI,CAAC,IAAK;AACV,gBAAY,QAAQ,KAAK,GAAG;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,WAAS,yBAAyB;AAChC,aAAS,SAAS,gBAAgB,cAAc;AAAA,EAClD;AAEA,WAAS,wBAAwB;AAC/B,gBAAY,QAAQ,QAAQ,UAAQ,KAAK,gBAAgB,cAAc,CAAC;AAAA,EAC1E;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV;AAAA,MACA,wBAAqB;AAAA,MACpB,GAAG;AAAA,MACJ,cAAc;AAAA,MAEd;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,cAAY;AAAA,YACZ,KAAK;AAAA,YACL,aAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,KAAI;AAAA,YACJ,KAAI;AAAA,YACJ,MAAM,WAAW,MAAM;AAAA,YACvB;AAAA,YACA;AAAA,YACA,OAAO,sBAAsB,SAAS,CAAC;AAAA,YACvC,UAAU,WAAS,iBAAiB,cAAc,KAAK;AAAA,YACvD,QAAQ;AAAA;AAAA,QACV;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAW;AAAA,cACT,SAAS,OAAO,aAAa;AAAA,cAC7B;AAAA,cACA;AAAA,YACF;AAAA,YAEC,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,UACjC;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,SAAS,MAAM,iBAAiB,YAAY,KAAK;AAAA,gBACjD,cAAc,WAAS,iBAAiB,iBAAiB,KAAK;AAAA,gBAC9D,KAAK;AAAA,gBAEL,OAAO,aAAa,EAAE,OAAO,MAAM,CAAC;AAAA;AAAA,cAD/B;AAAA,YAEP,CACD;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;","names":["import_class_variance_authority","import_react","import_class_variance_authority","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime"]}
package/dist/rating/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/rating/Rating.tsx","../../src/rating/RatingStar.tsx","../../src/rating/RatingStar.styles.ts","../../src/rating/utils.ts"],"sourcesContent":["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","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 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 { cva, cx, type 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 { 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"],"mappings":"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","names":["cx","cx","cx","jsx","jsxs","cx"]}
1
+ {"version":3,"sources":["../../src/rating/Rating.tsx","../../src/rating/RatingStar.tsx","../../src/rating/RatingStar.styles.ts","../../src/rating/utils.ts"],"sourcesContent":["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","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 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 { 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 { 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"],"mappings":"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","names":["cx","cx","cx","jsx","jsxs","cx"]}