@carbon/react 1.103.0-rc.0 → 1.104.0-rc.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 (777) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +950 -950
  2. package/es/_virtual/_rolldown/runtime.js +25 -0
  3. package/es/components/AILabel/index.d.ts +29 -2
  4. package/es/components/AILabel/index.js +114 -169
  5. package/es/components/AISkeleton/AISkeletonIcon.js +23 -27
  6. package/es/components/AISkeleton/AISkeletonPlaceholder.js +19 -27
  7. package/es/components/AISkeleton/AISkeletonText.js +26 -39
  8. package/es/components/Accordion/Accordion.Skeleton.js +55 -79
  9. package/es/components/Accordion/Accordion.js +43 -61
  10. package/es/components/Accordion/AccordionItem.js +102 -156
  11. package/es/components/Accordion/AccordionProvider.js +18 -15
  12. package/es/components/AspectRatio/AspectRatio.js +41 -47
  13. package/es/components/BadgeIndicator/index.js +28 -33
  14. package/es/components/Breadcrumb/Breadcrumb.Skeleton.js +39 -50
  15. package/es/components/Breadcrumb/Breadcrumb.js +39 -51
  16. package/es/components/Breadcrumb/BreadcrumbItem.js +80 -83
  17. package/es/components/Button/Button.Skeleton.js +49 -58
  18. package/es/components/Button/Button.d.ts +1 -1
  19. package/es/components/Button/Button.js +146 -240
  20. package/es/components/Button/ButtonBase.js +82 -104
  21. package/es/components/Button/index.js +13 -6
  22. package/es/components/ButtonSet/ButtonSet.js +74 -98
  23. package/es/components/ButtonSet/index.js +12 -4
  24. package/es/components/ChatButton/ChatButton.Skeleton.js +27 -27
  25. package/es/components/ChatButton/ChatButton.js +64 -79
  26. package/es/components/Checkbox/Checkbox.Skeleton.js +26 -25
  27. package/es/components/Checkbox/Checkbox.js +116 -195
  28. package/es/components/Checkbox/index.js +13 -5
  29. package/es/components/CheckboxGroup/CheckboxGroup.js +100 -148
  30. package/es/components/ClassPrefix/index.js +21 -17
  31. package/es/components/CodeSnippet/CodeSnippet.Skeleton.js +45 -42
  32. package/es/components/CodeSnippet/CodeSnippet.js +210 -299
  33. package/es/components/ComboBox/ComboBox.js +621 -970
  34. package/es/components/ComboBox/index.js +12 -4
  35. package/es/components/ComboButton/index.js +172 -208
  36. package/es/components/ComposedModal/ComposedModal.js +311 -450
  37. package/es/components/ComposedModal/ComposedModalPresence.js +47 -42
  38. package/es/components/ComposedModal/ModalFooter.js +127 -207
  39. package/es/components/ComposedModal/ModalHeader.js +71 -101
  40. package/es/components/ComposedModal/useComposedModalState.js +21 -15
  41. package/es/components/ContainedList/ContainedList.js +67 -102
  42. package/es/components/ContainedList/ContainedListItem/ContainedListItem.js +49 -67
  43. package/es/components/ContainedList/ContainedListItem/index.js +12 -4
  44. package/es/components/ContainedList/index.js +15 -12
  45. package/es/components/ContentSwitcher/ContentSwitcher.js +108 -140
  46. package/es/components/ContextMenu/useContextMenu.js +41 -36
  47. package/es/components/Copy/Copy.js +97 -117
  48. package/es/components/Copy/index.js +12 -4
  49. package/es/components/CopyButton/CopyButton.js +81 -94
  50. package/es/components/CopyButton/index.js +12 -4
  51. package/es/components/DangerButton/DangerButton.js +11 -9
  52. package/es/components/DataTable/DataTable.d.ts +11 -11
  53. package/es/components/DataTable/DataTable.js +448 -630
  54. package/es/components/DataTable/Table.js +111 -156
  55. package/es/components/DataTable/TableActionList.js +14 -6
  56. package/es/components/DataTable/TableBatchAction.js +25 -34
  57. package/es/components/DataTable/TableBatchActions.js +78 -113
  58. package/es/components/DataTable/TableBody.js +26 -19
  59. package/es/components/DataTable/TableCell.js +31 -46
  60. package/es/components/DataTable/TableContainer.js +75 -82
  61. package/es/components/DataTable/TableContext.js +14 -6
  62. package/es/components/DataTable/TableDecoratorRow.js +30 -36
  63. package/es/components/DataTable/TableExpandHeader.js +53 -90
  64. package/es/components/DataTable/TableExpandRow.js +82 -119
  65. package/es/components/DataTable/TableExpandedRow.js +45 -51
  66. package/es/components/DataTable/TableHead.js +7 -5
  67. package/es/components/DataTable/TableHeader.js +138 -181
  68. package/es/components/DataTable/TableRow.d.ts +1 -1
  69. package/es/components/DataTable/TableRow.js +42 -76
  70. package/es/components/DataTable/TableSelectAll.js +42 -70
  71. package/es/components/DataTable/TableSelectRow.js +63 -98
  72. package/es/components/DataTable/TableSlugRow.js +35 -43
  73. package/es/components/DataTable/TableToolbar.js +33 -45
  74. package/es/components/DataTable/TableToolbarAction.js +25 -20
  75. package/es/components/DataTable/TableToolbarContent.js +14 -6
  76. package/es/components/DataTable/TableToolbarMenu.js +35 -46
  77. package/es/components/DataTable/TableToolbarSearch.js +97 -187
  78. package/es/components/DataTable/state/getDerivedStateFromProps.js +38 -43
  79. package/es/components/DataTable/state/sortStates.js +11 -9
  80. package/es/components/DataTable/state/sorting.js +53 -72
  81. package/es/components/DataTable/tools/cells.js +15 -7
  82. package/es/components/DataTable/tools/denormalize.js +27 -19
  83. package/es/components/DataTable/tools/filter.js +21 -22
  84. package/es/components/DataTable/tools/normalize.js +57 -72
  85. package/es/components/DataTable/tools/sorting.js +50 -71
  86. package/es/components/DataTableSkeleton/DataTableSkeleton.js +66 -94
  87. package/es/components/DatePicker/DatePicker.Skeleton.js +44 -51
  88. package/es/components/DatePicker/DatePicker.d.ts +4 -2
  89. package/es/components/DatePicker/DatePicker.js +485 -749
  90. package/es/components/DatePicker/DatePickerLocales.js +75 -126
  91. package/es/components/DatePicker/index.js +13 -5
  92. package/es/components/DatePicker/plugins/appendToPlugin.js +31 -45
  93. package/es/components/DatePicker/plugins/fixEventsPlugin.js +127 -171
  94. package/es/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  95. package/es/components/DatePicker/plugins/rangePlugin.js +40 -47
  96. package/es/components/DatePicker/utils.d.ts +7 -0
  97. package/es/components/DatePicker/utils.js +18 -0
  98. package/es/components/DatePickerInput/DatePickerInput.js +179 -289
  99. package/es/components/DatePickerInput/index.js +12 -4
  100. package/es/components/Dialog/Dialog.js +303 -574
  101. package/es/components/Dialog/index.js +18 -2
  102. package/es/components/Dropdown/Dropdown.Skeleton.js +26 -38
  103. package/es/components/Dropdown/Dropdown.js +344 -535
  104. package/es/components/Dropdown/index.js +13 -5
  105. package/es/components/ErrorBoundary/ErrorBoundary.js +36 -58
  106. package/es/components/ErrorBoundary/ErrorBoundaryContext.js +14 -9
  107. package/es/components/ExpandableSearch/ExpandableSearch.js +60 -69
  108. package/es/components/ExpandableSearch/index.js +12 -4
  109. package/es/components/FeatureFlags/index.d.ts +11 -2
  110. package/es/components/FeatureFlags/index.js +79 -77
  111. package/es/components/FileUploader/FileUploader.Skeleton.js +35 -30
  112. package/es/components/FileUploader/FileUploader.js +269 -343
  113. package/es/components/FileUploader/FileUploaderButton.js +110 -160
  114. package/es/components/FileUploader/FileUploaderDropContainer.js +144 -221
  115. package/es/components/FileUploader/FileUploaderItem.js +138 -157
  116. package/es/components/FileUploader/Filename.d.ts +1 -1
  117. package/es/components/FileUploader/Filename.js +53 -72
  118. package/es/components/FluidComboBox/FluidComboBox.Skeleton.js +26 -28
  119. package/es/components/FluidComboBox/FluidComboBox.js +54 -105
  120. package/es/components/FluidDatePicker/FluidDatePicker.Skeleton.js +56 -53
  121. package/es/components/FluidDatePicker/FluidDatePicker.js +46 -68
  122. package/es/components/FluidDatePickerInput/FluidDatePickerInput.js +23 -16
  123. package/es/components/FluidDropdown/FluidDropdown.Skeleton.js +26 -28
  124. package/es/components/FluidDropdown/FluidDropdown.js +55 -111
  125. package/es/components/FluidForm/FluidForm.js +29 -31
  126. package/es/components/FluidForm/FormContext.js +12 -6
  127. package/es/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js +26 -28
  128. package/es/components/FluidMultiSelect/FluidMultiSelect.js +67 -197
  129. package/es/components/FluidNumberInput/FluidNumberInput.Skeleton.js +27 -30
  130. package/es/components/FluidNumberInput/FluidNumberInput.js +63 -147
  131. package/es/components/FluidSearch/FluidSearch.Skeleton.js +27 -30
  132. package/es/components/FluidSearch/FluidSearch.js +41 -84
  133. package/es/components/FluidSelect/FluidSelect.Skeleton.js +26 -28
  134. package/es/components/FluidSelect/FluidSelect.js +40 -76
  135. package/es/components/FluidSelect/index.js +13 -5
  136. package/es/components/FluidTextArea/FluidTextArea.Skeleton.js +27 -30
  137. package/es/components/FluidTextArea/FluidTextArea.js +48 -112
  138. package/es/components/FluidTextInput/FluidPasswordInput.js +44 -99
  139. package/es/components/FluidTextInput/FluidTextInput.Skeleton.js +27 -30
  140. package/es/components/FluidTextInput/FluidTextInput.js +49 -104
  141. package/es/components/FluidTextInput/index.js +14 -6
  142. package/es/components/FluidTimePicker/FluidTimePicker.Skeleton.js +30 -33
  143. package/es/components/FluidTimePicker/FluidTimePicker.js +68 -115
  144. package/es/components/FluidTimePickerSelect/FluidTimePickerSelect.js +28 -47
  145. package/es/components/Form/Form.js +23 -25
  146. package/es/components/FormGroup/FormGroup.js +45 -67
  147. package/es/components/FormItem/FormItem.js +23 -25
  148. package/es/components/FormLabel/FormLabel.js +28 -34
  149. package/es/components/Grid/CSSGrid.d.ts +1 -1
  150. package/es/components/Grid/CSSGrid.js +85 -127
  151. package/es/components/Grid/Column.js +192 -324
  152. package/es/components/Grid/ColumnHang.js +28 -36
  153. package/es/components/Grid/FlexGrid.js +40 -60
  154. package/es/components/Grid/Grid.js +29 -42
  155. package/es/components/Grid/GridContext.js +36 -42
  156. package/es/components/Grid/Row.js +31 -49
  157. package/es/components/Heading/index.js +36 -51
  158. package/es/components/Icon/Icon.Skeleton.js +21 -21
  159. package/es/components/IconButton/index.js +117 -178
  160. package/es/components/IconIndicator/index.d.ts +1 -1
  161. package/es/components/IconIndicator/index.js +59 -60
  162. package/es/components/IdPrefix/index.js +21 -17
  163. package/es/components/InlineCheckbox/InlineCheckbox.js +69 -113
  164. package/es/components/InlineCheckbox/index.js +12 -4
  165. package/es/components/InlineLoading/InlineLoading.js +83 -100
  166. package/es/components/InlineLoading/index.js +12 -4
  167. package/es/components/Layer/LayerContext.js +12 -4
  168. package/es/components/Layer/LayerLevel.js +20 -4
  169. package/es/components/Layer/index.js +54 -66
  170. package/es/components/Layout/index.js +77 -109
  171. package/es/components/LayoutDirection/LayoutDirection.d.ts +1 -1
  172. package/es/components/LayoutDirection/LayoutDirection.js +33 -37
  173. package/es/components/LayoutDirection/LayoutDirectionContext.js +12 -6
  174. package/es/components/LayoutDirection/useLayoutDirection.js +15 -7
  175. package/es/components/Link/Link.js +63 -108
  176. package/es/components/Link/index.js +12 -4
  177. package/es/components/ListBox/ListBox.js +78 -126
  178. package/es/components/ListBox/ListBoxField.js +24 -43
  179. package/es/components/ListBox/ListBoxMenu.js +36 -42
  180. package/es/components/ListBox/ListBoxMenuIcon.js +39 -40
  181. package/es/components/ListBox/ListBoxMenuItem.js +67 -88
  182. package/es/components/ListBox/ListBoxPropTypes.js +17 -5
  183. package/es/components/ListBox/ListBoxSelection.js +71 -96
  184. package/es/components/ListBox/index.js +16 -14
  185. package/es/components/ListBox/next/ListBoxSelection.js +79 -117
  186. package/es/components/ListBox/next/ListBoxTrigger.js +44 -48
  187. package/es/components/ListItem/ListItem.js +25 -28
  188. package/es/components/Loading/Loading.js +64 -73
  189. package/es/components/Loading/index.js +12 -4
  190. package/es/components/Menu/Menu.js +220 -363
  191. package/es/components/Menu/MenuContext.d.ts +1 -1
  192. package/es/components/Menu/MenuContext.js +41 -38
  193. package/es/components/Menu/MenuItem.js +282 -413
  194. package/es/components/MenuButton/index.js +134 -195
  195. package/es/components/Modal/Modal.js +500 -660
  196. package/es/components/Modal/ModalPresence.js +39 -37
  197. package/es/components/Modal/index.js +13 -5
  198. package/es/components/ModalWrapper/ModalWrapper.d.ts +2 -2
  199. package/es/components/ModalWrapper/ModalWrapper.js +106 -130
  200. package/es/components/MultiSelect/FilterableMultiSelect.js +605 -918
  201. package/es/components/MultiSelect/MultiSelect.js +454 -716
  202. package/es/components/MultiSelect/MultiSelectPropTypes.js +13 -30
  203. package/es/components/MultiSelect/filter.js +14 -9
  204. package/es/components/MultiSelect/tools/sorting.js +21 -34
  205. package/es/components/Notification/Notification.js +508 -785
  206. package/es/components/NumberInput/NumberFormatPropTypes.js +69 -30
  207. package/es/components/NumberInput/NumberInput.Skeleton.js +29 -33
  208. package/es/components/NumberInput/NumberInput.js +567 -947
  209. package/es/components/OrderedList/OrderedList.js +31 -44
  210. package/es/components/OverflowMenu/OverflowMenu.js +335 -450
  211. package/es/components/OverflowMenu/index.js +25 -16
  212. package/es/components/OverflowMenu/next/index.js +154 -186
  213. package/es/components/OverflowMenuItem/OverflowMenuItem.js +100 -160
  214. package/es/components/OverflowMenuItem/index.js +12 -4
  215. package/es/components/OverflowMenuV2/index.js +15 -13
  216. package/es/components/PageHeader/PageHeader.js +297 -442
  217. package/es/components/PageHeader/index.js +24 -2
  218. package/es/components/Pagination/Pagination.Skeleton.js +34 -35
  219. package/es/components/Pagination/Pagination.d.ts +1 -1
  220. package/es/components/Pagination/Pagination.js +251 -356
  221. package/es/components/Pagination/experimental/PageSelector.js +38 -54
  222. package/es/components/Pagination/experimental/Pagination-story.d.ts +114 -0
  223. package/es/components/Pagination/experimental/Pagination.js +144 -196
  224. package/es/components/PaginationNav/PaginationNav.js +320 -426
  225. package/es/components/Popover/index.js +318 -437
  226. package/es/components/PrimaryButton/PrimaryButton.js +11 -9
  227. package/es/components/ProgressBar/ProgressBar.js +117 -143
  228. package/es/components/ProgressIndicator/ProgressIndicator.Skeleton.js +42 -38
  229. package/es/components/ProgressIndicator/ProgressIndicator.js +146 -243
  230. package/es/components/RadioButton/RadioButton.Skeleton.js +23 -25
  231. package/es/components/RadioButton/RadioButton.js +101 -174
  232. package/es/components/RadioButton/index.js +12 -4
  233. package/es/components/RadioButtonGroup/RadioButtonGroup.js +135 -207
  234. package/es/components/RadioTile/RadioTile.js +104 -168
  235. package/es/components/RadioTile/index.js +12 -4
  236. package/es/components/Search/Search.Skeleton.js +28 -33
  237. package/es/components/Search/Search.js +182 -278
  238. package/es/components/Search/index.js +13 -5
  239. package/es/components/Search/utils.js +11 -3
  240. package/es/components/SecondaryButton/SecondaryButton.js +11 -9
  241. package/es/components/Select/Select.Skeleton.js +27 -30
  242. package/es/components/Select/Select.js +178 -257
  243. package/es/components/Select/index.js +13 -5
  244. package/es/components/SelectItem/SelectItem.js +33 -48
  245. package/es/components/SelectItem/index.js +12 -4
  246. package/es/components/SelectItemGroup/SelectItemGroup.js +27 -37
  247. package/es/components/ShapeIndicator/index.d.ts +1 -1
  248. package/es/components/ShapeIndicator/index.js +74 -80
  249. package/es/components/SkeletonIcon/SkeletonIcon.js +21 -24
  250. package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.js +15 -24
  251. package/es/components/SkeletonText/SkeletonText.js +67 -81
  252. package/es/components/SkeletonText/index.js +12 -4
  253. package/es/components/Slider/Slider.Skeleton.js +68 -91
  254. package/es/components/Slider/Slider.js +864 -1315
  255. package/es/components/Slider/SliderHandles.js +73 -66
  256. package/es/components/Stack/HStack.js +19 -11
  257. package/es/components/Stack/Stack.js +56 -80
  258. package/es/components/Stack/VStack.js +19 -11
  259. package/es/components/StructuredList/StructuredList.Skeleton.js +55 -48
  260. package/es/components/StructuredList/StructuredList.js +178 -317
  261. package/es/components/Switch/IconSwitch.js +99 -145
  262. package/es/components/Switch/Switch.js +66 -99
  263. package/es/components/TabContent/TabContent.js +28 -34
  264. package/es/components/Tabs/Tabs.Skeleton.js +41 -36
  265. package/es/components/Tabs/Tabs.js +732 -1147
  266. package/es/components/Tabs/usePressable.js +97 -112
  267. package/es/components/Tag/DismissibleTag.js +119 -156
  268. package/es/components/Tag/OperationalTag.js +91 -111
  269. package/es/components/Tag/SelectableTag.js +94 -129
  270. package/es/components/Tag/Tag.Skeleton.js +26 -30
  271. package/es/components/Tag/Tag.js +152 -200
  272. package/es/components/Tag/isEllipsisActive.js +13 -8
  273. package/es/components/Text/Text.js +66 -79
  274. package/es/components/Text/TextDirection.js +36 -37
  275. package/es/components/Text/TextDirectionContext.js +14 -8
  276. package/es/components/Text/createTextComponent.js +21 -20
  277. package/es/components/TextArea/TextArea.Skeleton.js +25 -29
  278. package/es/components/TextArea/TextArea.js +315 -422
  279. package/es/components/TextArea/index.js +13 -5
  280. package/es/components/TextInput/ControlledPasswordInput.js +133 -198
  281. package/es/components/TextInput/PasswordInput.js +196 -303
  282. package/es/components/TextInput/TextInput.Skeleton.js +24 -28
  283. package/es/components/TextInput/TextInput.js +219 -317
  284. package/es/components/TextInput/index.js +13 -5
  285. package/es/components/TextInput/util.js +21 -25
  286. package/es/components/Theme/index.js +79 -95
  287. package/es/components/Tile/Tile.d.ts +2 -2
  288. package/es/components/Tile/Tile.js +394 -588
  289. package/es/components/TileGroup/TileGroup.js +70 -111
  290. package/es/components/TimePicker/TimePicker.d.ts +1 -1
  291. package/es/components/TimePicker/TimePicker.js +148 -247
  292. package/es/components/TimePickerSelect/TimePickerSelect.js +43 -58
  293. package/es/components/Toggle/Toggle.Skeleton.js +24 -22
  294. package/es/components/Toggle/Toggle.js +102 -171
  295. package/es/components/ToggleSmall/ToggleSmall.Skeleton.js +46 -51
  296. package/es/components/Toggletip/index.d.ts +2 -2
  297. package/es/components/Toggletip/index.js +170 -256
  298. package/es/components/Tooltip/DefinitionTooltip.js +98 -138
  299. package/es/components/Tooltip/Tooltip.js +188 -263
  300. package/es/components/TreeView/TreeContext.js +13 -5
  301. package/es/components/TreeView/TreeNode.js +361 -500
  302. package/es/components/TreeView/TreeView.js +164 -237
  303. package/es/components/UIShell/Content.js +23 -30
  304. package/es/components/UIShell/Header.js +25 -29
  305. package/es/components/UIShell/HeaderContainer.js +31 -40
  306. package/es/components/UIShell/HeaderGlobalAction.js +65 -90
  307. package/es/components/UIShell/HeaderGlobalBar.js +16 -9
  308. package/es/components/UIShell/HeaderMenu.js +141 -215
  309. package/es/components/UIShell/HeaderMenuButton.js +43 -66
  310. package/es/components/UIShell/HeaderMenuItem.js +49 -76
  311. package/es/components/UIShell/HeaderName.js +32 -44
  312. package/es/components/UIShell/HeaderNavigation.js +32 -37
  313. package/es/components/UIShell/HeaderPanel.js +74 -97
  314. package/es/components/UIShell/HeaderSideNavItems.js +27 -33
  315. package/es/components/UIShell/Link.js +29 -50
  316. package/es/components/UIShell/SideNav.js +132 -241
  317. package/es/components/UIShell/SideNavContext.js +21 -15
  318. package/es/components/UIShell/SideNavDetails.js +29 -34
  319. package/es/components/UIShell/SideNavDivider.js +21 -21
  320. package/es/components/UIShell/SideNavFooter.js +43 -52
  321. package/es/components/UIShell/SideNavHeader.js +26 -35
  322. package/es/components/UIShell/SideNavIcon.js +28 -33
  323. package/es/components/UIShell/SideNavItem.js +28 -33
  324. package/es/components/UIShell/SideNavItems.js +31 -40
  325. package/es/components/UIShell/SideNavLink.js +52 -79
  326. package/es/components/UIShell/SideNavLinkText.js +24 -25
  327. package/es/components/UIShell/SideNavMenu.js +102 -143
  328. package/es/components/UIShell/SideNavMenuItem.js +40 -52
  329. package/es/components/UIShell/SideNavSwitcher.js +59 -68
  330. package/es/components/UIShell/SkipToContent.js +28 -36
  331. package/es/components/UIShell/Switcher.js +69 -99
  332. package/es/components/UIShell/SwitcherDivider.js +16 -24
  333. package/es/components/UIShell/SwitcherItem.js +74 -114
  334. package/es/components/UnorderedList/UnorderedList.js +28 -37
  335. package/es/feature-flags.js +19 -10
  336. package/es/index.js +249 -242
  337. package/es/internal/FloatingMenu.js +246 -292
  338. package/es/internal/OptimizedResize.js +35 -46
  339. package/es/internal/Selection.js +99 -132
  340. package/es/internal/clamp.js +12 -4
  341. package/es/internal/defaultItemToString.js +15 -9
  342. package/es/internal/deprecateFieldOnObject.js +22 -14
  343. package/es/internal/environment.js +15 -7
  344. package/es/internal/getAnnouncement.js +16 -13
  345. package/es/internal/keyboard/keys.js +48 -48
  346. package/es/internal/keyboard/match.js +25 -42
  347. package/es/internal/keyboard/navigation.js +22 -27
  348. package/es/internal/noopFn.js +10 -2
  349. package/es/internal/useAttachedMenu.js +43 -51
  350. package/es/internal/useControllableState.js +43 -48
  351. package/es/internal/useDelayedState.js +30 -35
  352. package/es/internal/useEvent.js +39 -35
  353. package/es/internal/useId.js +51 -87
  354. package/es/internal/useIdPrefix.js +13 -5
  355. package/es/internal/useIsomorphicEffect.js +12 -4
  356. package/es/internal/useMatchMedia.js +29 -21
  357. package/es/internal/useMergedRefs.js +26 -22
  358. package/es/internal/useNoInteractiveChildren.js +70 -99
  359. package/es/internal/useNormalizedInputProps.js +47 -51
  360. package/es/internal/useOutsideClick.js +21 -24
  361. package/es/internal/useOverflowItems.js +89 -90
  362. package/es/internal/usePrefix.js +13 -5
  363. package/es/internal/usePresence.js +51 -54
  364. package/es/internal/usePresenceContext.js +35 -35
  365. package/es/internal/usePreviousValue.js +26 -18
  366. package/es/internal/useResizeObserver.js +57 -66
  367. package/es/internal/useSavedCallback.js +24 -17
  368. package/es/internal/utils.js +17 -9
  369. package/es/internal/warning.js +17 -22
  370. package/es/internal/wrapFocus.js +77 -98
  371. package/es/prop-types/AriaPropTypes.js +14 -6
  372. package/es/prop-types/deprecate.js +30 -27
  373. package/es/prop-types/deprecateComponent.js +17 -8
  374. package/es/prop-types/deprecateValuesWithin.js +18 -21
  375. package/es/prop-types/isRequiredOneOf.js +21 -24
  376. package/es/prop-types/requiredIfGivenPropIsTruthy.js +14 -14
  377. package/es/tools/events.js +17 -21
  378. package/es/tools/mapPopoverAlign.js +19 -18
  379. package/es/tools/mergeRefs.js +14 -17
  380. package/es/tools/setupGetInstanceId.js +16 -8
  381. package/es/tools/toggleClass.js +17 -9
  382. package/es/tools/wrapComponent.js +34 -39
  383. package/icons/index.d.ts +2 -1
  384. package/icons/index.esm.js +2 -2
  385. package/icons/index.js +7 -10
  386. package/lib/_virtual/_rolldown/runtime.js +50 -0
  387. package/lib/components/AILabel/index.d.ts +29 -2
  388. package/lib/components/AILabel/index.js +118 -171
  389. package/lib/components/AISkeleton/AISkeletonIcon.js +27 -31
  390. package/lib/components/AISkeleton/AISkeletonPlaceholder.js +29 -31
  391. package/lib/components/AISkeleton/AISkeletonText.js +30 -43
  392. package/lib/components/Accordion/Accordion.Skeleton.js +59 -84
  393. package/lib/components/Accordion/Accordion.js +47 -65
  394. package/lib/components/Accordion/AccordionItem.js +106 -160
  395. package/lib/components/Accordion/AccordionProvider.js +20 -17
  396. package/lib/components/AspectRatio/AspectRatio.js +45 -51
  397. package/lib/components/BadgeIndicator/index.js +33 -39
  398. package/lib/components/Breadcrumb/Breadcrumb.Skeleton.js +43 -55
  399. package/lib/components/Breadcrumb/Breadcrumb.js +43 -55
  400. package/lib/components/Breadcrumb/BreadcrumbItem.js +84 -87
  401. package/lib/components/Button/Button.Skeleton.js +53 -63
  402. package/lib/components/Button/Button.d.ts +1 -1
  403. package/lib/components/Button/Button.js +149 -244
  404. package/lib/components/Button/ButtonBase.js +85 -108
  405. package/lib/components/Button/index.js +13 -15
  406. package/lib/components/ButtonSet/ButtonSet.js +78 -102
  407. package/lib/components/ButtonSet/index.js +12 -9
  408. package/lib/components/ChatButton/ChatButton.Skeleton.js +31 -31
  409. package/lib/components/ChatButton/ChatButton.js +68 -83
  410. package/lib/components/Checkbox/Checkbox.Skeleton.js +30 -30
  411. package/lib/components/Checkbox/Checkbox.js +119 -198
  412. package/lib/components/Checkbox/index.js +13 -11
  413. package/lib/components/CheckboxGroup/CheckboxGroup.js +104 -152
  414. package/lib/components/ClassPrefix/index.js +24 -19
  415. package/lib/components/CodeSnippet/CodeSnippet.Skeleton.js +49 -47
  416. package/lib/components/CodeSnippet/CodeSnippet.js +215 -303
  417. package/lib/components/ComboBox/ComboBox.js +626 -974
  418. package/lib/components/ComboBox/index.js +12 -9
  419. package/lib/components/ComboButton/index.js +176 -210
  420. package/lib/components/ComposedModal/ComposedModal.js +315 -454
  421. package/lib/components/ComposedModal/ComposedModalPresence.js +49 -44
  422. package/lib/components/ComposedModal/ModalFooter.js +131 -209
  423. package/lib/components/ComposedModal/ModalHeader.js +75 -103
  424. package/lib/components/ComposedModal/useComposedModalState.js +22 -17
  425. package/lib/components/ContainedList/ContainedList.js +77 -106
  426. package/lib/components/ContainedList/ContainedListItem/ContainedListItem.js +59 -71
  427. package/lib/components/ContainedList/ContainedListItem/index.js +12 -9
  428. package/lib/components/ContainedList/index.js +18 -15
  429. package/lib/components/ContentSwitcher/ContentSwitcher.js +112 -142
  430. package/lib/components/ContextMenu/useContextMenu.js +42 -40
  431. package/lib/components/Copy/Copy.js +101 -121
  432. package/lib/components/Copy/index.js +12 -9
  433. package/lib/components/CopyButton/CopyButton.js +85 -98
  434. package/lib/components/CopyButton/index.js +12 -9
  435. package/lib/components/DangerButton/DangerButton.js +19 -13
  436. package/lib/components/DataTable/DataTable.d.ts +11 -11
  437. package/lib/components/DataTable/DataTable.js +474 -655
  438. package/lib/components/DataTable/Table.js +115 -161
  439. package/lib/components/DataTable/TableActionList.js +15 -11
  440. package/lib/components/DataTable/TableBatchAction.js +28 -38
  441. package/lib/components/DataTable/TableBatchActions.js +82 -117
  442. package/lib/components/DataTable/TableBody.js +29 -23
  443. package/lib/components/DataTable/TableCell.js +35 -50
  444. package/lib/components/DataTable/TableContainer.js +79 -86
  445. package/lib/components/DataTable/TableContext.js +15 -8
  446. package/lib/components/DataTable/TableDecoratorRow.js +34 -40
  447. package/lib/components/DataTable/TableExpandHeader.js +57 -94
  448. package/lib/components/DataTable/TableExpandRow.js +86 -123
  449. package/lib/components/DataTable/TableExpandedRow.js +49 -55
  450. package/lib/components/DataTable/TableHead.js +8 -10
  451. package/lib/components/DataTable/TableHeader.js +142 -185
  452. package/lib/components/DataTable/TableRow.d.ts +1 -1
  453. package/lib/components/DataTable/TableRow.js +46 -80
  454. package/lib/components/DataTable/TableSelectAll.js +46 -74
  455. package/lib/components/DataTable/TableSelectRow.js +67 -102
  456. package/lib/components/DataTable/TableSlugRow.js +39 -47
  457. package/lib/components/DataTable/TableToolbar.js +37 -49
  458. package/lib/components/DataTable/TableToolbarAction.js +28 -24
  459. package/lib/components/DataTable/TableToolbarContent.js +15 -11
  460. package/lib/components/DataTable/TableToolbarMenu.js +39 -50
  461. package/lib/components/DataTable/TableToolbarSearch.js +101 -191
  462. package/lib/components/DataTable/state/getDerivedStateFromProps.js +38 -47
  463. package/lib/components/DataTable/state/sortStates.js +11 -10
  464. package/lib/components/DataTable/state/sorting.js +54 -76
  465. package/lib/components/DataTable/tools/cells.js +15 -8
  466. package/lib/components/DataTable/tools/denormalize.js +27 -22
  467. package/lib/components/DataTable/tools/filter.js +21 -23
  468. package/lib/components/DataTable/tools/normalize.js +57 -76
  469. package/lib/components/DataTable/tools/sorting.js +50 -75
  470. package/lib/components/DataTableSkeleton/DataTableSkeleton.js +70 -98
  471. package/lib/components/DatePicker/DatePicker.Skeleton.js +48 -56
  472. package/lib/components/DatePicker/DatePicker.d.ts +4 -2
  473. package/lib/components/DatePicker/DatePicker.js +491 -753
  474. package/lib/components/DatePicker/DatePickerLocales.js +75 -127
  475. package/lib/components/DatePicker/index.js +13 -11
  476. package/lib/components/DatePicker/plugins/appendToPlugin.js +31 -46
  477. package/lib/components/DatePicker/plugins/fixEventsPlugin.js +127 -175
  478. package/lib/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  479. package/lib/components/DatePicker/plugins/rangePlugin.js +42 -49
  480. package/lib/components/DatePicker/utils.d.ts +7 -0
  481. package/lib/components/DatePicker/utils.js +19 -0
  482. package/lib/components/DatePickerInput/DatePickerInput.js +183 -293
  483. package/lib/components/DatePickerInput/index.js +12 -9
  484. package/lib/components/Dialog/Dialog.js +307 -576
  485. package/lib/components/Dialog/index.js +21 -13
  486. package/lib/components/Dropdown/Dropdown.Skeleton.js +30 -43
  487. package/lib/components/Dropdown/Dropdown.js +348 -539
  488. package/lib/components/Dropdown/index.js +13 -11
  489. package/lib/components/ErrorBoundary/ErrorBoundary.js +39 -62
  490. package/lib/components/ErrorBoundary/ErrorBoundaryContext.js +15 -11
  491. package/lib/components/ExpandableSearch/ExpandableSearch.js +63 -73
  492. package/lib/components/ExpandableSearch/index.js +12 -9
  493. package/lib/components/FeatureFlags/index.d.ts +11 -2
  494. package/lib/components/FeatureFlags/index.js +82 -79
  495. package/lib/components/FileUploader/FileUploader.Skeleton.js +39 -35
  496. package/lib/components/FileUploader/FileUploader.js +273 -347
  497. package/lib/components/FileUploader/FileUploaderButton.js +114 -164
  498. package/lib/components/FileUploader/FileUploaderDropContainer.js +148 -225
  499. package/lib/components/FileUploader/FileUploaderItem.js +142 -161
  500. package/lib/components/FileUploader/Filename.d.ts +1 -1
  501. package/lib/components/FileUploader/Filename.js +56 -76
  502. package/lib/components/FluidComboBox/FluidComboBox.Skeleton.js +30 -32
  503. package/lib/components/FluidComboBox/FluidComboBox.js +58 -109
  504. package/lib/components/FluidDatePicker/FluidDatePicker.Skeleton.js +60 -57
  505. package/lib/components/FluidDatePicker/FluidDatePicker.js +50 -72
  506. package/lib/components/FluidDatePickerInput/FluidDatePickerInput.js +25 -20
  507. package/lib/components/FluidDropdown/FluidDropdown.Skeleton.js +30 -32
  508. package/lib/components/FluidDropdown/FluidDropdown.js +59 -115
  509. package/lib/components/FluidForm/FluidForm.js +33 -35
  510. package/lib/components/FluidForm/FormContext.js +13 -8
  511. package/lib/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js +30 -32
  512. package/lib/components/FluidMultiSelect/FluidMultiSelect.js +71 -201
  513. package/lib/components/FluidNumberInput/FluidNumberInput.Skeleton.js +31 -34
  514. package/lib/components/FluidNumberInput/FluidNumberInput.js +67 -151
  515. package/lib/components/FluidSearch/FluidSearch.Skeleton.js +31 -34
  516. package/lib/components/FluidSearch/FluidSearch.js +45 -88
  517. package/lib/components/FluidSelect/FluidSelect.Skeleton.js +30 -32
  518. package/lib/components/FluidSelect/FluidSelect.js +44 -80
  519. package/lib/components/FluidSelect/index.js +13 -11
  520. package/lib/components/FluidTextArea/FluidTextArea.Skeleton.js +31 -34
  521. package/lib/components/FluidTextArea/FluidTextArea.js +52 -116
  522. package/lib/components/FluidTextInput/FluidPasswordInput.js +48 -103
  523. package/lib/components/FluidTextInput/FluidTextInput.Skeleton.js +31 -34
  524. package/lib/components/FluidTextInput/FluidTextInput.js +53 -108
  525. package/lib/components/FluidTextInput/index.js +14 -13
  526. package/lib/components/FluidTimePicker/FluidTimePicker.Skeleton.js +34 -37
  527. package/lib/components/FluidTimePicker/FluidTimePicker.js +72 -119
  528. package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js +31 -51
  529. package/lib/components/Form/Form.js +27 -29
  530. package/lib/components/FormGroup/FormGroup.js +49 -71
  531. package/lib/components/FormItem/FormItem.js +27 -29
  532. package/lib/components/FormLabel/FormLabel.js +32 -38
  533. package/lib/components/Grid/CSSGrid.d.ts +1 -1
  534. package/lib/components/Grid/CSSGrid.js +89 -129
  535. package/lib/components/Grid/Column.js +196 -328
  536. package/lib/components/Grid/ColumnHang.js +32 -38
  537. package/lib/components/Grid/FlexGrid.js +44 -62
  538. package/lib/components/Grid/Grid.js +32 -44
  539. package/lib/components/Grid/GridContext.js +39 -44
  540. package/lib/components/Grid/Row.js +35 -53
  541. package/lib/components/Heading/index.js +39 -53
  542. package/lib/components/Icon/Icon.Skeleton.js +25 -23
  543. package/lib/components/IconButton/index.js +121 -180
  544. package/lib/components/IconIndicator/index.d.ts +1 -1
  545. package/lib/components/IconIndicator/index.js +63 -63
  546. package/lib/components/IdPrefix/index.js +24 -19
  547. package/lib/components/InlineCheckbox/InlineCheckbox.js +72 -117
  548. package/lib/components/InlineCheckbox/index.js +12 -9
  549. package/lib/components/InlineLoading/InlineLoading.js +87 -104
  550. package/lib/components/InlineLoading/index.js +12 -9
  551. package/lib/components/Layer/LayerContext.js +14 -6
  552. package/lib/components/Layer/LayerLevel.js +20 -6
  553. package/lib/components/Layer/index.js +58 -68
  554. package/lib/components/Layout/index.js +81 -111
  555. package/lib/components/LayoutDirection/LayoutDirection.d.ts +1 -1
  556. package/lib/components/LayoutDirection/LayoutDirection.js +36 -40
  557. package/lib/components/LayoutDirection/LayoutDirectionContext.js +14 -8
  558. package/lib/components/LayoutDirection/useLayoutDirection.js +16 -9
  559. package/lib/components/Link/Link.js +67 -112
  560. package/lib/components/Link/index.js +12 -9
  561. package/lib/components/ListBox/ListBox.js +82 -130
  562. package/lib/components/ListBox/ListBoxField.js +33 -47
  563. package/lib/components/ListBox/ListBoxMenu.js +39 -46
  564. package/lib/components/ListBox/ListBoxMenuIcon.js +43 -44
  565. package/lib/components/ListBox/ListBoxMenuItem.js +71 -92
  566. package/lib/components/ListBox/ListBoxPropTypes.js +21 -9
  567. package/lib/components/ListBox/ListBoxSelection.js +75 -100
  568. package/lib/components/ListBox/index.js +17 -21
  569. package/lib/components/ListBox/next/ListBoxSelection.js +83 -121
  570. package/lib/components/ListBox/next/ListBoxTrigger.js +48 -52
  571. package/lib/components/ListItem/ListItem.js +29 -32
  572. package/lib/components/Loading/Loading.js +68 -77
  573. package/lib/components/Loading/index.js +12 -9
  574. package/lib/components/Menu/Menu.js +224 -365
  575. package/lib/components/Menu/MenuContext.d.ts +1 -1
  576. package/lib/components/Menu/MenuContext.js +42 -40
  577. package/lib/components/Menu/MenuItem.js +286 -415
  578. package/lib/components/MenuButton/index.js +138 -197
  579. package/lib/components/Modal/Modal.js +504 -665
  580. package/lib/components/Modal/ModalPresence.js +41 -39
  581. package/lib/components/Modal/index.js +13 -10
  582. package/lib/components/ModalWrapper/ModalWrapper.d.ts +2 -2
  583. package/lib/components/ModalWrapper/ModalWrapper.js +112 -134
  584. package/lib/components/MultiSelect/FilterableMultiSelect.js +611 -920
  585. package/lib/components/MultiSelect/MultiSelect.js +459 -718
  586. package/lib/components/MultiSelect/MultiSelectPropTypes.js +15 -32
  587. package/lib/components/MultiSelect/filter.js +14 -10
  588. package/lib/components/MultiSelect/tools/sorting.js +21 -35
  589. package/lib/components/Notification/Notification.js +514 -787
  590. package/lib/components/NumberInput/NumberFormatPropTypes.js +72 -33
  591. package/lib/components/NumberInput/NumberInput.Skeleton.js +33 -37
  592. package/lib/components/NumberInput/NumberInput.js +571 -950
  593. package/lib/components/OrderedList/OrderedList.js +35 -48
  594. package/lib/components/OverflowMenu/OverflowMenu.js +341 -454
  595. package/lib/components/OverflowMenu/index.js +27 -21
  596. package/lib/components/OverflowMenu/next/index.js +158 -188
  597. package/lib/components/OverflowMenuItem/OverflowMenuItem.js +104 -164
  598. package/lib/components/OverflowMenuItem/index.js +12 -9
  599. package/lib/components/OverflowMenuV2/index.js +25 -15
  600. package/lib/components/PageHeader/PageHeader.js +301 -444
  601. package/lib/components/PageHeader/index.js +27 -19
  602. package/lib/components/Pagination/Pagination.Skeleton.js +38 -37
  603. package/lib/components/Pagination/Pagination.d.ts +1 -1
  604. package/lib/components/Pagination/Pagination.js +256 -360
  605. package/lib/components/Pagination/experimental/PageSelector.js +48 -58
  606. package/lib/components/Pagination/experimental/Pagination-story.d.ts +114 -0
  607. package/lib/components/Pagination/experimental/Pagination.js +148 -200
  608. package/lib/components/PaginationNav/PaginationNav.js +324 -430
  609. package/lib/components/Popover/index.js +323 -440
  610. package/lib/components/PrimaryButton/PrimaryButton.js +19 -13
  611. package/lib/components/ProgressBar/ProgressBar.js +121 -147
  612. package/lib/components/ProgressIndicator/ProgressIndicator.Skeleton.js +46 -43
  613. package/lib/components/ProgressIndicator/ProgressIndicator.js +150 -245
  614. package/lib/components/RadioButton/RadioButton.Skeleton.js +27 -27
  615. package/lib/components/RadioButton/RadioButton.js +105 -178
  616. package/lib/components/RadioButton/index.js +12 -9
  617. package/lib/components/RadioButtonGroup/RadioButtonGroup.js +139 -211
  618. package/lib/components/RadioTile/RadioTile.js +108 -172
  619. package/lib/components/RadioTile/index.js +12 -9
  620. package/lib/components/Search/Search.Skeleton.js +32 -38
  621. package/lib/components/Search/Search.js +185 -281
  622. package/lib/components/Search/index.js +13 -11
  623. package/lib/components/Search/utils.js +11 -4
  624. package/lib/components/SecondaryButton/SecondaryButton.js +19 -13
  625. package/lib/components/Select/Select.Skeleton.js +31 -35
  626. package/lib/components/Select/Select.js +182 -261
  627. package/lib/components/Select/index.js +13 -11
  628. package/lib/components/SelectItem/SelectItem.js +37 -52
  629. package/lib/components/SelectItem/index.js +12 -9
  630. package/lib/components/SelectItemGroup/SelectItemGroup.js +31 -41
  631. package/lib/components/ShapeIndicator/index.d.ts +1 -1
  632. package/lib/components/ShapeIndicator/index.js +78 -83
  633. package/lib/components/SkeletonIcon/SkeletonIcon.js +25 -28
  634. package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.js +25 -28
  635. package/lib/components/SkeletonText/SkeletonText.js +71 -85
  636. package/lib/components/SkeletonText/index.js +12 -9
  637. package/lib/components/Slider/Slider.Skeleton.js +72 -95
  638. package/lib/components/Slider/Slider.js +868 -1319
  639. package/lib/components/Slider/SliderHandles.js +75 -68
  640. package/lib/components/Stack/HStack.js +22 -14
  641. package/lib/components/Stack/Stack.js +60 -82
  642. package/lib/components/Stack/VStack.js +22 -14
  643. package/lib/components/StructuredList/StructuredList.Skeleton.js +59 -52
  644. package/lib/components/StructuredList/StructuredList.js +182 -319
  645. package/lib/components/Switch/IconSwitch.js +103 -149
  646. package/lib/components/Switch/Switch.js +70 -103
  647. package/lib/components/TabContent/TabContent.js +32 -38
  648. package/lib/components/Tabs/Tabs.Skeleton.js +45 -41
  649. package/lib/components/Tabs/Tabs.js +738 -1151
  650. package/lib/components/Tabs/usePressable.js +98 -114
  651. package/lib/components/Tag/DismissibleTag.js +123 -160
  652. package/lib/components/Tag/OperationalTag.js +95 -115
  653. package/lib/components/Tag/SelectableTag.js +98 -133
  654. package/lib/components/Tag/Tag.Skeleton.js +30 -32
  655. package/lib/components/Tag/Tag.js +156 -204
  656. package/lib/components/Tag/isEllipsisActive.js +13 -9
  657. package/lib/components/Text/Text.js +69 -81
  658. package/lib/components/Text/TextDirection.js +39 -39
  659. package/lib/components/Text/TextDirectionContext.js +15 -10
  660. package/lib/components/Text/createTextComponent.js +29 -22
  661. package/lib/components/TextArea/TextArea.Skeleton.js +29 -34
  662. package/lib/components/TextArea/TextArea.js +319 -426
  663. package/lib/components/TextArea/index.js +13 -11
  664. package/lib/components/TextInput/ControlledPasswordInput.js +137 -202
  665. package/lib/components/TextInput/PasswordInput.js +200 -307
  666. package/lib/components/TextInput/TextInput.Skeleton.js +28 -33
  667. package/lib/components/TextInput/TextInput.js +223 -321
  668. package/lib/components/TextInput/index.js +13 -11
  669. package/lib/components/TextInput/util.js +21 -26
  670. package/lib/components/Theme/index.js +83 -97
  671. package/lib/components/Tile/Tile.d.ts +2 -2
  672. package/lib/components/Tile/Tile.js +398 -590
  673. package/lib/components/TileGroup/TileGroup.js +73 -113
  674. package/lib/components/TimePicker/TimePicker.d.ts +1 -1
  675. package/lib/components/TimePicker/TimePicker.js +152 -251
  676. package/lib/components/TimePickerSelect/TimePickerSelect.js +47 -62
  677. package/lib/components/Toggle/Toggle.Skeleton.js +28 -24
  678. package/lib/components/Toggle/Toggle.js +106 -176
  679. package/lib/components/ToggleSmall/ToggleSmall.Skeleton.js +50 -53
  680. package/lib/components/Toggletip/index.d.ts +2 -2
  681. package/lib/components/Toggletip/index.js +174 -258
  682. package/lib/components/Tooltip/DefinitionTooltip.js +102 -140
  683. package/lib/components/Tooltip/Tooltip.js +192 -265
  684. package/lib/components/TreeView/TreeContext.js +14 -7
  685. package/lib/components/TreeView/TreeNode.js +365 -504
  686. package/lib/components/TreeView/TreeView.js +169 -242
  687. package/lib/components/UIShell/Content.js +27 -34
  688. package/lib/components/UIShell/Header.js +29 -33
  689. package/lib/components/UIShell/HeaderContainer.js +34 -44
  690. package/lib/components/UIShell/HeaderGlobalAction.js +69 -94
  691. package/lib/components/UIShell/HeaderGlobalBar.js +17 -14
  692. package/lib/components/UIShell/HeaderMenu.js +146 -221
  693. package/lib/components/UIShell/HeaderMenuButton.js +47 -70
  694. package/lib/components/UIShell/HeaderMenuItem.js +53 -80
  695. package/lib/components/UIShell/HeaderName.js +36 -48
  696. package/lib/components/UIShell/HeaderNavigation.js +36 -41
  697. package/lib/components/UIShell/HeaderPanel.js +78 -101
  698. package/lib/components/UIShell/HeaderSideNavItems.js +31 -37
  699. package/lib/components/UIShell/Link.js +32 -54
  700. package/lib/components/UIShell/SideNav.js +136 -245
  701. package/lib/components/UIShell/SideNavContext.js +23 -17
  702. package/lib/components/UIShell/SideNavDetails.js +33 -38
  703. package/lib/components/UIShell/SideNavDivider.js +25 -25
  704. package/lib/components/UIShell/SideNavFooter.js +47 -56
  705. package/lib/components/UIShell/SideNavHeader.js +30 -39
  706. package/lib/components/UIShell/SideNavIcon.js +32 -37
  707. package/lib/components/UIShell/SideNavItem.js +32 -37
  708. package/lib/components/UIShell/SideNavItems.js +35 -44
  709. package/lib/components/UIShell/SideNavLink.js +56 -83
  710. package/lib/components/UIShell/SideNavLinkText.js +28 -29
  711. package/lib/components/UIShell/SideNavMenu.js +106 -148
  712. package/lib/components/UIShell/SideNavMenuItem.js +44 -56
  713. package/lib/components/UIShell/SideNavSwitcher.js +63 -72
  714. package/lib/components/UIShell/SkipToContent.js +32 -40
  715. package/lib/components/UIShell/Switcher.js +73 -103
  716. package/lib/components/UIShell/SwitcherDivider.js +26 -28
  717. package/lib/components/UIShell/SwitcherItem.js +78 -118
  718. package/lib/components/UnorderedList/UnorderedList.js +32 -41
  719. package/lib/feature-flags.js +21 -13
  720. package/lib/index.js +622 -602
  721. package/lib/internal/FloatingMenu.js +249 -296
  722. package/lib/internal/OptimizedResize.js +35 -47
  723. package/lib/internal/Selection.js +102 -134
  724. package/lib/internal/clamp.js +12 -5
  725. package/lib/internal/defaultItemToString.js +15 -10
  726. package/lib/internal/deprecateFieldOnObject.js +23 -16
  727. package/lib/internal/environment.js +15 -8
  728. package/lib/internal/getAnnouncement.js +16 -14
  729. package/lib/internal/keyboard/keys.js +48 -49
  730. package/lib/internal/keyboard/match.js +25 -43
  731. package/lib/internal/keyboard/navigation.js +22 -29
  732. package/lib/internal/noopFn.js +10 -3
  733. package/lib/internal/useAttachedMenu.js +44 -53
  734. package/lib/internal/useControllableState.js +44 -50
  735. package/lib/internal/useDelayedState.js +31 -37
  736. package/lib/internal/useEvent.js +40 -37
  737. package/lib/internal/useId.js +54 -91
  738. package/lib/internal/useIdPrefix.js +15 -7
  739. package/lib/internal/useIsomorphicEffect.js +13 -8
  740. package/lib/internal/useMatchMedia.js +30 -23
  741. package/lib/internal/useMergedRefs.js +27 -24
  742. package/lib/internal/useNoInteractiveChildren.js +73 -101
  743. package/lib/internal/useNormalizedInputProps.js +55 -53
  744. package/lib/internal/useOutsideClick.js +22 -26
  745. package/lib/internal/useOverflowItems.js +90 -94
  746. package/lib/internal/usePrefix.js +15 -7
  747. package/lib/internal/usePresence.js +52 -56
  748. package/lib/internal/usePresenceContext.js +36 -37
  749. package/lib/internal/usePreviousValue.js +27 -20
  750. package/lib/internal/useResizeObserver.js +58 -68
  751. package/lib/internal/useSavedCallback.js +25 -19
  752. package/lib/internal/utils.js +18 -11
  753. package/lib/internal/warning.js +24 -23
  754. package/lib/internal/wrapFocus.js +78 -100
  755. package/lib/prop-types/AriaPropTypes.js +17 -9
  756. package/lib/prop-types/deprecate.js +30 -29
  757. package/lib/prop-types/deprecateComponent.js +17 -10
  758. package/lib/prop-types/deprecateValuesWithin.js +18 -23
  759. package/lib/prop-types/isRequiredOneOf.js +21 -25
  760. package/lib/prop-types/requiredIfGivenPropIsTruthy.js +14 -15
  761. package/lib/tools/events.js +17 -22
  762. package/lib/tools/mapPopoverAlign.js +19 -19
  763. package/lib/tools/mergeRefs.js +14 -18
  764. package/lib/tools/setupGetInstanceId.js +16 -9
  765. package/lib/tools/toggleClass.js +17 -10
  766. package/lib/tools/wrapComponent.js +38 -43
  767. package/package.json +10 -16
  768. package/es/_virtual/_rollupPluginBabelHelpers.js +0 -40
  769. package/es/components/DataTable/stories/examples/TableToolbarFilter.d.ts +0 -54
  770. package/es/node_modules/es-toolkit/dist/compat/function/debounce.js +0 -55
  771. package/es/node_modules/es-toolkit/dist/compat/function/throttle.js +0 -23
  772. package/es/node_modules/es-toolkit/dist/function/debounce.js +0 -70
  773. package/lib/_virtual/_rollupPluginBabelHelpers.js +0 -45
  774. package/lib/components/DataTable/stories/examples/TableToolbarFilter.d.ts +0 -54
  775. package/lib/node_modules/es-toolkit/dist/compat/function/debounce.js +0 -57
  776. package/lib/node_modules/es-toolkit/dist/compat/function/throttle.js +0 -25
  777. package/lib/node_modules/es-toolkit/dist/function/debounce.js +0 -72
@@ -1,779 +1,517 @@
1
1
  /**
2
- * Copyright IBM Corp. 2016, 2023
2
+ * Copyright IBM Corp. 2016, 2026
3
3
  *
4
4
  * This source code is licensed under the Apache-2.0 license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- 'use strict';
8
+ const require_runtime = require('../../_virtual/_rolldown/runtime.js');
9
+ const require_usePrefix = require('../../internal/usePrefix.js');
10
+ const require_keys = require('../../internal/keyboard/keys.js');
11
+ const require_match = require('../../internal/keyboard/match.js');
12
+ const require_deprecate = require('../../prop-types/deprecate.js');
13
+ const require_utils = require('../../internal/utils.js');
14
+ const require_FormContext = require('../FluidForm/FormContext.js');
15
+ const require_index = require('../DatePickerInput/index.js');
16
+ const require_appendToPlugin = require('./plugins/appendToPlugin.js');
17
+ const require_fixEventsPlugin = require('./plugins/fixEventsPlugin.js');
18
+ const require_utils$1 = require('./utils.js');
19
+ const require_rangePlugin = require('./plugins/rangePlugin.js');
20
+ const require_useSavedCallback = require('../../internal/useSavedCallback.js');
21
+ const require_DatePickerLocales = require('./DatePickerLocales.js');
22
+ let classnames = require("classnames");
23
+ classnames = require_runtime.__toESM(classnames);
24
+ let react = require("react");
25
+ react = require_runtime.__toESM(react);
26
+ let prop_types = require("prop-types");
27
+ prop_types = require_runtime.__toESM(prop_types);
28
+ let react_jsx_runtime = require("react/jsx-runtime");
29
+ let _carbon_icons_react = require("@carbon/icons-react");
30
+ let flatpickr = require("flatpickr");
31
+ flatpickr = require_runtime.__toESM(flatpickr);
32
+ let flatpickr_dist_l10n_index = require("flatpickr/dist/l10n/index");
33
+ flatpickr_dist_l10n_index = require_runtime.__toESM(flatpickr_dist_l10n_index);
34
+ let _carbon_utilities = require("@carbon/utilities");
9
35
 
10
- Object.defineProperty(exports, '__esModule', { value: true });
11
-
12
- var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
13
- var PropTypes = require('prop-types');
14
- var React = require('react');
15
- var cx = require('classnames');
16
- var flatpickr = require('flatpickr');
17
- var l10n = require('flatpickr/dist/l10n/index');
18
- var DatePickerInput = require('../DatePickerInput/DatePickerInput.js');
19
- var appendToPlugin = require('./plugins/appendToPlugin.js');
20
- var fixEventsPlugin = require('./plugins/fixEventsPlugin.js');
21
- var rangePlugin = require('./plugins/rangePlugin.js');
22
- var deprecate = require('../../prop-types/deprecate.js');
23
- var keys = require('../../internal/keyboard/keys.js');
24
- var match = require('../../internal/keyboard/match.js');
25
- var utils = require('../../internal/utils.js');
26
- var usePrefix = require('../../internal/usePrefix.js');
27
- var useSavedCallback = require('../../internal/useSavedCallback.js');
28
- require('../FluidForm/FluidForm.js');
29
- var FormContext = require('../FluidForm/FormContext.js');
30
- var iconsReact = require('@carbon/icons-react');
31
- var utilities = require('@carbon/utilities');
32
- var DatePickerLocales = require('./DatePickerLocales.js');
33
-
34
- // Weekdays shorthand for English locale
35
- // Ensure localization exists before trying to access it
36
+ //#region src/components/DatePicker/DatePicker.tsx
37
+ /**
38
+ * Copyright IBM Corp. 2016, 2026
39
+ *
40
+ * This source code is licensed under the Apache-2.0 license found in the
41
+ * LICENSE file in the root directory of this source tree.
42
+ */
36
43
  function initializeWeekdayShorthand() {
37
- if (l10n?.en?.weekdays?.shorthand) {
38
- l10n.en.weekdays.shorthand.forEach((_day, index) => {
39
- const currentDay = l10n.en.weekdays.shorthand;
40
- if (currentDay[index] === 'Thu' || currentDay[index] === 'Th') {
41
- currentDay[index] = 'Th';
42
- } else {
43
- currentDay[index] = currentDay[index].charAt(0);
44
- }
45
- });
46
- }
44
+ if (flatpickr_dist_l10n_index.default?.en?.weekdays?.shorthand) flatpickr_dist_l10n_index.default.en.weekdays.shorthand.forEach((_day, index) => {
45
+ const currentDay = flatpickr_dist_l10n_index.default.en.weekdays.shorthand;
46
+ if (currentDay[index] === "Thu" || currentDay[index] === "Th") currentDay[index] = "Th";
47
+ else currentDay[index] = currentDay[index].charAt(0);
48
+ });
47
49
  }
48
50
  const forEach = Array.prototype.forEach;
49
-
50
51
  /**
51
- * @param {number} monthNumber The month number.
52
- * @param {boolean} shorthand `true` to use shorthand month.
53
- * @param {Locale} locale The Flatpickr locale data.
54
- * @returns {string} The month string.
55
- */
56
- const monthToStr = (monthNumber, shorthand, locale) => locale.months[shorthand ? 'shorthand' : 'longhand'][monthNumber];
57
-
52
+ * @param {number} monthNumber The month number.
53
+ * @param {boolean} shorthand `true` to use shorthand month.
54
+ * @param {Locale} locale The Flatpickr locale data.
55
+ * @returns {string} The month string.
56
+ */
57
+ const monthToStr = (monthNumber, shorthand, locale) => locale.months[shorthand ? "shorthand" : "longhand"][monthNumber];
58
58
  /**
59
- * @param {object} config Plugin configuration.
60
- * @param {boolean} [config.shorthand] `true` to use shorthand month.
61
- * @param {string} config.selectorFlatpickrMonthYearContainer The CSS selector for the container of month/year selection UI.
62
- * @param {string} config.selectorFlatpickrYearContainer The CSS selector for the container of year selection UI.
63
- * @param {string} config.selectorFlatpickrCurrentMonth The CSS selector for the text-based month selection UI.
64
- * @param {string} config.classFlatpickrCurrentMonth The CSS class for the text-based month selection UI.
65
- * @param {string} config.locale The locale code.
66
- * @returns {Plugin} A Flatpickr plugin to use text instead of `<select>` for month picker.
67
- */
68
- const carbonFlatpickrMonthSelectPlugin = config => fp => {
69
- const setupElements = () => {
70
- if (!fp.monthElements) {
71
- return;
72
- }
73
- fp.monthElements.forEach(elem => {
74
- if (!elem.parentNode) {
75
- return;
76
- }
77
- elem.parentNode.removeChild(elem);
78
- });
79
- fp.monthElements.splice(0, fp.monthElements.length, ...fp.monthElements.map(() => {
80
- const monthElement = fp._createElement('span', config.classFlatpickrCurrentMonth);
81
- monthElement.textContent = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
82
-
83
- // Depending on the locale, toggle the order of the month and year
84
- if (utilities.datePartsOrder.isMonthFirst(config.locale)) {
85
- fp.yearElements[0].closest(config.selectorFlatpickrMonthYearContainer).insertBefore(monthElement, fp.yearElements[0].closest(config.selectorFlatpickrYearContainer));
86
- } else {
87
- fp.yearElements[0].closest(config.selectorFlatpickrMonthYearContainer).insertAdjacentElement('afterend', monthElement);
88
- }
89
- return monthElement;
90
- }));
91
- };
92
- const updateCurrentMonth = () => {
93
- if (fp.monthElements) {
94
- const monthStr = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
95
- fp.yearElements.forEach(elem => {
96
- const currentMonthContainer = elem.closest(config.selectorFlatpickrMonthYearContainer);
97
- Array.prototype.forEach.call(currentMonthContainer.querySelectorAll('.cur-month'), monthElement => {
98
- monthElement.textContent = monthStr;
99
- });
100
- });
101
- }
102
- };
103
- const register = () => {
104
- fp.loadedPlugins.push('carbonFlatpickrMonthSelectPlugin');
105
- };
106
- return {
107
- onMonthChange: updateCurrentMonth,
108
- onValueUpdate: updateCurrentMonth,
109
- onOpen: updateCurrentMonth,
110
- onReady: [setupElements, updateCurrentMonth, register]
111
- };
59
+ * @param {object} config Plugin configuration.
60
+ * @param {boolean} [config.shorthand] `true` to use shorthand month.
61
+ * @param {string} config.selectorFlatpickrMonthYearContainer The CSS selector for the container of month/year selection UI.
62
+ * @param {string} config.selectorFlatpickrYearContainer The CSS selector for the container of year selection UI.
63
+ * @param {string} config.selectorFlatpickrCurrentMonth The CSS selector for the text-based month selection UI.
64
+ * @param {string} config.classFlatpickrCurrentMonth The CSS class for the text-based month selection UI.
65
+ * @param {string} config.locale The locale code.
66
+ * @returns {Plugin} A Flatpickr plugin to use text instead of `<select>` for month picker.
67
+ */
68
+ const carbonFlatpickrMonthSelectPlugin = (config) => (fp) => {
69
+ const setupElements = () => {
70
+ if (!fp.monthElements) return;
71
+ fp.monthElements.forEach((elem) => {
72
+ if (!elem.parentNode) return;
73
+ elem.parentNode.removeChild(elem);
74
+ });
75
+ fp.monthElements.splice(0, fp.monthElements.length, ...fp.monthElements.map(() => {
76
+ const monthElement = fp._createElement("span", config.classFlatpickrCurrentMonth);
77
+ monthElement.textContent = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
78
+ if (_carbon_utilities.datePartsOrder.isMonthFirst(config.locale)) fp.yearElements[0].closest(config.selectorFlatpickrMonthYearContainer).insertBefore(monthElement, fp.yearElements[0].closest(config.selectorFlatpickrYearContainer));
79
+ else fp.yearElements[0].closest(config.selectorFlatpickrMonthYearContainer).insertAdjacentElement("afterend", monthElement);
80
+ return monthElement;
81
+ }));
82
+ };
83
+ const updateCurrentMonth = () => {
84
+ if (fp.monthElements) {
85
+ const monthStr = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
86
+ fp.yearElements.forEach((elem) => {
87
+ const currentMonthContainer = elem.closest(config.selectorFlatpickrMonthYearContainer);
88
+ Array.prototype.forEach.call(currentMonthContainer.querySelectorAll(".cur-month"), (monthElement) => {
89
+ monthElement.textContent = monthStr;
90
+ });
91
+ });
92
+ }
93
+ };
94
+ const register = () => {
95
+ fp.loadedPlugins.push("carbonFlatpickrMonthSelectPlugin");
96
+ };
97
+ return {
98
+ onMonthChange: updateCurrentMonth,
99
+ onValueUpdate: updateCurrentMonth,
100
+ onOpen: updateCurrentMonth,
101
+ onReady: [
102
+ setupElements,
103
+ updateCurrentMonth,
104
+ register
105
+ ]
106
+ };
112
107
  };
113
-
114
108
  /**
115
- * Determine if every child in a list of children has no label specified
116
- * @param {Array<ReactElement>} children
117
- * @returns {boolean}
118
- */
109
+ * Determine if every child in a list of children has no label specified
110
+ * @param {Array<ReactElement>} children
111
+ * @returns {boolean}
112
+ */
119
113
  function isLabelTextEmpty(children) {
120
- return children.every(child => !child.props.labelText);
114
+ return children.every((child) => !child.props.labelText);
121
115
  }
122
116
  function updateClassNames(calendar, prefix) {
123
- const calendarContainer = calendar.calendarContainer;
124
- const daysContainer = calendar.days;
125
- if (calendarContainer && daysContainer) {
126
- // calendarContainer and daysContainer are undefined if flatpickr detects a mobile device
127
- calendarContainer.classList.add(`${prefix}--date-picker__calendar`);
128
- calendarContainer.querySelector('.flatpickr-month').classList.add(`${prefix}--date-picker__month`);
129
- calendarContainer.querySelector('.flatpickr-weekdays').classList.add(`${prefix}--date-picker__weekdays`);
130
- calendarContainer.querySelector('.flatpickr-days').classList.add(`${prefix}--date-picker__days`);
131
- forEach.call(calendarContainer.querySelectorAll('.flatpickr-weekday'), item => {
132
- const currentItem = item;
133
- currentItem.innerHTML = currentItem.innerHTML.replace(/\s+/g, '');
134
- currentItem.classList.add(`${prefix}--date-picker__weekday`);
135
- });
136
- forEach.call(daysContainer.querySelectorAll('.flatpickr-day'), item => {
137
- item.classList.add(`${prefix}--date-picker__day`);
138
- item.setAttribute('role', 'button');
139
- if (item.classList.contains('today') && calendar.selectedDates.length > 0) {
140
- item.classList.add('no-border');
141
- } else if (item.classList.contains('today') && calendar.selectedDates.length === 0) {
142
- item.classList.remove('no-border');
143
- }
144
- });
145
- }
117
+ const calendarContainer = calendar.calendarContainer;
118
+ const daysContainer = calendar.days;
119
+ if (calendarContainer && daysContainer) {
120
+ calendarContainer.classList.add(`${prefix}--date-picker__calendar`);
121
+ calendarContainer.querySelector(".flatpickr-month").classList.add(`${prefix}--date-picker__month`);
122
+ calendarContainer.querySelector(".flatpickr-weekdays").classList.add(`${prefix}--date-picker__weekdays`);
123
+ calendarContainer.querySelector(".flatpickr-days").classList.add(`${prefix}--date-picker__days`);
124
+ forEach.call(calendarContainer.querySelectorAll(".flatpickr-weekday"), (item) => {
125
+ const currentItem = item;
126
+ currentItem.innerHTML = currentItem.innerHTML.replace(/\s+/g, "");
127
+ currentItem.classList.add(`${prefix}--date-picker__weekday`);
128
+ });
129
+ forEach.call(daysContainer.querySelectorAll(".flatpickr-day"), (item) => {
130
+ item.classList.add(`${prefix}--date-picker__day`);
131
+ item.setAttribute("role", "button");
132
+ if (item.classList.contains("today") && calendar.selectedDates.length > 0) item.classList.add("no-border");
133
+ else if (item.classList.contains("today") && calendar.selectedDates.length === 0) item.classList.remove("no-border");
134
+ });
135
+ }
146
136
  }
147
- // eslint-disable-next-line react/display-name
148
- const DatePicker = /*#__PURE__*/React.forwardRef((props, ref) => {
149
- const {
150
- allowInput,
151
- appendTo,
152
- children,
153
- className,
154
- closeOnSelect = true,
155
- dateFormat = 'm/d/Y',
156
- datePickerType,
157
- disable,
158
- enable,
159
- inline,
160
- invalid,
161
- invalidText,
162
- warn,
163
- warnText,
164
- light = false,
165
- locale = 'en',
166
- maxDate,
167
- minDate,
168
- onChange,
169
- onClose,
170
- onOpen,
171
- readOnly = false,
172
- short = false,
173
- value,
174
- parseDate: parseDateProp,
175
- nextMonthAriaLabel = 'Next month',
176
- prevMonthAriaLabel = 'Previous month',
177
- ...rest
178
- } = props;
179
- const prefix = usePrefix.usePrefix();
180
- const {
181
- isFluid
182
- } = React.useContext(FormContext.FormContext);
183
- const [hasInput, setHasInput] = React.useState(false);
184
- // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
185
- const startInputField = React.useCallback(node => {
186
- if (node !== null) {
187
- startInputField.current = node;
188
- setHasInput(true);
189
- }
190
- }, []);
191
- const lastStartValue = React.useRef('');
192
- const calendarRef = React.useRef(null);
193
- const [calendarCloseEvent, setCalendarCloseEvent] = React.useState(null);
194
-
195
- // fix datepicker deleting the selectedDate when the calendar closes
196
- const handleCalendarClose = React.useCallback((selectedDates, dateStr, instance) => {
197
- if (lastStartValue.current && selectedDates[0] && !startInputField.current.value) {
198
- startInputField.current.value = lastStartValue.current;
199
- calendarRef.current?.setDate([startInputField.current.value, endInputField?.current?.value], true, calendarRef.current.config.dateFormat);
200
- }
201
- if (onClose) {
202
- onClose(selectedDates, dateStr, instance);
203
- }
204
- },
205
- // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
206
- [onClose]);
207
- const onCalendarClose = (selectedDates, dateStr, instance, e) => {
208
- if (e && e.type === 'clickOutside') {
209
- return;
210
- }
211
- setCalendarCloseEvent({
212
- selectedDates,
213
- dateStr,
214
- instance
215
- });
216
- };
217
- React.useEffect(() => {
218
- if (calendarCloseEvent) {
219
- const {
220
- selectedDates,
221
- dateStr,
222
- instance
223
- } = calendarCloseEvent;
224
- handleCalendarClose(selectedDates, dateStr, instance);
225
- setCalendarCloseEvent(null);
226
- }
227
- }, [calendarCloseEvent, handleCalendarClose]);
228
- const endInputField = React.useRef(null);
229
- const lastFocusedField = React.useRef(null);
230
- const savedOnChange = useSavedCallback.useSavedCallback(onChange);
231
- const savedOnOpen = useSavedCallback.useSavedCallback(onOpen);
232
- const effectiveWarn = warn && !invalid;
233
- const wrapperRef = React.useRef(null);
234
- const datePickerClasses = cx(`${prefix}--date-picker`, {
235
- [`${prefix}--date-picker--short`]: short,
236
- [`${prefix}--date-picker--light`]: light,
237
- [`${prefix}--date-picker--simple`]: datePickerType === 'simple',
238
- [`${prefix}--date-picker--single`]: datePickerType === 'single',
239
- [`${prefix}--date-picker--range`]: datePickerType === 'range',
240
- [`${prefix}--date-picker--nolabel`]: datePickerType === 'range' && isLabelTextEmpty(children)
241
- });
242
- const wrapperClasses = cx(`${prefix}--form-item`, {
243
- [String(className)]: className
244
- });
245
-
246
- // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
247
- const childrenWithProps = React.Children.toArray(children).map(
248
- // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
249
- (child, index) => {
250
- if (index === 0 && utils.isComponentElement(child, DatePickerInput.default)) {
251
- return /*#__PURE__*/React.cloneElement(child, {
252
- datePickerType,
253
- ref: startInputField,
254
- readOnly,
255
- invalid,
256
- warn: effectiveWarn
257
- });
258
- }
259
- if (index === 1 && utils.isComponentElement(child, DatePickerInput.default)) {
260
- return /*#__PURE__*/React.cloneElement(child, {
261
- datePickerType,
262
- ref: endInputField,
263
- readOnly,
264
- invalid,
265
- warn: effectiveWarn
266
- });
267
- }
268
- if (index === 0) {
269
- return /*#__PURE__*/React.cloneElement(child, {
270
- ref: startInputField,
271
- readOnly,
272
- invalid,
273
- warn: effectiveWarn
274
- });
275
- }
276
- if (index === 1) {
277
- return /*#__PURE__*/React.cloneElement(child, {
278
- ref: endInputField,
279
- readOnly,
280
- invalid,
281
- warn: effectiveWarn
282
- });
283
- }
284
- });
285
- React.useEffect(() => {
286
- initializeWeekdayShorthand();
287
- }, []);
288
- React.useEffect(() => {
289
- if (datePickerType !== 'single' && datePickerType !== 'range') {
290
- return;
291
- }
292
- if (!startInputField.current) {
293
- return;
294
- }
295
- const onHook = (_electedDates, _dateStr, instance) => {
296
- updateClassNames(instance, prefix);
297
- if (startInputField?.current) {
298
- startInputField.current.readOnly = readOnly;
299
- }
300
- if (endInputField?.current) {
301
- endInputField.current.readOnly = readOnly;
302
- }
303
- };
304
-
305
- // Logic to determine if `enable` or `disable` will be passed down. If neither
306
- // is provided, we return the default empty disabled array, allowing all dates.
307
- const enableOrDisable = enable ? 'enable' : 'disable';
308
- let enableOrDisableArr;
309
- if (!enable && !disable) {
310
- enableOrDisableArr = [];
311
- } else if (enable) {
312
- enableOrDisableArr = enable;
313
- } else {
314
- enableOrDisableArr = disable;
315
- }
316
- let localeData;
317
- if (typeof locale === 'object') {
318
- const location = locale.locale ? locale.locale : 'en';
319
- localeData = {
320
- ...l10n[location],
321
- ...locale
322
- };
323
- } else {
324
- localeData = l10n[locale];
325
- }
326
-
327
- /**
328
- * parseDate is called before the date is actually set.
329
- * It attempts to parse the input value and return a valid date string.
330
- * Flatpickr's default parser results in odd dates when given invalid
331
- * values, so instead here we normalize the month/day to `1` if given
332
- * a value outside the acceptable range.
333
- */
334
- let parseDate;
335
- if (!parseDateProp && dateFormat === 'm/d/Y') {
336
- // This function only supports the default dateFormat.
337
- parseDate = date => {
338
- // Month must be 1-12. If outside these bounds, `1` should be used.
339
- const month = date.split('/')[0] <= 12 && date.split('/')[0] > 0 ? parseInt(date.split('/')[0]) : 1;
340
- const year = parseInt(date.split('/')[2]);
341
- if (month && year) {
342
- // The month and year must be provided to be able to determine
343
- // the number of days in the month.
344
- const daysInMonth = new Date(year, month, 0).getDate();
345
- // If the day does not fall within the days in the month, `1` should be used.
346
- const day = date.split('/')[1] <= daysInMonth && date.split('/')[1] > 0 ? parseInt(date.split('/')[1]) : 1;
347
- return new Date(`${year}/${month}/${day}`);
348
- } else {
349
- // With no month and year, we cannot calculate anything.
350
- // Returning false gives flatpickr an invalid date, which will clear the input
351
- return false;
352
- }
353
- };
354
- } else if (parseDateProp) {
355
- parseDate = parseDateProp;
356
- }
357
-
358
- // Accessible arrow icons (localized manually)
359
- // Flatpickr does not currently support localization of next/previous month
360
- // labels, so we inject translated aria-labels based on the provided locale.
361
- const rightArrowHTML = `<svg aria-label="${nextMonthAriaLabel}" role="img" width="16px" height="16px" viewBox="0 0 16 16">
137
+ const DatePicker = (0, react.forwardRef)((props, ref) => {
138
+ const { allowInput, appendTo, children, className, closeOnSelect = true, dateFormat = "m/d/Y", datePickerType, disable, enable, inline, invalid, invalidText, warn, warnText, light = false, locale = "en", maxDate, minDate, onChange, onClose, onOpen, readOnly = false, short = false, value, parseDate: parseDateProp, nextMonthAriaLabel = "Next month", prevMonthAriaLabel = "Previous month", ...rest } = props;
139
+ const prefix = require_usePrefix.usePrefix();
140
+ const { isFluid } = (0, react.useContext)(require_FormContext.FormContext);
141
+ const [hasInput, setHasInput] = (0, react.useState)(false);
142
+ const startInputField = (0, react.useCallback)((node) => {
143
+ if (node !== null) {
144
+ startInputField.current = node;
145
+ setHasInput(true);
146
+ }
147
+ }, []);
148
+ const lastStartValue = (0, react.useRef)("");
149
+ const calendarRef = (0, react.useRef)(null);
150
+ const [calendarCloseEvent, setCalendarCloseEvent] = (0, react.useState)(null);
151
+ const handleCalendarClose = (0, react.useCallback)((selectedDates, dateStr, instance) => {
152
+ if (lastStartValue.current && selectedDates[0] && !startInputField.current.value) {
153
+ startInputField.current.value = lastStartValue.current;
154
+ calendarRef.current?.setDate([startInputField.current.value, endInputField?.current?.value], true, calendarRef.current.config.dateFormat);
155
+ }
156
+ if (onClose) onClose(selectedDates, dateStr, instance);
157
+ }, [onClose]);
158
+ const onCalendarClose = (selectedDates, dateStr, instance, e) => {
159
+ if (e && e.type === "clickOutside") return;
160
+ setCalendarCloseEvent({
161
+ selectedDates,
162
+ dateStr,
163
+ instance
164
+ });
165
+ };
166
+ (0, react.useEffect)(() => {
167
+ if (calendarCloseEvent) {
168
+ const { selectedDates, dateStr, instance } = calendarCloseEvent;
169
+ handleCalendarClose(selectedDates, dateStr, instance);
170
+ setCalendarCloseEvent(null);
171
+ }
172
+ }, [calendarCloseEvent, handleCalendarClose]);
173
+ const endInputField = (0, react.useRef)(null);
174
+ const lastFocusedField = (0, react.useRef)(null);
175
+ const savedOnChange = require_useSavedCallback.useSavedCallback(onChange);
176
+ const savedOnOpen = require_useSavedCallback.useSavedCallback(onOpen);
177
+ const effectiveWarn = warn && !invalid;
178
+ const wrapperRef = (0, react.useRef)(null);
179
+ const datePickerClasses = (0, classnames.default)(`${prefix}--date-picker`, {
180
+ [`${prefix}--date-picker--short`]: short,
181
+ [`${prefix}--date-picker--light`]: light,
182
+ [`${prefix}--date-picker--simple`]: datePickerType === "simple",
183
+ [`${prefix}--date-picker--single`]: datePickerType === "single",
184
+ [`${prefix}--date-picker--range`]: datePickerType === "range",
185
+ [`${prefix}--date-picker--nolabel`]: datePickerType === "range" && isLabelTextEmpty(children)
186
+ });
187
+ const wrapperClasses = (0, classnames.default)(`${prefix}--form-item`, { [String(className)]: className });
188
+ const childrenWithProps = react.default.Children.toArray(children).map((child, index) => {
189
+ if (index === 0 && require_utils.isComponentElement(child, require_index.default)) return react.default.cloneElement(child, {
190
+ datePickerType,
191
+ ref: startInputField,
192
+ readOnly,
193
+ invalid,
194
+ warn: effectiveWarn
195
+ });
196
+ if (index === 1 && require_utils.isComponentElement(child, require_index.default)) return react.default.cloneElement(child, {
197
+ datePickerType,
198
+ ref: endInputField,
199
+ readOnly,
200
+ invalid,
201
+ warn: effectiveWarn
202
+ });
203
+ if (index === 0) return react.default.cloneElement(child, {
204
+ ref: startInputField,
205
+ readOnly,
206
+ invalid,
207
+ warn: effectiveWarn
208
+ });
209
+ if (index === 1) return react.default.cloneElement(child, {
210
+ ref: endInputField,
211
+ readOnly,
212
+ invalid,
213
+ warn: effectiveWarn
214
+ });
215
+ });
216
+ (0, react.useEffect)(() => {
217
+ initializeWeekdayShorthand();
218
+ }, []);
219
+ (0, react.useEffect)(() => {
220
+ if (datePickerType !== "single" && datePickerType !== "range") return;
221
+ if (!startInputField.current) return;
222
+ const onHook = (_electedDates, _dateStr, instance) => {
223
+ updateClassNames(instance, prefix);
224
+ if (startInputField?.current) startInputField.current.readOnly = readOnly;
225
+ if (endInputField?.current) endInputField.current.readOnly = readOnly;
226
+ };
227
+ const enableOrDisable = enable ? "enable" : "disable";
228
+ let enableOrDisableArr;
229
+ if (!enable && !disable) enableOrDisableArr = [];
230
+ else if (enable) enableOrDisableArr = enable;
231
+ else enableOrDisableArr = disable;
232
+ let localeData;
233
+ if (typeof locale === "object") localeData = {
234
+ ...flatpickr_dist_l10n_index.default[locale.locale ? locale.locale : "en"],
235
+ ...locale
236
+ };
237
+ else localeData = flatpickr_dist_l10n_index.default[locale];
238
+ /**
239
+ * parseDate is called before the date is actually set.
240
+ * It attempts to parse the input value and return a valid date string.
241
+ * Flatpickr's default parser results in odd dates when given invalid
242
+ * values, so instead here we normalize the month/day to `1` if given
243
+ * a value outside the acceptable range.
244
+ */
245
+ let parseDate;
246
+ if (!parseDateProp && dateFormat === "m/d/Y") parseDate = (date) => {
247
+ const month = date.split("/")[0] <= 12 && date.split("/")[0] > 0 ? parseInt(date.split("/")[0]) : 1;
248
+ const year = parseInt(date.split("/")[2]);
249
+ if (month && year) {
250
+ const daysInMonth = new Date(year, month, 0).getDate();
251
+ const day = date.split("/")[1] <= daysInMonth && date.split("/")[1] > 0 ? parseInt(date.split("/")[1]) : 1;
252
+ return /* @__PURE__ */ new Date(`${year}/${month}/${day}`);
253
+ } else return false;
254
+ };
255
+ else if (parseDateProp) parseDate = parseDateProp;
256
+ const rightArrowHTML = `<svg aria-label="${nextMonthAriaLabel}" role="img" width="16px" height="16px" viewBox="0 0 16 16">
362
257
  <polygon points="11,8 6,13 5.3,12.3 9.6,8 5.3,3.7 6,3 "/>
363
258
  </svg>`;
364
- const leftArrowHTML = `<svg aria-label="${prevMonthAriaLabel}" role="img" width="16px" height="16px" viewBox="0 0 16 16">
259
+ const leftArrowHTML = `<svg aria-label="${prevMonthAriaLabel}" role="img" width="16px" height="16px" viewBox="0 0 16 16">
365
260
  <polygon points="5,8 10,3 10.7,3.7 6.4,8 10.7,12.3 10,13 "/>
366
261
  </svg>`;
367
- const {
368
- current: start
369
- } = startInputField;
370
- const {
371
- current: end
372
- } = endInputField;
373
- const flatpickerConfig = {
374
- inline: inline ?? false,
375
- onClose: onCalendarClose,
376
- disableMobile: true,
377
- defaultDate: value,
378
- closeOnSelect: closeOnSelect,
379
- mode: datePickerType,
380
- allowInput: allowInput ?? true,
381
- dateFormat: dateFormat,
382
- locale: localeData,
383
- [enableOrDisable]: enableOrDisableArr,
384
- minDate: minDate,
385
- maxDate: maxDate,
386
- parseDate: parseDate,
387
- plugins: [datePickerType === 'range' ? rangePlugin.rangePlugin({
388
- input: endInputField.current ?? undefined
389
- }) : () => {}, appendTo ? appendToPlugin.appendToPlugin({
390
- appendTo
391
- }) : () => {}, carbonFlatpickrMonthSelectPlugin({
392
- selectorFlatpickrMonthYearContainer: '.flatpickr-current-month',
393
- selectorFlatpickrYearContainer: '.numInputWrapper',
394
- classFlatpickrCurrentMonth: 'cur-month',
395
- locale: locale
396
- }), fixEventsPlugin.default({
397
- inputFrom: startInputField.current,
398
- inputTo: endInputField.current,
399
- lastStartValue,
400
- container: wrapperRef.current
401
- })],
402
- clickOpens: !readOnly,
403
- noCalendar: readOnly,
404
- nextArrow: rightArrowHTML,
405
- prevArrow: leftArrowHTML,
406
- onChange: (...args) => {
407
- if (!readOnly) {
408
- savedOnChange(...args);
409
- }
410
- },
411
- onReady: onHook,
412
- onMonthChange: onHook,
413
- onYearChange: onHook,
414
- onOpen: (...args) => {
415
- onHook(...args);
416
- savedOnOpen(...args);
417
- },
418
- onValueUpdate: onHook
419
- };
420
- const calendar = flatpickr(start, flatpickerConfig);
421
- calendarRef.current = calendar;
422
- const handleInputFieldKeyDown = event => {
423
- const {
424
- calendarContainer,
425
- selectedDateElem: fpSelectedDateElem,
426
- todayDateElem: fpTodayDateElem
427
- } = calendar;
428
- if (match.match(event, keys.Escape)) {
429
- calendarContainer.classList.remove('open');
430
- }
431
- if (match.match(event, keys.Tab)) {
432
- if (!event.shiftKey) {
433
- event.preventDefault();
434
- calendarContainer.classList.add('open');
435
- const selectedDateElem = calendarContainer.querySelector('.selected') && fpSelectedDateElem;
436
- const todayDateElem = calendarContainer.querySelector('.today') && fpTodayDateElem;
437
- const focusTarget = selectedDateElem || todayDateElem || calendarContainer.querySelector('.flatpickr-day[tabindex]') || calendarContainer;
438
- if (focusTarget instanceof HTMLElement) {
439
- focusTarget.focus();
440
- }
441
- if (event.target === startInputField.current) {
442
- lastFocusedField.current = startInputField.current;
443
- } else if (event.target === endInputField.current) {
444
- lastFocusedField.current = endInputField.current;
445
- }
446
- } else if (calendarRef.current?.isOpen && event.target === startInputField.current) {
447
- calendarRef.current.close();
448
- onCalendarClose(calendarRef.current.selectedDates, '', calendarRef.current, event);
449
- }
450
- }
451
- };
452
- const handleCalendarKeyDown = event => {
453
- if (!calendarRef.current || !startInputField.current) return;
454
- const lastInputField = datePickerType == 'range' ? endInputField.current : startInputField.current;
455
- if (match.match(event, keys.Tab)) {
456
- if (!event.shiftKey) {
457
- if (lastFocusedField.current === lastInputField) {
458
- lastInputField.focus();
459
- calendarRef.current.close();
460
- onCalendarClose(calendarRef.current.selectedDates, '', calendarRef.current, event);
461
- } else {
462
- event.preventDefault();
463
- lastInputField.focus();
464
- }
465
- } else {
466
- event.preventDefault();
467
- (lastFocusedField.current || startInputField.current).focus();
468
- }
469
- }
470
- };
471
- function handleOnChange(event) {
472
- const {
473
- target
474
- } = event;
475
- if (target === start) {
476
- lastStartValue.current = start.value;
477
- }
478
- if (start.value !== '') {
479
- return;
480
- }
481
- if (!calendar.selectedDates) {
482
- return;
483
- }
484
- if (calendar.selectedDates.length === 0) {
485
- return;
486
- }
487
- }
488
- function handleKeyPress(event) {
489
- if (match.match(event, keys.Enter) && closeOnSelect && datePickerType == 'single') {
490
- calendar.calendarContainer.classList.remove('open');
491
- }
492
- }
493
- if (start) {
494
- start.addEventListener('keydown', handleInputFieldKeyDown);
495
- start.addEventListener('change', handleOnChange);
496
- start.addEventListener('keypress', handleKeyPress);
497
- if (calendar && calendar.calendarContainer) {
498
- // Flatpickr's calendar dialog is not rendered in a landmark causing an
499
- // error with IBM Equal Access Accessibility Checker so we add an aria
500
- // role to the container div.
501
- calendar.calendarContainer.setAttribute('role', 'application');
502
- // IBM EAAC requires an aria-label on a role='region'
503
- calendar.calendarContainer.setAttribute('aria-label', 'calendar-container');
504
- }
505
- }
506
- if (end) {
507
- end.addEventListener('keydown', handleInputFieldKeyDown);
508
- end.addEventListener('change', handleOnChange);
509
- end.addEventListener('keypress', handleKeyPress);
510
- }
511
- if (calendar.calendarContainer) {
512
- calendar.calendarContainer.addEventListener('keydown', handleCalendarKeyDown);
513
- }
514
-
515
- //component did unmount equivalent
516
- return () => {
517
- // Note: if the `startInputField` ref is undefined then calendar will be
518
- // of type: Array and `destroy` will not be defined
519
- if (calendar && calendar.destroy) {
520
- calendar.destroy();
521
- }
522
-
523
- // prevent a duplicate date selection when a default value is set
524
- if (value) {
525
- if (start) {
526
- start.value = '';
527
- }
528
- if (end) {
529
- end.value = '';
530
- }
531
- }
532
- if (start) {
533
- start.removeEventListener('keydown', handleInputFieldKeyDown);
534
- start.removeEventListener('change', handleOnChange);
535
- start.removeEventListener('keypress', handleKeyPress);
536
- }
537
- if (end) {
538
- end.removeEventListener('keydown', handleInputFieldKeyDown);
539
- end.removeEventListener('change', handleOnChange);
540
- end.removeEventListener('keypress', handleKeyPress);
541
- }
542
- if (calendar.calendarContainer) {
543
- calendar.calendarContainer.removeEventListener('keydown', handleCalendarKeyDown);
544
- }
545
- };
546
- // eslint-disable-next-line react-hooks/exhaustive-deps
547
- }, [savedOnChange, savedOnOpen, readOnly, closeOnSelect, hasInput, datePickerType, nextMonthAriaLabel, prevMonthAriaLabel]);
548
-
549
- // this hook allows consumers to access the flatpickr calendar
550
- // instance for cases where functions like open() or close()
551
- // need to be imperatively called on the calendar
552
- // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
553
- React.useImperativeHandle(ref, () => ({
554
- get calendar() {
555
- return calendarRef.current;
556
- }
557
- }));
558
- React.useEffect(() => {
559
- if (calendarRef.current?.set) {
560
- calendarRef.current.set({
561
- dateFormat
562
- });
563
- }
564
- }, [dateFormat]);
565
- React.useEffect(() => {
566
- if (calendarRef.current?.set) {
567
- calendarRef.current.set('minDate', minDate);
568
- }
569
- }, [minDate]);
570
- React.useEffect(() => {
571
- if (calendarRef.current?.set) {
572
- calendarRef.current.set('allowInput', allowInput);
573
- }
574
- }, [allowInput]);
575
- React.useEffect(() => {
576
- if (calendarRef.current?.set) {
577
- calendarRef.current.set('maxDate', maxDate);
578
- }
579
- }, [maxDate]);
580
- React.useEffect(() => {
581
- if (calendarRef.current?.set && disable) {
582
- calendarRef.current.set('disable', disable);
583
- }
584
- }, [disable]);
585
- React.useEffect(() => {
586
- if (calendarRef.current?.set && enable) {
587
- calendarRef.current.set('enable', enable);
588
- }
589
- }, [enable]);
590
- React.useEffect(() => {
591
- if (calendarRef.current?.set && inline) {
592
- calendarRef.current.set('inline', inline);
593
- }
594
- }, [inline]);
595
- React.useEffect(() => {
596
- // when value prop is manually reset, this clears the flatpickr calendar instance and text input
597
- // run if both:
598
- // 1. value prop is set to a falsy value (`""`, `undefined`, `null`, etc) OR an array of all falsy values
599
- // 2. flatpickr instance contains values in its `selectedDates` property so it hasn't already been cleared
600
- if ((!value || Array.isArray(value) && value.every(date => !date)) && calendarRef.current?.selectedDates.length) {
601
- calendarRef.current?.clear();
602
- if (startInputField.current) {
603
- startInputField.current.value = '';
604
- }
605
- if (endInputField.current) {
606
- endInputField.current.value = '';
607
- }
608
- }
609
- }, [value, startInputField]);
610
- React.useEffect(() => {
611
- if (calendarRef.current?.set) {
612
- if (value !== undefined) {
613
- // To make up for calendarRef.current.setDate not making provision for an empty string or array
614
- if (value === '' || value === null || Array.isArray(value) && (value.length === 0 || value.every(element => !element))) {
615
- // only clear if there are selected dates to avoid unnecessary operations
616
- if (calendarRef.current.selectedDates.length > 0) {
617
- calendarRef.current.clear();
618
- }
619
- } else {
620
- calendarRef.current.setDate(value);
621
- }
622
- }
623
- updateClassNames(calendarRef.current, prefix);
624
- //for simple date picker w/o calendar; initial mount may not have value
625
- } else if (!calendarRef.current && value) {
626
- startInputField.current.value = value;
627
- }
628
- }, [value, prefix, startInputField]);
629
- let fluidError;
630
- if (isFluid) {
631
- if (invalid) {
632
- fluidError = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(iconsReact.WarningFilled, {
633
- className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid`
634
- }), /*#__PURE__*/React.createElement("hr", {
635
- className: `${prefix}--date-picker__divider`
636
- }), /*#__PURE__*/React.createElement("div", {
637
- className: `${prefix}--form-requirement`
638
- }, invalidText));
639
- } else if (warn) {
640
- fluidError = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(iconsReact.WarningAltFilled, {
641
- className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`
642
- }), /*#__PURE__*/React.createElement("hr", {
643
- className: `${prefix}--date-picker__divider`
644
- }), /*#__PURE__*/React.createElement("div", {
645
- className: `${prefix}--form-requirement`
646
- }, warnText));
647
- }
648
- }
649
- return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
650
- className: wrapperClasses,
651
- ref: ref
652
- }, rest), /*#__PURE__*/React.createElement("div", {
653
- className: datePickerClasses,
654
- ref: wrapperRef
655
- }, childrenWithProps), fluidError);
262
+ const { current: start } = startInputField;
263
+ const { current: end } = endInputField;
264
+ const calendar = (0, flatpickr.default)(start, {
265
+ inline: inline ?? false,
266
+ onClose: onCalendarClose,
267
+ disableMobile: true,
268
+ defaultDate: value,
269
+ closeOnSelect,
270
+ mode: datePickerType,
271
+ allowInput: allowInput ?? true,
272
+ dateFormat,
273
+ locale: localeData,
274
+ [enableOrDisable]: enableOrDisableArr,
275
+ minDate,
276
+ maxDate,
277
+ parseDate,
278
+ plugins: [
279
+ datePickerType === "range" ? require_rangePlugin.rangePlugin({ input: endInputField.current ?? void 0 }) : (() => {}),
280
+ appendTo ? require_appendToPlugin.appendToPlugin({ appendTo }) : (() => {}),
281
+ carbonFlatpickrMonthSelectPlugin({
282
+ selectorFlatpickrMonthYearContainer: ".flatpickr-current-month",
283
+ selectorFlatpickrYearContainer: ".numInputWrapper",
284
+ selectorFlatpickrCurrentMonth: ".cur-month",
285
+ classFlatpickrCurrentMonth: "cur-month",
286
+ locale
287
+ }),
288
+ require_fixEventsPlugin.default({
289
+ inputFrom: startInputField.current,
290
+ inputTo: endInputField.current,
291
+ lastStartValue,
292
+ container: wrapperRef.current
293
+ })
294
+ ],
295
+ clickOpens: !readOnly,
296
+ noCalendar: readOnly,
297
+ nextArrow: rightArrowHTML,
298
+ prevArrow: leftArrowHTML,
299
+ onChange: (...args) => {
300
+ if (!readOnly) savedOnChange(...args);
301
+ },
302
+ onReady: onHook,
303
+ onMonthChange: onHook,
304
+ onYearChange: onHook,
305
+ onOpen: (...args) => {
306
+ onHook(...args);
307
+ savedOnOpen(...args);
308
+ },
309
+ onValueUpdate: onHook
310
+ });
311
+ calendarRef.current = calendar;
312
+ const handleInputFieldKeyDown = (event) => {
313
+ const { calendarContainer, selectedDateElem: fpSelectedDateElem, todayDateElem: fpTodayDateElem } = calendar;
314
+ if (require_match.match(event, require_keys.Escape)) calendarContainer.classList.remove("open");
315
+ if (require_match.match(event, require_keys.Tab)) {
316
+ if (!event.shiftKey) {
317
+ event.preventDefault();
318
+ calendarContainer.classList.add("open");
319
+ const selectedDateElem = calendarContainer.querySelector(".selected") && fpSelectedDateElem;
320
+ const todayDateElem = calendarContainer.querySelector(".today") && fpTodayDateElem;
321
+ const focusTarget = selectedDateElem || todayDateElem || calendarContainer.querySelector(".flatpickr-day[tabindex]") || calendarContainer;
322
+ if (focusTarget instanceof HTMLElement) focusTarget.focus();
323
+ if (event.target === startInputField.current) lastFocusedField.current = startInputField.current;
324
+ else if (event.target === endInputField.current) lastFocusedField.current = endInputField.current;
325
+ } else if (calendarRef.current?.isOpen && event.target === startInputField.current) {
326
+ calendarRef.current.close();
327
+ onCalendarClose(calendarRef.current.selectedDates, "", calendarRef.current, event);
328
+ }
329
+ }
330
+ };
331
+ const handleCalendarKeyDown = (event) => {
332
+ if (!calendarRef.current || !startInputField.current) return;
333
+ const lastInputField = datePickerType == "range" ? endInputField.current : startInputField.current;
334
+ if (require_match.match(event, require_keys.Tab)) if (!event.shiftKey) if (lastFocusedField.current === lastInputField) {
335
+ lastInputField.focus();
336
+ calendarRef.current.close();
337
+ onCalendarClose(calendarRef.current.selectedDates, "", calendarRef.current, event);
338
+ } else {
339
+ event.preventDefault();
340
+ lastInputField.focus();
341
+ }
342
+ else {
343
+ event.preventDefault();
344
+ (lastFocusedField.current || startInputField.current).focus();
345
+ }
346
+ };
347
+ function handleOnChange(event) {
348
+ const { target } = event;
349
+ if (target === start) lastStartValue.current = start.value;
350
+ if (start.value !== "") return;
351
+ if (!calendar.selectedDates) return;
352
+ if (calendar.selectedDates.length === 0) return;
353
+ }
354
+ function handleKeyPress(event) {
355
+ if (require_match.match(event, require_keys.Enter) && closeOnSelect && datePickerType == "single") calendar.calendarContainer.classList.remove("open");
356
+ }
357
+ if (start) {
358
+ start.addEventListener("keydown", handleInputFieldKeyDown);
359
+ start.addEventListener("change", handleOnChange);
360
+ start.addEventListener("keypress", handleKeyPress);
361
+ if (calendar && calendar.calendarContainer) {
362
+ calendar.calendarContainer.setAttribute("role", "application");
363
+ calendar.calendarContainer.setAttribute("aria-label", "calendar-container");
364
+ }
365
+ }
366
+ if (end) {
367
+ end.addEventListener("keydown", handleInputFieldKeyDown);
368
+ end.addEventListener("change", handleOnChange);
369
+ end.addEventListener("keypress", handleKeyPress);
370
+ }
371
+ if (calendar.calendarContainer) calendar.calendarContainer.addEventListener("keydown", handleCalendarKeyDown);
372
+ return () => {
373
+ if (calendar && calendar.destroy) calendar.destroy();
374
+ if (value) {
375
+ if (start) start.value = "";
376
+ if (end) end.value = "";
377
+ }
378
+ if (start) {
379
+ start.removeEventListener("keydown", handleInputFieldKeyDown);
380
+ start.removeEventListener("change", handleOnChange);
381
+ start.removeEventListener("keypress", handleKeyPress);
382
+ }
383
+ if (end) {
384
+ end.removeEventListener("keydown", handleInputFieldKeyDown);
385
+ end.removeEventListener("change", handleOnChange);
386
+ end.removeEventListener("keypress", handleKeyPress);
387
+ }
388
+ if (calendar.calendarContainer) calendar.calendarContainer.removeEventListener("keydown", handleCalendarKeyDown);
389
+ };
390
+ }, [
391
+ savedOnChange,
392
+ savedOnOpen,
393
+ readOnly,
394
+ closeOnSelect,
395
+ hasInput,
396
+ datePickerType,
397
+ nextMonthAriaLabel,
398
+ prevMonthAriaLabel
399
+ ]);
400
+ (0, react.useImperativeHandle)(ref, () => ({ get calendar() {
401
+ return calendarRef.current;
402
+ } }));
403
+ (0, react.useEffect)(() => {
404
+ if (calendarRef.current?.set) calendarRef.current.set({ dateFormat });
405
+ }, [dateFormat]);
406
+ (0, react.useEffect)(() => {
407
+ if (calendarRef.current?.set) calendarRef.current.set("minDate", minDate);
408
+ }, [minDate]);
409
+ (0, react.useEffect)(() => {
410
+ if (calendarRef.current?.set) calendarRef.current.set("allowInput", allowInput);
411
+ }, [allowInput]);
412
+ (0, react.useEffect)(() => {
413
+ if (calendarRef.current?.set) calendarRef.current.set("maxDate", maxDate);
414
+ }, [maxDate]);
415
+ (0, react.useEffect)(() => {
416
+ if (calendarRef.current?.set && disable) calendarRef.current.set("disable", disable);
417
+ }, [disable]);
418
+ (0, react.useEffect)(() => {
419
+ if (calendarRef.current?.set && enable) calendarRef.current.set("enable", enable);
420
+ }, [enable]);
421
+ (0, react.useEffect)(() => {
422
+ if (calendarRef.current?.set && inline) calendarRef.current.set("inline", inline);
423
+ }, [inline]);
424
+ (0, react.useEffect)(() => {
425
+ if ((require_utils$1.isEmptyDateValue(value) || Array.isArray(value) && value.every(require_utils$1.isEmptyDateValue)) && calendarRef.current?.selectedDates.length) {
426
+ calendarRef.current?.clear();
427
+ if (startInputField.current) startInputField.current.value = "";
428
+ if (endInputField.current) endInputField.current.value = "";
429
+ }
430
+ }, [value, startInputField]);
431
+ (0, react.useEffect)(() => {
432
+ if (calendarRef.current?.set) {
433
+ if (value !== void 0) if (value === "" || value === null || Array.isArray(value) && (value.length === 0 || value.every(require_utils$1.isEmptyDateValue))) {
434
+ if (calendarRef.current.selectedDates.length > 0) calendarRef.current.clear();
435
+ } else calendarRef.current.setDate(value);
436
+ updateClassNames(calendarRef.current, prefix);
437
+ } else if (!calendarRef.current && typeof value !== "undefined" && value !== null) startInputField.current.value = value;
438
+ }, [
439
+ value,
440
+ prefix,
441
+ startInputField
442
+ ]);
443
+ let fluidError;
444
+ if (isFluid) {
445
+ if (invalid) fluidError = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
446
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_carbon_icons_react.WarningFilled, { className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid` }),
447
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("hr", { className: `${prefix}--date-picker__divider` }),
448
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
449
+ className: `${prefix}--form-requirement`,
450
+ children: invalidText
451
+ })
452
+ ] });
453
+ else if (warn) fluidError = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
454
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_carbon_icons_react.WarningAltFilled, { className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn` }),
455
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("hr", { className: `${prefix}--date-picker__divider` }),
456
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
457
+ className: `${prefix}--form-requirement`,
458
+ children: warnText
459
+ })
460
+ ] });
461
+ }
462
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
463
+ className: wrapperClasses,
464
+ ref,
465
+ ...rest,
466
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
467
+ className: datePickerClasses,
468
+ ref: wrapperRef,
469
+ children: childrenWithProps
470
+ }), fluidError]
471
+ });
656
472
  });
657
473
  DatePicker.propTypes = {
658
- /**
659
- * Flatpickr prop passthrough enables direct date input, and when set to false,
660
- * we must clear dates manually by resetting the value prop to a falsy value (such as `""`, `null`, or `undefined`) or an array of all falsy values, making it a controlled input.
661
- */
662
- allowInput: PropTypes.bool,
663
- /**
664
- * The DOM element the Flatpicker should be inserted into. `<body>` by default.
665
- */
666
- appendTo: PropTypes.object,
667
- /**
668
- * The child nodes.
669
- */
670
- children: PropTypes.node,
671
- /**
672
- * The CSS class names.
673
- */
674
- className: PropTypes.string,
675
- /**
676
- * flatpickr prop passthrough. Controls whether the calendar dropdown closes upon selection.
677
- */
678
- closeOnSelect: PropTypes.bool,
679
- /**
680
- * The date format.
681
- */
682
- dateFormat: PropTypes.string,
683
- /**
684
- * The type of the date picker:
685
- *
686
- * * `simple` - Without calendar dropdown.
687
- * * `single` - With calendar dropdown and single date.
688
- * * `range` - With calendar dropdown and a date range.
689
- */
690
- datePickerType: PropTypes.oneOf(['simple', 'single', 'range']),
691
- /**
692
- * The flatpickr `disable` option that allows a user to disable certain dates.
693
- */
694
- disable: PropTypes.array,
695
- /**
696
- * The flatpickr `enable` option that allows a user to enable certain dates.
697
- */
698
- enable: PropTypes.array,
699
- /**
700
- * The flatpickr `inline` option.
701
- */
702
- inline: PropTypes.bool,
703
- /**
704
- * Specify whether or not the control is invalid (Fluid only)
705
- */
706
- invalid: PropTypes.bool,
707
- /**
708
- * Provide the text that is displayed when the control is in error state (Fluid Only)
709
- */
710
- invalidText: PropTypes.node,
711
- /**
712
- * `true` to use the light version.
713
- */
714
- light: deprecate.deprecate(PropTypes.bool, 'The `light` prop for `DatePicker` has ' + 'been deprecated in favor of the new `Layer` component. It will be removed in the next major release.'),
715
- /**
716
- * The language locale used to format the days of the week, months, and numbers. The full list of supported locales can be found here https://github.com/flatpickr/flatpickr/tree/master/src/l10n
717
- */
718
- locale: PropTypes.oneOfType([PropTypes.object, PropTypes.oneOf(DatePickerLocales.SUPPORTED_LOCALES)]),
719
- /**
720
- * The maximum date that a user can pick to.
721
- */
722
- maxDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
723
- /**
724
- * The minimum date that a user can start picking from.
725
- */
726
- minDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
727
- /**
728
- * The `change` event handler.
729
- * `(dates: Date[], dStr: string, fp: Instance, data?: any):void;`
730
- */
731
- onChange: PropTypes.func,
732
- /**
733
- * The `close` event handler.
734
- * `(dates: Date[], dStr: string, fp: Instance, data?: any):void;`
735
- */
736
- onClose: PropTypes.func,
737
- /**
738
- * The `open` event handler.
739
- * `(dates: Date[], dStr: string, fp: Instance, data?: any):void;`
740
- */
741
- onOpen: PropTypes.func,
742
- /**
743
- * flatpickr prop passthrough. Controls how dates are parsed.
744
- */
745
- parseDate: PropTypes.func,
746
- /**
747
- * whether the DatePicker is to be readOnly
748
- * if boolean applies to all inputs
749
- * if array applies to each input in order
750
- */
751
- readOnly: PropTypes.oneOfType([PropTypes.bool, PropTypes.array]),
752
- /**
753
- * `true` to use the short version.
754
- */
755
- short: PropTypes.bool,
756
- /**
757
- * The value of the date value provided to flatpickr, could
758
- * be a date, a date number, a date string, an array of dates.
759
- */
760
- value: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object])), PropTypes.object, PropTypes.number]),
761
- /**
762
- * Specify whether the control is currently in warning state (Fluid only)
763
- */
764
- warn: PropTypes.bool,
765
- /**
766
- * Provide the text that is displayed when the control is in warning state (Fluid only)
767
- */
768
- warnText: PropTypes.node,
769
- /**
770
- * Accessible aria-label for the "next month" arrow icon.
771
- */
772
- nextMonthAriaLabel: PropTypes.string,
773
- /**
774
- * Accessible aria-label for the "previous month" arrow icon.
775
- */
776
- prevMonthAriaLabel: PropTypes.string
474
+ allowInput: prop_types.default.bool,
475
+ appendTo: prop_types.default.object,
476
+ children: prop_types.default.node,
477
+ className: prop_types.default.string,
478
+ closeOnSelect: prop_types.default.bool,
479
+ dateFormat: prop_types.default.string,
480
+ datePickerType: prop_types.default.oneOf([
481
+ "simple",
482
+ "single",
483
+ "range"
484
+ ]),
485
+ disable: prop_types.default.array,
486
+ enable: prop_types.default.array,
487
+ inline: prop_types.default.bool,
488
+ invalid: prop_types.default.bool,
489
+ invalidText: prop_types.default.node,
490
+ light: require_deprecate.deprecate(prop_types.default.bool, "The `light` prop for `DatePicker` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
491
+ locale: prop_types.default.oneOfType([prop_types.default.object, prop_types.default.oneOf(require_DatePickerLocales.SUPPORTED_LOCALES)]),
492
+ maxDate: prop_types.default.oneOfType([prop_types.default.string, prop_types.default.number]),
493
+ minDate: prop_types.default.oneOfType([prop_types.default.string, prop_types.default.number]),
494
+ onChange: prop_types.default.func,
495
+ onClose: prop_types.default.func,
496
+ onOpen: prop_types.default.func,
497
+ parseDate: prop_types.default.func,
498
+ readOnly: prop_types.default.oneOfType([prop_types.default.bool, prop_types.default.array]),
499
+ short: prop_types.default.bool,
500
+ value: prop_types.default.oneOfType([
501
+ prop_types.default.string,
502
+ prop_types.default.arrayOf(prop_types.default.oneOfType([
503
+ prop_types.default.string,
504
+ prop_types.default.number,
505
+ prop_types.default.object
506
+ ])),
507
+ prop_types.default.object,
508
+ prop_types.default.number
509
+ ]),
510
+ warn: prop_types.default.bool,
511
+ warnText: prop_types.default.node,
512
+ nextMonthAriaLabel: prop_types.default.string,
513
+ prevMonthAriaLabel: prop_types.default.string
777
514
  };
778
515
 
779
- exports.default = DatePicker;
516
+ //#endregion
517
+ exports.default = DatePicker;