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