@povio/ui 3.1.0 → 3.2.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 (301) hide show
  1. package/dist/assets/icons/AlignCenter.js +26 -11
  2. package/dist/assets/icons/AlignLeft.js +26 -11
  3. package/dist/assets/icons/AlignLeftRight.js +26 -11
  4. package/dist/assets/icons/AlignRight.js +26 -11
  5. package/dist/assets/icons/ArrowDropDown.js +26 -11
  6. package/dist/assets/icons/ArrowDropUp.js +26 -11
  7. package/dist/assets/icons/ArrowLeft.js +26 -11
  8. package/dist/assets/icons/ArrowRight.js +26 -11
  9. package/dist/assets/icons/Bold.js +26 -11
  10. package/dist/assets/icons/BulletedList.js +26 -11
  11. package/dist/assets/icons/Calendar.js +28 -13
  12. package/dist/assets/icons/Check.js +28 -13
  13. package/dist/assets/icons/CheckCircle.js +26 -11
  14. package/dist/assets/icons/CheckboxCheckmark.js +29 -14
  15. package/dist/assets/icons/CheckboxIndeterminate.js +29 -14
  16. package/dist/assets/icons/ChevronDown.js +28 -13
  17. package/dist/assets/icons/ChevronLeft.js +28 -13
  18. package/dist/assets/icons/ChevronRight.js +28 -13
  19. package/dist/assets/icons/ChevronUp.js +28 -13
  20. package/dist/assets/icons/ChevronsLeft.js +28 -13
  21. package/dist/assets/icons/ChevronsRight.js +28 -13
  22. package/dist/assets/icons/Clock.js +26 -11
  23. package/dist/assets/icons/Close.js +26 -11
  24. package/dist/assets/icons/DateTime.js +35 -14
  25. package/dist/assets/icons/DragIndicator.js +26 -11
  26. package/dist/assets/icons/File.js +28 -13
  27. package/dist/assets/icons/Highlight.js +26 -11
  28. package/dist/assets/icons/HighlightOn.js +49 -15
  29. package/dist/assets/icons/Home.js +26 -11
  30. package/dist/assets/icons/Info.js +37 -16
  31. package/dist/assets/icons/Italic.js +26 -11
  32. package/dist/assets/icons/Link.js +26 -11
  33. package/dist/assets/icons/Menu.js +26 -11
  34. package/dist/assets/icons/NumberedList.js +26 -11
  35. package/dist/assets/icons/PointerHorizontal.js +26 -11
  36. package/dist/assets/icons/PointerVertical.js +26 -11
  37. package/dist/assets/icons/Search.js +26 -11
  38. package/dist/assets/icons/Send.js +28 -13
  39. package/dist/assets/icons/Strikethrough.js +26 -11
  40. package/dist/assets/icons/TextColor.js +48 -14
  41. package/dist/assets/icons/Today.js +26 -11
  42. package/dist/assets/icons/Underlined.js +28 -13
  43. package/dist/assets/icons/Upload.js +35 -14
  44. package/dist/assets/icons/Visibility.js +26 -11
  45. package/dist/assets/icons/VisibilityOff.js +26 -11
  46. package/dist/assets/icons/WarningFilled.js +28 -13
  47. package/dist/components/Breadcrumbs/Breadcrumbs.js +207 -56
  48. package/dist/components/Menu/Menu.js +18 -2
  49. package/dist/components/Menu/MenuDesktop.js +41 -7
  50. package/dist/components/Menu/MenuItem.js +32 -9
  51. package/dist/components/Menu/MenuMobile.js +102 -39
  52. package/dist/components/Menu/MenuPopover.js +105 -29
  53. package/dist/components/buttons/Button/button.cva.d.ts +3 -3
  54. package/dist/components/buttons/IconButton/IconButton.js +40 -8
  55. package/dist/components/buttons/InlineIconButton/InlineIconButton.d.ts +2 -1
  56. package/dist/components/buttons/InlineIconButton/InlineIconButton.js +34 -9
  57. package/dist/components/buttons/PillButton/PillButton.js +55 -17
  58. package/dist/components/buttons/PillButton/pillButton.cva.d.ts +1 -1
  59. package/dist/components/buttons/SplitButton/SplitButton.js +103 -18
  60. package/dist/components/buttons/TextButton/TextButton.js +30 -8
  61. package/dist/components/buttons/ToggleButton/ToggleButton.js +28 -8
  62. package/dist/components/buttons/shared/ButtonContent.js +80 -22
  63. package/dist/components/inputs/Checkbox/Checkbox.d.ts +1 -0
  64. package/dist/components/inputs/Checkbox/Checkbox.js +201 -35
  65. package/dist/components/inputs/Checkbox/CheckboxCheckmark.js +24 -10
  66. package/dist/components/inputs/Checkbox/checkbox.cva.d.ts +3 -0
  67. package/dist/components/inputs/Checkbox/checkbox.cva.js +2 -1
  68. package/dist/components/inputs/DateTime/DatePicker/DatePicker.d.ts +12 -5
  69. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +380 -75
  70. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.d.ts +12 -5
  71. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +499 -186
  72. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.d.ts +14 -5
  73. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +280 -46
  74. package/dist/components/inputs/DateTime/TimePicker/TimePicker.d.ts +7 -3
  75. package/dist/components/inputs/DateTime/TimePicker/TimePicker.js +616 -121
  76. package/dist/components/inputs/DateTime/shared/Calendar.d.ts +5 -2
  77. package/dist/components/inputs/DateTime/shared/Calendar.js +342 -119
  78. package/dist/components/inputs/DateTime/shared/CalendarCell.d.ts +4 -2
  79. package/dist/components/inputs/DateTime/shared/CalendarCell.js +310 -103
  80. package/dist/components/inputs/DateTime/shared/CalendarGrid.d.ts +4 -2
  81. package/dist/components/inputs/DateTime/shared/CalendarGrid.js +150 -33
  82. package/dist/components/inputs/DateTime/shared/CalendarHeader.js +233 -98
  83. package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js +318 -137
  84. package/dist/components/inputs/DateTime/shared/DateField.d.ts +2 -1
  85. package/dist/components/inputs/DateTime/shared/DateField.js +288 -112
  86. package/dist/components/inputs/DateTime/shared/DatePickerInput.d.ts +14 -3
  87. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +359 -129
  88. package/dist/components/inputs/DateTime/shared/DateSegmentItem.d.ts +18 -1
  89. package/dist/components/inputs/DateTime/shared/DateSegmentItem.js +104 -11
  90. package/dist/components/inputs/DateTime/shared/DateTimeDialog.js +83 -28
  91. package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js +59 -10
  92. package/dist/components/inputs/DateTime/shared/MonthPicker.js +103 -58
  93. package/dist/components/inputs/DateTime/shared/RangeCalendar.js +193 -82
  94. package/dist/components/inputs/DateTime/shared/TimeField.js +27 -8
  95. package/dist/components/inputs/DateTime/shared/TimePickerForm.js +279 -110
  96. package/dist/components/inputs/DateTime/shared/TimePickerInput.d.ts +4 -1
  97. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +211 -65
  98. package/dist/components/inputs/DateTime/shared/YearPicker.js +119 -68
  99. package/dist/components/inputs/DateTime/shared/datePicker.types.d.ts +5 -0
  100. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.d.ts +16 -0
  101. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.js +16 -0
  102. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.d.ts +15 -0
  103. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.js +32 -0
  104. package/dist/components/inputs/DateTime/shared/dateSegment.utils.d.ts +2 -0
  105. package/dist/components/inputs/DateTime/shared/dateSegment.utils.spec.d.ts +1 -0
  106. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.d.ts +41 -0
  107. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.js +99 -0
  108. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.spec.d.ts +1 -0
  109. package/dist/components/inputs/File/FileUpload.js +91 -46
  110. package/dist/components/inputs/File/FileUploadContainer.js +15 -7
  111. package/dist/components/inputs/File/InputUpload.js +317 -79
  112. package/dist/components/inputs/File/index.d.ts +1 -1
  113. package/dist/components/inputs/File/shared/FileCard.js +104 -41
  114. package/dist/components/inputs/File/shared/FileCardList.js +47 -12
  115. package/dist/components/inputs/File/shared/FileUploadContent.js +175 -44
  116. package/dist/components/inputs/File/shared/FileUploadContentEmpty.js +149 -46
  117. package/dist/components/inputs/File/shared/FileUploadContentError.js +234 -93
  118. package/dist/components/inputs/File/shared/FileUploadContentFilled.js +230 -97
  119. package/dist/components/inputs/File/shared/FileUploadContentLoading.js +199 -55
  120. package/dist/components/inputs/File/shared/InputUploadContent.js +148 -34
  121. package/dist/components/inputs/File/shared/InputUploadFilled.js +49 -8
  122. package/dist/components/inputs/File/shared/ProgressBar.js +102 -15
  123. package/dist/components/inputs/File/shared/fileUpload.cva.d.ts +0 -11
  124. package/dist/components/inputs/File/shared/fileUpload.cva.js +1 -18
  125. package/dist/components/inputs/FormField/FormField.d.ts +3 -3
  126. package/dist/components/inputs/FormField/FormField.js +119 -37
  127. package/dist/components/inputs/FormField/FormFieldError.js +25 -5
  128. package/dist/components/inputs/FormField/FormFieldHeader.d.ts +2 -2
  129. package/dist/components/inputs/FormField/FormFieldHeader.js +81 -22
  130. package/dist/components/inputs/FormField/FormFieldHeaderClose.js +31 -7
  131. package/dist/components/inputs/FormField/FormFieldHelper.js +26 -6
  132. package/dist/components/inputs/FormField/FormFieldLabel.d.ts +2 -2
  133. package/dist/components/inputs/FormField/FormFieldLabel.js +40 -9
  134. package/dist/components/inputs/FormField/formFieldHeader.cva.d.ts +13 -0
  135. package/dist/components/inputs/FormField/formFieldHeader.cva.js +14 -0
  136. package/dist/components/inputs/Input/NumberInput/NumberInput.d.ts +5 -2
  137. package/dist/components/inputs/Input/NumberInput/NumberInput.js +446 -97
  138. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.d.ts +45 -0
  139. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.js +571 -0
  140. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.d.ts +35 -0
  141. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +574 -0
  142. package/dist/components/inputs/Input/PasswordInput/PasswordInput.js +48 -9
  143. package/dist/components/inputs/Input/TextArea/TextArea.cva.d.ts +8 -0
  144. package/dist/components/inputs/Input/TextArea/TextArea.cva.js +5 -0
  145. package/dist/components/inputs/Input/TextArea/TextArea.js +305 -90
  146. package/dist/components/inputs/Input/TextInput/TextInput.d.ts +3 -1
  147. package/dist/components/inputs/Input/TextInput/TextInput.js +429 -90
  148. package/dist/components/inputs/Input/shared/InputContent.js +193 -59
  149. package/dist/components/inputs/Input/shared/numberStatic.utils.d.ts +1 -0
  150. package/dist/components/inputs/Input/shared/numberStatic.utils.js +7 -0
  151. package/dist/components/inputs/Inputs/Form.js +40 -11
  152. package/dist/components/inputs/Inputs/InputItem.d.ts +15 -21
  153. package/dist/components/inputs/Inputs/InputItem.js +69 -14
  154. package/dist/components/inputs/Inputs/Inputs.js +37 -11
  155. package/dist/components/inputs/RadioGroup/RadioGroup.d.ts +3 -1
  156. package/dist/components/inputs/RadioGroup/RadioGroup.js +353 -61
  157. package/dist/components/inputs/RadioGroup/radio.cva.d.ts +45 -0
  158. package/dist/components/inputs/RadioGroup/radio.cva.js +48 -1
  159. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.d.ts +6 -2
  160. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +217 -22
  161. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.d.ts +3 -18
  162. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js +107 -8
  163. package/dist/components/inputs/Selection/Autocomplete/queryAutocomplete.types.d.ts +37 -0
  164. package/dist/components/inputs/Selection/Select/QuerySelect.d.ts +14 -0
  165. package/dist/components/inputs/Selection/Select/QuerySelect.js +178 -0
  166. package/dist/components/inputs/Selection/Select/Select.d.ts +7 -3
  167. package/dist/components/inputs/Selection/Select/Select.js +227 -18
  168. package/dist/components/inputs/Selection/shared/SelectBase.d.ts +8 -1
  169. package/dist/components/inputs/Selection/shared/SelectBase.js +69 -18
  170. package/dist/components/inputs/Selection/shared/SelectDesktop.d.ts +1 -1
  171. package/dist/components/inputs/Selection/shared/SelectDesktop.js +393 -138
  172. package/dist/components/inputs/Selection/shared/SelectInput.d.ts +2 -2
  173. package/dist/components/inputs/Selection/shared/SelectInput.js +397 -116
  174. package/dist/components/inputs/Selection/shared/SelectInputTags.js +99 -25
  175. package/dist/components/inputs/Selection/shared/SelectListBox.d.ts +2 -2
  176. package/dist/components/inputs/Selection/shared/SelectListBox.js +164 -52
  177. package/dist/components/inputs/Selection/shared/SelectListBoxItem.js +85 -35
  178. package/dist/components/inputs/Selection/shared/SelectListBoxItemSelectAll.js +69 -16
  179. package/dist/components/inputs/Selection/shared/SelectListBoxLoadingItem.js +70 -21
  180. package/dist/components/inputs/Selection/shared/SelectListBoxSelectionBar.js +58 -9
  181. package/dist/components/inputs/Selection/shared/SelectMobile.d.ts +1 -1
  182. package/dist/components/inputs/Selection/shared/SelectMobile.js +9 -3
  183. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.d.ts +9 -0
  184. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.js +47 -0
  185. package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts +14 -0
  186. package/dist/components/inputs/Selection/shared/querySelect.utils.js +43 -0
  187. package/dist/components/inputs/Selection/shared/select.context.d.ts +3 -2
  188. package/dist/components/inputs/Selection/shared/select.context.js +67 -36
  189. package/dist/components/inputs/Selection/shared/select.types.d.ts +3 -2
  190. package/dist/components/inputs/Selection/shared/selectDesktop.cva.d.ts +6 -0
  191. package/dist/components/inputs/Selection/shared/selectDesktop.cva.js +5 -0
  192. package/dist/components/inputs/Selection/shared/selectInput.cva.d.ts +12 -0
  193. package/dist/components/inputs/Selection/shared/selectInput.cva.js +8 -0
  194. package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts +23 -0
  195. package/dist/components/inputs/Selection/shared/staticSelect.utils.js +54 -0
  196. package/dist/components/inputs/Selection/shared/staticSelect.utils.spec.d.ts +1 -0
  197. package/dist/components/inputs/Selection/shared/useSelectItems.js +109 -49
  198. package/dist/components/inputs/Skeleton/InputFrame.d.ts +83 -0
  199. package/dist/components/inputs/Skeleton/InputFrame.js +612 -0
  200. package/dist/components/inputs/Slider/Slider.d.ts +2 -1
  201. package/dist/components/inputs/Slider/Slider.js +265 -76
  202. package/dist/components/inputs/TextEditor/TextEditor.d.ts +1 -0
  203. package/dist/components/inputs/TextEditor/TextEditor.js +447 -98
  204. package/dist/components/inputs/TextEditor/Toolbar/ColorPicker.js +37 -11
  205. package/dist/components/inputs/TextEditor/Toolbar/ColorPickerDropdown.js +102 -30
  206. package/dist/components/inputs/TextEditor/Toolbar/HyperlinkAction.js +194 -45
  207. package/dist/components/inputs/TextEditor/Toolbar/TextAlignSelect.js +88 -28
  208. package/dist/components/inputs/TextEditor/Toolbar/TextColorSelect.js +48 -14
  209. package/dist/components/inputs/TextEditor/Toolbar/TextEditorToolbar.js +66 -19
  210. package/dist/components/inputs/TextEditor/Toolbar/TextHighlightSelect.js +49 -15
  211. package/dist/components/inputs/TextEditor/Toolbar/TextListActions.js +92 -32
  212. package/dist/components/inputs/TextEditor/Toolbar/TextMarksActions.js +126 -54
  213. package/dist/components/inputs/TextEditor/Toolbar/TextStyleSelect.js +141 -38
  214. package/dist/components/inputs/Toggle/Toggle.d.ts +1 -0
  215. package/dist/components/inputs/Toggle/Toggle.js +214 -37
  216. package/dist/components/inputs/Toggle/toggle.cva.d.ts +3 -0
  217. package/dist/components/inputs/Toggle/toggle.cva.js +2 -1
  218. package/dist/components/inputs/shared/CheckContent.d.ts +2 -1
  219. package/dist/components/inputs/shared/CheckContent.js +21 -11
  220. package/dist/components/inputs/shared/InputClear.d.ts +2 -1
  221. package/dist/components/inputs/shared/InputClear.js +88 -12
  222. package/dist/components/inputs/shared/TooltipWrapper.js +50 -11
  223. package/dist/components/inputs/shared/input.cva.d.ts +28 -0
  224. package/dist/components/inputs/shared/input.cva.js +38 -4
  225. package/dist/components/inputs/shared/tooltipWrapper.cva.d.ts +8 -0
  226. package/dist/components/inputs/shared/tooltipWrapper.cva.js +5 -0
  227. package/dist/components/inputs/shared/useStaticInputHandoff.d.ts +15 -0
  228. package/dist/components/inputs/shared/useStaticInputHandoff.js +112 -0
  229. package/dist/components/navigation/Accordion/Accordion.js +69 -22
  230. package/dist/components/navigation/Accordion/AccordionItem.js +86 -41
  231. package/dist/components/navigation/Stepper/Stepper.js +67 -22
  232. package/dist/components/navigation/Stepper/StepperItem.js +104 -31
  233. package/dist/components/navigation/Stepper/StepperSeparator.js +23 -5
  234. package/dist/components/overlays/ActionModal/ActionModal.js +169 -35
  235. package/dist/components/overlays/BottomSheet/BottomSheet.js +96 -23
  236. package/dist/components/overlays/BottomSheet/BottomSheetHeader.js +48 -8
  237. package/dist/components/overlays/Drawer/Drawer.js +62 -20
  238. package/dist/components/overlays/ResponsivePopover/ResponsivePopover.js +85 -28
  239. package/dist/components/overlays/Tooltip/Tooltip.js +137 -28
  240. package/dist/components/overlays/Tooltip/TooltipEllipsis.js +37 -12
  241. package/dist/components/segment/Segment.js +218 -57
  242. package/dist/components/segment/SegmentItem.js +67 -10
  243. package/dist/components/shared/pagination/Pagination.js +108 -22
  244. package/dist/components/shared/pagination/PaginationList.js +167 -64
  245. package/dist/components/shared/pagination/minWidth.cva.d.ts +1 -1
  246. package/dist/components/status/Alert/Alert.js +97 -30
  247. package/dist/components/status/Loader/Loader.js +77 -22
  248. package/dist/components/status/Toast/Toast.js +28 -14
  249. package/dist/components/status/Toast/toast.cva.d.ts +1 -1
  250. package/dist/components/status/Toast/useToast.js +62 -57
  251. package/dist/components/table/ColumnConfig.js +158 -54
  252. package/dist/components/table/InfiniteTable.js +67 -16
  253. package/dist/components/table/PaginatedTable.js +84 -18
  254. package/dist/components/table/Table.js +28 -27
  255. package/dist/components/text/Link/Link.js +19 -7
  256. package/dist/components/text/Typography/Typography.js +23 -8
  257. package/dist/config/confirmation.context.js +1 -1
  258. package/dist/config/link.context.js +23 -9
  259. package/dist/config/router.context.js +42 -16
  260. package/dist/config/theme.context.js +98 -45
  261. package/dist/config/uiConfig.context.d.ts +20 -6
  262. package/dist/config/uiConfig.context.js +68 -14
  263. package/dist/config/uiOverrides.context.d.ts +30 -11
  264. package/dist/config/uiOverrides.context.js +54 -14
  265. package/dist/helpers/dynamicInputs.d.ts +12 -9
  266. package/dist/helpers/dynamicInputs.js +13 -8
  267. package/dist/hooks/useAutosave.d.ts +2 -1
  268. package/dist/hooks/useAutosave.js +12 -4
  269. package/dist/hooks/useAutosave.spec.d.ts +1 -0
  270. package/dist/hooks/useBreakpoint.js +16 -3
  271. package/dist/hooks/useDebounceCallback.js +51 -17
  272. package/dist/hooks/useFilters.js +125 -64
  273. package/dist/hooks/useForm.js +42 -8
  274. package/dist/hooks/useFormAutosave.d.ts +3 -1
  275. package/dist/hooks/useFormAutosave.js +122 -30
  276. package/dist/hooks/useFormAutosave.spec.d.ts +1 -0
  277. package/dist/hooks/useIntersectionObserver.d.ts +1 -1
  278. package/dist/hooks/useIntersectionObserver.js +91 -24
  279. package/dist/hooks/useKeyInteractions.d.ts +20 -0
  280. package/dist/hooks/useKeyInteractions.js +54 -0
  281. package/dist/hooks/useKeyInteractions.spec.d.ts +1 -0
  282. package/dist/hooks/useLocalStorage.js +43 -10
  283. package/dist/hooks/useLongPressRepeat.js +55 -20
  284. package/dist/hooks/usePagination.js +49 -19
  285. package/dist/hooks/useQueryAutocomplete.d.ts +14 -0
  286. package/dist/hooks/useQueryAutocomplete.js +72 -0
  287. package/dist/hooks/useScrollableListBox.js +37 -16
  288. package/dist/hooks/useSorting.js +69 -28
  289. package/dist/hooks/useStateAndRef.js +21 -7
  290. package/dist/hooks/useTableColumnConfig.js +124 -31
  291. package/dist/hooks/useTranslationMemo.js +25 -5
  292. package/dist/index.d.ts +18 -3
  293. package/dist/index.js +15 -5
  294. package/dist/tw-ui-plugin.js +6 -0
  295. package/dist/utils/date-time.utils.d.ts +38 -10
  296. package/dist/utils/date-time.utils.js +136 -22
  297. package/dist/utils/query.utils.d.ts +4 -0
  298. package/dist/utils/query.utils.js +8 -0
  299. package/dist/utils/zod.utils.d.ts +2 -0
  300. package/dist/utils/zod.utils.js +5 -0
  301. package/package.json +2 -2
@@ -3,10 +3,14 @@ import { UIConfig } from "../../../../config/uiConfig.context.js";
3
3
  import { inputBaseDefinition } from "../../shared/input.cva.js";
4
4
  import { FormField } from "../../FormField/FormField.js";
5
5
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
6
+ import { InputFrame } from "../../Skeleton/InputFrame.js";
7
+ import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
6
8
  import { InputContent } from "../shared/InputContent.js";
9
+ import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
10
+ import { c } from "react/compiler-runtime";
7
11
  import { jsx } from "react/jsx-runtime";
8
12
  import { clsx } from "clsx";
9
- import { useCallback, useRef } from "react";
13
+ import { useEffect, useRef, useState } from "react";
10
14
  import { Input, useLocale } from "react-aria-components";
11
15
  import { useFocusVisible, useNumberField } from "react-aria";
12
16
  import { mergeRefs } from "@react-aria/utils";
@@ -14,129 +18,474 @@ import { Controller } from "react-hook-form";
14
18
  import { useNumberFieldState } from "react-stately";
15
19
  //#region src/components/inputs/Input/NumberInput/NumberInput.tsx
16
20
  var NumberInputBase = (props) => {
21
+ const $ = c(90);
17
22
  const ui = UIConfig.useConfig();
18
23
  const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
24
+ const hasControlledValue = "value" in props;
19
25
  const inputRef = useRef(null);
20
- const { ref, inputClassName, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, className, unit, isLoading, action, leadingIcon, trailingIcon, value, onChange, onBlur, formatOptions = ui.numberInput.formatOptions, variant = ui.input.variant, as = ui.input.as, size = ui.input.size, hideLabel = ui.input.hideLabel, isClearable = ui.input.isClearable, ...rest } = props;
26
+ const { ref, inputClassName, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, className, unit, isLoading, action, leadingIcon, trailingIcon, value, onChange, onBlur, formatOptions: formatOptionsProp, variant: variantProp, as: asProp, size: sizeProp, hideLabel: hideLabelProp, isClearable: isClearableProp, autoFocusOnMount, ...rest } = props;
27
+ const formatOptions = formatOptionsProp ?? ui.numberInput.formatOptions;
28
+ const variant = variantProp ?? ui.input.variant;
29
+ const as = asProp ?? ui.input.as;
30
+ const size = sizeProp ?? ui.input.size;
31
+ const hideLabel = hideLabelProp ?? ui.input.hideLabel;
32
+ const isClearable = isClearableProp ?? ui.input.isClearable;
21
33
  const numberFieldRef = useRef(null);
22
34
  const { isFocusVisible } = useFocusVisible();
23
35
  const { locale } = useLocale();
36
+ let t0;
37
+ if ($[0] !== onChange) {
38
+ t0 = (nextValue) => onChange?.(Number.isNaN(nextValue) ? null : nextValue);
39
+ $[0] = onChange;
40
+ $[1] = t0;
41
+ } else t0 = $[1];
42
+ let t1;
43
+ if ($[2] !== onBlur) {
44
+ t1 = (e) => onBlur?.({ target: e.target });
45
+ $[2] = onBlur;
46
+ $[3] = t1;
47
+ } else t1 = $[3];
24
48
  const numberProps = {
25
49
  ...rest,
26
- value: value ?? void 0,
50
+ value: hasControlledValue ? value ?? NaN : void 0,
27
51
  label,
28
52
  isDisabled,
29
53
  isInvalid: !!error,
30
54
  isRequired,
31
- onChange,
32
- onBlur: (e) => onBlur?.({ target: e.target }),
55
+ onChange: t0,
56
+ onBlur: t1,
33
57
  locale,
34
58
  formatOptions
35
59
  };
36
60
  const state = useNumberFieldState(numberProps);
37
61
  const { labelProps, inputProps } = useNumberField(numberProps, state, numberFieldRef);
38
- const formFieldProps = {
39
- error,
40
- label,
41
- tooltipText,
42
- helperText,
43
- isRequired,
44
- rightContent,
45
- isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
46
- hideLabel,
47
- isDisabled,
48
- headerClassName,
49
- errorClassName
50
- };
51
- const handleInputBlur = useCallback((e) => {
52
- const target = numberFieldRef.current ?? e?.target;
53
- onBlur?.({ target });
54
- }, [onBlur]);
55
- const inputContentProps = {
56
- unit,
57
- isLoading,
58
- isDisabled,
59
- action,
60
- leadingIcon,
61
- trailingIcon,
62
- isClearable,
63
- onChange: (val) => {
62
+ let t2;
63
+ let t3;
64
+ if ($[4] !== autoFocusOnMount || $[5] !== isDisabled) {
65
+ t2 = () => {
66
+ if (!autoFocusOnMount || isDisabled) return;
67
+ requestAnimationFrame(() => inputRef.current?.focus());
68
+ };
69
+ t3 = [autoFocusOnMount, isDisabled];
70
+ $[4] = autoFocusOnMount;
71
+ $[5] = isDisabled;
72
+ $[6] = t2;
73
+ $[7] = t3;
74
+ } else {
75
+ t2 = $[6];
76
+ t3 = $[7];
77
+ }
78
+ useEffect(t2, t3);
79
+ const t4 = isHeaderHidden || as === "inline" || as === "filter" || as === "floating";
80
+ let t5;
81
+ if ($[8] !== error || $[9] !== errorClassName || $[10] !== headerClassName || $[11] !== helperText || $[12] !== hideLabel || $[13] !== isDisabled || $[14] !== isRequired || $[15] !== label || $[16] !== rightContent || $[17] !== t4 || $[18] !== tooltipText) {
82
+ t5 = {
83
+ error,
84
+ label,
85
+ tooltipText,
86
+ helperText,
87
+ isRequired,
88
+ rightContent,
89
+ isHeaderHidden: t4,
90
+ hideLabel,
91
+ isDisabled,
92
+ headerClassName,
93
+ errorClassName
94
+ };
95
+ $[8] = error;
96
+ $[9] = errorClassName;
97
+ $[10] = headerClassName;
98
+ $[11] = helperText;
99
+ $[12] = hideLabel;
100
+ $[13] = isDisabled;
101
+ $[14] = isRequired;
102
+ $[15] = label;
103
+ $[16] = rightContent;
104
+ $[17] = t4;
105
+ $[18] = tooltipText;
106
+ $[19] = t5;
107
+ } else t5 = $[19];
108
+ const formFieldProps = t5;
109
+ let t6;
110
+ if ($[20] !== onBlur) {
111
+ t6 = (e_0) => {
112
+ const target = numberFieldRef.current ?? e_0?.target;
113
+ onBlur?.({ target });
114
+ };
115
+ $[20] = onBlur;
116
+ $[21] = t6;
117
+ } else t6 = $[21];
118
+ const handleInputBlur = t6;
119
+ let t7;
120
+ if ($[22] !== onChange || $[23] !== state) {
121
+ t7 = (val) => {
64
122
  if (val === "") state.setInputValue("");
65
123
  onChange?.(val === "" ? null : Number(val));
66
- },
67
- value: state.inputValue,
68
- onBlur: handleInputBlur
69
- };
70
- const headerProps = {
71
- label,
72
- tooltipText,
73
- helperText,
74
- isRequired,
75
- rightContent,
76
- isHeaderHidden: hideLabel || isHeaderHidden,
77
- isDisabled,
78
- className: headerClassName,
79
- labelProps
80
- };
81
- return /* @__PURE__ */ jsx(TooltipWrapper, {
124
+ };
125
+ $[22] = onChange;
126
+ $[23] = state;
127
+ $[24] = t7;
128
+ } else t7 = $[24];
129
+ let t8;
130
+ if ($[25] !== action || $[26] !== handleInputBlur || $[27] !== isClearable || $[28] !== isDisabled || $[29] !== isLoading || $[30] !== leadingIcon || $[31] !== state.inputValue || $[32] !== t7 || $[33] !== trailingIcon || $[34] !== unit) {
131
+ t8 = {
132
+ unit,
133
+ isLoading,
134
+ isDisabled,
135
+ action,
136
+ leadingIcon,
137
+ trailingIcon,
138
+ isClearable,
139
+ onChange: t7,
140
+ value: state.inputValue,
141
+ onBlur: handleInputBlur
142
+ };
143
+ $[25] = action;
144
+ $[26] = handleInputBlur;
145
+ $[27] = isClearable;
146
+ $[28] = isDisabled;
147
+ $[29] = isLoading;
148
+ $[30] = leadingIcon;
149
+ $[31] = state.inputValue;
150
+ $[32] = t7;
151
+ $[33] = trailingIcon;
152
+ $[34] = unit;
153
+ $[35] = t8;
154
+ } else t8 = $[35];
155
+ const inputContentProps = t8;
156
+ const t9 = hideLabel || isHeaderHidden;
157
+ let t10;
158
+ if ($[36] !== headerClassName || $[37] !== helperText || $[38] !== isDisabled || $[39] !== isRequired || $[40] !== label || $[41] !== labelProps || $[42] !== rightContent || $[43] !== t9 || $[44] !== tooltipText) {
159
+ t10 = {
160
+ label,
161
+ tooltipText,
162
+ helperText,
163
+ isRequired,
164
+ rightContent,
165
+ isHeaderHidden: t9,
166
+ isDisabled,
167
+ className: headerClassName,
168
+ labelProps
169
+ };
170
+ $[36] = headerClassName;
171
+ $[37] = helperText;
172
+ $[38] = isDisabled;
173
+ $[39] = isRequired;
174
+ $[40] = label;
175
+ $[41] = labelProps;
176
+ $[42] = rightContent;
177
+ $[43] = t9;
178
+ $[44] = tooltipText;
179
+ $[45] = t10;
180
+ } else t10 = $[45];
181
+ const headerProps = t10;
182
+ const dataIsDisabled = isDisabled || void 0;
183
+ const T0 = TooltipWrapper;
184
+ const t11 = as === "inline" ? -1 : void 0;
185
+ const T1 = FormField;
186
+ let t12;
187
+ if ($[46] !== className) {
188
+ t12 = clsx("group w-full", className);
189
+ $[46] = className;
190
+ $[47] = t12;
191
+ } else t12 = $[47];
192
+ const t13 = as === "inline" ? -1 : void 0;
193
+ const t14 = clsx("relative flex cursor-text has-disabled:cursor-default", inputBaseCva({
194
+ variant,
82
195
  as,
83
- error,
84
- triggerTabIndex: as === "inline" ? -1 : void 0,
85
- children: /* @__PURE__ */ jsx(FormField, {
196
+ ...rest
197
+ }), inputClassName);
198
+ let t15;
199
+ if ($[48] === Symbol.for("react.memo_cache_sentinel")) {
200
+ t15 = () => inputRef.current?.focus();
201
+ $[48] = t15;
202
+ } else t15 = $[48];
203
+ const t16 = value === null || value === void 0 || void 0;
204
+ const t17 = isRequired || void 0;
205
+ let t18;
206
+ if ($[49] !== ref) {
207
+ t18 = mergeRefs(ref, inputRef, numberFieldRef);
208
+ $[49] = ref;
209
+ $[50] = t18;
210
+ } else t18 = $[50];
211
+ const t19 = isDirty || void 0;
212
+ const t20 = isRequired || void 0;
213
+ const t21 = state.inputValue === "" || state.inputValue === void 0 || state.inputValue === null || void 0;
214
+ const t22 = !("" + value === "" || value === null || value === void 0) || void 0;
215
+ const t23 = as === "floating" ? "\xA0" : inputProps.placeholder;
216
+ let t24;
217
+ if ($[51] !== inputProps || $[52] !== isFocusVisible) {
218
+ t24 = (e_1) => {
219
+ inputProps.onFocus?.(e_1);
220
+ if (isFocusVisible) e_1.target.select();
221
+ };
222
+ $[51] = inputProps;
223
+ $[52] = isFocusVisible;
224
+ $[53] = t24;
225
+ } else t24 = $[53];
226
+ let t25;
227
+ if ($[54] !== dataIsDisabled || $[55] !== inputProps || $[56] !== t18 || $[57] !== t19 || $[58] !== t20 || $[59] !== t21 || $[60] !== t22 || $[61] !== t23 || $[62] !== t24) {
228
+ t25 = /* @__PURE__ */ jsx(Input, {
229
+ ...inputProps,
230
+ ref: t18,
231
+ "data-is-dirty": t19,
232
+ "data-is-required": t20,
233
+ "data-is-empty": t21,
234
+ "data-is-filled": t22,
235
+ "data-is-disabled": dataIsDisabled,
236
+ placeholder: t23,
237
+ className: "w-full bg-transparent outline-none",
238
+ onFocus: t24
239
+ });
240
+ $[54] = dataIsDisabled;
241
+ $[55] = inputProps;
242
+ $[56] = t18;
243
+ $[57] = t19;
244
+ $[58] = t20;
245
+ $[59] = t21;
246
+ $[60] = t22;
247
+ $[61] = t23;
248
+ $[62] = t24;
249
+ $[63] = t25;
250
+ } else t25 = $[63];
251
+ let t26;
252
+ if ($[64] !== as || $[65] !== headerProps || $[66] !== inputContentProps || $[67] !== size || $[68] !== t25) {
253
+ t26 = /* @__PURE__ */ jsx(InputContent, {
254
+ ...inputContentProps,
255
+ headerProps,
256
+ as,
257
+ size,
258
+ children: t25
259
+ });
260
+ $[64] = as;
261
+ $[65] = headerProps;
262
+ $[66] = inputContentProps;
263
+ $[67] = size;
264
+ $[68] = t25;
265
+ $[69] = t26;
266
+ } else t26 = $[69];
267
+ let t27;
268
+ if ($[70] !== dataIsDisabled || $[71] !== t14 || $[72] !== t16 || $[73] !== t17 || $[74] !== t26) {
269
+ t27 = /* @__PURE__ */ jsx("div", {
270
+ className: t14,
271
+ onClick: t15,
272
+ "data-is-empty": t16,
273
+ "data-is-required": t17,
274
+ "data-is-disabled": dataIsDisabled,
275
+ children: t26
276
+ });
277
+ $[70] = dataIsDisabled;
278
+ $[71] = t14;
279
+ $[72] = t16;
280
+ $[73] = t17;
281
+ $[74] = t26;
282
+ $[75] = t27;
283
+ } else t27 = $[75];
284
+ let t28;
285
+ if ($[76] !== T1 || $[77] !== as || $[78] !== formFieldProps || $[79] !== labelProps || $[80] !== t12 || $[81] !== t13 || $[82] !== t27) {
286
+ t28 = /* @__PURE__ */ jsx(T1, {
86
287
  ...formFieldProps,
87
288
  as,
88
289
  labelProps,
89
- className: clsx("group w-full", className),
90
- tabIndex: as === "inline" ? -1 : void 0,
91
- children: /* @__PURE__ */ jsx("div", {
92
- className: clsx("relative flex cursor-text has-disabled:cursor-default", inputBaseCva({
93
- variant,
94
- as,
95
- ...rest
96
- }), inputClassName),
97
- onClick: () => inputRef.current?.focus(),
98
- children: /* @__PURE__ */ jsx(InputContent, {
99
- ...inputContentProps,
100
- headerProps,
101
- as,
102
- size,
103
- children: /* @__PURE__ */ jsx(Input, {
104
- ...inputProps,
105
- ref: mergeRefs(ref, inputRef, numberFieldRef),
106
- "data-is-dirty": isDirty || void 0,
107
- "data-is-required": isRequired || void 0,
108
- "data-is-empty": state.inputValue === "" || state.inputValue === void 0 || state.inputValue === null || void 0,
109
- placeholder: as === "floating" ? "\xA0" : inputProps.placeholder,
110
- className: "w-full outline-none",
111
- onFocus: (e) => {
112
- inputProps.onFocus?.(e);
113
- if (isFocusVisible) e.target.select();
114
- }
115
- })
116
- })
290
+ className: t12,
291
+ tabIndex: t13,
292
+ children: t27
293
+ });
294
+ $[76] = T1;
295
+ $[77] = as;
296
+ $[78] = formFieldProps;
297
+ $[79] = labelProps;
298
+ $[80] = t12;
299
+ $[81] = t13;
300
+ $[82] = t27;
301
+ $[83] = t28;
302
+ } else t28 = $[83];
303
+ let t29;
304
+ if ($[84] !== T0 || $[85] !== as || $[86] !== error || $[87] !== t11 || $[88] !== t28) {
305
+ t29 = /* @__PURE__ */ jsx(T0, {
306
+ as,
307
+ error,
308
+ triggerTabIndex: t11,
309
+ children: t28
310
+ });
311
+ $[84] = T0;
312
+ $[85] = as;
313
+ $[86] = error;
314
+ $[87] = t11;
315
+ $[88] = t28;
316
+ $[89] = t29;
317
+ } else t29 = $[89];
318
+ return t29;
319
+ };
320
+ var NumberInputInner = (t0) => {
321
+ const $ = c(9);
322
+ const { renderStaticInput, isFormControlDisabled, ...props } = t0;
323
+ const ui = UIConfig.useConfig();
324
+ const { locale } = useLocale();
325
+ const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
326
+ const inputRef = useRef(null);
327
+ let t1;
328
+ if ($[0] !== renderInput) {
329
+ t1 = {
330
+ inputRef,
331
+ renderInput,
332
+ setRenderInput
333
+ };
334
+ $[0] = renderInput;
335
+ $[1] = t1;
336
+ } else t1 = $[1];
337
+ const { shouldFocus, renderRealInput, replayStaticInputChange } = useStaticInputHandoff(t1);
338
+ if (!renderInput) {
339
+ const staticValue = props.value ?? props.defaultValue;
340
+ const formatOptions = props.formatOptions ?? ui.numberInput.formatOptions;
341
+ const displayValue = getStaticNumberDisplayValue(staticValue, new Intl.NumberFormat(locale, formatOptions)) ?? "";
342
+ const hasValue = displayValue !== "";
343
+ const as = props.as ?? ui.input.as;
344
+ let isDisabled = !!props.isDisabled;
345
+ if (isFormControlDisabled) isDisabled = true;
346
+ const dataAttributes = {
347
+ dataIsEmpty: !hasValue,
348
+ dataIsFilled: hasValue,
349
+ dataIsDirty: props.isDirty,
350
+ dataIsRequired: props.isRequired,
351
+ dataIsDisabled: isDisabled,
352
+ dataDisabled: isDisabled,
353
+ dataInvalid: !!props.error,
354
+ dataHasSelection: hasValue
355
+ };
356
+ const t2 = isDisabled;
357
+ const t3 = clsx("group w-full", as === "inline" && "h-full", props.className);
358
+ const t4 = props.inputClassName;
359
+ const t5 = as === "inline" && "h-full";
360
+ let t6;
361
+ if ($[2] !== t5) {
362
+ t6 = clsx(t5, "pr-0!");
363
+ $[2] = t5;
364
+ $[3] = t6;
365
+ } else t6 = $[3];
366
+ return /* @__PURE__ */ jsx(InputFrame, {
367
+ ...props,
368
+ isDisabled: t2,
369
+ className: t3,
370
+ dataAttributes,
371
+ onStaticInteract: renderRealInput,
372
+ inputClassName: t4,
373
+ contentClassName: t6,
374
+ trailingClassName: "py-0! pl-0!",
375
+ wrapContentAndTrailing: true,
376
+ reserveTrailingContent: true,
377
+ children: (dataAttributeProps) => /* @__PURE__ */ jsx("input", {
378
+ type: "text",
379
+ ref: inputRef,
380
+ disabled: isDisabled,
381
+ inputMode: "numeric",
382
+ tabIndex: -1,
383
+ value: displayValue,
384
+ placeholder: as === "floating" ? "" : props.placeholder,
385
+ className: "w-full bg-transparent outline-none",
386
+ onChange: (event) => replayStaticInputChange(event.target.value),
387
+ ...dataAttributeProps,
388
+ "data-rac": true
117
389
  })
118
- })
119
- });
390
+ });
391
+ }
392
+ const T0 = NumberInputBase;
393
+ const t2 = mergeRefs(props.ref, inputRef);
394
+ let t3;
395
+ if ($[4] !== T0 || $[5] !== props || $[6] !== shouldFocus || $[7] !== t2) {
396
+ t3 = /* @__PURE__ */ jsx(T0, {
397
+ ...props,
398
+ ref: t2,
399
+ autoFocusOnMount: shouldFocus
400
+ });
401
+ $[4] = T0;
402
+ $[5] = props;
403
+ $[6] = shouldFocus;
404
+ $[7] = t2;
405
+ $[8] = t3;
406
+ } else t3 = $[8];
407
+ return t3;
120
408
  };
121
- var NumberInput = (props) => {
409
+ var NumberInput = (t0) => {
410
+ const $ = c(21);
411
+ let props;
412
+ let renderStaticInput;
413
+ if ($[0] !== t0) {
414
+ ({renderStaticInput, ...props} = t0);
415
+ $[0] = t0;
416
+ $[1] = props;
417
+ $[2] = renderStaticInput;
418
+ } else {
419
+ props = $[1];
420
+ renderStaticInput = $[2];
421
+ }
122
422
  if ("formControl" in props && props.formControl) {
123
- const { formControl, ref, ...innerProps } = props;
124
- return /* @__PURE__ */ jsx(Controller, {
125
- control: formControl.control,
126
- name: formControl.name,
127
- render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(NumberInputBase, {
128
- ...innerProps,
129
- ref: mergeRefs(ref, field.ref),
130
- value: field.value,
131
- onChange: field.onChange,
132
- onBlur: field.onBlur,
133
- isDirty,
134
- isDisabled: field.disabled || props.isDisabled,
135
- error: props.error ?? error?.message
136
- }, field.value === null || field.value === void 0 ? "empty" : "filled")
137
- });
423
+ let formControl;
424
+ let innerProps;
425
+ let ref;
426
+ if ($[3] !== props) {
427
+ ({formControl, ref, ...innerProps} = props);
428
+ $[3] = props;
429
+ $[4] = formControl;
430
+ $[5] = innerProps;
431
+ $[6] = ref;
432
+ } else {
433
+ formControl = $[4];
434
+ innerProps = $[5];
435
+ ref = $[6];
436
+ }
437
+ const controlWithOptions = formControl.control;
438
+ let t1;
439
+ if ($[7] !== controlWithOptions._options?.disabled || $[8] !== innerProps || $[9] !== props.error || $[10] !== props.isDisabled || $[11] !== ref || $[12] !== renderStaticInput) {
440
+ t1 = (t2) => {
441
+ const { field, fieldState: t3 } = t2;
442
+ const { error, isDirty } = t3;
443
+ return /* @__PURE__ */ jsx(NumberInputInner, {
444
+ ...innerProps,
445
+ ref: mergeRefs(ref, field.ref),
446
+ value: field.value,
447
+ onChange: field.onChange,
448
+ onBlur: field.onBlur,
449
+ isDirty,
450
+ isDisabled: field.disabled || props.isDisabled,
451
+ isFormControlDisabled: !!controlWithOptions._options?.disabled,
452
+ error: props.error ?? error?.message,
453
+ renderStaticInput
454
+ });
455
+ };
456
+ $[7] = controlWithOptions._options?.disabled;
457
+ $[8] = innerProps;
458
+ $[9] = props.error;
459
+ $[10] = props.isDisabled;
460
+ $[11] = ref;
461
+ $[12] = renderStaticInput;
462
+ $[13] = t1;
463
+ } else t1 = $[13];
464
+ let t2;
465
+ if ($[14] !== formControl.control || $[15] !== formControl.name || $[16] !== t1) {
466
+ t2 = /* @__PURE__ */ jsx(Controller, {
467
+ control: formControl.control,
468
+ name: formControl.name,
469
+ render: t1
470
+ });
471
+ $[14] = formControl.control;
472
+ $[15] = formControl.name;
473
+ $[16] = t1;
474
+ $[17] = t2;
475
+ } else t2 = $[17];
476
+ return t2;
138
477
  }
139
- return /* @__PURE__ */ jsx(NumberInputBase, { ...props }, props.value === null || props.value === void 0 ? "empty" : "filled");
478
+ let t1;
479
+ if ($[18] !== props || $[19] !== renderStaticInput) {
480
+ t1 = /* @__PURE__ */ jsx(NumberInputInner, {
481
+ ...props,
482
+ renderStaticInput
483
+ });
484
+ $[18] = props;
485
+ $[19] = renderStaticInput;
486
+ $[20] = t1;
487
+ } else t1 = $[20];
488
+ return t1;
140
489
  };
141
490
  //#endregion
142
491
  export { NumberInput };
@@ -0,0 +1,45 @@
1
+ import { FocusEvent, HTMLAttributes, Ref } from 'react';
2
+ import { NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';
3
+ import { FormFieldProps } from '../../FormField/FormField';
4
+ import { FormFieldHeaderProps } from '../../FormField/FormFieldHeader';
5
+ import { InputVariantProps } from '../../shared/input.cva';
6
+ export interface NumberRangeValue {
7
+ min: number | null;
8
+ max: number | null;
9
+ }
10
+ type NumberRangeFieldInputProps = Omit<AriaNumberFieldProps, "className" | "defaultValue" | "label" | "maxValue" | "minValue" | "onBlur" | "onChange" | "value">;
11
+ export interface NumberRangeFieldProps extends NumberRangeFieldInputProps {
12
+ ref?: Ref<HTMLDivElement>;
13
+ as: InputVariantProps["as"];
14
+ className?: string;
15
+ inputClassName?: string;
16
+ minInputClassName?: string;
17
+ maxInputClassName?: string;
18
+ inputBaseClassName: string;
19
+ inputSizeClassName: string;
20
+ formFieldProps: FormFieldProps;
21
+ headerProps: FormFieldHeaderProps;
22
+ rangeValue: NumberRangeValue;
23
+ effectiveError?: string;
24
+ minPlaceholder: string;
25
+ maxPlaceholder: string;
26
+ minLabel: string;
27
+ maxLabel: string;
28
+ hideInnerLabels?: boolean;
29
+ isDirty?: boolean;
30
+ isClearable?: boolean;
31
+ autoFocusOnMount?: boolean;
32
+ isDisabled?: boolean;
33
+ isRequired?: boolean;
34
+ isEmpty: boolean;
35
+ isHovered: boolean;
36
+ isFocused: boolean;
37
+ isFocusVisible: boolean;
38
+ focusWithinProps: HTMLAttributes<HTMLElement>;
39
+ hoverProps: HTMLAttributes<HTMLElement>;
40
+ onRangeSideChange: (side: keyof NumberRangeValue, nextValue: number | null) => void;
41
+ onRangeSideClear: (side: keyof NumberRangeValue) => void;
42
+ onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
43
+ }
44
+ export declare const NumberRangeField: ({ ref, as, className, inputClassName, minInputClassName, maxInputClassName, inputBaseClassName, inputSizeClassName, formFieldProps, headerProps, rangeValue, effectiveError, minPlaceholder, maxPlaceholder, minLabel, maxLabel, hideInnerLabels, isDirty, isClearable, autoFocusOnMount, isDisabled, isRequired, isEmpty, isHovered, isFocused, isFocusVisible, focusWithinProps, hoverProps, onRangeSideChange, onRangeSideClear, onBlur, ...numberFieldProps }: NumberRangeFieldProps) => import("react/jsx-runtime").JSX.Element;
45
+ export {};