@carbon/ibm-products 2.26.0 → 2.28.0-alpha.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (391) hide show
  1. package/css/index-full-carbon.css +700 -163
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +85 -22
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +700 -163
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +660 -152
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/_virtual/index.js +2 -2
  18. package/es/components/APIKeyModal/APIKeyModal.js +1 -1
  19. package/es/components/AboutModal/AboutModal.js +1 -1
  20. package/es/components/ActionBar/ActionBar.js +1 -1
  21. package/es/components/ActionBar/ActionBarItem.js +1 -1
  22. package/es/components/ActionBar/ActionBarOverflowItems.js +1 -1
  23. package/es/components/ActionSet/ActionSet.js +1 -1
  24. package/es/components/AddSelect/AddSelectBody.js +1 -1
  25. package/es/components/AddSelect/AddSelectBreadcrumbs.js +1 -1
  26. package/es/components/AddSelect/AddSelectFilter.js +1 -1
  27. package/es/components/AddSelect/AddSelectList.js +1 -1
  28. package/es/components/AddSelect/AddSelectRow.js +1 -1
  29. package/es/components/BigNumbers/BigNumbers.d.ts +11 -0
  30. package/es/components/BigNumbers/BigNumbers.js +238 -0
  31. package/es/components/BigNumbers/constants.d.ts +13 -0
  32. package/es/components/BigNumbers/constants.js +67 -0
  33. package/es/components/BigNumbers/index.d.ts +1 -0
  34. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +1 -1
  35. package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +1 -1
  36. package/es/components/Card/Card.js +1 -1
  37. package/es/components/Card/CardFooter.js +1 -1
  38. package/es/components/Card/CardHeader.js +1 -1
  39. package/es/components/Carousel/Carousel.js +1 -1
  40. package/es/components/Carousel/CarouselItem.js +1 -1
  41. package/es/components/Cascade/Cascade.js +1 -1
  42. package/es/components/Checklist/Checklist.js +1 -1
  43. package/es/components/Checklist/ChecklistChart.js +1 -1
  44. package/es/components/Checklist/ChecklistIcon.js +1 -1
  45. package/es/components/Coachmark/Coachmark.js +1 -1
  46. package/es/components/Coachmark/CoachmarkDragbar.js +1 -1
  47. package/es/components/Coachmark/CoachmarkHeader.js +1 -1
  48. package/es/components/Coachmark/CoachmarkOverlay.js +1 -1
  49. package/es/components/Coachmark/CoachmarkTagline.js +1 -1
  50. package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -1
  51. package/es/components/CoachmarkButton/CoachmarkButton.js +1 -1
  52. package/es/components/CoachmarkFixed/CoachmarkFixed.js +1 -1
  53. package/es/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +1 -1
  54. package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +1 -1
  55. package/es/components/CoachmarkStack/CoachmarkStack.js +1 -1
  56. package/es/components/CoachmarkStack/CoachmarkStackHome.js +1 -1
  57. package/es/components/ComboButton/ComboButton.js +1 -1
  58. package/es/components/CreateFullPage/CreateFullPage.js +1 -1
  59. package/es/components/CreateFullPage/CreateFullPageStep.js +1 -1
  60. package/es/components/CreateInfluencer/CreateInfluencer.js +1 -1
  61. package/es/components/CreateModal/CreateModal.js +1 -1
  62. package/es/components/CreateSidePanel/CreateSidePanel.js +1 -1
  63. package/es/components/CreateTearsheet/CreateTearsheet.js +8 -2
  64. package/es/components/CreateTearsheet/CreateTearsheetDivider.js +1 -1
  65. package/es/components/CreateTearsheet/CreateTearsheetStep.js +1 -1
  66. package/es/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +1 -1
  67. package/es/components/DataSpreadsheet/DataSpreadsheet.js +1 -1
  68. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +5 -4
  69. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +4 -3
  70. package/es/components/DataSpreadsheet/utils/checkForHoldingKey.d.ts +1 -0
  71. package/es/components/DataSpreadsheet/utils/checkForHoldingKey.js +17 -0
  72. package/es/components/Datagrid/Datagrid/Datagrid.js +10 -3
  73. package/es/components/Datagrid/Datagrid/DatagridContent.d.ts +3 -1
  74. package/es/components/Datagrid/Datagrid/DatagridContent.js +7 -3
  75. package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +8 -4
  76. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +9 -5
  77. package/es/components/Datagrid/Datagrid/DatagridRefBody.js +1 -1
  78. package/es/components/Datagrid/Datagrid/DatagridRow.js +19 -15
  79. package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +1 -1
  80. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +1 -1
  81. package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +1 -1
  82. package/es/components/Datagrid/Datagrid/DatagridToolbar.d.ts +10 -1
  83. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +22 -5
  84. package/es/components/Datagrid/Datagrid/DraggableElement.js +1 -1
  85. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +1 -1
  86. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +1 -1
  87. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +1 -1
  88. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +39 -16
  89. package/es/components/Datagrid/Datagrid/addons/Filtering/constants.d.ts +4 -1
  90. package/es/components/Datagrid/Datagrid/addons/Filtering/constants.js +5 -1
  91. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +102 -6
  92. package/es/components/Datagrid/Datagrid/addons/Filtering/utils.js +12 -1
  93. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +1 -1
  94. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +1 -1
  95. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +1 -1
  96. package/es/components/Datagrid/Datagrid/addons/stateReducer.js +1 -1
  97. package/es/components/Datagrid/useActionsColumn.js +1 -1
  98. package/es/components/Datagrid/useColumnCenterAlign.js +1 -1
  99. package/es/components/Datagrid/useColumnRightAlign.js +1 -1
  100. package/es/components/Datagrid/useDefaultStringRenderer.js +1 -1
  101. package/es/components/Datagrid/useFiltering.js +48 -47
  102. package/es/components/Datagrid/useFloatingScroll.js +1 -1
  103. package/es/components/Datagrid/useInlineEdit.js +1 -1
  104. package/es/components/Datagrid/useNestedRowExpander.js +1 -1
  105. package/es/components/Datagrid/useNestedRows.js +1 -1
  106. package/es/components/Datagrid/useRowExpander.js +1 -1
  107. package/es/components/Datagrid/useSelectAllToggle.js +6 -4
  108. package/es/components/Datagrid/useSelectRows.js +2 -2
  109. package/es/components/Datagrid/useSortableColumns.js +1 -1
  110. package/es/components/Datagrid/useStickyColumn.js +1 -1
  111. package/es/components/DelimitedList/DelimitedList.js +1 -1
  112. package/es/components/EditFullPage/EditFullPage.js +1 -1
  113. package/es/components/EditInPlace/EditInPlace.js +1 -1
  114. package/es/components/EditSidePanel/EditSidePanel.js +1 -1
  115. package/es/components/EditTearsheet/EditTearsheet.js +1 -1
  116. package/es/components/EditTearsheet/EditTearsheetForm.js +1 -1
  117. package/es/components/EditTearsheetNarrow/EditTearsheetNarrow.js +1 -1
  118. package/es/components/EditUpdateCards/EditUpdateCards.js +1 -1
  119. package/es/components/EmptyStates/EmptyState.js +1 -1
  120. package/es/components/EmptyStates/EmptyStateContent.js +1 -1
  121. package/es/components/EmptyStates/EmptyStateV2.js +1 -1
  122. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -1
  123. package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -1
  124. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -1
  125. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -1
  126. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -1
  127. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -1
  128. package/es/components/EmptyStates/assets/ErrorIllustration.js +1 -1
  129. package/es/components/EmptyStates/assets/NoDataIllustration.js +1 -1
  130. package/es/components/EmptyStates/assets/NoTagsIllustration.js +1 -1
  131. package/es/components/EmptyStates/assets/NotFoundIllustration.js +1 -1
  132. package/es/components/EmptyStates/assets/NotificationsIllustration.js +1 -1
  133. package/es/components/EmptyStates/assets/UnauthorizedIllustration.js +1 -1
  134. package/es/components/ExportModal/ExportModal.js +1 -1
  135. package/es/components/FilterSummary/FilterSummary.js +1 -1
  136. package/es/components/FullPageError/FullPageError.js +1 -1
  137. package/es/components/Guidebanner/Guidebanner.js +1 -1
  138. package/es/components/Guidebanner/GuidebannerElement.js +1 -1
  139. package/es/components/Guidebanner/GuidebannerElementButton.js +1 -1
  140. package/es/components/Guidebanner/GuidebannerElementLink.js +1 -1
  141. package/es/components/HTTPErrors/HTTPError403/HTTPError403.js +1 -1
  142. package/es/components/HTTPErrors/HTTPError404/HTTPError404.js +1 -1
  143. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +1 -1
  144. package/es/components/ImportModal/ImportModal.js +1 -1
  145. package/es/components/InlineTip/InlineTip.js +1 -1
  146. package/es/components/InlineTip/InlineTipButton.js +1 -1
  147. package/es/components/InlineTip/InlineTipLink.js +1 -1
  148. package/es/components/InterstitialScreen/InterstitialScreen.js +1 -1
  149. package/es/components/InterstitialScreenView/InterstitialScreenView.js +1 -1
  150. package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js +1 -1
  151. package/es/components/NonLinearReading/NonLinearReading.js +1 -1
  152. package/es/components/NotificationsPanel/NotificationsPanel.js +1 -1
  153. package/es/components/OptionsTile/OptionsTile.js +1 -1
  154. package/es/components/PageHeader/PageHeader.js +1 -1
  155. package/es/components/PageHeader/PageHeaderTitle.js +1 -1
  156. package/es/components/PageHeader/PageHeaderUtils.js +1 -1
  157. package/es/components/RemoveModal/RemoveModal.js +1 -1
  158. package/es/components/Saving/Saving.js +1 -1
  159. package/es/components/SearchBar/SearchBar.js +1 -1
  160. package/es/components/SidePanel/SidePanel.js +14 -7
  161. package/es/components/SidePanel/motion/variants.d.ts +39 -12
  162. package/es/components/SidePanel/motion/variants.js +42 -11
  163. package/es/components/SimpleHeader/SimpleHeader.js +1 -1
  164. package/es/components/StatusIcon/StatusIcon.js +1 -1
  165. package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +1 -1
  166. package/es/components/StringFormatter/StringFormatter.d.ts +6 -0
  167. package/es/components/StringFormatter/StringFormatter.js +79 -0
  168. package/es/components/StringFormatter/index.d.ts +1 -0
  169. package/es/components/StringFormatter/utils/enums.d.ts +14 -0
  170. package/es/components/StringFormatter/utils/enums.js +23 -0
  171. package/es/components/TagSet/TagSet.js +1 -1
  172. package/es/components/TagSet/TagSetModal.js +1 -1
  173. package/es/components/TagSet/TagSetOverflow.js +1 -1
  174. package/es/components/Tearsheet/TearsheetShell.js +13 -8
  175. package/es/components/Toolbar/Toolbar.js +1 -1
  176. package/es/components/Toolbar/ToolbarButton.js +1 -1
  177. package/es/components/Toolbar/ToolbarGroup.js +1 -1
  178. package/es/components/TooltipTrigger/TooltipTrigger.js +1 -1
  179. package/es/components/TruncatedList/TruncatedList.js +1 -1
  180. package/es/components/UserAvatar/UserAvatar.js +59 -43
  181. package/es/components/UserProfileImage/UserProfileImage.js +1 -1
  182. package/es/components/WebTerminal/WebTerminal.js +1 -1
  183. package/es/components/WebTerminal/WebTerminalContentWrapper.js +1 -1
  184. package/es/components/_Canary/Canary.js +1 -1
  185. package/es/components/index.d.ts +2 -0
  186. package/es/global/js/hooks/index.d.ts +1 -0
  187. package/es/global/js/hooks/useIsomorphicEffect.d.ts +2 -0
  188. package/es/global/js/hooks/useIsomorphicEffect.js +14 -0
  189. package/es/global/js/package-settings.d.ts +2 -0
  190. package/es/global/js/package-settings.js +2 -0
  191. package/es/index.js +2 -0
  192. package/es/node_modules/prop-types/index.js +1 -1
  193. package/es/settings.d.ts +2 -0
  194. package/lib/_virtual/index.js +2 -2
  195. package/lib/components/APIKeyModal/APIKeyModal.js +50 -49
  196. package/lib/components/AboutModal/AboutModal.js +17 -16
  197. package/lib/components/ActionBar/ActionBar.js +16 -15
  198. package/lib/components/ActionBar/ActionBarItem.js +8 -7
  199. package/lib/components/ActionBar/ActionBarOverflowItems.js +9 -8
  200. package/lib/components/ActionSet/ActionSet.js +4 -3
  201. package/lib/components/AddSelect/AddSelectBody.js +67 -66
  202. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +7 -6
  203. package/lib/components/AddSelect/AddSelectFilter.js +19 -18
  204. package/lib/components/AddSelect/AddSelectList.js +7 -6
  205. package/lib/components/AddSelect/AddSelectRow.js +33 -32
  206. package/lib/components/BigNumbers/BigNumbers.d.ts +11 -0
  207. package/lib/components/BigNumbers/BigNumbers.js +245 -0
  208. package/lib/components/BigNumbers/constants.d.ts +13 -0
  209. package/lib/components/BigNumbers/constants.js +76 -0
  210. package/lib/components/BigNumbers/index.d.ts +1 -0
  211. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +20 -19
  212. package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +3 -2
  213. package/lib/components/Card/Card.js +5 -4
  214. package/lib/components/Card/CardFooter.js +22 -21
  215. package/lib/components/Card/CardHeader.js +27 -26
  216. package/lib/components/Carousel/Carousel.js +13 -12
  217. package/lib/components/Carousel/CarouselItem.js +6 -5
  218. package/lib/components/Cascade/Cascade.js +9 -8
  219. package/lib/components/Checklist/Checklist.js +33 -32
  220. package/lib/components/Checklist/ChecklistChart.js +7 -6
  221. package/lib/components/Checklist/ChecklistIcon.js +7 -6
  222. package/lib/components/Coachmark/Coachmark.js +21 -20
  223. package/lib/components/Coachmark/CoachmarkDragbar.js +10 -9
  224. package/lib/components/Coachmark/CoachmarkHeader.js +8 -7
  225. package/lib/components/Coachmark/CoachmarkOverlay.js +10 -9
  226. package/lib/components/Coachmark/CoachmarkTagline.js +8 -7
  227. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +7 -6
  228. package/lib/components/CoachmarkButton/CoachmarkButton.js +6 -5
  229. package/lib/components/CoachmarkFixed/CoachmarkFixed.js +11 -10
  230. package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +8 -7
  231. package/lib/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +16 -15
  232. package/lib/components/CoachmarkStack/CoachmarkStack.js +20 -19
  233. package/lib/components/CoachmarkStack/CoachmarkStackHome.js +17 -16
  234. package/lib/components/ComboButton/ComboButton.js +7 -6
  235. package/lib/components/CreateFullPage/CreateFullPage.js +29 -28
  236. package/lib/components/CreateFullPage/CreateFullPageStep.js +18 -17
  237. package/lib/components/CreateInfluencer/CreateInfluencer.js +13 -12
  238. package/lib/components/CreateModal/CreateModal.js +16 -15
  239. package/lib/components/CreateSidePanel/CreateSidePanel.js +21 -20
  240. package/lib/components/CreateTearsheet/CreateTearsheet.js +27 -20
  241. package/lib/components/CreateTearsheet/CreateTearsheetDivider.js +5 -4
  242. package/lib/components/CreateTearsheet/CreateTearsheetStep.js +19 -18
  243. package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +21 -20
  244. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +22 -21
  245. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +60 -58
  246. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +42 -40
  247. package/lib/components/DataSpreadsheet/utils/checkForHoldingKey.d.ts +1 -0
  248. package/lib/components/DataSpreadsheet/utils/checkForHoldingKey.js +21 -0
  249. package/lib/components/Datagrid/Datagrid/Datagrid.js +15 -7
  250. package/lib/components/Datagrid/Datagrid/DatagridContent.d.ts +3 -1
  251. package/lib/components/Datagrid/Datagrid/DatagridContent.js +37 -32
  252. package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +8 -3
  253. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +14 -9
  254. package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +3 -2
  255. package/lib/components/Datagrid/Datagrid/DatagridRow.js +20 -15
  256. package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +4 -3
  257. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +14 -13
  258. package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +3 -2
  259. package/lib/components/Datagrid/Datagrid/DatagridToolbar.d.ts +10 -1
  260. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +24 -6
  261. package/lib/components/Datagrid/Datagrid/DraggableElement.js +13 -12
  262. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -14
  263. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +25 -24
  264. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +27 -26
  265. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +37 -14
  266. package/lib/components/Datagrid/Datagrid/addons/Filtering/constants.d.ts +4 -1
  267. package/lib/components/Datagrid/Datagrid/addons/Filtering/constants.js +6 -0
  268. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +98 -2
  269. package/lib/components/Datagrid/Datagrid/addons/Filtering/utils.js +11 -0
  270. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +15 -14
  271. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +20 -19
  272. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +9 -8
  273. package/lib/components/Datagrid/Datagrid/addons/stateReducer.js +1 -1
  274. package/lib/components/Datagrid/useActionsColumn.js +7 -6
  275. package/lib/components/Datagrid/useColumnCenterAlign.js +3 -2
  276. package/lib/components/Datagrid/useColumnRightAlign.js +3 -2
  277. package/lib/components/Datagrid/useDefaultStringRenderer.js +4 -3
  278. package/lib/components/Datagrid/useFiltering.js +46 -45
  279. package/lib/components/Datagrid/useFloatingScroll.js +6 -2
  280. package/lib/components/Datagrid/useInlineEdit.js +4 -3
  281. package/lib/components/Datagrid/useNestedRowExpander.js +4 -3
  282. package/lib/components/Datagrid/useNestedRows.js +6 -2
  283. package/lib/components/Datagrid/useRowExpander.js +3 -2
  284. package/lib/components/Datagrid/useSelectAllToggle.js +7 -4
  285. package/lib/components/Datagrid/useSelectRows.js +5 -4
  286. package/lib/components/Datagrid/useSortableColumns.js +3 -2
  287. package/lib/components/Datagrid/useStickyColumn.js +4 -3
  288. package/lib/components/DelimitedList/DelimitedList.js +8 -7
  289. package/lib/components/EditFullPage/EditFullPage.js +6 -5
  290. package/lib/components/EditInPlace/EditInPlace.js +23 -22
  291. package/lib/components/EditSidePanel/EditSidePanel.js +23 -22
  292. package/lib/components/EditTearsheet/EditTearsheet.js +18 -17
  293. package/lib/components/EditTearsheet/EditTearsheetForm.js +11 -10
  294. package/lib/components/EditTearsheetNarrow/EditTearsheetNarrow.js +6 -5
  295. package/lib/components/EditUpdateCards/EditUpdateCards.js +31 -30
  296. package/lib/components/EmptyStates/EmptyState.js +20 -19
  297. package/lib/components/EmptyStates/EmptyStateContent.js +16 -15
  298. package/lib/components/EmptyStates/EmptyStateV2.js +20 -19
  299. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +18 -17
  300. package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +18 -17
  301. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +18 -17
  302. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +18 -17
  303. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +18 -17
  304. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +18 -17
  305. package/lib/components/EmptyStates/assets/ErrorIllustration.js +7 -6
  306. package/lib/components/EmptyStates/assets/NoDataIllustration.js +7 -6
  307. package/lib/components/EmptyStates/assets/NoTagsIllustration.js +7 -6
  308. package/lib/components/EmptyStates/assets/NotFoundIllustration.js +7 -6
  309. package/lib/components/EmptyStates/assets/NotificationsIllustration.js +7 -6
  310. package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +7 -6
  311. package/lib/components/ExportModal/ExportModal.js +30 -29
  312. package/lib/components/FilterSummary/FilterSummary.js +13 -12
  313. package/lib/components/FullPageError/FullPageError.js +13 -12
  314. package/lib/components/Guidebanner/Guidebanner.js +20 -19
  315. package/lib/components/Guidebanner/GuidebannerElement.js +8 -7
  316. package/lib/components/Guidebanner/GuidebannerElementButton.js +8 -7
  317. package/lib/components/Guidebanner/GuidebannerElementLink.js +6 -5
  318. package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +11 -10
  319. package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +11 -10
  320. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +11 -10
  321. package/lib/components/ImportModal/ImportModal.js +32 -31
  322. package/lib/components/InlineTip/InlineTip.js +21 -20
  323. package/lib/components/InlineTip/InlineTipButton.js +6 -5
  324. package/lib/components/InlineTip/InlineTipLink.js +6 -5
  325. package/lib/components/InterstitialScreen/InterstitialScreen.js +13 -12
  326. package/lib/components/InterstitialScreenView/InterstitialScreenView.js +7 -6
  327. package/lib/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js +7 -6
  328. package/lib/components/NonLinearReading/NonLinearReading.js +9 -8
  329. package/lib/components/NotificationsPanel/NotificationsPanel.js +59 -58
  330. package/lib/components/OptionsTile/OptionsTile.js +21 -20
  331. package/lib/components/PageHeader/PageHeader.js +74 -73
  332. package/lib/components/PageHeader/PageHeaderTitle.js +21 -20
  333. package/lib/components/PageHeader/PageHeaderUtils.js +3 -2
  334. package/lib/components/RemoveModal/RemoveModal.js +22 -21
  335. package/lib/components/Saving/Saving.js +18 -17
  336. package/lib/components/SearchBar/SearchBar.js +20 -19
  337. package/lib/components/SidePanel/SidePanel.js +58 -50
  338. package/lib/components/SidePanel/motion/variants.d.ts +39 -12
  339. package/lib/components/SidePanel/motion/variants.js +42 -10
  340. package/lib/components/SimpleHeader/SimpleHeader.js +17 -16
  341. package/lib/components/StatusIcon/StatusIcon.js +9 -8
  342. package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +7 -6
  343. package/lib/components/StringFormatter/StringFormatter.d.ts +6 -0
  344. package/lib/components/StringFormatter/StringFormatter.js +86 -0
  345. package/lib/components/StringFormatter/index.d.ts +1 -0
  346. package/lib/components/StringFormatter/utils/enums.d.ts +14 -0
  347. package/lib/components/StringFormatter/utils/enums.js +27 -0
  348. package/lib/components/TagSet/TagSet.js +21 -20
  349. package/lib/components/TagSet/TagSetModal.js +13 -12
  350. package/lib/components/TagSet/TagSetOverflow.js +18 -17
  351. package/lib/components/Tearsheet/TearsheetShell.js +42 -36
  352. package/lib/components/Toolbar/Toolbar.js +7 -6
  353. package/lib/components/Toolbar/ToolbarButton.js +9 -8
  354. package/lib/components/Toolbar/ToolbarGroup.js +6 -5
  355. package/lib/components/TooltipTrigger/TooltipTrigger.js +6 -5
  356. package/lib/components/TruncatedList/TruncatedList.js +14 -13
  357. package/lib/components/UserAvatar/UserAvatar.js +61 -44
  358. package/lib/components/UserProfileImage/UserProfileImage.js +3 -2
  359. package/lib/components/WebTerminal/WebTerminal.js +14 -13
  360. package/lib/components/WebTerminal/WebTerminalContentWrapper.js +5 -4
  361. package/lib/components/_Canary/Canary.js +6 -5
  362. package/lib/components/index.d.ts +2 -0
  363. package/lib/global/js/hooks/index.d.ts +1 -0
  364. package/lib/global/js/hooks/useIsomorphicEffect.d.ts +2 -0
  365. package/lib/global/js/hooks/useIsomorphicEffect.js +18 -0
  366. package/lib/global/js/package-settings.d.ts +2 -0
  367. package/lib/global/js/package-settings.js +2 -0
  368. package/lib/index.js +10 -0
  369. package/lib/node_modules/prop-types/index.js +1 -1
  370. package/lib/settings.d.ts +2 -0
  371. package/package.json +8 -7
  372. package/scss/components/BigNumbers/_big-numbers.scss +151 -0
  373. package/scss/components/BigNumbers/_carbon-imports.scss +11 -0
  374. package/scss/components/BigNumbers/_index-with-carbon.scss +9 -0
  375. package/scss/components/BigNumbers/_index.scss +8 -0
  376. package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +0 -1
  377. package/scss/components/Datagrid/styles/_datagrid.scss +61 -4
  378. package/scss/components/FullPageError/_full-page-error.scss +2 -2
  379. package/scss/components/SidePanel/_side-panel.scss +9 -2
  380. package/scss/components/StringFormatter/_carbon-imports.scss +10 -0
  381. package/scss/components/StringFormatter/_index-with-carbon.scss +9 -0
  382. package/scss/components/StringFormatter/_index.scss +8 -0
  383. package/scss/components/StringFormatter/_string-formatter.scss +97 -0
  384. package/scss/components/Tearsheet/_tearsheet.scss +38 -7
  385. package/scss/components/UserAvatar/_user-avatar.scss +40 -0
  386. package/scss/components/_index-with-carbon.scss +2 -0
  387. package/scss/components/_index.scss +2 -0
  388. package/es/_virtual/index2.js +0 -10
  389. package/es/node_modules/classnames/index.js +0 -70
  390. package/lib/_virtual/index2.js +0 -14
  391. package/lib/node_modules/classnames/index.js +0 -74
@@ -5,6 +5,6 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- var classnames = {exports: {}};
8
+ var propTypes = {exports: {}};
9
9
 
10
- export { classnames as __module };
10
+ export { propTypes as __module };
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, objectSpread2 as _objectSpread2, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { forwardRef, useState, useRef, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { ComposedModal, ModalHeader, ModalBody, PasswordInput, TextInput, Form, InlineLoading, ModalFooter, Button } from '@carbon/react';
13
13
  import { ErrorFilled, InformationFilled, Copy } from '@carbon/react/icons';
14
14
  import { APIKeyDownloader } from './APIKeyDownloader.js';
@@ -9,7 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
9
9
  import React__default, { useState, useRef, useEffect } from 'react';
10
10
  import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
11
11
  import PropTypes from '../../node_modules/prop-types/index.js';
12
- import cx from '../../node_modules/classnames/index.js';
12
+ import cx from 'classnames';
13
13
  import { pkg } from '../../settings.js';
14
14
  import uuidv4 from '../../global/js/utils/uuidv4.js';
15
15
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState, useRef, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { pkg } from '../../settings.js';
13
13
  import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
14
14
  import { Button } from '@carbon/react';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { pkg } from '../../settings.js';
13
13
  import { IconButton } from '@carbon/react';
14
14
 
@@ -7,7 +7,7 @@
7
7
 
8
8
  import React__default, { useRef } from 'react';
9
9
  import PropTypes from '../../node_modules/prop-types/index.js';
10
- import cx from '../../node_modules/classnames/index.js';
10
+ import cx from 'classnames';
11
11
  import { OverflowMenu, OverflowMenuItem } from '@carbon/react';
12
12
  import uuidv4 from '../../global/js/utils/uuidv4.js';
13
13
  import { pkg } from '../../settings.js';
@@ -8,7 +8,7 @@
8
8
  import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { pkg } from '../../settings.js';
13
13
  import { allPropTypes } from '../../global/js/utils/props-helper.js';
14
14
  import { Button, ButtonSet, InlineLoading } from '@carbon/react';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { forwardRef, useState } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { Tag } from '@carbon/react';
13
13
  import { AddSelectSidebar } from './AddSelectSidebar.js';
14
14
  import { AddSelectBreadcrumbs } from './AddSelectBreadcrumbs.js';
@@ -9,7 +9,7 @@ import { defineProperty as _defineProperty } from '../../_virtual/_rollupPluginB
9
9
  import React__default from 'react';
10
10
  import { Breadcrumb, BreadcrumbItem } from '@carbon/react';
11
11
  import PropTypes from '../../node_modules/prop-types/index.js';
12
- import cx from '../../node_modules/classnames/index.js';
12
+ import cx from 'classnames';
13
13
  import { pkg } from '../../settings.js';
14
14
 
15
15
  var blockClass = "".concat(pkg.prefix, "--add-select__breadcrumbs");
@@ -8,7 +8,7 @@
8
8
  import { slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState } from 'react';
10
10
  import { Search, Button, Layer, Dropdown, ButtonSet, Tag } from '@carbon/react';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import PropTypes from '../../node_modules/prop-types/index.js';
13
13
  import { Filter } from '@carbon/react/icons';
14
14
  import { pkg } from '../../settings.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { pkg } from '../../settings.js';
13
13
  import { AddSelectRow } from './AddSelectRow.js';
14
14
  import useFocus from './hooks/useFocus.js';
@@ -10,7 +10,7 @@ import React__default, { useRef, useEffect, useCallback } from 'react';
10
10
  import { Layer, Dropdown, Button } from '@carbon/react';
11
11
  import { ChevronRight, View } from '@carbon/react/icons';
12
12
  import PropTypes from '../../node_modules/prop-types/index.js';
13
- import cx from '../../node_modules/classnames/index.js';
13
+ import cx from 'classnames';
14
14
  import { pkg } from '../../settings.js';
15
15
  import { AddSelectFormControl } from './AddSelectFormControl.js';
16
16
 
@@ -0,0 +1,11 @@
1
+ /**
2
+ * BigNumbers is used to display large values in a small area. The display of
3
+ * values can be the value itself, or grouped in a numerator / denominator fashion.
4
+ * Control over the total fraction decimals displayed as well as how the
5
+ * values/totals are displayed are done via a locale prop. Other optional props
6
+ * allow control over size, truncation, if the value is a percentage, the addition
7
+ * of a button as well as tool tip functionality.
8
+ * The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
9
+ */
10
+ export let BigNumbers: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
11
+ import React from 'react';
@@ -0,0 +1,238 @@
1
+ /**
2
+ * Copyright IBM Corp. 2020, 2024
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
+ import React__default from 'react';
10
+ import PropTypes from '../../node_modules/prop-types/index.js';
11
+ import cx from 'classnames';
12
+ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
+ import { pkg } from '../../settings.js';
14
+ import { Information, ArrowUp } from '@carbon/react/icons';
15
+ import { Tooltip, SkeletonText } from '@carbon/react';
16
+ import { DefaultLocale, BigNumbersSize, getSupportedLocale, formatValue, Characters, getIconSize } from './constants.js';
17
+ import { TooltipTrigger } from '../TooltipTrigger/TooltipTrigger.js';
18
+
19
+ var _Information;
20
+ var _excluded = ["className", "forceShowTotal", "fractionDigits", "iconButton", "loading", "label", "locale", "percentage", "size", "tooltipDescription", "total", "trending", "truncate", "value"],
21
+ _excluded2 = ["className", "size"];
22
+
23
+ // The block part of our conventional BEM class names (blockClass__E--M).
24
+ var blockClass = "".concat(pkg.prefix, "--big-numbers");
25
+ var skeletonBlockClass = "".concat(pkg.prefix, "--big-numbers-skeleton");
26
+ var componentName = 'BigNumbers';
27
+
28
+ // NOTE: the component SCSS is not imported here: it is rolled up separately.
29
+
30
+ // Default values for props
31
+ var defaults = {
32
+ forceShowTotal: false,
33
+ fractionDigits: 1,
34
+ loading: false,
35
+ locale: DefaultLocale,
36
+ percentage: false,
37
+ size: BigNumbersSize.Default,
38
+ total: 0,
39
+ trending: false,
40
+ truncate: true,
41
+ value: null
42
+ };
43
+
44
+ /**
45
+ * BigNumbers is used to display large values in a small area. The display of
46
+ * values can be the value itself, or grouped in a numerator / denominator fashion.
47
+ * Control over the total fraction decimals displayed as well as how the
48
+ * values/totals are displayed are done via a locale prop. Other optional props
49
+ * allow control over size, truncation, if the value is a percentage, the addition
50
+ * of a button as well as tool tip functionality.
51
+ * The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
52
+ */
53
+ var BigNumbers = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
54
+ var _formatValue, _formatValue2;
55
+ var className = _ref.className,
56
+ _ref$forceShowTotal = _ref.forceShowTotal,
57
+ forceShowTotal = _ref$forceShowTotal === void 0 ? defaults.forceShowTotal : _ref$forceShowTotal,
58
+ _ref$fractionDigits = _ref.fractionDigits,
59
+ fractionDigits = _ref$fractionDigits === void 0 ? defaults.fractionDigits : _ref$fractionDigits,
60
+ iconButton = _ref.iconButton,
61
+ _ref$loading = _ref.loading,
62
+ loading = _ref$loading === void 0 ? defaults.loading : _ref$loading,
63
+ label = _ref.label,
64
+ _ref$locale = _ref.locale,
65
+ locale = _ref$locale === void 0 ? defaults.locale : _ref$locale,
66
+ _ref$percentage = _ref.percentage,
67
+ percentage = _ref$percentage === void 0 ? defaults.percentage : _ref$percentage,
68
+ _ref$size = _ref.size,
69
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
70
+ tooltipDescription = _ref.tooltipDescription,
71
+ _ref$total = _ref.total,
72
+ total = _ref$total === void 0 ? defaults.total : _ref$total,
73
+ _ref$trending = _ref.trending,
74
+ trending = _ref$trending === void 0 ? defaults.trending : _ref$trending,
75
+ _ref$truncate = _ref.truncate,
76
+ truncate = _ref$truncate === void 0 ? defaults.truncate : _ref$truncate,
77
+ _ref$value = _ref.value,
78
+ value = _ref$value === void 0 ? defaults.value : _ref$value,
79
+ rest = _objectWithoutProperties(_ref, _excluded);
80
+ var BigNumbersClasses = cx(className, _defineProperty(_defineProperty({}, "".concat(blockClass, "--lg"), size === BigNumbersSize.Large), "".concat(blockClass, "--xl"), size === BigNumbersSize.XLarge));
81
+ var supportedLocale = getSupportedLocale(locale);
82
+ var truncatedValue = (_formatValue = formatValue(supportedLocale, value, fractionDigits, truncate)) !== null && _formatValue !== void 0 ? _formatValue : Characters.Dash;
83
+ var truncatedTotal = (_formatValue2 = formatValue(supportedLocale, total, fractionDigits, truncate)) !== null && _formatValue2 !== void 0 ? _formatValue2 : 'Unknown';
84
+ var shouldDisplayDenominator = !percentage && total > value && truncatedValue !== truncatedTotal || forceShowTotal && total > 0;
85
+ if (loading) {
86
+ return /*#__PURE__*/React__default.createElement(SkeletonBigNumbers, _extends({}, rest, {
87
+ ref: ref,
88
+ className: className,
89
+ size: size
90
+ }, getDevtoolsProps(componentName)));
91
+ }
92
+ return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
93
+ className: cx(blockClass, BigNumbersClasses, className),
94
+ ref: ref
95
+ }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("span", {
96
+ className: "".concat(blockClass, "__row")
97
+ }, /*#__PURE__*/React__default.createElement("h4", {
98
+ className: "".concat(blockClass, "__label")
99
+ }, label), tooltipDescription && /*#__PURE__*/React__default.createElement(Tooltip, {
100
+ description: tooltipDescription,
101
+ align: "right",
102
+ className: "".concat(blockClass, "__info")
103
+ }, /*#__PURE__*/React__default.createElement(TooltipTrigger, {
104
+ className: "".concat(blockClass, "__tooltip-trigger")
105
+ }, _Information || (_Information = /*#__PURE__*/React__default.createElement(Information, {
106
+ size: 16
107
+ }))))), /*#__PURE__*/React__default.createElement("span", {
108
+ className: "".concat(blockClass, "__row"),
109
+ role: "math"
110
+ }, trending && /*#__PURE__*/React__default.createElement(ArrowUp, {
111
+ className: "".concat(blockClass, "__trend"),
112
+ size: getIconSize(size)
113
+ }), /*#__PURE__*/React__default.createElement("span", {
114
+ className: "".concat(blockClass, "__value")
115
+ }, percentage ? /*#__PURE__*/React__default.createElement("div", {
116
+ className: "".concat(blockClass, "__percentage")
117
+ }, truncatedValue, /*#__PURE__*/React__default.createElement("span", {
118
+ className: "".concat(blockClass, "__percentage-mark")
119
+ }, "%")) : truncatedValue), shouldDisplayDenominator && /*#__PURE__*/React__default.createElement("span", {
120
+ className: "".concat(blockClass, "__total")
121
+ }, /*#__PURE__*/React__default.createElement("span", null, Characters.Slash, truncatedTotal)), iconButton));
122
+ });
123
+
124
+ // Return a placeholder if not released and not enabled by feature flag
125
+ BigNumbers = pkg.checkComponentEnabled(BigNumbers, componentName);
126
+
127
+ // The display name of the component, used by React. Note that displayName
128
+ // is used in preference to relying on function.name.
129
+ BigNumbers.displayName = componentName;
130
+
131
+ // The types and DocGen commentary for the component props,
132
+ // in alphabetical order (for consistency).
133
+ // See https://www.npmjs.com/package/prop-types#usage.
134
+ BigNumbers.propTypes = {
135
+ /**
136
+ * Optional class name.
137
+ * @type number
138
+ */
139
+ className: PropTypes.string,
140
+ /**
141
+ * Display the `total` even when the `value` is equal to
142
+ * the `total` when `forceShowTotal` prop is true on the
143
+ * condition that the `total` is greater than 0.
144
+ * @type bool
145
+ */
146
+ forceShowTotal: PropTypes.bool,
147
+ /**
148
+ * Optional value to control the maximum fraction digits
149
+ * used when truncating the value and total.
150
+ * @type number
151
+ */
152
+ fractionDigits: PropTypes.number,
153
+ /** Displays an iconButton next to the BigNumbers value
154
+ * @type node
155
+ */
156
+ iconButton: PropTypes.node,
157
+ /**
158
+ * Text label for BigNumbers.
159
+ * @type string
160
+ */
161
+ label: PropTypes.string.isRequired,
162
+ /** Specify if the BigNumbers is in a loading state
163
+ * @type bool
164
+ */
165
+ loading: PropTypes.bool,
166
+ /**
167
+ * Locale value to determine approach to formatting numbers.
168
+ * @type string
169
+ */
170
+ locale: PropTypes.string,
171
+ /**
172
+ * Format number to percentage when `percentage` prop is true.
173
+ * @type bool
174
+ */
175
+ percentage: PropTypes.bool,
176
+ /** The size of the BigNumbers.
177
+ * @type string
178
+ */
179
+ size: PropTypes.oneOf(Object.values(BigNumbersSize)),
180
+ /** Label applied to a Tooltip - marked with the Information icon.
181
+ * @type string
182
+ */
183
+ tooltipDescription: PropTypes.string,
184
+ /**
185
+ * Total value that the main BigNumbers value is a subset of.
186
+ * @type number
187
+ */
188
+ total: PropTypes.number,
189
+ /** Display trending icon.
190
+ * @type boolean
191
+ */
192
+ trending: PropTypes.bool,
193
+ /** Specify whether or not the values should be truncated.
194
+ * @type boolean
195
+ */
196
+ truncate: PropTypes.bool,
197
+ /**
198
+ * The main BigNumbers value to display
199
+ * @type number
200
+ */
201
+ value: PropTypes.number
202
+ };
203
+
204
+ /**
205
+ * SkeletonBigNumbers is used to display a skeleton version while
206
+ * content is loading (handled by the BigNumbers prop `loading').
207
+ *
208
+ * Note: This component is only used within BigNumbers.
209
+ */
210
+ var SkeletonBigNumbers = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
211
+ var className = _ref2.className,
212
+ size = _ref2.size,
213
+ rest = _objectWithoutProperties(_ref2, _excluded2);
214
+ var BigNumbersSkeletonClasses = cx(className, _defineProperty(_defineProperty({}, "".concat(skeletonBlockClass, "--lg"), size === BigNumbersSize.Large), "".concat(skeletonBlockClass, "--xl"), size === BigNumbersSize.XLarge));
215
+ return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
216
+ className: cx(className, skeletonBlockClass, BigNumbersSkeletonClasses),
217
+ ref: ref
218
+ }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement(SkeletonText, {
219
+ className: "".concat(skeletonBlockClass, "__label")
220
+ }), /*#__PURE__*/React__default.createElement(SkeletonText, {
221
+ heading: true,
222
+ className: "".concat(skeletonBlockClass, "__value"),
223
+ width: "80%"
224
+ }));
225
+ });
226
+ SkeletonBigNumbers.propTypes = {
227
+ /**
228
+ * Optional class name.
229
+ * @type number
230
+ */
231
+ className: PropTypes.string,
232
+ /** The size of the BigNumbers.
233
+ * @type string
234
+ */
235
+ size: PropTypes.oneOf(Object.values(BigNumbersSize))
236
+ };
237
+
238
+ export { BigNumbers };
@@ -0,0 +1,13 @@
1
+ export namespace BigNumbersSize {
2
+ let Default: string;
3
+ let Large: string;
4
+ let XLarge: string;
5
+ }
6
+ export namespace Characters {
7
+ let Dash: string;
8
+ let Slash: string;
9
+ }
10
+ export const DefaultLocale: "en-US";
11
+ export function formatValue(locale: string, value: number, fractionDigits: number, truncate: boolean): string | null;
12
+ export function getIconSize(size: string): 16 | 20 | 24;
13
+ export function getSupportedLocale(locale: string): string;
@@ -0,0 +1,67 @@
1
+ /**
2
+ * Copyright IBM Corp. 2020, 2024
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ /* **************************** | CONSTANTS | ***************************** */
9
+
10
+ var BigNumbersSize = {
11
+ Default: 'default',
12
+ Large: 'lg',
13
+ XLarge: 'xl'
14
+ };
15
+ var Characters = {
16
+ Dash: '–',
17
+ Slash: '/'
18
+ };
19
+ var DefaultLocale = 'en-US';
20
+
21
+ /* ************************ | UTILITY FUNCTIONS | ************************* */
22
+
23
+ /**
24
+ * Ensure that the value is formatted correctly based on whether it should be truncated or not.
25
+ * @param {string} locale Locale value to be used in formatting numbers.
26
+ * @param {number} value The value to format.
27
+ * @param {number} fractionDigits How many significant figures should be displayed.
28
+ * @param {boolean} truncate Whether or not the value should be truncated.
29
+ * @returns {string | null} The formatted value.
30
+ */
31
+ var formatValue = function formatValue(locale, value, fractionDigits, truncate) {
32
+ if (value === null || value === undefined || typeof value !== 'number') {
33
+ return null;
34
+ }
35
+ return truncate ? Intl.NumberFormat(locale, {
36
+ notation: 'compact',
37
+ minimumFractionDigits: 0,
38
+ maximumFractionDigits: Math.round(fractionDigits)
39
+ }).format(value) : Intl.NumberFormat(locale).format(value);
40
+ };
41
+
42
+ /**
43
+ * Function which takes a size and returns a numeric value for sizing icons
44
+ * @param {string} size Size of desired icon. Expected values are 'default', 'lg', or 'xl'.
45
+ */
46
+ var getIconSize = function getIconSize(size) {
47
+ switch (size) {
48
+ case BigNumbersSize.Large:
49
+ return 20;
50
+ case BigNumbersSize.XLarge:
51
+ return 24;
52
+ default:
53
+ return 16;
54
+ }
55
+ };
56
+
57
+ /**
58
+ * Function which takes a locale and returns a supported locale or the default
59
+ * @param {string} locale Desired locale for number formatting.
60
+ *
61
+ * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#locales
62
+ */
63
+ var getSupportedLocale = function getSupportedLocale(locale) {
64
+ return Intl.NumberFormat.supportedLocalesOf(locale).length > 0 ? locale : DefaultLocale;
65
+ };
66
+
67
+ export { BigNumbersSize, Characters, DefaultLocale, formatValue, getIconSize, getSupportedLocale };
@@ -0,0 +1 @@
1
+ export { BigNumbers } from "./BigNumbers";
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty, createForOfIteratorHelper as _createForOfIteratorHelper } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState, useRef, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
13
13
  import { usePrefix, Breadcrumb, BreadcrumbItem, OverflowMenu, Link, Tooltip, OverflowMenuItem } from '@carbon/react';
14
14
  import { pkg } from '../../settings.js';
@@ -8,7 +8,7 @@
8
8
  import { slicedToArray as _slicedToArray, defineProperty as _defineProperty, createForOfIteratorHelper as _createForOfIteratorHelper, objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState, useRef, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
13
13
  import { usePrefix, ButtonSet, Button, MenuButton, MenuItem } from '@carbon/react';
14
14
  import { pkg } from '../../settings.js';
@@ -7,7 +7,7 @@
7
7
 
8
8
  import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { forwardRef } from 'react';
10
- import cx from '../../node_modules/classnames/index.js';
10
+ import cx from 'classnames';
11
11
  import { Layer, OverflowMenu, OverflowMenuItem, Button, IconButton } from '@carbon/react';
12
12
  import PropTypes from '../../node_modules/prop-types/index.js';
13
13
  import { CardHeader } from './CardHeader.js';
@@ -7,7 +7,7 @@
7
7
 
8
8
  import { defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
- import cx from '../../node_modules/classnames/index.js';
10
+ import cx from 'classnames';
11
11
  import { Button } from '@carbon/react';
12
12
  import PropTypes from '../../node_modules/prop-types/index.js';
13
13
  import { pkg } from '../../settings.js';
@@ -7,7 +7,7 @@
7
7
 
8
8
  import { defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
- import cx from '../../node_modules/classnames/index.js';
10
+ import cx from 'classnames';
11
11
  import PropTypes from '../../node_modules/prop-types/index.js';
12
12
  import { pkg } from '../../settings.js';
13
13
  import { usePrefix, Button } from '@carbon/react';
@@ -9,7 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, extends as _extend
9
9
  import React__default, { useRef, useCallback, useEffect, useImperativeHandle } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
11
  import { CarouselItem } from './CarouselItem.js';
12
- import cx from '../../node_modules/classnames/index.js';
12
+ import cx from 'classnames';
13
13
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
14
14
  import { pkg } from '../../settings.js';
15
15
 
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
13
  import { pkg } from '../../settings.js';
14
14
 
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { forwardRef } from 'react';
10
10
  import { Grid } from '@carbon/react';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import PropTypes from '../../node_modules/prop-types/index.js';
13
13
  import { pkg } from '../../settings.js';
14
14
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState, useRef, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
13
  import uuidv4 from '../../global/js/utils/uuidv4.js';
14
14
  import { pkg } from '../../settings.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
13
  import { pkg } from '../../settings.js';
14
14
  import clamp from 'lodash/clamp';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
13
  import { pkg } from '../../settings.js';
14
14
  import { CircleDash, CheckmarkOutline, Incomplete, Warning } from '@carbon/react/icons';
@@ -7,7 +7,7 @@
7
7
 
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { forwardRef, useState, useRef, useCallback, useEffect } from 'react';
10
- import cx from '../../node_modules/classnames/index.js';
10
+ import cx from 'classnames';
11
11
  import PropTypes, { p as propTypesExports } from '../../node_modules/prop-types/index.js';
12
12
  import { createPortal } from 'react-dom';
13
13
  import { CoachmarkOverlay } from './CoachmarkOverlay.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default, { useState, useEffect } from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { Draggable, Close } from '@carbon/react/icons';
13
13
  import { Button } from '@carbon/react';
14
14
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { Close } from '@carbon/react/icons';
13
13
  import { Button } from '@carbon/react';
14
14
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -9,7 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
9
9
  import React__default, { forwardRef, useState, useRef, useEffect } from 'react';
10
10
  import uuidv4 from '../../global/js/utils/uuidv4.js';
11
11
  import PropTypes from '../../node_modules/prop-types/index.js';
12
- import cx from '../../node_modules/classnames/index.js';
12
+ import cx from 'classnames';
13
13
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
14
14
  import { pkg } from '../../settings.js';
15
15
  import { CoachmarkDragbar } from './CoachmarkDragbar.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { Idea, Close } from '@carbon/react/icons';
13
13
  import { Button } from '@carbon/react';
14
14
  import { useCoachmark } from './utils/context.js';
@@ -8,7 +8,7 @@
8
8
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import React__default from 'react';
10
10
  import PropTypes from '../../node_modules/prop-types/index.js';
11
- import cx from '../../node_modules/classnames/index.js';
11
+ import cx from 'classnames';
12
12
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
13
13
  import { pkg } from '../../settings.js';
14
14
  import { useCoachmark } from '../Coachmark/utils/context.js';