@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
|
@@ -19,22 +19,18 @@ SingleAddSelect.propTypes = {
|
|
|
19
19
|
* optional class name
|
|
20
20
|
*/
|
|
21
21
|
className: PropTypes.string,
|
|
22
|
-
|
|
23
22
|
/**
|
|
24
23
|
* text description that appears under the title
|
|
25
24
|
*/
|
|
26
25
|
description: PropTypes.string,
|
|
27
|
-
|
|
28
26
|
/**
|
|
29
27
|
* label for global search input
|
|
30
28
|
*/
|
|
31
29
|
globalSearchLabel: PropTypes.string,
|
|
32
|
-
|
|
33
30
|
/**
|
|
34
31
|
* placeholder for global search input
|
|
35
32
|
*/
|
|
36
33
|
globalSearchPlaceholder: PropTypes.string,
|
|
37
|
-
|
|
38
34
|
/**
|
|
39
35
|
* object that contains the item data. for more information reference the
|
|
40
36
|
* "Structuring items" section in the docs tab
|
|
@@ -47,52 +43,42 @@ SingleAddSelect.propTypes = {
|
|
|
47
43
|
value: PropTypes.string.isRequired
|
|
48
44
|
}))
|
|
49
45
|
}),
|
|
50
|
-
|
|
51
46
|
/**
|
|
52
47
|
* label that display above the list of items
|
|
53
48
|
*/
|
|
54
49
|
itemsLabel: PropTypes.string,
|
|
55
|
-
|
|
56
50
|
/**
|
|
57
51
|
* text to display when no results are found from the global search
|
|
58
52
|
*/
|
|
59
53
|
noResultsDescription: PropTypes.string,
|
|
60
|
-
|
|
61
54
|
/**
|
|
62
55
|
* title to display when no results are found from the global search
|
|
63
56
|
*/
|
|
64
57
|
noResultsTitle: PropTypes.string,
|
|
65
|
-
|
|
66
58
|
/**
|
|
67
59
|
* function to call when the close button clicked
|
|
68
60
|
*/
|
|
69
61
|
onClose: PropTypes.func,
|
|
70
|
-
|
|
71
62
|
/**
|
|
72
63
|
* text for close button
|
|
73
64
|
*/
|
|
74
65
|
onCloseButtonText: PropTypes.string,
|
|
75
|
-
|
|
76
66
|
/**
|
|
77
67
|
* function to call when the submit button is clicked. returns a selection
|
|
78
68
|
*/
|
|
79
69
|
onSubmit: PropTypes.func,
|
|
80
|
-
|
|
81
70
|
/**
|
|
82
71
|
* text for the submit button
|
|
83
72
|
*/
|
|
84
73
|
onSubmitButtonText: PropTypes.string,
|
|
85
|
-
|
|
86
74
|
/**
|
|
87
75
|
* specifies if the component is open or not
|
|
88
76
|
*/
|
|
89
77
|
open: PropTypes.bool,
|
|
90
|
-
|
|
91
78
|
/**
|
|
92
79
|
* text that displays when displaying filtered items
|
|
93
80
|
*/
|
|
94
81
|
searchResultsLabel: PropTypes.string,
|
|
95
|
-
|
|
96
82
|
/**
|
|
97
83
|
* header text
|
|
98
84
|
*/
|
|
@@ -2,7 +2,6 @@ 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 = ["kind", "theme", "size", "className", "iconDescription"];
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* Copyright IBM Corp. 2021, 2021
|
|
8
7
|
*
|
|
@@ -87,14 +86,12 @@ var blockClass = "".concat(pkg.prefix, "--status-icon");
|
|
|
87
86
|
var componentName = 'StatusIcon';
|
|
88
87
|
export var StatusIcon = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
89
88
|
var _icons$kind;
|
|
90
|
-
|
|
91
89
|
var kind = _ref.kind,
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
90
|
+
theme = _ref.theme,
|
|
91
|
+
size = _ref.size,
|
|
92
|
+
className = _ref.className,
|
|
93
|
+
iconDescription = _ref.iconDescription,
|
|
94
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
98
95
|
var IconComponent = (_icons$kind = icons[kind]) === null || _icons$kind === void 0 ? void 0 : _icons$kind[size];
|
|
99
96
|
var classNames = cx(className, blockClass, "".concat(blockClass, "--").concat(theme), _defineProperty({}, "".concat(blockClass, "--").concat(theme, "-").concat(kind), kind));
|
|
100
97
|
return IconComponent && /*#__PURE__*/React.createElement(IconComponent, _extends({}, rest, {
|
|
@@ -109,22 +106,18 @@ StatusIcon.propTypes = {
|
|
|
109
106
|
* Provide an optional class to be applied to the modal root node.
|
|
110
107
|
*/
|
|
111
108
|
className: PropTypes.string,
|
|
112
|
-
|
|
113
109
|
/**
|
|
114
110
|
* A required prop that provides a title element and tooltip for the icon for accessibility purposes
|
|
115
111
|
*/
|
|
116
112
|
iconDescription: PropTypes.string.isRequired,
|
|
117
|
-
|
|
118
113
|
/**
|
|
119
114
|
* A required prop that displays the respective icon associated with the status
|
|
120
115
|
*/
|
|
121
116
|
kind: PropTypes.oneOf(['fatal', 'critical', 'major-warning', 'minor-warning', 'undefined', 'unknown', 'normal', 'info', 'in-progress', 'running', 'pending']).isRequired,
|
|
122
|
-
|
|
123
117
|
/**
|
|
124
118
|
* A required prop that displays the size of the icon associate with the status
|
|
125
119
|
*/
|
|
126
120
|
size: PropTypes.oneOf(['sm', 'md', 'lg', 'xlg']).isRequired,
|
|
127
|
-
|
|
128
121
|
/**
|
|
129
122
|
* A required prop that displays the theme of the icon associated with the status
|
|
130
123
|
*/
|
|
@@ -3,19 +3,17 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAlign", "overflowClassName", "overflowDirection", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags"],
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
_excluded2 = ["label", "id"],
|
|
7
|
+
_excluded3 = ["label"];
|
|
9
8
|
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; }
|
|
10
|
-
|
|
11
9
|
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; }
|
|
12
|
-
|
|
13
10
|
//
|
|
14
11
|
// Copyright IBM Corp. 2020, 2021
|
|
15
12
|
//
|
|
16
13
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
17
14
|
// LICENSE file in the root directory of this source tree.
|
|
18
15
|
//
|
|
16
|
+
|
|
19
17
|
import React, { useState, useEffect, useRef, useCallback } from 'react';
|
|
20
18
|
import { createPortal } from 'react-dom';
|
|
21
19
|
import PropTypes from 'prop-types';
|
|
@@ -29,8 +27,9 @@ import { prepareProps, isRequiredIf } from '../../global/js/utils/props-helper';
|
|
|
29
27
|
import { pkg } from '../../settings';
|
|
30
28
|
var componentName = 'TagSet';
|
|
31
29
|
var blockClass = "".concat(pkg.prefix, "--tag-set");
|
|
32
|
-
var allTagsModalSearchThreshold = 10;
|
|
30
|
+
var allTagsModalSearchThreshold = 10;
|
|
33
31
|
|
|
32
|
+
// Default values for props
|
|
34
33
|
var defaults = {
|
|
35
34
|
align: 'start',
|
|
36
35
|
// allTagsModalTarget: document.body,
|
|
@@ -39,64 +38,54 @@ var defaults = {
|
|
|
39
38
|
};
|
|
40
39
|
export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
41
40
|
var _ref$align = _ref.align,
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
41
|
+
align = _ref$align === void 0 ? defaults.align : _ref$align,
|
|
42
|
+
allTagsModalTargetIn = _ref.allTagsModalTarget,
|
|
43
|
+
className = _ref.className,
|
|
44
|
+
maxVisible = _ref.maxVisible,
|
|
45
|
+
multiline = _ref.multiline,
|
|
46
|
+
_ref$overflowAlign = _ref.overflowAlign,
|
|
47
|
+
overflowAlign = _ref$overflowAlign === void 0 ? defaults.overflowAlign : _ref$overflowAlign,
|
|
48
|
+
overflowClassName = _ref.overflowClassName,
|
|
49
|
+
_ref$overflowDirectio = _ref.overflowDirection,
|
|
50
|
+
overflowDirection = _ref$overflowDirectio === void 0 ? defaults.overflowDirection : _ref$overflowDirectio,
|
|
51
|
+
allTagsModalTitle = _ref.allTagsModalTitle,
|
|
52
|
+
allTagsModalSearchLabel = _ref.allTagsModalSearchLabel,
|
|
53
|
+
allTagsModalSearchPlaceholderText = _ref.allTagsModalSearchPlaceholderText,
|
|
54
|
+
showAllTagsLabel = _ref.showAllTagsLabel,
|
|
55
|
+
tags = _ref.tags,
|
|
56
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
59
57
|
var _useState = useState(3),
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
58
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
59
|
+
displayCount = _useState2[0],
|
|
60
|
+
setDisplayCount = _useState2[1];
|
|
64
61
|
var _useState3 = useState([]),
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
62
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
63
|
+
displayedTags = _useState4[0],
|
|
64
|
+
setDisplayedTags = _useState4[1];
|
|
69
65
|
var _useState5 = useState([]),
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
66
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
67
|
+
hiddenSizingTags = _useState6[0],
|
|
68
|
+
setHiddenSizingTags = _useState6[1];
|
|
74
69
|
var _useState7 = useState(false),
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
70
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
71
|
+
showAllModalOpen = _useState8[0],
|
|
72
|
+
setShowAllModalOpen = _useState8[1];
|
|
79
73
|
var localTagSetRef = useRef(null);
|
|
80
74
|
var tagSetRef = ref || localTagSetRef;
|
|
81
75
|
var sizingContainerRef = useRef();
|
|
82
76
|
var displayedArea = useRef(null);
|
|
83
|
-
|
|
84
77
|
var _useState9 = useState([]),
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
78
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
79
|
+
sizingTags = _useState10[0],
|
|
80
|
+
setSizingTags = _useState10[1];
|
|
89
81
|
var overflowTag = useRef(null);
|
|
90
|
-
|
|
91
82
|
var _useState11 = useState(null),
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
83
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
84
|
+
allTagsModalTarget = _useState12[0],
|
|
85
|
+
setAllTagsModalTarget = _useState12[1];
|
|
96
86
|
var handleShowAllClick = function handleShowAllClick() {
|
|
97
87
|
setShowAllModalOpen(true);
|
|
98
88
|
};
|
|
99
|
-
|
|
100
89
|
useEffect(function () {
|
|
101
90
|
if (allTagsModalTargetIn) {
|
|
102
91
|
setAllTagsModalTarget(allTagsModalTargetIn);
|
|
@@ -107,13 +96,12 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
107
96
|
}
|
|
108
97
|
}, [allTagsModalTargetIn]);
|
|
109
98
|
useEffect(function () {
|
|
110
|
-
var newSizingTags = [];
|
|
111
|
-
|
|
99
|
+
var newSizingTags = [];
|
|
100
|
+
// create sizing tags
|
|
112
101
|
setHiddenSizingTags(tags && tags.length > 0 ? tags.map(function (_ref2, index) {
|
|
113
102
|
var label = _ref2.label,
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
103
|
+
id = _ref2.id,
|
|
104
|
+
other = _objectWithoutProperties(_ref2, _excluded2);
|
|
117
105
|
return /*#__PURE__*/React.createElement("div", {
|
|
118
106
|
key: index,
|
|
119
107
|
className: "".concat(blockClass, "__sizing-tag"),
|
|
@@ -132,16 +120,17 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
132
120
|
// create visible and overflow tags
|
|
133
121
|
var newDisplayedTags = tags && tags.length > 0 ? tags.map(function (_ref3, index) {
|
|
134
122
|
var label = _ref3.label,
|
|
135
|
-
|
|
136
|
-
|
|
123
|
+
other = _objectWithoutProperties(_ref3, _excluded3);
|
|
137
124
|
return /*#__PURE__*/React.createElement(Tag, _extends({}, other, {
|
|
138
125
|
filter: false,
|
|
139
126
|
key: "displayed-tag-".concat(index)
|
|
140
127
|
}), label);
|
|
141
|
-
}) : [];
|
|
128
|
+
}) : [];
|
|
142
129
|
|
|
143
|
-
|
|
130
|
+
// separate out tags for the overflow
|
|
131
|
+
var newOverflowTags = newDisplayedTags.splice(displayCount, newDisplayedTags.length - displayCount);
|
|
144
132
|
|
|
133
|
+
// add wrapper around displayed tags
|
|
145
134
|
newDisplayedTags = newDisplayedTags.map(function (tag, index) {
|
|
146
135
|
return /*#__PURE__*/React.createElement("div", {
|
|
147
136
|
key: index,
|
|
@@ -164,17 +153,14 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
164
153
|
var checkFullyVisibleTags = useCallback(function () {
|
|
165
154
|
if (multiline) {
|
|
166
155
|
return setDisplayCount(maxVisible);
|
|
167
|
-
}
|
|
168
|
-
|
|
156
|
+
}
|
|
169
157
|
|
|
158
|
+
// how many will fit?
|
|
170
159
|
var willFit = 0;
|
|
171
|
-
|
|
172
160
|
if (sizingTags.length > 0) {
|
|
173
161
|
var spaceAvailable = tagSetRef.current.offsetWidth;
|
|
174
|
-
|
|
175
162
|
for (var i in sizingTags) {
|
|
176
163
|
var tagWidth = sizingTags[i].offsetWidth;
|
|
177
|
-
|
|
178
164
|
if (spaceAvailable >= tagWidth) {
|
|
179
165
|
spaceAvailable -= tagWidth;
|
|
180
166
|
willFit += 1;
|
|
@@ -182,17 +168,14 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
182
168
|
break;
|
|
183
169
|
}
|
|
184
170
|
}
|
|
185
|
-
|
|
186
171
|
if (willFit < sizingTags.length) {
|
|
187
172
|
while (willFit > 0 && spaceAvailable < overflowTag.current.offsetWidth) {
|
|
188
173
|
// Highly unlikely any useful tag is smaller
|
|
189
174
|
willFit -= 1; // remove one tag
|
|
190
|
-
|
|
191
175
|
spaceAvailable += sizingTags[willFit].offsetWidth;
|
|
192
176
|
}
|
|
193
177
|
}
|
|
194
178
|
}
|
|
195
|
-
|
|
196
179
|
if (willFit < 1) {
|
|
197
180
|
setDisplayCount(0);
|
|
198
181
|
} else {
|
|
@@ -202,30 +185,23 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
202
185
|
useEffect(function () {
|
|
203
186
|
checkFullyVisibleTags();
|
|
204
187
|
}, [checkFullyVisibleTags, maxVisible, multiline, sizingTags]);
|
|
205
|
-
/* don't know how to test resize */
|
|
206
188
|
|
|
189
|
+
/* don't know how to test resize */
|
|
207
190
|
/* istanbul ignore next */
|
|
208
|
-
|
|
209
191
|
var handleResize = function handleResize() {
|
|
210
|
-
/* istanbul ignore next */
|
|
211
|
-
// not sure how to test resize
|
|
192
|
+
/* istanbul ignore next */ // not sure how to test resize
|
|
212
193
|
checkFullyVisibleTags();
|
|
213
194
|
};
|
|
214
|
-
/* don't know how to test resize */
|
|
215
195
|
|
|
196
|
+
/* don't know how to test resize */
|
|
216
197
|
/* istanbul ignore next */
|
|
217
|
-
|
|
218
|
-
|
|
219
198
|
var handleSizerTagsResize = function handleSizerTagsResize() {
|
|
220
|
-
/* istanbul ignore next */
|
|
221
|
-
// not sure how to test resize
|
|
199
|
+
/* istanbul ignore next */ // not sure how to test resize
|
|
222
200
|
checkFullyVisibleTags();
|
|
223
201
|
};
|
|
224
|
-
|
|
225
202
|
var handleModalClose = function handleModalClose() {
|
|
226
203
|
setShowAllModalOpen(false);
|
|
227
204
|
};
|
|
228
|
-
|
|
229
205
|
useResizeDetector({
|
|
230
206
|
onResize: handleSizerTagsResize,
|
|
231
207
|
targetRef: sizingContainerRef
|
|
@@ -256,19 +232,21 @@ export var TagSet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
256
232
|
searchLabel: allTagsModalSearchLabel,
|
|
257
233
|
searchPlaceholder: allTagsModalSearchPlaceholderText
|
|
258
234
|
}), allTagsModalTarget));
|
|
259
|
-
});
|
|
235
|
+
});
|
|
260
236
|
|
|
237
|
+
// Return a placeholder if not released and not enabled by feature flag
|
|
261
238
|
TagSet = pkg.checkComponentEnabled(TagSet, componentName);
|
|
239
|
+
|
|
262
240
|
/**
|
|
263
241
|
* The strings shown in the showAllModal are only shown if we have more than allTagsModalSearchLThreshold
|
|
264
242
|
* @returns null if no problems
|
|
265
243
|
*/
|
|
266
|
-
|
|
267
244
|
export var string_required_if_more_than_10_tags = isRequiredIf(PropTypes.string, function (_ref4) {
|
|
268
245
|
var tags = _ref4.tags;
|
|
269
246
|
return tags && tags.length > allTagsModalSearchThreshold;
|
|
270
|
-
});
|
|
247
|
+
});
|
|
271
248
|
|
|
249
|
+
// copied from carbon-components-react/src/components/Tag/Tag.js for DocGen
|
|
272
250
|
var TYPES = {
|
|
273
251
|
red: 'Red',
|
|
274
252
|
magenta: 'Magenta',
|
|
@@ -290,64 +268,52 @@ TagSet.propTypes = {
|
|
|
290
268
|
* align the Tags displayed by the TagSet. Default start.
|
|
291
269
|
*/
|
|
292
270
|
align: PropTypes.oneOf(['start', 'center', 'end']),
|
|
293
|
-
|
|
294
271
|
/**
|
|
295
272
|
* label text for the show all search. **Note: Required if more than 10 tags**
|
|
296
273
|
*/
|
|
297
274
|
allTagsModalSearchLabel: string_required_if_more_than_10_tags,
|
|
298
|
-
|
|
299
275
|
/**
|
|
300
276
|
* placeholder text for the show all search. **Note: Required if more than 10 tags**
|
|
301
277
|
*/
|
|
302
278
|
allTagsModalSearchPlaceholderText: string_required_if_more_than_10_tags,
|
|
303
|
-
|
|
304
279
|
/**
|
|
305
280
|
* portal target for the all tags modal
|
|
306
281
|
*/
|
|
307
282
|
allTagsModalTarget: PropTypes.node,
|
|
308
|
-
|
|
309
283
|
/**
|
|
310
284
|
* title for the show all modal. **Note: Required if more than 10 tags**
|
|
311
285
|
*/
|
|
312
286
|
allTagsModalTitle: string_required_if_more_than_10_tags,
|
|
313
|
-
|
|
314
287
|
/**
|
|
315
288
|
* className
|
|
316
289
|
*/
|
|
317
290
|
className: PropTypes.string,
|
|
318
|
-
|
|
319
291
|
/**
|
|
320
292
|
* maximum visible tags
|
|
321
293
|
*/
|
|
322
294
|
maxVisible: PropTypes.number,
|
|
323
|
-
|
|
324
295
|
/**
|
|
325
296
|
* display tags in multiple lines
|
|
326
297
|
*/
|
|
327
298
|
multiline: PropTypes.bool,
|
|
328
|
-
|
|
329
299
|
/**
|
|
330
300
|
* overflowAlign from the standard tooltip. Default center.
|
|
331
301
|
*/
|
|
332
302
|
overflowAlign: PropTypes.oneOf(['start', 'center', 'end']),
|
|
333
|
-
|
|
334
303
|
/**
|
|
335
304
|
* overflowClassName for the tooltip popup
|
|
336
305
|
*/
|
|
337
306
|
overflowClassName: PropTypes.string,
|
|
338
|
-
|
|
339
307
|
/**
|
|
340
308
|
* overflowDirection from the standard tooltip
|
|
341
309
|
*/
|
|
342
310
|
overflowDirection: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
|
|
343
|
-
|
|
344
311
|
/**
|
|
345
312
|
* label for the overflow show all tags link.
|
|
346
313
|
*
|
|
347
314
|
* **Note:** Required if more than 10 tags
|
|
348
315
|
*/
|
|
349
316
|
showAllTagsLabel: string_required_if_more_than_10_tags,
|
|
350
|
-
|
|
351
317
|
/**
|
|
352
318
|
* The tags to be shown in the TagSet. Each tag is specified as an object
|
|
353
319
|
* with properties: **label**\* (required) to supply the tag content, and
|
|
@@ -3,18 +3,16 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["allTags", "className", "title", "onClose", "open", "searchLabel", "searchPlaceholder"],
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
_excluded2 = ["label"];
|
|
8
7
|
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; }
|
|
9
|
-
|
|
10
8
|
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; }
|
|
11
|
-
|
|
12
9
|
//
|
|
13
10
|
// Copyright IBM Corp. 2021, 2020
|
|
14
11
|
//
|
|
15
12
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
16
13
|
// LICENSE file in the root directory of this source tree.
|
|
17
14
|
//
|
|
15
|
+
|
|
18
16
|
import React, { useEffect, useState } from 'react';
|
|
19
17
|
import PropTypes from 'prop-types';
|
|
20
18
|
import cx from 'classnames';
|
|
@@ -22,36 +20,33 @@ import { ComposedModal, ModalHeader, ModalBody, Search, Tag } from 'carbon-compo
|
|
|
22
20
|
import { pkg } from '../../settings';
|
|
23
21
|
import { prepareProps } from '../../global/js/utils/props-helper';
|
|
24
22
|
var componentName = 'TagSetModal';
|
|
25
|
-
var blockClass = "".concat(pkg.prefix, "--tag-set-modal");
|
|
23
|
+
var blockClass = "".concat(pkg.prefix, "--tag-set-modal");
|
|
26
24
|
|
|
25
|
+
// Default values for props
|
|
27
26
|
var defaults = {
|
|
28
27
|
// marked as required by TagSet if needed, default used to satisfy <Search /> component
|
|
29
28
|
searchLabel: ''
|
|
30
29
|
};
|
|
31
30
|
export var TagSetModal = function TagSetModal(_ref) {
|
|
32
31
|
var allTags = _ref.allTags,
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
32
|
+
className = _ref.className,
|
|
33
|
+
title = _ref.title,
|
|
34
|
+
onClose = _ref.onClose,
|
|
35
|
+
open = _ref.open,
|
|
36
|
+
_ref$searchLabel = _ref.searchLabel,
|
|
37
|
+
searchLabel = _ref$searchLabel === void 0 ? defaults.searchLabel : _ref$searchLabel,
|
|
38
|
+
searchPlaceholder = _ref.searchPlaceholder,
|
|
39
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
42
40
|
var _useState = useState([]),
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
41
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
42
|
+
filteredModalTags = _useState2[0],
|
|
43
|
+
setFilteredModalTags = _useState2[1];
|
|
47
44
|
var _useState3 = useState(''),
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
45
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
46
|
+
search = _useState4[0],
|
|
47
|
+
setSearch = _useState4[1];
|
|
52
48
|
useEffect(function () {
|
|
53
49
|
var newFilteredModalTags = [];
|
|
54
|
-
|
|
55
50
|
if (open) {
|
|
56
51
|
if (search === '') {
|
|
57
52
|
newFilteredModalTags = allTags.slice(0);
|
|
@@ -59,24 +54,19 @@ export var TagSetModal = function TagSetModal(_ref) {
|
|
|
59
54
|
var lCaseSearch = search.toLocaleLowerCase();
|
|
60
55
|
allTags.forEach(function (tag) {
|
|
61
56
|
var _tag$dataSearch, _tag$dataSearch$toLoc, _tag$label, _tag$label$toLocaleLo;
|
|
62
|
-
|
|
63
57
|
var dataSearch = (_tag$dataSearch = tag['data-search']) === null || _tag$dataSearch === void 0 ? void 0 : (_tag$dataSearch$toLoc = _tag$dataSearch.toLocaleLowerCase()) === null || _tag$dataSearch$toLoc === void 0 ? void 0 : _tag$dataSearch$toLoc.indexOf(lCaseSearch);
|
|
64
58
|
var labelSearch = (_tag$label = tag.label) === null || _tag$label === void 0 ? void 0 : (_tag$label$toLocaleLo = _tag$label.toLocaleLowerCase()) === null || _tag$label$toLocaleLo === void 0 ? void 0 : _tag$label$toLocaleLo.indexOf(lCaseSearch);
|
|
65
|
-
|
|
66
59
|
if (dataSearch > -1 || labelSearch > -1) {
|
|
67
60
|
newFilteredModalTags.push(tag);
|
|
68
61
|
}
|
|
69
62
|
});
|
|
70
63
|
}
|
|
71
64
|
}
|
|
72
|
-
|
|
73
65
|
setFilteredModalTags(newFilteredModalTags);
|
|
74
66
|
}, [allTags, open, search]);
|
|
75
|
-
|
|
76
67
|
var handleSearch = function handleSearch(ev) {
|
|
77
68
|
setSearch(ev.target.value || '');
|
|
78
69
|
};
|
|
79
|
-
|
|
80
70
|
return /*#__PURE__*/React.createElement(ComposedModal, _extends({}, rest, {
|
|
81
71
|
containerClassName: "".concat(blockClass, "__container"),
|
|
82
72
|
className: cx(className, "".concat(blockClass)),
|
|
@@ -98,8 +88,7 @@ export var TagSetModal = function TagSetModal(_ref) {
|
|
|
98
88
|
hasForm: true
|
|
99
89
|
}, filteredModalTags.map(function (_ref2, index) {
|
|
100
90
|
var label = _ref2.label,
|
|
101
|
-
|
|
102
|
-
|
|
91
|
+
other = _objectWithoutProperties(_ref2, _excluded2);
|
|
103
92
|
return /*#__PURE__*/React.createElement(Tag, _extends({}, other, {
|
|
104
93
|
filter: false,
|
|
105
94
|
key: "all-tags-".concat(index)
|
|
@@ -9,6 +9,7 @@ var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "
|
|
|
9
9
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
10
10
|
// LICENSE file in the root directory of this source tree.
|
|
11
11
|
//
|
|
12
|
+
|
|
12
13
|
import React, { useState, useRef } from 'react';
|
|
13
14
|
import PropTypes from 'prop-types';
|
|
14
15
|
import cx from 'classnames';
|
|
@@ -16,8 +17,9 @@ import { Link, Tag, Tooltip } from 'carbon-components-react';
|
|
|
16
17
|
import { pkg } from '../../settings';
|
|
17
18
|
import { noop } from '../../global/js/utils/pconsole';
|
|
18
19
|
var componentName = 'TagSetOverflow';
|
|
19
|
-
var blockClass = "".concat(pkg.prefix, "--tag-set-overflow");
|
|
20
|
+
var blockClass = "".concat(pkg.prefix, "--tag-set-overflow");
|
|
20
21
|
|
|
22
|
+
// Default values for props
|
|
21
23
|
var defaults = {
|
|
22
24
|
allTagsModalSearchThreshold: 10,
|
|
23
25
|
overflowAlign: 'center',
|
|
@@ -25,36 +27,31 @@ var defaults = {
|
|
|
25
27
|
};
|
|
26
28
|
export var TagSetOverflow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
27
29
|
var _ref$allTagsModalSear = _ref.allTagsModalSearchThreshold,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
30
|
+
allTagsModalSearchThreshold = _ref$allTagsModalSear === void 0 ? defaults.allTagsModalSearchThreshold : _ref$allTagsModalSear,
|
|
31
|
+
className = _ref.className,
|
|
32
|
+
onShowAllClick = _ref.onShowAllClick,
|
|
33
|
+
_ref$overflowAlign = _ref.overflowAlign,
|
|
34
|
+
overflowAlign = _ref$overflowAlign === void 0 ? defaults.overflowAlign : _ref$overflowAlign,
|
|
35
|
+
_ref$overflowDirectio = _ref.overflowDirection,
|
|
36
|
+
overflowDirection = _ref$overflowDirectio === void 0 ? defaults.overflowDirection : _ref$overflowDirectio,
|
|
37
|
+
overflowTags = _ref.overflowTags,
|
|
38
|
+
showAllTagsLabel = _ref.showAllTagsLabel,
|
|
39
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
39
40
|
var _useState = useState(false),
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
41
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
42
|
+
tipOpen = _useState2[0],
|
|
43
|
+
setTipOpen = _useState2[1];
|
|
44
44
|
var overflowTagContent = useRef(null);
|
|
45
|
-
|
|
46
45
|
var handleChange = function handleChange(ev, _ref2) {
|
|
47
46
|
var open = _ref2.open;
|
|
48
47
|
setTipOpen(open);
|
|
49
48
|
};
|
|
50
|
-
|
|
51
49
|
var handleShowAllTagsClick = function handleShowAllTagsClick(ev) {
|
|
52
50
|
ev.stopPropagation();
|
|
53
51
|
ev.preventDefault();
|
|
54
52
|
setTipOpen(false);
|
|
55
53
|
onShowAllClick();
|
|
56
54
|
};
|
|
57
|
-
|
|
58
55
|
return /*#__PURE__*/React.createElement("span", _extends({}, rest, {
|
|
59
56
|
"aria-hidden": overflowTags.length === 0,
|
|
60
57
|
className: cx("".concat(blockClass), _defineProperty({}, "".concat(blockClass, "--hidden"), overflowTags.length === 0)),
|
|
@@ -96,32 +93,26 @@ TagSetOverflow.propTypes = {
|
|
|
96
93
|
* count of overflowTags over which a modal is offered
|
|
97
94
|
*/
|
|
98
95
|
allTagsModalSearchThreshold: PropTypes.number,
|
|
99
|
-
|
|
100
96
|
/**
|
|
101
97
|
* className
|
|
102
98
|
*/
|
|
103
99
|
className: PropTypes.string,
|
|
104
|
-
|
|
105
100
|
/**
|
|
106
101
|
* function to execute on clicking show all
|
|
107
102
|
*/
|
|
108
103
|
onShowAllClick: PropTypes.func.isRequired,
|
|
109
|
-
|
|
110
104
|
/**
|
|
111
105
|
* overflowAlign from the standard tooltip
|
|
112
106
|
*/
|
|
113
107
|
overflowAlign: PropTypes.oneOf(['start', 'center', 'end']),
|
|
114
|
-
|
|
115
108
|
/**
|
|
116
109
|
* overflowDirection from the standard tooltip
|
|
117
110
|
*/
|
|
118
111
|
overflowDirection: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
|
|
119
|
-
|
|
120
112
|
/**
|
|
121
113
|
* tags shown in overflow
|
|
122
114
|
*/
|
|
123
115
|
overflowTags: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
124
|
-
|
|
125
116
|
/**
|
|
126
117
|
* label for the overflow show all tags link
|
|
127
118
|
*/
|