jaci-ui 0.9.4 → 1.0.2

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 (182) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/README.md +11 -1
  3. package/dist/_virtual/_rolldown/runtime.cjs +1 -1
  4. package/dist/components/accordion/accordion.cjs.map +1 -1
  5. package/dist/components/accordion/accordion.js.map +1 -1
  6. package/dist/components/alert/alert.cjs.map +1 -1
  7. package/dist/components/alert/alert.js.map +1 -1
  8. package/dist/components/alert-dialog/alert-dialog.cjs.map +1 -1
  9. package/dist/components/alert-dialog/alert-dialog.js.map +1 -1
  10. package/dist/components/aspect-ratio/aspect-ratio.cjs.map +1 -1
  11. package/dist/components/avatar/avatar.cjs.map +1 -1
  12. package/dist/components/avatar/avatar.js.map +1 -1
  13. package/dist/components/breadcrumbs/breadcrumbs.cjs.map +1 -1
  14. package/dist/components/button/button.cjs +1 -0
  15. package/dist/components/button/button.cjs.map +1 -1
  16. package/dist/components/button/button.d.cts +2 -1
  17. package/dist/components/button/button.d.ts +2 -1
  18. package/dist/components/button/button.js +1 -0
  19. package/dist/components/button/button.js.map +1 -1
  20. package/dist/components/button-group/button-group.cjs.map +1 -1
  21. package/dist/components/calendar/calendar.cjs +4 -6
  22. package/dist/components/calendar/calendar.cjs.map +1 -1
  23. package/dist/components/calendar/calendar.js +4 -6
  24. package/dist/components/calendar/calendar.js.map +1 -1
  25. package/dist/components/card/card.cjs.map +1 -1
  26. package/dist/components/carousel/carousel.cjs.map +1 -1
  27. package/dist/components/carousel/carousel.js.map +1 -1
  28. package/dist/components/checkbox-group/checkbox-group.cjs +7 -3
  29. package/dist/components/checkbox-group/checkbox-group.cjs.map +1 -1
  30. package/dist/components/checkbox-group/checkbox-group.js +7 -3
  31. package/dist/components/checkbox-group/checkbox-group.js.map +1 -1
  32. package/dist/components/code/code.cjs.map +1 -1
  33. package/dist/components/code/code.js.map +1 -1
  34. package/dist/components/collapsible/collapsible.cjs.map +1 -1
  35. package/dist/components/collapsible/collapsible.js.map +1 -1
  36. package/dist/components/color-picker/color-picker.cjs.map +1 -1
  37. package/dist/components/color-picker/color-picker.js.map +1 -1
  38. package/dist/components/color-picker/color-utils.cjs +5 -3
  39. package/dist/components/color-picker/color-utils.cjs.map +1 -1
  40. package/dist/components/color-picker/color-utils.js +5 -3
  41. package/dist/components/color-picker/color-utils.js.map +1 -1
  42. package/dist/components/color-swatch/color-swatch.cjs.map +1 -1
  43. package/dist/components/combobox/combobox.cjs +2 -1
  44. package/dist/components/combobox/combobox.cjs.map +1 -1
  45. package/dist/components/combobox/combobox.js +2 -1
  46. package/dist/components/combobox/combobox.js.map +1 -1
  47. package/dist/components/command/command.cjs.map +1 -1
  48. package/dist/components/command/command.js.map +1 -1
  49. package/dist/components/context-menu/context-menu.cjs.map +1 -1
  50. package/dist/components/context-menu/context-menu.d.cts +2 -2
  51. package/dist/components/context-menu/context-menu.d.ts +2 -2
  52. package/dist/components/controls/checkbox.cjs.map +1 -1
  53. package/dist/components/controls/checkbox.js.map +1 -1
  54. package/dist/components/controls/input.cjs.map +1 -1
  55. package/dist/components/controls/input.js.map +1 -1
  56. package/dist/components/controls/radio.cjs.map +1 -1
  57. package/dist/components/controls/switch.cjs.map +1 -1
  58. package/dist/components/controls/switch.js.map +1 -1
  59. package/dist/components/controls/textarea.cjs.map +1 -1
  60. package/dist/components/controls/textarea.js.map +1 -1
  61. package/dist/components/copyable/copyable.cjs.map +1 -1
  62. package/dist/components/copyable/copyable.js.map +1 -1
  63. package/dist/components/data-toolbar/data-toolbar.cjs.map +1 -1
  64. package/dist/components/data-toolbar/data-toolbar.js.map +1 -1
  65. package/dist/components/data-view/data-view.cjs.map +1 -1
  66. package/dist/components/date-picker/date-picker.cjs +4 -7
  67. package/dist/components/date-picker/date-picker.cjs.map +1 -1
  68. package/dist/components/date-picker/date-picker.js +4 -7
  69. package/dist/components/date-picker/date-picker.js.map +1 -1
  70. package/dist/components/date-range-picker/date-range-picker.cjs +4 -6
  71. package/dist/components/date-range-picker/date-range-picker.cjs.map +1 -1
  72. package/dist/components/date-range-picker/date-range-picker.js +4 -6
  73. package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
  74. package/dist/components/dialog/dialog.cjs.map +1 -1
  75. package/dist/components/dialog/dialog.js.map +1 -1
  76. package/dist/components/download-trigger/download-trigger.cjs.map +1 -1
  77. package/dist/components/drawer/drawer.cjs.map +1 -1
  78. package/dist/components/drawer/drawer.js.map +1 -1
  79. package/dist/components/empty-state/empty-state.cjs.map +1 -1
  80. package/dist/components/feedback/badge.cjs.map +1 -1
  81. package/dist/components/field/field.cjs.map +1 -1
  82. package/dist/components/field/field.js.map +1 -1
  83. package/dist/components/fieldset/fieldset.cjs.map +1 -1
  84. package/dist/components/figure/figure.cjs.map +1 -1
  85. package/dist/components/figure/figure.js.map +1 -1
  86. package/dist/components/form/form.cjs.map +1 -1
  87. package/dist/components/form/form.js.map +1 -1
  88. package/dist/components/icon-button/icon-button.cjs.map +1 -1
  89. package/dist/components/icon-button/icon-button.js.map +1 -1
  90. package/dist/components/image/image.cjs.map +1 -1
  91. package/dist/components/image/image.js.map +1 -1
  92. package/dist/components/input-group/input-group.cjs.map +1 -1
  93. package/dist/components/kbd/kbd.cjs.map +1 -1
  94. package/dist/components/layout/index.cjs.map +1 -1
  95. package/dist/components/list/list.cjs.map +1 -1
  96. package/dist/components/menu/menu.cjs.map +1 -1
  97. package/dist/components/menu/menu.d.cts +2 -2
  98. package/dist/components/menu/menu.d.ts +2 -2
  99. package/dist/components/menubar/menubar.cjs.map +1 -1
  100. package/dist/components/menubar/menubar.d.cts +2 -2
  101. package/dist/components/menubar/menubar.d.ts +2 -2
  102. package/dist/components/menubar/menubar.js.map +1 -1
  103. package/dist/components/meter/meter.cjs.map +1 -1
  104. package/dist/components/meter/meter.js.map +1 -1
  105. package/dist/components/navigation/navigation.cjs.map +1 -1
  106. package/dist/components/navigation/navigation.js.map +1 -1
  107. package/dist/components/navigation-menu/navigation-menu.cjs.map +1 -1
  108. package/dist/components/navigation-menu/navigation-menu.js.map +1 -1
  109. package/dist/components/number-field/number-field.cjs +2 -1
  110. package/dist/components/number-field/number-field.cjs.map +1 -1
  111. package/dist/components/number-field/number-field.js +2 -1
  112. package/dist/components/number-field/number-field.js.map +1 -1
  113. package/dist/components/option-selector/option-selector.cjs.map +1 -1
  114. package/dist/components/option-selector/option-selector.js.map +1 -1
  115. package/dist/components/pagination/pagination.cjs.map +1 -1
  116. package/dist/components/pagination/pagination.js.map +1 -1
  117. package/dist/components/pin-input/pin-input.cjs.map +1 -1
  118. package/dist/components/pin-input/pin-input.js.map +1 -1
  119. package/dist/components/popover/popover.cjs.map +1 -1
  120. package/dist/components/popover/popover.js.map +1 -1
  121. package/dist/components/progress/progress.cjs.map +1 -1
  122. package/dist/components/progress/progress.js.map +1 -1
  123. package/dist/components/qr-code/qr-code.cjs.map +1 -1
  124. package/dist/components/qr-code/qr-code.js.map +1 -1
  125. package/dist/components/quote/quote.cjs.map +1 -1
  126. package/dist/components/quote/quote.js.map +1 -1
  127. package/dist/components/radio-group/radio-group.cjs +7 -3
  128. package/dist/components/radio-group/radio-group.cjs.map +1 -1
  129. package/dist/components/radio-group/radio-group.js +7 -3
  130. package/dist/components/radio-group/radio-group.js.map +1 -1
  131. package/dist/components/range-slider/range-slider.cjs.map +1 -1
  132. package/dist/components/range-slider/range-slider.js.map +1 -1
  133. package/dist/components/scroll-area/scroll-area.cjs.map +1 -1
  134. package/dist/components/select/select.cjs.map +1 -1
  135. package/dist/components/select/select.js.map +1 -1
  136. package/dist/components/sidebar/sidebar.cjs.map +1 -1
  137. package/dist/components/sidebar/sidebar.js.map +1 -1
  138. package/dist/components/skeleton/skeleton.cjs.map +1 -1
  139. package/dist/components/slider/slider.cjs.map +1 -1
  140. package/dist/components/slider/slider.js.map +1 -1
  141. package/dist/components/spacer/spacer.cjs.map +1 -1
  142. package/dist/components/stat/stat.cjs.map +1 -1
  143. package/dist/components/stat/stat.js.map +1 -1
  144. package/dist/components/stepper/stepper.cjs +2 -1
  145. package/dist/components/stepper/stepper.cjs.map +1 -1
  146. package/dist/components/stepper/stepper.js +2 -1
  147. package/dist/components/stepper/stepper.js.map +1 -1
  148. package/dist/components/table/table.cjs.map +1 -1
  149. package/dist/components/table/table.js.map +1 -1
  150. package/dist/components/tabs/tabs.cjs.map +1 -1
  151. package/dist/components/tabs/tabs.js.map +1 -1
  152. package/dist/components/tags-input/tags-input.cjs +10 -9
  153. package/dist/components/tags-input/tags-input.cjs.map +1 -1
  154. package/dist/components/tags-input/tags-input.js +10 -9
  155. package/dist/components/tags-input/tags-input.js.map +1 -1
  156. package/dist/components/toast/toast.cjs.map +1 -1
  157. package/dist/components/toast/toast.js.map +1 -1
  158. package/dist/components/toggle/toggle.cjs.map +1 -1
  159. package/dist/components/toggle-group/toggle-group.cjs.map +1 -1
  160. package/dist/components/toolbar/toolbar.cjs.map +1 -1
  161. package/dist/components/tooltip/tooltip.cjs.map +1 -1
  162. package/dist/components/tree-view/tree-view.cjs.map +1 -1
  163. package/dist/components/tree-view/tree-view.js.map +1 -1
  164. package/dist/components/typography/heading.cjs.map +1 -1
  165. package/dist/components/typography/link.cjs.map +1 -1
  166. package/dist/components/typography/paragraph.cjs.map +1 -1
  167. package/dist/components/typography/text.cjs.map +1 -1
  168. package/dist/components/upload/upload.cjs +2 -2
  169. package/dist/components/upload/upload.cjs.map +1 -1
  170. package/dist/components/upload/upload.js +2 -2
  171. package/dist/components/upload/upload.js.map +1 -1
  172. package/dist/components/visually-hidden/visually-hidden.cjs.map +1 -1
  173. package/dist/panda-preset.cjs.map +1 -1
  174. package/dist/styles/theme.cjs +18 -18
  175. package/dist/styles/theme.cjs.map +1 -1
  176. package/dist/styles/theme.js +18 -18
  177. package/dist/styles/theme.js.map +1 -1
  178. package/dist/styles.css +12 -21
  179. package/dist/theme/theme-provider.cjs.map +1 -1
  180. package/dist/theme/theme-provider.js.map +1 -1
  181. package/dist/theme/theme-scope.cjs.map +1 -1
  182. package/package.json +9 -9
@@ -1 +1 @@
1
- {"version":3,"file":"pin-input.cjs","names":["pinInput","cx"],"sources":["../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n} from \"react\";\nimport type {\n ClipboardEvent,\n CompositionEvent,\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MutableRefObject,\n ReactNode,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { pinInput } from \"../../styled-system/recipes\";\n\ninterface PinInputContextValue {\n disabled: boolean;\n id: string;\n invalid: boolean;\n inputRefs: MutableRefObject<Array<HTMLInputElement | null>>;\n length: number;\n onInput: (index: number, value: string) => void;\n onCompositionEnd: (index: number, event: CompositionEvent<HTMLInputElement>) => void;\n onCompositionStart: () => void;\n onKeyDown: (index: number, event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste: (index: number, event: ClipboardEvent<HTMLInputElement>) => void;\n otp: boolean;\n styles: ReturnType<typeof pinInput>;\n type: \"text\" | \"password\";\n value: string;\n}\n\nconst PinInputContext = createContext<PinInputContextValue | null>(null);\n\nfunction digitKey(index: number) {\n return `digit-${index}`;\n}\n\nfunction usePinInputContext() {\n const context = useContext(PinInputContext);\n if (!context) throw new Error(\"PinInput parts must be rendered inside PinInput.Root.\");\n return context;\n}\n\nexport interface PinInputRootProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"defaultValue\"> {\n length: number;\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n onComplete?: (value: string) => void;\n type?: \"text\" | \"password\";\n otp?: boolean;\n autoFocus?: boolean;\n disabled?: boolean;\n invalid?: boolean;\n name?: string;\n children?: ReactNode;\n}\n\nexport const PinInputRoot = forwardRef<HTMLDivElement, PinInputRootProps>(function PinInputRoot(\n {\n autoFocus = false,\n children,\n className,\n defaultValue = \"\",\n disabled = false,\n id: providedId,\n invalid = false,\n length,\n name,\n onValueChange,\n onComplete,\n otp = false,\n type = \"text\",\n value: controlledValue,\n ...props\n },\n ref,\n) {\n const generatedId = useId();\n const id = providedId ?? generatedId;\n const styles = pinInput();\n const safeLength = Math.max(1, Math.floor(length));\n const [uncontrolledValue, setUncontrolledValue] = useState(() =>\n defaultValue.slice(0, safeLength),\n );\n const value = (controlledValue ?? uncontrolledValue).slice(0, safeLength);\n const inputRefs = useRef<Array<HTMLInputElement | null>>([]);\n const composingRef = useRef(false);\n const updateValue = useCallback(\n (next: string) => {\n const normalized = next.slice(0, safeLength);\n if (controlledValue === undefined) setUncontrolledValue(normalized);\n onValueChange?.(normalized);\n if (normalized.length === safeLength) onComplete?.(normalized);\n },\n [controlledValue, onComplete, onValueChange, safeLength],\n );\n const normalize = useCallback(\n (next: string) => {\n const characters = Array.from(next);\n return (otp ? characters.filter((character) => /[0-9]/u.test(character)) : characters)\n .join(\"\")\n .slice(0, safeLength);\n },\n [otp, safeLength],\n );\n const focusIndex = useCallback(\n (index: number) => {\n inputRefs.current[Math.max(0, Math.min(safeLength - 1, index))]?.focus();\n },\n [safeLength],\n );\n const onInput = useCallback(\n (index: number, nextCharacter: string) => {\n if (composingRef.current) return;\n const characters = Array.from(value);\n const next = normalize(nextCharacter).slice(-1);\n characters[index] = next;\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n if (next) focusIndex(index + 1);\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onCompositionStart = useCallback(() => {\n composingRef.current = true;\n }, []);\n const onCompositionEnd = useCallback(\n (index: number, event: CompositionEvent<HTMLInputElement>) => {\n composingRef.current = false;\n onInput(index, event.currentTarget.value);\n },\n [onInput],\n );\n const onPaste = useCallback(\n (index: number, event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasted = normalize(event.clipboardData.getData(\"text\"));\n if (!pasted) return;\n const characters = Array.from(value);\n Array.from(pasted).forEach((character, offset) => {\n if (index + offset < safeLength) characters[index + offset] = character;\n });\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n focusIndex(Math.min(safeLength - 1, index + pasted.length));\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onKeyDown = useCallback(\n (index: number, event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Backspace\" && !event.currentTarget.value && index > 0) {\n event.preventDefault();\n const characters = Array.from(value);\n characters[index - 1] = \"\";\n updateValue(characters.join(\"\"));\n focusIndex(index - 1);\n } else if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n focusIndex(index - 1);\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n focusIndex(index + 1);\n } else if (event.key === \"Home\") {\n event.preventDefault();\n focusIndex(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n focusIndex(safeLength - 1);\n }\n },\n [focusIndex, safeLength, updateValue, value],\n );\n const context: PinInputContextValue = {\n disabled,\n id,\n invalid,\n inputRefs,\n length: safeLength,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n };\n\n useEffect(() => {\n if (autoFocus) inputRefs.current[0]?.focus();\n }, [autoFocus]);\n\n return (\n <div\n {...props}\n className={cx(styles.root, className)}\n data-disabled={disabled || undefined}\n data-invalid={invalid || undefined}\n data-jaci-component=\"pin-input\"\n data-slot=\"pin-input\"\n id={id}\n ref={ref}\n >\n <PinInputContext.Provider value={context}>{children}</PinInputContext.Provider>\n {name ? (\n <input\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled}\n name={name}\n tabIndex={-1}\n value={value}\n readOnly\n />\n ) : null}\n </div>\n );\n});\n\nexport type PinInputLabelProps = ComponentPropsWithoutRef<\"label\">;\nexport const PinInputLabel = forwardRef<HTMLLabelElement, PinInputLabelProps>(\n function PinInputLabel({ className, ...props }, ref) {\n const { id, styles } = usePinInputContext();\n return (\n // biome-ignore lint/a11y/noLabelWithoutControl: the generated Inputs slot supplies the control.\n <label\n {...props}\n className={cx(styles.label, className)}\n data-slot=\"pin-input-label\"\n htmlFor={props.htmlFor ?? `${id}-0`}\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputControlProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputControl = forwardRef<HTMLDivElement, PinInputControlProps>(\n function PinInputControl({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.control, className)}\n data-slot=\"pin-input-control\"\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputInputsProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputInputs = forwardRef<HTMLDivElement, PinInputInputsProps>(\n function PinInputInputs({ className, ...props }, ref) {\n const { length, styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.inputs, className)}\n data-slot=\"pin-input-inputs\"\n ref={ref}\n >\n {Array.from({ length }, (_, index) => (\n <PinInputInput index={index} key={digitKey(index)} />\n ))}\n </div>\n );\n },\n);\n\nexport interface PinInputInputProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"defaultValue\" | \"onChange\" | \"onKeyDown\" | \"onPaste\" | \"type\" | \"value\"\n > {\n index: number;\n}\nexport const PinInputInput = forwardRef<HTMLInputElement, PinInputInputProps>(\n function PinInputInput(\n {\n className,\n index,\n id,\n onCompositionEnd: onInputCompositionEnd,\n onCompositionStart: onInputCompositionStart,\n ...props\n },\n ref,\n ) {\n const {\n disabled,\n id: rootId,\n inputRefs,\n invalid,\n length,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n } = usePinInputContext();\n return (\n <input\n {...props}\n aria-label={props[\"aria-label\"] ?? `Digit ${index + 1} of ${length}`}\n aria-invalid={invalid || undefined}\n autoComplete={otp ? \"one-time-code\" : props.autoComplete}\n className={cx(styles.input, className)}\n data-slot=\"pin-input-input\"\n disabled={disabled || props.disabled}\n id={id ?? `${rootId}-${index}`}\n inputMode={otp ? \"numeric\" : props.inputMode}\n maxLength={1}\n onChange={(event) => onInput(index, event.currentTarget.value)}\n onCompositionEnd={(event) => {\n onCompositionEnd(index, event);\n onInputCompositionEnd?.(event);\n }}\n onCompositionStart={(event) => {\n onCompositionStart();\n onInputCompositionStart?.(event);\n }}\n onKeyDown={(event) => onKeyDown(index, event)}\n onPaste={(event) => onPaste(index, event)}\n ref={(node) => {\n inputRefs.current[index] = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type={type}\n value={Array.from(value)[index] ?? \"\"}\n />\n );\n },\n);\n\nexport type PinInputDescriptionProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputDescription = forwardRef<HTMLParagraphElement, PinInputDescriptionProps>(\n function PinInputDescription({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.description, className)}\n data-slot=\"pin-input-description\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputErrorProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputError = forwardRef<HTMLParagraphElement, PinInputErrorProps>(\n function PinInputError({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.error, className)}\n data-slot=\"pin-input-error\"\n role=\"alert\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputHiddenInputProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"name\" | \"type\" | \"value\"\n>;\nexport const PinInputHiddenInput = forwardRef<HTMLInputElement, PinInputHiddenInputProps>(\n function PinInputHiddenInput(props, ref) {\n const { disabled, styles, value } = usePinInputContext();\n return (\n <input\n {...props}\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled || props.disabled}\n readOnly\n ref={ref}\n tabIndex={-1}\n type=\"hidden\"\n value={value}\n />\n );\n },\n);\n\nexport const PinInput = {\n Root: PinInputRoot,\n Label: PinInputLabel,\n Control: PinInputControl,\n Inputs: PinInputInputs,\n Input: PinInputInput,\n Description: PinInputDescription,\n Error: PinInputError,\n HiddenInput: PinInputHiddenInput,\n};\n"],"mappings":";;;;;;AAyCA,MAAM,mBAAA,GAAA,MAAA,cAAA,CAA6D,IAAI;AAEvE,SAAS,SAAS,OAAe;CAC/B,OAAO,SAAS;AAClB;AAEA,SAAS,qBAAqB;CAC5B,MAAM,WAAA,GAAA,MAAA,WAAA,CAAqB,eAAe;CAC1C,IAAI,CAAC,SAAS,MAAM,IAAI,MAAM,uDAAuD;CACrF,OAAO;AACT;AAkBA,MAAa,gBAAA,GAAA,MAAA,WAAA,CAA6D,SAAS,aACjF,EACE,YAAY,OACZ,UACA,WACA,eAAe,IACf,WAAW,OACX,IAAI,YACJ,UAAU,OACV,QACA,MACA,eACA,YACA,MAAM,OACN,OAAO,QACP,OAAO,iBACP,GAAG,SAEL,KACA;CACA,MAAM,eAAA,GAAA,MAAA,MAAA,CAAoB;CAC1B,MAAM,KAAK,cAAc;CACzB,MAAM,SAASA,kBAAAA,SAAS;CACxB,MAAM,aAAa,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,CAAC;CACjD,MAAM,CAAC,mBAAmB,yBAAA,GAAA,MAAA,SAAA,OACxB,aAAa,MAAM,GAAG,UAAU,CAClC;CACA,MAAM,SAAS,mBAAmB,kBAAA,CAAmB,MAAM,GAAG,UAAU;CACxE,MAAM,aAAA,GAAA,MAAA,OAAA,CAAmD,CAAC,CAAC;CAC3D,MAAM,gBAAA,GAAA,MAAA,OAAA,CAAsB,KAAK;CACjC,MAAM,eAAA,GAAA,MAAA,YAAA,EACH,SAAiB;EAChB,MAAM,aAAa,KAAK,MAAM,GAAG,UAAU;EAC3C,IAAI,oBAAoB,KAAA,GAAW,qBAAqB,UAAU;EAClE,gBAAgB,UAAU;EAC1B,IAAI,WAAW,WAAW,YAAY,aAAa,UAAU;CAC/D,GACA;EAAC;EAAiB;EAAY;EAAe;CAAU,CACzD;CACA,MAAM,aAAA,GAAA,MAAA,YAAA,EACH,SAAiB;EAChB,MAAM,aAAa,MAAM,KAAK,IAAI;EAClC,QAAQ,MAAM,WAAW,QAAQ,cAAc,SAAS,KAAK,SAAS,CAAC,IAAI,WAAA,CACxE,KAAK,EAAE,CAAC,CACR,MAAM,GAAG,UAAU;CACxB,GACA,CAAC,KAAK,UAAU,CAClB;CACA,MAAM,cAAA,GAAA,MAAA,YAAA,EACH,UAAkB;EACjB,UAAU,QAAQ,KAAK,IAAI,GAAG,KAAK,IAAI,aAAa,GAAG,KAAK,CAAC,EAAE,EAAE,MAAM;CACzE,GACA,CAAC,UAAU,CACb;CACA,MAAM,WAAA,GAAA,MAAA,YAAA,EACH,OAAe,kBAA0B;EACxC,IAAI,aAAa,SAAS;EAC1B,MAAM,aAAa,MAAM,KAAK,KAAK;EACnC,MAAM,OAAO,UAAU,aAAa,CAAC,CAAC,MAAM,EAAE;EAC9C,WAAW,SAAS;EACpB,MAAM,YAAY,WAAW,KAAK,EAAE,CAAC,CAAC,MAAM,GAAG,UAAU;EACzD,YAAY,SAAS;EACrB,IAAI,MAAM,WAAW,QAAQ,CAAC;CAChC,GACA;EAAC;EAAY;EAAW;EAAY;EAAa;CAAK,CACxD;CACA,MAAM,sBAAA,GAAA,MAAA,YAAA,OAAuC;EAC3C,aAAa,UAAU;CACzB,GAAG,CAAC,CAAC;CACL,MAAM,oBAAA,GAAA,MAAA,YAAA,EACH,OAAe,UAA8C;EAC5D,aAAa,UAAU;EACvB,QAAQ,OAAO,MAAM,cAAc,KAAK;CAC1C,GACA,CAAC,OAAO,CACV;CACA,MAAM,WAAA,GAAA,MAAA,YAAA,EACH,OAAe,UAA4C;EAC1D,MAAM,eAAe;EACrB,MAAM,SAAS,UAAU,MAAM,cAAc,QAAQ,MAAM,CAAC;EAC5D,IAAI,CAAC,QAAQ;EACb,MAAM,aAAa,MAAM,KAAK,KAAK;EACnC,MAAM,KAAK,MAAM,CAAC,CAAC,SAAS,WAAW,WAAW;GAChD,IAAI,QAAQ,SAAS,YAAY,WAAW,QAAQ,UAAU;EAChE,CAAC;EACD,MAAM,YAAY,WAAW,KAAK,EAAE,CAAC,CAAC,MAAM,GAAG,UAAU;EACzD,YAAY,SAAS;EACrB,WAAW,KAAK,IAAI,aAAa,GAAG,QAAQ,OAAO,MAAM,CAAC;CAC5D,GACA;EAAC;EAAY;EAAW;EAAY;EAAa;CAAK,CACxD;CAyBA,MAAM,UAAgC;EACpC;EACA;EACA;EACA;EACA,QAAQ;EACR;EACA;EACA;EACA,YAAA,GAAA,MAAA,YAAA,EAhCC,OAAe,UAA2C;GACzD,IAAI,MAAM,QAAQ,eAAe,CAAC,MAAM,cAAc,SAAS,QAAQ,GAAG;IACxE,MAAM,eAAe;IACrB,MAAM,aAAa,MAAM,KAAK,KAAK;IACnC,WAAW,QAAQ,KAAK;IACxB,YAAY,WAAW,KAAK,EAAE,CAAC;IAC/B,WAAW,QAAQ,CAAC;GACtB,OAAO,IAAI,MAAM,QAAQ,aAAa;IACpC,MAAM,eAAe;IACrB,WAAW,QAAQ,CAAC;GACtB,OAAO,IAAI,MAAM,QAAQ,cAAc;IACrC,MAAM,eAAe;IACrB,WAAW,QAAQ,CAAC;GACtB,OAAO,IAAI,MAAM,QAAQ,QAAQ;IAC/B,MAAM,eAAe;IACrB,WAAW,CAAC;GACd,OAAO,IAAI,MAAM,QAAQ,OAAO;IAC9B,MAAM,eAAe;IACrB,WAAW,aAAa,CAAC;GAC3B;EACF,GACA;GAAC;GAAY;GAAY;GAAa;EAAK,CAWnC;EACR;EACA;EACA;EACA;EACA;CACF;CAEA,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,WAAW,UAAU,QAAQ,EAAE,EAAE,MAAM;CAC7C,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,GAAI;EACJ,WAAWC,WAAAA,GAAG,OAAO,MAAM,SAAS;EACpC,iBAAe,YAAY,KAAA;EAC3B,gBAAc,WAAW,KAAA;EACzB,uBAAoB;EACpB,aAAU;EACN;EACC;YARP,CAUE,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAgB,UAAjB;GAA0B,OAAO;GAAU;EAAmC,CAAA,GAC7E,OACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;GACE,eAAY;GACZ,WAAW,OAAO;GACR;GACJ;GACN,UAAU;GACH;GACP,UAAA;EACD,CAAA,IACC,IACD;;AAET,CAAC;AAGD,MAAa,iBAAA,GAAA,MAAA,WAAA,CACX,SAAS,cAAc,EAAE,WAAW,GAAG,SAAS,KAAK;CACnD,MAAM,EAAE,IAAI,WAAW,mBAAmB;CAC1C,OAEE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;EACE,GAAI;EACJ,WAAWA,WAAAA,GAAG,OAAO,OAAO,SAAS;EACrC,aAAU;EACV,SAAS,MAAM,WAAW,GAAG,GAAG;EAC3B;CACN,CAAA;AAEL,CACF;AAGA,MAAa,mBAAA,GAAA,MAAA,WAAA,CACX,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAS,KAAK;CACrD,MAAM,EAAE,WAAW,mBAAmB;CACtC,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,GAAI;EACJ,WAAWA,WAAAA,GAAG,OAAO,SAAS,SAAS;EACvC,aAAU;EACL;CACN,CAAA;AAEL,CACF;AAGA,MAAa,kBAAA,GAAA,MAAA,WAAA,CACX,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,MAAM,EAAE,QAAQ,WAAW,mBAAmB;CAC9C,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,GAAI;EACJ,WAAWA,WAAAA,GAAG,OAAO,QAAQ,SAAS;EACtC,aAAU;EACL;YAEJ,MAAM,KAAK,EAAE,OAAO,IAAI,GAAG,UAC1B,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAD,EAAsB,MAA8B,GAAlB,SAAS,KAAK,CAAI,CACrD;CACE,CAAA;AAET,CACF;AASA,MAAa,iBAAA,GAAA,MAAA,WAAA,CACX,SAAS,cACP,EACE,WACA,OACA,IACA,kBAAkB,uBAClB,oBAAoB,yBACpB,GAAG,SAEL,KACA;CACA,MAAM,EACJ,UACA,IAAI,QACJ,WACA,SACA,QACA,SACA,kBACA,oBACA,WACA,SACA,KACA,QACA,MACA,UACE,mBAAmB;CACvB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;EACE,GAAI;EACJ,cAAY,MAAM,iBAAiB,SAAS,QAAQ,EAAE,MAAM;EAC5D,gBAAc,WAAW,KAAA;EACzB,cAAc,MAAM,kBAAkB,MAAM;EAC5C,WAAWA,WAAAA,GAAG,OAAO,OAAO,SAAS;EACrC,aAAU;EACV,UAAU,YAAY,MAAM;EAC5B,IAAI,MAAM,GAAG,OAAO,GAAG;EACvB,WAAW,MAAM,YAAY,MAAM;EACnC,WAAW;EACX,WAAW,UAAU,QAAQ,OAAO,MAAM,cAAc,KAAK;EAC7D,mBAAmB,UAAU;GAC3B,iBAAiB,OAAO,KAAK;GAC7B,wBAAwB,KAAK;EAC/B;EACA,qBAAqB,UAAU;GAC7B,mBAAmB;GACnB,0BAA0B,KAAK;EACjC;EACA,YAAY,UAAU,UAAU,OAAO,KAAK;EAC5C,UAAU,UAAU,QAAQ,OAAO,KAAK;EACxC,MAAM,SAAS;GACb,UAAU,QAAQ,SAAS;GAC3B,IAAI,OAAO,QAAQ,YAAY,IAAI,IAAI;QAClC,IAAI,KAAK,IAAI,UAAU;EAC9B;EACM;EACN,OAAO,MAAM,KAAK,KAAK,CAAC,CAAC,UAAU;CACpC,CAAA;AAEL,CACF;AAGA,MAAa,uBAAA,GAAA,MAAA,WAAA,CACX,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAS,KAAK;CACzD,MAAM,EAAE,WAAW,mBAAmB;CACtC,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;EACE,GAAI;EACJ,WAAWA,WAAAA,GAAG,OAAO,aAAa,SAAS;EAC3C,aAAU;EACL;CACN,CAAA;AAEL,CACF;AAEA,MAAa,iBAAA,GAAA,MAAA,WAAA,CACX,SAAS,cAAc,EAAE,WAAW,GAAG,SAAS,KAAK;CACnD,MAAM,EAAE,WAAW,mBAAmB;CACtC,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;EACE,GAAI;EACJ,WAAWA,WAAAA,GAAG,OAAO,OAAO,SAAS;EACrC,aAAU;EACV,MAAK;EACA;CACN,CAAA;AAEL,CACF;AAKA,MAAa,uBAAA,GAAA,MAAA,WAAA,CACX,SAAS,oBAAoB,OAAO,KAAK;CACvC,MAAM,EAAE,UAAU,QAAQ,UAAU,mBAAmB;CACvD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;EACE,GAAI;EACJ,eAAY;EACZ,WAAW,OAAO;EAClB,UAAU,YAAY,MAAM;EAC5B,UAAA;EACK;EACL,UAAU;EACV,MAAK;EACE;CACR,CAAA;AAEL,CACF;AAEA,MAAa,WAAW;CACtB,MAAM;CACN,OAAO;CACP,SAAS;CACT,QAAQ;CACR,OAAO;CACP,aAAa;CACb,OAAO;CACP,aAAa;AACf"}
1
+ {"version":3,"file":"pin-input.cjs","names":["createContext","useContext","forwardRef","useId","pinInput","useState","useRef","useCallback","cx"],"sources":["../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n} from \"react\";\nimport type {\n ClipboardEvent,\n CompositionEvent,\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MutableRefObject,\n ReactNode,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { pinInput } from \"../../styled-system/recipes\";\n\ninterface PinInputContextValue {\n disabled: boolean;\n id: string;\n invalid: boolean;\n inputRefs: MutableRefObject<Array<HTMLInputElement | null>>;\n length: number;\n onInput: (index: number, value: string) => void;\n onCompositionEnd: (index: number, event: CompositionEvent<HTMLInputElement>) => void;\n onCompositionStart: () => void;\n onKeyDown: (index: number, event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste: (index: number, event: ClipboardEvent<HTMLInputElement>) => void;\n otp: boolean;\n styles: ReturnType<typeof pinInput>;\n type: \"text\" | \"password\";\n value: string;\n}\n\nconst PinInputContext = createContext<PinInputContextValue | null>(null);\n\nfunction digitKey(index: number) {\n return `digit-${index}`;\n}\n\nfunction usePinInputContext() {\n const context = useContext(PinInputContext);\n if (!context) throw new Error(\"PinInput parts must be rendered inside PinInput.Root.\");\n return context;\n}\n\nexport interface PinInputRootProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"defaultValue\"> {\n length: number;\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n onComplete?: (value: string) => void;\n type?: \"text\" | \"password\";\n otp?: boolean;\n autoFocus?: boolean;\n disabled?: boolean;\n invalid?: boolean;\n name?: string;\n children?: ReactNode;\n}\n\nexport const PinInputRoot = forwardRef<HTMLDivElement, PinInputRootProps>(function PinInputRoot(\n {\n autoFocus = false,\n children,\n className,\n defaultValue = \"\",\n disabled = false,\n id: providedId,\n invalid = false,\n length,\n name,\n onValueChange,\n onComplete,\n otp = false,\n type = \"text\",\n value: controlledValue,\n ...props\n },\n ref,\n) {\n const generatedId = useId();\n const id = providedId ?? generatedId;\n const styles = pinInput();\n const safeLength = Math.max(1, Math.floor(length));\n const [uncontrolledValue, setUncontrolledValue] = useState(() =>\n defaultValue.slice(0, safeLength),\n );\n const value = (controlledValue ?? uncontrolledValue).slice(0, safeLength);\n const inputRefs = useRef<Array<HTMLInputElement | null>>([]);\n const composingRef = useRef(false);\n const updateValue = useCallback(\n (next: string) => {\n const normalized = next.slice(0, safeLength);\n if (controlledValue === undefined) setUncontrolledValue(normalized);\n onValueChange?.(normalized);\n if (normalized.length === safeLength) onComplete?.(normalized);\n },\n [controlledValue, onComplete, onValueChange, safeLength],\n );\n const normalize = useCallback(\n (next: string) => {\n const characters = Array.from(next);\n return (otp ? characters.filter((character) => /[0-9]/u.test(character)) : characters)\n .join(\"\")\n .slice(0, safeLength);\n },\n [otp, safeLength],\n );\n const focusIndex = useCallback(\n (index: number) => {\n inputRefs.current[Math.max(0, Math.min(safeLength - 1, index))]?.focus();\n },\n [safeLength],\n );\n const onInput = useCallback(\n (index: number, nextCharacter: string) => {\n if (composingRef.current) return;\n const characters = Array.from(value);\n const next = normalize(nextCharacter).slice(-1);\n characters[index] = next;\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n if (next) focusIndex(index + 1);\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onCompositionStart = useCallback(() => {\n composingRef.current = true;\n }, []);\n const onCompositionEnd = useCallback(\n (index: number, event: CompositionEvent<HTMLInputElement>) => {\n composingRef.current = false;\n onInput(index, event.currentTarget.value);\n },\n [onInput],\n );\n const onPaste = useCallback(\n (index: number, event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasted = normalize(event.clipboardData.getData(\"text\"));\n if (!pasted) return;\n const characters = Array.from(value);\n Array.from(pasted).forEach((character, offset) => {\n if (index + offset < safeLength) characters[index + offset] = character;\n });\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n focusIndex(Math.min(safeLength - 1, index + pasted.length));\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onKeyDown = useCallback(\n (index: number, event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Backspace\" && !event.currentTarget.value && index > 0) {\n event.preventDefault();\n const characters = Array.from(value);\n characters[index - 1] = \"\";\n updateValue(characters.join(\"\"));\n focusIndex(index - 1);\n } else if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n focusIndex(index - 1);\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n focusIndex(index + 1);\n } else if (event.key === \"Home\") {\n event.preventDefault();\n focusIndex(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n focusIndex(safeLength - 1);\n }\n },\n [focusIndex, safeLength, updateValue, value],\n );\n const context: PinInputContextValue = {\n disabled,\n id,\n invalid,\n inputRefs,\n length: safeLength,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n };\n\n useEffect(() => {\n if (autoFocus) inputRefs.current[0]?.focus();\n }, [autoFocus]);\n\n return (\n <div\n {...props}\n className={cx(styles.root, className)}\n data-disabled={disabled || undefined}\n data-invalid={invalid || undefined}\n data-jaci-component=\"pin-input\"\n data-slot=\"pin-input\"\n id={id}\n ref={ref}\n >\n <PinInputContext.Provider value={context}>{children}</PinInputContext.Provider>\n {name ? (\n <input\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled}\n name={name}\n tabIndex={-1}\n value={value}\n readOnly\n />\n ) : null}\n </div>\n );\n});\n\nexport type PinInputLabelProps = ComponentPropsWithoutRef<\"label\">;\nexport const PinInputLabel = forwardRef<HTMLLabelElement, PinInputLabelProps>(\n function PinInputLabel({ className, ...props }, ref) {\n const { id, styles } = usePinInputContext();\n return (\n // biome-ignore lint/a11y/noLabelWithoutControl: the generated Inputs slot supplies the control.\n <label\n {...props}\n className={cx(styles.label, className)}\n data-slot=\"pin-input-label\"\n htmlFor={props.htmlFor ?? `${id}-0`}\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputControlProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputControl = forwardRef<HTMLDivElement, PinInputControlProps>(\n function PinInputControl({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.control, className)}\n data-slot=\"pin-input-control\"\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputInputsProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputInputs = forwardRef<HTMLDivElement, PinInputInputsProps>(\n function PinInputInputs({ className, ...props }, ref) {\n const { length, styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.inputs, className)}\n data-slot=\"pin-input-inputs\"\n ref={ref}\n >\n {Array.from({ length }, (_, index) => (\n <PinInputInput index={index} key={digitKey(index)} />\n ))}\n </div>\n );\n },\n);\n\nexport interface PinInputInputProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"defaultValue\" | \"onChange\" | \"onKeyDown\" | \"onPaste\" | \"type\" | \"value\"\n > {\n index: number;\n}\nexport const PinInputInput = forwardRef<HTMLInputElement, PinInputInputProps>(\n function PinInputInput(\n {\n className,\n index,\n id,\n onCompositionEnd: onInputCompositionEnd,\n onCompositionStart: onInputCompositionStart,\n ...props\n },\n ref,\n ) {\n const {\n disabled,\n id: rootId,\n inputRefs,\n invalid,\n length,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n } = usePinInputContext();\n return (\n <input\n {...props}\n aria-label={props[\"aria-label\"] ?? `Digit ${index + 1} of ${length}`}\n aria-invalid={invalid || undefined}\n autoComplete={otp ? \"one-time-code\" : props.autoComplete}\n className={cx(styles.input, className)}\n data-slot=\"pin-input-input\"\n disabled={disabled || props.disabled}\n id={id ?? `${rootId}-${index}`}\n inputMode={otp ? \"numeric\" : props.inputMode}\n maxLength={1}\n onChange={(event) => onInput(index, event.currentTarget.value)}\n onCompositionEnd={(event) => {\n onCompositionEnd(index, event);\n onInputCompositionEnd?.(event);\n }}\n onCompositionStart={(event) => {\n onCompositionStart();\n onInputCompositionStart?.(event);\n }}\n onKeyDown={(event) => onKeyDown(index, event)}\n onPaste={(event) => onPaste(index, event)}\n ref={(node) => {\n inputRefs.current[index] = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type={type}\n value={Array.from(value)[index] ?? \"\"}\n />\n );\n },\n);\n\nexport type PinInputDescriptionProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputDescription = forwardRef<HTMLParagraphElement, PinInputDescriptionProps>(\n function PinInputDescription({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.description, className)}\n data-slot=\"pin-input-description\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputErrorProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputError = forwardRef<HTMLParagraphElement, PinInputErrorProps>(\n function PinInputError({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.error, className)}\n data-slot=\"pin-input-error\"\n role=\"alert\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputHiddenInputProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"name\" | \"type\" | \"value\"\n>;\nexport const PinInputHiddenInput = forwardRef<HTMLInputElement, PinInputHiddenInputProps>(\n function PinInputHiddenInput(props, ref) {\n const { disabled, styles, value } = usePinInputContext();\n return (\n <input\n {...props}\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled || props.disabled}\n readOnly\n ref={ref}\n tabIndex={-1}\n type=\"hidden\"\n value={value}\n />\n );\n },\n);\n\nexport const PinInput = {\n Root: PinInputRoot,\n Label: PinInputLabel,\n Control: PinInputControl,\n Inputs: PinInputInputs,\n Input: PinInputInput,\n Description: PinInputDescription,\n Error: PinInputError,\n HiddenInput: PinInputHiddenInput,\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"pin-input.js","names":[],"sources":["../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n} from \"react\";\nimport type {\n ClipboardEvent,\n CompositionEvent,\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MutableRefObject,\n ReactNode,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { pinInput } from \"../../styled-system/recipes\";\n\ninterface PinInputContextValue {\n disabled: boolean;\n id: string;\n invalid: boolean;\n inputRefs: MutableRefObject<Array<HTMLInputElement | null>>;\n length: number;\n onInput: (index: number, value: string) => void;\n onCompositionEnd: (index: number, event: CompositionEvent<HTMLInputElement>) => void;\n onCompositionStart: () => void;\n onKeyDown: (index: number, event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste: (index: number, event: ClipboardEvent<HTMLInputElement>) => void;\n otp: boolean;\n styles: ReturnType<typeof pinInput>;\n type: \"text\" | \"password\";\n value: string;\n}\n\nconst PinInputContext = createContext<PinInputContextValue | null>(null);\n\nfunction digitKey(index: number) {\n return `digit-${index}`;\n}\n\nfunction usePinInputContext() {\n const context = useContext(PinInputContext);\n if (!context) throw new Error(\"PinInput parts must be rendered inside PinInput.Root.\");\n return context;\n}\n\nexport interface PinInputRootProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"defaultValue\"> {\n length: number;\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n onComplete?: (value: string) => void;\n type?: \"text\" | \"password\";\n otp?: boolean;\n autoFocus?: boolean;\n disabled?: boolean;\n invalid?: boolean;\n name?: string;\n children?: ReactNode;\n}\n\nexport const PinInputRoot = forwardRef<HTMLDivElement, PinInputRootProps>(function PinInputRoot(\n {\n autoFocus = false,\n children,\n className,\n defaultValue = \"\",\n disabled = false,\n id: providedId,\n invalid = false,\n length,\n name,\n onValueChange,\n onComplete,\n otp = false,\n type = \"text\",\n value: controlledValue,\n ...props\n },\n ref,\n) {\n const generatedId = useId();\n const id = providedId ?? generatedId;\n const styles = pinInput();\n const safeLength = Math.max(1, Math.floor(length));\n const [uncontrolledValue, setUncontrolledValue] = useState(() =>\n defaultValue.slice(0, safeLength),\n );\n const value = (controlledValue ?? uncontrolledValue).slice(0, safeLength);\n const inputRefs = useRef<Array<HTMLInputElement | null>>([]);\n const composingRef = useRef(false);\n const updateValue = useCallback(\n (next: string) => {\n const normalized = next.slice(0, safeLength);\n if (controlledValue === undefined) setUncontrolledValue(normalized);\n onValueChange?.(normalized);\n if (normalized.length === safeLength) onComplete?.(normalized);\n },\n [controlledValue, onComplete, onValueChange, safeLength],\n );\n const normalize = useCallback(\n (next: string) => {\n const characters = Array.from(next);\n return (otp ? characters.filter((character) => /[0-9]/u.test(character)) : characters)\n .join(\"\")\n .slice(0, safeLength);\n },\n [otp, safeLength],\n );\n const focusIndex = useCallback(\n (index: number) => {\n inputRefs.current[Math.max(0, Math.min(safeLength - 1, index))]?.focus();\n },\n [safeLength],\n );\n const onInput = useCallback(\n (index: number, nextCharacter: string) => {\n if (composingRef.current) return;\n const characters = Array.from(value);\n const next = normalize(nextCharacter).slice(-1);\n characters[index] = next;\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n if (next) focusIndex(index + 1);\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onCompositionStart = useCallback(() => {\n composingRef.current = true;\n }, []);\n const onCompositionEnd = useCallback(\n (index: number, event: CompositionEvent<HTMLInputElement>) => {\n composingRef.current = false;\n onInput(index, event.currentTarget.value);\n },\n [onInput],\n );\n const onPaste = useCallback(\n (index: number, event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasted = normalize(event.clipboardData.getData(\"text\"));\n if (!pasted) return;\n const characters = Array.from(value);\n Array.from(pasted).forEach((character, offset) => {\n if (index + offset < safeLength) characters[index + offset] = character;\n });\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n focusIndex(Math.min(safeLength - 1, index + pasted.length));\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onKeyDown = useCallback(\n (index: number, event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Backspace\" && !event.currentTarget.value && index > 0) {\n event.preventDefault();\n const characters = Array.from(value);\n characters[index - 1] = \"\";\n updateValue(characters.join(\"\"));\n focusIndex(index - 1);\n } else if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n focusIndex(index - 1);\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n focusIndex(index + 1);\n } else if (event.key === \"Home\") {\n event.preventDefault();\n focusIndex(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n focusIndex(safeLength - 1);\n }\n },\n [focusIndex, safeLength, updateValue, value],\n );\n const context: PinInputContextValue = {\n disabled,\n id,\n invalid,\n inputRefs,\n length: safeLength,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n };\n\n useEffect(() => {\n if (autoFocus) inputRefs.current[0]?.focus();\n }, [autoFocus]);\n\n return (\n <div\n {...props}\n className={cx(styles.root, className)}\n data-disabled={disabled || undefined}\n data-invalid={invalid || undefined}\n data-jaci-component=\"pin-input\"\n data-slot=\"pin-input\"\n id={id}\n ref={ref}\n >\n <PinInputContext.Provider value={context}>{children}</PinInputContext.Provider>\n {name ? (\n <input\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled}\n name={name}\n tabIndex={-1}\n value={value}\n readOnly\n />\n ) : null}\n </div>\n );\n});\n\nexport type PinInputLabelProps = ComponentPropsWithoutRef<\"label\">;\nexport const PinInputLabel = forwardRef<HTMLLabelElement, PinInputLabelProps>(\n function PinInputLabel({ className, ...props }, ref) {\n const { id, styles } = usePinInputContext();\n return (\n // biome-ignore lint/a11y/noLabelWithoutControl: the generated Inputs slot supplies the control.\n <label\n {...props}\n className={cx(styles.label, className)}\n data-slot=\"pin-input-label\"\n htmlFor={props.htmlFor ?? `${id}-0`}\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputControlProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputControl = forwardRef<HTMLDivElement, PinInputControlProps>(\n function PinInputControl({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.control, className)}\n data-slot=\"pin-input-control\"\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputInputsProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputInputs = forwardRef<HTMLDivElement, PinInputInputsProps>(\n function PinInputInputs({ className, ...props }, ref) {\n const { length, styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.inputs, className)}\n data-slot=\"pin-input-inputs\"\n ref={ref}\n >\n {Array.from({ length }, (_, index) => (\n <PinInputInput index={index} key={digitKey(index)} />\n ))}\n </div>\n );\n },\n);\n\nexport interface PinInputInputProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"defaultValue\" | \"onChange\" | \"onKeyDown\" | \"onPaste\" | \"type\" | \"value\"\n > {\n index: number;\n}\nexport const PinInputInput = forwardRef<HTMLInputElement, PinInputInputProps>(\n function PinInputInput(\n {\n className,\n index,\n id,\n onCompositionEnd: onInputCompositionEnd,\n onCompositionStart: onInputCompositionStart,\n ...props\n },\n ref,\n ) {\n const {\n disabled,\n id: rootId,\n inputRefs,\n invalid,\n length,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n } = usePinInputContext();\n return (\n <input\n {...props}\n aria-label={props[\"aria-label\"] ?? `Digit ${index + 1} of ${length}`}\n aria-invalid={invalid || undefined}\n autoComplete={otp ? \"one-time-code\" : props.autoComplete}\n className={cx(styles.input, className)}\n data-slot=\"pin-input-input\"\n disabled={disabled || props.disabled}\n id={id ?? `${rootId}-${index}`}\n inputMode={otp ? \"numeric\" : props.inputMode}\n maxLength={1}\n onChange={(event) => onInput(index, event.currentTarget.value)}\n onCompositionEnd={(event) => {\n onCompositionEnd(index, event);\n onInputCompositionEnd?.(event);\n }}\n onCompositionStart={(event) => {\n onCompositionStart();\n onInputCompositionStart?.(event);\n }}\n onKeyDown={(event) => onKeyDown(index, event)}\n onPaste={(event) => onPaste(index, event)}\n ref={(node) => {\n inputRefs.current[index] = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type={type}\n value={Array.from(value)[index] ?? \"\"}\n />\n );\n },\n);\n\nexport type PinInputDescriptionProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputDescription = forwardRef<HTMLParagraphElement, PinInputDescriptionProps>(\n function PinInputDescription({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.description, className)}\n data-slot=\"pin-input-description\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputErrorProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputError = forwardRef<HTMLParagraphElement, PinInputErrorProps>(\n function PinInputError({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.error, className)}\n data-slot=\"pin-input-error\"\n role=\"alert\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputHiddenInputProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"name\" | \"type\" | \"value\"\n>;\nexport const PinInputHiddenInput = forwardRef<HTMLInputElement, PinInputHiddenInputProps>(\n function PinInputHiddenInput(props, ref) {\n const { disabled, styles, value } = usePinInputContext();\n return (\n <input\n {...props}\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled || props.disabled}\n readOnly\n ref={ref}\n tabIndex={-1}\n type=\"hidden\"\n value={value}\n />\n );\n },\n);\n\nexport const PinInput = {\n Root: PinInputRoot,\n Label: PinInputLabel,\n Control: PinInputControl,\n Inputs: PinInputInputs,\n Input: PinInputInput,\n Description: PinInputDescription,\n Error: PinInputError,\n HiddenInput: PinInputHiddenInput,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"pin-input.js","names":[],"sources":["../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n} from \"react\";\nimport type {\n ClipboardEvent,\n CompositionEvent,\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MutableRefObject,\n ReactNode,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { pinInput } from \"../../styled-system/recipes\";\n\ninterface PinInputContextValue {\n disabled: boolean;\n id: string;\n invalid: boolean;\n inputRefs: MutableRefObject<Array<HTMLInputElement | null>>;\n length: number;\n onInput: (index: number, value: string) => void;\n onCompositionEnd: (index: number, event: CompositionEvent<HTMLInputElement>) => void;\n onCompositionStart: () => void;\n onKeyDown: (index: number, event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste: (index: number, event: ClipboardEvent<HTMLInputElement>) => void;\n otp: boolean;\n styles: ReturnType<typeof pinInput>;\n type: \"text\" | \"password\";\n value: string;\n}\n\nconst PinInputContext = createContext<PinInputContextValue | null>(null);\n\nfunction digitKey(index: number) {\n return `digit-${index}`;\n}\n\nfunction usePinInputContext() {\n const context = useContext(PinInputContext);\n if (!context) throw new Error(\"PinInput parts must be rendered inside PinInput.Root.\");\n return context;\n}\n\nexport interface PinInputRootProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"defaultValue\"> {\n length: number;\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n onComplete?: (value: string) => void;\n type?: \"text\" | \"password\";\n otp?: boolean;\n autoFocus?: boolean;\n disabled?: boolean;\n invalid?: boolean;\n name?: string;\n children?: ReactNode;\n}\n\nexport const PinInputRoot = forwardRef<HTMLDivElement, PinInputRootProps>(function PinInputRoot(\n {\n autoFocus = false,\n children,\n className,\n defaultValue = \"\",\n disabled = false,\n id: providedId,\n invalid = false,\n length,\n name,\n onValueChange,\n onComplete,\n otp = false,\n type = \"text\",\n value: controlledValue,\n ...props\n },\n ref,\n) {\n const generatedId = useId();\n const id = providedId ?? generatedId;\n const styles = pinInput();\n const safeLength = Math.max(1, Math.floor(length));\n const [uncontrolledValue, setUncontrolledValue] = useState(() =>\n defaultValue.slice(0, safeLength),\n );\n const value = (controlledValue ?? uncontrolledValue).slice(0, safeLength);\n const inputRefs = useRef<Array<HTMLInputElement | null>>([]);\n const composingRef = useRef(false);\n const updateValue = useCallback(\n (next: string) => {\n const normalized = next.slice(0, safeLength);\n if (controlledValue === undefined) setUncontrolledValue(normalized);\n onValueChange?.(normalized);\n if (normalized.length === safeLength) onComplete?.(normalized);\n },\n [controlledValue, onComplete, onValueChange, safeLength],\n );\n const normalize = useCallback(\n (next: string) => {\n const characters = Array.from(next);\n return (otp ? characters.filter((character) => /[0-9]/u.test(character)) : characters)\n .join(\"\")\n .slice(0, safeLength);\n },\n [otp, safeLength],\n );\n const focusIndex = useCallback(\n (index: number) => {\n inputRefs.current[Math.max(0, Math.min(safeLength - 1, index))]?.focus();\n },\n [safeLength],\n );\n const onInput = useCallback(\n (index: number, nextCharacter: string) => {\n if (composingRef.current) return;\n const characters = Array.from(value);\n const next = normalize(nextCharacter).slice(-1);\n characters[index] = next;\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n if (next) focusIndex(index + 1);\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onCompositionStart = useCallback(() => {\n composingRef.current = true;\n }, []);\n const onCompositionEnd = useCallback(\n (index: number, event: CompositionEvent<HTMLInputElement>) => {\n composingRef.current = false;\n onInput(index, event.currentTarget.value);\n },\n [onInput],\n );\n const onPaste = useCallback(\n (index: number, event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasted = normalize(event.clipboardData.getData(\"text\"));\n if (!pasted) return;\n const characters = Array.from(value);\n Array.from(pasted).forEach((character, offset) => {\n if (index + offset < safeLength) characters[index + offset] = character;\n });\n const nextValue = characters.join(\"\").slice(0, safeLength);\n updateValue(nextValue);\n focusIndex(Math.min(safeLength - 1, index + pasted.length));\n },\n [focusIndex, normalize, safeLength, updateValue, value],\n );\n const onKeyDown = useCallback(\n (index: number, event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Backspace\" && !event.currentTarget.value && index > 0) {\n event.preventDefault();\n const characters = Array.from(value);\n characters[index - 1] = \"\";\n updateValue(characters.join(\"\"));\n focusIndex(index - 1);\n } else if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n focusIndex(index - 1);\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n focusIndex(index + 1);\n } else if (event.key === \"Home\") {\n event.preventDefault();\n focusIndex(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n focusIndex(safeLength - 1);\n }\n },\n [focusIndex, safeLength, updateValue, value],\n );\n const context: PinInputContextValue = {\n disabled,\n id,\n invalid,\n inputRefs,\n length: safeLength,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n };\n\n useEffect(() => {\n if (autoFocus) inputRefs.current[0]?.focus();\n }, [autoFocus]);\n\n return (\n <div\n {...props}\n className={cx(styles.root, className)}\n data-disabled={disabled || undefined}\n data-invalid={invalid || undefined}\n data-jaci-component=\"pin-input\"\n data-slot=\"pin-input\"\n id={id}\n ref={ref}\n >\n <PinInputContext.Provider value={context}>{children}</PinInputContext.Provider>\n {name ? (\n <input\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled}\n name={name}\n tabIndex={-1}\n value={value}\n readOnly\n />\n ) : null}\n </div>\n );\n});\n\nexport type PinInputLabelProps = ComponentPropsWithoutRef<\"label\">;\nexport const PinInputLabel = forwardRef<HTMLLabelElement, PinInputLabelProps>(\n function PinInputLabel({ className, ...props }, ref) {\n const { id, styles } = usePinInputContext();\n return (\n // biome-ignore lint/a11y/noLabelWithoutControl: the generated Inputs slot supplies the control.\n <label\n {...props}\n className={cx(styles.label, className)}\n data-slot=\"pin-input-label\"\n htmlFor={props.htmlFor ?? `${id}-0`}\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputControlProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputControl = forwardRef<HTMLDivElement, PinInputControlProps>(\n function PinInputControl({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.control, className)}\n data-slot=\"pin-input-control\"\n ref={ref}\n />\n );\n },\n);\n\nexport type PinInputInputsProps = ComponentPropsWithoutRef<\"div\">;\nexport const PinInputInputs = forwardRef<HTMLDivElement, PinInputInputsProps>(\n function PinInputInputs({ className, ...props }, ref) {\n const { length, styles } = usePinInputContext();\n return (\n <div\n {...props}\n className={cx(styles.inputs, className)}\n data-slot=\"pin-input-inputs\"\n ref={ref}\n >\n {Array.from({ length }, (_, index) => (\n <PinInputInput index={index} key={digitKey(index)} />\n ))}\n </div>\n );\n },\n);\n\nexport interface PinInputInputProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"defaultValue\" | \"onChange\" | \"onKeyDown\" | \"onPaste\" | \"type\" | \"value\"\n > {\n index: number;\n}\nexport const PinInputInput = forwardRef<HTMLInputElement, PinInputInputProps>(\n function PinInputInput(\n {\n className,\n index,\n id,\n onCompositionEnd: onInputCompositionEnd,\n onCompositionStart: onInputCompositionStart,\n ...props\n },\n ref,\n ) {\n const {\n disabled,\n id: rootId,\n inputRefs,\n invalid,\n length,\n onInput,\n onCompositionEnd,\n onCompositionStart,\n onKeyDown,\n onPaste,\n otp,\n styles,\n type,\n value,\n } = usePinInputContext();\n return (\n <input\n {...props}\n aria-label={props[\"aria-label\"] ?? `Digit ${index + 1} of ${length}`}\n aria-invalid={invalid || undefined}\n autoComplete={otp ? \"one-time-code\" : props.autoComplete}\n className={cx(styles.input, className)}\n data-slot=\"pin-input-input\"\n disabled={disabled || props.disabled}\n id={id ?? `${rootId}-${index}`}\n inputMode={otp ? \"numeric\" : props.inputMode}\n maxLength={1}\n onChange={(event) => onInput(index, event.currentTarget.value)}\n onCompositionEnd={(event) => {\n onCompositionEnd(index, event);\n onInputCompositionEnd?.(event);\n }}\n onCompositionStart={(event) => {\n onCompositionStart();\n onInputCompositionStart?.(event);\n }}\n onKeyDown={(event) => onKeyDown(index, event)}\n onPaste={(event) => onPaste(index, event)}\n ref={(node) => {\n inputRefs.current[index] = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type={type}\n value={Array.from(value)[index] ?? \"\"}\n />\n );\n },\n);\n\nexport type PinInputDescriptionProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputDescription = forwardRef<HTMLParagraphElement, PinInputDescriptionProps>(\n function PinInputDescription({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.description, className)}\n data-slot=\"pin-input-description\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputErrorProps = ComponentPropsWithoutRef<\"p\">;\nexport const PinInputError = forwardRef<HTMLParagraphElement, PinInputErrorProps>(\n function PinInputError({ className, ...props }, ref) {\n const { styles } = usePinInputContext();\n return (\n <p\n {...props}\n className={cx(styles.error, className)}\n data-slot=\"pin-input-error\"\n role=\"alert\"\n ref={ref}\n />\n );\n },\n);\nexport type PinInputHiddenInputProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"name\" | \"type\" | \"value\"\n>;\nexport const PinInputHiddenInput = forwardRef<HTMLInputElement, PinInputHiddenInputProps>(\n function PinInputHiddenInput(props, ref) {\n const { disabled, styles, value } = usePinInputContext();\n return (\n <input\n {...props}\n aria-hidden=\"true\"\n className={styles.hiddenInput}\n disabled={disabled || props.disabled}\n readOnly\n ref={ref}\n tabIndex={-1}\n type=\"hidden\"\n value={value}\n />\n );\n },\n);\n\nexport const PinInput = {\n Root: PinInputRoot,\n Label: PinInputLabel,\n Control: PinInputControl,\n Inputs: PinInputInputs,\n Input: PinInputInput,\n Description: PinInputDescription,\n Error: PinInputError,\n HiddenInput: PinInputHiddenInput,\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"popover.cjs","names":["BasePopover","withRecipeClassName","popover","useThemePortalProps"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\";\n\nimport { Popover as BasePopover } from \"@base-ui/react/popover\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { PopoverRoot as BasePopoverRoot } from \"@base-ui/react/popover\";\n\nimport { popover } from \"../../styled-system/recipes\";\nimport { withRecipeClassName } from \"../base-ui\";\nimport { useThemePortalProps } from \"../../theme/theme-scope\";\n\n/** Preserves Base UI's controlled `open` API and uncontrolled `defaultOpen` API. */\nexport type PopoverRootProps<Payload = unknown> = BasePopoverRoot.Props<Payload>;\n\nexport function PopoverRoot<Payload = unknown>(props: PopoverRootProps<Payload>) {\n return <BasePopover.Root {...props} />;\n}\n\nexport type PopoverTriggerProps = ComponentPropsWithoutRef<typeof BasePopover.Trigger>;\n\nexport const PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n function PopoverTrigger({ className, ...props }, ref) {\n return (\n <BasePopover.Trigger\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().trigger, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-trigger\"\n />\n );\n },\n);\n\n/** Preserves Base UI's optional portal container and mount controls. */\nexport function PopoverPortal(props: ComponentPropsWithoutRef<typeof BasePopover.Portal>) {\n return <BasePopover.Portal {...useThemePortalProps(props)} />;\n}\n\nexport type PopoverPositionerProps = ComponentPropsWithoutRef<typeof BasePopover.Positioner>;\n\nexport const PopoverPositioner = forwardRef<HTMLDivElement, PopoverPositionerProps>(\n function PopoverPositioner({ className, ...props }, ref) {\n return (\n <BasePopover.Positioner\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().positioner, className)}\n data-slot=\"popover-positioner\"\n />\n );\n },\n);\n\nexport type PopoverPopupProps = ComponentPropsWithoutRef<typeof BasePopover.Popup>;\n\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Popup\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().popup, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-popup\"\n />\n );\n});\n\nexport type PopoverTitleProps = ComponentPropsWithoutRef<typeof BasePopover.Title>;\n\nexport const PopoverTitle = forwardRef<HTMLHeadingElement, PopoverTitleProps>(function PopoverTitle(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Title\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().title, className)}\n data-slot=\"popover-title\"\n />\n );\n});\n\nexport type PopoverDescriptionProps = ComponentPropsWithoutRef<typeof BasePopover.Description>;\n\nexport const PopoverDescription = forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n function PopoverDescription({ className, ...props }, ref) {\n return (\n <BasePopover.Description\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().description, className)}\n data-slot=\"popover-description\"\n />\n );\n },\n);\n\nexport type PopoverCloseProps = ComponentPropsWithoutRef<typeof BasePopover.Close>;\n\nexport const PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(function PopoverClose(\n { \"aria-label\": ariaLabel, children, className, ...props },\n ref,\n) {\n const hasVisibleLabel = children != null;\n\n return (\n <BasePopover.Close\n {...props}\n aria-label={ariaLabel ?? (hasVisibleLabel ? undefined : \"Close popover\")}\n ref={ref}\n className={withRecipeClassName(popover().close, className)}\n data-slot=\"popover-close\"\n >\n {children ?? \"×\"}\n </BasePopover.Close>\n );\n});\n\nexport type PopoverArrowProps = ComponentPropsWithoutRef<typeof BasePopover.Arrow>;\n\nexport const PopoverArrow = forwardRef<HTMLDivElement, PopoverArrowProps>(function PopoverArrow(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Arrow\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().arrow, className)}\n data-slot=\"popover-arrow\"\n />\n );\n});\n\nexport const Popover = {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Portal: PopoverPortal,\n Positioner: PopoverPositioner,\n Popup: PopoverPopup,\n Title: PopoverTitle,\n Description: PopoverDescription,\n Close: PopoverClose,\n Arrow: PopoverArrow,\n createHandle: BasePopover.createHandle,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"popover.cjs","names":["BasePopover","forwardRef","withRecipeClassName","popover","useThemePortalProps"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\";\n\nimport { Popover as BasePopover } from \"@base-ui/react/popover\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { PopoverRoot as BasePopoverRoot } from \"@base-ui/react/popover\";\n\nimport { popover } from \"../../styled-system/recipes\";\nimport { withRecipeClassName } from \"../base-ui\";\nimport { useThemePortalProps } from \"../../theme/theme-scope\";\n\n/** Preserves Base UI's controlled `open` API and uncontrolled `defaultOpen` API. */\nexport type PopoverRootProps<Payload = unknown> = BasePopoverRoot.Props<Payload>;\n\nexport function PopoverRoot<Payload = unknown>(props: PopoverRootProps<Payload>) {\n return <BasePopover.Root {...props} />;\n}\n\nexport type PopoverTriggerProps = ComponentPropsWithoutRef<typeof BasePopover.Trigger>;\n\nexport const PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n function PopoverTrigger({ className, ...props }, ref) {\n return (\n <BasePopover.Trigger\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().trigger, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-trigger\"\n />\n );\n },\n);\n\n/** Preserves Base UI's optional portal container and mount controls. */\nexport function PopoverPortal(props: ComponentPropsWithoutRef<typeof BasePopover.Portal>) {\n return <BasePopover.Portal {...useThemePortalProps(props)} />;\n}\n\nexport type PopoverPositionerProps = ComponentPropsWithoutRef<typeof BasePopover.Positioner>;\n\nexport const PopoverPositioner = forwardRef<HTMLDivElement, PopoverPositionerProps>(\n function PopoverPositioner({ className, ...props }, ref) {\n return (\n <BasePopover.Positioner\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().positioner, className)}\n data-slot=\"popover-positioner\"\n />\n );\n },\n);\n\nexport type PopoverPopupProps = ComponentPropsWithoutRef<typeof BasePopover.Popup>;\n\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Popup\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().popup, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-popup\"\n />\n );\n});\n\nexport type PopoverTitleProps = ComponentPropsWithoutRef<typeof BasePopover.Title>;\n\nexport const PopoverTitle = forwardRef<HTMLHeadingElement, PopoverTitleProps>(function PopoverTitle(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Title\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().title, className)}\n data-slot=\"popover-title\"\n />\n );\n});\n\nexport type PopoverDescriptionProps = ComponentPropsWithoutRef<typeof BasePopover.Description>;\n\nexport const PopoverDescription = forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n function PopoverDescription({ className, ...props }, ref) {\n return (\n <BasePopover.Description\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().description, className)}\n data-slot=\"popover-description\"\n />\n );\n },\n);\n\nexport type PopoverCloseProps = ComponentPropsWithoutRef<typeof BasePopover.Close>;\n\nexport const PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(function PopoverClose(\n { \"aria-label\": ariaLabel, children, className, ...props },\n ref,\n) {\n const hasVisibleLabel = children != null;\n\n return (\n <BasePopover.Close\n {...props}\n aria-label={ariaLabel ?? (hasVisibleLabel ? undefined : \"Close popover\")}\n ref={ref}\n className={withRecipeClassName(popover().close, className)}\n data-slot=\"popover-close\"\n >\n {children ?? \"×\"}\n </BasePopover.Close>\n );\n});\n\nexport type PopoverArrowProps = ComponentPropsWithoutRef<typeof BasePopover.Arrow>;\n\nexport const PopoverArrow = forwardRef<HTMLDivElement, PopoverArrowProps>(function PopoverArrow(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Arrow\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().arrow, className)}\n data-slot=\"popover-arrow\"\n />\n );\n});\n\nexport const Popover = {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Portal: PopoverPortal,\n Positioner: PopoverPositioner,\n Popup: PopoverPopup,\n Title: PopoverTitle,\n Description: PopoverDescription,\n Close: PopoverClose,\n Arrow: PopoverArrow,\n createHandle: BasePopover.createHandle,\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"popover.js","names":["PopoverRoot","BasePopover","Popover"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\";\n\nimport { Popover as BasePopover } from \"@base-ui/react/popover\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { PopoverRoot as BasePopoverRoot } from \"@base-ui/react/popover\";\n\nimport { popover } from \"../../styled-system/recipes\";\nimport { withRecipeClassName } from \"../base-ui\";\nimport { useThemePortalProps } from \"../../theme/theme-scope\";\n\n/** Preserves Base UI's controlled `open` API and uncontrolled `defaultOpen` API. */\nexport type PopoverRootProps<Payload = unknown> = BasePopoverRoot.Props<Payload>;\n\nexport function PopoverRoot<Payload = unknown>(props: PopoverRootProps<Payload>) {\n return <BasePopover.Root {...props} />;\n}\n\nexport type PopoverTriggerProps = ComponentPropsWithoutRef<typeof BasePopover.Trigger>;\n\nexport const PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n function PopoverTrigger({ className, ...props }, ref) {\n return (\n <BasePopover.Trigger\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().trigger, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-trigger\"\n />\n );\n },\n);\n\n/** Preserves Base UI's optional portal container and mount controls. */\nexport function PopoverPortal(props: ComponentPropsWithoutRef<typeof BasePopover.Portal>) {\n return <BasePopover.Portal {...useThemePortalProps(props)} />;\n}\n\nexport type PopoverPositionerProps = ComponentPropsWithoutRef<typeof BasePopover.Positioner>;\n\nexport const PopoverPositioner = forwardRef<HTMLDivElement, PopoverPositionerProps>(\n function PopoverPositioner({ className, ...props }, ref) {\n return (\n <BasePopover.Positioner\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().positioner, className)}\n data-slot=\"popover-positioner\"\n />\n );\n },\n);\n\nexport type PopoverPopupProps = ComponentPropsWithoutRef<typeof BasePopover.Popup>;\n\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Popup\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().popup, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-popup\"\n />\n );\n});\n\nexport type PopoverTitleProps = ComponentPropsWithoutRef<typeof BasePopover.Title>;\n\nexport const PopoverTitle = forwardRef<HTMLHeadingElement, PopoverTitleProps>(function PopoverTitle(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Title\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().title, className)}\n data-slot=\"popover-title\"\n />\n );\n});\n\nexport type PopoverDescriptionProps = ComponentPropsWithoutRef<typeof BasePopover.Description>;\n\nexport const PopoverDescription = forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n function PopoverDescription({ className, ...props }, ref) {\n return (\n <BasePopover.Description\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().description, className)}\n data-slot=\"popover-description\"\n />\n );\n },\n);\n\nexport type PopoverCloseProps = ComponentPropsWithoutRef<typeof BasePopover.Close>;\n\nexport const PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(function PopoverClose(\n { \"aria-label\": ariaLabel, children, className, ...props },\n ref,\n) {\n const hasVisibleLabel = children != null;\n\n return (\n <BasePopover.Close\n {...props}\n aria-label={ariaLabel ?? (hasVisibleLabel ? undefined : \"Close popover\")}\n ref={ref}\n className={withRecipeClassName(popover().close, className)}\n data-slot=\"popover-close\"\n >\n {children ?? \"×\"}\n </BasePopover.Close>\n );\n});\n\nexport type PopoverArrowProps = ComponentPropsWithoutRef<typeof BasePopover.Arrow>;\n\nexport const PopoverArrow = forwardRef<HTMLDivElement, PopoverArrowProps>(function PopoverArrow(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Arrow\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().arrow, className)}\n data-slot=\"popover-arrow\"\n />\n );\n});\n\nexport const Popover = {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Portal: PopoverPortal,\n Positioner: PopoverPositioner,\n Popup: PopoverPopup,\n Title: PopoverTitle,\n Description: PopoverDescription,\n Close: PopoverClose,\n Arrow: PopoverArrow,\n createHandle: BasePopover.createHandle,\n};\n"],"mappings":";;;;;;;;AAcA,SAAgBA,cAA+B,OAAkC;CAC/E,OAAO,oBAACC,QAAY,MAAb,EAAkB,GAAI,MAAQ,CAAA;AACvC;AAIA,MAAa,iBAAiB,WAC5B,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OACE,oBAACA,QAAY,SAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,SAAS,SAAS;EAC3D,uBAAoB;EACpB,aAAU;CACX,CAAA;AAEL,CACF;;AAGA,SAAgB,cAAc,OAA4D;CACxF,OAAO,oBAACA,QAAY,QAAb,EAAoB,GAAI,oBAAoB,KAAK,EAAI,CAAA;AAC9D;AAIA,MAAa,oBAAoB,WAC/B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,oBAACA,QAAY,YAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,YAAY,SAAS;EAC9D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,uBAAoB;EACpB,aAAU;CACX,CAAA;AAEL,CAAC;AAID,MAAa,eAAe,WAAkD,SAAS,aACrF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;CACX,CAAA;AAEL,CAAC;AAID,MAAa,qBAAqB,WAChC,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAS,KAAK;CACxD,OACE,oBAACA,QAAY,aAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,aAAa,SAAS;EAC/D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,eAAe,WAAiD,SAAS,aACpF,EAAE,cAAc,WAAW,UAAU,WAAW,GAAG,SACnD,KACA;CACA,MAAM,kBAAkB,YAAY;CAEpC,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACJ,cAAY,cAAc,kBAAkB,KAAA,IAAY;EACnD;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;YAET,YAAY;CACI,CAAA;AAEvB,CAAC;AAID,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;CACX,CAAA;AAEL,CAAC;AAED,MAAaC,YAAU;CACrB,MAAMF;CACN,SAAS;CACT,QAAQ;CACR,YAAY;CACZ,OAAO;CACP,OAAO;CACP,aAAa;CACb,OAAO;CACP,OAAO;CACP,cAAcC,QAAY;AAC5B"}
1
+ {"version":3,"file":"popover.js","names":["PopoverRoot","BasePopover","Popover"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\";\n\nimport { Popover as BasePopover } from \"@base-ui/react/popover\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { PopoverRoot as BasePopoverRoot } from \"@base-ui/react/popover\";\n\nimport { popover } from \"../../styled-system/recipes\";\nimport { withRecipeClassName } from \"../base-ui\";\nimport { useThemePortalProps } from \"../../theme/theme-scope\";\n\n/** Preserves Base UI's controlled `open` API and uncontrolled `defaultOpen` API. */\nexport type PopoverRootProps<Payload = unknown> = BasePopoverRoot.Props<Payload>;\n\nexport function PopoverRoot<Payload = unknown>(props: PopoverRootProps<Payload>) {\n return <BasePopover.Root {...props} />;\n}\n\nexport type PopoverTriggerProps = ComponentPropsWithoutRef<typeof BasePopover.Trigger>;\n\nexport const PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n function PopoverTrigger({ className, ...props }, ref) {\n return (\n <BasePopover.Trigger\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().trigger, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-trigger\"\n />\n );\n },\n);\n\n/** Preserves Base UI's optional portal container and mount controls. */\nexport function PopoverPortal(props: ComponentPropsWithoutRef<typeof BasePopover.Portal>) {\n return <BasePopover.Portal {...useThemePortalProps(props)} />;\n}\n\nexport type PopoverPositionerProps = ComponentPropsWithoutRef<typeof BasePopover.Positioner>;\n\nexport const PopoverPositioner = forwardRef<HTMLDivElement, PopoverPositionerProps>(\n function PopoverPositioner({ className, ...props }, ref) {\n return (\n <BasePopover.Positioner\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().positioner, className)}\n data-slot=\"popover-positioner\"\n />\n );\n },\n);\n\nexport type PopoverPopupProps = ComponentPropsWithoutRef<typeof BasePopover.Popup>;\n\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Popup\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().popup, className)}\n data-jaci-component=\"popover\"\n data-slot=\"popover-popup\"\n />\n );\n});\n\nexport type PopoverTitleProps = ComponentPropsWithoutRef<typeof BasePopover.Title>;\n\nexport const PopoverTitle = forwardRef<HTMLHeadingElement, PopoverTitleProps>(function PopoverTitle(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Title\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().title, className)}\n data-slot=\"popover-title\"\n />\n );\n});\n\nexport type PopoverDescriptionProps = ComponentPropsWithoutRef<typeof BasePopover.Description>;\n\nexport const PopoverDescription = forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n function PopoverDescription({ className, ...props }, ref) {\n return (\n <BasePopover.Description\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().description, className)}\n data-slot=\"popover-description\"\n />\n );\n },\n);\n\nexport type PopoverCloseProps = ComponentPropsWithoutRef<typeof BasePopover.Close>;\n\nexport const PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(function PopoverClose(\n { \"aria-label\": ariaLabel, children, className, ...props },\n ref,\n) {\n const hasVisibleLabel = children != null;\n\n return (\n <BasePopover.Close\n {...props}\n aria-label={ariaLabel ?? (hasVisibleLabel ? undefined : \"Close popover\")}\n ref={ref}\n className={withRecipeClassName(popover().close, className)}\n data-slot=\"popover-close\"\n >\n {children ?? \"×\"}\n </BasePopover.Close>\n );\n});\n\nexport type PopoverArrowProps = ComponentPropsWithoutRef<typeof BasePopover.Arrow>;\n\nexport const PopoverArrow = forwardRef<HTMLDivElement, PopoverArrowProps>(function PopoverArrow(\n { className, ...props },\n ref,\n) {\n return (\n <BasePopover.Arrow\n {...props}\n ref={ref}\n className={withRecipeClassName(popover().arrow, className)}\n data-slot=\"popover-arrow\"\n />\n );\n});\n\nexport const Popover = {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Portal: PopoverPortal,\n Positioner: PopoverPositioner,\n Popup: PopoverPopup,\n Title: PopoverTitle,\n Description: PopoverDescription,\n Close: PopoverClose,\n Arrow: PopoverArrow,\n createHandle: BasePopover.createHandle,\n};\n"],"mappings":";;;;;;;;AAcA,SAAgBA,cAA+B,OAAkC;CAC/E,OAAO,oBAACC,QAAY,MAAb,EAAkB,GAAI,MAAQ,CAAA;AACvC;AAIA,MAAa,iBAAiB,WAC5B,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OACE,oBAACA,QAAY,SAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,SAAS,SAAS;EAC3D,uBAAoB;EACpB,aAAU;CACX,CAAA;AAEL,CACF;;AAGA,SAAgB,cAAc,OAA4D;CACxF,OAAO,oBAACA,QAAY,QAAb,EAAoB,GAAI,oBAAoB,KAAK,EAAI,CAAA;AAC9D;AAIA,MAAa,oBAAoB,WAC/B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,oBAACA,QAAY,YAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,YAAY,SAAS;EAC9D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,uBAAoB;EACpB,aAAU;CACX,CAAA;AAEL,CAAC;AAID,MAAa,eAAe,WAAkD,SAAS,aACrF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;CACX,CAAA;AAEL,CAAC;AAID,MAAa,qBAAqB,WAChC,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAS,KAAK;CACxD,OACE,oBAACA,QAAY,aAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,aAAa,SAAS;EAC/D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,eAAe,WAAiD,SAAS,aACpF,EAAE,cAAc,WAAW,UAAU,WAAW,GAAG,SACnD,KACA;CACA,MAAM,kBAAkB,YAAY;CAEpC,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACJ,cAAY,cAAc,kBAAkB,KAAA,IAAY;EACnD;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;EAET,UAAA,YAAY;CACI,CAAA;AAEvB,CAAC;AAID,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,WAAW,GAAG,SAChB,KACA;CACA,OACE,oBAACA,QAAY,OAAb;EACE,GAAI;EACC;EACL,WAAW,oBAAoB,QAAQ,CAAC,CAAC,OAAO,SAAS;EACzD,aAAU;CACX,CAAA;AAEL,CAAC;AAED,MAAaC,YAAU;CACrB,MAAMF;CACN,SAAS;CACT,QAAQ;CACR,YAAY;CACZ,OAAO;CACP,OAAO;CACP,aAAa;CACb,OAAO;CACP,OAAO;CACP,cAAcC,QAAY;AAC5B"}
@@ -1 +1 @@
1
- {"version":3,"file":"progress.cjs","names":["progress","cx"],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { progress } from \"../../styled-system/recipes\";\n\nfunction clamp(value: number, maximum: number) {\n if (!Number.isFinite(value)) {\n return 0;\n }\n\n return Math.min(Math.max(value, 0), maximum);\n}\n\nexport interface ProgressProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n /** The current amount. Omit it, or set `indeterminate`, when it is unknown. */\n value?: number | null;\n /** The value that represents completion. Defaults to 100. */\n max?: number;\n /** Omits `aria-valuenow` and renders an in-progress visual state. */\n indeterminate?: boolean;\n /** A visible, automatically associated accessible label. */\n label?: ReactNode;\n valueLabel?: ReactNode;\n locale?: Intl.LocalesArgument;\n format?: Intl.NumberFormatOptions;\n getAriaValueText?: (formattedValue: string, value: number) => string;\n}\n\n/**\n * A semantic progress bar. Provide `label` or `aria-label` so its purpose is\n * announced to assistive technology.\n */\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n className,\n format,\n getAriaValueText,\n indeterminate = false,\n label,\n locale,\n max = 100,\n value = 0,\n valueLabel,\n ...props\n },\n ref,\n) {\n const labelId = useId();\n const maximum = Number.isFinite(max) && max > 0 ? max : 100;\n const currentValue = clamp(value ?? 0, maximum);\n const percentage = (currentValue / maximum) * 100;\n const formattedValue = new Intl.NumberFormat(locale, format).format(currentValue);\n const computedValueText = getAriaValueText?.(formattedValue, currentValue);\n const hasVisibleLabel = label !== null && label !== undefined;\n const labelledBy = ariaLabelledBy ?? (ariaLabel || !hasVisibleLabel ? undefined : labelId);\n const accessibleLabel = ariaLabel ?? (labelledBy ? undefined : \"Progress\");\n const styles = progress({ indeterminate });\n\n return (\n <div\n {...props}\n ref={ref}\n aria-busy={indeterminate || undefined}\n aria-label={accessibleLabel}\n aria-labelledby={labelledBy}\n aria-valuemax={maximum}\n aria-valuemin={0}\n aria-valuenow={indeterminate ? undefined : currentValue}\n aria-valuetext={ariaValueText ?? computedValueText}\n className={cx(styles.root, className)}\n data-indeterminate={indeterminate || undefined}\n data-jaci-component=\"progress\"\n data-slot=\"progress\"\n role=\"progressbar\"\n >\n {hasVisibleLabel || valueLabel !== undefined ? (\n <div style={{ display: \"flex\", minWidth: 0 }}>\n {hasVisibleLabel ? (\n <span className={styles.label} data-slot=\"progress-label\" id={labelId}>\n {label}\n </span>\n ) : null}\n {valueLabel !== undefined ? (\n <span className={styles.value} data-slot=\"progress-value\">\n {valueLabel}\n </span>\n ) : null}\n </div>\n ) : null}\n <div aria-hidden=\"true\" className={styles.track} data-slot=\"progress-track\">\n <div\n className={styles.indicator}\n data-indeterminate={indeterminate || undefined}\n data-slot=\"progress-indicator\"\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n </div>\n );\n});\n"],"mappings":";;;;;AAMA,SAAS,MAAM,OAAe,SAAiB;CAC7C,IAAI,CAAC,OAAO,SAAS,KAAK,GACxB,OAAO;CAGT,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,OAAO;AAC7C;;;;;AAqBA,MAAa,YAAA,GAAA,MAAA,WAAA,CAAqD,SAAS,SACzE,EACE,cAAc,WACd,mBAAmB,gBACnB,kBAAkB,eAClB,WACA,QACA,kBACA,gBAAgB,OAChB,OACA,QACA,MAAM,KACN,QAAQ,GACR,YACA,GAAG,SAEL,KACA;CACA,MAAM,WAAA,GAAA,MAAA,MAAA,CAAgB;CACtB,MAAM,UAAU,OAAO,SAAS,GAAG,KAAK,MAAM,IAAI,MAAM;CACxD,MAAM,eAAe,MAAM,SAAS,GAAG,OAAO;CAC9C,MAAM,aAAc,eAAe,UAAW;CAC9C,MAAM,iBAAiB,IAAI,KAAK,aAAa,QAAQ,MAAM,CAAC,CAAC,OAAO,YAAY;CAChF,MAAM,oBAAoB,mBAAmB,gBAAgB,YAAY;CACzE,MAAM,kBAAkB,UAAU,QAAQ,UAAU,KAAA;CACpD,MAAM,aAAa,mBAAmB,aAAa,CAAC,kBAAkB,KAAA,IAAY;CAClF,MAAM,kBAAkB,cAAc,aAAa,KAAA,IAAY;CAC/D,MAAM,SAASA,iBAAAA,SAAS,EAAE,cAAc,CAAC;CAEzC,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,GAAI;EACC;EACL,aAAW,iBAAiB,KAAA;EAC5B,cAAY;EACZ,mBAAiB;EACjB,iBAAe;EACf,iBAAe;EACf,iBAAe,gBAAgB,KAAA,IAAY;EAC3C,kBAAgB,iBAAiB;EACjC,WAAWC,WAAAA,GAAG,OAAO,MAAM,SAAS;EACpC,sBAAoB,iBAAiB,KAAA;EACrC,uBAAoB;EACpB,aAAU;EACV,MAAK;YAdP,CAgBG,mBAAmB,eAAe,KAAA,IACjC,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,OAAO;IAAE,SAAS;IAAQ,UAAU;GAAE;aAA3C,CACG,kBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IAAiB,IAAI;cAC3D;GACG,CAAA,IACJ,MACH,eAAe,KAAA,IACd,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;cACtC;GACG,CAAA,IACJ,IACD;OACH,MACJ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,eAAY;GAAO,WAAW,OAAO;GAAO,aAAU;aACzD,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IACE,WAAW,OAAO;IAClB,sBAAoB,iBAAiB,KAAA;IACrC,aAAU;IACV,OAAO,gBAAgB,KAAA,IAAY,EAAE,OAAO,GAAG,WAAW,GAAG;GAC9D,CAAA;EACE,CAAA,CACF;;AAET,CAAC"}
1
+ {"version":3,"file":"progress.cjs","names":["forwardRef","useId","progress","cx"],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { progress } from \"../../styled-system/recipes\";\n\nfunction clamp(value: number, maximum: number) {\n if (!Number.isFinite(value)) {\n return 0;\n }\n\n return Math.min(Math.max(value, 0), maximum);\n}\n\nexport interface ProgressProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n /** The current amount. Omit it, or set `indeterminate`, when it is unknown. */\n value?: number | null;\n /** The value that represents completion. Defaults to 100. */\n max?: number;\n /** Omits `aria-valuenow` and renders an in-progress visual state. */\n indeterminate?: boolean;\n /** A visible, automatically associated accessible label. */\n label?: ReactNode;\n valueLabel?: ReactNode;\n locale?: Intl.LocalesArgument;\n format?: Intl.NumberFormatOptions;\n getAriaValueText?: (formattedValue: string, value: number) => string;\n}\n\n/**\n * A semantic progress bar. Provide `label` or `aria-label` so its purpose is\n * announced to assistive technology.\n */\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n className,\n format,\n getAriaValueText,\n indeterminate = false,\n label,\n locale,\n max = 100,\n value = 0,\n valueLabel,\n ...props\n },\n ref,\n) {\n const labelId = useId();\n const maximum = Number.isFinite(max) && max > 0 ? max : 100;\n const currentValue = clamp(value ?? 0, maximum);\n const percentage = (currentValue / maximum) * 100;\n const formattedValue = new Intl.NumberFormat(locale, format).format(currentValue);\n const computedValueText = getAriaValueText?.(formattedValue, currentValue);\n const hasVisibleLabel = label !== null && label !== undefined;\n const labelledBy = ariaLabelledBy ?? (ariaLabel || !hasVisibleLabel ? undefined : labelId);\n const accessibleLabel = ariaLabel ?? (labelledBy ? undefined : \"Progress\");\n const styles = progress({ indeterminate });\n\n return (\n <div\n {...props}\n ref={ref}\n aria-busy={indeterminate || undefined}\n aria-label={accessibleLabel}\n aria-labelledby={labelledBy}\n aria-valuemax={maximum}\n aria-valuemin={0}\n aria-valuenow={indeterminate ? undefined : currentValue}\n aria-valuetext={ariaValueText ?? computedValueText}\n className={cx(styles.root, className)}\n data-indeterminate={indeterminate || undefined}\n data-jaci-component=\"progress\"\n data-slot=\"progress\"\n role=\"progressbar\"\n >\n {hasVisibleLabel || valueLabel !== undefined ? (\n <div style={{ display: \"flex\", minWidth: 0 }}>\n {hasVisibleLabel ? (\n <span className={styles.label} data-slot=\"progress-label\" id={labelId}>\n {label}\n </span>\n ) : null}\n {valueLabel !== undefined ? (\n <span className={styles.value} data-slot=\"progress-value\">\n {valueLabel}\n </span>\n ) : null}\n </div>\n ) : null}\n <div aria-hidden=\"true\" className={styles.track} data-slot=\"progress-track\">\n <div\n className={styles.indicator}\n data-indeterminate={indeterminate || undefined}\n data-slot=\"progress-indicator\"\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n </div>\n );\n});\n"],"mappings":";;;;;AAMA,SAAS,MAAM,OAAe,SAAiB;CAC7C,IAAI,CAAC,OAAO,SAAS,KAAK,GACxB,OAAO;CAGT,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,OAAO;AAC7C;;;;;AAqBA,MAAa,YAAA,GAAWA,MAAAA,WAAAA,CAA0C,SAAS,SACzE,EACE,cAAc,WACd,mBAAmB,gBACnB,kBAAkB,eAClB,WACA,QACA,kBACA,gBAAgB,OAChB,OACA,QACA,MAAM,KACN,QAAQ,GACR,YACA,GAAG,SAEL,KACA;CACA,MAAM,WAAA,GAAUC,MAAAA,MAAAA,CAAM;CACtB,MAAM,UAAU,OAAO,SAAS,GAAG,KAAK,MAAM,IAAI,MAAM;CACxD,MAAM,eAAe,MAAM,SAAS,GAAG,OAAO;CAC9C,MAAM,aAAc,eAAe,UAAW;CAC9C,MAAM,iBAAiB,IAAI,KAAK,aAAa,QAAQ,MAAM,CAAC,CAAC,OAAO,YAAY;CAChF,MAAM,oBAAoB,mBAAmB,gBAAgB,YAAY;CACzE,MAAM,kBAAkB,UAAU,QAAQ,UAAU,KAAA;CACpD,MAAM,aAAa,mBAAmB,aAAa,CAAC,kBAAkB,KAAA,IAAY;CAClF,MAAM,kBAAkB,cAAc,aAAa,KAAA,IAAY;CAC/D,MAAM,SAASC,iBAAAA,SAAS,EAAE,cAAc,CAAC;CAEzC,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,GAAI;EACC;EACL,aAAW,iBAAiB,KAAA;EAC5B,cAAY;EACZ,mBAAiB;EACjB,iBAAe;EACf,iBAAe;EACf,iBAAe,gBAAgB,KAAA,IAAY;EAC3C,kBAAgB,iBAAiB;EACjC,WAAWC,WAAAA,GAAG,OAAO,MAAM,SAAS;EACpC,sBAAoB,iBAAiB,KAAA;EACrC,uBAAoB;EACpB,aAAU;EACV,MAAK;EAdP,UAAA,CAgBG,mBAAmB,eAAe,KAAA,IACjC,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,OAAO;IAAE,SAAS;IAAQ,UAAU;GAAE;GAA3C,UAAA,CACG,kBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IAAiB,IAAI;IAC3D,UAAA;GACG,CAAA,IACJ,MACH,eAAe,KAAA,IACd,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IACtC,UAAA;GACG,CAAA,IACJ,IACD;EACH,CAAA,IAAA,MACJ,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,eAAY;GAAO,WAAW,OAAO;GAAO,aAAU;GACzD,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IACE,WAAW,OAAO;IAClB,sBAAoB,iBAAiB,KAAA;IACrC,aAAU;IACV,OAAO,gBAAgB,KAAA,IAAY,EAAE,OAAO,GAAG,WAAW,GAAG;GAC9D,CAAA;EACE,CAAA,CACF;;AAET,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"progress.js","names":[],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { progress } from \"../../styled-system/recipes\";\n\nfunction clamp(value: number, maximum: number) {\n if (!Number.isFinite(value)) {\n return 0;\n }\n\n return Math.min(Math.max(value, 0), maximum);\n}\n\nexport interface ProgressProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n /** The current amount. Omit it, or set `indeterminate`, when it is unknown. */\n value?: number | null;\n /** The value that represents completion. Defaults to 100. */\n max?: number;\n /** Omits `aria-valuenow` and renders an in-progress visual state. */\n indeterminate?: boolean;\n /** A visible, automatically associated accessible label. */\n label?: ReactNode;\n valueLabel?: ReactNode;\n locale?: Intl.LocalesArgument;\n format?: Intl.NumberFormatOptions;\n getAriaValueText?: (formattedValue: string, value: number) => string;\n}\n\n/**\n * A semantic progress bar. Provide `label` or `aria-label` so its purpose is\n * announced to assistive technology.\n */\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n className,\n format,\n getAriaValueText,\n indeterminate = false,\n label,\n locale,\n max = 100,\n value = 0,\n valueLabel,\n ...props\n },\n ref,\n) {\n const labelId = useId();\n const maximum = Number.isFinite(max) && max > 0 ? max : 100;\n const currentValue = clamp(value ?? 0, maximum);\n const percentage = (currentValue / maximum) * 100;\n const formattedValue = new Intl.NumberFormat(locale, format).format(currentValue);\n const computedValueText = getAriaValueText?.(formattedValue, currentValue);\n const hasVisibleLabel = label !== null && label !== undefined;\n const labelledBy = ariaLabelledBy ?? (ariaLabel || !hasVisibleLabel ? undefined : labelId);\n const accessibleLabel = ariaLabel ?? (labelledBy ? undefined : \"Progress\");\n const styles = progress({ indeterminate });\n\n return (\n <div\n {...props}\n ref={ref}\n aria-busy={indeterminate || undefined}\n aria-label={accessibleLabel}\n aria-labelledby={labelledBy}\n aria-valuemax={maximum}\n aria-valuemin={0}\n aria-valuenow={indeterminate ? undefined : currentValue}\n aria-valuetext={ariaValueText ?? computedValueText}\n className={cx(styles.root, className)}\n data-indeterminate={indeterminate || undefined}\n data-jaci-component=\"progress\"\n data-slot=\"progress\"\n role=\"progressbar\"\n >\n {hasVisibleLabel || valueLabel !== undefined ? (\n <div style={{ display: \"flex\", minWidth: 0 }}>\n {hasVisibleLabel ? (\n <span className={styles.label} data-slot=\"progress-label\" id={labelId}>\n {label}\n </span>\n ) : null}\n {valueLabel !== undefined ? (\n <span className={styles.value} data-slot=\"progress-value\">\n {valueLabel}\n </span>\n ) : null}\n </div>\n ) : null}\n <div aria-hidden=\"true\" className={styles.track} data-slot=\"progress-track\">\n <div\n className={styles.indicator}\n data-indeterminate={indeterminate || undefined}\n data-slot=\"progress-indicator\"\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n </div>\n );\n});\n"],"mappings":";;;;;AAMA,SAAS,MAAM,OAAe,SAAiB;CAC7C,IAAI,CAAC,OAAO,SAAS,KAAK,GACxB,OAAO;CAGT,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,OAAO;AAC7C;;;;;AAqBA,MAAa,WAAW,WAA0C,SAAS,SACzE,EACE,cAAc,WACd,mBAAmB,gBACnB,kBAAkB,eAClB,WACA,QACA,kBACA,gBAAgB,OAChB,OACA,QACA,MAAM,KACN,QAAQ,GACR,YACA,GAAG,SAEL,KACA;CACA,MAAM,UAAU,MAAM;CACtB,MAAM,UAAU,OAAO,SAAS,GAAG,KAAK,MAAM,IAAI,MAAM;CACxD,MAAM,eAAe,MAAM,SAAS,GAAG,OAAO;CAC9C,MAAM,aAAc,eAAe,UAAW;CAC9C,MAAM,iBAAiB,IAAI,KAAK,aAAa,QAAQ,MAAM,CAAC,CAAC,OAAO,YAAY;CAChF,MAAM,oBAAoB,mBAAmB,gBAAgB,YAAY;CACzE,MAAM,kBAAkB,UAAU,QAAQ,UAAU,KAAA;CACpD,MAAM,aAAa,mBAAmB,aAAa,CAAC,kBAAkB,KAAA,IAAY;CAClF,MAAM,kBAAkB,cAAc,aAAa,KAAA,IAAY;CAC/D,MAAM,SAAS,SAAS,EAAE,cAAc,CAAC;CAEzC,OACE,qBAAC,OAAD;EACE,GAAI;EACC;EACL,aAAW,iBAAiB,KAAA;EAC5B,cAAY;EACZ,mBAAiB;EACjB,iBAAe;EACf,iBAAe;EACf,iBAAe,gBAAgB,KAAA,IAAY;EAC3C,kBAAgB,iBAAiB;EACjC,WAAW,GAAG,OAAO,MAAM,SAAS;EACpC,sBAAoB,iBAAiB,KAAA;EACrC,uBAAoB;EACpB,aAAU;EACV,MAAK;YAdP,CAgBG,mBAAmB,eAAe,KAAA,IACjC,qBAAC,OAAD;GAAK,OAAO;IAAE,SAAS;IAAQ,UAAU;GAAE;aAA3C,CACG,kBACC,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IAAiB,IAAI;cAC3D;GACG,CAAA,IACJ,MACH,eAAe,KAAA,IACd,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;cACtC;GACG,CAAA,IACJ,IACD;OACH,MACJ,oBAAC,OAAD;GAAK,eAAY;GAAO,WAAW,OAAO;GAAO,aAAU;aACzD,oBAAC,OAAD;IACE,WAAW,OAAO;IAClB,sBAAoB,iBAAiB,KAAA;IACrC,aAAU;IACV,OAAO,gBAAgB,KAAA,IAAY,EAAE,OAAO,GAAG,WAAW,GAAG;GAC9D,CAAA;EACE,CAAA,CACF;;AAET,CAAC"}
1
+ {"version":3,"file":"progress.js","names":[],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { progress } from \"../../styled-system/recipes\";\n\nfunction clamp(value: number, maximum: number) {\n if (!Number.isFinite(value)) {\n return 0;\n }\n\n return Math.min(Math.max(value, 0), maximum);\n}\n\nexport interface ProgressProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n /** The current amount. Omit it, or set `indeterminate`, when it is unknown. */\n value?: number | null;\n /** The value that represents completion. Defaults to 100. */\n max?: number;\n /** Omits `aria-valuenow` and renders an in-progress visual state. */\n indeterminate?: boolean;\n /** A visible, automatically associated accessible label. */\n label?: ReactNode;\n valueLabel?: ReactNode;\n locale?: Intl.LocalesArgument;\n format?: Intl.NumberFormatOptions;\n getAriaValueText?: (formattedValue: string, value: number) => string;\n}\n\n/**\n * A semantic progress bar. Provide `label` or `aria-label` so its purpose is\n * announced to assistive technology.\n */\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(function Progress(\n {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n className,\n format,\n getAriaValueText,\n indeterminate = false,\n label,\n locale,\n max = 100,\n value = 0,\n valueLabel,\n ...props\n },\n ref,\n) {\n const labelId = useId();\n const maximum = Number.isFinite(max) && max > 0 ? max : 100;\n const currentValue = clamp(value ?? 0, maximum);\n const percentage = (currentValue / maximum) * 100;\n const formattedValue = new Intl.NumberFormat(locale, format).format(currentValue);\n const computedValueText = getAriaValueText?.(formattedValue, currentValue);\n const hasVisibleLabel = label !== null && label !== undefined;\n const labelledBy = ariaLabelledBy ?? (ariaLabel || !hasVisibleLabel ? undefined : labelId);\n const accessibleLabel = ariaLabel ?? (labelledBy ? undefined : \"Progress\");\n const styles = progress({ indeterminate });\n\n return (\n <div\n {...props}\n ref={ref}\n aria-busy={indeterminate || undefined}\n aria-label={accessibleLabel}\n aria-labelledby={labelledBy}\n aria-valuemax={maximum}\n aria-valuemin={0}\n aria-valuenow={indeterminate ? undefined : currentValue}\n aria-valuetext={ariaValueText ?? computedValueText}\n className={cx(styles.root, className)}\n data-indeterminate={indeterminate || undefined}\n data-jaci-component=\"progress\"\n data-slot=\"progress\"\n role=\"progressbar\"\n >\n {hasVisibleLabel || valueLabel !== undefined ? (\n <div style={{ display: \"flex\", minWidth: 0 }}>\n {hasVisibleLabel ? (\n <span className={styles.label} data-slot=\"progress-label\" id={labelId}>\n {label}\n </span>\n ) : null}\n {valueLabel !== undefined ? (\n <span className={styles.value} data-slot=\"progress-value\">\n {valueLabel}\n </span>\n ) : null}\n </div>\n ) : null}\n <div aria-hidden=\"true\" className={styles.track} data-slot=\"progress-track\">\n <div\n className={styles.indicator}\n data-indeterminate={indeterminate || undefined}\n data-slot=\"progress-indicator\"\n style={indeterminate ? undefined : { width: `${percentage}%` }}\n />\n </div>\n </div>\n );\n});\n"],"mappings":";;;;;AAMA,SAAS,MAAM,OAAe,SAAiB;CAC7C,IAAI,CAAC,OAAO,SAAS,KAAK,GACxB,OAAO;CAGT,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,OAAO;AAC7C;;;;;AAqBA,MAAa,WAAW,WAA0C,SAAS,SACzE,EACE,cAAc,WACd,mBAAmB,gBACnB,kBAAkB,eAClB,WACA,QACA,kBACA,gBAAgB,OAChB,OACA,QACA,MAAM,KACN,QAAQ,GACR,YACA,GAAG,SAEL,KACA;CACA,MAAM,UAAU,MAAM;CACtB,MAAM,UAAU,OAAO,SAAS,GAAG,KAAK,MAAM,IAAI,MAAM;CACxD,MAAM,eAAe,MAAM,SAAS,GAAG,OAAO;CAC9C,MAAM,aAAc,eAAe,UAAW;CAC9C,MAAM,iBAAiB,IAAI,KAAK,aAAa,QAAQ,MAAM,CAAC,CAAC,OAAO,YAAY;CAChF,MAAM,oBAAoB,mBAAmB,gBAAgB,YAAY;CACzE,MAAM,kBAAkB,UAAU,QAAQ,UAAU,KAAA;CACpD,MAAM,aAAa,mBAAmB,aAAa,CAAC,kBAAkB,KAAA,IAAY;CAClF,MAAM,kBAAkB,cAAc,aAAa,KAAA,IAAY;CAC/D,MAAM,SAAS,SAAS,EAAE,cAAc,CAAC;CAEzC,OACE,qBAAC,OAAD;EACE,GAAI;EACC;EACL,aAAW,iBAAiB,KAAA;EAC5B,cAAY;EACZ,mBAAiB;EACjB,iBAAe;EACf,iBAAe;EACf,iBAAe,gBAAgB,KAAA,IAAY;EAC3C,kBAAgB,iBAAiB;EACjC,WAAW,GAAG,OAAO,MAAM,SAAS;EACpC,sBAAoB,iBAAiB,KAAA;EACrC,uBAAoB;EACpB,aAAU;EACV,MAAK;EAdP,UAAA,CAgBG,mBAAmB,eAAe,KAAA,IACjC,qBAAC,OAAD;GAAK,OAAO;IAAE,SAAS;IAAQ,UAAU;GAAE;GAA3C,UAAA,CACG,kBACC,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IAAiB,IAAI;IAC3D,UAAA;GACG,CAAA,IACJ,MACH,eAAe,KAAA,IACd,oBAAC,QAAD;IAAM,WAAW,OAAO;IAAO,aAAU;IACtC,UAAA;GACG,CAAA,IACJ,IACD;EACH,CAAA,IAAA,MACJ,oBAAC,OAAD;GAAK,eAAY;GAAO,WAAW,OAAO;GAAO,aAAU;GACzD,UAAA,oBAAC,OAAD;IACE,WAAW,OAAO;IAClB,sBAAoB,iBAAiB,KAAA;IACrC,aAAU;IACV,OAAO,gBAAgB,KAAA,IAAY,EAAE,OAAO,GAAG,WAAW,GAAG;GAC9D,CAAA;EACE,CAAA,CACF;;AAET,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"qr-code.cjs","names":["QRCodeEncoder","cx","qrCode"],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps\n extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\" | \"download\"> {\n value: string;\n size?: number;\n margin?: number;\n errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n foreground?: string;\n background?: string;\n label?: string;\n fallback?: ReactNode;\n /** Enables a native SVG download link inside the rendered code. */\n download?: boolean | string;\n downloadLabel?: string;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n return (\n (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n );\n}\n\nfunction Finder({\n x,\n y,\n color,\n background,\n}: {\n x: number;\n y: number;\n color: string;\n background: string;\n}) {\n return (\n <g data-slot=\"qr-code-eye\">\n <rect data-slot=\"qr-code-eye-frame\" fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n <rect\n data-slot=\"qr-code-eye-cutout\"\n fill={background}\n height=\"5\"\n rx=\"0.75\"\n width=\"5\"\n x={x + 1}\n y={y + 1}\n />\n <rect\n data-slot=\"qr-code-eyeball\"\n fill={color}\n height=\"3\"\n rx=\"0.5\"\n width=\"3\"\n x={x + 2}\n y={y + 2}\n />\n </g>\n );\n}\n\nfunction escapeXml(value: string) {\n return value.replace(/[&<>'\"]/g, (character) => {\n const entities: Record<string, string> = {\n \"&\": \"&amp;\",\n \"<\": \"&lt;\",\n \">\": \"&gt;\",\n \"'\": \"&apos;\",\n '\"': \"&quot;\",\n };\n return entities[character] ?? character;\n });\n}\n\nfunction createDownloadSvg({\n background,\n dots,\n foreground,\n finderBackground,\n label,\n margin,\n moduleCount,\n}: {\n background: string;\n dots: readonly [number, number][];\n foreground: string;\n finderBackground: string;\n label: string;\n margin: number;\n moduleCount: number;\n}) {\n const viewBoxSize = moduleCount + margin * 2;\n const backgroundMarkup =\n background === \"transparent\"\n ? \"\"\n : `<rect fill=\"${escapeXml(background)}\" height=\"${viewBoxSize}\" width=\"${viewBoxSize}\" x=\"0\" y=\"0\"/>`;\n const dotsMarkup = dots\n .map(\n ([row, column]) =>\n `<circle cx=\"${margin + column + 0.5}\" cy=\"${margin + row + 0.5}\" fill=\"${escapeXml(foreground)}\" r=\"0.43\"/>`,\n )\n .join(\"\");\n const finderMarkup = (x: number, y: number) =>\n `<g><rect fill=\"${escapeXml(foreground)}\" height=\"7\" rx=\"1\" width=\"7\" x=\"${x}\" y=\"${y}\"/><rect fill=\"${escapeXml(finderBackground)}\" height=\"5\" rx=\"0.75\" width=\"5\" x=\"${x + 1}\" y=\"${y + 1}\"/><rect fill=\"${escapeXml(foreground)}\" height=\"3\" rx=\"0.5\" width=\"3\" x=\"${x + 2}\" y=\"${y + 2}\"/></g>`;\n\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-label=\"${escapeXml(label)}\" role=\"img\" viewBox=\"0 0 ${viewBoxSize} ${viewBoxSize}\">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n {\n // A QR code needs a deterministic high-contrast base. Inheriting\n // `currentColor` or a transparent surface can make finder layers merge\n // in dark scopes, so the defaults intentionally remain black on white.\n background = \"#ffffff\",\n className,\n download = false,\n downloadLabel = \"Download QR code\",\n errorCorrectionLevel = \"Q\",\n fallback,\n foreground = \"#18181b\",\n label = \"QR code\",\n margin = 2,\n size = 192,\n style,\n value,\n ...props\n },\n ref,\n) {\n const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n const finderBackground =\n background === \"transparent\" ? \"var(--jaci-colors-surface-raised)\" : background;\n\n try {\n const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n const moduleCount = code.modules.size;\n const viewBoxSize = moduleCount + safeMargin * 2;\n const modules: ReactNode[] = [];\n const dotCoordinates: [number, number][] = [];\n\n for (let row = 0; row < moduleCount; row += 1) {\n for (let column = 0; column < moduleCount; column += 1) {\n if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n dotCoordinates.push([row, column]);\n modules.push(\n <circle\n cx={safeMargin + column + 0.5}\n cy={safeMargin + row + 0.5}\n data-slot=\"qr-code-dot\"\n fill={foreground}\n key={`${row}-${column}`}\n r=\"0.43\"\n />,\n );\n }\n }\n }\n\n const downloadHref =\n download &&\n `data:image/svg+xml;charset=utf-8,${encodeURIComponent(\n createDownloadSvg({\n background,\n dots: dotCoordinates,\n foreground,\n finderBackground: background === \"transparent\" ? \"#ffffff\" : background,\n label,\n margin: safeMargin,\n moduleCount,\n }),\n )}`;\n const downloadFilename = typeof download === \"string\" ? download : \"qrcode.svg\";\n const visualCode = (\n <>\n {background !== \"transparent\" ? (\n <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n ) : null}\n {modules}\n <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin + moduleCount - 7}\n y={safeMargin}\n />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin}\n y={safeMargin + moduleCount - 7}\n />\n </>\n );\n\n const svg = (\n <svg\n {...props}\n ref={ref}\n aria-hidden={downloadHref ? true : undefined}\n aria-label={downloadHref ? undefined : label}\n className={cx(qrCode(), className)}\n data-dot-shape=\"circle\"\n data-download={download ? \"true\" : undefined}\n data-eye-shape=\"rounded-square\"\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n height={safeSize}\n role={downloadHref ? undefined : \"img\"}\n style={style}\n viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n width={safeSize}\n >\n <title>{label}</title>\n {visualCode}\n </svg>\n );\n\n return downloadHref ? (\n <a\n aria-label={downloadLabel}\n data-jaci-component=\"qr-code-download\"\n data-slot=\"qr-code-download\"\n download={downloadFilename}\n href={downloadHref}\n >\n {svg}\n </a>\n ) : (\n svg\n );\n } catch {\n return (\n <span\n aria-label={label}\n className={cx(qrCode(), className)}\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n data-status=\"error\"\n role=\"img\"\n >\n {fallback ?? \"Unable to generate QR code\"}\n </span>\n );\n }\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"qr-code.cjs","names":["forwardRef","QRCodeEncoder","cx","qrCode"],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps\n extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\" | \"download\"> {\n value: string;\n size?: number;\n margin?: number;\n errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n foreground?: string;\n background?: string;\n label?: string;\n fallback?: ReactNode;\n /** Enables a native SVG download link inside the rendered code. */\n download?: boolean | string;\n downloadLabel?: string;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n return (\n (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n );\n}\n\nfunction Finder({\n x,\n y,\n color,\n background,\n}: {\n x: number;\n y: number;\n color: string;\n background: string;\n}) {\n return (\n <g data-slot=\"qr-code-eye\">\n <rect data-slot=\"qr-code-eye-frame\" fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n <rect\n data-slot=\"qr-code-eye-cutout\"\n fill={background}\n height=\"5\"\n rx=\"0.75\"\n width=\"5\"\n x={x + 1}\n y={y + 1}\n />\n <rect\n data-slot=\"qr-code-eyeball\"\n fill={color}\n height=\"3\"\n rx=\"0.5\"\n width=\"3\"\n x={x + 2}\n y={y + 2}\n />\n </g>\n );\n}\n\nfunction escapeXml(value: string) {\n return value.replace(/[&<>'\"]/g, (character) => {\n const entities: Record<string, string> = {\n \"&\": \"&amp;\",\n \"<\": \"&lt;\",\n \">\": \"&gt;\",\n \"'\": \"&apos;\",\n '\"': \"&quot;\",\n };\n return entities[character] ?? character;\n });\n}\n\nfunction createDownloadSvg({\n background,\n dots,\n foreground,\n finderBackground,\n label,\n margin,\n moduleCount,\n}: {\n background: string;\n dots: readonly [number, number][];\n foreground: string;\n finderBackground: string;\n label: string;\n margin: number;\n moduleCount: number;\n}) {\n const viewBoxSize = moduleCount + margin * 2;\n const backgroundMarkup =\n background === \"transparent\"\n ? \"\"\n : `<rect fill=\"${escapeXml(background)}\" height=\"${viewBoxSize}\" width=\"${viewBoxSize}\" x=\"0\" y=\"0\"/>`;\n const dotsMarkup = dots\n .map(\n ([row, column]) =>\n `<circle cx=\"${margin + column + 0.5}\" cy=\"${margin + row + 0.5}\" fill=\"${escapeXml(foreground)}\" r=\"0.43\"/>`,\n )\n .join(\"\");\n const finderMarkup = (x: number, y: number) =>\n `<g><rect fill=\"${escapeXml(foreground)}\" height=\"7\" rx=\"1\" width=\"7\" x=\"${x}\" y=\"${y}\"/><rect fill=\"${escapeXml(finderBackground)}\" height=\"5\" rx=\"0.75\" width=\"5\" x=\"${x + 1}\" y=\"${y + 1}\"/><rect fill=\"${escapeXml(foreground)}\" height=\"3\" rx=\"0.5\" width=\"3\" x=\"${x + 2}\" y=\"${y + 2}\"/></g>`;\n\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-label=\"${escapeXml(label)}\" role=\"img\" viewBox=\"0 0 ${viewBoxSize} ${viewBoxSize}\">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n {\n // A QR code needs a deterministic high-contrast base. Inheriting\n // `currentColor` or a transparent surface can make finder layers merge\n // in dark scopes, so the defaults intentionally remain black on white.\n background = \"#ffffff\",\n className,\n download = false,\n downloadLabel = \"Download QR code\",\n errorCorrectionLevel = \"Q\",\n fallback,\n foreground = \"#18181b\",\n label = \"QR code\",\n margin = 2,\n size = 192,\n style,\n value,\n ...props\n },\n ref,\n) {\n const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n const finderBackground =\n background === \"transparent\" ? \"var(--jaci-colors-surface-raised)\" : background;\n\n try {\n const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n const moduleCount = code.modules.size;\n const viewBoxSize = moduleCount + safeMargin * 2;\n const modules: ReactNode[] = [];\n const dotCoordinates: [number, number][] = [];\n\n for (let row = 0; row < moduleCount; row += 1) {\n for (let column = 0; column < moduleCount; column += 1) {\n if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n dotCoordinates.push([row, column]);\n modules.push(\n <circle\n cx={safeMargin + column + 0.5}\n cy={safeMargin + row + 0.5}\n data-slot=\"qr-code-dot\"\n fill={foreground}\n key={`${row}-${column}`}\n r=\"0.43\"\n />,\n );\n }\n }\n }\n\n const downloadHref =\n download &&\n `data:image/svg+xml;charset=utf-8,${encodeURIComponent(\n createDownloadSvg({\n background,\n dots: dotCoordinates,\n foreground,\n finderBackground: background === \"transparent\" ? \"#ffffff\" : background,\n label,\n margin: safeMargin,\n moduleCount,\n }),\n )}`;\n const downloadFilename = typeof download === \"string\" ? download : \"qrcode.svg\";\n const visualCode = (\n <>\n {background !== \"transparent\" ? (\n <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n ) : null}\n {modules}\n <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin + moduleCount - 7}\n y={safeMargin}\n />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin}\n y={safeMargin + moduleCount - 7}\n />\n </>\n );\n\n const svg = (\n <svg\n {...props}\n ref={ref}\n aria-hidden={downloadHref ? true : undefined}\n aria-label={downloadHref ? undefined : label}\n className={cx(qrCode(), className)}\n data-dot-shape=\"circle\"\n data-download={download ? \"true\" : undefined}\n data-eye-shape=\"rounded-square\"\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n height={safeSize}\n role={downloadHref ? undefined : \"img\"}\n style={style}\n viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n width={safeSize}\n >\n <title>{label}</title>\n {visualCode}\n </svg>\n );\n\n return downloadHref ? (\n <a\n aria-label={downloadLabel}\n data-jaci-component=\"qr-code-download\"\n data-slot=\"qr-code-download\"\n download={downloadFilename}\n href={downloadHref}\n >\n {svg}\n </a>\n ) : (\n svg\n );\n } catch {\n return (\n <span\n aria-label={label}\n className={cx(qrCode(), className)}\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n data-status=\"error\"\n role=\"img\"\n >\n {fallback ?? \"Unable to generate QR code\"}\n </span>\n );\n }\n});\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"qr-code.js","names":[],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps\n extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\" | \"download\"> {\n value: string;\n size?: number;\n margin?: number;\n errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n foreground?: string;\n background?: string;\n label?: string;\n fallback?: ReactNode;\n /** Enables a native SVG download link inside the rendered code. */\n download?: boolean | string;\n downloadLabel?: string;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n return (\n (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n );\n}\n\nfunction Finder({\n x,\n y,\n color,\n background,\n}: {\n x: number;\n y: number;\n color: string;\n background: string;\n}) {\n return (\n <g data-slot=\"qr-code-eye\">\n <rect data-slot=\"qr-code-eye-frame\" fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n <rect\n data-slot=\"qr-code-eye-cutout\"\n fill={background}\n height=\"5\"\n rx=\"0.75\"\n width=\"5\"\n x={x + 1}\n y={y + 1}\n />\n <rect\n data-slot=\"qr-code-eyeball\"\n fill={color}\n height=\"3\"\n rx=\"0.5\"\n width=\"3\"\n x={x + 2}\n y={y + 2}\n />\n </g>\n );\n}\n\nfunction escapeXml(value: string) {\n return value.replace(/[&<>'\"]/g, (character) => {\n const entities: Record<string, string> = {\n \"&\": \"&amp;\",\n \"<\": \"&lt;\",\n \">\": \"&gt;\",\n \"'\": \"&apos;\",\n '\"': \"&quot;\",\n };\n return entities[character] ?? character;\n });\n}\n\nfunction createDownloadSvg({\n background,\n dots,\n foreground,\n finderBackground,\n label,\n margin,\n moduleCount,\n}: {\n background: string;\n dots: readonly [number, number][];\n foreground: string;\n finderBackground: string;\n label: string;\n margin: number;\n moduleCount: number;\n}) {\n const viewBoxSize = moduleCount + margin * 2;\n const backgroundMarkup =\n background === \"transparent\"\n ? \"\"\n : `<rect fill=\"${escapeXml(background)}\" height=\"${viewBoxSize}\" width=\"${viewBoxSize}\" x=\"0\" y=\"0\"/>`;\n const dotsMarkup = dots\n .map(\n ([row, column]) =>\n `<circle cx=\"${margin + column + 0.5}\" cy=\"${margin + row + 0.5}\" fill=\"${escapeXml(foreground)}\" r=\"0.43\"/>`,\n )\n .join(\"\");\n const finderMarkup = (x: number, y: number) =>\n `<g><rect fill=\"${escapeXml(foreground)}\" height=\"7\" rx=\"1\" width=\"7\" x=\"${x}\" y=\"${y}\"/><rect fill=\"${escapeXml(finderBackground)}\" height=\"5\" rx=\"0.75\" width=\"5\" x=\"${x + 1}\" y=\"${y + 1}\"/><rect fill=\"${escapeXml(foreground)}\" height=\"3\" rx=\"0.5\" width=\"3\" x=\"${x + 2}\" y=\"${y + 2}\"/></g>`;\n\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-label=\"${escapeXml(label)}\" role=\"img\" viewBox=\"0 0 ${viewBoxSize} ${viewBoxSize}\">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n {\n // A QR code needs a deterministic high-contrast base. Inheriting\n // `currentColor` or a transparent surface can make finder layers merge\n // in dark scopes, so the defaults intentionally remain black on white.\n background = \"#ffffff\",\n className,\n download = false,\n downloadLabel = \"Download QR code\",\n errorCorrectionLevel = \"Q\",\n fallback,\n foreground = \"#18181b\",\n label = \"QR code\",\n margin = 2,\n size = 192,\n style,\n value,\n ...props\n },\n ref,\n) {\n const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n const finderBackground =\n background === \"transparent\" ? \"var(--jaci-colors-surface-raised)\" : background;\n\n try {\n const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n const moduleCount = code.modules.size;\n const viewBoxSize = moduleCount + safeMargin * 2;\n const modules: ReactNode[] = [];\n const dotCoordinates: [number, number][] = [];\n\n for (let row = 0; row < moduleCount; row += 1) {\n for (let column = 0; column < moduleCount; column += 1) {\n if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n dotCoordinates.push([row, column]);\n modules.push(\n <circle\n cx={safeMargin + column + 0.5}\n cy={safeMargin + row + 0.5}\n data-slot=\"qr-code-dot\"\n fill={foreground}\n key={`${row}-${column}`}\n r=\"0.43\"\n />,\n );\n }\n }\n }\n\n const downloadHref =\n download &&\n `data:image/svg+xml;charset=utf-8,${encodeURIComponent(\n createDownloadSvg({\n background,\n dots: dotCoordinates,\n foreground,\n finderBackground: background === \"transparent\" ? \"#ffffff\" : background,\n label,\n margin: safeMargin,\n moduleCount,\n }),\n )}`;\n const downloadFilename = typeof download === \"string\" ? download : \"qrcode.svg\";\n const visualCode = (\n <>\n {background !== \"transparent\" ? (\n <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n ) : null}\n {modules}\n <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin + moduleCount - 7}\n y={safeMargin}\n />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin}\n y={safeMargin + moduleCount - 7}\n />\n </>\n );\n\n const svg = (\n <svg\n {...props}\n ref={ref}\n aria-hidden={downloadHref ? true : undefined}\n aria-label={downloadHref ? undefined : label}\n className={cx(qrCode(), className)}\n data-dot-shape=\"circle\"\n data-download={download ? \"true\" : undefined}\n data-eye-shape=\"rounded-square\"\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n height={safeSize}\n role={downloadHref ? undefined : \"img\"}\n style={style}\n viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n width={safeSize}\n >\n <title>{label}</title>\n {visualCode}\n </svg>\n );\n\n return downloadHref ? (\n <a\n aria-label={downloadLabel}\n data-jaci-component=\"qr-code-download\"\n data-slot=\"qr-code-download\"\n download={downloadFilename}\n href={downloadHref}\n >\n {svg}\n </a>\n ) : (\n svg\n );\n } catch {\n return (\n <span\n aria-label={label}\n className={cx(qrCode(), className)}\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n data-status=\"error\"\n role=\"img\"\n >\n {fallback ?? \"Unable to generate QR code\"}\n </span>\n );\n }\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"qr-code.js","names":[],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps\n extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\" | \"download\"> {\n value: string;\n size?: number;\n margin?: number;\n errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n foreground?: string;\n background?: string;\n label?: string;\n fallback?: ReactNode;\n /** Enables a native SVG download link inside the rendered code. */\n download?: boolean | string;\n downloadLabel?: string;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n return (\n (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n );\n}\n\nfunction Finder({\n x,\n y,\n color,\n background,\n}: {\n x: number;\n y: number;\n color: string;\n background: string;\n}) {\n return (\n <g data-slot=\"qr-code-eye\">\n <rect data-slot=\"qr-code-eye-frame\" fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n <rect\n data-slot=\"qr-code-eye-cutout\"\n fill={background}\n height=\"5\"\n rx=\"0.75\"\n width=\"5\"\n x={x + 1}\n y={y + 1}\n />\n <rect\n data-slot=\"qr-code-eyeball\"\n fill={color}\n height=\"3\"\n rx=\"0.5\"\n width=\"3\"\n x={x + 2}\n y={y + 2}\n />\n </g>\n );\n}\n\nfunction escapeXml(value: string) {\n return value.replace(/[&<>'\"]/g, (character) => {\n const entities: Record<string, string> = {\n \"&\": \"&amp;\",\n \"<\": \"&lt;\",\n \">\": \"&gt;\",\n \"'\": \"&apos;\",\n '\"': \"&quot;\",\n };\n return entities[character] ?? character;\n });\n}\n\nfunction createDownloadSvg({\n background,\n dots,\n foreground,\n finderBackground,\n label,\n margin,\n moduleCount,\n}: {\n background: string;\n dots: readonly [number, number][];\n foreground: string;\n finderBackground: string;\n label: string;\n margin: number;\n moduleCount: number;\n}) {\n const viewBoxSize = moduleCount + margin * 2;\n const backgroundMarkup =\n background === \"transparent\"\n ? \"\"\n : `<rect fill=\"${escapeXml(background)}\" height=\"${viewBoxSize}\" width=\"${viewBoxSize}\" x=\"0\" y=\"0\"/>`;\n const dotsMarkup = dots\n .map(\n ([row, column]) =>\n `<circle cx=\"${margin + column + 0.5}\" cy=\"${margin + row + 0.5}\" fill=\"${escapeXml(foreground)}\" r=\"0.43\"/>`,\n )\n .join(\"\");\n const finderMarkup = (x: number, y: number) =>\n `<g><rect fill=\"${escapeXml(foreground)}\" height=\"7\" rx=\"1\" width=\"7\" x=\"${x}\" y=\"${y}\"/><rect fill=\"${escapeXml(finderBackground)}\" height=\"5\" rx=\"0.75\" width=\"5\" x=\"${x + 1}\" y=\"${y + 1}\"/><rect fill=\"${escapeXml(foreground)}\" height=\"3\" rx=\"0.5\" width=\"3\" x=\"${x + 2}\" y=\"${y + 2}\"/></g>`;\n\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-label=\"${escapeXml(label)}\" role=\"img\" viewBox=\"0 0 ${viewBoxSize} ${viewBoxSize}\">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n {\n // A QR code needs a deterministic high-contrast base. Inheriting\n // `currentColor` or a transparent surface can make finder layers merge\n // in dark scopes, so the defaults intentionally remain black on white.\n background = \"#ffffff\",\n className,\n download = false,\n downloadLabel = \"Download QR code\",\n errorCorrectionLevel = \"Q\",\n fallback,\n foreground = \"#18181b\",\n label = \"QR code\",\n margin = 2,\n size = 192,\n style,\n value,\n ...props\n },\n ref,\n) {\n const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n const finderBackground =\n background === \"transparent\" ? \"var(--jaci-colors-surface-raised)\" : background;\n\n try {\n const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n const moduleCount = code.modules.size;\n const viewBoxSize = moduleCount + safeMargin * 2;\n const modules: ReactNode[] = [];\n const dotCoordinates: [number, number][] = [];\n\n for (let row = 0; row < moduleCount; row += 1) {\n for (let column = 0; column < moduleCount; column += 1) {\n if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n dotCoordinates.push([row, column]);\n modules.push(\n <circle\n cx={safeMargin + column + 0.5}\n cy={safeMargin + row + 0.5}\n data-slot=\"qr-code-dot\"\n fill={foreground}\n key={`${row}-${column}`}\n r=\"0.43\"\n />,\n );\n }\n }\n }\n\n const downloadHref =\n download &&\n `data:image/svg+xml;charset=utf-8,${encodeURIComponent(\n createDownloadSvg({\n background,\n dots: dotCoordinates,\n foreground,\n finderBackground: background === \"transparent\" ? \"#ffffff\" : background,\n label,\n margin: safeMargin,\n moduleCount,\n }),\n )}`;\n const downloadFilename = typeof download === \"string\" ? download : \"qrcode.svg\";\n const visualCode = (\n <>\n {background !== \"transparent\" ? (\n <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n ) : null}\n {modules}\n <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin + moduleCount - 7}\n y={safeMargin}\n />\n <Finder\n background={finderBackground}\n color={foreground}\n x={safeMargin}\n y={safeMargin + moduleCount - 7}\n />\n </>\n );\n\n const svg = (\n <svg\n {...props}\n ref={ref}\n aria-hidden={downloadHref ? true : undefined}\n aria-label={downloadHref ? undefined : label}\n className={cx(qrCode(), className)}\n data-dot-shape=\"circle\"\n data-download={download ? \"true\" : undefined}\n data-eye-shape=\"rounded-square\"\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n height={safeSize}\n role={downloadHref ? undefined : \"img\"}\n style={style}\n viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n width={safeSize}\n >\n <title>{label}</title>\n {visualCode}\n </svg>\n );\n\n return downloadHref ? (\n <a\n aria-label={downloadLabel}\n data-jaci-component=\"qr-code-download\"\n data-slot=\"qr-code-download\"\n download={downloadFilename}\n href={downloadHref}\n >\n {svg}\n </a>\n ) : (\n svg\n );\n } catch {\n return (\n <span\n aria-label={label}\n className={cx(qrCode(), className)}\n data-jaci-component=\"qr-code\"\n data-slot=\"qr-code\"\n data-status=\"error\"\n role=\"img\"\n >\n {fallback ?? \"Unable to generate QR code\"}\n </span>\n );\n }\n});\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"quote.cjs","names":["cx","quote"],"sources":["../../../src/components/quote/quote.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { quote } from \"../../styled-system/recipes\";\n\nexport type QuoteVariant = \"default\" | \"accent\" | \"subtle\";\nexport type QuoteSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface QuoteProps extends ComponentPropsWithoutRef<\"blockquote\"> {\n /** Visual treatment for the quote surface and leading border. */\n variant?: QuoteVariant;\n /** Typography scale for the quoted content. */\n size?: QuoteSize;\n /** Optional author rendered in a semantic footer. */\n author?: ReactNode;\n /** Optional source rendered as a semantic `<cite>`. */\n source?: ReactNode;\n}\n\n/** A semantic blockquote with optional author and source attribution. */\nexport const Quote = forwardRef<HTMLQuoteElement, QuoteProps>(function Quote(\n { author, children, className, size = \"md\", source, variant = \"default\", ...props },\n ref,\n) {\n const hasAttribution = author !== undefined || source !== undefined;\n\n return (\n <blockquote\n {...props}\n ref={ref}\n className={cx(quote({ size, variant }), className)}\n data-jaci-component=\"quote\"\n data-size={size}\n data-slot=\"quote\"\n data-variant={variant}\n >\n <div data-slot=\"quote-content\">{children}</div>\n {hasAttribution ? (\n <footer data-slot=\"quote-footer\">\n {author !== undefined ? <span data-slot=\"quote-author\">{author}</span> : null}\n {source !== undefined ? <cite data-slot=\"quote-source\">{source}</cite> : null}\n </footer>\n ) : null}\n </blockquote>\n );\n});\n"],"mappings":";;;;;;AAqBA,MAAa,SAAA,GAAA,MAAA,WAAA,CAAiD,SAAS,MACrE,EAAE,QAAQ,UAAU,WAAW,OAAO,MAAM,QAAQ,UAAU,WAAW,GAAG,SAC5E,KACA;CACA,MAAM,iBAAiB,WAAW,KAAA,KAAa,WAAW,KAAA;CAE1D,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,cAAD;EACE,GAAI;EACC;EACL,WAAWA,WAAAA,GAAGC,cAAAA,MAAM;GAAE;GAAM;EAAQ,CAAC,GAAG,SAAS;EACjD,uBAAoB;EACpB,aAAW;EACX,aAAU;EACV,gBAAc;YAPhB,CASE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,aAAU;GAAiB;EAAc,CAAA,GAC7C,iBACC,iBAAA,GAAA,kBAAA,KAAA,CAAC,UAAD;GAAQ,aAAU;aAAlB,CACG,WAAW,KAAA,IAAY,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,aAAU;cAAgB;GAAa,CAAA,IAAI,MACxE,WAAW,KAAA,IAAY,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,aAAU;cAAgB;GAAa,CAAA,IAAI,IACnE;OACN,IACM;;AAEhB,CAAC"}
1
+ {"version":3,"file":"quote.cjs","names":["forwardRef","cx","quote"],"sources":["../../../src/components/quote/quote.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { quote } from \"../../styled-system/recipes\";\n\nexport type QuoteVariant = \"default\" | \"accent\" | \"subtle\";\nexport type QuoteSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface QuoteProps extends ComponentPropsWithoutRef<\"blockquote\"> {\n /** Visual treatment for the quote surface and leading border. */\n variant?: QuoteVariant;\n /** Typography scale for the quoted content. */\n size?: QuoteSize;\n /** Optional author rendered in a semantic footer. */\n author?: ReactNode;\n /** Optional source rendered as a semantic `<cite>`. */\n source?: ReactNode;\n}\n\n/** A semantic blockquote with optional author and source attribution. */\nexport const Quote = forwardRef<HTMLQuoteElement, QuoteProps>(function Quote(\n { author, children, className, size = \"md\", source, variant = \"default\", ...props },\n ref,\n) {\n const hasAttribution = author !== undefined || source !== undefined;\n\n return (\n <blockquote\n {...props}\n ref={ref}\n className={cx(quote({ size, variant }), className)}\n data-jaci-component=\"quote\"\n data-size={size}\n data-slot=\"quote\"\n data-variant={variant}\n >\n <div data-slot=\"quote-content\">{children}</div>\n {hasAttribution ? (\n <footer data-slot=\"quote-footer\">\n {author !== undefined ? <span data-slot=\"quote-author\">{author}</span> : null}\n {source !== undefined ? <cite data-slot=\"quote-source\">{source}</cite> : null}\n </footer>\n ) : null}\n </blockquote>\n );\n});\n"],"mappings":";;;;;;AAqBA,MAAa,SAAA,GAAQA,MAAAA,WAAAA,CAAyC,SAAS,MACrE,EAAE,QAAQ,UAAU,WAAW,OAAO,MAAM,QAAQ,UAAU,WAAW,GAAG,SAC5E,KACA;CACA,MAAM,iBAAiB,WAAW,KAAA,KAAa,WAAW,KAAA;CAE1D,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,cAAD;EACE,GAAI;EACC;EACL,WAAWC,WAAAA,GAAGC,cAAAA,MAAM;GAAE;GAAM;EAAQ,CAAC,GAAG,SAAS;EACjD,uBAAoB;EACpB,aAAW;EACX,aAAU;EACV,gBAAc;EAPhB,UAAA,CASE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,aAAU;GAAiB;EAAc,CAAA,GAC7C,iBACC,iBAAA,GAAA,kBAAA,KAAA,CAAC,UAAD;GAAQ,aAAU;GAAlB,UAAA,CACG,WAAW,KAAA,IAAY,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,aAAU;IAAgB,UAAA;GAAa,CAAA,IAAI,MACxE,WAAW,KAAA,IAAY,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,aAAU;IAAgB,UAAA;GAAa,CAAA,IAAI,IACnE;EACN,CAAA,IAAA,IACM;;AAEhB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"quote.js","names":[],"sources":["../../../src/components/quote/quote.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { quote } from \"../../styled-system/recipes\";\n\nexport type QuoteVariant = \"default\" | \"accent\" | \"subtle\";\nexport type QuoteSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface QuoteProps extends ComponentPropsWithoutRef<\"blockquote\"> {\n /** Visual treatment for the quote surface and leading border. */\n variant?: QuoteVariant;\n /** Typography scale for the quoted content. */\n size?: QuoteSize;\n /** Optional author rendered in a semantic footer. */\n author?: ReactNode;\n /** Optional source rendered as a semantic `<cite>`. */\n source?: ReactNode;\n}\n\n/** A semantic blockquote with optional author and source attribution. */\nexport const Quote = forwardRef<HTMLQuoteElement, QuoteProps>(function Quote(\n { author, children, className, size = \"md\", source, variant = \"default\", ...props },\n ref,\n) {\n const hasAttribution = author !== undefined || source !== undefined;\n\n return (\n <blockquote\n {...props}\n ref={ref}\n className={cx(quote({ size, variant }), className)}\n data-jaci-component=\"quote\"\n data-size={size}\n data-slot=\"quote\"\n data-variant={variant}\n >\n <div data-slot=\"quote-content\">{children}</div>\n {hasAttribution ? (\n <footer data-slot=\"quote-footer\">\n {author !== undefined ? <span data-slot=\"quote-author\">{author}</span> : null}\n {source !== undefined ? <cite data-slot=\"quote-source\">{source}</cite> : null}\n </footer>\n ) : null}\n </blockquote>\n );\n});\n"],"mappings":";;;;;;AAqBA,MAAa,QAAQ,WAAyC,SAAS,MACrE,EAAE,QAAQ,UAAU,WAAW,OAAO,MAAM,QAAQ,UAAU,WAAW,GAAG,SAC5E,KACA;CACA,MAAM,iBAAiB,WAAW,KAAA,KAAa,WAAW,KAAA;CAE1D,OACE,qBAAC,cAAD;EACE,GAAI;EACC;EACL,WAAW,GAAG,MAAM;GAAE;GAAM;EAAQ,CAAC,GAAG,SAAS;EACjD,uBAAoB;EACpB,aAAW;EACX,aAAU;EACV,gBAAc;YAPhB,CASE,oBAAC,OAAD;GAAK,aAAU;GAAiB;EAAc,CAAA,GAC7C,iBACC,qBAAC,UAAD;GAAQ,aAAU;aAAlB,CACG,WAAW,KAAA,IAAY,oBAAC,QAAD;IAAM,aAAU;cAAgB;GAAa,CAAA,IAAI,MACxE,WAAW,KAAA,IAAY,oBAAC,QAAD;IAAM,aAAU;cAAgB;GAAa,CAAA,IAAI,IACnE;OACN,IACM;;AAEhB,CAAC"}
1
+ {"version":3,"file":"quote.js","names":[],"sources":["../../../src/components/quote/quote.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { quote } from \"../../styled-system/recipes\";\n\nexport type QuoteVariant = \"default\" | \"accent\" | \"subtle\";\nexport type QuoteSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface QuoteProps extends ComponentPropsWithoutRef<\"blockquote\"> {\n /** Visual treatment for the quote surface and leading border. */\n variant?: QuoteVariant;\n /** Typography scale for the quoted content. */\n size?: QuoteSize;\n /** Optional author rendered in a semantic footer. */\n author?: ReactNode;\n /** Optional source rendered as a semantic `<cite>`. */\n source?: ReactNode;\n}\n\n/** A semantic blockquote with optional author and source attribution. */\nexport const Quote = forwardRef<HTMLQuoteElement, QuoteProps>(function Quote(\n { author, children, className, size = \"md\", source, variant = \"default\", ...props },\n ref,\n) {\n const hasAttribution = author !== undefined || source !== undefined;\n\n return (\n <blockquote\n {...props}\n ref={ref}\n className={cx(quote({ size, variant }), className)}\n data-jaci-component=\"quote\"\n data-size={size}\n data-slot=\"quote\"\n data-variant={variant}\n >\n <div data-slot=\"quote-content\">{children}</div>\n {hasAttribution ? (\n <footer data-slot=\"quote-footer\">\n {author !== undefined ? <span data-slot=\"quote-author\">{author}</span> : null}\n {source !== undefined ? <cite data-slot=\"quote-source\">{source}</cite> : null}\n </footer>\n ) : null}\n </blockquote>\n );\n});\n"],"mappings":";;;;;;AAqBA,MAAa,QAAQ,WAAyC,SAAS,MACrE,EAAE,QAAQ,UAAU,WAAW,OAAO,MAAM,QAAQ,UAAU,WAAW,GAAG,SAC5E,KACA;CACA,MAAM,iBAAiB,WAAW,KAAA,KAAa,WAAW,KAAA;CAE1D,OACE,qBAAC,cAAD;EACE,GAAI;EACC;EACL,WAAW,GAAG,MAAM;GAAE;GAAM;EAAQ,CAAC,GAAG,SAAS;EACjD,uBAAoB;EACpB,aAAW;EACX,aAAU;EACV,gBAAc;EAPhB,UAAA,CASE,oBAAC,OAAD;GAAK,aAAU;GAAiB;EAAc,CAAA,GAC7C,iBACC,qBAAC,UAAD;GAAQ,aAAU;GAAlB,UAAA,CACG,WAAW,KAAA,IAAY,oBAAC,QAAD;IAAM,aAAU;IAAgB,UAAA;GAAa,CAAA,IAAI,MACxE,WAAW,KAAA,IAAY,oBAAC,QAAD;IAAM,aAAU;IAAgB,UAAA;GAAa,CAAA,IAAI,IACnE;EACN,CAAA,IAAA,IACM;;AAEhB,CAAC"}
@@ -15,11 +15,15 @@ let _base_ui_react_radio = require("@base-ui/react/radio");
15
15
  * without an additional form library.
16
16
  */
17
17
  function RadioGroupRoot({ children, className, errors, invalid, name, ...props }) {
18
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_field.Field, {
19
- className: require_cx.cx(require_radio_group.radioGroup().root, className),
18
+ const styles = require_radio_group.radioGroup();
19
+ const fieldProps = {
20
+ className: require_cx.cx(styles.root, className),
20
21
  ...errors === void 0 ? {} : { errors },
21
22
  ...invalid === void 0 ? {} : { invalid },
22
- ...name === void 0 ? {} : { name },
23
+ ...name === void 0 ? {} : { name }
24
+ };
25
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_field.Field, {
26
+ ...fieldProps,
23
27
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_radio_group.RadioGroup, {
24
28
  ...props,
25
29
  ...name === void 0 ? {} : { name },
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.cjs","names":["Field","cx","radioGroup","BaseRadioGroup","BaseField","withRecipeClassName","BaseRadio"],"sources":["../../../src/components/radio-group/radio-group.tsx"],"sourcesContent":["\"use client\";\n\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\nimport { Field as BaseField } from \"@base-ui/react/field\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport type { RadioGroup as BaseRadioGroupType } from \"@base-ui/react/radio-group\";\nimport type { RadioRoot as BaseRadioRoot } from \"@base-ui/react/radio\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { radioGroup } from \"../../styled-system/recipes\";\nimport { Field } from \"../field\";\nimport { withRecipeClassName } from \"../base-ui\";\n\nexport interface RadioGroupRootProps<Value = string>\n extends Omit<BaseRadioGroupType.Props<Value>, \"children\" | \"className\"> {\n /** Marks the group invalid when an external validator owns its state. */\n invalid?: boolean;\n /** Direct error content rendered through the surrounding Field context. */\n errors?: ReactNode | ReactNode[];\n children?: ReactNode;\n className?: string;\n}\n\n/**\n * A typed, accessible radio group. The hidden native input is registered with\n * Jaci Form/Base UI, so `required`, `name`, errors and SSR form submission work\n * without an additional form library.\n */\nexport function RadioGroupRoot<Value = string>({\n children,\n className,\n errors,\n invalid,\n name,\n ...props\n}: RadioGroupRootProps<Value>) {\n const styles = radioGroup();\n const fieldProps = {\n className: cx(styles.root, className),\n ...(errors === undefined ? {} : { errors }),\n ...(invalid === undefined ? {} : { invalid }),\n ...(name === undefined ? {} : { name }),\n };\n\n return (\n <Field {...fieldProps}>\n <BaseRadioGroup {...props} {...(name === undefined ? {} : { name })}>\n {children}\n </BaseRadioGroup>\n </Field>\n );\n}\n\nexport type RadioGroupLabelProps = ComponentPropsWithoutRef<typeof BaseField.Label>;\n\nexport const RadioGroupLabel = forwardRef<HTMLElement, RadioGroupLabelProps>(\n function RadioGroupLabel({ className, ...props }, ref) {\n return (\n <BaseField.Label\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().label, className)}\n data-slot=\"radio-group-label\"\n />\n );\n },\n);\n\nexport type RadioGroupOptionProps = ComponentPropsWithoutRef<\"label\">;\n\nexport const RadioGroupOption = forwardRef<HTMLLabelElement, RadioGroupOptionProps>(\n function RadioGroupOption({ children, className, htmlFor, ...props }, ref) {\n return (\n <label\n {...props}\n ref={ref}\n className={cx(radioGroup().option, className)}\n data-slot=\"radio-group-option\"\n htmlFor={htmlFor}\n >\n {children}\n </label>\n );\n },\n);\n\nexport type RadioGroupOptionsProps = ComponentPropsWithoutRef<\"div\">;\n\nexport const RadioGroupOptions = forwardRef<HTMLDivElement, RadioGroupOptionsProps>(\n function RadioGroupOptions({ className, ...props }, ref) {\n return (\n <div\n {...props}\n ref={ref}\n className={cx(radioGroup().options, className)}\n data-slot=\"radio-group-options\"\n />\n );\n },\n);\n\nexport type RadioGroupItemProps<Value = string> = BaseRadioRoot.Props<Value>;\n\nexport const RadioGroupItem = forwardRef<HTMLSpanElement, RadioGroupItemProps>(\n function RadioGroupItem({ className, ...props }, ref) {\n return (\n <BaseRadio.Root\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().radio, className)}\n data-slot=\"radio-group-item\"\n />\n );\n },\n);\n\nexport type RadioGroupIndicatorProps = ComponentPropsWithoutRef<typeof BaseRadio.Indicator>;\n\nexport const RadioGroupIndicator = forwardRef<HTMLSpanElement, RadioGroupIndicatorProps>(\n function RadioGroupIndicator({ children, className, ...props }, ref) {\n return (\n <BaseRadio.Indicator\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().indicator, className)}\n data-slot=\"radio-group-indicator\"\n >\n {children}\n </BaseRadio.Indicator>\n );\n },\n);\n\nexport const RadioGroup = {\n Root: RadioGroupRoot,\n Label: RadioGroupLabel,\n Options: RadioGroupOptions,\n Option: RadioGroupOption,\n Item: RadioGroupItem,\n Indicator: RadioGroupIndicator,\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,SAAgB,eAA+B,EAC7C,UACA,WACA,QACA,SACA,MACA,GAAG,SAC0B;CAS7B,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,cAAAA,OAAD;EAPA,WAAWC,WAAAA,GAFEC,oBAAAA,WAEM,CAAC,CAAC,MAAM,SAAS;EACpC,GAAI,WAAW,KAAA,IAAY,CAAC,IAAI,EAAE,OAAO;EACzC,GAAI,YAAY,KAAA,IAAY,CAAC,IAAI,EAAE,QAAQ;EAC3C,GAAI,SAAS,KAAA,IAAY,CAAC,IAAI,EAAE,KAAK;YAKnC,iBAAA,GAAA,kBAAA,IAAA,CAACC,2BAAAA,YAAD;GAAgB,GAAI;GAAO,GAAK,SAAS,KAAA,IAAY,CAAC,IAAI,EAAE,KAAK;GAC9D;EACa,CAAA;CACX,CAAA;AAEX;AAIA,MAAa,mBAAA,GAAA,MAAA,WAAA,CACX,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAS,KAAK;CACrD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,qBAAAA,MAAU,OAAX;EACE,GAAI;EACC;EACL,WAAWC,gBAAAA,oBAAoBH,oBAAAA,WAAW,CAAC,CAAC,OAAO,SAAS;EAC5D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,oBAAA,GAAA,MAAA,WAAA,CACX,SAAS,iBAAiB,EAAE,UAAU,WAAW,SAAS,GAAG,SAAS,KAAK;CACzE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;EACE,GAAI;EACC;EACL,WAAWD,WAAAA,GAAGC,oBAAAA,WAAW,CAAC,CAAC,QAAQ,SAAS;EAC5C,aAAU;EACD;EAER;CACI,CAAA;AAEX,CACF;AAIA,MAAa,qBAAA,GAAA,MAAA,WAAA,CACX,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,GAAI;EACC;EACL,WAAWD,WAAAA,GAAGC,oBAAAA,WAAW,CAAC,CAAC,SAAS,SAAS;EAC7C,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,kBAAA,GAAA,MAAA,WAAA,CACX,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACI,qBAAAA,MAAU,MAAX;EACE,GAAI;EACC;EACL,WAAWD,gBAAAA,oBAAoBH,oBAAAA,WAAW,CAAC,CAAC,OAAO,SAAS;EAC5D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,uBAAA,GAAA,MAAA,WAAA,CACX,SAAS,oBAAoB,EAAE,UAAU,WAAW,GAAG,SAAS,KAAK;CACnE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACI,qBAAAA,MAAU,WAAX;EACE,GAAI;EACC;EACL,WAAWD,gBAAAA,oBAAoBH,oBAAAA,WAAW,CAAC,CAAC,WAAW,SAAS;EAChE,aAAU;EAET;CACkB,CAAA;AAEzB,CACF;AAEA,MAAa,aAAa;CACxB,MAAM;CACN,OAAO;CACP,SAAS;CACT,QAAQ;CACR,MAAM;CACN,WAAW;AACb"}
1
+ {"version":3,"file":"radio-group.cjs","names":["radioGroup","cx","Field","BaseRadioGroup","forwardRef","BaseField","withRecipeClassName","BaseRadio"],"sources":["../../../src/components/radio-group/radio-group.tsx"],"sourcesContent":["\"use client\";\n\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\nimport { Field as BaseField } from \"@base-ui/react/field\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport type { RadioGroup as BaseRadioGroupType } from \"@base-ui/react/radio-group\";\nimport type { RadioRoot as BaseRadioRoot } from \"@base-ui/react/radio\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { radioGroup } from \"../../styled-system/recipes\";\nimport { Field } from \"../field\";\nimport { withRecipeClassName } from \"../base-ui\";\n\nexport interface RadioGroupRootProps<Value = string>\n extends Omit<BaseRadioGroupType.Props<Value>, \"children\" | \"className\"> {\n /** Marks the group invalid when an external validator owns its state. */\n invalid?: boolean;\n /** Direct error content rendered through the surrounding Field context. */\n errors?: ReactNode | ReactNode[];\n children?: ReactNode;\n className?: string;\n}\n\n/**\n * A typed, accessible radio group. The hidden native input is registered with\n * Jaci Form/Base UI, so `required`, `name`, errors and SSR form submission work\n * without an additional form library.\n */\nexport function RadioGroupRoot<Value = string>({\n children,\n className,\n errors,\n invalid,\n name,\n ...props\n}: RadioGroupRootProps<Value>) {\n const styles = radioGroup();\n const fieldProps = {\n className: cx(styles.root, className),\n ...(errors === undefined ? {} : { errors }),\n ...(invalid === undefined ? {} : { invalid }),\n ...(name === undefined ? {} : { name }),\n };\n\n return (\n <Field {...fieldProps}>\n <BaseRadioGroup {...props} {...(name === undefined ? {} : { name })}>\n {children}\n </BaseRadioGroup>\n </Field>\n );\n}\n\nexport type RadioGroupLabelProps = ComponentPropsWithoutRef<typeof BaseField.Label>;\n\nexport const RadioGroupLabel = forwardRef<HTMLElement, RadioGroupLabelProps>(\n function RadioGroupLabel({ className, ...props }, ref) {\n return (\n <BaseField.Label\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().label, className)}\n data-slot=\"radio-group-label\"\n />\n );\n },\n);\n\nexport type RadioGroupOptionProps = ComponentPropsWithoutRef<\"label\">;\n\nexport const RadioGroupOption = forwardRef<HTMLLabelElement, RadioGroupOptionProps>(\n function RadioGroupOption({ children, className, htmlFor, ...props }, ref) {\n return (\n <label\n {...props}\n ref={ref}\n className={cx(radioGroup().option, className)}\n data-slot=\"radio-group-option\"\n htmlFor={htmlFor}\n >\n {children}\n </label>\n );\n },\n);\n\nexport type RadioGroupOptionsProps = ComponentPropsWithoutRef<\"div\">;\n\nexport const RadioGroupOptions = forwardRef<HTMLDivElement, RadioGroupOptionsProps>(\n function RadioGroupOptions({ className, ...props }, ref) {\n return (\n <div\n {...props}\n ref={ref}\n className={cx(radioGroup().options, className)}\n data-slot=\"radio-group-options\"\n />\n );\n },\n);\n\nexport type RadioGroupItemProps<Value = string> = BaseRadioRoot.Props<Value>;\n\nexport const RadioGroupItem = forwardRef<HTMLSpanElement, RadioGroupItemProps>(\n function RadioGroupItem({ className, ...props }, ref) {\n return (\n <BaseRadio.Root\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().radio, className)}\n data-slot=\"radio-group-item\"\n />\n );\n },\n);\n\nexport type RadioGroupIndicatorProps = ComponentPropsWithoutRef<typeof BaseRadio.Indicator>;\n\nexport const RadioGroupIndicator = forwardRef<HTMLSpanElement, RadioGroupIndicatorProps>(\n function RadioGroupIndicator({ children, className, ...props }, ref) {\n return (\n <BaseRadio.Indicator\n {...props}\n ref={ref}\n className={withRecipeClassName(radioGroup().indicator, className)}\n data-slot=\"radio-group-indicator\"\n >\n {children}\n </BaseRadio.Indicator>\n );\n },\n);\n\nexport const RadioGroup = {\n Root: RadioGroupRoot,\n Label: RadioGroupLabel,\n Options: RadioGroupOptions,\n Option: RadioGroupOption,\n Item: RadioGroupItem,\n Indicator: RadioGroupIndicator,\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,SAAgB,eAA+B,EAC7C,UACA,WACA,QACA,SACA,MACA,GAAG,SAC0B;CAC7B,MAAM,SAASA,oBAAAA,WAAW;CAC1B,MAAM,aAAa;EACjB,WAAWC,WAAAA,GAAG,OAAO,MAAM,SAAS;EACpC,GAAI,WAAW,KAAA,IAAY,CAAC,IAAI,EAAE,OAAO;EACzC,GAAI,YAAY,KAAA,IAAY,CAAC,IAAI,EAAE,QAAQ;EAC3C,GAAI,SAAS,KAAA,IAAY,CAAC,IAAI,EAAE,KAAK;CACvC;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,cAAAA,OAAD;EAAO,GAAI;EACT,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,2BAAAA,YAAD;GAAgB,GAAI;GAAO,GAAK,SAAS,KAAA,IAAY,CAAC,IAAI,EAAE,KAAK;GAC9D;EACa,CAAA;CACX,CAAA;AAEX;AAIA,MAAa,mBAAA,GAAkBC,MAAAA,WAAAA,CAC7B,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAS,KAAK;CACrD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,qBAAAA,MAAU,OAAX;EACE,GAAI;EACC;EACL,WAAWC,gBAAAA,oBAAoBN,oBAAAA,WAAW,CAAC,CAAC,OAAO,SAAS;EAC5D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,oBAAA,GAAmBI,MAAAA,WAAAA,CAC9B,SAAS,iBAAiB,EAAE,UAAU,WAAW,SAAS,GAAG,SAAS,KAAK;CACzE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;EACE,GAAI;EACC;EACL,WAAWH,WAAAA,GAAGD,oBAAAA,WAAW,CAAC,CAAC,QAAQ,SAAS;EAC5C,aAAU;EACD;EAER;CACI,CAAA;AAEX,CACF;AAIA,MAAa,qBAAA,GAAoBI,MAAAA,WAAAA,CAC/B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,GAAI;EACC;EACL,WAAWH,WAAAA,GAAGD,oBAAAA,WAAW,CAAC,CAAC,SAAS,SAAS;EAC7C,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,kBAAA,GAAiBI,MAAAA,WAAAA,CAC5B,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACG,qBAAAA,MAAU,MAAX;EACE,GAAI;EACC;EACL,WAAWD,gBAAAA,oBAAoBN,oBAAAA,WAAW,CAAC,CAAC,OAAO,SAAS;EAC5D,aAAU;CACX,CAAA;AAEL,CACF;AAIA,MAAa,uBAAA,GAAsBI,MAAAA,WAAAA,CACjC,SAAS,oBAAoB,EAAE,UAAU,WAAW,GAAG,SAAS,KAAK;CACnE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACG,qBAAAA,MAAU,WAAX;EACE,GAAI;EACC;EACL,WAAWD,gBAAAA,oBAAoBN,oBAAAA,WAAW,CAAC,CAAC,WAAW,SAAS;EAChE,aAAU;EAET;CACkB,CAAA;AAEzB,CACF;AAEA,MAAa,aAAa;CACxB,MAAM;CACN,OAAO;CACP,SAAS;CACT,QAAQ;CACR,MAAM;CACN,WAAW;AACb"}
@@ -15,11 +15,15 @@ import { Radio } from "@base-ui/react/radio";
15
15
  * without an additional form library.
16
16
  */
17
17
  function RadioGroupRoot({ children, className, errors, invalid, name, ...props }) {
18
- return /* @__PURE__ */ jsx(Field$1, {
19
- className: cx(radioGroup().root, className),
18
+ const styles = radioGroup();
19
+ const fieldProps = {
20
+ className: cx(styles.root, className),
20
21
  ...errors === void 0 ? {} : { errors },
21
22
  ...invalid === void 0 ? {} : { invalid },
22
- ...name === void 0 ? {} : { name },
23
+ ...name === void 0 ? {} : { name }
24
+ };
25
+ return /* @__PURE__ */ jsx(Field$1, {
26
+ ...fieldProps,
23
27
  children: /* @__PURE__ */ jsx(RadioGroup, {
24
28
  ...props,
25
29
  ...name === void 0 ? {} : { name },