@carbon/ibm-products 2.43.1 → 2.43.2-canary.100

Sign up to get free protection for your applications and to get access to all the features.
Files changed (365) hide show
  1. package/css/index-full-carbon.css +428 -143
  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 +218 -9
  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 +248 -105
  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 +349 -129
  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/components/ActionBar/ActionBarItem.js +1 -1
  18. package/es/components/Coachmark/Coachmark.d.ts +6 -1
  19. package/es/components/Coachmark/Coachmark.js +47 -11
  20. package/es/components/Coachmark/CoachmarkOverlay.js +2 -4
  21. package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -7
  22. package/es/components/CoachmarkFixed/CoachmarkFixed.js +13 -11
  23. package/es/components/CoachmarkStack/CoachmarkStack.js +7 -3
  24. package/es/components/CoachmarkStack/CoachmarkStackHome.js +8 -4
  25. package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +76 -55
  26. package/es/components/ConditionBuilder/ConditionBuilder.js +82 -25
  27. package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +15 -0
  28. package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +154 -0
  29. package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +3 -1
  30. package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +29 -13
  31. package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +8 -1
  32. package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +30 -8
  33. package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +14 -9
  34. package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +19 -11
  35. package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +9 -13
  36. package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +75 -62
  37. package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +13 -7
  38. package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +31 -8
  39. package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +8 -2
  40. package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +35 -24
  41. package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +40 -36
  42. package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +40 -36
  43. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +6 -2
  44. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +98 -40
  45. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +3 -1
  46. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +24 -9
  47. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +27 -9
  48. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +13 -0
  49. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +114 -0
  50. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.d.ts → ItemOptionForValueField.d.ts} +2 -2
  51. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.js → ItemOptionForValueField.js} +71 -38
  52. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +5 -1
  53. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +22 -9
  54. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +1 -1
  55. package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +1 -3
  56. package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +121 -40
  57. package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +3 -1
  58. package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +45 -19
  59. package/es/components/ConditionBuilder/utils/handleKeyboardEvents.d.ts +2 -1
  60. package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +137 -40
  61. package/es/components/ConditionBuilder/utils/useTranslations.d.ts +1 -0
  62. package/es/components/ConditionBuilder/utils/useTranslations.js +26 -0
  63. package/es/components/ConditionBuilder/utils/util.d.ts +6 -4
  64. package/es/components/ConditionBuilder/utils/util.js +42 -17
  65. package/es/components/CreateFullPage/CreateFullPage.js +2 -2
  66. package/es/components/DataSpreadsheet/DataSpreadsheet.d.ts +26 -0
  67. package/es/components/DataSpreadsheet/DataSpreadsheet.js +149 -54
  68. package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +25 -1
  69. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +50 -9
  70. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +16 -0
  71. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +32 -8
  72. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +4 -1
  73. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +3 -1
  74. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +15 -3
  75. package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.d.ts +2 -1
  76. package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +4 -3
  77. package/es/components/DataSpreadsheet/types/index.d.ts +3 -1
  78. package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +34 -2
  79. package/es/components/Datagrid/Datagrid/Datagrid.d.ts +0 -4
  80. package/es/components/Datagrid/Datagrid/Datagrid.js +4 -9
  81. package/es/components/Datagrid/Datagrid/DatagridContent.js +1 -1
  82. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +23 -8
  83. package/es/components/Datagrid/Datagrid/DatagridRow.js +21 -8
  84. package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +2 -1
  85. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +3 -2
  86. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +34 -10
  87. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -1
  88. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -1
  89. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.d.ts +3 -1
  90. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +7 -4
  91. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.d.ts +1 -1
  92. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +54 -17
  93. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +2 -3
  94. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +75 -12
  95. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +10 -2
  96. package/es/components/Datagrid/types/index.d.ts +61 -9
  97. package/es/components/Datagrid/useActionsColumn.d.ts +8 -1
  98. package/es/components/Datagrid/useActionsColumn.js +7 -6
  99. package/es/components/Datagrid/useColumnCenterAlign.d.ts +8 -1
  100. package/es/components/Datagrid/useColumnCenterAlign.js +1 -1
  101. package/es/components/Datagrid/useColumnRightAlign.d.ts +8 -1
  102. package/es/components/Datagrid/useColumnRightAlign.js +4 -3
  103. package/es/components/Datagrid/useCustomizeColumns.d.ts +8 -1
  104. package/es/components/Datagrid/useCustomizeColumns.js +4 -3
  105. package/es/components/Datagrid/useDefaultStringRenderer.js +0 -1
  106. package/es/components/Datagrid/useDisableSelectRows.d.ts +2 -1
  107. package/es/components/Datagrid/useDisableSelectRows.js +27 -22
  108. package/es/components/Datagrid/useInlineEdit.d.ts +8 -1
  109. package/es/components/Datagrid/useInlineEdit.js +13 -3
  110. package/es/components/Datagrid/useNestedRowExpander.js +1 -3
  111. package/es/components/Datagrid/useNestedRows.js +32 -13
  112. package/es/components/Datagrid/useRowExpander.js +1 -3
  113. package/es/components/Datagrid/useSelectRows.js +2 -1
  114. package/es/components/Datagrid/useStickyColumn.d.ts +8 -1
  115. package/es/components/Datagrid/useStickyColumn.js +12 -9
  116. package/es/components/Decorator/Decorator.js +2 -1
  117. package/es/components/DecoratorBase/DecoratorBase.js +3 -5
  118. package/es/components/DecoratorDualButton/DecoratorDualButton.js +2 -1
  119. package/es/components/DecoratorLink/DecoratorLink.js +2 -1
  120. package/es/components/DecoratorSingleButton/DecoratorSingleButton.js +2 -1
  121. package/es/components/EditInPlace/EditInPlace.d.ts +4 -0
  122. package/es/components/EditInPlace/EditInPlace.js +21 -10
  123. package/es/components/EditTearsheet/EditTearsheet.d.ts +7 -2
  124. package/es/components/EditTearsheet/EditTearsheet.js +44 -10
  125. package/es/components/EditTearsheet/EditTearsheetForm.d.ts +45 -2
  126. package/es/components/EditTearsheet/EditTearsheetForm.js +3 -0
  127. package/es/components/EmptyStates/EmptyStateV2.d.ts +63 -2
  128. package/es/components/EmptyStates/EmptyStateV2.js +2 -1
  129. package/es/components/FullPageError/FullPageError.d.ts +36 -2
  130. package/es/components/FullPageError/FullPageError.js +0 -3
  131. package/es/components/GetStartedCard/GetStartedCard.d.ts +61 -2
  132. package/es/components/GetStartedCard/GetStartedCard.js +9 -8
  133. package/es/components/HTTPErrors/HTTPError403/HTTPError403.js +6 -0
  134. package/es/components/HTTPErrors/HTTPError404/HTTPError404.js +6 -0
  135. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +6 -0
  136. package/es/components/HTTPErrors/assets/HTTPErrorSvg403.js +204 -200
  137. package/es/components/HTTPErrors/assets/HTTPErrorSvg404.js +116 -112
  138. package/es/components/HTTPErrors/assets/HTTPErrorSvgOther.js +110 -106
  139. package/es/components/Nav/NavItem.js +12 -3
  140. package/es/components/OptionsTile/OptionsTile.js +11 -6
  141. package/es/components/PageHeader/PageHeader.js +1 -0
  142. package/es/components/RemoveModal/RemoveModal.d.ts +4 -0
  143. package/es/components/RemoveModal/RemoveModal.js +7 -1
  144. package/es/components/SearchBar/SearchBar.d.ts +1 -1
  145. package/es/components/SearchBar/SearchBar.js +2 -2
  146. package/es/components/SidePanel/SidePanel.js +17 -21
  147. package/es/components/SidePanel/motion/variants.d.ts +4 -6
  148. package/es/components/SidePanel/motion/variants.js +10 -11
  149. package/es/components/StatusIndicator/StatusIndicatorStep.js +87 -0
  150. package/es/components/StringFormatter/StringFormatter.js +14 -3
  151. package/es/components/StringFormatter/utils/enums.d.ts +20 -1
  152. package/es/components/StringFormatter/utils/enums.js +22 -2
  153. package/es/components/TagOverflow/TagOverflow.d.ts +35 -4
  154. package/es/components/TagOverflow/TagOverflow.js +47 -64
  155. package/es/components/TagOverflow/TagOverflowModal.js +4 -6
  156. package/es/components/TagOverflow/TagOverflowPopover.d.ts +13 -1
  157. package/es/components/TagOverflow/TagOverflowPopover.js +38 -41
  158. package/es/components/Tearsheet/Tearsheet.d.ts +8 -1
  159. package/es/components/Tearsheet/Tearsheet.js +9 -1
  160. package/es/components/Tearsheet/TearsheetNarrow.d.ts +11 -0
  161. package/es/components/Tearsheet/TearsheetNarrow.js +12 -0
  162. package/es/components/Tearsheet/TearsheetShell.d.ts +11 -1
  163. package/es/components/Tearsheet/TearsheetShell.js +28 -7
  164. package/es/components/Toolbar/ToolbarButton.js +1 -1
  165. package/es/components/WebTerminal/WebTerminal.js +10 -12
  166. package/es/components/index.d.ts +1 -1
  167. package/es/global/js/hooks/useFocus.d.ts +1 -0
  168. package/es/global/js/hooks/useFocus.js +5 -2
  169. package/es/global/js/hooks/usePrefersReducedMotion.js +14 -8
  170. package/es/global/js/package-settings.d.ts +1 -1
  171. package/es/global/js/package-settings.js +1 -1
  172. package/es/index.js +1 -0
  173. package/es/node_modules/@carbon/icon-helpers/es/index.js +49 -62
  174. package/es/node_modules/@carbon/icons-react/es/generated/bucket-2.js +1020 -1058
  175. package/es/node_modules/@carbon/icons-react/es/generated/bucket-9.js +881 -758
  176. package/es/settings.d.ts +1 -1
  177. package/lib/components/ActionBar/ActionBarItem.js +1 -1
  178. package/lib/components/Coachmark/Coachmark.d.ts +6 -1
  179. package/lib/components/Coachmark/Coachmark.js +46 -10
  180. package/lib/components/Coachmark/CoachmarkOverlay.js +2 -4
  181. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -7
  182. package/lib/components/CoachmarkFixed/CoachmarkFixed.js +13 -11
  183. package/lib/components/CoachmarkStack/CoachmarkStack.js +7 -3
  184. package/lib/components/CoachmarkStack/CoachmarkStackHome.js +8 -4
  185. package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +74 -53
  186. package/lib/components/ConditionBuilder/ConditionBuilder.js +82 -25
  187. package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +15 -0
  188. package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +163 -0
  189. package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +3 -1
  190. package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +28 -11
  191. package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +8 -1
  192. package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +29 -7
  193. package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +12 -7
  194. package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +18 -10
  195. package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +9 -13
  196. package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +73 -60
  197. package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +13 -7
  198. package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +31 -8
  199. package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +8 -2
  200. package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +34 -24
  201. package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +40 -36
  202. package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +40 -36
  203. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +6 -2
  204. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +96 -38
  205. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +3 -1
  206. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +24 -9
  207. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +28 -10
  208. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +13 -0
  209. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +122 -0
  210. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.d.ts → ItemOptionForValueField.d.ts} +2 -2
  211. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.js → ItemOptionForValueField.js} +68 -35
  212. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +5 -1
  213. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +21 -8
  214. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +1 -1
  215. package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +1 -3
  216. package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +118 -37
  217. package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +3 -1
  218. package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +44 -17
  219. package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.d.ts +2 -1
  220. package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +137 -39
  221. package/lib/components/ConditionBuilder/utils/useTranslations.d.ts +1 -0
  222. package/lib/components/ConditionBuilder/utils/useTranslations.js +30 -0
  223. package/lib/components/ConditionBuilder/utils/util.d.ts +6 -4
  224. package/lib/components/ConditionBuilder/utils/util.js +44 -16
  225. package/lib/components/CreateFullPage/CreateFullPage.js +2 -2
  226. package/lib/components/DataSpreadsheet/DataSpreadsheet.d.ts +26 -0
  227. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +149 -54
  228. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +25 -1
  229. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +50 -9
  230. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +16 -0
  231. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +32 -8
  232. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +4 -1
  233. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +3 -1
  234. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +15 -3
  235. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.d.ts +2 -1
  236. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +4 -3
  237. package/lib/components/DataSpreadsheet/types/index.d.ts +3 -1
  238. package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +34 -2
  239. package/lib/components/Datagrid/Datagrid/Datagrid.d.ts +0 -4
  240. package/lib/components/Datagrid/Datagrid/Datagrid.js +4 -9
  241. package/lib/components/Datagrid/Datagrid/DatagridContent.js +1 -1
  242. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +23 -8
  243. package/lib/components/Datagrid/Datagrid/DatagridRow.js +21 -8
  244. package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +2 -1
  245. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +3 -2
  246. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +34 -10
  247. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -1
  248. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -1
  249. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.d.ts +3 -1
  250. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +7 -4
  251. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.d.ts +1 -1
  252. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +53 -16
  253. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +2 -3
  254. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +74 -11
  255. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +10 -2
  256. package/lib/components/Datagrid/types/index.d.ts +61 -9
  257. package/lib/components/Datagrid/useActionsColumn.d.ts +8 -1
  258. package/lib/components/Datagrid/useActionsColumn.js +7 -6
  259. package/lib/components/Datagrid/useColumnCenterAlign.d.ts +8 -1
  260. package/lib/components/Datagrid/useColumnCenterAlign.js +1 -1
  261. package/lib/components/Datagrid/useColumnRightAlign.d.ts +8 -1
  262. package/lib/components/Datagrid/useColumnRightAlign.js +4 -3
  263. package/lib/components/Datagrid/useCustomizeColumns.d.ts +8 -1
  264. package/lib/components/Datagrid/useCustomizeColumns.js +4 -3
  265. package/lib/components/Datagrid/useDefaultStringRenderer.js +0 -1
  266. package/lib/components/Datagrid/useDisableSelectRows.d.ts +2 -1
  267. package/lib/components/Datagrid/useDisableSelectRows.js +27 -22
  268. package/lib/components/Datagrid/useInlineEdit.d.ts +8 -1
  269. package/lib/components/Datagrid/useInlineEdit.js +13 -3
  270. package/lib/components/Datagrid/useNestedRowExpander.js +1 -3
  271. package/lib/components/Datagrid/useNestedRows.js +32 -13
  272. package/lib/components/Datagrid/useRowExpander.js +1 -3
  273. package/lib/components/Datagrid/useSelectRows.js +2 -1
  274. package/lib/components/Datagrid/useStickyColumn.d.ts +8 -1
  275. package/lib/components/Datagrid/useStickyColumn.js +12 -9
  276. package/lib/components/Decorator/Decorator.js +2 -1
  277. package/lib/components/DecoratorBase/DecoratorBase.js +3 -5
  278. package/lib/components/DecoratorDualButton/DecoratorDualButton.js +2 -1
  279. package/lib/components/DecoratorLink/DecoratorLink.js +2 -1
  280. package/lib/components/DecoratorSingleButton/DecoratorSingleButton.js +2 -1
  281. package/lib/components/EditInPlace/EditInPlace.d.ts +4 -0
  282. package/lib/components/EditInPlace/EditInPlace.js +21 -10
  283. package/lib/components/EditTearsheet/EditTearsheet.d.ts +7 -2
  284. package/lib/components/EditTearsheet/EditTearsheet.js +43 -9
  285. package/lib/components/EditTearsheet/EditTearsheetForm.d.ts +45 -2
  286. package/lib/components/EditTearsheet/EditTearsheetForm.js +3 -0
  287. package/lib/components/EmptyStates/EmptyStateV2.d.ts +63 -2
  288. package/lib/components/EmptyStates/EmptyStateV2.js +2 -1
  289. package/lib/components/FullPageError/FullPageError.d.ts +36 -2
  290. package/lib/components/FullPageError/FullPageError.js +0 -3
  291. package/lib/components/GetStartedCard/GetStartedCard.d.ts +61 -2
  292. package/lib/components/GetStartedCard/GetStartedCard.js +8 -7
  293. package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +6 -0
  294. package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +6 -0
  295. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +6 -0
  296. package/lib/components/HTTPErrors/assets/HTTPErrorSvg403.js +204 -200
  297. package/lib/components/HTTPErrors/assets/HTTPErrorSvg404.js +116 -112
  298. package/lib/components/HTTPErrors/assets/HTTPErrorSvgOther.js +110 -106
  299. package/lib/components/Nav/NavItem.js +10 -1
  300. package/lib/components/OptionsTile/OptionsTile.js +11 -6
  301. package/lib/components/PageHeader/PageHeader.js +1 -0
  302. package/lib/components/RemoveModal/RemoveModal.d.ts +4 -0
  303. package/lib/components/RemoveModal/RemoveModal.js +7 -1
  304. package/lib/components/SearchBar/SearchBar.d.ts +1 -1
  305. package/lib/components/SearchBar/SearchBar.js +2 -2
  306. package/lib/components/SidePanel/SidePanel.js +16 -20
  307. package/lib/components/SidePanel/motion/variants.d.ts +4 -6
  308. package/lib/components/SidePanel/motion/variants.js +10 -11
  309. package/lib/components/StatusIndicator/StatusIndicatorStep.js +94 -0
  310. package/lib/components/StringFormatter/StringFormatter.js +13 -2
  311. package/lib/components/StringFormatter/utils/enums.d.ts +20 -1
  312. package/lib/components/StringFormatter/utils/enums.js +23 -1
  313. package/lib/components/TagOverflow/TagOverflow.d.ts +35 -4
  314. package/lib/components/TagOverflow/TagOverflow.js +46 -63
  315. package/lib/components/TagOverflow/TagOverflowModal.js +4 -6
  316. package/lib/components/TagOverflow/TagOverflowPopover.d.ts +13 -1
  317. package/lib/components/TagOverflow/TagOverflowPopover.js +37 -40
  318. package/lib/components/Tearsheet/Tearsheet.d.ts +8 -1
  319. package/lib/components/Tearsheet/Tearsheet.js +9 -1
  320. package/lib/components/Tearsheet/TearsheetNarrow.d.ts +11 -0
  321. package/lib/components/Tearsheet/TearsheetNarrow.js +12 -0
  322. package/lib/components/Tearsheet/TearsheetShell.d.ts +11 -1
  323. package/lib/components/Tearsheet/TearsheetShell.js +26 -5
  324. package/lib/components/Toolbar/ToolbarButton.js +1 -1
  325. package/lib/components/WebTerminal/WebTerminal.js +10 -12
  326. package/lib/components/index.d.ts +1 -1
  327. package/lib/global/js/hooks/useFocus.d.ts +1 -0
  328. package/lib/global/js/hooks/useFocus.js +5 -1
  329. package/lib/global/js/hooks/usePrefersReducedMotion.js +13 -7
  330. package/lib/global/js/package-settings.d.ts +1 -1
  331. package/lib/global/js/package-settings.js +1 -1
  332. package/lib/index.js +5 -0
  333. package/lib/node_modules/@carbon/icon-helpers/es/index.js +49 -62
  334. package/lib/node_modules/@carbon/icons-react/es/generated/bucket-2.js +1036 -1074
  335. package/lib/node_modules/@carbon/icons-react/es/generated/bucket-9.js +946 -823
  336. package/lib/settings.d.ts +1 -1
  337. package/package.json +9 -8
  338. package/scss/components/Coachmark/_coachmark-overlay.scss +6 -70
  339. package/scss/components/Coachmark/_coachmark.scss +5 -4
  340. package/scss/components/CoachmarkBeacon/_coachmark-beacon.scss +1 -3
  341. package/scss/components/ConditionBuilder/_condition-builder.scss +5 -1
  342. package/scss/components/ConditionBuilder/styles/_conditionBuilderCondition.scss +20 -3
  343. package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +32 -3
  344. package/scss/components/CreateModal/_create-modal.scss +0 -4
  345. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +17 -2
  346. package/scss/components/Datagrid/_datagrid.scss +0 -4
  347. package/scss/components/Datagrid/styles/_useInlineEdit.scss +13 -0
  348. package/scss/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss +7 -5
  349. package/scss/components/Datagrid/styles/addons/_FilterFlyout.scss +5 -4
  350. package/scss/components/HTTPErrors/_http-errors.scss +77 -0
  351. package/scss/components/OptionsTile/_options-tile.scss +6 -6
  352. package/scss/components/SidePanel/_side-panel.scss +1 -1
  353. package/scss/components/StatusIcon/_status-icon.scss +4 -4
  354. package/scss/components/StringFormatter/_string-formatter.scss +2 -2
  355. package/scss/components/UserProfileImage/_user-profile-image.scss +6 -2
  356. package/scss/components/_index-released-only.scss +1 -0
  357. package/telemetry.yml +32 -19
  358. package/es/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +0 -1
  359. package/es/components/ConditionBuilder/utils/checkForHoldingKey.js +0 -16
  360. package/es/global/js/utils/window.d.ts +0 -2
  361. package/es/global/js/utils/window.js +0 -12
  362. package/lib/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +0 -1
  363. package/lib/components/ConditionBuilder/utils/checkForHoldingKey.js +0 -20
  364. package/lib/global/js/utils/window.d.ts +0 -2
  365. package/lib/global/js/utils/window.js +0 -16
@@ -10,14 +10,15 @@
10
10
  Object.defineProperty(exports, '__esModule', { value: true });
11
11
 
12
12
  var settings = require('../../../settings.js');
13
- var translationObject = require('./translationObject.js');
14
13
 
15
14
  var statementConfig = [{
16
15
  label: 'if',
17
- id: 'if'
16
+ id: 'if',
17
+ connector: 'and'
18
18
  }, {
19
19
  label: 'excl.if',
20
- id: 'excl.if'
20
+ id: 'excl_if',
21
+ connector: 'or'
21
22
  }];
22
23
  var connectorConfig = [{
23
24
  label: 'and',
@@ -26,7 +27,6 @@ var connectorConfig = [{
26
27
  label: 'or',
27
28
  id: 'or'
28
29
  }];
29
- //op types : option, text, number, date,
30
30
  var operatorConfig = [{
31
31
  label: 'is',
32
32
  id: 'is',
@@ -37,7 +37,7 @@ var operatorConfig = [{
37
37
  type: 'number'
38
38
  }, {
39
39
  label: 'is greater than or equal to',
40
- id: 'greater-equal',
40
+ id: 'greaterEqual',
41
41
  type: 'number'
42
42
  }, {
43
43
  label: 'is lower than',
@@ -45,23 +45,23 @@ var operatorConfig = [{
45
45
  type: 'number'
46
46
  }, {
47
47
  label: 'is lower than or equal to',
48
- id: 'lower-equal',
48
+ id: 'lowerEqual',
49
49
  type: 'number'
50
50
  }, {
51
51
  label: 'starts with',
52
- id: 'starts-with',
53
- type: 'text'
52
+ id: 'startsWith',
53
+ type: 'text,textarea'
54
54
  }, {
55
55
  label: 'ends with',
56
- id: 'ends-with',
57
- type: 'text'
56
+ id: 'endsWith',
57
+ type: 'text,textarea'
58
58
  }, {
59
59
  label: 'contains',
60
60
  id: 'contains',
61
- type: 'text'
61
+ type: 'text,textarea'
62
62
  }, {
63
63
  label: 'is one of',
64
- id: 'one-of',
64
+ id: 'oneOf',
65
65
  type: 'option'
66
66
  }, {
67
67
  label: 'is before',
@@ -84,32 +84,43 @@ var formatDate = function formatDate(date) {
84
84
  var year = date.getFullYear();
85
85
  return "".concat(day, "/").concat(month, "/").concat(year);
86
86
  };
87
- var translationsObjectCurrent = translationObject.translationsObject['en']; // TO DO: need to discuss if language is to be passed as prop
88
- var translateWithId = function translateWithId(key) {
89
- var _translationsObjectCu;
90
- return (_translationsObjectCu = translationsObjectCurrent[key]) !== null && _translationsObjectCu !== void 0 ? _translationsObjectCu : key;
91
- };
87
+ //const translationsObjectCurrent = translationsObject['en']; // TO DO: need to discuss if language is to be passed as prop
88
+
92
89
  var valueRenderers = {
93
90
  text: function text(val) {
94
91
  return val;
95
92
  },
93
+ textarea: function textarea(val) {
94
+ return val;
95
+ },
96
96
  time: function time(val) {
97
97
  return val;
98
98
  },
99
- number: function number(val, config) {
100
- return config.unit && val ? "".concat(val, " ").concat(config.unit) : val;
99
+ number: function number(val) {
100
+ return val;
101
101
  },
102
102
  option: function option(value) {
103
- return Array.isArray(value) ? value.join(', ') : value;
103
+ if (value && typeof value !== 'string') {
104
+ var selectedValues = Array.isArray(value) ? value : [value];
105
+ return selectedValues.map(function (option) {
106
+ return option.label;
107
+ }).join(', ');
108
+ }
109
+ return value;
104
110
  },
105
111
  date: function date(value) {
106
112
  if (Array.isArray(value) && value.length > 1) {
107
- var start = value !== null && value !== void 0 && value[0] ? formatDate(new Date(value[0])) : '';
108
- var end = value !== null && value !== void 0 && value[1] ? formatDate(new Date(value[1])) : '';
113
+ var start = value !== null && value !== void 0 && value[0] && !isNaN(new Date(value[0])) ? formatDate(new Date(value[0])) : '';
114
+ var end = value !== null && value !== void 0 && value[1] && !isNaN(new Date(value[1])) ? formatDate(new Date(value[1])) : '';
109
115
  return "".concat(start, " To ").concat(end);
116
+ } else if (Array.isArray(value) && !isNaN(new Date(value[0]))) {
117
+ return formatDate(new Date(value[0]));
110
118
  } else {
111
- return value && new Date(value) ? formatDate(new Date(value)) : value;
119
+ return value;
112
120
  }
121
+ },
122
+ custom: function custom(value) {
123
+ return value;
113
124
  }
114
125
  };
115
126
 
@@ -117,5 +128,4 @@ exports.blockClass = blockClass;
117
128
  exports.connectorConfig = connectorConfig;
118
129
  exports.operatorConfig = operatorConfig;
119
130
  exports.statementConfig = statementConfig;
120
- exports.translateWithId = translateWithId;
121
131
  exports.valueRenderers = valueRenderers;
@@ -1,38 +1,42 @@
1
1
  export namespace translationsObject {
2
- let en: {
3
- if: string;
4
- 'excl-if': string;
5
- and: string;
6
- or: string;
7
- is: string;
8
- greater: string;
9
- 'greater-equal': string;
10
- lower: string;
11
- 'lower-equal': string;
12
- 'starts-with': string;
13
- 'ends-with': string;
14
- contains: string;
15
- 'one-of': string;
16
- before: string;
17
- after: string;
18
- between: string;
19
- 'add-condition': string;
20
- 'add-condition-group': string;
21
- 'add-condition-sub-group': string;
22
- condition: string;
23
- property: string;
24
- operator: string;
25
- value: string;
26
- connector: string;
27
- condition_row: string;
28
- remove_condition: string;
29
- add_condition_row: string;
30
- start: string;
31
- end: string;
32
- clear_search: string;
33
- actions: string;
34
- then: string;
35
- remove_action: string;
36
- add_action: string;
37
- };
2
+ let ifText: string;
3
+ let excl_if: string;
4
+ let and: string;
5
+ let or: string;
6
+ let is: string;
7
+ let greater: string;
8
+ let greaterEqual: string;
9
+ let lower: string;
10
+ let lowerEqual: string;
11
+ let startsWith: string;
12
+ let endsWith: string;
13
+ let contains: string;
14
+ let oneOf: string;
15
+ let before: string;
16
+ let after: string;
17
+ let between: string;
18
+ let addConditionText: string;
19
+ let addConditionGroupText: string;
20
+ let addSubgroupText: string;
21
+ let conditionText: string;
22
+ let propertyText: string;
23
+ let operatorText: string;
24
+ let valueText: string;
25
+ let connectorText: string;
26
+ let conditionRowText: string;
27
+ let conditionRowGroupText: string;
28
+ let removeConditionText: string;
29
+ let addConditionRowText: string;
30
+ let startText: string;
31
+ let endText: string;
32
+ let clearSearchText: string;
33
+ let actionsText: string;
34
+ let then: string;
35
+ let removeActionText: string;
36
+ let addActionText: string;
37
+ let invalidText: string;
38
+ let invalidNumberWarnText: string;
39
+ let conditionBuilderText: string;
40
+ let actionSectionText: string;
41
+ let conditionHeadingText: string;
38
42
  }
@@ -10,42 +10,46 @@
10
10
  Object.defineProperty(exports, '__esModule', { value: true });
11
11
 
12
12
  var translationsObject = {
13
- en: {
14
- if: 'if',
15
- 'excl-if': 'excl.if',
16
- and: 'and',
17
- or: 'or',
18
- is: 'is',
19
- greater: 'is greater than',
20
- 'greater-equal': 'is greater than or equal to',
21
- lower: 'is lower than',
22
- 'lower-equal': 'is lower than or equal to',
23
- 'starts-with': 'starts with',
24
- 'ends-with': 'ends with',
25
- contains: 'contains',
26
- 'one-of': 'is one of',
27
- before: 'is before',
28
- after: 'is after',
29
- between: 'is between',
30
- 'add-condition': 'Add Condition',
31
- 'add-condition-group': 'Add Condition Group',
32
- 'add-condition-sub-group': 'Add Condition sub group',
33
- condition: 'Condition',
34
- property: 'Property',
35
- operator: 'Operator',
36
- value: 'Value',
37
- connector: 'Connector',
38
- condition_row: 'Condition row',
39
- remove_condition: 'Remove condition',
40
- add_condition_row: 'Add condition row',
41
- start: 'Start',
42
- end: 'End',
43
- clear_search: 'Clear search input',
44
- actions: 'Actions',
45
- then: 'then',
46
- remove_action: 'Remove Action',
47
- add_action: 'Add action'
48
- }
13
+ ifText: 'if',
14
+ excl_if: 'excl.if',
15
+ and: 'and',
16
+ or: 'or',
17
+ is: 'is',
18
+ greater: 'is greater than',
19
+ greaterEqual: 'is greater than or equal to',
20
+ lower: 'is lower than',
21
+ lowerEqual: 'is lower than or equal to',
22
+ startsWith: 'starts with',
23
+ endsWith: 'ends with',
24
+ contains: 'contains',
25
+ oneOf: 'is one of',
26
+ before: 'is before',
27
+ after: 'is after',
28
+ between: 'is between',
29
+ addConditionText: 'Add condition',
30
+ addConditionGroupText: 'Add condition group',
31
+ addSubgroupText: 'Add subgroup',
32
+ conditionText: 'Condition',
33
+ propertyText: 'Property',
34
+ operatorText: 'Operator',
35
+ valueText: 'Value',
36
+ connectorText: 'Connector',
37
+ conditionRowText: 'Condition row',
38
+ conditionRowGroupText: 'Condition row group',
39
+ removeConditionText: 'Remove condition',
40
+ addConditionRowText: 'Add condition row',
41
+ startText: 'Start',
42
+ endText: 'End',
43
+ clearSearchText: 'Clear search input',
44
+ actionsText: 'Actions',
45
+ then: 'then',
46
+ removeActionText: 'Remove Action',
47
+ addActionText: 'Add action',
48
+ invalidText: 'Incomplete',
49
+ invalidNumberWarnText: 'Invalid number, must be 0 or greater',
50
+ conditionBuilderText: 'Condition Builder',
51
+ actionSectionText: 'Action Section',
52
+ conditionHeadingText: 'Condition'
49
53
  };
50
54
 
51
55
  exports.translationsObject = translationsObject;
@@ -1,4 +1,4 @@
1
- export function ConditionBuilderItem({ children, className, label, renderIcon, title, type, showToolTip, condition, popOverClassName, config, ...rest }: {
1
+ export function ConditionBuilderItem({ children, className, label, renderIcon, title, type, showToolTip, condition, popOverClassName, config, renderChildren, onChange, ...rest }: {
2
2
  [x: string]: any;
3
3
  children: any;
4
4
  className: any;
@@ -10,6 +10,8 @@ export function ConditionBuilderItem({ children, className, label, renderIcon, t
10
10
  condition: any;
11
11
  popOverClassName: any;
12
12
  config: any;
13
+ renderChildren: any;
14
+ onChange: any;
13
15
  }): import("react/jsx-runtime").JSX.Element;
14
16
  export namespace ConditionBuilderItem {
15
17
  namespace propTypes {
@@ -17,8 +19,10 @@ export namespace ConditionBuilderItem {
17
19
  let className: PropTypes.Requireable<string>;
18
20
  let condition: PropTypes.Requireable<object>;
19
21
  let config: PropTypes.Requireable<object>;
20
- let label: PropTypes.Requireable<NonNullable<string | any[] | null | undefined>>;
22
+ let label: PropTypes.Requireable<NonNullable<string | object | null | undefined>>;
23
+ let onChange: PropTypes.Requireable<(...args: any[]) => any>;
21
24
  let popOverClassName: PropTypes.Requireable<string>;
25
+ let renderChildren: PropTypes.Requireable<(...args: any[]) => any>;
22
26
  let renderIcon: PropTypes.Requireable<object>;
23
27
  let showToolTip: PropTypes.Requireable<boolean>;
24
28
  let title: PropTypes.Requireable<string>;
@@ -16,12 +16,15 @@ var index = require('../../../node_modules/prop-types/index.js');
16
16
  var icons = require('@carbon/react/icons');
17
17
  var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
18
18
  var ConditionBuilderButton = require('../ConditionBuilderButton/ConditionBuilderButton.js');
19
+ var useTranslations = require('../utils/useTranslations.js');
20
+ var ConditionBuilderProvider = require('../ConditionBuilderContext/ConditionBuilderProvider.js');
21
+ var handleKeyboardEvents = require('../utils/handleKeyboardEvents.js');
19
22
 
20
23
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
21
24
 
22
25
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
23
26
 
24
- var _excluded = ["children", "className", "label", "renderIcon", "title", "type", "showToolTip", "condition", "popOverClassName", "config"];
27
+ var _excluded = ["children", "className", "label", "renderIcon", "title", "type", "showToolTip", "condition", "popOverClassName", "config", "renderChildren", "onChange"];
25
28
  var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
26
29
  var children = _ref.children,
27
30
  className = _ref.className,
@@ -33,21 +36,40 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
33
36
  condition = _ref.condition,
34
37
  popOverClassName = _ref.popOverClassName,
35
38
  config = _ref.config,
39
+ renderChildren = _ref.renderChildren,
40
+ onChange = _ref.onChange,
36
41
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
37
- var contentRef = React.useRef(null);
38
- var _useState = React.useState(label),
42
+ var popoverRef = React.useRef(null);
43
+ var _useState = React.useState(false),
39
44
  _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
40
- propertyLabel = _useState2[0],
41
- setPropertyLabel = _useState2[1];
42
- var _useState3 = React.useState(false),
43
- _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
44
- open = _useState4[0],
45
- setOpen = _useState4[1];
46
- React.useEffect(function () {
47
- var propertyId = rest['data-name'] == 'valueField' && type ? DataConfigs.valueRenderers[type](label, config) : label;
48
- setPropertyLabel(DataConfigs.translateWithId(propertyId));
49
- // eslint-disable-next-line react-hooks/exhaustive-deps
50
- }, [label]);
45
+ open = _useState2[0],
46
+ setOpen = _useState2[1];
47
+ var _useTranslations = useTranslations.useTranslations(['invalidText', 'addConditionText', label]),
48
+ _useTranslations2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslations, 3),
49
+ invalidText = _useTranslations2[0],
50
+ addConditionText = _useTranslations2[1],
51
+ labelText = _useTranslations2[2];
52
+ var _useContext = React.useContext(ConditionBuilderProvider.ConditionBuilderContext),
53
+ conditionBuilderRef = _useContext.conditionBuilderRef;
54
+ var getPropertyDetails = function getPropertyDetails() {
55
+ var _ref2 = condition || {},
56
+ property = _ref2.property,
57
+ operator = _ref2.operator;
58
+ if (label === 'INVALID' || rest['data-name'] === 'propertyField' && property === 'INVALID' || rest['data-name'] === 'operatorField' && operator === 'INVALID') {
59
+ return {
60
+ propertyLabel: invalidText,
61
+ isInvalid: true
62
+ };
63
+ }
64
+ var propertyId = rest['data-name'] == 'valueField' && type ? DataConfigs.valueRenderers[type](label, config) : labelText;
65
+ return {
66
+ isInvalid: false,
67
+ propertyLabel: propertyId
68
+ };
69
+ };
70
+ var _getPropertyDetails = getPropertyDetails(),
71
+ propertyLabel = _getPropertyDetails.propertyLabel,
72
+ isInvalid = _getPropertyDetails.isInvalid;
51
73
  React.useEffect(function () {
52
74
  /**
53
75
  * rest['data-name'] holds the current field name
@@ -58,59 +80,87 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
58
80
  //if any condition is changed, state prop is triggered
59
81
  if (condition.popoverToOpen && currentField !== condition.popoverToOpen) {
60
82
  // close the previous popover
61
- setOpen(false);
62
- } else if (currentField == 'valueField' && type == 'option' && condition.operator !== 'one-of') {
83
+ closePopover();
84
+ } else if (currentField == 'valueField' && type == 'option' && condition.operator !== 'oneOf') {
63
85
  //close the current popover if the field is valueField and is a single select dropdown. For all other inputs ,popover need to be open on value changes.
64
- setOpen(false);
86
+ closePopover();
65
87
  }
66
88
  if (condition.popoverToOpen == currentField) {
67
89
  //current popover need to be opened
68
- setOpen(true);
90
+ openPopOver();
69
91
  }
70
92
  } else {
71
93
  // when we change any statement(if/ excl.if) which is not part of condition state, label change is triggered.
72
94
  //close popOver when statement is changed.
73
- setOpen(false);
95
+ closePopover();
74
96
  }
75
97
  // eslint-disable-next-line react-hooks/exhaustive-deps
76
98
  }, [condition, label]);
77
99
  React.useEffect(function () {
78
100
  //this will focus the first input field in the popover
79
- if (open && contentRef.current) {
80
- var firstFocusableElement = contentRef.current.querySelector('input');
101
+ if (open && popoverRef.current) {
102
+ var firstFocusableElement = popoverRef.current.querySelector('input,textarea');
81
103
  if (firstFocusableElement) {
82
- firstFocusableElement.focus();
104
+ setTimeout(function () {
105
+ return firstFocusableElement.focus();
106
+ }, 0);
83
107
  }
84
108
  }
85
- }, [contentRef, open]);
109
+ }, [popoverRef, open]);
110
+ var manageInvalidSelection = function manageInvalidSelection() {
111
+ //when the user didn't select any value , we need to show as incomplete
112
+ if (rest['data-name'] === 'propertyField' && !(condition !== null && condition !== void 0 && condition.property) || rest['data-name'] === 'operatorField' && !(condition !== null && condition !== void 0 && condition.operator) || rest['data-name'] === 'valueField' && !(condition !== null && condition !== void 0 && condition.value)) {
113
+ onChange === null || onChange === void 0 || onChange('INVALID');
114
+ }
115
+ };
116
+ var closePopover = function closePopover() {
117
+ if (open) {
118
+ manageInvalidSelection();
119
+ }
120
+ setOpen(false);
121
+ };
122
+ var openPopOver = function openPopOver() {
123
+ return setOpen(true);
124
+ };
125
+ var togglePopover = function togglePopover() {
126
+ if (children || renderChildren) {
127
+ setOpen(!open);
128
+ }
129
+ };
130
+ var handleKeyDownHandler = function handleKeyDownHandler(evt) {
131
+ handleKeyboardEvents.handleKeyDownForPopover(evt, conditionBuilderRef, popoverRef);
132
+ if (evt.key === 'Escape') {
133
+ manageInvalidSelection();
134
+ }
135
+ };
86
136
  return /*#__PURE__*/React__default["default"].createElement(react.Popover, {
87
137
  open: open,
88
138
  isTabTip: true,
89
139
  role: "gridcell",
90
- className: popOverClassName,
91
- onRequestClose: function onRequestClose() {
92
- setOpen(false);
93
- }
140
+ className: "".concat(popOverClassName, " ").concat(DataConfigs.blockClass, "__popover"),
141
+ ref: popoverRef,
142
+ onRequestClose: closePopover
94
143
  }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderButton.ConditionBuilderButton, _rollupPluginBabelHelpers["extends"]({
95
- label: propertyLabel !== null && propertyLabel !== void 0 ? propertyLabel : DataConfigs.translateWithId('add-condition'),
144
+ label: propertyLabel !== null && propertyLabel !== void 0 ? propertyLabel : addConditionText,
96
145
  hideLabel: !label ? true : false,
97
- onClick: function onClick() {
98
- children ? setOpen(!open) : null;
99
- },
146
+ onClick: togglePopover,
100
147
  className: className,
101
148
  "aria-haspopup": true,
102
149
  "aria-expanded": open,
103
150
  renderIcon: renderIcon ? renderIcon : label == undefined ? icons.Add : null,
104
- showToolTip: showToolTip
105
- }, rest)), /*#__PURE__*/React__default["default"].createElement(react.PopoverContent, {
106
- className: "".concat(DataConfigs.blockClass, "__item__content"),
151
+ showToolTip: showToolTip,
152
+ isInvalid: isInvalid,
153
+ condition: condition
154
+ }, rest)), open && /*#__PURE__*/React__default["default"].createElement(react.PopoverContent, {
155
+ className: "".concat(DataConfigs.blockClass, "__popover-content-wrapper"),
107
156
  role: "dialog",
108
- "aria-label": "".concat(title)
157
+ "aria-label": title,
158
+ onKeyDown: handleKeyDownHandler
109
159
  }, /*#__PURE__*/React__default["default"].createElement(react.Layer, null, /*#__PURE__*/React__default["default"].createElement("h1", {
110
160
  className: "".concat(DataConfigs.blockClass, "__item__title")
111
161
  }, title), /*#__PURE__*/React__default["default"].createElement("div", {
112
- ref: contentRef
113
- }, open && children))));
162
+ className: "".concat(DataConfigs.blockClass, "__popover-content")
163
+ }, renderChildren ? renderChildren(popoverRef) : children))));
114
164
  };
115
165
  ConditionBuilderItem.propTypes = {
116
166
  /**
@@ -133,11 +183,19 @@ ConditionBuilderItem.propTypes = {
133
183
  /**
134
184
  * text to be displayed in the field
135
185
  */
136
- label: index["default"].oneOfType([index["default"].string, index["default"].array]),
186
+ label: index["default"].oneOfType([index["default"].string, index["default"].array, index["default"].object]),
187
+ /**
188
+ * callback to update the current condition of the state tree
189
+ */
190
+ onChange: index["default"].func,
137
191
  /**
138
192
  * class name for popover
139
193
  */
140
194
  popOverClassName: index["default"].string,
195
+ /**
196
+ * callback prop that returns the jsx for children
197
+ */
198
+ renderChildren: index["default"].func,
141
199
  /**
142
200
  * Optional prop to allow overriding the icon rendering.
143
201
  */
@@ -1,11 +1,13 @@
1
- export function ConditionBuilderItemDate({ conditionState, onChange }: {
1
+ export function ConditionBuilderItemDate({ conditionState, onChange, parentRef, }: {
2
2
  conditionState: any;
3
3
  onChange: any;
4
+ parentRef: any;
4
5
  }): import("react/jsx-runtime").JSX.Element;
5
6
  export namespace ConditionBuilderItemDate {
6
7
  namespace propTypes {
7
8
  let conditionState: PropTypes.Requireable<object>;
8
9
  let onChange: PropTypes.Requireable<(...args: any[]) => any>;
10
+ let parentRef: PropTypes.Requireable<object>;
9
11
  }
10
12
  }
11
13
  import PropTypes from 'prop-types';
@@ -9,11 +9,12 @@
9
9
 
10
10
  Object.defineProperty(exports, '__esModule', { value: true });
11
11
 
12
+ var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
12
13
  var React = require('react');
13
14
  var react = require('@carbon/react');
14
15
  var settings = require('../../../../settings.js');
15
16
  var index = require('../../../../node_modules/prop-types/index.js');
16
- var DataConfigs = require('../../ConditionBuilderContext/DataConfigs.js');
17
+ var useTranslations = require('../../utils/useTranslations.js');
17
18
 
18
19
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
19
20
 
@@ -22,17 +23,26 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
23
  var blockClass = "".concat(settings.pkg.prefix, "--condition-builder");
23
24
  var ConditionBuilderItemDate = function ConditionBuilderItemDate(_ref) {
24
25
  var conditionState = _ref.conditionState,
25
- onChange = _ref.onChange;
26
+ onChange = _ref.onChange,
27
+ parentRef = _ref.parentRef;
26
28
  var DatePickerInputRef = React.useRef();
29
+ var _useTranslations = useTranslations.useTranslations(['startText', 'endText']),
30
+ _useTranslations2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslations, 2),
31
+ startText = _useTranslations2[0],
32
+ endText = _useTranslations2[1];
27
33
  var datePickerType = conditionState.operator == 'between' ? 'range' : 'single';
34
+ var onCloseHandler = function onCloseHandler(selectedDate) {
35
+ onChange(selectedDate && selectedDate.length > 0 ? selectedDate : 'INVALID');
36
+ };
28
37
  return /*#__PURE__*/React__default["default"].createElement("div", {
29
38
  className: "".concat(blockClass, "__item-date ")
30
39
  }, datePickerType == 'single' && /*#__PURE__*/React__default["default"].createElement(react.DatePicker, {
31
40
  ref: DatePickerInputRef,
32
41
  dateFormat: "d/m/Y",
33
42
  datePickerType: "single",
34
- onClose: onChange,
35
- value: conditionState.value
43
+ value: conditionState.value,
44
+ onClose: onCloseHandler,
45
+ appendTo: parentRef === null || parentRef === void 0 ? void 0 : parentRef.current
36
46
  }, /*#__PURE__*/React__default["default"].createElement(react.DatePickerInput, {
37
47
  id: "datePicker",
38
48
  placeholder: "dd/mm/yyyy",
@@ -41,16 +51,17 @@ var ConditionBuilderItemDate = function ConditionBuilderItemDate(_ref) {
41
51
  ref: DatePickerInputRef,
42
52
  dateFormat: "d/m/Y",
43
53
  datePickerType: datePickerType,
44
- onClose: onChange,
45
- value: conditionState.value
54
+ onClose: onCloseHandler,
55
+ value: conditionState.value,
56
+ appendTo: parentRef === null || parentRef === void 0 ? void 0 : parentRef.current
46
57
  }, /*#__PURE__*/React__default["default"].createElement(react.DatePickerInput, {
47
58
  id: "datePickerStart",
48
59
  placeholder: "dd/mm/yyyy",
49
- labelText: DataConfigs.translateWithId('start')
60
+ labelText: startText
50
61
  }), /*#__PURE__*/React__default["default"].createElement(react.DatePickerInput, {
51
62
  id: "datePickerEnd",
52
63
  placeholder: "dd/mm/yyyy",
53
- labelText: DataConfigs.translateWithId('end')
64
+ labelText: endText
54
65
  })));
55
66
  };
56
67
  ConditionBuilderItemDate.propTypes = {
@@ -61,7 +72,11 @@ ConditionBuilderItemDate.propTypes = {
61
72
  /**
62
73
  * callback to update state oin date change
63
74
  */
64
- onChange: index["default"].func
75
+ onChange: index["default"].func,
76
+ /**
77
+ * reference to the popover node
78
+ */
79
+ parentRef: index["default"].object
65
80
  };
66
81
 
67
82
  exports.ConditionBuilderItemDate = ConditionBuilderItemDate;