@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
|
@@ -1,51 +1,33 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.AboutModal = void 0;
|
|
11
|
-
|
|
12
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
-
|
|
14
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
-
|
|
16
11
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
|
-
|
|
18
12
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
19
|
-
|
|
20
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
21
|
-
|
|
22
14
|
var _reactResizeDetector = require("react-resize-detector");
|
|
23
|
-
|
|
24
15
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
25
|
-
|
|
26
16
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
27
|
-
|
|
28
17
|
var _settings = require("../../settings");
|
|
29
|
-
|
|
30
18
|
var _uuidv = _interopRequireDefault(require("../../global/js/utils/uuidv4"));
|
|
31
|
-
|
|
32
19
|
var _devtools = require("../../global/js/utils/devtools");
|
|
33
|
-
|
|
34
20
|
var _carbonComponentsReact = require("carbon-components-react");
|
|
35
|
-
|
|
36
21
|
var _excluded = ["additionalInfo", "className", "closeIconDescription", "content", "copyrightText", "legalText", "links", "logo", "onClose", "open", "title"];
|
|
37
|
-
|
|
38
22
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
39
|
-
|
|
40
23
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
41
|
-
|
|
42
24
|
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; }
|
|
43
|
-
|
|
44
25
|
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) { (0, _defineProperty2.default)(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; }
|
|
45
|
-
|
|
46
26
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
|
47
27
|
var blockClass = "".concat(_settings.pkg.prefix, "--about-modal");
|
|
48
|
-
var componentName = 'AboutModal';
|
|
28
|
+
var componentName = 'AboutModal';
|
|
29
|
+
|
|
30
|
+
// NOTE: the component SCSS is not imported here: it is rolled up separately.
|
|
49
31
|
|
|
50
32
|
/**
|
|
51
33
|
* The AboutModal component provides a way to communicate product information
|
|
@@ -54,48 +36,48 @@ var componentName = 'AboutModal'; // NOTE: the component SCSS is not imported he
|
|
|
54
36
|
* should be immediately apparent to the user, with a clear and obvious path
|
|
55
37
|
* to completion.
|
|
56
38
|
*/
|
|
57
|
-
|
|
58
39
|
var AboutModal = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
59
40
|
var additionalInfo = _ref.additionalInfo,
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
41
|
+
className = _ref.className,
|
|
42
|
+
closeIconDescription = _ref.closeIconDescription,
|
|
43
|
+
content = _ref.content,
|
|
44
|
+
copyrightText = _ref.copyrightText,
|
|
45
|
+
legalText = _ref.legalText,
|
|
46
|
+
links = _ref.links,
|
|
47
|
+
logo = _ref.logo,
|
|
48
|
+
onClose = _ref.onClose,
|
|
49
|
+
open = _ref.open,
|
|
50
|
+
title = _ref.title,
|
|
51
|
+
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
72
52
|
var _useState = (0, _react.useState)(true),
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
53
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
54
|
+
hasScrollingContent = _useState2[0],
|
|
55
|
+
setHasScrollingContent = _useState2[1];
|
|
77
56
|
var bodyRef = (0, _react.useRef)();
|
|
78
57
|
var contentRef = (0, _react.useRef)();
|
|
79
58
|
var contentId = (0, _uuidv.default)();
|
|
80
|
-
|
|
81
59
|
var handleResize = function handleResize() {
|
|
82
|
-
setHasScrollingContent(
|
|
83
|
-
|
|
60
|
+
setHasScrollingContent(
|
|
61
|
+
// if our scroll height exceeds the client height enable scrolling
|
|
62
|
+
bodyRef.current.clientHeight < (hasScrollingContent ?
|
|
63
|
+
// Carbon modal adds 32px bottom margin when scrolling content is enabled
|
|
84
64
|
bodyRef.current.scrollHeight - 32 : bodyRef.current.scrollHeight));
|
|
85
|
-
};
|
|
86
|
-
// as the parent of the current bodyRef element
|
|
87
|
-
|
|
65
|
+
};
|
|
88
66
|
|
|
67
|
+
// We can't add a ref directly to the ModalBody, so track it in a ref
|
|
68
|
+
// as the parent of the current bodyRef element
|
|
89
69
|
(0, _react.useEffect)(function () {
|
|
90
70
|
bodyRef.current = contentRef.current.parentElement;
|
|
91
|
-
}, [bodyRef]);
|
|
71
|
+
}, [bodyRef]);
|
|
92
72
|
|
|
73
|
+
// Detect resize of the ModalBody to recalculate whether scrolling is enabled
|
|
93
74
|
(0, _reactResizeDetector.useResizeDetector)({
|
|
94
75
|
onResize: handleResize,
|
|
95
76
|
targetRef: bodyRef
|
|
96
77
|
});
|
|
97
78
|
return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ComposedModal, (0, _extends2.default)({}, rest, {
|
|
98
|
-
className: (0, _classnames.default)(blockClass,
|
|
79
|
+
className: (0, _classnames.default)(blockClass,
|
|
80
|
+
// Apply the block class to the main HTML element
|
|
99
81
|
className, // Apply any supplied class names to the main HTML element.
|
|
100
82
|
(0, _defineProperty2.default)({}, "".concat(blockClass, "--with-tabs"), additionalInfo && additionalInfo.length > 1))
|
|
101
83
|
}, _objectSpread({
|
|
@@ -143,15 +125,16 @@ var AboutModal = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
143
125
|
key: i
|
|
144
126
|
}, tab.content);
|
|
145
127
|
})))));
|
|
146
|
-
});
|
|
147
|
-
|
|
128
|
+
});
|
|
148
129
|
|
|
130
|
+
// Return a placeholder if not released and not enabled by feature flag
|
|
149
131
|
exports.AboutModal = AboutModal;
|
|
150
132
|
exports.AboutModal = AboutModal = _settings.pkg.checkComponentEnabled(AboutModal, componentName);
|
|
151
|
-
AboutModal.displayName = componentName;
|
|
133
|
+
AboutModal.displayName = componentName;
|
|
134
|
+
|
|
135
|
+
// The types and DocGen commentary for the component props,
|
|
152
136
|
// in alphabetical order (for consistency).
|
|
153
137
|
// See https://www.npmjs.com/package/prop-types#usage.
|
|
154
|
-
|
|
155
138
|
AboutModal.propTypes = {
|
|
156
139
|
/**
|
|
157
140
|
* Additional information to be displayed in the footer. Can be used for
|
|
@@ -164,57 +147,47 @@ AboutModal.propTypes = {
|
|
|
164
147
|
label: _propTypes.default.string,
|
|
165
148
|
content: _propTypes.default.node
|
|
166
149
|
})),
|
|
167
|
-
|
|
168
150
|
/**
|
|
169
151
|
* Provide an optional class to be applied to the modal root node.
|
|
170
152
|
*/
|
|
171
153
|
className: _propTypes.default.string,
|
|
172
|
-
|
|
173
154
|
/**
|
|
174
155
|
* The accessibility title for the close icon.
|
|
175
156
|
*/
|
|
176
157
|
closeIconDescription: _propTypes.default.string.isRequired,
|
|
177
|
-
|
|
178
158
|
/**
|
|
179
159
|
* A summary that appears immediately beneath the title, and might
|
|
180
160
|
* include information such as: version name, server name,
|
|
181
161
|
* user name, user role, browser version, browser OS etc.
|
|
182
162
|
*/
|
|
183
163
|
content: _propTypes.default.node.isRequired,
|
|
184
|
-
|
|
185
164
|
/**
|
|
186
165
|
* Trademark and copyright information. Suggested format for copyright -
|
|
187
166
|
* "Copyright © 2018 Company".
|
|
188
167
|
*/
|
|
189
168
|
copyrightText: _propTypes.default.node,
|
|
190
|
-
|
|
191
169
|
/**
|
|
192
170
|
* Text providing legal information.
|
|
193
171
|
*/
|
|
194
172
|
legalText: _propTypes.default.node,
|
|
195
|
-
|
|
196
173
|
/**
|
|
197
174
|
* An array of Carbon `Link` components that contain links to additional
|
|
198
175
|
* information.
|
|
199
176
|
*/
|
|
200
177
|
links: _propTypes.default.arrayOf(_propTypes.default.element),
|
|
201
|
-
|
|
202
178
|
/**
|
|
203
179
|
* A visual symbol used to represent the product.
|
|
204
180
|
*/
|
|
205
181
|
logo: _propTypes.default.node.isRequired,
|
|
206
|
-
|
|
207
182
|
/**
|
|
208
183
|
* Specifies an optional handler which is called when the AboutModal
|
|
209
184
|
* is closed. Returning `false` prevents the AboutModal from closing.
|
|
210
185
|
*/
|
|
211
186
|
onClose: _propTypes.default.func,
|
|
212
|
-
|
|
213
187
|
/**
|
|
214
188
|
* Specifies whether the AboutModal is open or not.
|
|
215
189
|
*/
|
|
216
190
|
open: _propTypes.default.bool,
|
|
217
|
-
|
|
218
191
|
/**
|
|
219
192
|
* The title of the AboutModal is usually the product or service name.
|
|
220
193
|
*/
|
|
@@ -1,92 +1,68 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.ActionBar = void 0;
|
|
11
|
-
|
|
12
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
|
|
14
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
15
|
-
|
|
16
11
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
|
-
|
|
18
12
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
19
|
-
|
|
20
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
21
|
-
|
|
22
14
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
23
|
-
|
|
24
15
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
25
|
-
|
|
26
16
|
var _settings = require("../../settings");
|
|
27
|
-
|
|
28
17
|
var _reactResizeDetector = require("react-resize-detector");
|
|
29
|
-
|
|
30
18
|
var _carbonComponentsReact = require("carbon-components-react");
|
|
31
|
-
|
|
32
19
|
var _uuidv = _interopRequireDefault(require("../../global/js/utils/uuidv4"));
|
|
33
|
-
|
|
34
20
|
var _propsHelper = require("../../global/js/utils/props-helper");
|
|
35
|
-
|
|
36
21
|
var _ActionBarItem = require("./ActionBarItem");
|
|
37
|
-
|
|
38
22
|
var _ActionBarOverflowItems = require("./ActionBarOverflowItems");
|
|
39
|
-
|
|
40
23
|
var _excluded = ["actions", "className", "maxVisible", "menuOptionsClass", "onWidthChange", "overflowAriaLabel", "rightAlign"],
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
24
|
+
_excluded2 = ["key", "id"],
|
|
25
|
+
_excluded3 = ["key"];
|
|
44
26
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
45
|
-
|
|
46
27
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
47
|
-
|
|
48
28
|
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; }
|
|
49
|
-
|
|
50
29
|
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) { (0, _defineProperty2.default)(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; }
|
|
51
|
-
|
|
52
30
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
|
53
31
|
var blockClass = "".concat(_settings.pkg.prefix, "--action-bar");
|
|
54
|
-
var componentName = 'ActionBar';
|
|
32
|
+
var componentName = 'ActionBar';
|
|
33
|
+
|
|
34
|
+
// NOTE: the component SCSS is not imported here: it is rolled up separately.
|
|
55
35
|
|
|
56
36
|
/**
|
|
57
37
|
* The ActionBar is used internally by the PageHeader to wrap ActionBarItems.
|
|
58
38
|
*/
|
|
59
|
-
|
|
60
39
|
var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
61
40
|
var actions = _ref.actions,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
41
|
+
className = _ref.className,
|
|
42
|
+
maxVisible = _ref.maxVisible,
|
|
43
|
+
menuOptionsClass = _ref.menuOptionsClass,
|
|
44
|
+
onWidthChange = _ref.onWidthChange,
|
|
45
|
+
overflowAriaLabel = _ref.overflowAriaLabel,
|
|
46
|
+
rightAlign = _ref.rightAlign,
|
|
47
|
+
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
70
48
|
var _useState = (0, _react.useState)(0),
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
49
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
50
|
+
displayCount = _useState2[0],
|
|
51
|
+
setDisplayCount = _useState2[1];
|
|
75
52
|
var _useState3 = (0, _react.useState)([]),
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
53
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
54
|
+
displayedItems = _useState4[0],
|
|
55
|
+
setDisplayedItems = _useState4[1];
|
|
80
56
|
var _useState5 = (0, _react.useState)([]),
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
57
|
+
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
58
|
+
hiddenSizingItems = _useState6[0],
|
|
59
|
+
setHiddenSizingItems = _useState6[1];
|
|
85
60
|
var internalId = (0, _react.useRef)((0, _uuidv.default)());
|
|
86
61
|
var refDisplayedItems = (0, _react.useRef)(null);
|
|
87
62
|
var sizingRef = (0, _react.useRef)(null);
|
|
88
|
-
var sizes = (0, _react.useRef)({});
|
|
63
|
+
var sizes = (0, _react.useRef)({});
|
|
89
64
|
|
|
65
|
+
// create hidden sizing items
|
|
90
66
|
(0, _react.useEffect)(function () {
|
|
91
67
|
// Hidden action bar and items used to calculate sizes
|
|
92
68
|
setHiddenSizingItems( /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -102,8 +78,8 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
102
78
|
key: "hidden-overflow-menu"
|
|
103
79
|
}), actions.map(function (_ref2) {
|
|
104
80
|
var key = _ref2.key,
|
|
105
|
-
|
|
106
|
-
|
|
81
|
+
id = _ref2.id,
|
|
82
|
+
rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
|
|
107
83
|
return /*#__PURE__*/_react.default.createElement(_ActionBarItem.ActionBarItem, (0, _extends2.default)({}, rest, {
|
|
108
84
|
// ensure id is not duplicated
|
|
109
85
|
"data-original-id": id,
|
|
@@ -111,20 +87,23 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
111
87
|
className: "".concat(blockClass, "__hidden-sizing-item")
|
|
112
88
|
}));
|
|
113
89
|
}))));
|
|
114
|
-
}, [actions]);
|
|
90
|
+
}, [actions]);
|
|
115
91
|
|
|
92
|
+
// creates displayed items based on actions, displayCount and alignment
|
|
116
93
|
(0, _react.useEffect)(function () {
|
|
117
94
|
// Calculate the displayed items
|
|
118
95
|
var newDisplayedItems = actions.map(function (_ref3) {
|
|
119
96
|
var key = _ref3.key,
|
|
120
|
-
|
|
97
|
+
rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded3);
|
|
121
98
|
return /*#__PURE__*/_react.default.createElement(_ActionBarItem.ActionBarItem, (0, _extends2.default)({}, rest, {
|
|
122
99
|
key: key
|
|
123
100
|
}));
|
|
124
|
-
});
|
|
101
|
+
});
|
|
125
102
|
|
|
126
|
-
|
|
103
|
+
// extract any there is not enough room for into newOverflowItems
|
|
104
|
+
var newOverflowItems = newDisplayedItems.splice(displayCount);
|
|
127
105
|
|
|
106
|
+
// add overflow menu if needed
|
|
128
107
|
if (newOverflowItems.length) {
|
|
129
108
|
newDisplayedItems.push( /*#__PURE__*/_react.default.createElement(_ActionBarOverflowItems.ActionBarOverflowItems, {
|
|
130
109
|
menuOptionsClass: menuOptionsClass,
|
|
@@ -133,53 +112,55 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
133
112
|
key: "overflow-menu-".concat(internalId.current)
|
|
134
113
|
}));
|
|
135
114
|
}
|
|
136
|
-
|
|
137
115
|
setDisplayedItems(newDisplayedItems);
|
|
138
|
-
}, [actions, displayCount, overflowAriaLabel, menuOptionsClass]);
|
|
116
|
+
}, [actions, displayCount, overflowAriaLabel, menuOptionsClass]);
|
|
139
117
|
|
|
118
|
+
// determine display count based on space available and width of pageActions
|
|
140
119
|
var checkFullyVisibleItems = function checkFullyVisibleItems() {
|
|
141
120
|
/* istanbul ignore if */
|
|
142
121
|
if (sizingRef.current) {
|
|
143
|
-
var sizingItems = Array.from(sizingRef.current.querySelectorAll(".".concat(blockClass, "__hidden-sizing-item")));
|
|
122
|
+
var sizingItems = Array.from(sizingRef.current.querySelectorAll(".".concat(blockClass, "__hidden-sizing-item")));
|
|
144
123
|
|
|
145
|
-
|
|
124
|
+
// first item is always the overflow even if nothing else is rendered
|
|
125
|
+
var overflowItem = sizingItems.shift();
|
|
146
126
|
|
|
127
|
+
// determine how many will fit
|
|
147
128
|
var spaceAvailable = refDisplayedItems.current.offsetWidth;
|
|
148
129
|
var willFit = 0;
|
|
149
130
|
var maxVisibleWidth = 0;
|
|
150
|
-
var fitLimit = maxVisible ? Math.min(maxVisible, sizingItems.length) : sizingItems.length;
|
|
131
|
+
var fitLimit = maxVisible ? Math.min(maxVisible, sizingItems.length) : sizingItems.length;
|
|
151
132
|
|
|
133
|
+
// loop checking the space available
|
|
152
134
|
for (var i = 0; i < fitLimit; i++) {
|
|
153
|
-
var newSpaceAvailable = spaceAvailable - sizingItems[i].offsetWidth;
|
|
135
|
+
var newSpaceAvailable = spaceAvailable - sizingItems[i].offsetWidth;
|
|
154
136
|
|
|
137
|
+
// update maxVisibleWidth for later use by onWidthChange
|
|
155
138
|
maxVisibleWidth += sizingItems[i].offsetWidth;
|
|
156
|
-
|
|
157
139
|
if (newSpaceAvailable >= 0) {
|
|
158
140
|
spaceAvailable = newSpaceAvailable;
|
|
159
141
|
willFit += 1;
|
|
160
142
|
}
|
|
161
|
-
}
|
|
162
|
-
|
|
143
|
+
}
|
|
163
144
|
|
|
145
|
+
// if not enough space for all items then make room for the overflow
|
|
164
146
|
var overflowWidth = overflowItem.offsetWidth;
|
|
165
|
-
|
|
166
147
|
if (willFit < sizingItems.length) {
|
|
167
148
|
// Check space for overflow
|
|
168
149
|
while (willFit > 0 && spaceAvailable < overflowWidth) {
|
|
169
|
-
willFit -= 1;
|
|
170
|
-
// Make sure by removing items in reverse order
|
|
150
|
+
willFit -= 1;
|
|
171
151
|
|
|
152
|
+
// Highly unlikely that any action bar item is narrower than the overflow item
|
|
153
|
+
|
|
154
|
+
// Make sure by removing items in reverse order
|
|
172
155
|
spaceAvailable += sizingItems[willFit].offsetWidth;
|
|
173
156
|
}
|
|
174
157
|
}
|
|
175
|
-
|
|
176
158
|
if (onWidthChange && (sizes.current.minWidth !== overflowWidth || sizes.current.maxWidth !== maxVisibleWidth)) {
|
|
177
159
|
sizes.current.minWidth = overflowWidth;
|
|
178
|
-
sizes.current.maxWidth = maxVisibleWidth;
|
|
179
|
-
|
|
160
|
+
sizes.current.maxWidth = maxVisibleWidth;
|
|
161
|
+
// emit onWidthChange
|
|
180
162
|
onWidthChange(_objectSpread({}, sizes.current));
|
|
181
163
|
}
|
|
182
|
-
|
|
183
164
|
if (willFit < 1) {
|
|
184
165
|
setDisplayCount(0);
|
|
185
166
|
} else {
|
|
@@ -187,44 +168,34 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
187
168
|
}
|
|
188
169
|
}
|
|
189
170
|
};
|
|
190
|
-
|
|
191
171
|
(0, _react.useEffect)(function () {
|
|
192
|
-
checkFullyVisibleItems();
|
|
172
|
+
checkFullyVisibleItems();
|
|
173
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
193
174
|
}, [maxVisible, hiddenSizingItems]);
|
|
194
|
-
/* istanbul ignore next */
|
|
195
|
-
// not sure how to fake window resize
|
|
196
175
|
|
|
176
|
+
/* istanbul ignore next */ // not sure how to fake window resize
|
|
197
177
|
var handleResize = function handleResize() {
|
|
198
178
|
// width is the space available for all action bar items horizontally
|
|
199
179
|
// the action bar items are squares so the height should be one item wide
|
|
200
|
-
|
|
201
|
-
/* istanbul ignore next */
|
|
202
|
-
// not sure how to fake window resize
|
|
180
|
+
/* istanbul ignore next */ // not sure how to fake window resize
|
|
203
181
|
checkFullyVisibleItems();
|
|
204
182
|
};
|
|
205
|
-
/* istanbul ignore next */
|
|
206
|
-
// not sure how to fake window resize
|
|
207
|
-
|
|
208
183
|
|
|
184
|
+
/* istanbul ignore next */ // not sure how to fake window resize
|
|
209
185
|
var handleActionBarItemsResize = function handleActionBarItemsResize() {
|
|
210
186
|
// when the hidden sizing items change size
|
|
211
|
-
|
|
212
|
-
/* istanbul ignore next */
|
|
213
|
-
// not sure how to fake window resize
|
|
187
|
+
/* istanbul ignore next */ // not sure how to fake window resize
|
|
214
188
|
checkFullyVisibleItems();
|
|
215
189
|
};
|
|
216
|
-
|
|
217
190
|
(0, _reactResizeDetector.useResizeDetector)({
|
|
218
191
|
onResize: handleActionBarItemsResize,
|
|
219
192
|
targetRef: sizingRef
|
|
220
193
|
});
|
|
221
|
-
|
|
222
194
|
var _useResizeDetector = (0, _reactResizeDetector.useResizeDetector)({
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
195
|
+
onResize: handleResize,
|
|
196
|
+
targetRef: ref
|
|
197
|
+
}),
|
|
198
|
+
outerRef = _useResizeDetector.ref;
|
|
228
199
|
return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, rest, {
|
|
229
200
|
className: (0, _classnames.default)([blockClass, className]),
|
|
230
201
|
ref: outerRef
|
|
@@ -233,7 +204,6 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
233
204
|
className: (0, _classnames.default)(["".concat(blockClass, "__displayed-items"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__displayed-items--right"), rightAlign)])
|
|
234
205
|
}, displayedItems));
|
|
235
206
|
});
|
|
236
|
-
|
|
237
207
|
exports.ActionBar = ActionBar;
|
|
238
208
|
ActionBar.displayName = componentName;
|
|
239
209
|
ActionBar.propTypes = {
|
|
@@ -252,7 +222,8 @@ ActionBar.propTypes = {
|
|
|
252
222
|
*
|
|
253
223
|
* Carbon Button API https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
|
|
254
224
|
*/
|
|
255
|
-
actions: _propTypes.default.arrayOf(_propTypes.default.shape(_objectSpread(_objectSpread({}, (0, _propsHelper.prepareProps)(_carbonComponentsReact.Button.propTypes, [
|
|
225
|
+
actions: _propTypes.default.arrayOf(_propTypes.default.shape(_objectSpread(_objectSpread({}, (0, _propsHelper.prepareProps)(_carbonComponentsReact.Button.propTypes, [
|
|
226
|
+
// props not desired from Button.propTypes
|
|
256
227
|
'kind', 'size', 'tooltipPosition', 'tooltipAlignment'])), {}, {
|
|
257
228
|
// Additional props
|
|
258
229
|
key: _propTypes.default.string.isRequired,
|
|
@@ -263,32 +234,26 @@ ActionBar.propTypes = {
|
|
|
263
234
|
onClick: _propTypes.default.func
|
|
264
235
|
}))),
|
|
265
236
|
// expects action bar item as array or in fragment,
|
|
266
|
-
|
|
267
237
|
/**
|
|
268
238
|
* className
|
|
269
239
|
*/
|
|
270
240
|
className: _propTypes.default.string,
|
|
271
|
-
|
|
272
241
|
/**
|
|
273
242
|
* maxVisible : Maximum action bar items visible before going into the overflow menu
|
|
274
243
|
*/
|
|
275
244
|
maxVisible: _propTypes.default.number,
|
|
276
|
-
|
|
277
245
|
/**
|
|
278
246
|
* class name applied to the overflow options
|
|
279
247
|
*/
|
|
280
248
|
menuOptionsClass: _propTypes.default.string,
|
|
281
|
-
|
|
282
249
|
/**
|
|
283
250
|
* onItemCountChange - event reporting maxWidth
|
|
284
251
|
*/
|
|
285
252
|
onWidthChange: _propTypes.default.func,
|
|
286
|
-
|
|
287
253
|
/**
|
|
288
254
|
* overflowAriaLabel label for open close button overflow used for action bar items that do nto fit.
|
|
289
255
|
*/
|
|
290
256
|
overflowAriaLabel: _propTypes.default.string.isRequired,
|
|
291
|
-
|
|
292
257
|
/**
|
|
293
258
|
* align tags to right of available space
|
|
294
259
|
*/
|
|
@@ -1,43 +1,32 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.ActionBarItem = void 0;
|
|
9
|
-
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
|
|
12
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireDefault(require("react"));
|
|
15
|
-
|
|
16
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
17
|
-
|
|
18
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
19
|
-
|
|
20
13
|
var _settings = require("../../settings");
|
|
21
|
-
|
|
22
14
|
var _carbonComponentsReact = require("carbon-components-react");
|
|
23
|
-
|
|
24
15
|
var _excluded = ["className"];
|
|
25
|
-
|
|
26
16
|
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; }
|
|
27
|
-
|
|
28
17
|
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) { (0, _defineProperty2.default)(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; }
|
|
29
|
-
|
|
30
18
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
|
31
19
|
var componentName = 'ActionBarItem';
|
|
32
|
-
var blockClass = "".concat(_settings.pkg.prefix, "--action-bar-item");
|
|
20
|
+
var blockClass = "".concat(_settings.pkg.prefix, "--action-bar-item");
|
|
21
|
+
|
|
22
|
+
// NOTE: the component SCSS is not imported here: it is rolled up separately.
|
|
33
23
|
|
|
34
24
|
/**
|
|
35
25
|
* The ActionBarItem is used in the page header to populate the action bar
|
|
36
26
|
*/
|
|
37
|
-
|
|
38
27
|
var ActionBarItem = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
39
28
|
var className = _ref.className,
|
|
40
|
-
|
|
29
|
+
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
41
30
|
return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, _objectSpread(_objectSpread({}, rest), {}, {
|
|
42
31
|
ref: ref,
|
|
43
32
|
className: (0, _classnames.default)(blockClass, className),
|
|
@@ -48,17 +37,18 @@ var ActionBarItem = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
|
|
|
48
37
|
tooltipAlignment: 'end',
|
|
49
38
|
type: 'button'
|
|
50
39
|
}));
|
|
51
|
-
});
|
|
52
|
-
|
|
40
|
+
});
|
|
53
41
|
|
|
42
|
+
// Return a placeholder if not released and not enabled by feature flag
|
|
54
43
|
exports.ActionBarItem = ActionBarItem;
|
|
55
|
-
exports.ActionBarItem = ActionBarItem = _settings.pkg.checkComponentEnabled(ActionBarItem, componentName);
|
|
56
|
-
|
|
57
|
-
var reservedProps = ['hasIconOnly', 'kind', 'size', 'tooltipPosition', 'tooltipAlignment', 'type']; // Base props on Carbon Button
|
|
58
|
-
|
|
59
|
-
var propTypes = _objectSpread({}, _carbonComponentsReact.Button.propTypes); // Remove reserved props
|
|
44
|
+
exports.ActionBarItem = ActionBarItem = _settings.pkg.checkComponentEnabled(ActionBarItem, componentName);
|
|
60
45
|
|
|
46
|
+
// Props the user cannot change
|
|
47
|
+
var reservedProps = ['hasIconOnly', 'kind', 'size', 'tooltipPosition', 'tooltipAlignment', 'type'];
|
|
48
|
+
// Base props on Carbon Button
|
|
49
|
+
var propTypes = _objectSpread({}, _carbonComponentsReact.Button.propTypes);
|
|
61
50
|
|
|
51
|
+
// Remove reserved props
|
|
62
52
|
reservedProps.forEach(function (prop) {
|
|
63
53
|
delete propTypes[prop];
|
|
64
54
|
});
|
|
@@ -70,14 +60,12 @@ ActionBarItem.propTypes = _objectSpread(_objectSpread({}, propTypes), {}, {
|
|
|
70
60
|
/ Some or all of them may be inherited from the underlying Carbon component.
|
|
71
61
|
/
|
|
72
62
|
/ ****************************************/
|
|
73
|
-
|
|
74
63
|
/**
|
|
75
64
|
* Specify an optional className to be added to your Button
|
|
76
65
|
*
|
|
77
66
|
* (inherited from Carbon Button)
|
|
78
67
|
*/
|
|
79
68
|
className: _propTypes.default.string,
|
|
80
|
-
|
|
81
69
|
/**
|
|
82
70
|
* If specifying the `renderIcon` prop, provide a description for that icon that can
|
|
83
71
|
* be read by screen readers
|
|
@@ -85,14 +73,12 @@ ActionBarItem.propTypes = _objectSpread(_objectSpread({}, propTypes), {}, {
|
|
|
85
73
|
* (inherited from Carbon Button)
|
|
86
74
|
*/
|
|
87
75
|
iconDescription: _propTypes.default.string,
|
|
88
|
-
|
|
89
76
|
/**
|
|
90
77
|
* Optional click handler
|
|
91
78
|
*
|
|
92
79
|
* (inherited from Carbon Button)
|
|
93
80
|
*/
|
|
94
81
|
onClick: _propTypes.default.func,
|
|
95
|
-
|
|
96
82
|
/**
|
|
97
83
|
* Optional prop to allow overriding the icon rendering.
|
|
98
84
|
* Can be a React component class
|