@povio/ui 2.3.2 → 3.0.0-rc.1

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 (352) 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/assets/locales/sl/translation.json.js +2 -2
  48. package/dist/components/Breadcrumbs/Breadcrumbs.js +215 -64
  49. package/dist/components/Breadcrumbs/breadcrumbs.cva.d.ts +40 -14
  50. package/dist/components/Breadcrumbs/breadcrumbs.cva.js +21 -18
  51. package/dist/components/Menu/Menu.js +18 -2
  52. package/dist/components/Menu/MenuDesktop.js +41 -7
  53. package/dist/components/Menu/MenuItem.js +35 -12
  54. package/dist/components/Menu/MenuMobile.js +103 -44
  55. package/dist/components/Menu/MenuPopover.js +110 -34
  56. package/dist/components/Menu/menu.cva.d.ts +35 -13
  57. package/dist/components/Menu/menu.cva.js +30 -24
  58. package/dist/components/buttons/Button/Button.js +7 -7
  59. package/dist/components/buttons/Button/button.cva.d.ts +95 -26
  60. package/dist/components/buttons/Button/button.cva.js +601 -589
  61. package/dist/components/buttons/IconButton/IconButton.js +40 -8
  62. package/dist/components/buttons/InlineIconButton/InlineIconButton.d.ts +2 -1
  63. package/dist/components/buttons/InlineIconButton/InlineIconButton.js +34 -9
  64. package/dist/components/buttons/PillButton/PillButton.js +59 -21
  65. package/dist/components/buttons/PillButton/pillButton.cva.d.ts +33 -9
  66. package/dist/components/buttons/PillButton/pillButton.cva.js +247 -239
  67. package/dist/components/buttons/SplitButton/SplitButton.js +103 -18
  68. package/dist/components/buttons/TextButton/TextButton.js +30 -8
  69. package/dist/components/buttons/ToggleButton/ToggleButton.js +28 -8
  70. package/dist/components/buttons/shared/ButtonContent.js +83 -25
  71. package/dist/components/buttons/shared/buttonContent.cva.d.ts +3 -5
  72. package/dist/components/buttons/shared/buttonContent.cva.js +1 -8
  73. package/dist/components/inputs/Checkbox/Checkbox.d.ts +1 -0
  74. package/dist/components/inputs/Checkbox/Checkbox.js +203 -37
  75. package/dist/components/inputs/Checkbox/CheckboxCheckmark.js +28 -14
  76. package/dist/components/inputs/Checkbox/checkbox.cva.d.ts +26 -10
  77. package/dist/components/inputs/Checkbox/checkbox.cva.js +47 -40
  78. package/dist/components/inputs/DateTime/DatePicker/DatePicker.d.ts +12 -5
  79. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +371 -75
  80. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.d.ts +12 -5
  81. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +596 -218
  82. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.d.ts +13 -5
  83. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +267 -47
  84. package/dist/components/inputs/DateTime/TimePicker/TimePicker.d.ts +7 -3
  85. package/dist/components/inputs/DateTime/TimePicker/TimePicker.js +611 -121
  86. package/dist/components/inputs/DateTime/shared/Calendar.d.ts +5 -2
  87. package/dist/components/inputs/DateTime/shared/Calendar.js +338 -119
  88. package/dist/components/inputs/DateTime/shared/CalendarCell.d.ts +4 -2
  89. package/dist/components/inputs/DateTime/shared/CalendarCell.js +310 -103
  90. package/dist/components/inputs/DateTime/shared/CalendarGrid.d.ts +4 -2
  91. package/dist/components/inputs/DateTime/shared/CalendarGrid.js +150 -33
  92. package/dist/components/inputs/DateTime/shared/CalendarHeader.js +249 -93
  93. package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js +318 -137
  94. package/dist/components/inputs/DateTime/shared/DateField.js +286 -112
  95. package/dist/components/inputs/DateTime/shared/DatePickerInput.d.ts +13 -3
  96. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +387 -143
  97. package/dist/components/inputs/DateTime/shared/DateSegmentItem.d.ts +15 -0
  98. package/dist/components/inputs/DateTime/shared/DateSegmentItem.js +96 -11
  99. package/dist/components/inputs/DateTime/shared/DateTimeDialog.js +84 -30
  100. package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js +59 -10
  101. package/dist/components/inputs/DateTime/shared/MonthPicker.js +103 -58
  102. package/dist/components/inputs/DateTime/shared/RangeCalendar.js +193 -82
  103. package/dist/components/inputs/DateTime/shared/TimeField.js +27 -8
  104. package/dist/components/inputs/DateTime/shared/TimePickerForm.js +279 -110
  105. package/dist/components/inputs/DateTime/shared/TimePickerInput.d.ts +4 -1
  106. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +214 -69
  107. package/dist/components/inputs/DateTime/shared/YearPicker.js +119 -68
  108. package/dist/components/inputs/DateTime/shared/datePicker.types.d.ts +5 -0
  109. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.d.ts +27 -0
  110. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.js +15 -0
  111. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.d.ts +15 -0
  112. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.js +32 -0
  113. package/dist/components/inputs/DateTime/shared/dateSegment.utils.d.ts +2 -0
  114. package/dist/components/inputs/DateTime/shared/dateSegment.utils.spec.d.ts +1 -0
  115. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.d.ts +40 -0
  116. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.js +85 -0
  117. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.spec.d.ts +1 -0
  118. package/dist/components/inputs/File/FileUpload.js +87 -44
  119. package/dist/components/inputs/File/FileUploadContainer.js +15 -7
  120. package/dist/components/inputs/File/InputUpload.js +317 -79
  121. package/dist/components/inputs/File/shared/FileCard.js +104 -41
  122. package/dist/components/inputs/File/shared/FileCardList.js +47 -12
  123. package/dist/components/inputs/File/shared/FileUploadContent.js +175 -44
  124. package/dist/components/inputs/File/shared/FileUploadContentEmpty.js +149 -46
  125. package/dist/components/inputs/File/shared/FileUploadContentError.js +234 -93
  126. package/dist/components/inputs/File/shared/FileUploadContentFilled.js +230 -97
  127. package/dist/components/inputs/File/shared/FileUploadContentLoading.js +199 -55
  128. package/dist/components/inputs/File/shared/InputUploadContent.js +151 -37
  129. package/dist/components/inputs/File/shared/InputUploadFilled.js +51 -10
  130. package/dist/components/inputs/File/shared/ProgressBar.js +48 -9
  131. package/dist/components/inputs/File/shared/fileUpload.cva.d.ts +26 -9
  132. package/dist/components/inputs/File/shared/fileUpload.cva.js +48 -40
  133. package/dist/components/inputs/File/shared/inputUploadButton.cva.d.ts +23 -6
  134. package/dist/components/inputs/File/shared/inputUploadButton.cva.js +29 -20
  135. package/dist/components/inputs/FormField/FormField.d.ts +3 -3
  136. package/dist/components/inputs/FormField/FormField.js +119 -37
  137. package/dist/components/inputs/FormField/FormFieldError.js +27 -7
  138. package/dist/components/inputs/FormField/FormFieldHeader.d.ts +2 -2
  139. package/dist/components/inputs/FormField/FormFieldHeader.js +81 -22
  140. package/dist/components/inputs/FormField/FormFieldHeaderClose.js +31 -7
  141. package/dist/components/inputs/FormField/FormFieldHelper.js +28 -8
  142. package/dist/components/inputs/FormField/FormFieldLabel.d.ts +2 -2
  143. package/dist/components/inputs/FormField/FormFieldLabel.js +46 -15
  144. package/dist/components/inputs/FormField/formFieldError.cva.d.ts +12 -5
  145. package/dist/components/inputs/FormField/formFieldError.cva.js +11 -8
  146. package/dist/components/inputs/FormField/formFieldHeader.cva.d.ts +22 -0
  147. package/dist/components/inputs/FormField/formFieldHeader.cva.js +13 -0
  148. package/dist/components/inputs/FormField/formFieldHelper.cva.d.ts +12 -5
  149. package/dist/components/inputs/FormField/formFieldHelper.cva.js +11 -8
  150. package/dist/components/inputs/Input/NumberInput/NumberInput.d.ts +5 -2
  151. package/dist/components/inputs/Input/NumberInput/NumberInput.js +450 -100
  152. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.d.ts +45 -0
  153. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.js +571 -0
  154. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.d.ts +35 -0
  155. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +575 -0
  156. package/dist/components/inputs/Input/PasswordInput/PasswordInput.js +48 -9
  157. package/dist/components/inputs/Input/TextArea/TextArea.cva.d.ts +12 -0
  158. package/dist/components/inputs/Input/TextArea/TextArea.cva.js +4 -0
  159. package/dist/components/inputs/Input/TextArea/TextArea.js +309 -94
  160. package/dist/components/inputs/Input/TextInput/TextInput.d.ts +3 -1
  161. package/dist/components/inputs/Input/TextInput/TextInput.js +422 -93
  162. package/dist/components/inputs/Input/shared/InputContent.js +196 -63
  163. package/dist/components/inputs/Input/shared/numberStatic.utils.d.ts +1 -0
  164. package/dist/components/inputs/Input/shared/numberStatic.utils.js +7 -0
  165. package/dist/components/inputs/Inputs/Form.js +40 -11
  166. package/dist/components/inputs/Inputs/InputItem.d.ts +15 -21
  167. package/dist/components/inputs/Inputs/InputItem.js +69 -14
  168. package/dist/components/inputs/Inputs/Inputs.js +37 -11
  169. package/dist/components/inputs/RadioGroup/RadioGroup.d.ts +3 -1
  170. package/dist/components/inputs/RadioGroup/RadioGroup.js +356 -64
  171. package/dist/components/inputs/RadioGroup/radio.cva.d.ts +101 -6
  172. package/dist/components/inputs/RadioGroup/radio.cva.js +74 -24
  173. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.d.ts +6 -2
  174. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +214 -22
  175. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.d.ts +3 -18
  176. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js +104 -8
  177. package/dist/components/inputs/Selection/Autocomplete/queryAutocomplete.types.d.ts +36 -0
  178. package/dist/components/inputs/Selection/Select/QuerySelect.d.ts +14 -0
  179. package/dist/components/inputs/Selection/Select/QuerySelect.js +173 -0
  180. package/dist/components/inputs/Selection/Select/Select.d.ts +7 -3
  181. package/dist/components/inputs/Selection/Select/Select.js +225 -18
  182. package/dist/components/inputs/Selection/shared/SelectBase.d.ts +8 -1
  183. package/dist/components/inputs/Selection/shared/SelectBase.js +69 -18
  184. package/dist/components/inputs/Selection/shared/SelectDesktop.d.ts +1 -1
  185. package/dist/components/inputs/Selection/shared/SelectDesktop.js +396 -141
  186. package/dist/components/inputs/Selection/shared/SelectInput.d.ts +2 -2
  187. package/dist/components/inputs/Selection/shared/SelectInput.js +398 -119
  188. package/dist/components/inputs/Selection/shared/SelectInputTags.js +99 -25
  189. package/dist/components/inputs/Selection/shared/SelectListBox.d.ts +2 -2
  190. package/dist/components/inputs/Selection/shared/SelectListBox.js +164 -52
  191. package/dist/components/inputs/Selection/shared/SelectListBoxItem.js +88 -38
  192. package/dist/components/inputs/Selection/shared/SelectListBoxItemSelectAll.js +72 -19
  193. package/dist/components/inputs/Selection/shared/SelectListBoxLoadingItem.js +73 -24
  194. package/dist/components/inputs/Selection/shared/SelectListBoxSelectionBar.js +58 -9
  195. package/dist/components/inputs/Selection/shared/SelectMobile.d.ts +1 -1
  196. package/dist/components/inputs/Selection/shared/SelectMobile.js +9 -3
  197. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.d.ts +9 -0
  198. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.js +47 -0
  199. package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts +12 -0
  200. package/dist/components/inputs/Selection/shared/querySelect.utils.js +36 -0
  201. package/dist/components/inputs/Selection/shared/select.context.d.ts +3 -2
  202. package/dist/components/inputs/Selection/shared/select.context.js +67 -36
  203. package/dist/components/inputs/Selection/shared/select.types.d.ts +3 -2
  204. package/dist/components/inputs/Selection/shared/selectDesktop.cva.d.ts +10 -0
  205. package/dist/components/inputs/Selection/shared/selectDesktop.cva.js +4 -0
  206. package/dist/components/inputs/Selection/shared/selectInput.cva.d.ts +5 -0
  207. package/dist/components/inputs/Selection/shared/selectInput.cva.js +5 -0
  208. package/dist/components/inputs/Selection/shared/selectItem.cva.d.ts +16 -6
  209. package/dist/components/inputs/Selection/shared/selectItem.cva.js +21 -18
  210. package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts +23 -0
  211. package/dist/components/inputs/Selection/shared/staticSelect.utils.js +37 -0
  212. package/dist/components/inputs/Selection/shared/staticSelect.utils.spec.d.ts +1 -0
  213. package/dist/components/inputs/Selection/shared/useSelectItems.js +109 -49
  214. package/dist/components/inputs/Skeleton/InputFrame.d.ts +82 -0
  215. package/dist/components/inputs/Skeleton/InputFrame.js +548 -0
  216. package/dist/components/inputs/Slider/Slider.d.ts +2 -1
  217. package/dist/components/inputs/Slider/Slider.js +265 -76
  218. package/dist/components/inputs/TextEditor/TextEditor.d.ts +1 -0
  219. package/dist/components/inputs/TextEditor/TextEditor.js +450 -101
  220. package/dist/components/inputs/TextEditor/Toolbar/ColorPicker.js +37 -11
  221. package/dist/components/inputs/TextEditor/Toolbar/ColorPickerDropdown.js +105 -33
  222. package/dist/components/inputs/TextEditor/Toolbar/HyperlinkAction.js +194 -45
  223. package/dist/components/inputs/TextEditor/Toolbar/TextAlignSelect.js +88 -28
  224. package/dist/components/inputs/TextEditor/Toolbar/TextColorSelect.js +48 -14
  225. package/dist/components/inputs/TextEditor/Toolbar/TextEditorToolbar.js +66 -19
  226. package/dist/components/inputs/TextEditor/Toolbar/TextHighlightSelect.js +49 -15
  227. package/dist/components/inputs/TextEditor/Toolbar/TextListActions.js +92 -32
  228. package/dist/components/inputs/TextEditor/Toolbar/TextMarksActions.js +126 -54
  229. package/dist/components/inputs/TextEditor/Toolbar/TextStyleSelect.js +141 -38
  230. package/dist/components/inputs/Toggle/Toggle.d.ts +1 -0
  231. package/dist/components/inputs/Toggle/Toggle.js +217 -40
  232. package/dist/components/inputs/Toggle/toggle.cva.d.ts +15 -6
  233. package/dist/components/inputs/Toggle/toggle.cva.js +25 -21
  234. package/dist/components/inputs/shared/CheckContent.d.ts +2 -1
  235. package/dist/components/inputs/shared/CheckContent.js +23 -13
  236. package/dist/components/inputs/shared/InputClear.d.ts +2 -1
  237. package/dist/components/inputs/shared/InputClear.js +88 -12
  238. package/dist/components/inputs/shared/TooltipWrapper.js +50 -11
  239. package/dist/components/inputs/shared/input.cva.d.ts +137 -16
  240. package/dist/components/inputs/shared/input.cva.js +317 -273
  241. package/dist/components/inputs/shared/label.cva.d.ts +15 -6
  242. package/dist/components/inputs/shared/label.cva.js +28 -25
  243. package/dist/components/inputs/shared/tooltipWrapper.cva.d.ts +12 -0
  244. package/dist/components/inputs/shared/tooltipWrapper.cva.js +4 -0
  245. package/dist/components/inputs/shared/useStaticInputHandoff.d.ts +14 -0
  246. package/dist/components/inputs/shared/useStaticInputHandoff.js +100 -0
  247. package/dist/components/navigation/Accordion/Accordion.js +71 -24
  248. package/dist/components/navigation/Accordion/AccordionItem.js +97 -52
  249. package/dist/components/navigation/Accordion/accordion.cva.d.ts +109 -44
  250. package/dist/components/navigation/Accordion/accordion.cva.js +114 -84
  251. package/dist/components/navigation/Stepper/Stepper.js +69 -24
  252. package/dist/components/navigation/Stepper/StepperItem.js +112 -39
  253. package/dist/components/navigation/Stepper/StepperSeparator.js +25 -7
  254. package/dist/components/navigation/Stepper/stepper.cva.d.ts +86 -30
  255. package/dist/components/navigation/Stepper/stepper.cva.js +104 -83
  256. package/dist/components/overlays/ActionModal/ActionModal.js +169 -35
  257. package/dist/components/overlays/BottomSheet/BottomSheet.js +96 -23
  258. package/dist/components/overlays/BottomSheet/BottomSheetHeader.js +48 -8
  259. package/dist/components/overlays/Drawer/Drawer.js +62 -20
  260. package/dist/components/overlays/Modal/Modal.js +5 -5
  261. package/dist/components/overlays/Modal/modal.cva.d.ts +34 -9
  262. package/dist/components/overlays/Modal/modal.cva.js +38 -27
  263. package/dist/components/overlays/ResponsivePopover/ResponsivePopover.js +86 -30
  264. package/dist/components/overlays/Tooltip/Tooltip.js +143 -34
  265. package/dist/components/overlays/Tooltip/TooltipEllipsis.js +37 -12
  266. package/dist/components/overlays/Tooltip/tooltip.cva.d.ts +45 -17
  267. package/dist/components/overlays/Tooltip/tooltip.cva.js +38 -26
  268. package/dist/components/segment/Segment.js +221 -60
  269. package/dist/components/segment/SegmentItem.js +70 -13
  270. package/dist/components/segment/segment.cva.d.ts +18 -7
  271. package/dist/components/segment/segment.cva.js +24 -21
  272. package/dist/components/shared/pagination/Pagination.js +108 -22
  273. package/dist/components/shared/pagination/PaginationList.js +167 -64
  274. package/dist/components/shared/popover.cva.d.ts +7 -3
  275. package/dist/components/shared/popover.cva.js +3 -3
  276. package/dist/components/status/Alert/Alert.js +103 -36
  277. package/dist/components/status/Alert/alert.cva.d.ts +18 -6
  278. package/dist/components/status/Alert/alert.cva.js +60 -57
  279. package/dist/components/status/Loader/Loader.js +77 -22
  280. package/dist/components/status/Loader/loader.cva.d.ts +23 -4
  281. package/dist/components/status/Loader/loader.cva.js +22 -13
  282. package/dist/components/status/Toast/Toast.js +27 -20
  283. package/dist/components/status/Toast/toast.cva.d.ts +61 -10
  284. package/dist/components/status/Toast/toast.cva.js +129 -64
  285. package/dist/components/status/Toast/useToast.js +62 -57
  286. package/dist/components/status/shared/status.cva.d.ts +30 -8
  287. package/dist/components/status/shared/status.cva.js +56 -50
  288. package/dist/components/table/CellText.js +3 -3
  289. package/dist/components/table/ColumnConfig.js +158 -54
  290. package/dist/components/table/HeaderText.js +3 -3
  291. package/dist/components/table/InfiniteTable.js +67 -16
  292. package/dist/components/table/PaginatedTable.js +84 -18
  293. package/dist/components/table/Table.js +34 -33
  294. package/dist/components/table/table.cva.d.ts +52 -19
  295. package/dist/components/table/table.cva.js +44 -35
  296. package/dist/components/text/Link/Link.js +22 -10
  297. package/dist/components/text/Link/link.cva.d.ts +11 -5
  298. package/dist/components/text/Link/link.cva.js +8 -5
  299. package/dist/components/text/Tag/Tag.js +3 -3
  300. package/dist/components/text/Tag/tag.cva.d.ts +15 -5
  301. package/dist/components/text/Tag/tag.cva.js +51 -48
  302. package/dist/components/text/Typography/Typography.js +25 -10
  303. package/dist/components/text/Typography/typography.cva.d.ts +93 -7
  304. package/dist/components/text/Typography/typography.cva.js +126 -122
  305. package/dist/config/confirmation.context.js +1 -1
  306. package/dist/config/link.context.js +23 -9
  307. package/dist/config/router.context.js +42 -16
  308. package/dist/config/theme.context.js +98 -45
  309. package/dist/config/uiConfig.context.d.ts +20 -6
  310. package/dist/config/uiConfig.context.js +68 -14
  311. package/dist/config/uiOverrides.context.d.ts +192 -0
  312. package/dist/config/uiOverrides.context.js +113 -0
  313. package/dist/helpers/dynamicInputs.d.ts +5 -5
  314. package/dist/helpers/dynamicInputs.js +3 -0
  315. package/dist/hooks/useAutosave.d.ts +2 -1
  316. package/dist/hooks/useAutosave.js +12 -4
  317. package/dist/hooks/useAutosave.spec.d.ts +1 -0
  318. package/dist/hooks/useBreakpoint.js +16 -3
  319. package/dist/hooks/useDebounceCallback.js +51 -17
  320. package/dist/hooks/useFilters.js +125 -64
  321. package/dist/hooks/useForm.js +42 -8
  322. package/dist/hooks/useFormAutosave.d.ts +3 -1
  323. package/dist/hooks/useFormAutosave.js +122 -30
  324. package/dist/hooks/useFormAutosave.spec.d.ts +1 -0
  325. package/dist/hooks/useIntersectionObserver.d.ts +1 -1
  326. package/dist/hooks/useIntersectionObserver.js +91 -24
  327. package/dist/hooks/useKeyInteractions.d.ts +20 -0
  328. package/dist/hooks/useKeyInteractions.js +54 -0
  329. package/dist/hooks/useKeyInteractions.spec.d.ts +1 -0
  330. package/dist/hooks/useLocalStorage.js +43 -10
  331. package/dist/hooks/useLongPressRepeat.js +55 -20
  332. package/dist/hooks/usePagination.js +49 -19
  333. package/dist/hooks/useQueryAutocomplete.d.ts +14 -0
  334. package/dist/hooks/useQueryAutocomplete.js +57 -0
  335. package/dist/hooks/useScrollableListBox.js +37 -16
  336. package/dist/hooks/useSorting.js +69 -28
  337. package/dist/hooks/useStateAndRef.js +21 -7
  338. package/dist/hooks/useTableColumnConfig.js +124 -31
  339. package/dist/hooks/useTranslationMemo.js +25 -5
  340. package/dist/index.d.ts +37 -1
  341. package/dist/index.js +34 -3
  342. package/dist/tw-ui-plugin.js +6 -0
  343. package/dist/utils/date-time.utils.d.ts +38 -10
  344. package/dist/utils/date-time.utils.js +136 -22
  345. package/dist/utils/query.utils.d.ts +4 -0
  346. package/dist/utils/query.utils.js +8 -0
  347. package/dist/utils/style-merge.util.d.ts +43 -0
  348. package/dist/utils/style-merge.util.js +233 -0
  349. package/dist/utils/style-merge.util.spec.d.ts +1 -0
  350. package/package.json +1 -1
  351. package/dist/config/uiStyle.context.d.ts +0 -162
  352. package/dist/config/uiStyle.context.js +0 -30
@@ -1,13 +1,21 @@
1
+ import { UIOverrides } from "../../../../config/uiOverrides.context.js";
1
2
  import { Typography } from "../../../text/Typography/Typography.js";
2
3
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
4
  import "../../../../config/i18n.js";
4
5
  import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
6
+ import { datePickerInputContentRow } from "../shared/datePickerInput.cva.js";
7
+ import { renderDatePickerTodayIcon } from "../shared/datePickerTodayIcon.js";
5
8
  import { DatePickerInput } from "../shared/DatePickerInput.js";
6
9
  import { DateTimeDialog } from "../shared/DateTimeDialog.js";
7
10
  import { DateTimeDialogFooter } from "../shared/DateTimeDialogFooter.js";
11
+ import { getStaticDateRangeSegments } from "../shared/staticDateTimeSegments.js";
8
12
  import { FormField } from "../../FormField/FormField.js";
9
13
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
14
+ import { InputFrame } from "../../Skeleton/InputFrame.js";
15
+ import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
16
+ import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
10
17
  import { RangeCalendar } from "../shared/RangeCalendar.js";
18
+ import { c } from "react/compiler-runtime";
11
19
  import { jsx, jsxs } from "react/jsx-runtime";
12
20
  import { clsx } from "clsx";
13
21
  import { useCallback, useImperativeHandle, useMemo, useRef, useState } from "react";
@@ -23,43 +31,77 @@ import { useDateRangePickerState, useRangeCalendarState } from "react-stately";
23
31
  var DateRangePickerBase = (props) => {
24
32
  const ui = UIConfig.useConfig();
25
33
  const { t } = useTranslation();
26
- const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel = ui.input.hideLabel, variant = ui.input.variant, as = ui.input.as, size = ui.input.size, isClearable = ui.input.isClearable, todayIcon = ui.dateInput.todayIcon, shouldForceLeadingZeros = ui.dateInput.shouldForceLeadingZeros, disableManualEntry = ui.dateInput.disableManualEntry, autoFixYear = ui.dateInput.autoFixYear, ...rest } = props;
34
+ const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, minValue, maxValue, ...rest } = props;
35
+ const hideLabel = hideLabelProp ?? ui.input.hideLabel;
36
+ const variant = variantProp ?? ui.input.variant;
37
+ const as = asProp ?? ui.input.as;
38
+ const size = sizeProp ?? ui.input.size;
39
+ const isClearable = isClearableProp ?? ui.input.isClearable;
40
+ const todayIcon = todayIconProp ?? ui.dateInput.todayIcon;
41
+ const todayIconButtonSize = todayIconButtonSizeProp ?? ui.dateInput.todayIconButtonSize;
42
+ const todayIconButtonComponent = todayIconButtonComponentProp ?? ui.dateInput.todayIconButtonComponent;
43
+ const todayIconPlacement = todayIconPlacementProp ?? ui.dateInput.todayIconPlacement;
44
+ const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
45
+ const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
46
+ const autoFixYear = autoFixYearProp ?? ui.dateInput.autoFixYear;
47
+ const fireBlurOnChange = fireBlurOnChangeProp ?? ui.dateInput.fireBlurOnChange;
48
+ const timeZone = ui.dateInput.timeZone;
49
+ let effectiveTimeZone = getLocalTimeZone();
50
+ if (timeZone !== "clientLocal") effectiveTimeZone = timeZone;
27
51
  const [validationRangeError, setValidationRangeError] = useState();
28
52
  const datePickerInputRef = useRef(null);
29
53
  const dateRangePickerRef = useMemo(() => ({ get current() {
30
54
  return datePickerInputRef.current?.getContainer?.() || null;
31
55
  } }), []);
56
+ const normalizedValue = value ?? null;
32
57
  const dialogState = useDateRangePickerState({
33
58
  ...rest,
34
- value,
59
+ value: normalizedValue,
35
60
  shouldCloseOnSelect: false,
36
- shouldForceLeadingZeros
61
+ shouldForceLeadingZeros,
62
+ minValue,
63
+ maxValue
37
64
  });
38
65
  const state = useDateRangePickerState({
39
66
  ...rest,
40
67
  shouldForceLeadingZeros,
41
- value,
68
+ value: normalizedValue,
69
+ minValue,
70
+ maxValue,
42
71
  onChange: (newValue) => {
43
- if (isValidRange(newValue)) return;
72
+ const isInvalidRange = isValidRange(newValue);
44
73
  onChange?.(newValue);
74
+ if (isInvalidRange) return;
45
75
  handleCalendarStatesChange(newValue);
76
+ if (fireBlurOnChange) debouncedBlur(newValue);
46
77
  },
47
78
  shouldCloseOnSelect: false
48
79
  });
49
80
  const { groupProps, labelProps, startFieldProps, endFieldProps, buttonProps, dialogProps } = useDateRangePicker({
50
81
  ...rest,
51
82
  label,
52
- shouldForceLeadingZeros
83
+ shouldForceLeadingZeros,
84
+ minValue,
85
+ maxValue
53
86
  }, state, dateRangePickerRef);
54
87
  const { calendarProps } = useDateRangePicker({
55
88
  ...rest,
56
89
  label,
57
- shouldForceLeadingZeros
90
+ shouldForceLeadingZeros,
91
+ minValue,
92
+ maxValue
58
93
  }, dialogState, dateRangePickerRef);
59
94
  const { locale } = useLocale$1();
60
- useImperativeHandle(ref, () => ({ clear: () => {
61
- datePickerInputRef.current?.clear();
62
- } }));
95
+ useImperativeHandle(ref, () => ({
96
+ clear: () => {
97
+ datePickerInputRef.current?.clear();
98
+ },
99
+ getContainer: () => datePickerInputRef.current?.getContainer?.() ?? null
100
+ }));
101
+ const handleBlur = (newValue_0) => {
102
+ onBlur?.({ target: { value: newValue_0 } });
103
+ };
104
+ const { callback: debouncedBlur } = useDebounceCallback(handleBlur, { delay: 500 });
63
105
  const formFieldProps = {
64
106
  error: error || validationRangeError,
65
107
  label,
@@ -79,8 +121,8 @@ var DateRangePickerBase = (props) => {
79
121
  createCalendar,
80
122
  pageBehavior: "single",
81
123
  visibleDuration: { months: 1 },
82
- minValue: void 0,
83
- maxValue: void 0
124
+ minValue,
125
+ maxValue
84
126
  });
85
127
  const rightCalendarState = useRangeCalendarState({
86
128
  ...calendarProps,
@@ -88,9 +130,9 @@ var DateRangePickerBase = (props) => {
88
130
  createCalendar,
89
131
  pageBehavior: "single",
90
132
  visibleDuration: { months: 1 },
91
- defaultFocusedValue: today(getLocalTimeZone()).add({ months: 1 }),
92
- minValue: void 0,
93
- maxValue: void 0
133
+ defaultFocusedValue: today(effectiveTimeZone).add({ months: 1 }),
134
+ minValue,
135
+ maxValue
94
136
  });
95
137
  const [activePreset, setActivePreset] = useState(null);
96
138
  const [rangeSelection, setRangeSelection] = useState({
@@ -110,10 +152,36 @@ var DateRangePickerBase = (props) => {
110
152
  className: headerClassName,
111
153
  labelProps
112
154
  };
113
- const isValidRange = useCallback((newValue) => {
114
- if (newValue?.start && newValue?.end) {
115
- const startDate = newValue.start;
116
- if (newValue.end.compare(startDate) < 0) {
155
+ const isDateOutsideBounds = useCallback((date) => {
156
+ if (minValue && date.compare(minValue) < 0) return true;
157
+ if (maxValue && date.compare(maxValue) > 0) return true;
158
+ return false;
159
+ }, [minValue, maxValue]);
160
+ const clampRangeToBounds = useCallback((range) => {
161
+ if (range === null) return null;
162
+ if (minValue && maxValue && minValue.compare(maxValue) > 0) return null;
163
+ let startDate = range.start;
164
+ let endDate = range.end;
165
+ if (minValue && endDate.compare(minValue) < 0 || maxValue && startDate.compare(maxValue) > 0) return null;
166
+ if (minValue && startDate.compare(minValue) < 0) startDate = minValue;
167
+ if (maxValue && startDate.compare(maxValue) > 0) startDate = maxValue;
168
+ if (minValue && endDate.compare(minValue) < 0) endDate = minValue;
169
+ if (maxValue && endDate.compare(maxValue) > 0) endDate = maxValue;
170
+ if (startDate.compare(endDate) > 0) return null;
171
+ return {
172
+ start: startDate,
173
+ end: endDate
174
+ };
175
+ }, [minValue, maxValue]);
176
+ const isRangeWithinBounds = useCallback((range_0) => {
177
+ if (minValue && range_0.start.compare(minValue) < 0) return false;
178
+ if (maxValue && range_0.end.compare(maxValue) > 0) return false;
179
+ return true;
180
+ }, [minValue, maxValue]);
181
+ const isValidRange = useCallback((newValue_1) => {
182
+ if (newValue_1?.start && newValue_1?.end) {
183
+ const startDate_0 = newValue_1.start;
184
+ if (newValue_1.end.compare(startDate_0) < 0) {
117
185
  setValidationRangeError(t(($) => $.ui.datePicker.errors.endDateBeforeStart, { ns: "ui" }));
118
186
  return true;
119
187
  }
@@ -121,20 +189,22 @@ var DateRangePickerBase = (props) => {
121
189
  } else setValidationRangeError(void 0);
122
190
  return false;
123
191
  }, [t]);
124
- const handleCalendarStatesChange = (newValue) => {
125
- if (newValue) {
126
- if (isValidRange(newValue)) return;
127
- dialogState.setValue(newValue);
128
- const startDate = newValue.start;
129
- const endDate = newValue.end;
130
- leftCalendarState.setFocusedDate(startDate);
131
- if (startDate.year === endDate.year && startDate.month === endDate.month) rightCalendarState.setFocusedDate(startDate.add({ months: 1 }));
132
- else rightCalendarState.setFocusedDate(endDate);
133
- leftCalendarState.setValue(newValue);
134
- rightCalendarState.setValue(newValue);
192
+ const handleCalendarStatesChange = (newValue_2) => {
193
+ if (newValue_2) {
194
+ const clampedValue = clampRangeToBounds(newValue_2);
195
+ if (!clampedValue) return;
196
+ if (isValidRange(clampedValue)) return;
197
+ dialogState.setValue(clampedValue);
198
+ const startDate_1 = clampedValue.start;
199
+ const endDate_1 = clampedValue.end;
200
+ leftCalendarState.setFocusedDate(startDate_1);
201
+ if (startDate_1.year === endDate_1.year && startDate_1.month === endDate_1.month) rightCalendarState.setFocusedDate(startDate_1.add({ months: 1 }));
202
+ else rightCalendarState.setFocusedDate(endDate_1);
203
+ leftCalendarState.setValue(clampedValue);
204
+ rightCalendarState.setValue(clampedValue);
135
205
  setRangeSelection({
136
- start: newValue.start,
137
- end: newValue.end,
206
+ start: clampedValue.start,
207
+ end: clampedValue.end,
138
208
  isSelecting: false
139
209
  });
140
210
  setHoverDate(null);
@@ -153,32 +223,33 @@ var DateRangePickerBase = (props) => {
153
223
  setActivePreset(null);
154
224
  }
155
225
  };
156
- const throttledSetHoverDate = useCallback((date) => {
226
+ const throttledSetHoverDate = useCallback((date_0) => {
157
227
  requestAnimationFrame(() => {
158
- setHoverDate(date);
228
+ setHoverDate(date_0);
159
229
  });
160
230
  }, []);
161
- const handleDateHover = useCallback((date) => {
162
- if (rangeSelection.isSelecting && rangeSelection.start) throttledSetHoverDate(date);
231
+ const handleDateHover = useCallback((date_1) => {
232
+ if (rangeSelection.isSelecting && rangeSelection.start) throttledSetHoverDate(date_1);
163
233
  }, [
164
234
  rangeSelection.isSelecting,
165
235
  rangeSelection.start,
166
236
  throttledSetHoverDate
167
237
  ]);
168
- const handleDateSelection = useCallback((date, calendarSide) => {
238
+ const handleDateSelection = useCallback((date_2, calendarSide) => {
169
239
  if (calendarSide) {
170
240
  const currentVisibleMonth = (calendarSide === "left" ? leftCalendarState : rightCalendarState).visibleRange.start;
171
- if (date.month !== currentVisibleMonth.month || date.year !== currentVisibleMonth.year) if (calendarSide === "left") {
172
- leftCalendarState.setFocusedDate(date);
173
- rightCalendarState.setFocusedDate(date.add({ months: 1 }));
241
+ if (date_2.month !== currentVisibleMonth.month || date_2.year !== currentVisibleMonth.year) if (calendarSide === "left") {
242
+ leftCalendarState.setFocusedDate(date_2);
243
+ rightCalendarState.setFocusedDate(date_2.add({ months: 1 }));
174
244
  } else {
175
- rightCalendarState.setFocusedDate(date);
176
- leftCalendarState.setFocusedDate(date.subtract({ months: 1 }));
245
+ rightCalendarState.setFocusedDate(date_2);
246
+ leftCalendarState.setFocusedDate(date_2.subtract({ months: 1 }));
177
247
  }
178
248
  }
249
+ if (isDateOutsideBounds(date_2)) return;
179
250
  if (!rangeSelection.isSelecting || !rangeSelection.start) {
180
251
  setRangeSelection({
181
- start: date,
252
+ start: date_2,
182
253
  end: null,
183
254
  isSelecting: true
184
255
  });
@@ -187,19 +258,18 @@ var DateRangePickerBase = (props) => {
187
258
  rightCalendarState.setValue(null);
188
259
  } else {
189
260
  const { start } = rangeSelection;
190
- const end = date;
191
- const finalStart = start.compare(end) <= 0 ? start : end;
192
- const finalEnd = start.compare(end) <= 0 ? end : start;
193
- const newRange = {
194
- start: finalStart,
195
- end: finalEnd
196
- };
197
- leftCalendarState.setValue(newRange);
198
- rightCalendarState.setValue(newRange);
199
- dialogState.setValue(newRange);
261
+ const end = date_2;
262
+ const clampedRange = clampRangeToBounds({
263
+ start: start.compare(end) <= 0 ? start : end,
264
+ end: start.compare(end) <= 0 ? end : start
265
+ });
266
+ if (!clampedRange) return;
267
+ leftCalendarState.setValue(clampedRange);
268
+ rightCalendarState.setValue(clampedRange);
269
+ dialogState.setValue(clampedRange);
200
270
  setRangeSelection({
201
- start: finalStart,
202
- end: finalEnd,
271
+ start: clampedRange.start,
272
+ end: clampedRange.end,
203
273
  isSelecting: false
204
274
  });
205
275
  setHoverDate(null);
@@ -209,18 +279,20 @@ var DateRangePickerBase = (props) => {
209
279
  rangeSelection,
210
280
  leftCalendarState,
211
281
  rightCalendarState,
212
- dialogState
282
+ dialogState,
283
+ isDateOutsideBounds,
284
+ clampRangeToBounds
213
285
  ]);
214
- const handleKeyboardNavigation = useCallback((event, date, calendarSide) => {
215
- const currentState = calendarSide === "left" ? leftCalendarState : rightCalendarState;
216
- const otherState = calendarSide === "left" ? rightCalendarState : leftCalendarState;
286
+ const handleKeyboardNavigation = useCallback((event, date_3, calendarSide_0) => {
287
+ const currentState_0 = calendarSide_0 === "left" ? leftCalendarState : rightCalendarState;
288
+ const otherState = calendarSide_0 === "left" ? rightCalendarState : leftCalendarState;
217
289
  let shouldPreventDefault = false;
218
290
  switch (event.key) {
219
291
  case "ArrowRight": {
220
- const nextDate = date.add({ days: 1 });
221
- const currentMonth = currentState.visibleRange.start;
222
- const otherMonth = otherState.visibleRange.start;
223
- if (calendarSide === "left" && nextDate.month !== currentMonth.month) if (nextDate.year === otherMonth.year && nextDate.month === otherMonth.month) {
292
+ const nextDate = date_3.add({ days: 1 });
293
+ const currentMonth_2 = currentState_0.visibleRange.start;
294
+ const otherMonth_2 = otherState.visibleRange.start;
295
+ if (calendarSide_0 === "left" && nextDate.month !== currentMonth_2.month) if (nextDate.year === otherMonth_2.year && nextDate.month === otherMonth_2.month) {
224
296
  otherState.setFocusedDate(nextDate);
225
297
  shouldPreventDefault = true;
226
298
  } else {
@@ -230,10 +302,10 @@ var DateRangePickerBase = (props) => {
230
302
  break;
231
303
  }
232
304
  case "ArrowLeft": {
233
- const prevDate = date.subtract({ days: 1 });
234
- const currentMonth = currentState.visibleRange.start;
235
- const otherMonth = otherState.visibleRange.start;
236
- if (calendarSide === "right" && prevDate.month !== currentMonth.month) if (prevDate.year === otherMonth.year && prevDate.month === otherMonth.month) {
305
+ const prevDate = date_3.subtract({ days: 1 });
306
+ const currentMonth_1 = currentState_0.visibleRange.start;
307
+ const otherMonth_1 = otherState.visibleRange.start;
308
+ if (calendarSide_0 === "right" && prevDate.month !== currentMonth_1.month) if (prevDate.year === otherMonth_1.year && prevDate.month === otherMonth_1.month) {
237
309
  otherState.setFocusedDate(prevDate);
238
310
  shouldPreventDefault = true;
239
311
  } else {
@@ -243,10 +315,10 @@ var DateRangePickerBase = (props) => {
243
315
  break;
244
316
  }
245
317
  case "ArrowDown": {
246
- const nextWeekDate = date.add({ weeks: 1 });
247
- const currentMonth = currentState.visibleRange.start;
248
- const otherMonth = otherState.visibleRange.start;
249
- if (calendarSide === "left" && nextWeekDate.month !== currentMonth.month) if (nextWeekDate.year === otherMonth.year && nextWeekDate.month === otherMonth.month) {
318
+ const nextWeekDate = date_3.add({ weeks: 1 });
319
+ const currentMonth_0 = currentState_0.visibleRange.start;
320
+ const otherMonth_0 = otherState.visibleRange.start;
321
+ if (calendarSide_0 === "left" && nextWeekDate.month !== currentMonth_0.month) if (nextWeekDate.year === otherMonth_0.year && nextWeekDate.month === otherMonth_0.month) {
250
322
  otherState.setFocusedDate(nextWeekDate);
251
323
  shouldPreventDefault = true;
252
324
  } else {
@@ -256,10 +328,10 @@ var DateRangePickerBase = (props) => {
256
328
  break;
257
329
  }
258
330
  case "ArrowUp": {
259
- const prevWeekDate = date.subtract({ weeks: 1 });
260
- const currentMonth = currentState.visibleRange.start;
331
+ const prevWeekDate = date_3.subtract({ weeks: 1 });
332
+ const currentMonth = currentState_0.visibleRange.start;
261
333
  const otherMonth = otherState.visibleRange.start;
262
- if (calendarSide === "right" && prevWeekDate.month !== currentMonth.month) if (prevWeekDate.year === otherMonth.year && prevWeekDate.month === otherMonth.month) {
334
+ if (calendarSide_0 === "right" && prevWeekDate.month !== currentMonth.month) if (prevWeekDate.year === otherMonth.year && prevWeekDate.month === otherMonth.month) {
263
335
  otherState.setFocusedDate(prevWeekDate);
264
336
  shouldPreventDefault = true;
265
337
  } else {
@@ -270,7 +342,7 @@ var DateRangePickerBase = (props) => {
270
342
  }
271
343
  case "Enter":
272
344
  case " ":
273
- handleDateSelection(date);
345
+ handleDateSelection(date_3);
274
346
  shouldPreventDefault = true;
275
347
  break;
276
348
  case "Escape":
@@ -294,19 +366,29 @@ var DateRangePickerBase = (props) => {
294
366
  rightCalendarState,
295
367
  handleDateSelection
296
368
  ]);
297
- const syncCalendarStates = useCallback((newValue) => {
298
- if (isValidRange(newValue)) return;
299
- leftCalendarState.setValue(newValue);
300
- rightCalendarState.setValue(newValue);
301
- dialogState.setValue(newValue);
302
- if (newValue) setRangeSelection({
303
- start: newValue.start,
304
- end: newValue.end,
305
- isSelecting: false
306
- });
307
- else setRangeSelection({
308
- start: null,
309
- end: null,
369
+ const syncCalendarStates = useCallback((newValue_3) => {
370
+ if (newValue_3 === null) {
371
+ setValidationRangeError(void 0);
372
+ leftCalendarState.setValue(null);
373
+ rightCalendarState.setValue(null);
374
+ dialogState.setValue(null);
375
+ setRangeSelection({
376
+ start: null,
377
+ end: null,
378
+ isSelecting: false
379
+ });
380
+ setHoverDate(null);
381
+ return;
382
+ }
383
+ const clampedValue_0 = clampRangeToBounds(newValue_3);
384
+ if (!clampedValue_0) return;
385
+ if (isValidRange(clampedValue_0)) return;
386
+ leftCalendarState.setValue(clampedValue_0);
387
+ rightCalendarState.setValue(clampedValue_0);
388
+ dialogState.setValue(clampedValue_0);
389
+ setRangeSelection({
390
+ start: clampedValue_0.start,
391
+ end: clampedValue_0.end,
310
392
  isSelecting: false
311
393
  });
312
394
  setHoverDate(null);
@@ -314,24 +396,41 @@ var DateRangePickerBase = (props) => {
314
396
  isValidRange,
315
397
  leftCalendarState,
316
398
  rightCalendarState,
317
- dialogState
399
+ dialogState,
400
+ clampRangeToBounds
318
401
  ]);
319
402
  const onApply = () => {
320
- const valueToApply = rangeSelection.start && rangeSelection.end ? {
403
+ let valueToApply = dialogState.value;
404
+ if (rangeSelection.start && rangeSelection.end) valueToApply = {
321
405
  start: rangeSelection.start,
322
406
  end: rangeSelection.end
323
- } : dialogState.value;
324
- if (valueToApply) state.setValue(valueToApply);
407
+ };
408
+ if (valueToApply) {
409
+ const clampedValue_1 = clampRangeToBounds(valueToApply);
410
+ if (clampedValue_1) {
411
+ valueToApply = clampedValue_1;
412
+ state.setValue(clampedValue_1);
413
+ }
414
+ }
325
415
  state.toggle();
416
+ if (fireBlurOnChange) handleBlur(valueToApply);
326
417
  };
327
418
  const onTodayPress = () => {
328
- const todayDate = today(getLocalTimeZone());
329
- leftCalendarState.setFocusedDate(todayDate);
330
- rightCalendarState.setFocusedDate(todayDate.add({ months: 1 }));
331
- syncCalendarStates({
419
+ const todayDate = today(effectiveTimeZone);
420
+ const clampedTodayRange = clampRangeToBounds({
332
421
  start: todayDate,
333
422
  end: todayDate
334
423
  });
424
+ if (!clampedTodayRange) return;
425
+ const startDate_2 = clampedTodayRange.start;
426
+ const endDate_2 = clampedTodayRange.end;
427
+ leftCalendarState.setFocusedDate(startDate_2);
428
+ if (startDate_2.year === endDate_2.year && startDate_2.month === endDate_2.month) rightCalendarState.setFocusedDate(startDate_2.add({ months: 1 }));
429
+ else rightCalendarState.setFocusedDate(endDate_2);
430
+ syncCalendarStates(clampedTodayRange);
431
+ };
432
+ const onInputClear = () => {
433
+ onChange?.(null);
335
434
  };
336
435
  const onOpenChange = (isOpen) => {
337
436
  state.toggle();
@@ -340,11 +439,11 @@ var DateRangePickerBase = (props) => {
340
439
  dialogState.setValue(state.value);
341
440
  leftCalendarState.setValue(state.value);
342
441
  rightCalendarState.setValue(state.value);
343
- const startDate = state.value.start || today(getLocalTimeZone());
344
- const endDate = state.value.end || today(getLocalTimeZone()).add({ months: 1 });
345
- leftCalendarState.setFocusedDate(startDate);
346
- if (startDate.year === endDate.year && startDate.month === endDate.month) rightCalendarState.setFocusedDate(startDate.add({ months: 1 }));
347
- else rightCalendarState.setFocusedDate(endDate);
442
+ const startDate_3 = state.value.start || today(effectiveTimeZone);
443
+ const endDate_3 = state.value.end || today(effectiveTimeZone).add({ months: 1 });
444
+ leftCalendarState.setFocusedDate(startDate_3);
445
+ if (startDate_3.year === endDate_3.year && startDate_3.month === endDate_3.month) rightCalendarState.setFocusedDate(startDate_3.add({ months: 1 }));
446
+ else rightCalendarState.setFocusedDate(endDate_3);
348
447
  setRangeSelection({
349
448
  start: state.value.start,
350
449
  end: state.value.end,
@@ -353,100 +452,125 @@ var DateRangePickerBase = (props) => {
353
452
  }
354
453
  }
355
454
  };
356
- const todayDate = today(getLocalTimeZone());
455
+ const todayDate_0 = today(effectiveTimeZone);
357
456
  const getThisWeekRange = () => {
358
457
  return {
359
- start: startOfWeek(todayDate, locale),
360
- end: endOfWeek(todayDate, locale)
458
+ start: startOfWeek(todayDate_0, locale),
459
+ end: endOfWeek(todayDate_0, locale)
361
460
  };
362
461
  };
363
462
  const getLastWeekRange = () => {
364
- const thisWeekStart = startOfWeek(todayDate, locale);
463
+ const thisWeekStart = startOfWeek(todayDate_0, locale);
365
464
  return {
366
465
  start: thisWeekStart.subtract({ weeks: 1 }),
367
466
  end: thisWeekStart.subtract({ days: 1 })
368
467
  };
369
468
  };
370
469
  const getThisAndLastWeekRange = () => {
371
- const thisWeekEnd = endOfWeek(todayDate, locale);
470
+ const thisWeekEnd = endOfWeek(todayDate_0, locale);
372
471
  return {
373
- start: startOfWeek(todayDate, locale).subtract({ weeks: 1 }),
472
+ start: startOfWeek(todayDate_0, locale).subtract({ weeks: 1 }),
374
473
  end: thisWeekEnd
375
474
  };
376
475
  };
377
476
  const getThisMonthRange = () => {
378
477
  return {
379
- start: startOfMonth(todayDate),
380
- end: endOfMonth(todayDate)
478
+ start: startOfMonth(todayDate_0),
479
+ end: endOfMonth(todayDate_0)
381
480
  };
382
481
  };
383
482
  const getThisAndLastMonthRange = () => {
384
- const thisMonthEnd = endOfMonth(todayDate);
483
+ const thisMonthEnd = endOfMonth(todayDate_0);
385
484
  return {
386
- start: startOfMonth(todayDate).subtract({ months: 1 }),
485
+ start: startOfMonth(todayDate_0).subtract({ months: 1 }),
387
486
  end: thisMonthEnd
388
487
  };
389
488
  };
489
+ const createPreset = (params) => {
490
+ let clampedValue_2 = clampRangeToBounds(params.getValue());
491
+ let isDisabled_0 = false;
492
+ if (params.keepEnabledUnlessFutureMin) {
493
+ let minDateIsInFuture = false;
494
+ if (minValue && minValue.compare(todayDate_0) > 0) minDateIsInFuture = true;
495
+ if (minDateIsInFuture) {
496
+ isDisabled_0 = true;
497
+ clampedValue_2 = null;
498
+ } else if (!clampedValue_2 && maxValue) clampedValue_2 = {
499
+ start: maxValue,
500
+ end: maxValue
501
+ };
502
+ }
503
+ if (!clampedValue_2) isDisabled_0 = true;
504
+ if (clampedValue_2 && !isRangeWithinBounds(clampedValue_2)) isDisabled_0 = true;
505
+ return {
506
+ label: params.label,
507
+ getValue: params.getValue,
508
+ clampedValue: clampedValue_2,
509
+ isDisabled: isDisabled_0
510
+ };
511
+ };
390
512
  const presets = [
391
- {
392
- label: t(($) => $.ui.datePicker.presets.thisWeek, { ns: "ui" }),
513
+ createPreset({
514
+ label: t(($_0) => $_0.ui.datePicker.presets.thisWeek, { ns: "ui" }),
393
515
  getValue: getThisWeekRange
394
- },
395
- {
396
- label: t(($) => $.ui.datePicker.presets.lastWeek, { ns: "ui" }),
516
+ }),
517
+ createPreset({
518
+ label: t(($_1) => $_1.ui.datePicker.presets.lastWeek, { ns: "ui" }),
397
519
  getValue: getLastWeekRange
398
- },
399
- {
400
- label: t(($) => $.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" }),
520
+ }),
521
+ createPreset({
522
+ label: t(($_2) => $_2.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" }),
401
523
  getValue: getThisAndLastWeekRange
402
- },
403
- {
404
- label: t(($) => $.ui.datePicker.presets.thisMonth, { ns: "ui" }),
524
+ }),
525
+ createPreset({
526
+ label: t(($_3) => $_3.ui.datePicker.presets.thisMonth, { ns: "ui" }),
405
527
  getValue: getThisMonthRange
406
- },
407
- {
408
- label: t(($) => $.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" }),
528
+ }),
529
+ createPreset({
530
+ label: t(($_4) => $_4.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" }),
409
531
  getValue: getThisAndLastMonthRange
410
- },
411
- {
412
- label: t(($) => $.ui.datePicker.presets.thisYear, { ns: "ui" }),
532
+ }),
533
+ createPreset({
534
+ label: t(($_5) => $_5.ui.datePicker.presets.thisYear, { ns: "ui" }),
413
535
  getValue: () => ({
414
- start: startOfYear(todayDate),
415
- end: todayDate
536
+ start: startOfYear(todayDate_0),
537
+ end: todayDate_0
416
538
  })
417
- },
418
- {
419
- label: t(($) => $.ui.datePicker.presets.lastYear, { ns: "ui" }),
539
+ }),
540
+ createPreset({
541
+ label: t(($_6) => $_6.ui.datePicker.presets.lastYear, { ns: "ui" }),
420
542
  getValue: () => ({
421
- start: startOfYear(todayDate.subtract({ years: 1 })),
422
- end: endOfYear(todayDate.subtract({ years: 1 }))
543
+ start: startOfYear(todayDate_0.subtract({ years: 1 })),
544
+ end: endOfYear(todayDate_0.subtract({ years: 1 }))
423
545
  })
424
- },
425
- {
426
- label: t(($) => $.ui.datePicker.presets.thisAndLastYear, { ns: "ui" }),
546
+ }),
547
+ createPreset({
548
+ label: t(($_7) => $_7.ui.datePicker.presets.thisAndLastYear, { ns: "ui" }),
427
549
  getValue: () => ({
428
- start: startOfYear(todayDate.subtract({ years: 1 })),
429
- end: todayDate
550
+ start: startOfYear(todayDate_0.subtract({ years: 1 })),
551
+ end: todayDate_0
430
552
  })
431
- },
432
- {
433
- label: t(($) => $.ui.datePicker.presets.soFar, { ns: "ui" }),
553
+ }),
554
+ createPreset({
555
+ label: t(($_8) => $_8.ui.datePicker.presets.soFar, { ns: "ui" }),
434
556
  getValue: () => ({
435
- start: startOfYear(todayDate),
436
- end: todayDate
437
- })
438
- }
557
+ start: startOfYear(todayDate_0),
558
+ end: todayDate_0
559
+ }),
560
+ keepEnabledUnlessFutureMin: true
561
+ })
439
562
  ];
440
563
  const selectPreset = (preset) => {
564
+ if (preset.isDisabled || !preset.clampedValue) return;
441
565
  setActivePreset(preset.label);
442
- const presetValue = preset.getValue();
566
+ const presetValue = preset.clampedValue;
443
567
  syncCalendarStates(presetValue);
444
- const startDate = presetValue.start;
445
- leftCalendarState.setFocusedDate(startDate);
446
- const endDate = presetValue.end;
447
- if ((endDate.year - startDate.year) * 12 + (endDate.month - startDate.month) > 2) rightCalendarState.setFocusedDate(endDate);
568
+ const startDate_4 = presetValue.start;
569
+ leftCalendarState.setFocusedDate(startDate_4);
570
+ const endDate_4 = presetValue.end;
571
+ if ((endDate_4.year - startDate_4.year) * 12 + (endDate_4.month - startDate_4.month) > 2) rightCalendarState.setFocusedDate(endDate_4);
448
572
  else {
449
- const rightCalendarMonth = startDate.add({ months: 1 });
573
+ const rightCalendarMonth = startDate_4.add({ months: 1 });
450
574
  rightCalendarState.setFocusedDate(rightCalendarMonth);
451
575
  }
452
576
  };
@@ -464,8 +588,24 @@ var DateRangePickerBase = (props) => {
464
588
  ref: mergeRefs(ref, datePickerInputRef),
465
589
  as,
466
590
  groupProps,
467
- fieldProps: startFieldProps,
468
- endFieldProps,
591
+ fieldProps: {
592
+ ...startFieldProps,
593
+ onBlur: (event_0) => {
594
+ startFieldProps.onBlur?.(event_0);
595
+ handleBlur(state.value);
596
+ }
597
+ },
598
+ endFieldProps: {
599
+ ...endFieldProps,
600
+ onBlur: (event_1) => {
601
+ endFieldProps.onBlur?.(event_1);
602
+ handleBlur(state.value);
603
+ }
604
+ },
605
+ fieldValue: normalizedValue?.start ?? null,
606
+ endFieldValue: normalizedValue?.end ?? null,
607
+ isValueControlled: true,
608
+ hasValue: normalizedValue?.start != null || normalizedValue?.end != null,
469
609
  buttonProps,
470
610
  isDisabled,
471
611
  isInvalid: !!error,
@@ -475,27 +615,34 @@ var DateRangePickerBase = (props) => {
475
615
  isClearable,
476
616
  headerProps,
477
617
  todayIcon,
618
+ todayIconButtonSize,
619
+ todayIconButtonComponent,
620
+ todayIconPlacement,
478
621
  isDirty,
479
622
  disableManualEntry,
623
+ autoFixYear,
480
624
  placeholder,
481
625
  className: inputClassName,
482
626
  onOpenDropdown: () => state.toggle(),
483
- autoFixYear
627
+ timeZone: effectiveTimeZone,
628
+ fireBlurOnChange,
629
+ onClear: onInputClear
484
630
  }), /* @__PURE__ */ jsx(DateTimeDialog, {
485
631
  hideSidebar,
486
632
  sidebar: /* @__PURE__ */ jsx("div", {
487
633
  className: "flex w-full flex-row overflow-auto border-elevation-outline-default-1 border-solid [-ms-overflow-style:none] [scrollbar-width:none] md:w-[156px] md:flex-col md:border-r [&::-webkit-scrollbar]:hidden",
488
- children: presets.map((preset) => /* @__PURE__ */ jsx(Button, {
489
- onClick: () => selectPreset(preset),
490
- className: clsx("w-full px-2 py-1 text-left md:px-list-side-item-left md:py-list-height-item", activePreset !== preset.label && "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover", activePreset === preset.label && "bg-interactive-contained-primary-idle text-interactive-text-secondary-idle-inverted"),
634
+ children: presets.map((preset_0) => /* @__PURE__ */ jsx(Button, {
635
+ isDisabled: preset_0.isDisabled,
636
+ onClick: () => selectPreset(preset_0),
637
+ className: clsx("w-full px-2 py-1 text-left md:px-list-side-item-left md:py-list-height-item disabled:text-interactive-text-secondary-disabled!", activePreset !== preset_0.label && "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover", activePreset === preset_0.label && "bg-interactive-contained-primary-idle text-interactive-text-secondary-idle-inverted"),
491
638
  children: /* @__PURE__ */ jsx(Typography, {
492
639
  size: "label-2",
493
640
  sizeMobile: "label-3",
494
641
  as: "span",
495
642
  className: "whitespace-nowrap",
496
- children: preset.label
643
+ children: preset_0.label
497
644
  })
498
- }, preset.label))
645
+ }, preset_0.label))
499
646
  }),
500
647
  footer: /* @__PURE__ */ jsx(DateTimeDialogFooter, {
501
648
  isDisabled,
@@ -530,69 +677,300 @@ var DateRangePickerBase = (props) => {
530
677
  })
531
678
  });
532
679
  };
533
- var DateRangePicker = ({ fullIso = true, minValue, maxValue, ...props }) => {
534
- const formatDateRange = (range) => {
535
- if (!range?.start || !range?.end) return null;
536
- if (fullIso) return {
537
- start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
538
- end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
680
+ var DateRangePickerInner = (t0) => {
681
+ const $ = c(25);
682
+ const { fullIso: t1, minValue, maxValue, renderStaticInput, isFormControlDisabled, ...props } = t0;
683
+ const fullIso = t1 === void 0 ? true : t1;
684
+ const ui = UIConfig.useConfig();
685
+ const datePickerInputContentRowCva = UIOverrides.useCva("datePickerInput.contentRowCva", datePickerInputContentRow);
686
+ const { locale } = useLocale$1();
687
+ const shouldForceLeadingZeros = props.shouldForceLeadingZeros ?? ui.dateInput.shouldForceLeadingZeros;
688
+ const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
689
+ const inputRef = useRef(null);
690
+ const { renderRealInput } = useStaticInputHandoff({
691
+ inputRef,
692
+ renderInput,
693
+ setRenderInput,
694
+ getFocusTarget: _temp
695
+ });
696
+ const normalizedValue = props.value ?? null;
697
+ let t2;
698
+ if ($[0] !== fullIso) {
699
+ t2 = (range) => {
700
+ if (!range?.start || !range?.end) return null;
701
+ if (fullIso) return {
702
+ start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
703
+ end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
704
+ };
705
+ const startDate = DateTimeUtils.fromDateValueToLocal(range.start, "UTC");
706
+ const endDate = DateTimeUtils.fromDateValueToLocal(range.end, "UTC");
707
+ return {
708
+ start: DateTime.fromJSDate(startDate, { zone: "UTC" }).toISODate(),
709
+ end: DateTime.fromJSDate(endDate, { zone: "UTC" }).toISODate()
710
+ };
539
711
  };
540
- const startDate = DateTimeUtils.fromDateValueToLocal(range.start);
541
- const endDate = DateTimeUtils.fromDateValueToLocal(range.end);
542
- return {
543
- start: DateTime.fromJSDate(startDate).toISODate(),
544
- end: DateTime.fromJSDate(endDate).toISODate()
712
+ $[0] = fullIso;
713
+ $[1] = t2;
714
+ } else t2 = $[1];
715
+ const formatDateRange = t2;
716
+ let t3;
717
+ if ($[2] !== fullIso) {
718
+ t3 = (formattedRange) => {
719
+ if (!formattedRange?.start || !formattedRange?.end) return null;
720
+ if (fullIso) return {
721
+ start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
722
+ end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
723
+ };
724
+ const startDate_0 = DateTime.fromISO(formattedRange.start, { zone: "UTC" }).toJSDate();
725
+ const endDate_0 = DateTime.fromISO(formattedRange.end, { zone: "UTC" }).toJSDate();
726
+ const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0, "UTC");
727
+ const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0, "UTC");
728
+ return {
729
+ start: toCalendarDate(startZonedDateTime),
730
+ end: toCalendarDate(endZonedDateTime)
731
+ };
545
732
  };
546
- };
547
- const parseDateRange = (formattedRange) => {
548
- if (!formattedRange?.start || !formattedRange?.end) return formattedRange;
549
- if (fullIso) return {
550
- start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
551
- end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
733
+ $[2] = fullIso;
734
+ $[3] = t3;
735
+ } else t3 = $[3];
736
+ const parseDateRange = t3;
737
+ let t4;
738
+ if ($[4] !== fullIso) {
739
+ t4 = (formattedDate) => {
740
+ if (formattedDate == null) return null;
741
+ if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
742
+ const date = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
743
+ return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date, "UTC"));
552
744
  };
553
- const startDate = DateTime.fromISO(formattedRange.start).toJSDate();
554
- const endDate = DateTime.fromISO(formattedRange.end).toJSDate();
555
- const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate);
556
- const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate);
557
- return {
558
- start: toCalendarDate(startZonedDateTime),
559
- end: toCalendarDate(endZonedDateTime)
745
+ $[4] = fullIso;
746
+ $[5] = t4;
747
+ } else t4 = $[5];
748
+ const parseCalendarDate = t4;
749
+ let t5;
750
+ if ($[6] !== minValue || $[7] !== parseCalendarDate) {
751
+ t5 = typeof minValue === "string" ? parseCalendarDate(minValue) : minValue;
752
+ $[6] = minValue;
753
+ $[7] = parseCalendarDate;
754
+ $[8] = t5;
755
+ } else t5 = $[8];
756
+ let t6;
757
+ if ($[9] !== maxValue || $[10] !== parseCalendarDate) {
758
+ t6 = typeof maxValue === "string" ? parseCalendarDate(maxValue) : maxValue;
759
+ $[9] = maxValue;
760
+ $[10] = parseCalendarDate;
761
+ $[11] = t6;
762
+ } else t6 = $[11];
763
+ let t7;
764
+ if ($[12] !== t5 || $[13] !== t6) {
765
+ t7 = {
766
+ minValue: t5,
767
+ maxValue: t6
560
768
  };
561
- };
562
- const parseCalendarDate = (formattedDate) => {
563
- if (formattedDate == null) return formattedDate;
564
- if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
565
- const date = DateTime.fromISO(formattedDate).toJSDate();
566
- return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date));
567
- };
568
- const dateLimits = {
569
- minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,
570
- maxValue: typeof maxValue === "string" ? parseCalendarDate(maxValue) : maxValue
571
- };
572
- if ("formControl" in props && props.formControl) {
573
- const { formControl, ref, ...innerProps } = props;
574
- return /* @__PURE__ */ jsx(Controller, {
575
- control: formControl.control,
576
- name: formControl.name,
577
- render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(DateRangePickerBase, {
578
- ...innerProps,
579
- ...dateLimits,
580
- ref: mergeRefs(ref, field.ref),
581
- value: parseDateRange(field.value),
582
- onChange: (value) => field.onChange(formatDateRange(value)),
583
- onBlur: field.onBlur,
584
- isDirty,
585
- isDisabled: field.disabled || props.isDisabled,
586
- error: props.error ?? error?.message
587
- })
769
+ $[12] = t5;
770
+ $[13] = t6;
771
+ $[14] = t7;
772
+ } else t7 = $[14];
773
+ const dateLimits = t7;
774
+ if (!renderInput) {
775
+ const startDateValue = parseCalendarDate(normalizedValue?.start ?? null);
776
+ const endDateValue = parseCalendarDate(normalizedValue?.end ?? null);
777
+ const hasProvidedRangeValue = !!(normalizedValue?.start || normalizedValue?.end);
778
+ const as = props.as ?? ui.input.as;
779
+ const size = props.size ?? ui.input.size;
780
+ const isDisabled = isFormControlDisabled || !!props.isDisabled;
781
+ const todayIcon = props.todayIcon ?? ui.dateInput.todayIcon;
782
+ const todayIconButtonSize = props.todayIconButtonSize ?? ui.dateInput.todayIconButtonSize;
783
+ const todayIconButtonComponent = props.todayIconButtonComponent ?? ui.dateInput.todayIconButtonComponent;
784
+ const todayIconPlacement = props.todayIconPlacement ?? ui.dateInput.todayIconPlacement;
785
+ const staticTodayIcon = renderDatePickerTodayIcon(todayIcon, {
786
+ isDisabled,
787
+ renderStatic: true,
788
+ size: todayIconButtonSize,
789
+ todayIconButtonComponent
790
+ });
791
+ const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
792
+ const showDropdown = !props.disableDropdown || disableManualEntry;
793
+ const staticSegments = getStaticDateRangeSegments({
794
+ start: startDateValue,
795
+ end: endDateValue,
796
+ locale,
797
+ shouldForceLeadingZeros,
798
+ isDisabled,
799
+ hidePlaceholder: as === "floating" && !hasProvidedRangeValue,
800
+ disableManualEntry,
801
+ placeholder: props.placeholder
802
+ });
803
+ return /* @__PURE__ */ jsx(InputFrame, {
804
+ ...props,
805
+ isDisabled,
806
+ className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
807
+ inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
808
+ contentClassName: "pr-0!",
809
+ contentWrapperClassName: datePickerInputContentRowCva({ size }),
810
+ contentGroup: "date-picker",
811
+ labelPlacement: "content-row",
812
+ dataAttributes: {
813
+ dataIsEmpty: !hasProvidedRangeValue,
814
+ dataIsFilled: hasProvidedRangeValue,
815
+ dataIsDirty: props.isDirty,
816
+ dataIsRequired: props.isRequired,
817
+ dataIsDisabled: isDisabled,
818
+ dataDisabled: isDisabled,
819
+ dataInvalid: !!props.error,
820
+ dataHasSelection: hasProvidedRangeValue
821
+ },
822
+ renderStatic: true,
823
+ onStaticInteract: renderRealInput,
824
+ actionContent: staticTodayIcon,
825
+ actionContentPlacement: todayIconPlacement === "fieldLabel" ? "content-row" : "content-wrapper",
826
+ showClear: hasProvidedRangeValue,
827
+ wrapContentAndTrailing: true,
828
+ contentAndTrailingClassName: "gap-2!",
829
+ trailingClassName: "py-0! pl-0!",
830
+ action: showDropdown ? {
831
+ icon: ui.dateInput.calendarIcon,
832
+ onClick: _temp2,
833
+ altText: ""
834
+ } : void 0,
835
+ children: staticSegments
588
836
  });
589
837
  }
590
- return /* @__PURE__ */ jsx(DateRangePickerBase, {
591
- ...props,
592
- ...dateLimits,
593
- value: parseDateRange(props.value),
594
- onChange: (value) => props.onChange?.(formatDateRange(value))
595
- });
838
+ const T0 = DateRangePickerBase;
839
+ const t8 = mergeRefs(props.ref, inputRef);
840
+ const t9 = parseDateRange(normalizedValue);
841
+ let t10;
842
+ if ($[15] !== formatDateRange || $[16] !== props) {
843
+ t10 = (value) => props.onChange?.(formatDateRange(value));
844
+ $[15] = formatDateRange;
845
+ $[16] = props;
846
+ $[17] = t10;
847
+ } else t10 = $[17];
848
+ let t11;
849
+ if ($[18] !== T0 || $[19] !== dateLimits || $[20] !== props || $[21] !== t10 || $[22] !== t8 || $[23] !== t9) {
850
+ t11 = /* @__PURE__ */ jsx(T0, {
851
+ ...props,
852
+ ...dateLimits,
853
+ ref: t8,
854
+ value: t9,
855
+ onChange: t10
856
+ });
857
+ $[18] = T0;
858
+ $[19] = dateLimits;
859
+ $[20] = props;
860
+ $[21] = t10;
861
+ $[22] = t8;
862
+ $[23] = t9;
863
+ $[24] = t11;
864
+ } else t11 = $[24];
865
+ return t11;
866
+ };
867
+ var DateRangePicker = (t0) => {
868
+ const $ = c(30);
869
+ let maxValue;
870
+ let minValue;
871
+ let props;
872
+ let renderStaticInput;
873
+ let t1;
874
+ if ($[0] !== t0) {
875
+ ({fullIso: t1, minValue, maxValue, renderStaticInput, ...props} = t0);
876
+ $[0] = t0;
877
+ $[1] = maxValue;
878
+ $[2] = minValue;
879
+ $[3] = props;
880
+ $[4] = renderStaticInput;
881
+ $[5] = t1;
882
+ } else {
883
+ maxValue = $[1];
884
+ minValue = $[2];
885
+ props = $[3];
886
+ renderStaticInput = $[4];
887
+ t1 = $[5];
888
+ }
889
+ const fullIso = t1 === void 0 ? true : t1;
890
+ if ("formControl" in props && props.formControl) {
891
+ let formControl;
892
+ let innerProps;
893
+ let ref;
894
+ if ($[6] !== props) {
895
+ ({formControl, ref, ...innerProps} = props);
896
+ $[6] = props;
897
+ $[7] = formControl;
898
+ $[8] = innerProps;
899
+ $[9] = ref;
900
+ } else {
901
+ formControl = $[7];
902
+ innerProps = $[8];
903
+ ref = $[9];
904
+ }
905
+ const controlWithOptions = formControl.control;
906
+ let t2;
907
+ if ($[10] !== controlWithOptions._options?.disabled || $[11] !== fullIso || $[12] !== innerProps || $[13] !== maxValue || $[14] !== minValue || $[15] !== props.error || $[16] !== props.isDisabled || $[17] !== ref || $[18] !== renderStaticInput) {
908
+ t2 = (t3) => {
909
+ const { field, fieldState: t4 } = t3;
910
+ const { error, isDirty } = t4;
911
+ return /* @__PURE__ */ jsx(DateRangePickerInner, {
912
+ ...innerProps,
913
+ ref: mergeRefs(ref, field.ref),
914
+ value: field.value ?? null,
915
+ onChange: field.onChange,
916
+ onBlur: field.onBlur,
917
+ isDirty,
918
+ isDisabled: field.disabled || props.isDisabled,
919
+ isFormControlDisabled: !!controlWithOptions._options?.disabled,
920
+ error: props.error ?? error?.message,
921
+ fullIso,
922
+ minValue,
923
+ maxValue,
924
+ renderStaticInput
925
+ });
926
+ };
927
+ $[10] = controlWithOptions._options?.disabled;
928
+ $[11] = fullIso;
929
+ $[12] = innerProps;
930
+ $[13] = maxValue;
931
+ $[14] = minValue;
932
+ $[15] = props.error;
933
+ $[16] = props.isDisabled;
934
+ $[17] = ref;
935
+ $[18] = renderStaticInput;
936
+ $[19] = t2;
937
+ } else t2 = $[19];
938
+ let t3;
939
+ if ($[20] !== formControl.control || $[21] !== formControl.name || $[22] !== t2) {
940
+ t3 = /* @__PURE__ */ jsx(Controller, {
941
+ control: formControl.control,
942
+ name: formControl.name,
943
+ render: t2
944
+ });
945
+ $[20] = formControl.control;
946
+ $[21] = formControl.name;
947
+ $[22] = t2;
948
+ $[23] = t3;
949
+ } else t3 = $[23];
950
+ return t3;
951
+ }
952
+ let t2;
953
+ if ($[24] !== fullIso || $[25] !== maxValue || $[26] !== minValue || $[27] !== props || $[28] !== renderStaticInput) {
954
+ t2 = /* @__PURE__ */ jsx(DateRangePickerInner, {
955
+ ...props,
956
+ fullIso,
957
+ minValue,
958
+ maxValue,
959
+ renderStaticInput
960
+ });
961
+ $[24] = fullIso;
962
+ $[25] = maxValue;
963
+ $[26] = minValue;
964
+ $[27] = props;
965
+ $[28] = renderStaticInput;
966
+ $[29] = t2;
967
+ } else t2 = $[29];
968
+ return t2;
596
969
  };
970
+ function _temp(input) {
971
+ const container = input.getContainer?.() ?? input;
972
+ return container instanceof HTMLElement ? container.querySelector("input, button, [tabindex]:not([tabindex='-1'])") : null;
973
+ }
974
+ function _temp2() {}
597
975
  //#endregion
598
976
  export { DateRangePicker };