@carbon/ibm-products 2.43.2-canary.257 → 2.43.2-canary.260
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 +1 -0
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +1 -0
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +1 -0
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +1 -0
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/ActionBar/ActionBarOverflowItems.js +5 -0
- package/es/components/AddSelect/AddSelectBody.js +1 -1
- package/es/components/BigNumbers/BigNumbers.js +1 -1
- package/es/components/Coachmark/utils/enums.js +1 -0
- package/es/components/ScrollGradient/ScrollGradient.js +1 -1
- package/es/components/StringFormatter/StringFormatter.js +1 -1
- package/es/global/js/utils/devtools.js +1 -2
- package/lib/_virtual/_commonjsHelpers.js +0 -2
- package/lib/_virtual/_rollupPluginBabelHelpers.js +2 -4
- package/lib/_virtual/index.js +0 -2
- package/lib/components/APIKeyModal/APIKeyDownloader.js +8 -14
- package/lib/components/APIKeyModal/APIKeyModal.js +70 -77
- package/lib/components/AboutModal/AboutModal.js +29 -36
- package/lib/components/ActionBar/ActionBar.js +26 -33
- package/lib/components/ActionBar/ActionBarItem.js +9 -16
- package/lib/components/ActionBar/ActionBarOverflowItems.js +23 -25
- package/lib/components/ActionSet/ActionSet.js +17 -24
- package/lib/components/AddSelect/AddSelect.js +62 -68
- package/lib/components/AddSelect/AddSelectBody.js +82 -89
- package/lib/components/AddSelect/AddSelectBreadcrumbs.js +6 -13
- package/lib/components/AddSelect/AddSelectColumn.js +29 -35
- package/lib/components/AddSelect/AddSelectFilter.js +30 -37
- package/lib/components/AddSelect/AddSelectFormControl.js +15 -21
- package/lib/components/AddSelect/AddSelectList.js +9 -16
- package/lib/components/AddSelect/AddSelectMetaPanel.js +16 -22
- package/lib/components/AddSelect/AddSelectRow.js +32 -39
- package/lib/components/AddSelect/AddSelectSidebar.js +29 -35
- package/lib/components/AddSelect/AddSelectSort.js +10 -16
- package/lib/components/AddSelect/add-select-utils.js +0 -2
- package/lib/components/AddSelect/hooks/useFocus.js +1 -1
- package/lib/components/AddSelect/hooks/useItemSort.js +0 -2
- package/lib/components/AddSelect/hooks/useParentSelect.js +1 -1
- package/lib/components/AddSelect/hooks/usePath.js +1 -1
- package/lib/components/BigNumbers/BigNumbers.js +39 -46
- package/lib/components/BigNumbers/constants.js +0 -2
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +35 -42
- package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +22 -29
- package/lib/components/Card/Card.js +73 -80
- package/lib/components/Card/CardFooter.js +28 -35
- package/lib/components/Card/CardHeader.js +37 -44
- package/lib/components/Carousel/Carousel.js +21 -28
- package/lib/components/Carousel/CarouselItem.js +5 -12
- package/lib/components/Cascade/Cascade.js +15 -22
- package/lib/components/Checklist/Checklist.js +50 -57
- package/lib/components/Checklist/Checklist.types.js +0 -2
- package/lib/components/Checklist/ChecklistChart.js +7 -15
- package/lib/components/Checklist/ChecklistIcon.js +7 -14
- package/lib/components/Coachmark/Coachmark.js +24 -31
- package/lib/components/Coachmark/CoachmarkDragbar.js +12 -19
- package/lib/components/Coachmark/CoachmarkHeader.js +9 -16
- package/lib/components/Coachmark/CoachmarkOverlay.js +14 -21
- package/lib/components/Coachmark/CoachmarkTagline.js +12 -19
- package/lib/components/Coachmark/utils/constants.js +0 -2
- package/lib/components/Coachmark/utils/context.js +0 -2
- package/lib/components/Coachmark/utils/enums.js +1 -2
- package/lib/components/Coachmark/utils/hooks.js +0 -2
- package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +10 -17
- package/lib/components/CoachmarkButton/CoachmarkButton.js +6 -13
- package/lib/components/CoachmarkFixed/CoachmarkFixed.js +13 -20
- package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +11 -18
- package/lib/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +25 -32
- package/lib/components/CoachmarkStack/CoachmarkStack.js +23 -30
- package/lib/components/CoachmarkStack/CoachmarkStackHome.js +29 -36
- package/lib/components/ComboButton/ComboButton.js +11 -18
- package/lib/components/ComboButton/ComboButtonItem/index.js +2 -8
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +34 -39
- package/lib/components/ConditionBuilder/ConditionBuilder.js +49 -56
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +18 -23
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +15 -20
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +20 -27
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +8 -12
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +4 -8
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +38 -42
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +25 -31
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +0 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +17 -23
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +9 -15
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +5 -11
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +13 -19
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +17 -23
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +6 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +9 -15
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +27 -32
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +25 -30
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +0 -2
- package/lib/components/ConditionBuilder/utils/useDataConfigs.js +0 -2
- package/lib/components/ConditionBuilder/utils/useTranslations.js +0 -2
- package/lib/components/ConditionBuilder/utils/util.js +0 -2
- package/lib/components/CreateFullPage/CreateFullPage.js +44 -51
- package/lib/components/CreateFullPage/CreateFullPageStep.js +22 -29
- package/lib/components/CreateInfluencer/CreateInfluencer.js +15 -22
- package/lib/components/CreateModal/CreateModal.js +22 -29
- package/lib/components/CreateSidePanel/CreateSidePanel.js +24 -31
- package/lib/components/CreateTearsheet/CreateTearsheet.js +26 -33
- package/lib/components/CreateTearsheet/CreateTearsheetDivider.js +3 -10
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +31 -38
- package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +24 -31
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +37 -44
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +54 -61
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +37 -44
- package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +0 -2
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +0 -2
- package/lib/components/DataSpreadsheet/utils/checkActiveHeaderCell.js +0 -2
- package/lib/components/DataSpreadsheet/utils/checkForHoldingKey.js +0 -2
- package/lib/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +0 -2
- package/lib/components/DataSpreadsheet/utils/commonEventHandlers.js +1 -3
- package/lib/components/DataSpreadsheet/utils/createActiveCellFn.js +0 -2
- package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js +0 -2
- package/lib/components/DataSpreadsheet/utils/getCellSize.js +0 -2
- package/lib/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +0 -2
- package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +0 -2
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +0 -2
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +0 -2
- package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +0 -2
- package/lib/components/DataSpreadsheet/utils/handleEditSubmit.js +1 -3
- package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +1 -3
- package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +2 -4
- package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +0 -2
- package/lib/components/DataSpreadsheet/utils/removeCellSelections.js +0 -2
- package/lib/components/DataSpreadsheet/utils/selectAllCells.js +1 -3
- package/lib/components/Datagrid/Datagrid/Datagrid.js +9 -16
- package/lib/components/Datagrid/Datagrid/DatagridBody.js +5 -9
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +43 -50
- package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +4 -8
- package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +6 -11
- package/lib/components/Datagrid/Datagrid/DatagridHead.js +2 -6
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +12 -17
- package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +3 -8
- package/lib/components/Datagrid/Datagrid/DatagridRow.js +12 -17
- package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +4 -11
- package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +18 -23
- package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +3 -8
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +14 -19
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +5 -9
- package/lib/components/Datagrid/Datagrid/DraggableElement.js +17 -22
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +11 -12
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +10 -11
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +25 -31
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +18 -22
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +7 -13
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +3 -7
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +1 -7
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +34 -39
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +42 -47
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +5 -11
- package/lib/components/Datagrid/Datagrid/addons/Filtering/OverflowCheckboxes.js +11 -15
- package/lib/components/Datagrid/Datagrid/addons/Filtering/constants.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/Filtering/handleCheckboxChange.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.js +1 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +16 -20
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useShouldDisableButtons.js +2 -6
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useSubscribeToEventEmitter.js +1 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/motion/variants.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/Filtering/utils.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +18 -25
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +32 -39
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +2 -8
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +0 -2
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +12 -17
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +11 -16
- package/lib/components/Datagrid/Datagrid/addons/Slug/DatagridSlug.js +2 -8
- package/lib/components/Datagrid/Datagrid/addons/stateReducer.js +0 -2
- package/lib/components/Datagrid/common-column-ids.js +0 -2
- package/lib/components/Datagrid/useActionsColumn.js +12 -17
- package/lib/components/Datagrid/useColumnCenterAlign.js +4 -9
- package/lib/components/Datagrid/useColumnRightAlign.js +4 -9
- package/lib/components/Datagrid/useCustomizeColumns.js +6 -7
- package/lib/components/Datagrid/useDatagrid.js +4 -8
- package/lib/components/Datagrid/useDefaultStringRenderer.js +5 -10
- package/lib/components/Datagrid/useDisableSelectRows.js +1 -1
- package/lib/components/Datagrid/useEditableCell.js +2 -2
- package/lib/components/Datagrid/useExpandedRow.js +3 -3
- package/lib/components/Datagrid/useFiltering.js +5 -5
- package/lib/components/Datagrid/useFlexResize.js +1 -1
- package/lib/components/Datagrid/useFloatingScroll.js +2 -6
- package/lib/components/Datagrid/useFocusRowExpander.js +0 -2
- package/lib/components/Datagrid/useInfiniteScroll.js +4 -8
- package/lib/components/Datagrid/useInitialColumnSort.js +0 -2
- package/lib/components/Datagrid/useInlineEdit.js +7 -12
- package/lib/components/Datagrid/useNestedRowExpander.js +5 -10
- package/lib/components/Datagrid/useNestedRows.js +3 -7
- package/lib/components/Datagrid/useOnRowClick.js +1 -1
- package/lib/components/Datagrid/useParentDimensions.js +1 -1
- package/lib/components/Datagrid/useResizeTable.js +1 -1
- package/lib/components/Datagrid/useRowExpander.js +5 -10
- package/lib/components/Datagrid/useRowIsMouseOver.js +2 -6
- package/lib/components/Datagrid/useRowRenderer.js +2 -2
- package/lib/components/Datagrid/useRowSize.js +2 -2
- package/lib/components/Datagrid/useSelectAllToggle.js +3 -8
- package/lib/components/Datagrid/useSelectRows.js +6 -11
- package/lib/components/Datagrid/useSkeletonRows.js +1 -1
- package/lib/components/Datagrid/useSortableColumns.js +8 -13
- package/lib/components/Datagrid/useStickyColumn.js +4 -9
- package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.js +0 -2
- package/lib/components/Decorator/Decorator.js +16 -22
- package/lib/components/DecoratorBase/DecoratorBase.js +41 -48
- package/lib/components/DecoratorBase/DecoratorIcon.js +6 -13
- package/lib/components/DecoratorBase/utils.js +0 -2
- package/lib/components/DecoratorDualButton/DecoratorDualButton.js +21 -27
- package/lib/components/DecoratorLink/DecoratorLink.js +19 -25
- package/lib/components/DecoratorSingleButton/DecoratorSingleButton.js +19 -25
- package/lib/components/DelimitedList/DelimitedList.js +7 -14
- package/lib/components/DescriptionList/DescriptionList.js +8 -15
- package/lib/components/DescriptionList/DescriptionListBody.js +5 -12
- package/lib/components/DescriptionList/DescriptionListCell.js +5 -12
- package/lib/components/DescriptionList/DescriptionListRow.js +5 -12
- package/lib/components/DescriptionList/constants.js +0 -2
- package/lib/components/EditFullPage/EditFullPage.js +5 -12
- package/lib/components/EditInPlace/EditInPlace.js +35 -42
- package/lib/components/EditSidePanel/EditSidePanel.js +26 -33
- package/lib/components/EditTearsheet/EditTearsheet.js +24 -31
- package/lib/components/EditTearsheet/EditTearsheetForm.js +16 -23
- package/lib/components/EditTearsheetNarrow/EditTearsheetNarrow.js +5 -12
- package/lib/components/EditUpdateCards/EditUpdateCards.js +32 -39
- package/lib/components/EmptyStates/EmptyState.js +22 -29
- package/lib/components/EmptyStates/EmptyStateContent.js +18 -25
- package/lib/components/EmptyStates/EmptyStateIllustration.js +3 -7
- package/lib/components/EmptyStates/EmptyStateV2.js +25 -32
- package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +19 -26
- package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +19 -26
- package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +19 -26
- package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +19 -26
- package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +19 -26
- package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +19 -26
- package/lib/components/EmptyStates/assets/ErrorIllustration.js +53 -58
- package/lib/components/EmptyStates/assets/NoDataIllustration.js +43 -48
- package/lib/components/EmptyStates/assets/NoTagsIllustration.js +114 -119
- package/lib/components/EmptyStates/assets/NotFoundIllustration.js +84 -89
- package/lib/components/EmptyStates/assets/NotificationsIllustration.js +81 -86
- package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +74 -79
- package/lib/components/ExportModal/ExportModal.js +45 -52
- package/lib/components/ExpressiveCard/ExpressiveCard.js +28 -34
- package/lib/components/FeatureFlags/index.js +3 -9
- package/lib/components/FilterPanel/FilterPanel.js +7 -14
- package/lib/components/FilterPanel/FilterPanelAccordion/FilterPanelAccordion.js +10 -17
- package/lib/components/FilterPanel/FilterPanelAccordionItem/FilterPanelAccordionItem.js +13 -20
- package/lib/components/FilterPanel/FilterPanelCheckbox/FilterPanelCheckbox.js +9 -16
- package/lib/components/FilterPanel/FilterPanelCheckboxWithOverflow/FilterPanelCheckboxWithOverflow.js +17 -24
- package/lib/components/FilterPanel/FilterPanelGroup/FilterPanelGroup.js +11 -18
- package/lib/components/FilterPanel/FilterPanelLabel/FilterPanelLabel.js +9 -16
- package/lib/components/FilterPanel/FilterPanelSearch/FilterPanelSearch.js +9 -16
- package/lib/components/FilterSummary/FilterSummary.js +22 -28
- package/lib/components/FullPageError/FullPageError.js +21 -28
- package/lib/components/FullPageError/assets/Error403SVG.js +129 -135
- package/lib/components/FullPageError/assets/Error404SVG.js +114 -120
- package/lib/components/FullPageError/assets/ErrorGenericSVG.js +128 -134
- package/lib/components/GetStartedCard/GetStartedCard.js +16 -22
- package/lib/components/Guidebanner/Guidebanner.js +32 -39
- package/lib/components/Guidebanner/GuidebannerElement.js +10 -17
- package/lib/components/Guidebanner/GuidebannerElementButton.js +9 -16
- package/lib/components/Guidebanner/GuidebannerElementLink.js +5 -12
- package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +5 -12
- package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +5 -12
- package/lib/components/HTTPErrors/HTTPErrorContent.js +5 -11
- package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +5 -12
- package/lib/components/HTTPErrors/assets/HTTPErrorSvg403.js +358 -364
- package/lib/components/HTTPErrors/assets/HTTPErrorSvg404.js +309 -315
- package/lib/components/HTTPErrors/assets/HTTPErrorSvgOther.js +321 -327
- package/lib/components/ImportModal/ImportModal.js +48 -55
- package/lib/components/InlineTip/InlineTip.js +38 -45
- package/lib/components/InlineTip/InlineTipButton.js +5 -12
- package/lib/components/InlineTip/InlineTipLink.js +6 -13
- package/lib/components/InlineTip/utils.js +2 -4
- package/lib/components/InterstitialScreen/InterstitialScreen.js +73 -80
- package/lib/components/InterstitialScreenView/InterstitialScreenView.js +6 -13
- package/lib/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js +8 -15
- package/lib/components/MultiAddSelect/MultiAddSelect.js +45 -51
- package/lib/components/Nav/Nav.js +14 -21
- package/lib/components/Nav/NavItem.js +19 -24
- package/lib/components/Nav/NavItemLink.js +4 -8
- package/lib/components/Nav/NavList.js +12 -17
- package/lib/components/NonLinearReading/NonLinearReading.js +12 -19
- package/lib/components/NotificationsPanel/NotificationsPanel.js +91 -98
- package/lib/components/NotificationsPanel/utils.js +0 -2
- package/lib/components/OptionsTile/OptionsTile.js +40 -47
- package/lib/components/PageHeader/PageHeader.js +105 -112
- package/lib/components/PageHeader/PageHeaderTitle.js +23 -30
- package/lib/components/PageHeader/PageHeaderUtils.js +2 -9
- package/lib/components/ProductiveCard/ProductiveCard.js +36 -42
- package/lib/components/RemoveModal/RemoveModal.js +27 -34
- package/lib/components/Saving/Saving.js +27 -34
- package/lib/components/ScrollGradient/ScrollGradient.js +17 -24
- package/lib/components/ScrollGradient/constants.js +0 -2
- package/lib/components/SearchBar/SearchBar.js +22 -29
- package/lib/components/SidePanel/SidePanel.js +66 -73
- package/lib/components/SidePanel/constants.js +0 -2
- package/lib/components/SidePanel/motion/variants.js +0 -2
- package/lib/components/SimpleHeader/SimpleHeader.js +18 -25
- package/lib/components/SingleAddSelect/SingleAddSelect.js +21 -27
- package/lib/components/StatusIcon/StatusIcon.js +52 -59
- package/lib/components/StatusIndicator/StatusIndicator.js +13 -20
- package/lib/components/StatusIndicator/StatusIndicatorStep.js +14 -21
- package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +8 -17
- package/lib/components/StringFormatter/StringFormatter.js +12 -19
- package/lib/components/StringFormatter/utils/enums.js +0 -2
- package/lib/components/TagOverflow/TagOverflow.js +26 -33
- package/lib/components/TagOverflow/TagOverflowModal.js +17 -24
- package/lib/components/TagOverflow/TagOverflowPopover.js +22 -29
- package/lib/components/TagOverflow/constants.js +0 -2
- package/lib/components/TagSet/TagSet.js +34 -41
- package/lib/components/TagSet/TagSetModal.js +16 -23
- package/lib/components/TagSet/TagSetOverflow.js +25 -32
- package/lib/components/Tearsheet/Tearsheet.js +23 -29
- package/lib/components/Tearsheet/TearsheetNarrow.js +18 -24
- package/lib/components/Tearsheet/TearsheetShell.js +55 -62
- package/lib/components/Toolbar/Toolbar.js +3 -10
- package/lib/components/Toolbar/ToolbarButton.js +3 -10
- package/lib/components/Toolbar/ToolbarGroup.js +2 -9
- package/lib/components/TooltipTrigger/TooltipTrigger.js +4 -11
- package/lib/components/TruncatedList/TruncatedList.js +15 -22
- package/lib/components/UserAvatar/UserAvatar.js +18 -25
- package/lib/components/UserProfileImage/UserProfileImage.js +24 -31
- package/lib/components/WebTerminal/WebTerminal.js +26 -33
- package/lib/components/WebTerminal/WebTerminalContentWrapper.js +4 -11
- package/lib/components/WebTerminal/hooks/index.js +2 -8
- package/lib/components/_Canary/Canary.js +7 -14
- package/lib/feature-flags.js +3 -4
- package/lib/global/js/hooks/useActiveElement.js +0 -2
- package/lib/global/js/hooks/useClickOutside.js +0 -2
- package/lib/global/js/hooks/useControllableState.js +2 -4
- package/lib/global/js/hooks/useCreateComponentFocus.js +1 -3
- package/lib/global/js/hooks/useCreateComponentStepChange.js +0 -2
- package/lib/global/js/hooks/useFocus.js +1 -3
- package/lib/global/js/hooks/useIsomorphicEffect.js +0 -2
- package/lib/global/js/hooks/usePortalTarget.js +0 -2
- package/lib/global/js/hooks/usePrefersReducedMotion.js +1 -1
- package/lib/global/js/hooks/usePrefix.js +1 -3
- package/lib/global/js/hooks/usePreviousValue.js +0 -2
- package/lib/global/js/hooks/useResetCreateComponent.js +0 -2
- package/lib/global/js/hooks/useResizeObserver.js +0 -2
- package/lib/global/js/hooks/useRetrieveFormTitles.js +0 -2
- package/lib/global/js/hooks/useRetrieveStepData.js +0 -2
- package/lib/global/js/hooks/useValidCreateStepCount.js +0 -2
- package/lib/global/js/hooks/useWindowResize.js +1 -3
- package/lib/global/js/hooks/useWindowScroll.js +1 -3
- package/lib/global/js/package-settings.js +1 -1
- package/lib/global/js/utils/Wrap.js +9 -15
- package/lib/global/js/utils/deepCloneObject.js +1 -3
- package/lib/global/js/utils/devtools.js +0 -2
- package/lib/global/js/utils/getBezierValues.js +0 -2
- package/lib/global/js/utils/getFocusableElements.js +0 -2
- package/lib/global/js/utils/getNodeTextContent.js +1 -3
- package/lib/global/js/utils/getNumberOfHiddenSteps.js +0 -2
- package/lib/global/js/utils/getScrollbarWidth.js +0 -2
- package/lib/global/js/utils/keyboardNavigation.js +0 -2
- package/lib/global/js/utils/lastIndexInArray.js +0 -2
- package/lib/global/js/utils/motionConstants.js +0 -2
- package/lib/global/js/utils/pconsole.js +1 -1
- package/lib/global/js/utils/props-helper.js +10 -12
- package/lib/global/js/utils/rangeWithCallback.js +0 -2
- package/lib/global/js/utils/scrollableAncestor.js +1 -3
- package/lib/global/js/utils/uuidv4.js +1 -1
- package/lib/global/js/utils/wait.js +1 -1
- package/lib/global/js/utils/wrapFocus.js +1 -1
- package/lib/index.js +19 -21
- package/lib/node_modules/@carbon/colors/es/index.js +0 -2
- package/lib/node_modules/@carbon/icon-helpers/es/index.js +3 -5
- package/lib/node_modules/@carbon/icons-react/es/Icon.js +14 -18
- package/lib/node_modules/@carbon/icons-react/es/generated/bucket-2.js +525 -531
- package/lib/node_modules/@carbon/icons-react/es/generated/bucket-9.js +500 -506
- package/lib/node_modules/@carbon/icons-react/es/iconPropTypes-4cbeb95d.js +1 -3
- package/lib/node_modules/object-assign/index.js +0 -2
- package/lib/node_modules/prop-types/checkPropTypes.js +2 -4
- package/lib/node_modules/prop-types/factoryWithThrowingShims.js +0 -2
- package/lib/node_modules/prop-types/factoryWithTypeCheckers.js +4 -10
- package/lib/node_modules/prop-types/index.js +2 -6
- package/lib/node_modules/prop-types/lib/ReactPropTypesSecret.js +0 -2
- package/lib/node_modules/prop-types/lib/has.js +0 -2
- package/lib/settings.js +9 -15
- package/package.json +3 -3
- package/scss/components/SidePanel/_side-panel.scss +1 -0
@@ -7,8 +7,6 @@
|
|
7
7
|
|
8
8
|
'use strict';
|
9
9
|
|
10
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
11
|
-
|
12
10
|
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
|
13
11
|
var react = require('@carbon/react');
|
14
12
|
var React = require('react');
|
@@ -19,10 +17,6 @@ var propsHelper = require('../../global/js/utils/props-helper.js');
|
|
19
17
|
var devtools = require('../../global/js/utils/devtools.js');
|
20
18
|
var settings = require('../../settings.js');
|
21
19
|
|
22
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
23
|
-
|
24
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
25
|
-
|
26
20
|
var _excluded = ["influencerPosition", "influencerWidth"];
|
27
21
|
var componentName = 'Tearsheet';
|
28
22
|
|
@@ -54,13 +48,13 @@ var componentName = 'Tearsheet';
|
|
54
48
|
* panel on either the left or right side, the main content area, and a set of
|
55
49
|
* action buttons.
|
56
50
|
*/
|
57
|
-
exports.Tearsheet = /*#__PURE__*/
|
51
|
+
exports.Tearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
58
52
|
var _ref$influencerPositi = _ref.influencerPosition,
|
59
53
|
influencerPosition = _ref$influencerPositi === void 0 ? 'left' : _ref$influencerPositi,
|
60
54
|
_ref$influencerWidth = _ref.influencerWidth,
|
61
55
|
influencerWidth = _ref$influencerWidth === void 0 ? 'narrow' : _ref$influencerWidth,
|
62
56
|
rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
|
63
|
-
return /*#__PURE__*/
|
57
|
+
return /*#__PURE__*/React.createElement(TearsheetShell.TearsheetShell, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, devtools.getDevtoolsProps(componentName)), rest), {}, {
|
64
58
|
influencerPosition: influencerPosition,
|
65
59
|
influencerWidth: influencerWidth,
|
66
60
|
ref: ref,
|
@@ -84,7 +78,7 @@ var deprecatedProps = {
|
|
84
78
|
* from below. The 'lower' position (the default) provides a little extra room at the top
|
85
79
|
* to allow an action bar navigation or breadcrumbs to also show through.
|
86
80
|
*/
|
87
|
-
verticalPosition: index
|
81
|
+
verticalPosition: index.default.oneOf(['normal', 'lower'])
|
88
82
|
};
|
89
83
|
|
90
84
|
// The types and DocGen commentary for the component props,
|
@@ -110,10 +104,10 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
110
104
|
actions: propsHelper.allPropTypes([/**@ts-ignore */
|
111
105
|
ActionSet.ActionSet.validateActions(function () {
|
112
106
|
return '2xl';
|
113
|
-
}), index
|
114
|
-
kind: index
|
115
|
-
label: index
|
116
|
-
loading: index
|
107
|
+
}), index.default.arrayOf(index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
|
108
|
+
kind: index.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
|
109
|
+
label: index.default.string,
|
110
|
+
loading: index.default.bool,
|
117
111
|
// we duplicate this Button prop to improve the DocGen here
|
118
112
|
onClick: react.Button.propTypes.onClick
|
119
113
|
})))]),
|
@@ -121,11 +115,11 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
121
115
|
* The aria-label for the tearsheet, which is optional.
|
122
116
|
* if it is not passed, the title will be used as the aria-label.
|
123
117
|
*/
|
124
|
-
ariaLabel: index
|
118
|
+
ariaLabel: index.default.string,
|
125
119
|
/**
|
126
120
|
* An optional class or classes to be added to the outermost element.
|
127
121
|
*/
|
128
|
-
className: index
|
122
|
+
className: index.default.string,
|
129
123
|
/**
|
130
124
|
* The accessibility title for the close icon (if shown).
|
131
125
|
*
|
@@ -133,7 +127,7 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
133
127
|
* there are a no navigation actions and/or hasCloseIcon is true.
|
134
128
|
*/
|
135
129
|
/**@ts-ignore */
|
136
|
-
closeIconDescription: index
|
130
|
+
closeIconDescription: index.default.string.isRequired.if(function (_ref2) {
|
137
131
|
var actions = _ref2.actions,
|
138
132
|
hasCloseIcon = _ref2.hasCloseIcon;
|
139
133
|
return TearsheetShell.tearsheetHasCloseIcon(actions, hasCloseIcon);
|
@@ -141,7 +135,7 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
141
135
|
/**
|
142
136
|
* A description of the flow, displayed in the header area of the tearsheet.
|
143
137
|
*/
|
144
|
-
description: index
|
138
|
+
description: index.default.node,
|
145
139
|
/**
|
146
140
|
* Enable a close icon ('x') in the header area of the tearsheet. By default,
|
147
141
|
* (when this prop is omitted, or undefined or null) a tearsheet does not
|
@@ -151,47 +145,47 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
151
145
|
* this prop to either true or false.
|
152
146
|
*/
|
153
147
|
/**@ts-ignore */
|
154
|
-
hasCloseIcon: index
|
148
|
+
hasCloseIcon: index.default.bool,
|
155
149
|
/**
|
156
150
|
* The content for the influencer section of the tearsheet, displayed
|
157
151
|
* alongside the main content. This is typically a menu, or filter, or
|
158
152
|
* progress indicator, or similar.
|
159
153
|
*/
|
160
|
-
influencer: index
|
154
|
+
influencer: index.default.element,
|
161
155
|
/**
|
162
156
|
* The position of the influencer section, 'left' or 'right'.
|
163
157
|
*/
|
164
|
-
influencerPosition: index
|
158
|
+
influencerPosition: index.default.oneOf(['left', 'right']),
|
165
159
|
/**
|
166
160
|
* The width of the influencer: 'narrow' (the default) is 256px, and 'wide'
|
167
161
|
* is 320px.
|
168
162
|
*/
|
169
|
-
influencerWidth: index
|
163
|
+
influencerWidth: index.default.oneOf(['narrow', 'wide']),
|
170
164
|
/**
|
171
165
|
* A label for the tearsheet, displayed in the header area of the tearsheet
|
172
166
|
* to maintain context for the tearsheet (e.g. as the title changes from page
|
173
167
|
* to page of a multi-page task).
|
174
168
|
*/
|
175
|
-
label: index
|
169
|
+
label: index.default.node,
|
176
170
|
/**
|
177
171
|
* Provide a ref to return focus to once the tearsheet is closed.
|
178
172
|
*/
|
179
|
-
launcherButtonRef: index
|
173
|
+
launcherButtonRef: index.default.any,
|
180
174
|
/**
|
181
175
|
* Navigation content, such as a set of tabs, to be displayed at the bottom
|
182
176
|
* of the header area of the tearsheet.
|
183
177
|
*/
|
184
|
-
navigation: index
|
178
|
+
navigation: index.default.element,
|
185
179
|
/**
|
186
180
|
* An optional handler that is called when the user closes the tearsheet (by
|
187
181
|
* clicking the close button, if enabled, or clicking outside, if enabled).
|
188
182
|
* Returning `false` here prevents the modal from closing.
|
189
183
|
*/
|
190
|
-
onClose: index
|
184
|
+
onClose: index.default.func,
|
191
185
|
/**
|
192
186
|
* Specifies whether the tearsheet is currently open.
|
193
187
|
*/
|
194
|
-
open: index
|
188
|
+
open: index.default.bool,
|
195
189
|
/**
|
196
190
|
* The DOM element that the tearsheet should be rendered within. Defaults to document.body.
|
197
191
|
*/
|
@@ -201,18 +195,18 @@ exports.Tearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
201
195
|
* Specify a CSS selector that matches the DOM element that should be
|
202
196
|
* focused when the Modal opens.
|
203
197
|
*/
|
204
|
-
selectorPrimaryFocus: index
|
198
|
+
selectorPrimaryFocus: index.default.string,
|
205
199
|
/**
|
206
200
|
* Specify the CSS selectors that match the floating menus.
|
207
201
|
*
|
208
202
|
* See https://react.carbondesignsystem.com/?path=/docs/components-composedmodal--overview#focus-management
|
209
203
|
*/
|
210
204
|
/**@ts-ignore*/
|
211
|
-
selectorsFloatingMenus: index
|
205
|
+
selectorsFloatingMenus: index.default.arrayOf(index.default.string),
|
212
206
|
/**
|
213
207
|
* The main title of the tearsheet, displayed in the header area.
|
214
208
|
*/
|
215
|
-
title: index
|
209
|
+
title: index.default.node
|
216
210
|
}, deprecatedProps);
|
217
211
|
|
218
212
|
exports.deprecatedProps = deprecatedProps;
|
@@ -7,8 +7,6 @@
|
|
7
7
|
|
8
8
|
'use strict';
|
9
9
|
|
10
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
11
|
-
|
12
10
|
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
|
13
11
|
var react = require('@carbon/react');
|
14
12
|
var TearsheetShell = require('./TearsheetShell.js');
|
@@ -19,10 +17,6 @@ var index = require('../../node_modules/prop-types/index.js');
|
|
19
17
|
var devtools = require('../../global/js/utils/devtools.js');
|
20
18
|
var settings = require('../../settings.js');
|
21
19
|
|
22
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
23
|
-
|
24
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
25
|
-
|
26
20
|
var _excluded = ["verticalPosition"];
|
27
21
|
var componentName = 'TearsheetNarrow';
|
28
22
|
|
@@ -42,11 +36,11 @@ var defaults = {
|
|
42
36
|
* main content area, and a set of action buttons.
|
43
37
|
*/
|
44
38
|
|
45
|
-
exports.TearsheetNarrow = /*#__PURE__*/
|
39
|
+
exports.TearsheetNarrow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
46
40
|
var _ref$verticalPosition = _ref.verticalPosition,
|
47
41
|
verticalPosition = _ref$verticalPosition === void 0 ? defaults.verticalPosition : _ref$verticalPosition,
|
48
42
|
rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
|
49
|
-
return /*#__PURE__*/
|
43
|
+
return /*#__PURE__*/React.createElement(TearsheetShell.TearsheetShell, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, devtools.getDevtoolsProps(componentName)), propsHelper.prepareProps(rest, TearsheetShell.tearsheetShellWideProps)), {}, {
|
50
44
|
verticalPosition: verticalPosition,
|
51
45
|
ref: ref,
|
52
46
|
size: 'narrow'
|
@@ -69,7 +63,7 @@ var deprecatedProps = {
|
|
69
63
|
* from below. The 'lower' position (the default) provides a little extra room at the top
|
70
64
|
* to allow an action bar navigation or breadcrumbs to also show through.
|
71
65
|
*/
|
72
|
-
verticalPosition: index
|
66
|
+
verticalPosition: index.default.oneOf(['normal', 'lower'])
|
73
67
|
};
|
74
68
|
|
75
69
|
// The types and DocGen commentary for the component props,
|
@@ -95,10 +89,10 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
95
89
|
actions: propsHelper.allPropTypes([/**@ts-ignore */
|
96
90
|
ActionSet.ActionSet.validateActions(function () {
|
97
91
|
return 'lg';
|
98
|
-
}), index
|
99
|
-
kind: index
|
100
|
-
label: index
|
101
|
-
loading: index
|
92
|
+
}), index.default.arrayOf(index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
|
93
|
+
kind: index.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
|
94
|
+
label: index.default.string,
|
95
|
+
loading: index.default.bool,
|
102
96
|
// we duplicate this Button prop to improve the DocGen here
|
103
97
|
onClick: react.Button.propTypes.onClick
|
104
98
|
})))]),
|
@@ -106,11 +100,11 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
106
100
|
* The aria-label for the tearsheet, which is optional.
|
107
101
|
* if it is not passed, the title will be used as the aria-label.
|
108
102
|
*/
|
109
|
-
ariaLabel: index
|
103
|
+
ariaLabel: index.default.string,
|
110
104
|
/**
|
111
105
|
* An optional class or classes to be added to the outermost element.
|
112
106
|
*/
|
113
|
-
className: index
|
107
|
+
className: index.default.string,
|
114
108
|
/**
|
115
109
|
* The accessibility title for the close icon (if shown).
|
116
110
|
*
|
@@ -118,7 +112,7 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
118
112
|
* there are a no navigation actions and/or hasCloseIcon is true.
|
119
113
|
*/
|
120
114
|
/**@ts-ignore */
|
121
|
-
closeIconDescription: index
|
115
|
+
closeIconDescription: index.default.string.isRequired.if(function (_ref2) {
|
122
116
|
var actions = _ref2.actions,
|
123
117
|
hasCloseIcon = _ref2.hasCloseIcon;
|
124
118
|
return TearsheetShell.tearsheetHasCloseIcon(actions, hasCloseIcon);
|
@@ -126,7 +120,7 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
126
120
|
/**
|
127
121
|
* A description of the flow, displayed in the header area of the tearsheet.
|
128
122
|
*/
|
129
|
-
description: index
|
123
|
+
description: index.default.node,
|
130
124
|
/**
|
131
125
|
* Enable a close icon ('x') in the header area of the tearsheet. By default,
|
132
126
|
* a tearsheet does not display a close icon, but one should be enabled if
|
@@ -134,23 +128,23 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
134
128
|
* a "passive tearsheet").
|
135
129
|
*/
|
136
130
|
/**@ts-ignore*/
|
137
|
-
hasCloseIcon: index
|
131
|
+
hasCloseIcon: index.default.bool,
|
138
132
|
/**
|
139
133
|
* A label for the tearsheet, displayed in the header area of the tearsheet
|
140
134
|
* to maintain context for the tearsheet (e.g. as the title changes from page
|
141
135
|
* to page of a multi-page task).
|
142
136
|
*/
|
143
|
-
label: index
|
137
|
+
label: index.default.node,
|
144
138
|
/**
|
145
139
|
* An optional handler that is called when the user closes the tearsheet (by
|
146
140
|
* clicking the close button, if enabled, or clicking outside, if enabled).
|
147
141
|
* Returning `false` here prevents the modal from closing.
|
148
142
|
*/
|
149
|
-
onClose: index
|
143
|
+
onClose: index.default.func,
|
150
144
|
/**
|
151
145
|
* Specifies whether the tearsheet is currently open.
|
152
146
|
*/
|
153
|
-
open: index
|
147
|
+
open: index.default.bool,
|
154
148
|
/**
|
155
149
|
* The DOM element that the tearsheet should be rendered within. Defaults to document.body.
|
156
150
|
*/
|
@@ -160,18 +154,18 @@ exports.TearsheetNarrow.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
160
154
|
* Specify a CSS selector that matches the DOM element that should be
|
161
155
|
* focused when the Modal opens.
|
162
156
|
*/
|
163
|
-
selectorPrimaryFocus: index
|
157
|
+
selectorPrimaryFocus: index.default.string,
|
164
158
|
/**
|
165
159
|
* Specify the CSS selectors that match the floating menus.
|
166
160
|
*
|
167
161
|
* See https://react.carbondesignsystem.com/?path=/docs/components-composedmodal--overview#focus-management
|
168
162
|
*/
|
169
163
|
/**@ts-ignore*/
|
170
|
-
selectorsFloatingMenus: index
|
164
|
+
selectorsFloatingMenus: index.default.arrayOf(index.default.string),
|
171
165
|
/**
|
172
166
|
* The main title of the tearsheet, displayed in the header area.
|
173
167
|
*/
|
174
|
-
title: index
|
168
|
+
title: index.default.node
|
175
169
|
}, deprecatedProps);
|
176
170
|
|
177
171
|
exports.deprecatedProps = deprecatedProps;
|
@@ -7,8 +7,6 @@
|
|
7
7
|
|
8
8
|
'use strict';
|
9
9
|
|
10
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
11
|
-
|
12
10
|
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
|
13
11
|
var React = require('react');
|
14
12
|
var useResizeObserver = require('../../global/js/hooks/useResizeObserver.js');
|
@@ -24,11 +22,6 @@ var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
|
|
24
22
|
var useFocus = require('../../global/js/hooks/useFocus.js');
|
25
23
|
var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
|
26
24
|
|
27
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
28
|
-
|
29
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
30
|
-
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
31
|
-
|
32
25
|
var _excluded = ["actions", "ariaLabel", "children", "className", "closeIconDescription", "description", "hasCloseIcon", "headerActions", "influencer", "influencerPosition", "influencerWidth", "label", "navigation", "onClose", "open", "portalTarget", "selectorPrimaryFocus", "selectorsFloatingMenus", "size", "slug", "title", "verticalPosition", "launcherButtonRef"];
|
33
26
|
|
34
27
|
// The block part of our conventional BEM class names (bc__E--M).
|
@@ -70,7 +63,7 @@ var tearsheetHasCloseIcon = function tearsheetHasCloseIcon(actions, hasCloseIcon
|
|
70
63
|
*
|
71
64
|
* See the canvas tab for the component API details.
|
72
65
|
* */
|
73
|
-
var TearsheetShell = /*#__PURE__*/
|
66
|
+
var TearsheetShell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
74
67
|
var actions = _ref.actions,
|
75
68
|
ariaLabel = _ref.ariaLabel,
|
76
69
|
children = _ref.children,
|
@@ -260,18 +253,18 @@ var TearsheetShell = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
260
253
|
}
|
261
254
|
return _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "--".concat(bc, "--stacking-scale-factor-single"), (width - 32) / width), "--".concat(bc, "--stacking-scale-factor-double"), (width - 64) / width);
|
262
255
|
};
|
263
|
-
return renderPortalUse( /*#__PURE__*/
|
256
|
+
return renderPortalUse( /*#__PURE__*/React.createElement(react.unstable_FeatureFlags, {
|
264
257
|
flags: {
|
265
258
|
'enable-experimental-focus-wrap-without-sentinels': true
|
266
259
|
}
|
267
|
-
}, /*#__PURE__*/
|
260
|
+
}, /*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, {
|
268
261
|
"aria-label": ariaLabel || getNodeTextContent.getNodeTextContent(title),
|
269
|
-
className:
|
262
|
+
className: cx(bc, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "--stacked-").concat(position, "-of-").concat(depth),
|
270
263
|
// Don't apply this on the initial open of a single tearsheet.
|
271
264
|
depth > 1 || depth === 1 && ((_prevDepth$current = prevDepth === null || prevDepth === void 0 ? void 0 : prevDepth.current) !== null && _prevDepth$current !== void 0 ? _prevDepth$current : 0) > 1), "".concat(bc, "--wide"), wide), "".concat(bc, "--narrow"), !wide), "".concat(bc, "--has-slug"), slug), "".concat(bc, "--has-close"), effectiveHasCloseIcon)),
|
272
265
|
slug: slug,
|
273
266
|
style: setScaleValues(),
|
274
|
-
containerClassName:
|
267
|
+
containerClassName: cx("".concat(bc, "__container"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "__container--lower"), verticalPosition === 'lower'), "".concat(bc, "__container--mixed-size-stacking"), !areAllSameSizeVariant())),
|
275
268
|
onClose: onClose,
|
276
269
|
open: open,
|
277
270
|
selectorPrimaryFocus: selectorPrimaryFocus,
|
@@ -281,61 +274,61 @@ var TearsheetShell = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
281
274
|
ref: modalRef,
|
282
275
|
selectorsFloatingMenus: [".".concat(carbonPrefix, "--overflow-menu-options"), ".".concat(carbonPrefix, "--tooltip"), '.flatpickr-calendar', ".".concat(bc, "__container")].concat(_rollupPluginBabelHelpers.toConsumableArray(selectorsFloatingMenus)),
|
283
276
|
size: "sm"
|
284
|
-
}), includeHeader && /*#__PURE__*/
|
285
|
-
className:
|
286
|
-
closeClassName:
|
277
|
+
}), includeHeader && /*#__PURE__*/React.createElement(react.ModalHeader, {
|
278
|
+
className: cx("".concat(bc, "__header"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "__header--with-close-icon"), effectiveHasCloseIcon), "".concat(bc, "__header--with-nav"), navigation)),
|
279
|
+
closeClassName: cx(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "__header--no-close-icon"), !effectiveHasCloseIcon)),
|
287
280
|
closeModal: onClose,
|
288
281
|
iconDescription: closeIconDescription
|
289
|
-
}, /*#__PURE__*/
|
282
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
290
283
|
className: "".concat(bc, "__header-content"),
|
291
284
|
element: wide ? react.Layer : undefined
|
292
|
-
}, /*#__PURE__*/
|
285
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
293
286
|
className: "".concat(bc, "__header-fields")
|
294
|
-
}, /*#__PURE__*/
|
287
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
295
288
|
element: "h2",
|
296
289
|
className: "".concat(bcModalHeader, "__label")
|
297
|
-
}, label), /*#__PURE__*/
|
290
|
+
}, label), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
298
291
|
element: "h3",
|
299
|
-
className:
|
300
|
-
}, title), /*#__PURE__*/
|
292
|
+
className: cx("".concat(bcModalHeader, "__heading"), "".concat(bc, "__heading"))
|
293
|
+
}, title), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
301
294
|
className: "".concat(bc, "__header-description"),
|
302
295
|
title: titleText
|
303
|
-
}, description)), /*#__PURE__*/
|
296
|
+
}, description)), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
304
297
|
className: "".concat(bc, "__header-actions")
|
305
|
-
}, headerActions)), /*#__PURE__*/
|
298
|
+
}, headerActions)), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
306
299
|
className: "".concat(bc, "__header-navigation")
|
307
|
-
}, navigation)), /*#__PURE__*/
|
300
|
+
}, navigation)), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
308
301
|
ref: modalBodyRef,
|
309
302
|
className: "".concat(carbonPrefix, "--modal-content ").concat(bc, "__body")
|
310
|
-
}, /*#__PURE__*/
|
311
|
-
className:
|
303
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
304
|
+
className: cx(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "__influencer"), true), "".concat(bc, "__influencer--wide"), influencerWidth === 'wide')),
|
312
305
|
neverRender: influencerPosition === 'right'
|
313
|
-
}, influencer), /*#__PURE__*/
|
306
|
+
}, influencer), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
314
307
|
className: "".concat(bc, "__right")
|
315
|
-
}, /*#__PURE__*/
|
308
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
316
309
|
className: "".concat(bc, "__main"),
|
317
310
|
alwaysRender: includeActions
|
318
|
-
}, /*#__PURE__*/
|
311
|
+
}, /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
319
312
|
className: "".concat(bc, "__content"),
|
320
313
|
alwaysRender: !!(influencer && influencerPosition === 'right'),
|
321
314
|
tabIndex: -1
|
322
|
-
}, children), /*#__PURE__*/
|
323
|
-
className:
|
315
|
+
}, children), /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
316
|
+
className: cx(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(bc, "__influencer"), true), "".concat(bc, "__influencer--wide"), influencerWidth === 'wide')),
|
324
317
|
neverRender: influencerPosition !== 'right'
|
325
|
-
}, influencer)), includeActions && /*#__PURE__*/
|
318
|
+
}, influencer)), includeActions && /*#__PURE__*/React.createElement(Wrap.Wrap, {
|
326
319
|
className: "".concat(bc, "__button-container")
|
327
|
-
}, /*#__PURE__*/
|
320
|
+
}, /*#__PURE__*/React.createElement(ActionSet.ActionSet, {
|
328
321
|
actions: actions,
|
329
322
|
buttonSize: wide ? '2xl' : undefined,
|
330
323
|
className: "".concat(bc, "__buttons"),
|
331
324
|
size: wide ? '2xl' : 'lg',
|
332
325
|
"aria-hidden": !open
|
333
|
-
})))), /*#__PURE__*/
|
326
|
+
})))), /*#__PURE__*/React.createElement("div", {
|
334
327
|
className: "".concat(bc, "__resize-detector"),
|
335
328
|
ref: resizer
|
336
329
|
}))));
|
337
330
|
} else {
|
338
|
-
pconsole
|
331
|
+
pconsole.default.warn('Tearsheet not rendered: maximum stacking depth exceeded.');
|
339
332
|
return null;
|
340
333
|
}
|
341
334
|
});
|
@@ -343,9 +336,9 @@ var TearsheetShell = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
343
336
|
// The display name of the component, used by React. Note that displayName
|
344
337
|
// is used in preference to relying on function.name.
|
345
338
|
TearsheetShell.displayName = componentName;
|
346
|
-
var portalType = typeof Element === 'undefined' ? index
|
339
|
+
var portalType = typeof Element === 'undefined' ? index.default.object :
|
347
340
|
// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
|
348
|
-
index
|
341
|
+
index.default.instanceOf(Element);
|
349
342
|
var deprecatedProps = {
|
350
343
|
/**
|
351
344
|
* **Deprecated**
|
@@ -356,7 +349,7 @@ var deprecatedProps = {
|
|
356
349
|
* from below. The 'lower' position (the default) provides a little extra room at the top
|
357
350
|
* to allow an action bar navigation or breadcrumbs to also show through.
|
358
351
|
*/
|
359
|
-
verticalPosition: index
|
352
|
+
verticalPosition: index.default.oneOf(['normal', 'lower'])
|
360
353
|
};
|
361
354
|
|
362
355
|
// The types and DocGen commentary for the component props,
|
@@ -380,13 +373,13 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
380
373
|
* See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
|
381
374
|
*/
|
382
375
|
/**@ts-ignore*/
|
383
|
-
actions: index
|
376
|
+
actions: index.default.arrayOf(
|
384
377
|
// NB we don't include the validator here, as the component wrapping this
|
385
378
|
// one should ensure appropriate validation is done.
|
386
|
-
index
|
387
|
-
kind: index
|
388
|
-
label: index
|
389
|
-
loading: index
|
379
|
+
index.default.shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Button.propTypes), {}, {
|
380
|
+
kind: index.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
|
381
|
+
label: index.default.string,
|
382
|
+
loading: index.default.bool,
|
390
383
|
// we duplicate this Button prop to improve the DocGen here
|
391
384
|
/**@ts-ignore*/
|
392
385
|
onClick: react.Button.propTypes.onClick
|
@@ -394,11 +387,11 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
394
387
|
/**
|
395
388
|
* The main content of the tearsheet.
|
396
389
|
*/
|
397
|
-
children: index
|
390
|
+
children: index.default.node,
|
398
391
|
/**
|
399
392
|
* An optional class or classes to be added to the outermost element.
|
400
393
|
*/
|
401
|
-
className: index
|
394
|
+
className: index.default.string,
|
402
395
|
/**
|
403
396
|
* The accessibility title for the close icon (if shown).
|
404
397
|
*
|
@@ -406,7 +399,7 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
406
399
|
* there are a no navigation actions and/or hasCloseIcon is true.
|
407
400
|
*/
|
408
401
|
/**@ts-ignore*/
|
409
|
-
closeIconDescription: index
|
402
|
+
closeIconDescription: index.default.string.isRequired.if(function (_ref4) {
|
410
403
|
var actions = _ref4.actions,
|
411
404
|
hasCloseIcon = _ref4.hasCloseIcon;
|
412
405
|
return tearsheetHasCloseIcon(actions, hasCloseIcon);
|
@@ -414,7 +407,7 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
414
407
|
/**
|
415
408
|
* A description of the flow, displayed in the header area of the tearsheet.
|
416
409
|
*/
|
417
|
-
description: index
|
410
|
+
description: index.default.node,
|
418
411
|
/**
|
419
412
|
* Enable a close icon ('x') in the header area of the tearsheet. By default,
|
420
413
|
* (when this prop is omitted, or undefined or null) a tearsheet does not
|
@@ -424,57 +417,57 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
424
417
|
* this prop to either true or false.
|
425
418
|
*/
|
426
419
|
/**@ts-ignore*/
|
427
|
-
hasCloseIcon: index
|
420
|
+
hasCloseIcon: index.default.bool,
|
428
421
|
/**
|
429
422
|
* The content for the header actions area, displayed alongside the title in
|
430
423
|
* the header area of the tearsheet. This is typically a drop-down, or a set
|
431
424
|
* of small buttons, or similar. NB the headerActions is only applicable for
|
432
425
|
* wide tearsheets.
|
433
426
|
*/
|
434
|
-
headerActions: index
|
427
|
+
headerActions: index.default.element,
|
435
428
|
/**
|
436
429
|
* The content for the influencer section of the tearsheet, displayed
|
437
430
|
* alongside the main content. This is typically a menu, or filter, or
|
438
431
|
* progress indicator, or similar. NB the influencer is only applicable for
|
439
432
|
* wide tearsheets.
|
440
433
|
*/
|
441
|
-
influencer: index
|
434
|
+
influencer: index.default.element,
|
442
435
|
/**
|
443
436
|
* The position of the influencer section, 'left' or 'right'.
|
444
437
|
*/
|
445
|
-
influencerPosition: index
|
438
|
+
influencerPosition: index.default.oneOf(['left', 'right']),
|
446
439
|
/**
|
447
440
|
* The width of the influencer: 'narrow' (the default) is 256px, and 'wide'
|
448
441
|
* is 320px.
|
449
442
|
*/
|
450
|
-
influencerWidth: index
|
443
|
+
influencerWidth: index.default.oneOf(['narrow', 'wide']),
|
451
444
|
/**
|
452
445
|
* A label for the tearsheet, displayed in the header area of the tearsheet
|
453
446
|
* to maintain context for the tearsheet (e.g. as the title changes from page
|
454
447
|
* to page of a multi-page task).
|
455
448
|
*/
|
456
|
-
label: index
|
449
|
+
label: index.default.node,
|
457
450
|
/**
|
458
451
|
* Provide a ref to return focus to once the tearsheet is closed.
|
459
452
|
*/
|
460
453
|
/**@ts-ignore */
|
461
|
-
launcherButtonRef: index
|
454
|
+
launcherButtonRef: index.default.any,
|
462
455
|
/**
|
463
456
|
* Navigation content, such as a set of tabs, to be displayed at the bottom
|
464
457
|
* of the header area of the tearsheet. NB the navigation is only applicable
|
465
458
|
* for wide tearsheets.
|
466
459
|
*/
|
467
|
-
navigation: index
|
460
|
+
navigation: index.default.element,
|
468
461
|
/**
|
469
462
|
* An optional handler that is called when the user closes the tearsheet (by
|
470
463
|
* clicking the close button, if enabled, or clicking outside, if enabled).
|
471
464
|
* Returning `false` here prevents the modal from closing.
|
472
465
|
*/
|
473
|
-
onClose: index
|
466
|
+
onClose: index.default.func,
|
474
467
|
/**
|
475
468
|
* Specifies whether the tearsheet is currently open.
|
476
469
|
*/
|
477
|
-
open: index
|
470
|
+
open: index.default.bool,
|
478
471
|
/**
|
479
472
|
* The DOM element that the tearsheet should be rendered within. Defaults to document.body.
|
480
473
|
*/
|
@@ -484,27 +477,27 @@ TearsheetShell.propTypes = _rollupPluginBabelHelpers.objectSpread2({
|
|
484
477
|
* Specify a CSS selector that matches the DOM element that should be
|
485
478
|
* focused when the Modal opens.
|
486
479
|
*/
|
487
|
-
selectorPrimaryFocus: index
|
480
|
+
selectorPrimaryFocus: index.default.string,
|
488
481
|
/**
|
489
482
|
* Specify the CSS selectors that match the floating menus.
|
490
483
|
*
|
491
484
|
* See https://react.carbondesignsystem.com/?path=/docs/components-composedmodal--overview#focus-management
|
492
485
|
*/
|
493
486
|
/**@ts-ignore*/
|
494
|
-
selectorsFloatingMenus: index
|
487
|
+
selectorsFloatingMenus: index.default.arrayOf(index.default.string),
|
495
488
|
/**
|
496
489
|
* Specifies the width of the tearsheet, 'narrow' or 'wide'.
|
497
490
|
*/
|
498
491
|
/**@ts-ignore*/
|
499
|
-
size: index
|
492
|
+
size: index.default.oneOf(['narrow', 'wide']).isRequired,
|
500
493
|
/**
|
501
494
|
* **Experimental:** Provide a `Slug` component to be rendered inside the `Tearsheet` component
|
502
495
|
*/
|
503
|
-
slug: index
|
496
|
+
slug: index.default.node,
|
504
497
|
/**
|
505
498
|
* The main title of the tearsheet, displayed in the header area.
|
506
499
|
*/
|
507
|
-
title: index
|
500
|
+
title: index.default.node
|
508
501
|
}, deprecatedProps);
|
509
502
|
|
510
503
|
exports.TearsheetShell = TearsheetShell;
|