@carbon/ibm-products 1.34.1 → 1.35.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/index-full-carbon.css +46 -13
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +2 -8
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +2 -9
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -7
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +46 -13
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +2 -8
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +46 -13
- package/css/index.css.map +1 -1
- package/css/index.min.css +2 -8
- package/css/index.min.css.map +1 -1
- package/es/components/APIKeyModal/APIKeyDownloader.js +8 -18
- package/es/components/APIKeyModal/APIKeyModal.js +58 -140
- package/es/components/APIKeyModal/index.js +1 -0
- package/es/components/AboutModal/AboutModal.js +40 -45
- package/es/components/AboutModal/index.js +1 -0
- package/es/components/ActionBar/ActionBar.js +69 -82
- package/es/components/ActionBar/ActionBarItem.js +19 -20
- package/es/components/ActionBar/ActionBarOverflowItems.js +10 -10
- package/es/components/ActionBar/index.js +1 -0
- package/es/components/ActionSet/ActionSet.js +30 -39
- package/es/components/ActionSet/actions.js +1 -2
- package/es/components/ActionSet/index.js +1 -0
- package/es/components/AddSelect/AddSelect.js +3 -4
- package/es/components/AddSelect/AddSelectBody.js +67 -87
- package/es/components/AddSelect/AddSelectBreadcrumbs.js +3 -4
- package/es/components/AddSelect/AddSelectColumn.js +27 -45
- package/es/components/AddSelect/AddSelectFilter.js +21 -34
- package/es/components/AddSelect/AddSelectList.js +19 -33
- package/es/components/AddSelect/AddSelectMetaPanel.js +3 -5
- package/es/components/AddSelect/AddSelectSidebar.js +14 -21
- package/es/components/AddSelect/AddSelectSort.js +6 -5
- package/es/components/AddSelect/add-select-utils.js +2 -23
- package/es/components/AddSelect/hooks/useItemSort.js +6 -8
- package/es/components/AddSelect/hooks/useParentSelect.js +3 -6
- package/es/components/AddSelect/hooks/usePath.js +6 -20
- package/es/components/AddSelect/index.js +1 -0
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +62 -88
- package/es/components/BreadcrumbWithOverflow/index.js +2 -0
- package/es/components/ButtonMenu/ButtonMenu.js +32 -30
- package/es/components/ButtonMenu/ButtonMenuItem.js +10 -6
- package/es/components/ButtonMenu/index.js +1 -0
- package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +34 -52
- package/es/components/ButtonSetWithOverflow/index.js +1 -0
- package/es/components/Card/Card.js +53 -71
- package/es/components/Card/CardFooter.js +19 -18
- package/es/components/Card/CardHeader.js +13 -13
- package/es/components/Card/index.js +1 -0
- package/es/components/Cascade/Cascade.js +5 -14
- package/es/components/ComboButton/ComboButton.js +24 -35
- package/es/components/ComboButton/ComboButtonItem/index.js +4 -8
- package/es/components/ComboButton/index.js +1 -0
- package/es/components/CreateFullPage/CreateFullPage.js +64 -85
- package/es/components/CreateFullPage/CreateFullPageStep.js +28 -40
- package/es/components/CreateFullPage/index.js +1 -0
- package/es/components/CreateInfluencer/CreateInfluencer.js +14 -15
- package/es/components/CreateInfluencer/index.js +1 -0
- package/es/components/CreateModal/CreateModal.js +19 -31
- package/es/components/CreateModal/index.js +2 -0
- package/es/components/CreateSidePanel/CreateSidePanel.js +24 -37
- package/es/components/CreateSidePanel/index.js +1 -0
- package/es/components/CreateTearsheet/CreateTearsheet.js +65 -88
- package/es/components/CreateTearsheet/CreateTearsheetDivider.js +4 -4
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +31 -42
- package/es/components/CreateTearsheet/index.js +1 -0
- package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +46 -66
- package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +41 -57
- package/es/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +30 -39
- package/es/components/CreateTearsheetNarrow/index.js +1 -0
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +136 -225
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +62 -113
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +25 -56
- package/es/components/DataSpreadsheet/hooks/index.js +1 -0
- package/es/components/DataSpreadsheet/hooks/useMoveActiveCell.js +6 -5
- package/es/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +23 -44
- package/es/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +5 -5
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +18 -30
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +10 -14
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +34 -54
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +10 -10
- package/es/components/DataSpreadsheet/index.js +1 -0
- package/es/components/DataSpreadsheet/utils/checkActiveHeaderCell.js +4 -8
- package/es/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +3 -4
- package/es/components/DataSpreadsheet/utils/createActiveCellFn.js +15 -19
- package/es/components/DataSpreadsheet/utils/createCellSelectionArea.js +15 -17
- package/es/components/DataSpreadsheet/utils/generateData.js +4 -13
- package/es/components/DataSpreadsheet/utils/getCellSize.js +1 -6
- package/es/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +1 -0
- package/es/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +7 -9
- package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +20 -34
- package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +20 -30
- package/es/components/DataSpreadsheet/utils/handleCellDeletion.js +5 -4
- package/es/components/DataSpreadsheet/utils/handleEditSubmit.js +13 -20
- package/es/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +22 -44
- package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +40 -75
- package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +6 -8
- package/es/components/DataSpreadsheet/utils/removeCellSelections.js +6 -8
- package/es/components/DataSpreadsheet/utils/selectAllCells.js +7 -11
- package/es/components/Datagrid/Datagrid/Datagrid.js +12 -12
- package/es/components/Datagrid/Datagrid/DatagridBody.js +4 -10
- package/es/components/Datagrid/Datagrid/DatagridContent.js +30 -40
- package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js +7 -10
- package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -6
- package/es/components/Datagrid/Datagrid/DatagridHead.js +6 -6
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +2 -9
- package/es/components/Datagrid/Datagrid/DatagridRefBody.js +5 -8
- package/es/components/Datagrid/Datagrid/DatagridRow.js +4 -12
- package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +10 -18
- package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +24 -34
- package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +2 -7
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +26 -38
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +15 -21
- package/es/components/Datagrid/Datagrid/DraggableElement.js +74 -85
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +3 -5
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +6 -10
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +14 -26
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +54 -71
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +6 -13
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +1 -1
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +1 -0
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +11 -12
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +56 -106
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +7 -21
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +1 -1
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +9 -14
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +2 -3
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +29 -63
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +14 -21
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +6 -11
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +21 -34
- package/es/components/Datagrid/Datagrid/addons/RowSize/index.js +1 -0
- package/es/components/Datagrid/Datagrid/index.js +1 -0
- package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +10 -0
- package/es/components/Datagrid/Datagrid.stories/common.js +2 -11
- package/es/components/Datagrid/common-column-ids.js +1 -0
- package/es/components/Datagrid/useActionsColumn.js +15 -31
- package/es/components/Datagrid/useColumnCenterAlign.js +0 -8
- package/es/components/Datagrid/useColumnOrder.js +1 -0
- package/es/components/Datagrid/useColumnRightAlign.js +0 -8
- package/es/components/Datagrid/useCustomizeColumns.js +5 -13
- package/es/components/Datagrid/useDatagrid.js +0 -7
- package/es/components/Datagrid/useDefaultStringRenderer.js +0 -9
- package/es/components/Datagrid/useDisableSelectRows.js +2 -10
- package/es/components/Datagrid/useExpandedRow.js +5 -15
- package/es/components/Datagrid/useFlexResize.js +0 -7
- package/es/components/Datagrid/useFloatingScroll.js +9 -22
- package/es/components/Datagrid/useInfiniteScroll.js +10 -16
- package/es/components/Datagrid/useInlineEdit.js +1 -9
- package/es/components/Datagrid/useNestedRowExpander.js +0 -6
- package/es/components/Datagrid/useNestedRows.js +1 -7
- package/es/components/Datagrid/useOnRowClick.js +4 -9
- package/es/components/Datagrid/useParentDimensions.js +6 -16
- package/es/components/Datagrid/useResizeTable.js +1 -7
- package/es/components/Datagrid/useRowExpander.js +0 -5
- package/es/components/Datagrid/useRowIsMouseOver.js +6 -15
- package/es/components/Datagrid/useRowRenderer.js +0 -5
- package/es/components/Datagrid/useRowSize.js +8 -20
- package/es/components/Datagrid/useSelectAllToggle.js +11 -22
- package/es/components/Datagrid/useSelectRows.js +11 -27
- package/es/components/Datagrid/useSkeletonRows.js +1 -6
- package/es/components/Datagrid/useSortableColumns.js +2 -23
- package/es/components/Datagrid/useStickyColumn.js +2 -31
- package/es/components/Datagrid/utils/DatagridActions.js +7 -11
- package/es/components/Datagrid/utils/DatagridPagination.js +5 -6
- package/es/components/Datagrid/utils/Wrapper.js +1 -1
- package/es/components/Datagrid/utils/getArgTypes.js +1 -0
- package/es/components/Datagrid/utils/getInlineEditColumns.js +1 -2
- package/es/components/Datagrid/utils/makeData.js +1 -15
- package/es/components/EditFullPage/EditFullPage.js +27 -20
- package/es/components/EditFullPage/index.js +1 -0
- package/es/components/EditSidePanel/EditSidePanel.js +38 -51
- package/es/components/EditSidePanel/index.js +1 -0
- package/es/components/EditTearsheet/EditTearsheet.js +32 -42
- package/es/components/EditTearsheet/EditTearsheetForm.js +13 -19
- package/es/components/EditTearsheet/index.js +1 -0
- package/es/components/EditTearsheet/preview-components/MultiFormEditTearsheet.js +34 -48
- package/es/components/EditTearsheetNarrow/EditTearsheetNarrow.js +27 -20
- package/es/components/EditTearsheetNarrow/index.js +1 -0
- package/es/components/EditUpdateCards/EditUpdateCards.js +142 -0
- package/es/components/EditUpdateCards/index.js +8 -0
- package/es/components/EmptyStates/EmptyState.js +18 -25
- package/es/components/EmptyStates/EmptyStateContent.js +16 -17
- package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +20 -24
- package/es/components/EmptyStates/ErrorEmptyState/index.js +1 -0
- package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +20 -24
- package/es/components/EmptyStates/NoDataEmptyState/index.js +1 -0
- package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +20 -24
- package/es/components/EmptyStates/NoTagsEmptyState/index.js +1 -0
- package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +20 -24
- package/es/components/EmptyStates/NotFoundEmptyState/index.js +1 -0
- package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +20 -24
- package/es/components/EmptyStates/NotificationsEmptyState/index.js +1 -0
- package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +20 -24
- package/es/components/EmptyStates/UnauthorizedEmptyState/index.js +1 -0
- package/es/components/EmptyStates/assets/ErrorIllustration.js +7 -6
- package/es/components/EmptyStates/assets/NoDataIllustration.js +7 -6
- package/es/components/EmptyStates/assets/NoTagsIllustration.js +7 -6
- package/es/components/EmptyStates/assets/NotFoundIllustration.js +7 -6
- package/es/components/EmptyStates/assets/NotificationsIllustration.js +7 -6
- package/es/components/EmptyStates/assets/UnauthorizedIllustration.js +7 -6
- package/es/components/EmptyStates/index.js +1 -0
- package/es/components/ExampleComponent/ExampleComponent.js +36 -44
- package/es/components/ExampleComponent/index.js +1 -0
- package/es/components/ExportModal/ExportModal.js +41 -80
- package/es/components/ExportModal/index.js +1 -0
- package/es/components/ExpressiveCard/ExpressiveCard.js +3 -20
- package/es/components/ExpressiveCard/index.js +1 -0
- package/es/components/HTTPErrors/HTTPError403/HTTPError403.js +16 -18
- package/es/components/HTTPErrors/HTTPError403/index.js +1 -0
- package/es/components/HTTPErrors/HTTPError404/HTTPError404.js +16 -18
- package/es/components/HTTPErrors/HTTPError404/index.js +1 -0
- package/es/components/HTTPErrors/HTTPErrorContent.js +15 -18
- package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +16 -18
- package/es/components/HTTPErrors/HTTPErrorOther/index.js +1 -0
- package/es/components/HTTPErrors/assets/HTTPErrorSvg403.js +6 -3
- package/es/components/HTTPErrors/assets/HTTPErrorSvg404.js +6 -3
- package/es/components/HTTPErrors/assets/HTTPErrorSvgOther.js +6 -3
- package/es/components/HTTPErrors/index.js +1 -0
- package/es/components/ImportModal/ImportModal.js +40 -92
- package/es/components/ImportModal/index.js +1 -0
- package/es/components/InlineEdit/InlineEdit.js +68 -98
- package/es/components/InlineEdit/index.js +1 -0
- package/es/components/InlineEditV2/InlineEditV2.js +29 -57
- package/es/components/ModifiedTabs/ModifiedTabLabelNew.js +1 -1
- package/es/components/ModifiedTabs/ModifiedTabLabelWithClose.js +6 -9
- package/es/components/ModifiedTabs/ModifiedTabs.js +14 -19
- package/es/components/MultiAddSelect/MultiAddSelect.js +0 -23
- package/es/components/NotificationsPanel/NotificationsPanel.js +85 -126
- package/es/components/NotificationsPanel/NotificationsPanel_data.js +1 -0
- package/es/components/NotificationsPanel/index.js +1 -0
- package/es/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +1 -2
- package/es/components/NotificationsPanel/utils.js +13 -19
- package/es/components/OptionsTile/OptionsTile.js +52 -80
- package/es/components/OptionsTile/index.js +1 -0
- package/es/components/PageHeader/PageHeader.js +119 -186
- package/es/components/PageHeader/PageHeaderDemo.data.js +0 -1
- package/es/components/PageHeader/PageHeaderTitle.js +18 -23
- package/es/components/PageHeader/PageHeaderUtils.js +18 -45
- package/es/components/PageHeader/index.js +1 -0
- package/es/components/ProductiveCard/ProductiveCard.js +7 -23
- package/es/components/ProductiveCard/index.js +1 -0
- package/es/components/RemoveModal/RemoveModal.js +25 -45
- package/es/components/RemoveModal/index.js +1 -0
- package/es/components/Saving/Saving.js +15 -30
- package/es/components/Saving/index.js +1 -0
- package/es/components/SidePanel/SidePanel.js +103 -150
- package/es/components/SidePanel/constants.js +1 -0
- package/es/components/SidePanel/index.js +1 -0
- package/es/components/SingleAddSelect/SingleAddSelect.js +0 -14
- package/es/components/StatusIcon/StatusIcon.js +5 -12
- package/es/components/StatusIcon/index.js +1 -0
- package/es/components/TagSet/TagSet.js +59 -93
- package/es/components/TagSet/TagSetModal.js +19 -30
- package/es/components/TagSet/TagSetOverflow.js +16 -25
- package/es/components/TagSet/index.js +1 -0
- package/es/components/Tearsheet/Tearsheet.js +26 -33
- package/es/components/Tearsheet/TearsheetNarrow.js +22 -25
- package/es/components/Tearsheet/TearsheetShell.js +80 -91
- package/es/components/Tearsheet/index.js +1 -0
- package/es/components/Toolbar/Toolbar.js +13 -27
- package/es/components/Toolbar/ToolbarButton.js +5 -9
- package/es/components/Toolbar/ToolbarGroup.js +4 -6
- package/es/components/Toolbar/index.js +1 -0
- package/es/components/UserProfileImage/UserProfileImage.js +26 -40
- package/es/components/UserProfileImage/index.js +2 -0
- package/es/components/WebTerminal/WebTerminal.js +41 -51
- package/es/components/WebTerminal/WebTerminalContentWrapper.js +14 -11
- package/es/components/WebTerminal/hooks/index.js +8 -7
- package/es/components/WebTerminal/index.js +1 -0
- package/es/components/WebTerminal/preview-components/Navigation.js +2 -4
- package/es/components/WebTerminal/preview-components/documentationLinks.js +1 -0
- package/es/components/_Canary/Canary.js +13 -13
- package/es/components/_Canary/index.js +1 -0
- package/es/components/index.js +2 -0
- package/es/global/js/hooks/index.js +1 -0
- package/es/global/js/hooks/useActiveElement.js +4 -6
- package/es/global/js/hooks/useClickOutside.js +1 -1
- package/es/global/js/hooks/useCreateComponentFocus.js +6 -5
- package/es/global/js/hooks/useCreateComponentStepChange.js +23 -54
- package/es/global/js/hooks/usePreviousValue.js +2 -1
- package/es/global/js/hooks/useResetCreateComponent.js +10 -9
- package/es/global/js/hooks/useRetrieveStepData.js +7 -10
- package/es/global/js/hooks/useValidCreateStepCount.js +2 -1
- package/es/global/js/hooks/useWindowResize.js +8 -16
- package/es/global/js/hooks/useWindowScroll.js +4 -14
- package/es/global/js/package-settings.js +6 -11
- package/es/global/js/utils/ClickListener.js +5 -10
- package/es/global/js/utils/DisplayBox.js +3 -2
- package/es/global/js/utils/Wrap.js +14 -17
- package/es/global/js/utils/deepCloneObject.js +5 -8
- package/es/global/js/utils/devtools.js +1 -4
- package/es/global/js/utils/getBezierValues.js +1 -2
- package/es/global/js/utils/getFocusableElements.js +1 -1
- package/es/global/js/utils/getScrollbarWidth.js +1 -0
- package/es/global/js/utils/keyboardNavigation.js +7 -5
- package/es/global/js/utils/lastIndexInArray.js +0 -2
- package/es/global/js/utils/motionConstants.js +2 -3
- package/es/global/js/utils/pconsole.js +1 -3
- package/es/global/js/utils/props-helper.js +19 -35
- package/es/global/js/utils/rangeWithCallback.js +1 -0
- package/es/global/js/utils/scrollableAncestor.js +5 -8
- package/es/global/js/utils/story-helper.js +9 -8
- package/es/global/js/utils/test-helper.js +25 -42
- package/es/global/js/utils/unwrap-if-fragment.js +8 -16
- package/es/global/js/utils/uuidv4.js +1 -2
- package/es/global/js/utils/uuidv4.spec.js +1 -1
- package/es/global/js/utils/wait.js +1 -1
- package/es/global/js/utils/wrapFocus.js +8 -14
- package/es/index.js +1 -0
- package/es/settings.js +24 -18
- package/lib/components/APIKeyModal/APIKeyDownloader.js +8 -31
- package/lib/components/APIKeyModal/APIKeyModal.js +57 -161
- package/lib/components/APIKeyModal/index.js +0 -1
- package/lib/components/AboutModal/AboutModal.js +33 -60
- package/lib/components/AboutModal/index.js +0 -1
- package/lib/components/ActionBar/ActionBar.js +62 -97
- package/lib/components/ActionBar/ActionBarItem.js +12 -26
- package/lib/components/ActionBar/ActionBarOverflowItems.js +8 -20
- package/lib/components/ActionBar/index.js +0 -2
- package/lib/components/ActionSet/ActionSet.js +26 -49
- package/lib/components/ActionSet/actions.js +1 -5
- package/lib/components/ActionSet/index.js +0 -1
- package/lib/components/AddSelect/AddSelect.js +2 -16
- package/lib/components/AddSelect/AddSelectBody.js +66 -117
- package/lib/components/AddSelect/AddSelectBreadcrumbs.js +3 -14
- package/lib/components/AddSelect/AddSelectColumn.js +26 -67
- package/lib/components/AddSelect/AddSelectFilter.js +20 -48
- package/lib/components/AddSelect/AddSelectList.js +19 -45
- package/lib/components/AddSelect/AddSelectMetaPanel.js +3 -17
- package/lib/components/AddSelect/AddSelectSidebar.js +13 -31
- package/lib/components/AddSelect/AddSelectSort.js +6 -15
- package/lib/components/AddSelect/add-select-utils.js +2 -33
- package/lib/components/AddSelect/hooks/useItemSort.js +6 -13
- package/lib/components/AddSelect/hooks/useParentSelect.js +3 -9
- package/lib/components/AddSelect/hooks/usePath.js +6 -21
- package/lib/components/AddSelect/index.js +0 -1
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +55 -102
- package/lib/components/BreadcrumbWithOverflow/index.js +0 -1
- package/lib/components/ButtonMenu/ButtonMenu.js +25 -35
- package/lib/components/ButtonMenu/ButtonMenuItem.js +9 -10
- package/lib/components/ButtonMenu/index.js +0 -2
- package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +33 -71
- package/lib/components/ButtonSetWithOverflow/index.js +0 -1
- package/lib/components/Card/Card.js +52 -84
- package/lib/components/Card/CardFooter.js +19 -28
- package/lib/components/Card/CardHeader.js +13 -23
- package/lib/components/Card/index.js +0 -3
- package/lib/components/Cascade/Cascade.js +4 -30
- package/lib/components/Cascade/index.js +0 -1
- package/lib/components/ComboButton/ComboButton.js +23 -49
- package/lib/components/ComboButton/ComboButtonItem/index.js +2 -10
- package/lib/components/ComboButton/index.js +0 -2
- package/lib/components/CreateFullPage/CreateFullPage.js +59 -103
- package/lib/components/CreateFullPage/CreateFullPageStep.js +27 -56
- package/lib/components/CreateFullPage/index.js +0 -2
- package/lib/components/CreateInfluencer/CreateInfluencer.js +13 -24
- package/lib/components/CreateInfluencer/index.js +0 -1
- package/lib/components/CreateModal/CreateModal.js +16 -39
- package/lib/components/CreateModal/index.js +0 -1
- package/lib/components/CreateSidePanel/CreateSidePanel.js +17 -46
- package/lib/components/CreateSidePanel/index.js +0 -1
- package/lib/components/CreateTearsheet/CreateTearsheet.js +64 -107
- package/lib/components/CreateTearsheet/CreateTearsheetDivider.js +3 -14
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +30 -58
- package/lib/components/CreateTearsheet/index.js +0 -3
- package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +45 -79
- package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +41 -71
- package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +25 -47
- package/lib/components/CreateTearsheetNarrow/index.js +0 -1
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +131 -256
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +61 -135
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +24 -75
- package/lib/components/DataSpreadsheet/hooks/index.js +0 -7
- package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js +4 -7
- package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +23 -48
- package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +5 -9
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +18 -37
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +7 -18
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +33 -61
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +8 -14
- package/lib/components/DataSpreadsheet/index.js +0 -1
- package/lib/components/DataSpreadsheet/utils/checkActiveHeaderCell.js +1 -9
- package/lib/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +3 -7
- package/lib/components/DataSpreadsheet/utils/createActiveCellFn.js +15 -23
- package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js +15 -22
- package/lib/components/DataSpreadsheet/utils/generateData.js +4 -16
- package/lib/components/DataSpreadsheet/utils/getCellSize.js +1 -8
- package/lib/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +1 -2
- package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +7 -12
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +19 -38
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +20 -33
- package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +5 -8
- package/lib/components/DataSpreadsheet/utils/handleEditSubmit.js +10 -24
- package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +22 -50
- package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +39 -84
- package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +6 -12
- package/lib/components/DataSpreadsheet/utils/removeCellSelections.js +4 -10
- package/lib/components/DataSpreadsheet/utils/selectAllCells.js +6 -16
- package/lib/components/Datagrid/Datagrid/Datagrid.js +11 -26
- package/lib/components/Datagrid/Datagrid/DatagridBody.js +5 -16
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +31 -64
- package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +8 -16
- package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -10
- package/lib/components/Datagrid/Datagrid/DatagridHead.js +6 -10
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +3 -17
- package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +4 -13
- package/lib/components/Datagrid/Datagrid/DatagridRow.js +4 -26
- package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +10 -26
- package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +23 -48
- package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +2 -14
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +26 -51
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +15 -31
- package/lib/components/Datagrid/Datagrid/DraggableElement.js +75 -98
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +3 -14
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +5 -21
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +14 -41
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +54 -84
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +5 -21
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +1 -5
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +0 -3
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +11 -20
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/index.js +0 -1
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +55 -125
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/index.js +0 -1
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +6 -32
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +1 -3
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/index.js +0 -1
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +8 -18
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +2 -5
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +28 -70
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +14 -27
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +5 -26
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +21 -44
- package/lib/components/Datagrid/Datagrid/addons/RowSize/index.js +0 -2
- package/lib/components/Datagrid/Datagrid/index.js +0 -1
- package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +10 -0
- package/lib/components/Datagrid/Datagrid.stories/common.js +2 -17
- package/lib/components/Datagrid/Datagrid.stories/index.js +0 -6
- package/lib/components/Datagrid/common-column-ids.js +1 -1
- package/lib/components/Datagrid/index.js +0 -19
- package/lib/components/Datagrid/useActionsColumn.js +15 -37
- package/lib/components/Datagrid/useColumnCenterAlign.js +0 -14
- package/lib/components/Datagrid/useColumnOrder.js +1 -4
- package/lib/components/Datagrid/useColumnRightAlign.js +0 -14
- package/lib/components/Datagrid/useCustomizeColumns.js +4 -20
- package/lib/components/Datagrid/useDatagrid.js +0 -20
- package/lib/components/Datagrid/useDefaultStringRenderer.js +0 -15
- package/lib/components/Datagrid/useDisableSelectRows.js +2 -11
- package/lib/components/Datagrid/useExpandedRow.js +5 -20
- package/lib/components/Datagrid/useFlexResize.js +0 -9
- package/lib/components/Datagrid/useFloatingScroll.js +10 -27
- package/lib/components/Datagrid/useInfiniteScroll.js +11 -21
- package/lib/components/Datagrid/useInlineEdit.js +2 -15
- package/lib/components/Datagrid/useNestedRowExpander.js +1 -13
- package/lib/components/Datagrid/useNestedRows.js +2 -11
- package/lib/components/Datagrid/useOnRowClick.js +4 -10
- package/lib/components/Datagrid/useParentDimensions.js +7 -18
- package/lib/components/Datagrid/useResizeTable.js +2 -8
- package/lib/components/Datagrid/useRowExpander.js +1 -8
- package/lib/components/Datagrid/useRowIsMouseOver.js +5 -19
- package/lib/components/Datagrid/useRowRenderer.js +1 -7
- package/lib/components/Datagrid/useRowSize.js +7 -24
- package/lib/components/Datagrid/useSelectAllToggle.js +12 -29
- package/lib/components/Datagrid/useSelectRows.js +11 -39
- package/lib/components/Datagrid/useSkeletonRows.js +1 -8
- package/lib/components/Datagrid/useSortableColumns.js +2 -29
- package/lib/components/Datagrid/useStickyColumn.js +1 -37
- package/lib/components/Datagrid/utils/DatagridActions.js +7 -21
- package/lib/components/Datagrid/utils/DatagridPagination.js +5 -11
- package/lib/components/Datagrid/utils/Wrapper.js +1 -5
- package/lib/components/Datagrid/utils/getArgTypes.js +1 -1
- package/lib/components/Datagrid/utils/getInlineEditColumns.js +1 -6
- package/lib/components/Datagrid/utils/makeData.js +0 -24
- package/lib/components/EditFullPage/EditFullPage.js +22 -24
- package/lib/components/EditFullPage/index.js +0 -1
- package/lib/components/EditSidePanel/EditSidePanel.js +31 -59
- package/lib/components/EditSidePanel/index.js +0 -1
- package/lib/components/EditTearsheet/EditTearsheet.js +31 -59
- package/lib/components/EditTearsheet/EditTearsheetForm.js +12 -33
- package/lib/components/EditTearsheet/index.js +0 -2
- package/lib/components/EditTearsheet/preview-components/MultiFormEditTearsheet.js +34 -61
- package/lib/components/EditTearsheetNarrow/EditTearsheetNarrow.js +22 -24
- package/lib/components/EditTearsheetNarrow/index.js +0 -1
- package/lib/components/EditUpdateCards/EditUpdateCards.js +140 -0
- package/lib/components/EditUpdateCards/index.js +12 -0
- package/lib/components/EmptyStates/EmptyState.js +13 -38
- package/lib/components/EmptyStates/EmptyStateContent.js +10 -25
- package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +15 -37
- package/lib/components/EmptyStates/ErrorEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +15 -37
- package/lib/components/EmptyStates/NoDataEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +15 -37
- package/lib/components/EmptyStates/NoTagsEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +15 -37
- package/lib/components/EmptyStates/NotFoundEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +15 -37
- package/lib/components/EmptyStates/NotificationsEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +15 -37
- package/lib/components/EmptyStates/UnauthorizedEmptyState/index.js +0 -1
- package/lib/components/EmptyStates/assets/ErrorIllustration.js +2 -13
- package/lib/components/EmptyStates/assets/NoDataIllustration.js +2 -13
- package/lib/components/EmptyStates/assets/NoTagsIllustration.js +2 -13
- package/lib/components/EmptyStates/assets/NotFoundIllustration.js +2 -13
- package/lib/components/EmptyStates/assets/NotificationsIllustration.js +2 -13
- package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +2 -13
- package/lib/components/EmptyStates/index.js +0 -7
- package/lib/components/ExampleComponent/ExampleComponent.js +29 -51
- package/lib/components/ExampleComponent/index.js +0 -1
- package/lib/components/ExportModal/ExportModal.js +40 -95
- package/lib/components/ExportModal/index.js +0 -1
- package/lib/components/ExpressiveCard/ExpressiveCard.js +3 -32
- package/lib/components/ExpressiveCard/index.js +0 -1
- package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +11 -27
- package/lib/components/HTTPErrors/HTTPError403/index.js +0 -1
- package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +11 -27
- package/lib/components/HTTPErrors/HTTPError404/index.js +0 -1
- package/lib/components/HTTPErrors/HTTPErrorContent.js +9 -23
- package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +11 -27
- package/lib/components/HTTPErrors/HTTPErrorOther/index.js +0 -1
- package/lib/components/HTTPErrors/assets/HTTPErrorSvg403.js +6 -7
- package/lib/components/HTTPErrors/assets/HTTPErrorSvg404.js +6 -7
- package/lib/components/HTTPErrors/assets/HTTPErrorSvgOther.js +6 -7
- package/lib/components/HTTPErrors/index.js +0 -3
- package/lib/components/ImportModal/ImportModal.js +39 -110
- package/lib/components/ImportModal/index.js +0 -1
- package/lib/components/InlineEdit/InlineEdit.js +61 -111
- package/lib/components/InlineEdit/index.js +0 -1
- package/lib/components/InlineEditV2/InlineEditV2.js +29 -74
- package/lib/components/InlineEditV2/index.js +0 -1
- package/lib/components/ModifiedTabs/ModifiedTabLabelNew.js +1 -7
- package/lib/components/ModifiedTabs/ModifiedTabLabelWithClose.js +6 -15
- package/lib/components/ModifiedTabs/ModifiedTabs.js +14 -32
- package/lib/components/ModifiedTabs/index.js +0 -1
- package/lib/components/MultiAddSelect/MultiAddSelect.js +0 -34
- package/lib/components/MultiAddSelect/index.js +0 -1
- package/lib/components/NotificationsPanel/NotificationsPanel.js +78 -143
- package/lib/components/NotificationsPanel/NotificationsPanel_data.js +1 -4
- package/lib/components/NotificationsPanel/index.js +0 -1
- package/lib/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +1 -4
- package/lib/components/NotificationsPanel/utils.js +13 -21
- package/lib/components/OptionsTile/OptionsTile.js +45 -96
- package/lib/components/OptionsTile/index.js +0 -1
- package/lib/components/PageHeader/PageHeader.js +116 -212
- package/lib/components/PageHeader/PageHeaderDemo.data.js +0 -3
- package/lib/components/PageHeader/PageHeaderTitle.js +17 -35
- package/lib/components/PageHeader/PageHeaderUtils.js +17 -58
- package/lib/components/PageHeader/index.js +0 -1
- package/lib/components/ProductiveCard/ProductiveCard.js +6 -36
- package/lib/components/ProductiveCard/index.js +0 -1
- package/lib/components/RemoveModal/RemoveModal.js +24 -61
- package/lib/components/RemoveModal/index.js +0 -1
- package/lib/components/Saving/Saving.js +14 -44
- package/lib/components/Saving/index.js +0 -1
- package/lib/components/SidePanel/SidePanel.js +98 -173
- package/lib/components/SidePanel/constants.js +1 -1
- package/lib/components/SidePanel/index.js +0 -1
- package/lib/components/SidePanel/motion/variants.js +0 -2
- package/lib/components/SingleAddSelect/SingleAddSelect.js +0 -26
- package/lib/components/SingleAddSelect/index.js +0 -1
- package/lib/components/StatusIcon/StatusIcon.js +5 -23
- package/lib/components/StatusIcon/index.js +0 -1
- package/lib/components/TagSet/TagSet.js +58 -113
- package/lib/components/TagSet/TagSetModal.js +18 -46
- package/lib/components/TagSet/TagSetOverflow.js +15 -43
- package/lib/components/TagSet/index.js +0 -1
- package/lib/components/Tearsheet/Tearsheet.js +20 -42
- package/lib/components/Tearsheet/TearsheetNarrow.js +16 -34
- package/lib/components/Tearsheet/TearsheetShell.js +73 -114
- package/lib/components/Tearsheet/index.js +0 -2
- package/lib/components/Toolbar/Toolbar.js +12 -40
- package/lib/components/Toolbar/ToolbarButton.js +4 -22
- package/lib/components/Toolbar/ToolbarGroup.js +2 -16
- package/lib/components/Toolbar/index.js +0 -3
- package/lib/components/UserProfileImage/UserProfileImage.js +19 -48
- package/lib/components/UserProfileImage/index.js +0 -1
- package/lib/components/WebTerminal/WebTerminal.js +34 -67
- package/lib/components/WebTerminal/WebTerminalContentWrapper.js +9 -20
- package/lib/components/WebTerminal/hooks/index.js +8 -19
- package/lib/components/WebTerminal/index.js +0 -3
- package/lib/components/WebTerminal/preview-components/Navigation.js +2 -9
- package/lib/components/WebTerminal/preview-components/documentationLinks.js +1 -0
- package/lib/components/WebTerminal/preview-components/index.js +0 -2
- package/lib/components/_Canary/Canary.js +4 -17
- package/lib/components/_Canary/index.js +0 -1
- package/lib/components/index.js +7 -38
- package/lib/global/js/hooks/index.js +0 -10
- package/lib/global/js/hooks/useActiveElement.js +4 -10
- package/lib/global/js/hooks/useClickOutside.js +1 -4
- package/lib/global/js/hooks/useCreateComponentFocus.js +4 -8
- package/lib/global/js/hooks/useCreateComponentStepChange.js +23 -59
- package/lib/global/js/hooks/usePreviousValue.js +0 -3
- package/lib/global/js/hooks/useResetCreateComponent.js +8 -11
- package/lib/global/js/hooks/useRetrieveStepData.js +5 -12
- package/lib/global/js/hooks/useValidCreateStepCount.js +0 -3
- package/lib/global/js/hooks/useWindowResize.js +8 -21
- package/lib/global/js/hooks/useWindowScroll.js +4 -20
- package/lib/global/js/package-settings.js +5 -14
- package/lib/global/js/utils/ClickListener.js +3 -16
- package/lib/global/js/utils/DisplayBox.js +3 -9
- package/lib/global/js/utils/Wrap.js +8 -22
- package/lib/global/js/utils/deepCloneObject.js +5 -11
- package/lib/global/js/utils/devtools.js +1 -6
- package/lib/global/js/utils/getBezierValues.js +1 -5
- package/lib/global/js/utils/getFocusableElements.js +1 -4
- package/lib/global/js/utils/getScrollbarWidth.js +1 -2
- package/lib/global/js/utils/keyboardNavigation.js +7 -6
- package/lib/global/js/utils/lastIndexInArray.js +0 -4
- package/lib/global/js/utils/motionConstants.js +1 -5
- package/lib/global/js/utils/pconsole.js +1 -7
- package/lib/global/js/utils/props-helper.js +15 -57
- package/lib/global/js/utils/rangeWithCallback.js +1 -2
- package/lib/global/js/utils/scrollableAncestor.js +5 -12
- package/lib/global/js/utils/story-helper.js +7 -21
- package/lib/global/js/utils/test-helper.js +25 -69
- package/lib/global/js/utils/unwrap-if-fragment.js +7 -19
- package/lib/global/js/utils/uuidv4.js +1 -3
- package/lib/global/js/utils/uuidv4.spec.js +1 -3
- package/lib/global/js/utils/wait.js +1 -2
- package/lib/global/js/utils/wrapFocus.js +6 -16
- package/lib/index.js +0 -3
- package/lib/settings.js +24 -27
- package/package.json +8 -8
- package/scss/components/EditUpdateCards/_edit-update-cards.scss +87 -0
- package/scss/components/EditUpdateCards/_index.scss +8 -0
- package/scss/components/EditUpdateCards/_storybook-styles.scss +56 -0
- package/scss/components/InlineEditV2/_inline-edit-v2.scss +11 -8
- package/scss/components/InlineEditV2/_storybook-styles.scss +3 -0
- package/scss/components/SidePanel/_side-panel.scss +2 -3
- package/scss/components/_index.scss +1 -1
|
@@ -7,41 +7,39 @@ import PropTypes from 'prop-types';
|
|
|
7
7
|
import cx from 'classnames';
|
|
8
8
|
import { SkeletonText } from 'carbon-components-react';
|
|
9
9
|
import { InlineEdit } from '../';
|
|
10
|
+
|
|
10
11
|
/**
|
|
11
12
|
*
|
|
12
13
|
* Utility component used by Page Header
|
|
13
14
|
*/
|
|
14
15
|
// eslint-disable-next-line react/prop-types
|
|
15
|
-
|
|
16
16
|
export var PageHeaderTitle = function PageHeaderTitle(_ref) {
|
|
17
17
|
var blockClass = _ref.blockClass,
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var titleInnards;
|
|
18
|
+
hasBreadcrumbRow = _ref.hasBreadcrumbRow,
|
|
19
|
+
title = _ref.title;
|
|
20
|
+
var titleInnards;
|
|
21
|
+
// eslint-disable-next-line
|
|
21
22
|
// debugger;
|
|
22
23
|
|
|
23
24
|
var text = title.text,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
25
|
+
content = title.content,
|
|
26
|
+
loading = title.loading,
|
|
27
|
+
icon = title.icon,
|
|
28
|
+
asText = title.asText,
|
|
29
|
+
onChange = title.onChange,
|
|
30
|
+
onSave = title.onSave,
|
|
31
|
+
editDescription = title.editDescription,
|
|
32
|
+
editableLabel = title.editableLabel,
|
|
33
|
+
revertDescription = title.revertDescription,
|
|
34
|
+
saveDescription = title.saveDescription,
|
|
35
|
+
rest = _objectWithoutProperties(title, _excluded);
|
|
36
36
|
var titleText;
|
|
37
37
|
var isEditable = !!onSave;
|
|
38
|
-
|
|
39
38
|
if (text || !content) {
|
|
40
39
|
if (text === undefined && typeof title === 'string') {
|
|
41
40
|
text = title;
|
|
42
41
|
asText = title;
|
|
43
42
|
}
|
|
44
|
-
|
|
45
43
|
var TitleIcon = icon;
|
|
46
44
|
titleInnards = /*#__PURE__*/React.createElement(React.Fragment, null, icon && !loading ? /*#__PURE__*/React.createElement(TitleIcon, {
|
|
47
45
|
className: "".concat(blockClass, "__title-icon")
|
|
@@ -64,7 +62,6 @@ export var PageHeaderTitle = function PageHeaderTitle(_ref) {
|
|
|
64
62
|
titleInnards = content;
|
|
65
63
|
titleText = asText;
|
|
66
64
|
}
|
|
67
|
-
|
|
68
65
|
return /*#__PURE__*/React.createElement("div", {
|
|
69
66
|
className: cx("".concat(blockClass, "__title"), _defineProperty({}, "".concat(blockClass, "__title--editable"), isEditable), _defineProperty({}, "".concat(blockClass, "__title--fades"), hasBreadcrumbRow)),
|
|
70
67
|
title: titleText
|
|
@@ -79,12 +76,10 @@ export var inlineEditRequired = function inlineEditRequired(_ref2) {
|
|
|
79
76
|
PageHeaderTitle.propTypes = {
|
|
80
77
|
// passed from page header
|
|
81
78
|
blockClass: PropTypes.string.isRequired,
|
|
82
|
-
|
|
83
79
|
/**
|
|
84
80
|
* controlled from within page header
|
|
85
81
|
*/
|
|
86
82
|
hasBreadcrumbRow: PropTypes.bool,
|
|
87
|
-
|
|
88
83
|
/**
|
|
89
84
|
* An optional page title supplied as a string or object with the following attributes: text, icon, loading
|
|
90
85
|
*
|
|
@@ -117,8 +112,8 @@ PageHeaderTitle.propTypes = {
|
|
|
117
112
|
onChange: PropTypes.func,
|
|
118
113
|
onSave: PropTypes.func,
|
|
119
114
|
revertDescription: PropTypes.string.isRequired.if(inlineEditRequired),
|
|
120
|
-
saveDescription: PropTypes.string.isRequired.if(inlineEditRequired)
|
|
121
|
-
|
|
115
|
+
saveDescription: PropTypes.string.isRequired.if(inlineEditRequired)
|
|
116
|
+
// Update docgen if changed
|
|
122
117
|
}), PropTypes.string, PropTypes.shape({
|
|
123
118
|
content: PropTypes.node.isRequired,
|
|
124
119
|
breadcrumbContent: PropTypes.node,
|
|
@@ -1,21 +1,20 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
|
|
3
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
-
|
|
7
4
|
/**
|
|
8
5
|
* Copyright IBM Corp. 2020, 2021
|
|
9
6
|
*
|
|
10
7
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
11
8
|
* LICENSE file in the root directory of this source tree.
|
|
12
9
|
*/
|
|
10
|
+
|
|
13
11
|
import React from 'react';
|
|
14
12
|
import cx from 'classnames';
|
|
15
13
|
import { pkg } from '../../settings';
|
|
16
14
|
import { scrollableAncestor } from '../../global/js/utils/scrollableAncestor';
|
|
17
15
|
import { SkeletonText } from 'carbon-components-react';
|
|
18
16
|
export var blockClass = "".concat(pkg.prefix, "--page-header");
|
|
17
|
+
|
|
19
18
|
/**
|
|
20
19
|
* Assesses the vertical height of various elements and calls setMetrics with update
|
|
21
20
|
* @param {{}} headerRef
|
|
@@ -26,33 +25,24 @@ export var blockClass = "".concat(pkg.prefix, "--page-header");
|
|
|
26
25
|
* @param {boolean} widthIsNarrow
|
|
27
26
|
* @param {()} setMetrics
|
|
28
27
|
*/
|
|
29
|
-
|
|
30
28
|
export var utilCheckUpdateVerticalSpace = function utilCheckUpdateVerticalSpace(headerRef, offsetTopMeasuringRef, navigation, enableBreadcrumbScroll, hasActionBar, widthIsNarrow, setMetrics) {
|
|
31
29
|
var dynamicRefs = {};
|
|
32
|
-
|
|
33
30
|
var getDynamicRef = function getDynamicRef(selector) {
|
|
34
31
|
// would love to do this differently but digging in the dom seems easier
|
|
35
32
|
// than getting a ref to a conditionally rendered item
|
|
36
|
-
|
|
37
33
|
/* don't know how to test resize */
|
|
38
|
-
|
|
39
34
|
/* istanbul ignore if */
|
|
40
35
|
if (!headerRef.current) {
|
|
41
36
|
return undefined;
|
|
42
37
|
} else {
|
|
43
38
|
var dRef = dynamicRefs[selector];
|
|
44
39
|
/* istanbul ignore else */
|
|
45
|
-
|
|
46
|
-
if (!dRef ||
|
|
47
|
-
/* istanbul ignore next */
|
|
48
|
-
dRef.parentNode === null) {
|
|
40
|
+
if (!dRef || /* istanbul ignore next */dRef.parentNode === null) {
|
|
49
41
|
dynamicRefs[selector] = headerRef.current.querySelector(selector);
|
|
50
42
|
}
|
|
51
43
|
}
|
|
52
|
-
|
|
53
44
|
return dynamicRefs[selector];
|
|
54
45
|
};
|
|
55
|
-
|
|
56
46
|
setMetrics(function (previous) {
|
|
57
47
|
// Utility function that checks the heights of various elements which are used to determine layout
|
|
58
48
|
var update = {};
|
|
@@ -63,100 +53,87 @@ export var utilCheckUpdateVerticalSpace = function utilCheckUpdateVerticalSpace(
|
|
|
63
53
|
var availableRowEl = getDynamicRef(".".concat(blockClass, "__available-row"));
|
|
64
54
|
var navigationRowEl = getDynamicRef(".".concat(blockClass, "__navigation-row"));
|
|
65
55
|
var pageActionsEl = getDynamicRef(".".concat(blockClass, "__page-actions"));
|
|
66
|
-
/* istanbul ignore next */
|
|
67
56
|
|
|
57
|
+
/* istanbul ignore next */
|
|
68
58
|
update.headerHeight = headerRef.current ? headerRef.current.clientHeight : 0;
|
|
69
59
|
/* istanbul ignore next */
|
|
60
|
+
update.headerWidth = headerRef.current ? headerRef.current.offsetWidth : 0;
|
|
70
61
|
|
|
71
|
-
|
|
62
|
+
// The header offset is the vertical distance from the top of the document to
|
|
72
63
|
// the page header, which we obtain using getBoundingClientRect() for robust
|
|
73
64
|
// behavior. We use this offset as the scroll/fixed threshold.
|
|
74
|
-
|
|
75
65
|
var scrollableContainer = scrollableAncestor(headerRef.current);
|
|
66
|
+
|
|
76
67
|
/* istanbul ignore next */
|
|
68
|
+
var scrollableContainerTop = scrollableContainer ? scrollableContainer.scrollTop - scrollableContainer.offsetTop : 0;
|
|
77
69
|
|
|
78
|
-
|
|
70
|
+
// The header offset calculation is either going to work out at 0 if we have no gap between scrolling container
|
|
79
71
|
// top and the measuring ref top, or the difference between. It does not change on scroll or resize.
|
|
80
|
-
|
|
81
72
|
update.headerOffset = scrollableContainerTop + offsetTopMeasuringRef.current.getBoundingClientRect().top;
|
|
82
|
-
/* istanbul ignore next */
|
|
83
73
|
|
|
74
|
+
/* istanbul ignore next */
|
|
84
75
|
update.breadcrumbRowHeight = breadcrumbRowEl ? breadcrumbRowEl.clientHeight : 0;
|
|
85
76
|
/* istanbul ignore next */
|
|
86
|
-
|
|
87
77
|
update.breadcrumbRowWidth = breadcrumbRowEl ? breadcrumbRowEl.offsetWidth : 0;
|
|
88
|
-
/* istanbul ignore next */
|
|
89
78
|
|
|
79
|
+
/* istanbul ignore next */
|
|
90
80
|
update.breadcrumbTitleHeight = breadcrumbTitleEl ? breadcrumbTitleEl.offsetHeight // clientHeight returns 0 when window small
|
|
91
81
|
: 1;
|
|
92
|
-
/* istanbul ignore next */
|
|
93
82
|
|
|
83
|
+
/* istanbul ignore next */
|
|
94
84
|
update.titleRowHeight = titleRowEl ? titleRowEl.clientHeight : 0;
|
|
95
85
|
/* istanbul ignore next */
|
|
96
|
-
|
|
97
86
|
update.subtitleRowHeight = subtitleRowEl ? subtitleRowEl.clientHeight : 0;
|
|
98
87
|
/* istanbul ignore next */
|
|
99
|
-
|
|
100
88
|
update.availableRowHeight = availableRowEl ? availableRowEl.clientHeight : 0;
|
|
101
89
|
/* istanbul ignore next */
|
|
90
|
+
update.navigationRowHeight = navigationRowEl ? navigationRowEl.clientHeight : 1;
|
|
102
91
|
|
|
103
|
-
|
|
104
|
-
|
|
92
|
+
// Base for calculating sticky top
|
|
105
93
|
update.headerTopValue = -update.headerHeight;
|
|
106
|
-
|
|
107
94
|
if (navigation) {
|
|
108
95
|
// adjust top for sticky with navigation
|
|
109
96
|
update.headerTopValue += update.navigationRowHeight;
|
|
110
97
|
}
|
|
111
|
-
|
|
112
98
|
if (!hasActionBar && !widthIsNarrow) {
|
|
113
99
|
// Add difference between $spacing-08 and $spacing-07 to ensure space below breadcrumb is correct on scroll
|
|
114
100
|
// $spacing-07 is used as size for breadcrumb when no action bar otherwise $spacing-08
|
|
115
101
|
update.headerTopValue += 8;
|
|
116
102
|
}
|
|
117
|
-
|
|
118
103
|
if (!enableBreadcrumbScroll || !navigation) {
|
|
119
104
|
// adjust sticky top if no navigation or breadcrumb is to stay on screen
|
|
120
105
|
update.headerTopValue += update.breadcrumbRowHeight;
|
|
121
106
|
}
|
|
122
|
-
|
|
123
107
|
if (enableBreadcrumbScroll) {
|
|
124
108
|
// adjust header top value when scroll enabled for breadcrumb
|
|
125
109
|
update.headerTopValue -= navigation ? hasActionBar ? 0 : 10 : update.headerHeight;
|
|
126
|
-
}
|
|
127
|
-
|
|
110
|
+
}
|
|
128
111
|
|
|
112
|
+
// if (window) {
|
|
129
113
|
var val;
|
|
130
114
|
/* don't know how to test resize */
|
|
131
|
-
|
|
132
115
|
/* istanbul ignore if */
|
|
133
|
-
|
|
134
116
|
if (breadcrumbRowEl) {
|
|
135
117
|
val = parseFloat(window.getComputedStyle(breadcrumbRowEl).getPropertyValue('margin-bottom'), 10);
|
|
136
118
|
update.breadcrumbRowSpaceBelow = isNaN(val) ? 0 : val;
|
|
137
119
|
}
|
|
138
120
|
/* don't know how to test resize */
|
|
139
|
-
|
|
140
121
|
/* istanbul ignore if */
|
|
141
|
-
|
|
142
|
-
|
|
143
122
|
if (titleRowEl) {
|
|
144
123
|
val = parseFloat(window.getComputedStyle(titleRowEl).getPropertyValue('margin-top'), 10);
|
|
145
124
|
update.titleRowSpaceAbove = isNaN(val) ? 0 : val;
|
|
146
|
-
|
|
147
125
|
if (pageActionsEl) {
|
|
148
126
|
val = parseFloat(window.getComputedStyle(pageActionsEl).getPropertyValue('margin-top'), 10);
|
|
149
127
|
update.pageActionsSpaceAbove = titleRowEl.clientHeight - pageActionsEl.clientHeight + update.titleRowSpaceAbove - (isNaN(val) ? 0 : val);
|
|
150
128
|
}
|
|
151
129
|
}
|
|
152
|
-
|
|
153
130
|
return _objectSpread(_objectSpread({}, previous), update);
|
|
154
131
|
});
|
|
155
|
-
};
|
|
132
|
+
};
|
|
156
133
|
|
|
134
|
+
// Trigger a window scroll, if necessary, to set the collapsed state.
|
|
157
135
|
export var utilSetCollapsed = function utilSetCollapsed(collapse, headerOffset, headerTopValue) {
|
|
158
136
|
/* don't know how to test resize */
|
|
159
|
-
|
|
160
137
|
/* istanbul ignore else */
|
|
161
138
|
if (collapse) {
|
|
162
139
|
window.scrollTo({
|
|
@@ -172,7 +149,6 @@ export var utilSetCollapsed = function utilSetCollapsed(collapse, headerOffset,
|
|
|
172
149
|
};
|
|
173
150
|
export var utilGetBreadcrumbItemForTitle = function utilGetBreadcrumbItemForTitle(blockClass, collapseTitle, title) {
|
|
174
151
|
var breadcrumbTitle;
|
|
175
|
-
|
|
176
152
|
if (title) {
|
|
177
153
|
if (title.text !== undefined) {
|
|
178
154
|
// Shape title provided
|
|
@@ -182,7 +158,6 @@ export var utilGetBreadcrumbItemForTitle = function utilGetBreadcrumbItemForTitl
|
|
|
182
158
|
};
|
|
183
159
|
} else if (title.content !== undefined) {
|
|
184
160
|
var _ref, _title$breadcrumbCont;
|
|
185
|
-
|
|
186
161
|
// user defined content
|
|
187
162
|
breadcrumbTitle = {
|
|
188
163
|
label: (_ref = (_title$breadcrumbCont = title.breadcrumbContent) !== null && _title$breadcrumbCont !== void 0 ? _title$breadcrumbCont : title.content) !== null && _ref !== void 0 ? _ref : title.asText,
|
|
@@ -194,13 +169,11 @@ export var utilGetBreadcrumbItemForTitle = function utilGetBreadcrumbItemForTitl
|
|
|
194
169
|
title: title
|
|
195
170
|
};
|
|
196
171
|
}
|
|
197
|
-
|
|
198
172
|
if (breadcrumbTitle) {
|
|
199
173
|
breadcrumbTitle.key = 'breadcrumb-title';
|
|
200
174
|
breadcrumbTitle.isCurrentPage = true;
|
|
201
175
|
breadcrumbTitle.className = cx(["".concat(blockClass, "__breadcrumb-title"), _defineProperty({}, "".concat(blockClass, "__breadcrumb-title--pre-collapsed"), collapseTitle)]);
|
|
202
176
|
}
|
|
203
|
-
|
|
204
177
|
return breadcrumbTitle;
|
|
205
178
|
}
|
|
206
179
|
};
|
|
@@ -2,33 +2,31 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
4
|
var _excluded = ["actionsPlacement"];
|
|
5
|
-
|
|
6
5
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
7
|
-
|
|
8
6
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
9
|
-
|
|
10
7
|
//
|
|
11
8
|
// Copyright IBM Corp. 2020, 2021
|
|
12
9
|
//
|
|
13
10
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
14
11
|
// LICENSE file in the root directory of this source tree.
|
|
15
12
|
//
|
|
13
|
+
|
|
16
14
|
import React, { forwardRef } from 'react';
|
|
17
15
|
import PropTypes from 'prop-types';
|
|
18
16
|
import { Card } from '../Card';
|
|
19
17
|
import { getDevtoolsProps } from '../../global/js/utils/devtools';
|
|
20
18
|
import { prepareProps } from '../../global/js/utils/props-helper';
|
|
21
19
|
import { pkg } from '../../settings';
|
|
22
|
-
var componentName = 'ProductiveCard';
|
|
20
|
+
var componentName = 'ProductiveCard';
|
|
23
21
|
|
|
22
|
+
// Default values for props
|
|
24
23
|
var defaults = {
|
|
25
24
|
actionsPlacement: 'top'
|
|
26
25
|
};
|
|
27
26
|
export var ProductiveCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
28
27
|
var _ref$actionsPlacement = _ref.actionsPlacement,
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
28
|
+
actionsPlacement = _ref$actionsPlacement === void 0 ? defaults.actionsPlacement : _ref$actionsPlacement,
|
|
29
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
32
30
|
var validProps = prepareProps(rest, ['media', 'mediaPosition', 'onSecondaryButtonClick', 'pictogram', 'primaryButtonClick', 'productive', 'secondaryButtonKind', 'secondaryButtonText']);
|
|
33
31
|
return /*#__PURE__*/React.createElement(Card, _extends({}, _objectSpread(_objectSpread({}, validProps), {}, {
|
|
34
32
|
actionsPlacement: actionsPlacement,
|
|
@@ -36,8 +34,9 @@ export var ProductiveCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
36
34
|
}), {
|
|
37
35
|
productive: true
|
|
38
36
|
}, getDevtoolsProps(componentName)));
|
|
39
|
-
});
|
|
37
|
+
});
|
|
40
38
|
|
|
39
|
+
// Return a placeholder if not released and not enabled by feature flag
|
|
41
40
|
ProductiveCard = pkg.checkComponentEnabled(ProductiveCard, componentName);
|
|
42
41
|
ProductiveCard.propTypes = {
|
|
43
42
|
/**
|
|
@@ -51,47 +50,38 @@ ProductiveCard.propTypes = {
|
|
|
51
50
|
iconDescription: PropTypes.string,
|
|
52
51
|
href: PropTypes.string
|
|
53
52
|
})),
|
|
54
|
-
|
|
55
53
|
/**
|
|
56
54
|
* Determines if the action icons are on the top or bottom of the card
|
|
57
55
|
*/
|
|
58
56
|
actionsPlacement: PropTypes.oneOf(['top', 'bottom']),
|
|
59
|
-
|
|
60
57
|
/**
|
|
61
58
|
* Content that shows in the body of the card
|
|
62
59
|
*/
|
|
63
60
|
children: PropTypes.node,
|
|
64
|
-
|
|
65
61
|
/**
|
|
66
62
|
* Optional user provided class
|
|
67
63
|
*/
|
|
68
64
|
className: PropTypes.string,
|
|
69
|
-
|
|
70
65
|
/**
|
|
71
66
|
* Designates which zones of the card are clickable. Refer to design documentation for implementation guidelines
|
|
72
67
|
*/
|
|
73
68
|
clickZone: PropTypes.oneOf(['one', 'two', 'three']),
|
|
74
|
-
|
|
75
69
|
/**
|
|
76
70
|
* Optional header description
|
|
77
71
|
*/
|
|
78
72
|
description: PropTypes.string,
|
|
79
|
-
|
|
80
73
|
/**
|
|
81
74
|
* Optional label for the top of the card
|
|
82
75
|
*/
|
|
83
76
|
label: PropTypes.string,
|
|
84
|
-
|
|
85
77
|
/**
|
|
86
78
|
* Provides the callback for a clickable card
|
|
87
79
|
*/
|
|
88
80
|
onClick: PropTypes.func,
|
|
89
|
-
|
|
90
81
|
/**
|
|
91
82
|
* Function that's called from the primary button or action icon
|
|
92
83
|
*/
|
|
93
84
|
onPrimaryButtonClick: PropTypes.func,
|
|
94
|
-
|
|
95
85
|
/**
|
|
96
86
|
* Use an overflow menu instead of action icons. Refer to design documentation for implementation guidelines
|
|
97
87
|
*/
|
|
@@ -101,32 +91,26 @@ ProductiveCard.propTypes = {
|
|
|
101
91
|
onClick: PropTypes.func,
|
|
102
92
|
onKeyDown: PropTypes.func
|
|
103
93
|
})),
|
|
104
|
-
|
|
105
94
|
/**
|
|
106
95
|
* Optionally specify an href for your Button to become an <a> element
|
|
107
96
|
*/
|
|
108
97
|
primaryButtonHref: PropTypes.string,
|
|
109
|
-
|
|
110
98
|
/**
|
|
111
99
|
* Optional prop to allow overriding the icon rendering. Can be a React component class
|
|
112
100
|
*/
|
|
113
101
|
primaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
|
|
114
|
-
|
|
115
102
|
/**
|
|
116
103
|
* Determines if the primary button is on the top or bottom of the card
|
|
117
104
|
*/
|
|
118
105
|
primaryButtonPlacement: PropTypes.oneOf(['top', 'bottom']),
|
|
119
|
-
|
|
120
106
|
/**
|
|
121
107
|
* The text that's displayed in the primary button
|
|
122
108
|
*/
|
|
123
109
|
primaryButtonText: PropTypes.node,
|
|
124
|
-
|
|
125
110
|
/**
|
|
126
111
|
* Title that's displayed at the top of the card
|
|
127
112
|
*/
|
|
128
113
|
title: PropTypes.string,
|
|
129
|
-
|
|
130
114
|
/**
|
|
131
115
|
* Determines title size
|
|
132
116
|
*/
|
|
@@ -3,17 +3,15 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["body", "className", "iconDescription", "inputInvalidText", "inputLabelText", "inputPlaceholderText", "label", "onClose", "onRequestSubmit", "open", "preventCloseOnClickOutside", "primaryButtonText", "resourceName", "secondaryButtonText", "textConfirmation", "title"];
|
|
6
|
-
|
|
7
6
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
8
|
-
|
|
9
7
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
10
|
-
|
|
11
8
|
//
|
|
12
9
|
// Copyright IBM Corp. 2020, 2021
|
|
13
10
|
//
|
|
14
11
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
15
12
|
// LICENSE file in the root directory of this source tree.
|
|
16
13
|
//
|
|
14
|
+
|
|
17
15
|
import React, { useState, useRef, forwardRef, useEffect } from 'react';
|
|
18
16
|
import cx from 'classnames';
|
|
19
17
|
import { Button, ComposedModal, ModalHeader, ModalFooter, ModalBody, TextInput } from 'carbon-components-react';
|
|
@@ -25,43 +23,39 @@ import { usePreviousValue } from '../../global/js/hooks';
|
|
|
25
23
|
var componentName = 'RemoveModal';
|
|
26
24
|
export var RemoveModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
25
|
var body = _ref.body,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
26
|
+
className = _ref.className,
|
|
27
|
+
iconDescription = _ref.iconDescription,
|
|
28
|
+
inputInvalidText = _ref.inputInvalidText,
|
|
29
|
+
inputLabelText = _ref.inputLabelText,
|
|
30
|
+
inputPlaceholderText = _ref.inputPlaceholderText,
|
|
31
|
+
label = _ref.label,
|
|
32
|
+
onClose = _ref.onClose,
|
|
33
|
+
onRequestSubmit = _ref.onRequestSubmit,
|
|
34
|
+
open = _ref.open,
|
|
35
|
+
preventCloseOnClickOutside = _ref.preventCloseOnClickOutside,
|
|
36
|
+
primaryButtonText = _ref.primaryButtonText,
|
|
37
|
+
resourceName = _ref.resourceName,
|
|
38
|
+
secondaryButtonText = _ref.secondaryButtonText,
|
|
39
|
+
textConfirmation = _ref.textConfirmation,
|
|
40
|
+
title = _ref.title,
|
|
41
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
45
42
|
var previousState = usePreviousValue({
|
|
46
43
|
open: open
|
|
47
44
|
});
|
|
48
|
-
|
|
49
45
|
var _useState = useState(''),
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
46
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
47
|
+
userInput = _useState2[0],
|
|
48
|
+
setUserInput = _useState2[1];
|
|
54
49
|
var idRef = useRef(uuidv4());
|
|
55
|
-
|
|
56
50
|
var onChangeHandler = function onChangeHandler(e) {
|
|
57
51
|
setUserInput(e.target.value);
|
|
58
52
|
};
|
|
59
|
-
|
|
60
53
|
var primaryButtonDisabled = textConfirmation && userInput !== resourceName;
|
|
61
|
-
var blockClass = "".concat(pkg.prefix, "--remove-modal");
|
|
54
|
+
var blockClass = "".concat(pkg.prefix, "--remove-modal");
|
|
55
|
+
|
|
56
|
+
// Clear the user input this way so that if the onRequestSubmit handler fails for some reason
|
|
62
57
|
// the value of the input will still remain: we only want to empty the input value
|
|
63
58
|
// when open actually changes to false.
|
|
64
|
-
|
|
65
59
|
useEffect(function () {
|
|
66
60
|
if (!open && previousState !== null && previousState !== void 0 && previousState.open) {
|
|
67
61
|
setUserInput('');
|
|
@@ -101,85 +95,71 @@ export var RemoveModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
101
95
|
onClick: onRequestSubmit,
|
|
102
96
|
disabled: primaryButtonDisabled
|
|
103
97
|
}, primaryButtonText)));
|
|
104
|
-
});
|
|
98
|
+
});
|
|
105
99
|
|
|
100
|
+
// Return a placeholder if not released and not enabled by feature flag
|
|
106
101
|
RemoveModal = pkg.checkComponentEnabled(RemoveModal, componentName);
|
|
107
102
|
RemoveModal.propTypes = {
|
|
108
103
|
/**
|
|
109
104
|
* The content to be displayed in the body of the modal
|
|
110
105
|
*/
|
|
111
106
|
body: PropTypes.string.isRequired,
|
|
112
|
-
|
|
113
107
|
/**
|
|
114
108
|
* Optional classname
|
|
115
109
|
*/
|
|
116
110
|
className: PropTypes.string,
|
|
117
|
-
|
|
118
111
|
/**
|
|
119
112
|
* Provide a description for "close" icon that can be read by screen readers
|
|
120
113
|
*/
|
|
121
114
|
iconDescription: PropTypes.string.isRequired,
|
|
122
|
-
|
|
123
115
|
/**
|
|
124
116
|
* Message showed when user input fails validation
|
|
125
117
|
*/
|
|
126
118
|
inputInvalidText: PropTypes.string,
|
|
127
|
-
|
|
128
119
|
/**
|
|
129
120
|
* Label for text box
|
|
130
121
|
*/
|
|
131
122
|
inputLabelText: PropTypes.node,
|
|
132
|
-
|
|
133
123
|
/**
|
|
134
124
|
* Placeholder for text box
|
|
135
125
|
*/
|
|
136
126
|
inputPlaceholderText: PropTypes.string,
|
|
137
|
-
|
|
138
127
|
/**
|
|
139
128
|
* Specify the modal label texts
|
|
140
129
|
*/
|
|
141
130
|
label: PropTypes.string,
|
|
142
|
-
|
|
143
131
|
/**
|
|
144
132
|
* Callback function that runs when user closes the modal
|
|
145
133
|
*/
|
|
146
134
|
onClose: PropTypes.func,
|
|
147
|
-
|
|
148
135
|
/**
|
|
149
136
|
* Callback function that runs when user submits the modal
|
|
150
137
|
*/
|
|
151
138
|
onRequestSubmit: PropTypes.func,
|
|
152
|
-
|
|
153
139
|
/**
|
|
154
140
|
* Specify whether the Modal is currently open
|
|
155
141
|
*/
|
|
156
142
|
open: PropTypes.bool.isRequired,
|
|
157
|
-
|
|
158
143
|
/**
|
|
159
144
|
* Prevent closing on click outside of modal
|
|
160
145
|
*/
|
|
161
146
|
preventCloseOnClickOutside: PropTypes.bool,
|
|
162
|
-
|
|
163
147
|
/**
|
|
164
148
|
* Specify the text for the primary button
|
|
165
149
|
*/
|
|
166
150
|
primaryButtonText: PropTypes.string,
|
|
167
|
-
|
|
168
151
|
/**
|
|
169
152
|
* The name of the resource being acted upon
|
|
170
153
|
*/
|
|
171
154
|
resourceName: PropTypes.string.isRequired,
|
|
172
|
-
|
|
173
155
|
/**
|
|
174
156
|
* Specify the text for the secondary button
|
|
175
157
|
*/
|
|
176
158
|
secondaryButtonText: PropTypes.string,
|
|
177
|
-
|
|
178
159
|
/**
|
|
179
160
|
* Specify whether or not to show the text confirmation input
|
|
180
161
|
*/
|
|
181
162
|
textConfirmation: PropTypes.bool,
|
|
182
|
-
|
|
183
163
|
/**
|
|
184
164
|
* The text displayed at the top of the modal
|
|
185
165
|
*/
|