@chayns-ui/core 0.9.4 → 0.11.0

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 (215) hide show
  1. package/dist/accordion.css +3 -1
  2. package/dist/badge.css +28 -3
  3. package/dist/banner.css +2 -0
  4. package/dist/breadcrumb.css +63 -0
  5. package/dist/button.css +103 -35
  6. package/dist/card.css +42 -1
  7. package/dist/checkbox.css +3 -3
  8. package/dist/combo-box.css +2 -0
  9. package/dist/components/accordion/Accordion.d.ts +3 -4
  10. package/dist/components/accordion/Accordion.d.ts.map +1 -1
  11. package/dist/components/accordion/Accordion.js +43 -26
  12. package/dist/components/accordion/Accordion.js.map +1 -1
  13. package/dist/components/accordion/Accordion.types.d.ts +11 -3
  14. package/dist/components/accordion/Accordion.types.d.ts.map +1 -1
  15. package/dist/components/accordion/Accordion.types.js +7 -1
  16. package/dist/components/accordion/Accordion.types.js.map +1 -1
  17. package/dist/components/accordion/AccordionContext.d.ts +3 -0
  18. package/dist/components/accordion/AccordionContext.d.ts.map +1 -1
  19. package/dist/components/accordion/AccordionContext.js.map +1 -1
  20. package/dist/components/accordion-group/AccordionGroup.d.ts.map +1 -1
  21. package/dist/components/accordion-group/AccordionGroup.js +1 -0
  22. package/dist/components/accordion-group/AccordionGroup.js.map +1 -1
  23. package/dist/components/avatar/Avatar.d.ts.map +1 -1
  24. package/dist/components/avatar/Avatar.js +1 -0
  25. package/dist/components/avatar/Avatar.js.map +1 -1
  26. package/dist/components/avatar/Avatar.types.d.ts +9 -1
  27. package/dist/components/avatar/Avatar.types.d.ts.map +1 -1
  28. package/dist/components/avatar/Avatar.types.js +17 -0
  29. package/dist/components/avatar/Avatar.types.js.map +1 -0
  30. package/dist/components/avatar-group/AvatarGroup.d.ts.map +1 -1
  31. package/dist/components/avatar-group/AvatarGroup.js +4 -3
  32. package/dist/components/avatar-group/AvatarGroup.js.map +1 -1
  33. package/dist/components/badge/Badge.d.ts.map +1 -1
  34. package/dist/components/badge/Badge.js +1 -0
  35. package/dist/components/badge/Badge.js.map +1 -1
  36. package/dist/components/badge/Badge.types.d.ts +13 -0
  37. package/dist/components/badge/Badge.types.d.ts.map +1 -1
  38. package/dist/components/badge/Badge.types.js +16 -1
  39. package/dist/components/badge/Badge.types.js.map +1 -1
  40. package/dist/components/banner/Banner.d.ts.map +1 -1
  41. package/dist/components/banner/Banner.js +1 -0
  42. package/dist/components/banner/Banner.js.map +1 -1
  43. package/dist/components/banner/Banner.types.d.ts +7 -0
  44. package/dist/components/banner/Banner.types.d.ts.map +1 -1
  45. package/dist/components/banner/Banner.types.js +9 -1
  46. package/dist/components/banner/Banner.types.js.map +1 -1
  47. package/dist/components/breadcrumb/Breadcrumb.d.ts +4 -0
  48. package/dist/components/breadcrumb/Breadcrumb.d.ts.map +1 -0
  49. package/dist/components/breadcrumb/Breadcrumb.js +35 -0
  50. package/dist/components/breadcrumb/Breadcrumb.js.map +1 -0
  51. package/dist/components/breadcrumb/Breadcrumb.types.d.ts +13 -0
  52. package/dist/components/breadcrumb/Breadcrumb.types.d.ts.map +1 -0
  53. package/dist/components/button/Button.d.ts.map +1 -1
  54. package/dist/components/button/Button.js +1 -0
  55. package/dist/components/button/Button.js.map +1 -1
  56. package/dist/components/button/Button.types.d.ts +7 -0
  57. package/dist/components/button/Button.types.d.ts.map +1 -1
  58. package/dist/components/button/Button.types.js +9 -1
  59. package/dist/components/button/Button.types.js.map +1 -1
  60. package/dist/components/button/button-icon/ButtonIcon.d.ts.map +1 -1
  61. package/dist/components/button/button-icon/ButtonIcon.js +7 -3
  62. package/dist/components/button/button-icon/ButtonIcon.js.map +1 -1
  63. package/dist/components/card/Card.d.ts.map +1 -1
  64. package/dist/components/card/Card.js +8 -2
  65. package/dist/components/card/Card.js.map +1 -1
  66. package/dist/components/card/Card.types.d.ts +5 -0
  67. package/dist/components/card/Card.types.d.ts.map +1 -1
  68. package/dist/components/checkbox/Checkbox.d.ts.map +1 -1
  69. package/dist/components/checkbox/Checkbox.js +1 -0
  70. package/dist/components/checkbox/Checkbox.js.map +1 -1
  71. package/dist/components/combo-box/ComboBox.d.ts.map +1 -1
  72. package/dist/components/combo-box/ComboBox.js +27 -8
  73. package/dist/components/combo-box/ComboBox.js.map +1 -1
  74. package/dist/components/date-time-picker/DateTimePicker.d.ts.map +1 -1
  75. package/dist/components/date-time-picker/DateTimePicker.js +63 -243
  76. package/dist/components/date-time-picker/DateTimePicker.js.map +1 -1
  77. package/dist/components/date-time-picker/DateTimePicker.types.d.ts +12 -0
  78. package/dist/components/date-time-picker/DateTimePicker.types.d.ts.map +1 -1
  79. package/dist/components/date-time-picker/DateTimePicker.types.js +15 -1
  80. package/dist/components/date-time-picker/DateTimePicker.types.js.map +1 -1
  81. package/dist/components/date-time-picker/date-time-picker-utils.d.ts +4 -0
  82. package/dist/components/date-time-picker/date-time-picker-utils.d.ts.map +1 -0
  83. package/dist/components/date-time-picker/date-time-picker-utils.js +19 -0
  84. package/dist/components/date-time-picker/date-time-picker-utils.js.map +1 -0
  85. package/dist/components/date-time-picker/hooks/useDateTimePickerValue.d.ts +37 -0
  86. package/dist/components/date-time-picker/hooks/useDateTimePickerValue.d.ts.map +1 -0
  87. package/dist/components/date-time-picker/hooks/useDateTimePickerValue.js +175 -0
  88. package/dist/components/date-time-picker/hooks/useDateTimePickerValue.js.map +1 -0
  89. package/dist/components/date-time-picker/sizer/PickerSizer.d.ts +7 -0
  90. package/dist/components/date-time-picker/sizer/PickerSizer.d.ts.map +1 -0
  91. package/dist/components/date-time-picker/sizer/PickerSizer.js +15 -0
  92. package/dist/components/date-time-picker/sizer/PickerSizer.js.map +1 -0
  93. package/dist/components/date-time-picker/wheel/Wheel.d.ts +14 -0
  94. package/dist/components/date-time-picker/wheel/Wheel.d.ts.map +1 -0
  95. package/dist/components/date-time-picker/wheel/Wheel.js +143 -0
  96. package/dist/components/date-time-picker/wheel/Wheel.js.map +1 -0
  97. package/dist/components/icon-button/IconButton.d.ts.map +1 -1
  98. package/dist/components/icon-button/IconButton.js +1 -0
  99. package/dist/components/icon-button/IconButton.js.map +1 -1
  100. package/dist/components/list/List.d.ts +15 -10
  101. package/dist/components/list/List.d.ts.map +1 -1
  102. package/dist/components/list/List.js +19 -7
  103. package/dist/components/list/List.js.map +1 -1
  104. package/dist/components/list/List.types.d.ts +2 -2
  105. package/dist/components/list/List.types.d.ts.map +1 -1
  106. package/dist/components/pagination/Pagination.d.ts +4 -0
  107. package/dist/components/pagination/Pagination.d.ts.map +1 -0
  108. package/dist/components/pagination/Pagination.js +57 -0
  109. package/dist/components/pagination/Pagination.js.map +1 -0
  110. package/dist/components/pagination/Pagination.types.d.ts +15 -0
  111. package/dist/components/pagination/Pagination.types.d.ts.map +1 -0
  112. package/dist/components/pagination/pagination-pages.d.ts +2 -0
  113. package/dist/components/pagination/pagination-pages.d.ts.map +1 -0
  114. package/dist/components/pagination/pagination-pages.js +35 -0
  115. package/dist/components/pagination/pagination-pages.js.map +1 -0
  116. package/dist/components/popup/Popup.d.ts +4 -1
  117. package/dist/components/popup/Popup.d.ts.map +1 -1
  118. package/dist/components/popup/Popup.js +25 -18
  119. package/dist/components/popup/Popup.js.map +1 -1
  120. package/dist/components/popup/PopupList.d.ts +4 -1
  121. package/dist/components/popup/PopupList.d.ts.map +1 -1
  122. package/dist/components/popup/PopupList.js +7 -1
  123. package/dist/components/popup/PopupList.js.map +1 -1
  124. package/dist/components/progress/Progress.d.ts.map +1 -1
  125. package/dist/components/progress/Progress.js +1 -0
  126. package/dist/components/progress/Progress.js.map +1 -1
  127. package/dist/components/progress/Progress.types.d.ts +1 -1
  128. package/dist/components/progress/Progress.types.d.ts.map +1 -1
  129. package/dist/components/radio-group/RadioGroup.d.ts.map +1 -1
  130. package/dist/components/radio-group/RadioGroup.js +2 -0
  131. package/dist/components/radio-group/RadioGroup.js.map +1 -1
  132. package/dist/components/segmented-control/SegmentedControl.d.ts.map +1 -1
  133. package/dist/components/segmented-control/SegmentedControl.js +78 -25
  134. package/dist/components/segmented-control/SegmentedControl.js.map +1 -1
  135. package/dist/components/segmented-control/SegmentedControl.types.d.ts +1 -1
  136. package/dist/components/segmented-control/SegmentedControl.types.d.ts.map +1 -1
  137. package/dist/components/segmented-control/SegmentedControlContext.d.ts +2 -0
  138. package/dist/components/segmented-control/SegmentedControlContext.d.ts.map +1 -1
  139. package/dist/components/segmented-control/SegmentedControlContext.js.map +1 -1
  140. package/dist/components/skeleton/Skeleton.d.ts.map +1 -1
  141. package/dist/components/skeleton/Skeleton.js +1 -0
  142. package/dist/components/skeleton/Skeleton.js.map +1 -1
  143. package/dist/components/skeleton/Skeleton.types.d.ts +6 -0
  144. package/dist/components/skeleton/Skeleton.types.d.ts.map +1 -1
  145. package/dist/components/skeleton/Skeleton.types.js +8 -1
  146. package/dist/components/skeleton/Skeleton.types.js.map +1 -1
  147. package/dist/components/slider/Slider.d.ts +4 -0
  148. package/dist/components/slider/Slider.d.ts.map +1 -0
  149. package/dist/components/slider/Slider.js +61 -0
  150. package/dist/components/slider/Slider.js.map +1 -0
  151. package/dist/components/slider/Slider.types.d.ts +10 -0
  152. package/dist/components/slider/Slider.types.d.ts.map +1 -0
  153. package/dist/components/spinner/Spinner.d.ts.map +1 -1
  154. package/dist/components/spinner/Spinner.js +1 -0
  155. package/dist/components/spinner/Spinner.js.map +1 -1
  156. package/dist/components/split-button/SplitButton.d.ts.map +1 -1
  157. package/dist/components/split-button/SplitButton.js +2 -1
  158. package/dist/components/split-button/SplitButton.js.map +1 -1
  159. package/dist/components/stepper/Stepper.d.ts +4 -0
  160. package/dist/components/stepper/Stepper.d.ts.map +1 -0
  161. package/dist/components/stepper/Stepper.js +60 -0
  162. package/dist/components/stepper/Stepper.js.map +1 -0
  163. package/dist/components/stepper/Stepper.types.d.ts +27 -0
  164. package/dist/components/stepper/Stepper.types.d.ts.map +1 -0
  165. package/dist/components/stepper/Stepper.types.js +25 -0
  166. package/dist/components/stepper/Stepper.types.js.map +1 -0
  167. package/dist/components/stepper/stepper-values.d.ts +6 -0
  168. package/dist/components/stepper/stepper-values.d.ts.map +1 -0
  169. package/dist/components/stepper/stepper-values.js +26 -0
  170. package/dist/components/stepper/stepper-values.js.map +1 -0
  171. package/dist/components/switch/Switch.d.ts.map +1 -1
  172. package/dist/components/switch/Switch.js +1 -0
  173. package/dist/components/switch/Switch.js.map +1 -1
  174. package/dist/components/text-area/TextArea.d.ts.map +1 -1
  175. package/dist/components/text-area/TextArea.js +1 -0
  176. package/dist/components/text-area/TextArea.js.map +1 -1
  177. package/dist/components/text-field/TextField.d.ts.map +1 -1
  178. package/dist/components/text-field/TextField.js +1 -0
  179. package/dist/components/text-field/TextField.js.map +1 -1
  180. package/dist/components/tooltip/Tooltip.d.ts +4 -0
  181. package/dist/components/tooltip/Tooltip.d.ts.map +1 -0
  182. package/dist/components/tooltip/Tooltip.js +75 -0
  183. package/dist/components/tooltip/Tooltip.js.map +1 -0
  184. package/dist/components/tooltip/Tooltip.types.d.ts +12 -0
  185. package/dist/components/tooltip/Tooltip.types.d.ts.map +1 -0
  186. package/dist/components/tooltip/hooks/useTooltipInteraction.d.ts +11 -0
  187. package/dist/components/tooltip/hooks/useTooltipInteraction.d.ts.map +1 -0
  188. package/dist/components/tooltip/hooks/useTooltipInteraction.js +59 -0
  189. package/dist/components/tooltip/hooks/useTooltipInteraction.js.map +1 -0
  190. package/dist/components/tooltip/tooltip-trigger-props.d.ts +4 -0
  191. package/dist/components/tooltip/tooltip-trigger-props.d.ts.map +1 -0
  192. package/dist/components/tooltip/tooltip-trigger-props.js +25 -0
  193. package/dist/components/tooltip/tooltip-trigger-props.js.map +1 -0
  194. package/dist/date-time-picker.css +50 -4
  195. package/dist/hooks/useOverlayPosition.d.ts +4 -0
  196. package/dist/hooks/useOverlayPosition.d.ts.map +1 -0
  197. package/dist/hooks/useOverlayPosition.js +62 -0
  198. package/dist/hooks/useOverlayPosition.js.map +1 -0
  199. package/dist/index.d.ts +21 -7
  200. package/dist/index.d.ts.map +1 -1
  201. package/dist/index.js +14 -7
  202. package/dist/pagination.css +54 -0
  203. package/dist/popup.css +4 -0
  204. package/dist/progress.css +1 -1
  205. package/dist/segmented-control.css +2 -0
  206. package/dist/slider.css +109 -0
  207. package/dist/split-button.css +2 -79
  208. package/dist/stepper.css +77 -0
  209. package/dist/styles.css +5 -0
  210. package/dist/tooltip.css +68 -0
  211. package/dist/utils/native-ref.d.ts +4 -0
  212. package/dist/utils/native-ref.d.ts.map +1 -0
  213. package/dist/utils/native-ref.js +24 -0
  214. package/dist/utils/native-ref.js.map +1 -0
  215. package/package.json +7 -2
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControl.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { forwardRef, useId, useLayoutEffect, useRef, useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport ButtonIcon from '../button/button-icon/ButtonIcon.js';\nimport { SegmentedControlContext, useSegmentedControlContext } from './SegmentedControlContext.js';\nimport type { SegmentedControlProps, SegmentProps } from './SegmentedControl.types.js';\n\nfunction getOrderedSegments(segments: Map<string, HTMLButtonElement>) {\n return [...segments.entries()]\n .filter(([, element]) => !element.disabled)\n .sort(([, first], [, second]) => {\n const position = first.compareDocumentPosition(second);\n return position & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;\n });\n}\n\nconst Segment = forwardRef<HTMLButtonElement, SegmentProps>(function Segment(\n { children, className, disabled, icon, onClick, onKeyDown, value, ...buttonProps },\n ref,\n) {\n const control = useSegmentedControlContext();\n const localRef = useRef<HTMLButtonElement>(null);\n const isSelected = control.value === value;\n const resolvedClassName = [\n 'chayns-segmented-control__segment',\n isSelected ? 'chayns-segmented-control__segment--selected' : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n useLayoutEffect(() => {\n if (localRef.current === null) {\n return undefined;\n }\n\n return control.registerSegment(value, localRef.current);\n }, [control, value]);\n\n function setRef(element: HTMLButtonElement | null) {\n localRef.current = element;\n\n if (typeof ref === 'function') {\n ref(element);\n } else if (ref !== null) {\n ref.current = element;\n }\n }\n\n function handleKeyDown(event: KeyboardEvent<HTMLButtonElement>) {\n onKeyDown?.(event);\n if (event.defaultPrevented) {\n return;\n }\n\n const keys = ['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'End', 'Home'];\n\n if (keys.includes(event.key)) {\n event.preventDefault();\n control.moveFocus(value, event.key);\n }\n }\n\n function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(event);\n if (!event.defaultPrevented) {\n control.selectValue(value);\n }\n }\n\n return (\n <button\n {...buttonProps}\n aria-checked={isSelected}\n className={resolvedClassName}\n disabled={disabled}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n ref={setRef}\n role=\"radio\"\n tabIndex={isSelected ? 0 : -1}\n type=\"button\"\n >\n {icon ? <ButtonIcon icon={icon} /> : null}\n {children}\n </button>\n );\n});\n\nconst SegmentedControlRoot = forwardRef<HTMLDivElement, SegmentedControlProps>(\n function SegmentedControlRoot(\n { children, className, defaultValue, label, onValueChange, value, ...rootProps },\n ref,\n ) {\n const labelId = useId();\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const segments = useRef(new Map<string, HTMLButtonElement>());\n const segmentsElement = useRef<HTMLDivElement>(null);\n const [indicator, setIndicator] = useState({ offset: 0, width: 0 });\n const selectedValue = value ?? uncontrolledValue ?? '';\n const resolvedClassName = ['chayns-segmented-control', className].filter(Boolean).join(' ');\n\n function selectValue(nextValue: string) {\n if (value === undefined) {\n setUncontrolledValue(nextValue);\n }\n\n onValueChange?.(nextValue);\n }\n\n function registerSegment(segmentValue: string, element: HTMLButtonElement) {\n segments.current.set(segmentValue, element);\n\n return () => {\n segments.current.delete(segmentValue);\n };\n }\n\n function moveFocus(currentValue: string, key: string) {\n const enabledSegments = getOrderedSegments(segments.current);\n const currentIndex = enabledSegments.findIndex(\n ([segmentValue]) => segmentValue === currentValue,\n );\n\n if (currentIndex === -1 || enabledSegments.length === 0) {\n return;\n }\n\n let targetIndex = currentIndex;\n\n if (key === 'Home') {\n targetIndex = 0;\n } else if (key === 'End') {\n targetIndex = enabledSegments.length - 1;\n } else if (key === 'ArrowLeft' || key === 'ArrowUp') {\n targetIndex = (currentIndex - 1 + enabledSegments.length) % enabledSegments.length;\n } else if (key === 'ArrowRight' || key === 'ArrowDown') {\n targetIndex = (currentIndex + 1) % enabledSegments.length;\n }\n\n const nextSegment = enabledSegments[targetIndex];\n\n if (nextSegment === undefined) {\n return;\n }\n\n const [nextValue, nextElement] = nextSegment;\n selectValue(nextValue);\n nextElement.focus();\n }\n\n useLayoutEffect(() => {\n const container = segmentsElement.current;\n const selectedSegment = segments.current.get(selectedValue);\n\n if (container === null || selectedSegment === undefined) {\n return undefined;\n }\n\n const observedContainer = container;\n const observedSegment = selectedSegment;\n\n function updateIndicator() {\n const paddingInlineStart = Number.parseFloat(\n window.getComputedStyle(observedContainer).paddingInlineStart,\n );\n\n setIndicator({\n offset:\n observedSegment.offsetLeft -\n (Number.isNaN(paddingInlineStart) ? 0 : paddingInlineStart),\n width: observedSegment.offsetWidth,\n });\n }\n\n updateIndicator();\n\n if (typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n\n const observer = new ResizeObserver(updateIndicator);\n observer.observe(observedContainer);\n\n return () => observer.disconnect();\n }, [selectedValue]);\n\n return (\n <SegmentedControlContext.Provider\n value={{ moveFocus, registerSegment, selectValue, value: selectedValue }}\n >\n <div\n {...rootProps}\n aria-labelledby={labelId}\n className={resolvedClassName}\n ref={ref}\n role=\"radiogroup\"\n >\n <span className=\"chayns-segmented-control__label\" id={labelId}>\n {label}\n </span>\n <div className=\"chayns-segmented-control__segments\" ref={segmentsElement}>\n <span\n aria-hidden=\"true\"\n className=\"chayns-segmented-control__indicator\"\n style={{ transform: `translateX(${indicator.offset}px)`, width: indicator.width }}\n />\n {children}\n </div>\n </div>\n </SegmentedControlContext.Provider>\n );\n },\n);\n\nconst SegmentedControl = Object.assign(SegmentedControlRoot, { Segment });\n\nexport default SegmentedControl;\n"],"mappings":"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"}
1
+ {"version":3,"file":"SegmentedControl.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { forwardRef, useCallback, useId, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { composeNativeRefs } from '../../utils/native-ref.js';\nimport ButtonIcon from '../button/button-icon/ButtonIcon.js';\nimport { SegmentedControlContext, useSegmentedControlContext } from './SegmentedControlContext.js';\nimport type { SegmentedControlProps, SegmentProps } from './SegmentedControl.types.js';\n\nfunction getOrderedSegments(segments: Map<string, HTMLButtonElement>) {\n return [...segments.entries()]\n .filter(([, element]) => !element.disabled)\n .sort(([, first], [, second]) => {\n const position = first.compareDocumentPosition(second);\n return position & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;\n });\n}\n\nconst Segment = forwardRef<HTMLButtonElement, SegmentProps>(function Segment(\n { children, className, disabled, icon, onClick, onKeyDown, value, ...buttonProps },\n ref,\n) {\n const control = useSegmentedControlContext();\n const localRef = useRef<HTMLButtonElement>(null);\n const isSelected = control.value === value;\n const resolvedClassName = [\n 'chayns-segmented-control__segment',\n isSelected ? 'chayns-segmented-control__segment--selected' : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const registerSegment = control.registerSegment;\n const notify = control.notify;\n useLayoutEffect(() => notify(), [disabled, notify]);\n\n useLayoutEffect(() => {\n if (localRef.current === null) {\n return undefined;\n }\n\n return registerSegment(value, localRef.current);\n }, [registerSegment, value]);\n\n const setRef = useMemo(() => composeNativeRefs(localRef, ref), [ref]);\n\n function handleKeyDown(event: KeyboardEvent<HTMLButtonElement>) {\n onKeyDown?.(event);\n if (event.defaultPrevented) {\n return;\n }\n\n const keys = ['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'End', 'Home'];\n\n if (keys.includes(event.key)) {\n event.preventDefault();\n control.moveFocus(value, event.key);\n }\n }\n\n function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(event);\n if (!event.defaultPrevented) {\n control.selectValue(value);\n }\n }\n\n return (\n <button\n {...buttonProps}\n aria-checked={isSelected}\n className={resolvedClassName}\n disabled={disabled}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n ref={setRef}\n role=\"radio\"\n tabIndex={control.entryValue === value ? 0 : -1}\n type=\"button\"\n >\n {icon ? <ButtonIcon icon={icon} /> : null}\n {children}\n </button>\n );\n});\n\nconst SegmentedControlRoot = forwardRef<HTMLDivElement, SegmentedControlProps>(\n function SegmentedControlRoot(\n { children, className, defaultValue, label, onValueChange, value, ...rootProps },\n ref,\n ) {\n const labelId = useId();\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const segments = useRef(new Map<string, HTMLButtonElement>());\n const segmentsElement = useRef<HTMLDivElement>(null);\n const [indicator, setIndicator] = useState({ offset: 0, width: 0 });\n const [registryVersion, setRegistryVersion] = useState(0);\n const [selection, setSelection] = useState({ valid: true, entry: value ?? defaultValue });\n const lastProposal = useRef<{ value: string; next: string } | undefined>(undefined);\n const selectedValue = value ?? uncontrolledValue ?? '';\n const resolvedClassName = ['chayns-segmented-control', className].filter(Boolean).join(' ');\n\n const selectValue = useCallback(\n (nextValue: string) => {\n if (value === undefined) {\n setUncontrolledValue(nextValue);\n }\n\n onValueChange?.(nextValue);\n },\n [onValueChange, value],\n );\n\n const notify = useCallback(() => setRegistryVersion((current) => current + 1), []);\n const registerSegment = useCallback(\n (segmentValue: string, element: HTMLButtonElement) => {\n segments.current.set(segmentValue, element);\n notify();\n\n return () => {\n segments.current.delete(segmentValue);\n notify();\n };\n },\n [notify],\n );\n\n useLayoutEffect(() => {\n const enabled = getOrderedSegments(segments.current);\n const valid = enabled.some(([segmentValue]) => segmentValue === selectedValue);\n const next = valid ? selectedValue : enabled[0]?.[0];\n setSelection((current) =>\n current.valid === valid && current.entry === next ? current : { valid, entry: next },\n );\n if (valid || next === undefined) {\n lastProposal.current = undefined;\n return;\n }\n if (lastProposal.current?.value === selectedValue && lastProposal.current?.next === next)\n return;\n lastProposal.current = { value: selectedValue, next };\n selectValue(next);\n }, [children, registryVersion, selectedValue, selectValue]);\n\n const moveFocus = useCallback(\n (currentValue: string, key: string) => {\n const enabledSegments = getOrderedSegments(segments.current);\n const currentIndex = enabledSegments.findIndex(\n ([segmentValue]) => segmentValue === currentValue,\n );\n\n if (currentIndex === -1 || enabledSegments.length === 0) {\n return;\n }\n\n let targetIndex = currentIndex;\n\n if (key === 'Home') {\n targetIndex = 0;\n } else if (key === 'End') {\n targetIndex = enabledSegments.length - 1;\n } else if (key === 'ArrowLeft' || key === 'ArrowUp') {\n targetIndex = (currentIndex - 1 + enabledSegments.length) % enabledSegments.length;\n } else if (key === 'ArrowRight' || key === 'ArrowDown') {\n targetIndex = (currentIndex + 1) % enabledSegments.length;\n }\n\n const nextSegment = enabledSegments[targetIndex];\n\n if (nextSegment === undefined) {\n return;\n }\n\n const [nextValue, nextElement] = nextSegment;\n selectValue(nextValue);\n nextElement.focus();\n },\n [selectValue],\n );\n\n useLayoutEffect(() => {\n const container = segmentsElement.current;\n const selectedSegment = segments.current.get(selectedValue);\n\n if (container === null || selectedSegment === undefined || !selection.valid) {\n setIndicator((current) => (current.width === 0 ? current : { offset: 0, width: 0 }));\n return undefined;\n }\n\n const observedContainer = container;\n const observedSegment = selectedSegment;\n\n function updateIndicator() {\n const paddingInlineStart = Number.parseFloat(\n window.getComputedStyle(observedContainer).paddingInlineStart,\n );\n\n const nextIndicator = {\n offset:\n observedSegment.offsetLeft -\n (Number.isNaN(paddingInlineStart) ? 0 : paddingInlineStart),\n width: observedSegment.offsetWidth,\n };\n setIndicator((current) =>\n current.offset === nextIndicator.offset && current.width === nextIndicator.width\n ? current\n : nextIndicator,\n );\n }\n\n updateIndicator();\n\n if (typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n\n const observer = new ResizeObserver(updateIndicator);\n observer.observe(observedContainer);\n observer.observe(observedSegment);\n\n return () => observer.disconnect();\n }, [selectedValue, selection.valid]);\n\n const contextValue = useMemo(\n () => ({\n moveFocus,\n registerSegment,\n selectValue,\n notify,\n entryValue: selection.entry,\n value: selection.valid ? selectedValue : '',\n }),\n [moveFocus, notify, registerSegment, selectValue, selectedValue, selection],\n );\n\n return (\n <SegmentedControlContext.Provider value={contextValue}>\n <div\n {...rootProps}\n aria-labelledby={labelId}\n className={resolvedClassName}\n ref={ref}\n role=\"radiogroup\"\n >\n <span className=\"chayns-segmented-control__label\" id={labelId}>\n {label}\n </span>\n <div className=\"chayns-segmented-control__segments\" ref={segmentsElement}>\n <span\n aria-hidden=\"true\"\n className=\"chayns-segmented-control__indicator\"\n style={{ transform: `translateX(${indicator.offset}px)`, width: indicator.width }}\n />\n {children}\n </div>\n </div>\n </SegmentedControlContext.Provider>\n );\n },\n);\n\nconst SegmentedControl = Object.assign(SegmentedControlRoot, { Segment });\n\nSegment.displayName = 'SegmentedControl.Segment';\nSegmentedControlRoot.displayName = 'SegmentedControl';\n\nexport default SegmentedControl;\n"],"mappings":"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"}
@@ -9,7 +9,7 @@ export interface ControlledSelection {
9
9
  }
10
10
  export interface UncontrolledSelection {
11
11
  /** Initial selected segment value. */
12
- defaultValue: string;
12
+ defaultValue?: string;
13
13
  /** Controlled value is not accepted for uncontrolled use. */
14
14
  value?: never;
15
15
  /** Receives the next value after activation. */
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControl.types.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControl.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAE5D,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB;AAED,MAAM,WAAW,qBAAqB;IACpC,sCAAsC;IACtC,YAAY,EAAE,MAAM,CAAC;IACrB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,gDAAgD;IAChD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,mEAAmE;AACnE,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACtC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,iBAAiB,GAAG,UAAU,GAAG,MAAM,CACxC,GACC,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,GAAG;IAC9C,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACtD,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CAAC;AAEJ,uDAAuD;AACvD,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,qBAAqB,CAAC,QAAQ,CAAC,EAC/B,cAAc,GAAG,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CACrF;IACC,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,QAAQ,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACzD,sEAAsE;IACtE,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,OAAO,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,CAAC;IACrD,SAAS,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,CAAC;CAC1D"}
1
+ {"version":3,"file":"SegmentedControl.types.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControl.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAE5D,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB;AAED,MAAM,WAAW,qBAAqB;IACpC,sCAAsC;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,gDAAgD;IAChD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,mEAAmE;AACnE,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACtC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,iBAAiB,GAAG,UAAU,GAAG,MAAM,CACxC,GACC,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,GAAG;IAC9C,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACtD,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CAAC;AAEJ,uDAAuD;AACvD,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,qBAAqB,CAAC,QAAQ,CAAC,EAC/B,cAAc,GAAG,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CACrF;IACC,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,QAAQ,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACzD,sEAAsE;IACtE,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,OAAO,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,CAAC;IACrD,SAAS,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,CAAC;CAC1D"}
@@ -1,4 +1,6 @@
1
1
  interface SegmentedControlContextValue {
2
+ entryValue: string | undefined;
3
+ notify: () => void;
2
4
  moveFocus: (currentValue: string, key: string) => void;
3
5
  registerSegment: (value: string, element: HTMLButtonElement) => () => void;
4
6
  selectValue: (value: string) => void;
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControlContext.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"names":[],"mappings":"AAEA,UAAU,4BAA4B;IACpC,SAAS,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvD,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,iBAAiB,KAAK,MAAM,IAAI,CAAC;IAC3E,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,uBAAuB,8DAA2D,CAAC;AAEzF,iBAAS,0BAA0B,iCAQlC;AAED,OAAO,EAAE,uBAAuB,EAAE,0BAA0B,EAAE,CAAC;AAC/D,YAAY,EAAE,4BAA4B,EAAE,CAAC"}
1
+ {"version":3,"file":"SegmentedControlContext.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"names":[],"mappings":"AAEA,UAAU,4BAA4B;IACpC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvD,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,iBAAiB,KAAK,MAAM,IAAI,CAAC;IAC3E,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,uBAAuB,8DAA2D,CAAC;AAEzF,iBAAS,0BAA0B,iCAQlC;AAED,OAAO,EAAE,uBAAuB,EAAE,0BAA0B,EAAE,CAAC;AAC/D,YAAY,EAAE,4BAA4B,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControlContext.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface SegmentedControlContextValue {\n moveFocus: (currentValue: string, key: string) => void;\n registerSegment: (value: string, element: HTMLButtonElement) => () => void;\n selectValue: (value: string) => void;\n value: string;\n}\n\nconst SegmentedControlContext = createContext<SegmentedControlContextValue | null>(null);\n\nfunction useSegmentedControlContext() {\n const context = useContext(SegmentedControlContext);\n\n if (context === null) {\n throw new Error('SegmentedControl.Segment must be rendered within SegmentedControl.');\n }\n\n return context;\n}\n\nexport { SegmentedControlContext, useSegmentedControlContext };\nexport type { SegmentedControlContextValue };\n"],"mappings":";;AASA,IAAM,0BAA0B,cAAmD,IAAI;AAEvF,SAAS,6BAA6B;CACpC,MAAM,UAAU,WAAW,uBAAuB;CAElD,IAAI,YAAY,MACd,MAAM,IAAI,MAAM,oEAAoE;CAGtF,OAAO;AACT"}
1
+ {"version":3,"file":"SegmentedControlContext.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface SegmentedControlContextValue {\n entryValue: string | undefined;\n notify: () => void;\n moveFocus: (currentValue: string, key: string) => void;\n registerSegment: (value: string, element: HTMLButtonElement) => () => void;\n selectValue: (value: string) => void;\n value: string;\n}\n\nconst SegmentedControlContext = createContext<SegmentedControlContextValue | null>(null);\n\nfunction useSegmentedControlContext() {\n const context = useContext(SegmentedControlContext);\n\n if (context === null) {\n throw new Error('SegmentedControl.Segment must be rendered within SegmentedControl.');\n }\n\n return context;\n}\n\nexport { SegmentedControlContext, useSegmentedControlContext };\nexport type { SegmentedControlContextValue };\n"],"mappings":";;AAWA,IAAM,0BAA0B,cAAmD,IAAI;AAEvF,SAAS,6BAA6B;CACpC,MAAM,UAAU,WAAW,uBAAuB;CAElD,IAAI,YAAY,MACd,MAAM,IAAI,MAAM,oEAAoE;CAGtF,OAAO;AACT"}
@@ -1 +1 @@
1
- {"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/Skeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,QAAA,MAAM,QAAQ,uHAsBZ,CAAC;AAEH,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/Skeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,QAAA,MAAM,QAAQ,uHAsBZ,CAAC;AAIH,eAAe,QAAQ,CAAC"}
@@ -14,6 +14,7 @@ var Skeleton = forwardRef(function Skeleton({ "aria-hidden": _ariaHidden, childr
14
14
  ref
15
15
  });
16
16
  });
17
+ Skeleton.displayName = "Skeleton";
17
18
  //#endregion
18
19
  export { Skeleton as default };
19
20
 
@@ -1 +1 @@
1
- {"version":3,"file":"Skeleton.js","names":[],"sources":["../../../src/components/skeleton/Skeleton.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SkeletonProps } from './Skeleton.types.js';\n\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(function Skeleton(\n {\n 'aria-hidden': _ariaHidden,\n children: _children,\n className,\n role: _role,\n shape = 'rounded',\n tabIndex: _tabIndex,\n ...divProps\n },\n ref,\n) {\n void _ariaHidden;\n void _children;\n void _role;\n void _tabIndex;\n\n const resolvedClassName = ['chayns-skeleton', `chayns-skeleton--${shape}`, className]\n .filter(Boolean)\n .join(' ');\n\n return <div {...divProps} aria-hidden=\"true\" className={resolvedClassName} ref={ref} />;\n});\n\nexport default Skeleton;\n"],"mappings":";;;AAIA,IAAM,WAAW,WAA0C,SAAS,SAClE,EACE,eAAe,aACf,UAAU,WACV,WACA,MAAM,OACN,QAAQ,WACR,UAAU,WACV,GAAG,YAEL,KACA;CAMA,MAAM,oBAAoB;EAAC;EAAmB,oBAAoB;EAAS;CAAS,CAAC,CAClF,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAU,eAAY;EAAO,WAAW;EAAwB;CAAM,CAAA;AACxF,CAAC"}
1
+ {"version":3,"file":"Skeleton.js","names":[],"sources":["../../../src/components/skeleton/Skeleton.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SkeletonProps } from './Skeleton.types.js';\n\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(function Skeleton(\n {\n 'aria-hidden': _ariaHidden,\n children: _children,\n className,\n role: _role,\n shape = 'rounded',\n tabIndex: _tabIndex,\n ...divProps\n },\n ref,\n) {\n void _ariaHidden;\n void _children;\n void _role;\n void _tabIndex;\n\n const resolvedClassName = ['chayns-skeleton', `chayns-skeleton--${shape}`, className]\n .filter(Boolean)\n .join(' ');\n\n return <div {...divProps} aria-hidden=\"true\" className={resolvedClassName} ref={ref} />;\n});\n\nSkeleton.displayName = 'Skeleton';\n\nexport default Skeleton;\n"],"mappings":";;;AAIA,IAAM,WAAW,WAA0C,SAAS,SAClE,EACE,eAAe,aACf,UAAU,WACV,WACA,MAAM,OACN,QAAQ,WACR,UAAU,WACV,GAAG,YAEL,KACA;CAMA,MAAM,oBAAoB;EAAC;EAAmB,oBAAoB;EAAS;CAAS,CAAC,CAClF,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAU,eAAY;EAAO,WAAW;EAAwB;CAAM,CAAA;AACxF,CAAC;AAED,SAAS,cAAc"}
@@ -1,4 +1,10 @@
1
1
  import type { ComponentPropsWithRef } from 'react';
2
+ /** Named configuration values; existing literal props and value lists remain supported. */
3
+ export declare enum SkeletonShapes {
4
+ Square = "square",
5
+ Rounded = "rounded",
6
+ Circular = "circular"
7
+ }
2
8
  export declare const SKELETON_SHAPES: readonly ["square", "rounded", "circular"];
3
9
  export type SkeletonShape = (typeof SKELETON_SHAPES)[number];
4
10
  export interface SkeletonProps extends Omit<ComponentPropsWithRef<'div'>, 'aria-hidden' | 'children' | 'role' | 'tabIndex'> {
@@ -1 +1 @@
1
- {"version":3,"file":"Skeleton.types.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/Skeleton.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,eAAO,MAAM,eAAe,4CAA6C,CAAC;AAC1E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC;AAE7D,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,CACjD;IACC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB"}
1
+ {"version":3,"file":"Skeleton.types.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/Skeleton.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,2FAA2F;AAC3F,oBAAY,cAAc;IACxB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,QAAQ,aAAa;CACtB;AAED,eAAO,MAAM,eAAe,4CAA6C,CAAC;AAC1E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC;AAE7D,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,CACjD;IACC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB"}
@@ -1,10 +1,17 @@
1
1
  //#region src/components/skeleton/Skeleton.types.ts
2
+ /** Named configuration values; existing literal props and value lists remain supported. */
3
+ var SkeletonShapes = /* @__PURE__ */ function(SkeletonShapes) {
4
+ SkeletonShapes["Square"] = "square";
5
+ SkeletonShapes["Rounded"] = "rounded";
6
+ SkeletonShapes["Circular"] = "circular";
7
+ return SkeletonShapes;
8
+ }({});
2
9
  var SKELETON_SHAPES = [
3
10
  "square",
4
11
  "rounded",
5
12
  "circular"
6
13
  ];
7
14
  //#endregion
8
- export { SKELETON_SHAPES };
15
+ export { SKELETON_SHAPES, SkeletonShapes };
9
16
 
10
17
  //# sourceMappingURL=Skeleton.types.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Skeleton.types.js","names":[],"sources":["../../../src/components/skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react';\n\nexport const SKELETON_SHAPES = ['square', 'rounded', 'circular'] as const;\nexport type SkeletonShape = (typeof SKELETON_SHAPES)[number];\n\nexport interface SkeletonProps extends Omit<\n ComponentPropsWithRef<'div'>,\n 'aria-hidden' | 'children' | 'role' | 'tabIndex'\n> {\n shape?: SkeletonShape;\n children?: never;\n role?: never;\n tabIndex?: never;\n 'aria-hidden'?: never;\n}\n"],"mappings":";AAEA,IAAa,kBAAkB;CAAC;CAAU;CAAW;AAAU"}
1
+ {"version":3,"file":"Skeleton.types.js","names":[],"sources":["../../../src/components/skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react';\n\n/** Named configuration values; existing literal props and value lists remain supported. */\nexport enum SkeletonShapes {\n Square = 'square',\n Rounded = 'rounded',\n Circular = 'circular',\n}\n\nexport const SKELETON_SHAPES = ['square', 'rounded', 'circular'] as const;\nexport type SkeletonShape = (typeof SKELETON_SHAPES)[number];\n\nexport interface SkeletonProps extends Omit<\n ComponentPropsWithRef<'div'>,\n 'aria-hidden' | 'children' | 'role' | 'tabIndex'\n> {\n shape?: SkeletonShape;\n children?: never;\n role?: never;\n tabIndex?: never;\n 'aria-hidden'?: never;\n}\n"],"mappings":";;AAGA,IAAY,iBAAL,yBAAA,gBAAA;CACL,eAAA,YAAA;CACA,eAAA,aAAA;CACA,eAAA,cAAA;;AACF,EAAA,CAAA,CAAA;AAEA,IAAa,kBAAkB;CAAC;CAAU;CAAW;AAAU"}
@@ -0,0 +1,4 @@
1
+ import type { SliderProps } from './Slider.types.js';
2
+ declare const Slider: import("react").ForwardRefExoticComponent<Omit<SliderProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
3
+ export default Slider;
4
+ //# sourceMappingURL=Slider.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/slider/Slider.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,QAAA,MAAM,MAAM,uHA2DV,CAAC;AAEH,eAAe,MAAM,CAAC"}
@@ -0,0 +1,61 @@
1
+ import { composeNativeRefs } from "../../utils/native-ref.js";
2
+ import { forwardRef, useEffect, useId, useMemo, useRef, useState } from "react";
3
+ import { jsx, jsxs } from "react/jsx-runtime";
4
+ //#region src/components/slider/Slider.tsx
5
+ var Slider = forwardRef(function Slider({ className, defaultValue, formatValue, id, label, max, min, onChange, step, value, ...inputProps }, ref) {
6
+ const generatedId = useId();
7
+ const inputId = id ?? generatedId;
8
+ const inputRef = useRef(null);
9
+ const minimum = Number(min ?? 0);
10
+ const maximum = Number(max ?? 100);
11
+ const initialValue = Number(value ?? defaultValue ?? (minimum + maximum) / 2);
12
+ const [displayValue, setDisplayValue] = useState(initialValue);
13
+ const formattedValue = formatValue(displayValue);
14
+ const setRef = useMemo(() => composeNativeRefs(inputRef, ref), [ref]);
15
+ useEffect(() => {
16
+ if (inputRef.current) setDisplayValue(inputRef.current.valueAsNumber);
17
+ }, [
18
+ defaultValue,
19
+ max,
20
+ min,
21
+ step,
22
+ value
23
+ ]);
24
+ function handleChange(event) {
25
+ onChange?.(event);
26
+ if (value === void 0) setDisplayValue(event.currentTarget.valueAsNumber);
27
+ }
28
+ return /* @__PURE__ */ jsxs("div", {
29
+ className: "chayns-slider",
30
+ children: [/* @__PURE__ */ jsxs("div", {
31
+ className: "chayns-slider__label-row",
32
+ children: [/* @__PURE__ */ jsx("label", {
33
+ htmlFor: inputId,
34
+ children: label
35
+ }), /* @__PURE__ */ jsx("output", {
36
+ "aria-hidden": "true",
37
+ className: "chayns-slider__value",
38
+ htmlFor: inputId,
39
+ children: formattedValue
40
+ })]
41
+ }), /* @__PURE__ */ jsx("input", {
42
+ ...inputProps,
43
+ "aria-valuetext": formattedValue,
44
+ className: ["chayns-slider__input", className].filter(Boolean).join(" "),
45
+ defaultValue,
46
+ id: inputId,
47
+ max,
48
+ min,
49
+ onChange: handleChange,
50
+ ref: setRef,
51
+ step,
52
+ type: "range",
53
+ value
54
+ })]
55
+ });
56
+ });
57
+ Slider.displayName = "Slider";
58
+ //#endregion
59
+ export { Slider as default };
60
+
61
+ //# sourceMappingURL=Slider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Slider.js","names":[],"sources":["../../../src/components/slider/Slider.tsx"],"sourcesContent":["import { forwardRef, useMemo, useEffect, useId, useRef, useState } from 'react';\nimport type { ChangeEvent } from 'react';\nimport { composeNativeRefs } from '../../utils/native-ref.js';\nimport type { SliderProps } from './Slider.types.js';\n\nconst Slider = forwardRef<HTMLInputElement, SliderProps>(function Slider(\n {\n className,\n defaultValue,\n formatValue,\n id,\n label,\n max,\n min,\n onChange,\n step,\n value,\n ...inputProps\n },\n ref,\n) {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n const inputRef = useRef<HTMLInputElement>(null);\n const minimum = Number(min ?? 0);\n const maximum = Number(max ?? 100);\n const initialValue = Number(value ?? defaultValue ?? (minimum + maximum) / 2);\n const [displayValue, setDisplayValue] = useState(initialValue);\n const formattedValue = formatValue(displayValue);\n const setRef = useMemo(() => composeNativeRefs(inputRef, ref), [ref]);\n\n useEffect(() => {\n if (inputRef.current) setDisplayValue(inputRef.current.valueAsNumber);\n }, [defaultValue, max, min, step, value]);\n\n function handleChange(event: ChangeEvent<HTMLInputElement>) {\n onChange?.(event);\n if (value === undefined) setDisplayValue(event.currentTarget.valueAsNumber);\n }\n\n return (\n <div className=\"chayns-slider\">\n <div className=\"chayns-slider__label-row\">\n <label htmlFor={inputId}>{label}</label>\n <output aria-hidden=\"true\" className=\"chayns-slider__value\" htmlFor={inputId}>\n {formattedValue}\n </output>\n </div>\n <input\n {...inputProps}\n aria-valuetext={formattedValue}\n className={['chayns-slider__input', className].filter(Boolean).join(' ')}\n defaultValue={defaultValue}\n id={inputId}\n max={max}\n min={min}\n onChange={handleChange}\n ref={setRef}\n step={step}\n type=\"range\"\n value={value}\n />\n </div>\n );\n});\nSlider.displayName = 'Slider';\nexport default Slider;\n"],"mappings":";;;;AAKA,IAAM,SAAS,WAA0C,SAAS,OAChE,EACE,WACA,cACA,aACA,IACA,OACA,KACA,KACA,UACA,MACA,OACA,GAAG,cAEL,KACA;CACA,MAAM,cAAc,MAAM;CAC1B,MAAM,UAAU,MAAM;CACtB,MAAM,WAAW,OAAyB,IAAI;CAC9C,MAAM,UAAU,OAAO,OAAO,CAAC;CAC/B,MAAM,UAAU,OAAO,OAAO,GAAG;CACjC,MAAM,eAAe,OAAO,SAAS,iBAAiB,UAAU,WAAW,CAAC;CAC5E,MAAM,CAAC,cAAc,mBAAmB,SAAS,YAAY;CAC7D,MAAM,iBAAiB,YAAY,YAAY;CAC/C,MAAM,SAAS,cAAc,kBAAkB,UAAU,GAAG,GAAG,CAAC,GAAG,CAAC;CAEpE,gBAAgB;EACd,IAAI,SAAS,SAAS,gBAAgB,SAAS,QAAQ,aAAa;CACtE,GAAG;EAAC;EAAc;EAAK;EAAK;EAAM;CAAK,CAAC;CAExC,SAAS,aAAa,OAAsC;EAC1D,WAAW,KAAK;EAChB,IAAI,UAAU,KAAA,GAAW,gBAAgB,MAAM,cAAc,aAAa;CAC5E;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,oBAAC,SAAD;IAAO,SAAS;IAAU,UAAA;GAAa,CAAA,GACvC,oBAAC,UAAD;IAAQ,eAAY;IAAO,WAAU;IAAuB,SAAS;IAClE,UAAA;GACK,CAAA,CACL;EACL,CAAA,GAAA,oBAAC,SAAD;GACE,GAAI;GACJ,kBAAgB;GAChB,WAAW,CAAC,wBAAwB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;GACzD;GACd,IAAI;GACC;GACA;GACL,UAAU;GACV,KAAK;GACC;GACN,MAAK;GACE;EACR,CAAA,CACE;;AAET,CAAC;AACD,OAAO,cAAc"}
@@ -0,0 +1,10 @@
1
+ import type { ComponentPropsWithRef, ReactNode } from 'react';
2
+ /** Approximate bounded immediate settings; use Stepper for exact quantities. */
3
+ export interface SliderProps extends Omit<ComponentPropsWithRef<'input'>, 'children' | 'type' | 'aria-valuetext'> {
4
+ label: Exclude<ReactNode, boolean | null | undefined>;
5
+ /** Resolves all locale/unit formatting for the visible output and aria-valuetext. */
6
+ formatValue: (value: number) => string;
7
+ type?: never;
8
+ 'aria-valuetext'?: never;
9
+ }
10
+ //# sourceMappingURL=Slider.types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Slider.types.d.ts","sourceRoot":"","sources":["../../../src/components/slider/Slider.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,gFAAgF;AAChF,MAAM,WAAW,WAAY,SAAQ,IAAI,CACvC,qBAAqB,CAAC,OAAO,CAAC,EAC9B,UAAU,GAAG,MAAM,GAAG,gBAAgB,CACvC;IACC,KAAK,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACtD,qFAAqF;IACrF,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,gBAAgB,CAAC,EAAE,KAAK,CAAC;CAC1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,QAAA,MAAM,OAAO,sHAmBX,CAAC;AAEH,eAAe,OAAO,CAAC"}
1
+ {"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,QAAA,MAAM,OAAO,sHAmBX,CAAC;AAIH,eAAe,OAAO,CAAC"}
@@ -10,6 +10,7 @@ var Spinner = forwardRef(function Spinner({ "aria-hidden": _ariaHidden, children
10
10
  ref
11
11
  });
12
12
  });
13
+ Spinner.displayName = "Spinner";
13
14
  //#endregion
14
15
  export { Spinner as default };
15
16
 
@@ -1 +1 @@
1
- {"version":3,"file":"Spinner.js","names":[],"sources":["../../../src/components/spinner/Spinner.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SpinnerProps } from './Spinner.types.js';\n\nconst Spinner = forwardRef<HTMLDivElement, SpinnerProps>(function Spinner(\n {\n 'aria-hidden': _ariaHidden,\n children: _children,\n className,\n role: _role,\n tabIndex: _tabIndex,\n ...divProps\n },\n ref,\n) {\n void _ariaHidden;\n void _children;\n void _role;\n void _tabIndex;\n\n const resolvedClassName = ['chayns-spinner', className].filter(Boolean).join(' ');\n\n return <div {...divProps} aria-hidden=\"true\" className={resolvedClassName} ref={ref} />;\n});\n\nexport default Spinner;\n"],"mappings":";;;AAIA,IAAM,UAAU,WAAyC,SAAS,QAChE,EACE,eAAe,aACf,UAAU,WACV,WACA,MAAM,OACN,UAAU,WACV,GAAG,YAEL,KACA;CAMA,MAAM,oBAAoB,CAAC,kBAAkB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEhF,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAU,eAAY;EAAO,WAAW;EAAwB;CAAM,CAAA;AACxF,CAAC"}
1
+ {"version":3,"file":"Spinner.js","names":[],"sources":["../../../src/components/spinner/Spinner.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SpinnerProps } from './Spinner.types.js';\n\nconst Spinner = forwardRef<HTMLDivElement, SpinnerProps>(function Spinner(\n {\n 'aria-hidden': _ariaHidden,\n children: _children,\n className,\n role: _role,\n tabIndex: _tabIndex,\n ...divProps\n },\n ref,\n) {\n void _ariaHidden;\n void _children;\n void _role;\n void _tabIndex;\n\n const resolvedClassName = ['chayns-spinner', className].filter(Boolean).join(' ');\n\n return <div {...divProps} aria-hidden=\"true\" className={resolvedClassName} ref={ref} />;\n});\n\nSpinner.displayName = 'Spinner';\n\nexport default Spinner;\n"],"mappings":";;;AAIA,IAAM,UAAU,WAAyC,SAAS,QAChE,EACE,eAAe,aACf,UAAU,WACV,WACA,MAAM,OACN,UAAU,WACV,GAAG,YAEL,KACA;CAMA,MAAM,oBAAoB,CAAC,kBAAkB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEhF,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAU,eAAY;EAAO,WAAW;EAAwB;CAAM,CAAA;AACxF,CAAC;AAED,QAAQ,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"SplitButton.d.ts","sourceRoot":"","sources":["../../../src/components/split-button/SplitButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,QAAA,MAAM,WAAW,0HAwCf,CAAC;AAEH,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"SplitButton.d.ts","sourceRoot":"","sources":["../../../src/components/split-button/SplitButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,QAAA,MAAM,WAAW,0HAwCf,CAAC;AAIH,eAAe,WAAW,CAAC"}
@@ -26,7 +26,7 @@ var SplitButton = forwardRef(function SplitButton({ children, className, disable
26
26
  trigger: /* @__PURE__ */ jsx("button", {
27
27
  "aria-labelledby": labelId,
28
28
  "aria-haspopup": "menu",
29
- className: `chayns-split-button__trigger chayns-button--${variant}`,
29
+ className: `chayns-button chayns-split-button__trigger chayns-button--${variant}`,
30
30
  ...disabled ? { disabled: true } : {},
31
31
  type: "button",
32
32
  children: /* @__PURE__ */ jsx("span", {
@@ -38,6 +38,7 @@ var SplitButton = forwardRef(function SplitButton({ children, className, disable
38
38
  })]
39
39
  });
40
40
  });
41
+ SplitButton.displayName = "SplitButton";
41
42
  //#endregion
42
43
  export { SplitButton as default };
43
44
 
@@ -1 +1 @@
1
- {"version":3,"file":"SplitButton.js","names":[],"sources":["../../../src/components/split-button/SplitButton.tsx"],"sourcesContent":["import { forwardRef, useId } from 'react';\n\nimport Button from '../button/Button.js';\nimport ButtonIcon from '../button/button-icon/ButtonIcon.js';\nimport PopupList from '../popup/PopupList.js';\nimport type { SplitButtonProps } from './SplitButton.types.js';\n\nconst SplitButton = forwardRef<HTMLDivElement, SplitButtonProps>(function SplitButton(\n { children, className, disabled, icon, items, onClick, variant, ...containerProps },\n ref,\n) {\n const labelId = useId();\n\n return (\n <div\n {...containerProps}\n className={['chayns-split-button', className].filter(Boolean).join(' ')}\n ref={ref}\n >\n <Button\n aria-labelledby={labelId}\n className=\"chayns-split-button__primary\"\n disabled={disabled}\n {...(icon ? { icon } : {})}\n onClick={onClick}\n variant={variant}\n >\n <span id={labelId}>{children}</span>\n </Button>\n <PopupList\n items={items}\n trigger={\n <button\n aria-labelledby={labelId}\n aria-haspopup=\"menu\"\n className={`chayns-split-button__trigger chayns-button--${variant}`}\n {...(disabled ? { disabled: true } : {})}\n type=\"button\"\n >\n <span aria-hidden=\"true\" className=\"chayns-split-button__chevron\">\n <ButtonIcon icon=\"fa-chevron-down\" />\n </span>\n </button>\n }\n />\n </div>\n );\n});\n\nexport default SplitButton;\n"],"mappings":";;;;;;AAOA,IAAM,cAAc,WAA6C,SAAS,YACxE,EAAE,UAAU,WAAW,UAAU,MAAM,OAAO,SAAS,SAAS,GAAG,kBACnE,KACA;CACA,MAAM,UAAU,MAAM;CAEtB,OACE,qBAAC,OAAD;EACE,GAAI;EACJ,WAAW,CAAC,uBAAuB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EACjE;EAHP,UAAA,CAKE,oBAAC,QAAD;GACE,mBAAiB;GACjB,WAAU;GACA;GACV,GAAK,OAAO,EAAE,KAAK,IAAI,CAAC;GACf;GACA;GAET,UAAA,oBAAC,QAAD;IAAM,IAAI;IAAU;GAAe,CAAA;EAC7B,CAAA,GACR,oBAAC,WAAD;GACS;GACP,SACE,oBAAC,UAAD;IACE,mBAAiB;IACjB,iBAAc;IACd,WAAW,+CAA+C;IAC1D,GAAK,WAAW,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,MAAK;IAEL,UAAA,oBAAC,QAAD;KAAM,eAAY;KAAO,WAAU;KACjC,UAAA,oBAAC,YAAD,EAAY,MAAK,kBAAmB,CAAA;IAChC,CAAA;GACA,CAAA;EAEX,CAAA,CACE;;AAET,CAAC"}
1
+ {"version":3,"file":"SplitButton.js","names":[],"sources":["../../../src/components/split-button/SplitButton.tsx"],"sourcesContent":["import { forwardRef, useId } from 'react';\n\nimport Button from '../button/Button.js';\nimport ButtonIcon from '../button/button-icon/ButtonIcon.js';\nimport PopupList from '../popup/PopupList.js';\nimport type { SplitButtonProps } from './SplitButton.types.js';\n\nconst SplitButton = forwardRef<HTMLDivElement, SplitButtonProps>(function SplitButton(\n { children, className, disabled, icon, items, onClick, variant, ...containerProps },\n ref,\n) {\n const labelId = useId();\n\n return (\n <div\n {...containerProps}\n className={['chayns-split-button', className].filter(Boolean).join(' ')}\n ref={ref}\n >\n <Button\n aria-labelledby={labelId}\n className=\"chayns-split-button__primary\"\n disabled={disabled}\n {...(icon ? { icon } : {})}\n onClick={onClick}\n variant={variant}\n >\n <span id={labelId}>{children}</span>\n </Button>\n <PopupList\n items={items}\n trigger={\n <button\n aria-labelledby={labelId}\n aria-haspopup=\"menu\"\n className={`chayns-button chayns-split-button__trigger chayns-button--${variant}`}\n {...(disabled ? { disabled: true } : {})}\n type=\"button\"\n >\n <span aria-hidden=\"true\" className=\"chayns-split-button__chevron\">\n <ButtonIcon icon=\"fa-chevron-down\" />\n </span>\n </button>\n }\n />\n </div>\n );\n});\n\nSplitButton.displayName = 'SplitButton';\n\nexport default SplitButton;\n"],"mappings":";;;;;;AAOA,IAAM,cAAc,WAA6C,SAAS,YACxE,EAAE,UAAU,WAAW,UAAU,MAAM,OAAO,SAAS,SAAS,GAAG,kBACnE,KACA;CACA,MAAM,UAAU,MAAM;CAEtB,OACE,qBAAC,OAAD;EACE,GAAI;EACJ,WAAW,CAAC,uBAAuB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EACjE;EAHP,UAAA,CAKE,oBAAC,QAAD;GACE,mBAAiB;GACjB,WAAU;GACA;GACV,GAAK,OAAO,EAAE,KAAK,IAAI,CAAC;GACf;GACA;GAET,UAAA,oBAAC,QAAD;IAAM,IAAI;IAAU;GAAe,CAAA;EAC7B,CAAA,GACR,oBAAC,WAAD;GACS;GACP,SACE,oBAAC,UAAD;IACE,mBAAiB;IACjB,iBAAc;IACd,WAAW,6DAA6D;IACxE,GAAK,WAAW,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,MAAK;IAEL,UAAA,oBAAC,QAAD;KAAM,eAAY;KAAO,WAAU;KACjC,UAAA,oBAAC,YAAD,EAAY,MAAK,kBAAmB,CAAA;IAChC,CAAA;GACA,CAAA;EAEX,CAAA,CACE;;AAET,CAAC;AAED,YAAY,cAAc"}
@@ -0,0 +1,4 @@
1
+ import type { StepperProps } from './Stepper.types.js';
2
+ declare const Stepper: import("react").ForwardRefExoticComponent<Omit<StepperProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
3
+ export default Stepper;
4
+ //# sourceMappingURL=Stepper.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Stepper.d.ts","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,QAAA,MAAM,OAAO,sHAkEX,CAAC;AAEH,eAAe,OAAO,CAAC"}
@@ -0,0 +1,60 @@
1
+ import ButtonIcon from "../button/button-icon/ButtonIcon.js";
2
+ import { stepperValues } from "./stepper-values.js";
3
+ import { forwardRef, useId } from "react";
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
+ //#region src/components/stepper/Stepper.tsx
6
+ var Stepper = forwardRef(function Stepper({ className, decreaseLabel, formatValue, increaseLabel, label, max, min, onClick, onValueChange, precision = 0, step, value, ...rootProps }, ref) {
7
+ const labelId = useId();
8
+ const next = stepperValues(value, min, max, step, precision);
9
+ function handleClick(event) {
10
+ onClick?.(event);
11
+ if (event.defaultPrevented || !(event.target instanceof Element)) return;
12
+ const button = event.target.closest("button[data-stepper-direction]");
13
+ if (!button || !event.currentTarget.contains(button) || button.disabled) return;
14
+ onValueChange(button.dataset.stepperDirection === "decrease" ? next.decrease : next.increase);
15
+ }
16
+ return /* @__PURE__ */ jsxs("div", {
17
+ ...rootProps,
18
+ "aria-labelledby": labelId,
19
+ className: ["chayns-stepper", className].filter(Boolean).join(" "),
20
+ onClick: handleClick,
21
+ ref,
22
+ role: "group",
23
+ children: [/* @__PURE__ */ jsx("span", {
24
+ className: "chayns-stepper__label",
25
+ id: labelId,
26
+ children: label
27
+ }), /* @__PURE__ */ jsxs("div", {
28
+ className: "chayns-stepper__control",
29
+ children: [
30
+ /* @__PURE__ */ jsx("button", {
31
+ "aria-label": decreaseLabel,
32
+ className: "chayns-stepper__button",
33
+ "data-stepper-direction": "decrease",
34
+ disabled: value === min,
35
+ type: "button",
36
+ children: /* @__PURE__ */ jsx(ButtonIcon, { icon: "fa-minus" })
37
+ }),
38
+ /* @__PURE__ */ jsx("span", {
39
+ "aria-atomic": "true",
40
+ "aria-live": "polite",
41
+ className: "chayns-stepper__value",
42
+ children: formatValue(value)
43
+ }),
44
+ /* @__PURE__ */ jsx("button", {
45
+ "aria-label": increaseLabel,
46
+ className: "chayns-stepper__button chayns-stepper__button--increase",
47
+ "data-stepper-direction": "increase",
48
+ disabled: value === max,
49
+ type: "button",
50
+ children: /* @__PURE__ */ jsx(ButtonIcon, { icon: "fa-plus" })
51
+ })
52
+ ]
53
+ })]
54
+ });
55
+ });
56
+ Stepper.displayName = "Stepper";
57
+ //#endregion
58
+ export { Stepper as default };
59
+
60
+ //# sourceMappingURL=Stepper.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Stepper.js","names":[],"sources":["../../../src/components/stepper/Stepper.tsx"],"sourcesContent":["import { forwardRef, useId, type MouseEvent } from 'react';\nimport ButtonIcon from '../button/button-icon/ButtonIcon.js';\nimport { stepperValues } from './stepper-values.js';\nimport type { StepperProps } from './Stepper.types.js';\n\nconst Stepper = forwardRef<HTMLDivElement, StepperProps>(function Stepper(\n {\n className,\n decreaseLabel,\n formatValue,\n increaseLabel,\n label,\n max,\n min,\n onClick,\n onValueChange,\n precision = 0,\n step,\n value,\n ...rootProps\n },\n ref,\n) {\n const labelId = useId();\n const next = stepperValues(value, min, max, step, precision);\n function handleClick(event: MouseEvent<HTMLDivElement>) {\n onClick?.(event);\n if (event.defaultPrevented || !(event.target instanceof Element)) return;\n const button = event.target.closest<HTMLButtonElement>('button[data-stepper-direction]');\n if (!button || !event.currentTarget.contains(button) || button.disabled) return;\n onValueChange(button.dataset.stepperDirection === 'decrease' ? next.decrease : next.increase);\n }\n return (\n // Native buttons provide keyboard activation; the group delegates their clicks.\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions\n <div\n {...rootProps}\n aria-labelledby={labelId}\n className={['chayns-stepper', className].filter(Boolean).join(' ')}\n onClick={handleClick}\n ref={ref}\n role=\"group\"\n >\n <span className=\"chayns-stepper__label\" id={labelId}>\n {label}\n </span>\n <div className=\"chayns-stepper__control\">\n <button\n aria-label={decreaseLabel}\n className=\"chayns-stepper__button\"\n data-stepper-direction=\"decrease\"\n disabled={value === min}\n type=\"button\"\n >\n <ButtonIcon icon=\"fa-minus\" />\n </button>\n <span aria-atomic=\"true\" aria-live=\"polite\" className=\"chayns-stepper__value\">\n {formatValue(value)}\n </span>\n <button\n aria-label={increaseLabel}\n className=\"chayns-stepper__button chayns-stepper__button--increase\"\n data-stepper-direction=\"increase\"\n disabled={value === max}\n type=\"button\"\n >\n <ButtonIcon icon=\"fa-plus\" />\n </button>\n </div>\n </div>\n );\n});\nStepper.displayName = 'Stepper';\nexport default Stepper;\n"],"mappings":";;;;;AAKA,IAAM,UAAU,WAAyC,SAAS,QAChE,EACE,WACA,eACA,aACA,eACA,OACA,KACA,KACA,SACA,eACA,YAAY,GACZ,MACA,OACA,GAAG,aAEL,KACA;CACA,MAAM,UAAU,MAAM;CACtB,MAAM,OAAO,cAAc,OAAO,KAAK,KAAK,MAAM,SAAS;CAC3D,SAAS,YAAY,OAAmC;EACtD,UAAU,KAAK;EACf,IAAI,MAAM,oBAAoB,EAAE,MAAM,kBAAkB,UAAU;EAClE,MAAM,SAAS,MAAM,OAAO,QAA2B,gCAAgC;EACvF,IAAI,CAAC,UAAU,CAAC,MAAM,cAAc,SAAS,MAAM,KAAK,OAAO,UAAU;EACzE,cAAc,OAAO,QAAQ,qBAAqB,aAAa,KAAK,WAAW,KAAK,QAAQ;CAC9F;CACA,OAGE,qBAAC,OAAD;EACE,GAAI;EACJ,mBAAiB;EACjB,WAAW,CAAC,kBAAkB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;EACjE,SAAS;EACJ;EACL,MAAK;EANP,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GAAwB,IAAI;GACzC,UAAA;EACG,CAAA,GACN,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA;IACE,oBAAC,UAAD;KACE,cAAY;KACZ,WAAU;KACV,0BAAuB;KACvB,UAAU,UAAU;KACpB,MAAK;KAEL,UAAA,oBAAC,YAAD,EAAY,MAAK,WAAY,CAAA;IACvB,CAAA;IACR,oBAAC,QAAD;KAAM,eAAY;KAAO,aAAU;KAAS,WAAU;KACnD,UAAA,YAAY,KAAK;IACd,CAAA;IACN,oBAAC,UAAD;KACE,cAAY;KACZ,WAAU;KACV,0BAAuB;KACvB,UAAU,UAAU;KACpB,MAAK;KAEL,UAAA,oBAAC,YAAD,EAAY,MAAK,UAAW,CAAA;IACtB,CAAA;GACL;EACF,CAAA,CAAA;;AAET,CAAC;AACD,QAAQ,cAAc"}
@@ -0,0 +1,27 @@
1
+ import type { ComponentPropsWithRef } from 'react';
2
+ /** Number of decimal places; omitted precision uses integers. */
3
+ export declare enum StepperPrecisions {
4
+ Zero = 0,
5
+ One = 1,
6
+ Two = 2,
7
+ Three = 3,
8
+ Four = 4,
9
+ Five = 5,
10
+ Six = 6
11
+ }
12
+ export declare const STEPPER_PRECISIONS: readonly [0, 1, 2, 3, 4, 5, 6];
13
+ export type StepperPrecision = (typeof STEPPER_PRECISIONS)[number];
14
+ /** Controlled exact quantity; native div props/ref address the labelled group. */
15
+ export interface StepperProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'role' | 'aria-label' | 'aria-labelledby'> {
16
+ value: number;
17
+ min: number;
18
+ max: number;
19
+ step: number;
20
+ precision?: StepperPrecision;
21
+ onValueChange: (value: number) => void;
22
+ label: string;
23
+ decreaseLabel: string;
24
+ increaseLabel: string;
25
+ formatValue: (value: number) => string;
26
+ }
27
+ //# sourceMappingURL=Stepper.types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Stepper.types.d.ts","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,iEAAiE;AACjE,oBAAY,iBAAiB;IAC3B,IAAI,IAAI;IACR,GAAG,IAAI;IACP,GAAG,IAAI;IACP,KAAK,IAAI;IACT,IAAI,IAAI;IACR,IAAI,IAAI;IACR,GAAG,IAAI;CACR;AACD,eAAO,MAAM,kBAAkB,gCAAiC,CAAC;AACjE,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC;AAEnE,kFAAkF;AAClF,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,iBAAiB,CACvD;IACC,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACxC"}
@@ -0,0 +1,25 @@
1
+ //#region src/components/stepper/Stepper.types.ts
2
+ /** Number of decimal places; omitted precision uses integers. */
3
+ var StepperPrecisions = /* @__PURE__ */ function(StepperPrecisions) {
4
+ StepperPrecisions[StepperPrecisions["Zero"] = 0] = "Zero";
5
+ StepperPrecisions[StepperPrecisions["One"] = 1] = "One";
6
+ StepperPrecisions[StepperPrecisions["Two"] = 2] = "Two";
7
+ StepperPrecisions[StepperPrecisions["Three"] = 3] = "Three";
8
+ StepperPrecisions[StepperPrecisions["Four"] = 4] = "Four";
9
+ StepperPrecisions[StepperPrecisions["Five"] = 5] = "Five";
10
+ StepperPrecisions[StepperPrecisions["Six"] = 6] = "Six";
11
+ return StepperPrecisions;
12
+ }({});
13
+ var STEPPER_PRECISIONS = [
14
+ 0,
15
+ 1,
16
+ 2,
17
+ 3,
18
+ 4,
19
+ 5,
20
+ 6
21
+ ];
22
+ //#endregion
23
+ export { STEPPER_PRECISIONS, StepperPrecisions };
24
+
25
+ //# sourceMappingURL=Stepper.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Stepper.types.js","names":[],"sources":["../../../src/components/stepper/Stepper.types.ts"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react';\n\n/** Number of decimal places; omitted precision uses integers. */\nexport enum StepperPrecisions {\n Zero = 0,\n One = 1,\n Two = 2,\n Three = 3,\n Four = 4,\n Five = 5,\n Six = 6,\n}\nexport const STEPPER_PRECISIONS = [0, 1, 2, 3, 4, 5, 6] as const;\nexport type StepperPrecision = (typeof STEPPER_PRECISIONS)[number];\n\n/** Controlled exact quantity; native div props/ref address the labelled group. */\nexport interface StepperProps extends Omit<\n ComponentPropsWithRef<'div'>,\n 'children' | 'role' | 'aria-label' | 'aria-labelledby'\n> {\n value: number;\n min: number;\n max: number;\n step: number;\n precision?: StepperPrecision;\n onValueChange: (value: number) => void;\n label: string;\n decreaseLabel: string;\n increaseLabel: string;\n formatValue: (value: number) => string;\n}\n"],"mappings":";;AAGA,IAAY,oBAAL,yBAAA,mBAAA;CACL,kBAAA,kBAAA,UAAA,KAAA;CACA,kBAAA,kBAAA,SAAA,KAAA;CACA,kBAAA,kBAAA,SAAA,KAAA;CACA,kBAAA,kBAAA,WAAA,KAAA;CACA,kBAAA,kBAAA,UAAA,KAAA;CACA,kBAAA,kBAAA,UAAA,KAAA;CACA,kBAAA,kBAAA,SAAA,KAAA;;AACF,EAAA,CAAA,CAAA;AACA,IAAa,qBAAqB;CAAC;CAAG;CAAG;CAAG;CAAG;CAAG;CAAG;AAAC"}
@@ -0,0 +1,6 @@
1
+ /** Validate exact decimal values before doing bounded integer arithmetic. */
2
+ export declare function stepperValues(value: number, min: number, max: number, step: number, precision: number): {
3
+ decrease: number;
4
+ increase: number;
5
+ };
6
+ //# sourceMappingURL=stepper-values.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"stepper-values.d.ts","sourceRoot":"","sources":["../../../src/components/stepper/stepper-values.ts"],"names":[],"mappings":"AAAA,6EAA6E;AAC7E,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,GAAG,EAAE,MAAM,EACX,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,MAAM;;;EA6BlB"}
@@ -0,0 +1,26 @@
1
+ //#region src/components/stepper/stepper-values.ts
2
+ /** Validate exact decimal values before doing bounded integer arithmetic. */
3
+ function stepperValues(value, min, max, step, precision) {
4
+ if (!Number.isInteger(precision) || precision < 0 || precision > 6) throw new Error("Stepper precision must be an integer within 0..6.");
5
+ const scale = 10 ** precision;
6
+ const [current, lower, upper, increment] = [
7
+ value,
8
+ min,
9
+ max,
10
+ step
11
+ ].map((number) => {
12
+ const integer = Math.round(number * scale);
13
+ if (!Number.isSafeInteger(integer) || integer / scale !== number) throw new Error("Stepper values must be exact safe integers at the specified precision.");
14
+ return integer;
15
+ });
16
+ const range = upper - lower;
17
+ if (increment <= 0 || range < 0 || !Number.isSafeInteger(range) || current < lower || current > upper || range % increment !== 0 || (current - lower) % increment !== 0) throw new Error("Stepper requires ordered bounds and value/max aligned to a positive min-based step.");
18
+ return {
19
+ decrease: current === lower ? value : (current - increment) / scale,
20
+ increase: current === upper ? value : (current + increment) / scale
21
+ };
22
+ }
23
+ //#endregion
24
+ export { stepperValues };
25
+
26
+ //# sourceMappingURL=stepper-values.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"stepper-values.js","names":[],"sources":["../../../src/components/stepper/stepper-values.ts"],"sourcesContent":["/** Validate exact decimal values before doing bounded integer arithmetic. */\nexport function stepperValues(\n value: number,\n min: number,\n max: number,\n step: number,\n precision: number,\n) {\n if (!Number.isInteger(precision) || precision < 0 || precision > 6)\n throw new Error('Stepper precision must be an integer within 0..6.');\n const scale = 10 ** precision;\n const integers = [value, min, max, step].map((number) => {\n const integer = Math.round(number * scale);\n if (!Number.isSafeInteger(integer) || integer / scale !== number)\n throw new Error('Stepper values must be exact safe integers at the specified precision.');\n return integer;\n });\n const [current, lower, upper, increment] = integers as [number, number, number, number];\n const range = upper - lower;\n if (\n increment <= 0 ||\n range < 0 ||\n !Number.isSafeInteger(range) ||\n current < lower ||\n current > upper ||\n range % increment !== 0 ||\n (current - lower) % increment !== 0\n )\n throw new Error(\n 'Stepper requires ordered bounds and value/max aligned to a positive min-based step.',\n );\n return {\n decrease: current === lower ? value : (current - increment) / scale,\n increase: current === upper ? value : (current + increment) / scale,\n };\n}\n"],"mappings":";;AACA,SAAgB,cACd,OACA,KACA,KACA,MACA,WACA;CACA,IAAI,CAAC,OAAO,UAAU,SAAS,KAAK,YAAY,KAAK,YAAY,GAC/D,MAAM,IAAI,MAAM,mDAAmD;CACrE,MAAM,QAAQ,MAAM;CAOpB,MAAM,CAAC,SAAS,OAAO,OAAO,aANb;EAAC;EAAO;EAAK;EAAK;CAAI,CAAC,CAAC,KAAK,WAAW;EACvD,MAAM,UAAU,KAAK,MAAM,SAAS,KAAK;EACzC,IAAI,CAAC,OAAO,cAAc,OAAO,KAAK,UAAU,UAAU,QACxD,MAAM,IAAI,MAAM,wEAAwE;EAC1F,OAAO;CACT,CAC2C;CAC3C,MAAM,QAAQ,QAAQ;CACtB,IACE,aAAa,KACb,QAAQ,KACR,CAAC,OAAO,cAAc,KAAK,KAC3B,UAAU,SACV,UAAU,SACV,QAAQ,cAAc,MACrB,UAAU,SAAS,cAAc,GAElC,MAAM,IAAI,MACR,qFACF;CACF,OAAO;EACL,UAAU,YAAY,QAAQ,SAAS,UAAU,aAAa;EAC9D,UAAU,YAAY,QAAQ,SAAS,UAAU,aAAa;CAChE;AACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,QAAA,MAAM,MAAM,uHAoBV,CAAC;AAEH,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,QAAA,MAAM,MAAM,uHAoBV,CAAC;AAIH,eAAe,MAAM,CAAC"}
@@ -30,6 +30,7 @@ var Switch = forwardRef(function Switch({ children, className, description, ...i
30
30
  ]
31
31
  });
32
32
  });
33
+ Switch.displayName = "Switch";
33
34
  //#endregion
34
35
  export { Switch as default };
35
36
 
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.js","names":[],"sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SwitchProps } from './Switch.types.js';\n\nconst Switch = forwardRef<HTMLInputElement, SwitchProps>(function Switch(\n { children, className, description, ...inputProps },\n ref,\n) {\n const inputClassName = ['chayns-switch__input', className].filter(Boolean).join(' ');\n\n return (\n <label className=\"chayns-switch\">\n <span className=\"chayns-switch__content\">\n <span className=\"chayns-switch__label\">{children}</span>\n {description !== undefined ? (\n <span className=\"chayns-switch__description\">{description}</span>\n ) : null}\n </span>\n <input {...inputProps} className={inputClassName} ref={ref} type=\"checkbox\" />\n <span aria-hidden=\"true\" className=\"chayns-switch__control\">\n <span className=\"chayns-switch__knob\" />\n </span>\n </label>\n );\n});\n\nexport default Switch;\n"],"mappings":";;;AAIA,IAAM,SAAS,WAA0C,SAAS,OAChE,EAAE,UAAU,WAAW,aAAa,GAAG,cACvC,KACA;CACA,MAAM,iBAAiB,CAAC,wBAAwB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEnF,OACE,qBAAC,SAAD;EAAO,WAAU;EAAjB,UAAA;GACE,qBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA,CACE,oBAAC,QAAD;KAAM,WAAU;KAAwB;IAAe,CAAA,GACtD,gBAAgB,KAAA,IACf,oBAAC,QAAD;KAAM,WAAU;KAA8B,UAAA;IAAkB,CAAA,IAC9D,IACA;;GACN,oBAAC,SAAD;IAAO,GAAI;IAAY,WAAW;IAAqB;IAAK,MAAK;GAAY,CAAA;GAC7E,oBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;IACjC,UAAA,oBAAC,QAAD,EAAM,WAAU,sBAAuB,CAAA;GACnC,CAAA;EACD;;AAEX,CAAC"}
1
+ {"version":3,"file":"Switch.js","names":[],"sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport type { SwitchProps } from './Switch.types.js';\n\nconst Switch = forwardRef<HTMLInputElement, SwitchProps>(function Switch(\n { children, className, description, ...inputProps },\n ref,\n) {\n const inputClassName = ['chayns-switch__input', className].filter(Boolean).join(' ');\n\n return (\n <label className=\"chayns-switch\">\n <span className=\"chayns-switch__content\">\n <span className=\"chayns-switch__label\">{children}</span>\n {description !== undefined ? (\n <span className=\"chayns-switch__description\">{description}</span>\n ) : null}\n </span>\n <input {...inputProps} className={inputClassName} ref={ref} type=\"checkbox\" />\n <span aria-hidden=\"true\" className=\"chayns-switch__control\">\n <span className=\"chayns-switch__knob\" />\n </span>\n </label>\n );\n});\n\nSwitch.displayName = 'Switch';\n\nexport default Switch;\n"],"mappings":";;;AAIA,IAAM,SAAS,WAA0C,SAAS,OAChE,EAAE,UAAU,WAAW,aAAa,GAAG,cACvC,KACA;CACA,MAAM,iBAAiB,CAAC,wBAAwB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEnF,OACE,qBAAC,SAAD;EAAO,WAAU;EAAjB,UAAA;GACE,qBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA,CACE,oBAAC,QAAD;KAAM,WAAU;KAAwB;IAAe,CAAA,GACtD,gBAAgB,KAAA,IACf,oBAAC,QAAD;KAAM,WAAU;KAA8B,UAAA;IAAkB,CAAA,IAC9D,IACA;;GACN,oBAAC,SAAD;IAAO,GAAI;IAAY,WAAW;IAAqB;IAAK,MAAK;GAAY,CAAA;GAC7E,oBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;IACjC,UAAA,oBAAC,QAAD,EAAM,WAAU,sBAAuB,CAAA;GACnC,CAAA;EACD;;AAEX,CAAC;AAED,OAAO,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,QAAA,MAAM,QAAQ,4HA2CZ,CAAC;AAEH,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,QAAA,MAAM,QAAQ,4HA2CZ,CAAC;AAIH,eAAe,QAAQ,CAAC"}
@@ -40,6 +40,7 @@ var TextArea = forwardRef(function TextArea({ className, counter, error, helpTex
40
40
  ]
41
41
  });
42
42
  });
43
+ TextArea.displayName = "TextArea";
43
44
  //#endregion
44
45
  export { TextArea as default };
45
46
 
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.js","names":[],"sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { forwardRef, useId } from 'react';\n\nimport type { TextAreaProps } from './TextArea.types.js';\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n { className, counter, error, helpText, id, placeholder, ...textareaProps },\n ref,\n) {\n const generatedId = useId();\n const textareaId = id ?? generatedId;\n const hasError = error !== undefined;\n const helpId = helpText !== undefined ? `${textareaId}-help` : undefined;\n const errorId = hasError ? `${textareaId}-error` : undefined;\n const describedBy = [helpId, errorId].filter(Boolean).join(' ') || undefined;\n const textareaClassName = ['chayns-text-area__input', className].filter(Boolean).join(' ');\n\n return (\n <div className={`chayns-text-area${hasError ? ' chayns-text-area--error' : ''}`}>\n <textarea\n {...textareaProps}\n aria-describedby={describedBy}\n aria-invalid={hasError || undefined}\n className={textareaClassName}\n id={textareaId}\n placeholder={placeholder === undefined ? undefined : ' '}\n ref={ref}\n />\n {placeholder !== undefined ? (\n <label className=\"chayns-text-area__label\" htmlFor={textareaId}>\n {placeholder}\n </label>\n ) : null}\n {helpText !== undefined || hasError || counter !== undefined ? (\n <div className=\"chayns-text-area__help\">\n <div>\n {helpText !== undefined ? <div id={helpId}>{helpText}</div> : null}\n {hasError ? (\n <div className=\"chayns-text-area__error\" id={errorId}>\n {error}\n </div>\n ) : null}\n </div>\n {counter !== undefined ? <div>{counter}</div> : null}\n </div>\n ) : null}\n </div>\n );\n});\n\nexport default TextArea;\n"],"mappings":";;;AAIA,IAAM,WAAW,WAA+C,SAAS,SACvE,EAAE,WAAW,SAAS,OAAO,UAAU,IAAI,aAAa,GAAG,iBAC3D,KACA;CACA,MAAM,cAAc,MAAM;CAC1B,MAAM,aAAa,MAAM;CACzB,MAAM,WAAW,UAAU,KAAA;CAC3B,MAAM,SAAS,aAAa,KAAA,IAAY,GAAG,WAAW,SAAS,KAAA;CAC/D,MAAM,UAAU,WAAW,GAAG,WAAW,UAAU,KAAA;CACnD,MAAM,cAAc,CAAC,QAAQ,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACnE,MAAM,oBAAoB,CAAC,2BAA2B,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEzF,OACE,qBAAC,OAAD;EAAK,WAAW,mBAAmB,WAAW,6BAA6B;EAA3E,UAAA;GACE,oBAAC,YAAD;IACE,GAAI;IACJ,oBAAkB;IAClB,gBAAc,YAAY,KAAA;IAC1B,WAAW;IACX,IAAI;IACJ,aAAa,gBAAgB,KAAA,IAAY,KAAA,IAAY;IAChD;GACN,CAAA;GACA,gBAAgB,KAAA,IACf,oBAAC,SAAD;IAAO,WAAU;IAA0B,SAAS;IACjD,UAAA;GACI,CAAA,IACL;GACH,aAAa,KAAA,KAAa,YAAY,YAAY,KAAA,IACjD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD,EAAA,UAAA,CACG,aAAa,KAAA,IAAY,oBAAC,OAAD;KAAK,IAAI;KAAS,UAAA;IAAc,CAAA,IAAI,MAC7D,WACC,oBAAC,OAAD;KAAK,WAAU;KAA0B,IAAI;KAC1C,UAAA;IACE,CAAA,IACH,IACD,EAAA,CAAA,GACJ,YAAY,KAAA,IAAY,oBAAC,OAAD,EAAA,UAAM,QAAa,CAAA,IAAI,IAC7C;GACH,CAAA,IAAA;EACD;;AAET,CAAC"}
1
+ {"version":3,"file":"TextArea.js","names":[],"sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { forwardRef, useId } from 'react';\n\nimport type { TextAreaProps } from './TextArea.types.js';\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n { className, counter, error, helpText, id, placeholder, ...textareaProps },\n ref,\n) {\n const generatedId = useId();\n const textareaId = id ?? generatedId;\n const hasError = error !== undefined;\n const helpId = helpText !== undefined ? `${textareaId}-help` : undefined;\n const errorId = hasError ? `${textareaId}-error` : undefined;\n const describedBy = [helpId, errorId].filter(Boolean).join(' ') || undefined;\n const textareaClassName = ['chayns-text-area__input', className].filter(Boolean).join(' ');\n\n return (\n <div className={`chayns-text-area${hasError ? ' chayns-text-area--error' : ''}`}>\n <textarea\n {...textareaProps}\n aria-describedby={describedBy}\n aria-invalid={hasError || undefined}\n className={textareaClassName}\n id={textareaId}\n placeholder={placeholder === undefined ? undefined : ' '}\n ref={ref}\n />\n {placeholder !== undefined ? (\n <label className=\"chayns-text-area__label\" htmlFor={textareaId}>\n {placeholder}\n </label>\n ) : null}\n {helpText !== undefined || hasError || counter !== undefined ? (\n <div className=\"chayns-text-area__help\">\n <div>\n {helpText !== undefined ? <div id={helpId}>{helpText}</div> : null}\n {hasError ? (\n <div className=\"chayns-text-area__error\" id={errorId}>\n {error}\n </div>\n ) : null}\n </div>\n {counter !== undefined ? <div>{counter}</div> : null}\n </div>\n ) : null}\n </div>\n );\n});\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":";;;AAIA,IAAM,WAAW,WAA+C,SAAS,SACvE,EAAE,WAAW,SAAS,OAAO,UAAU,IAAI,aAAa,GAAG,iBAC3D,KACA;CACA,MAAM,cAAc,MAAM;CAC1B,MAAM,aAAa,MAAM;CACzB,MAAM,WAAW,UAAU,KAAA;CAC3B,MAAM,SAAS,aAAa,KAAA,IAAY,GAAG,WAAW,SAAS,KAAA;CAC/D,MAAM,UAAU,WAAW,GAAG,WAAW,UAAU,KAAA;CACnD,MAAM,cAAc,CAAC,QAAQ,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACnE,MAAM,oBAAoB,CAAC,2BAA2B,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEzF,OACE,qBAAC,OAAD;EAAK,WAAW,mBAAmB,WAAW,6BAA6B;EAA3E,UAAA;GACE,oBAAC,YAAD;IACE,GAAI;IACJ,oBAAkB;IAClB,gBAAc,YAAY,KAAA;IAC1B,WAAW;IACX,IAAI;IACJ,aAAa,gBAAgB,KAAA,IAAY,KAAA,IAAY;IAChD;GACN,CAAA;GACA,gBAAgB,KAAA,IACf,oBAAC,SAAD;IAAO,WAAU;IAA0B,SAAS;IACjD,UAAA;GACI,CAAA,IACL;GACH,aAAa,KAAA,KAAa,YAAY,YAAY,KAAA,IACjD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD,EAAA,UAAA,CACG,aAAa,KAAA,IAAY,oBAAC,OAAD;KAAK,IAAI;KAAS,UAAA;IAAc,CAAA,IAAI,MAC7D,WACC,oBAAC,OAAD;KAAK,WAAU;KAA0B,IAAI;KAC1C,UAAA;IACE,CAAA,IACH,IACD,EAAA,CAAA,GACJ,YAAY,KAAA,IAAY,oBAAC,OAAD,EAAA,UAAM,QAAa,CAAA,IAAI,IAC7C;GACH,CAAA,IAAA;EACD;;AAET,CAAC;AAED,SAAS,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE3D,QAAA,MAAM,SAAS,0HA2Cb,CAAC;AAEH,eAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE3D,QAAA,MAAM,SAAS,0HA2Cb,CAAC;AAIH,eAAe,SAAS,CAAC"}
@@ -40,6 +40,7 @@ var TextField = forwardRef(function TextField({ className, counter, error, helpT
40
40
  ]
41
41
  });
42
42
  });
43
+ TextField.displayName = "TextField";
43
44
  //#endregion
44
45
  export { TextField as default };
45
46