@patternfly/react-core 4.223.3 → 4.224.2

package/dist/umd/react-core.js

@@ -7527,30 +7527,32 @@
                     this.refCollection[this.state.viewMoreNextIndex][0].focus();
                     this.setState({ viewMoreNextIndex: -1 });
                 }
-                const checkUpdatedChildren = (prevChildren, currChildren) => prevChildren.some((prevChild, index) => {
-                    const prevChildProps = prevChild.props;
-                    const currChild = currChildren[index];
-                    const { props: currChildProps } = currChild;
-                    if (prevChildProps && currChildProps) {
-                        return (prevChildProps.value !== currChildProps.value ||
-                            prevChildProps.label !== currChildProps.label ||
-                            prevChildProps.isDisabled !== currChildProps.isDisabled ||
-                            prevChildProps.isPlaceholder !== currChildProps.isPlaceholder);
-                    }
-                    else {
-                        return prevChild !== currChild;
+                if (this.props.variant === 'typeahead' || this.props.variant === 'typeaheadmulti') {
+                    const checkUpdatedChildren = (prevChildren, currChildren) => Array.from(prevChildren).some((prevChild, index) => {
+                        const prevChildProps = prevChild.props;
+                        const currChild = currChildren[index];
+                        const { props: currChildProps } = currChild;
+                        if (prevChildProps && currChildProps) {
+                            return (prevChildProps.value !== currChildProps.value ||
+                                prevChildProps.label !== currChildProps.label ||
+                                prevChildProps.isDisabled !== currChildProps.isDisabled ||
+                                prevChildProps.isPlaceholder !== currChildProps.isPlaceholder);
+                        }
+                        else {
+                            return prevChild !== currChild;
+                        }
+                    });
+                    const hasUpdatedChildren = prevProps.children.length !== this.props.children.length ||
+                        checkUpdatedChildren(prevProps.children, this.props.children) ||
+                        (this.props.isGrouped &&
+                            Array.from(prevProps.children).some((prevChild, index) => prevChild.type === SelectGroup &&
+                                prevChild.props.children &&
+                                this.props.children[index].props.children &&
+                                (prevChild.props.children.length !== this.props.children[index].props.children.length ||
+                                    checkUpdatedChildren(prevChild.props.children, this.props.children[index].props.children))));
+                    if (hasUpdatedChildren) {
+                        this.updateTypeAheadFilteredChildren(prevState.typeaheadInputValue || '', null);
                     }
-                });
-                const hasUpdatedChildren = prevProps.children.length !== this.props.children.length ||
-                    checkUpdatedChildren(prevProps.children, this.props.children) ||
-                    (this.props.isGrouped &&
-                        prevProps.children.some((prevChild, index) => prevChild.type === SelectGroup &&
-                            prevChild.props.children &&
-                            this.props.children[index].props.children &&
-                            (prevChild.props.children.length !== this.props.children[index].props.children.length ||
-                                checkUpdatedChildren(prevChild.props.children, this.props.children[index].props.children))));
-                if (hasUpdatedChildren) {
-                    this.updateTypeAheadFilteredChildren(prevState.typeaheadInputValue || '', null);
                 }
                 // for menus with favorites,
                 // if the number of favorites or typeahead filtered children has changed, the generated
@@ -20883,14 +20885,19 @@
             React__namespace.createElement(Button, { variant: exports.ButtonVariant.link, onClick: onClose }, cancelButtonText)))));
     WizardFooterInternal.displayName = 'WizardFooterInternal';
 
-    const WizardBody = ({ children, hasNoBodyPadding = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, mainComponent = 'div' }) => {
+    const WizardDrawerWrapper = ({ hasDrawer, wrapper, children }) => (hasDrawer ? wrapper(children) : children);
+    WizardDrawerWrapper.displayName = 'WizardDrawerWrapper';
+
+    const WizardBody = ({ children, hasNoBodyPadding = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, mainComponent = 'div', hasDrawer, isDrawerExpanded, activeStep }) => {
         const MainComponent = mainComponent;
         return (React__namespace.createElement(MainComponent, { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className: css(styles$8.wizardMain) },
-            React__namespace.createElement("div", { className: css(styles$8.wizardMainBody, hasNoBodyPadding && styles$8.modifiers.noPadding) }, children)));
+            React__namespace.createElement(WizardDrawerWrapper, { hasDrawer: hasDrawer && activeStep.drawerPanelContent, wrapper: (children) => (React__namespace.createElement(Drawer, { isInline: true, isExpanded: isDrawerExpanded },
+                    React__namespace.createElement(DrawerContent, { panelContent: activeStep.drawerPanelContent }, children))) },
+                React__namespace.createElement("div", { className: css(styles$8.wizardMainBody, hasNoBodyPadding && styles$8.modifiers.noPadding) }, children))));
     };
     WizardBody.displayName = 'WizardBody';
 
-    const WizardToggle = ({ isNavOpen, onNavToggle, nav, steps, activeStep, children, hasNoBodyPadding = false, 'aria-label': ariaLabel = 'Wizard Toggle', mainAriaLabelledBy = null, mainAriaLabel = null, isInPage = true }) => {
+    const WizardToggle = ({ isNavOpen, onNavToggle, nav, steps, activeStep, children, hasNoBodyPadding = false, 'aria-label': ariaLabel = 'Wizard Toggle', mainAriaLabelledBy = null, mainAriaLabel = null, isInPage = true, hasDrawer, isDrawerExpanded }) => {
         let activeStepIndex;
         let activeStepName;
         let activeStepSubName;
@@ -20925,7 +20932,9 @@
             React__namespace.createElement("div", { className: css(styles$8.wizardOuterWrap) },
                 React__namespace.createElement("div", { className: css(styles$8.wizardInnerWrap) },
                     nav(isNavOpen),
-                    React__namespace.createElement(WizardBody, { mainComponent: isInPage ? 'div' : 'main', "aria-label": mainAriaLabel, "aria-labelledby": mainAriaLabelledBy, hasNoBodyPadding: hasNoBodyPadding }, activeStep.component)),
+                    React__namespace.createElement(WizardBody, { mainComponent: isInPage ? 'div' : 'main', "aria-label": mainAriaLabel, "aria-labelledby": mainAriaLabelledBy, hasNoBodyPadding: hasNoBodyPadding, activeStep: activeStep, isDrawerExpanded: isDrawerExpanded, hasDrawer: hasDrawer },
+                        hasDrawer && !isDrawerExpanded && activeStep.drawerToggleButton,
+                        activeStep.component)),
                 children)));
     };
     WizardToggle.displayName = 'WizardToggle';
@@ -21132,6 +21141,7 @@
                 currentStep: this.props.startAtStep && Number.isInteger(this.props.startAtStep) ? this.props.startAtStep : 1,
                 isNavOpen: false
             };
+            this.drawerRef = React__namespace.createRef();
         }
         componentDidMount() {
             const target = typeof document !== 'undefined' ? document.body : null;
@@ -21148,7 +21158,7 @@
         render() {
             const _a = this.props, { 
             /* eslint-disable @typescript-eslint/no-unused-vars */
-            width, height, title, description, descriptionComponent, onClose, onSave, onBack, onNext, onGoToStep, className, steps, startAtStep, nextButtonText = 'Next', backButtonText = 'Back', cancelButtonText = 'Cancel', hideClose, closeButtonAriaLabel = 'Close', navAriaLabel, navAriaLabelledBy, mainAriaLabel, mainAriaLabelledBy, hasNoBodyPadding, footer, appendTo, isOpen, titleId, descriptionId, isNavExpandable } = _a, rest = __rest$1(_a, ["width", "height", "title", "description", "descriptionComponent", "onClose", "onSave", "onBack", "onNext", "onGoToStep", "className", "steps", "startAtStep", "nextButtonText", "backButtonText", "cancelButtonText", "hideClose", "closeButtonAriaLabel", "navAriaLabel", "navAriaLabelledBy", "mainAriaLabel", "mainAriaLabelledBy", "hasNoBodyPadding", "footer", "appendTo", "isOpen", "titleId", "descriptionId", "isNavExpandable"])
+            width, height, title, description, descriptionComponent, onClose, onSave, onBack, onNext, onGoToStep, className, steps, startAtStep, nextButtonText = 'Next', backButtonText = 'Back', cancelButtonText = 'Cancel', hideClose, closeButtonAriaLabel = 'Close', navAriaLabel, navAriaLabelledBy, mainAriaLabel, mainAriaLabelledBy, hasNoBodyPadding, footer, appendTo, isOpen, titleId, descriptionId, isNavExpandable, hasDrawer, isDrawerExpanded } = _a, rest = __rest$1(_a, ["width", "height", "title", "description", "descriptionComponent", "onClose", "onSave", "onBack", "onNext", "onGoToStep", "className", "steps", "startAtStep", "nextButtonText", "backButtonText", "cancelButtonText", "hideClose", "closeButtonAriaLabel", "navAriaLabel", "navAriaLabelledBy", "mainAriaLabel", "mainAriaLabelledBy", "hasNoBodyPadding", "footer", "appendTo", "isOpen", "titleId", "descriptionId", "isNavExpandable", "hasDrawer", "isDrawerExpanded"])
             /* eslint-enable @typescript-eslint/no-unused-vars */
             ;
             const { currentStep } = this.state;
@@ -21212,7 +21222,7 @@
             const wizard = (React__namespace.createElement(WizardContextProvider, { value: context },
                 React__namespace.createElement("div", Object.assign({}, rest, { className: css(styles$8.wizard, activeStep && activeStep.isFinishedStep && 'pf-m-finished', className), style: Object.keys(divStyles).length ? divStyles : undefined }),
                     title && (React__namespace.createElement(WizardHeader, { titleId: this.titleId, descriptionId: this.descriptionId, onClose: onClose, title: title, description: description, descriptionComponent: descriptionComponent, closeButtonAriaLabel: closeButtonAriaLabel, hideClose: hideClose })),
-                    React__namespace.createElement(WizardToggle, { mainAriaLabel: mainAriaLabel, isInPage: isOpen === undefined, mainAriaLabelledBy: (title || mainAriaLabelledBy) && (mainAriaLabelledBy || this.titleId), isNavOpen: this.state.isNavOpen, onNavToggle: isNavOpen => this.setState({ isNavOpen }), nav: nav, steps: steps, activeStep: activeStep, hasNoBodyPadding: hasNoBodyPadding }, footer || (React__namespace.createElement(WizardFooterInternal, { onNext: this.onNext, onBack: this.onBack, onClose: onClose, isValid: isValid, firstStep: firstStep, activeStep: activeStep, nextButtonText: (activeStep && activeStep.nextButtonText) || nextButtonText, backButtonText: backButtonText, cancelButtonText: cancelButtonText }))))));
+                    React__namespace.createElement(WizardToggle, { hasDrawer: hasDrawer, isDrawerExpanded: isDrawerExpanded, mainAriaLabel: mainAriaLabel, isInPage: isOpen === undefined, mainAriaLabelledBy: (title || mainAriaLabelledBy) && (mainAriaLabelledBy || this.titleId), isNavOpen: this.state.isNavOpen, onNavToggle: isNavOpen => this.setState({ isNavOpen }), nav: nav, steps: steps, activeStep: activeStep, hasNoBodyPadding: hasNoBodyPadding }, footer || (React__namespace.createElement(WizardFooterInternal, { onNext: this.onNext, onBack: this.onBack, onClose: onClose, isValid: isValid, firstStep: firstStep, activeStep: activeStep, nextButtonText: (activeStep && activeStep.nextButtonText) || nextButtonText, backButtonText: backButtonText, cancelButtonText: cancelButtonText }))))));
             if (isOpen !== undefined) {
                 return (React__namespace.createElement(Modal, { width: width !== null ? width : undefined, isOpen: isOpen, variant: exports.ModalVariant.large, "aria-labelledby": this.titleId, "aria-describedby": this.descriptionId, showClose: false, hasNoBodyWrapper: true }, wizard));
             }
@@ -21246,7 +21256,9 @@
         onClose: () => undefined,
         appendTo: null,
         isOpen: undefined,
-        isNavExpandable: false
+        isNavExpandable: false,
+        hasDrawer: false,
+        isDrawerExpanded: false
     };
 
     const WizardFooter = ({ children }) => (React__namespace.createElement("footer", { className: css(styles$8.wizardFooter) }, children));