@kaizen/components 3.3.1 → 3.3.3

package/dist/esm/src/MenuV1/subcomponents/MenuList/MenuList.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React, { useId, cloneElement } from 'react';
+import React__default, { useId, cloneElement } from 'react';
 import modules_d1c0b4e0 from './MenuList.module.scss.mjs';
 const MenuList = /*#__PURE__*/function () {
   const MenuList = function (props) {
@@ -9,9 +9,9 @@ const MenuList = /*#__PURE__*/function () {
       restProps = __rest(props, ["heading", "children"]);
     var reactId = useId();
     var listHeadingID = (_a = heading === null || heading === void 0 ? void 0 : heading.props.id) !== null && _a !== void 0 ? _a : reactId;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, heading && /*#__PURE__*/cloneElement(heading, {
+    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, heading && /*#__PURE__*/cloneElement(heading, {
       id: listHeadingID
-    }), /*#__PURE__*/React.createElement("ul", __assign({
+    }), /*#__PURE__*/React__default.createElement("ul", __assign({
       className: modules_d1c0b4e0.menuSection,
       "aria-labelledby": heading ? listHeadingID : undefined
     }, restProps), children));

package/dist/esm/src/MenuV1/subcomponents/StatelessMenu/StatelessMenu.mjs

@@ -1,69 +1,66 @@
-import React, { useState, useRef, useEffect } from 'react';
+import React__default, { useState, useRef, useEffect } from 'react';
 import ReactDOM from 'react-dom';
 import { MenuDropdown } from '../MenuDropdown/MenuDropdown.mjs';
 import modules_8ea8fd34 from './StatelessMenu.module.scss.mjs';
-const StatelessMenu = /*#__PURE__*/function () {
-  const StatelessMenu = function (_a) {
-    var _b = _a.align,
-      align = _b === void 0 ? 'left' : _b,
-      _c = _a.dropdownWidth,
-      dropdownWidth = _c === void 0 ? 'default' : _c,
-      _d = _a.autoHide,
-      autoHide = _d === void 0 ? 'on' : _d,
-      dataTestId = _a["data-testid"],
-      dropdownId = _a.dropdownId,
-      children = _a.children,
-      portalSelector = _a.portalSelector,
-      isMenuVisible = _a.isMenuVisible,
-      toggleMenuDropdown = _a.toggleMenuDropdown,
-      hideMenuDropdown = _a.hideMenuDropdown,
-      renderButton = _a.renderButton,
-      onClick = _a.onClick;
-    var _e = useState(null),
-      referenceElement = _e[0],
-      setReferenceElement = _e[1];
-    var portalSelectorElementRef = useRef(null);
-    var menuButton = renderButton({
-      'onClick': function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        toggleMenuDropdown();
-      },
-      'onMouseDown': function (e) {
-        return e.preventDefault();
-      },
-      'aria-expanded': isMenuVisible
-    });
-    useEffect(function () {
-      portalSelectorElementRef.current = portalSelector ? document.querySelector(portalSelector) : null;
-    }, [portalSelector]);
-    useEffect(function () {
-      if (portalSelector && !portalSelectorElementRef.current) {
-        // eslint-disable-next-line no-console
-        console.warn('The portal could not be created using the selector: ' + portalSelector);
-      }
-    }, [portalSelectorElementRef, portalSelector]);
-    var menu = isMenuVisible ? (/*#__PURE__*/React.createElement(MenuDropdown, {
-      referenceElement: referenceElement,
-      align: align,
-      hideMenuDropdown: hideMenuDropdown,
-      width: dropdownWidth,
-      id: dropdownId,
-      autoHide: autoHide
-    }, children)) : null;
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-      React.createElement("div", {
-        "data-testid": dataTestId,
-        onClick: onClick
-      }, /*#__PURE__*/React.createElement("div", {
-        className: modules_8ea8fd34.buttonWrapper,
-        ref: setReferenceElement
-      }, menuButton), portalSelector && portalSelectorElementRef.current ? /*#__PURE__*/ReactDOM.createPortal(menu, portalSelectorElementRef.current) : menu)
-    );
-  };
-  StatelessMenu.displayName = 'StatelessMenu';
-  return StatelessMenu;
-}();
+var StatelessMenu = function (_a) {
+  var _b = _a.align,
+    align = _b === void 0 ? 'left' : _b,
+    _c = _a.dropdownWidth,
+    dropdownWidth = _c === void 0 ? 'default' : _c,
+    _d = _a.autoHide,
+    autoHide = _d === void 0 ? 'on' : _d,
+    dataTestId = _a["data-testid"],
+    dropdownId = _a.dropdownId,
+    children = _a.children,
+    portalSelector = _a.portalSelector,
+    isMenuVisible = _a.isMenuVisible,
+    toggleMenuDropdown = _a.toggleMenuDropdown,
+    hideMenuDropdown = _a.hideMenuDropdown,
+    renderButton = _a.renderButton,
+    onClick = _a.onClick;
+  var _e = useState(null),
+    referenceElement = _e[0],
+    setReferenceElement = _e[1];
+  var portalSelectorElementRef = useRef(null);
+  var menuButton = renderButton({
+    'onClick': function (e) {
+      e.preventDefault();
+      e.stopPropagation();
+      toggleMenuDropdown();
+    },
+    'onMouseDown': function (e) {
+      return e.preventDefault();
+    },
+    'aria-expanded': isMenuVisible
+  });
+  useEffect(function () {
+    portalSelectorElementRef.current = portalSelector ? document.querySelector(portalSelector) : null;
+  }, [portalSelector]);
+  useEffect(function () {
+    if (portalSelector && !portalSelectorElementRef.current) {
+      // eslint-disable-next-line no-console
+      console.warn('The portal could not be created using the selector: ' + portalSelector);
+    }
+  }, [portalSelectorElementRef, portalSelector]);
+  var menu = isMenuVisible ? (/*#__PURE__*/React__default.createElement(MenuDropdown, {
+    referenceElement: referenceElement,
+    align: align,
+    hideMenuDropdown: hideMenuDropdown,
+    width: dropdownWidth,
+    id: dropdownId,
+    autoHide: autoHide
+  }, children)) : null;
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+    React__default.createElement("div", {
+      "data-testid": dataTestId,
+      onClick: onClick
+    }, /*#__PURE__*/React__default.createElement("div", {
+      className: modules_8ea8fd34.buttonWrapper,
+      ref: setReferenceElement
+    }, menuButton), portalSelector && portalSelectorElementRef.current ? /*#__PURE__*/ReactDOM.createPortal(menu, portalSelectorElementRef.current) : menu)
+  );
+};
+StatelessMenu.displayName = 'StatelessMenu';
 export { StatelessMenu };

package/dist/esm/src/Modal/ConfirmationModal/ConfirmationModal.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React from 'react';
+import React__default from 'react';
 import classnames from 'classnames';
 import { Heading } from '../../Heading/Heading.mjs';
 import { Icon } from '../../Icon/Icon.mjs';
@@ -30,17 +30,17 @@ var getIcon = function (variantName, isProminent) {
   if (isProminent) {
     switch (variantName) {
       case 'cautionary':
-        return /*#__PURE__*/React.createElement(Cautionary, null);
+        return /*#__PURE__*/React__default.createElement(Cautionary, null);
       case 'informative':
-        return /*#__PURE__*/React.createElement(Informative, null);
+        return /*#__PURE__*/React__default.createElement(Informative, null);
       case 'warning':
-        return /*#__PURE__*/React.createElement(Negative, null);
+        return /*#__PURE__*/React__default.createElement(Negative, null);
       case 'success':
-        return /*#__PURE__*/React.createElement(Positive, null);
+        return /*#__PURE__*/React__default.createElement(Positive, null);
     }
   }
   var iconName = getIconName(variantName);
-  return /*#__PURE__*/React.createElement(Icon, {
+  return /*#__PURE__*/React__default.createElement(Icon, {
     name: iconName,
     isPresentational: true,
     isFilled: true
@@ -50,80 +50,77 @@ var getIcon = function (variantName, isProminent) {
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093114/Modal Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-modals-confirmationmodal--docs Storybook}
  */
-const ConfirmationModal = /*#__PURE__*/function () {
-  const ConfirmationModal = function (_a) {
-    var isOpen = _a.isOpen,
-      _b = _a.isProminent,
-      isProminent = _b === void 0 ? false : _b,
-      _c = _a.unpadded,
-      unpadded = _c === void 0 ? false : _c,
-      variant = _a.variant,
-      title = _a.title,
-      onConfirm = _a.onConfirm,
-      onAfterLeave = _a.onAfterLeave,
-      onAfterEnter = _a.onAfterEnter,
-      _d = _a.confirmLabel,
-      confirmLabel = _d === void 0 ? 'Confirm' : _d,
-      _e = _a.dismissLabel,
-      dismissLabel = _e === void 0 ? 'Cancel' : _e,
-      confirmWorking = _a.confirmWorking,
-      propsOnDismiss = _a.onDismiss,
-      children = _a.children,
-      className = _a.className,
-      props = __rest(_a, ["isOpen", "isProminent", "unpadded", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children", "className"]);
-    var variantName = variant;
-    var onDismiss = confirmWorking ? undefined : propsOnDismiss;
-    var footerActions = [];
-    if (onConfirm) {
-      var confirmAction = {
-        label: confirmLabel,
-        onClick: onConfirm,
-        destructive: variant === 'warning',
-        primary: variant !== 'warning'
-      };
-      var workingProps = confirmWorking ? {
-        working: true,
-        workingLabel: confirmWorking.label,
-        workingLabelHidden: confirmWorking.labelHidden
-      } : {};
-      footerActions.push(__assign(__assign({}, confirmAction), workingProps));
-    }
-    footerActions.push({
-      label: dismissLabel,
-      onClick: onDismiss,
-      disabled: !!confirmWorking
-    });
-    return /*#__PURE__*/React.createElement(GenericModal, {
-      isOpen: isOpen,
-      onEscapeKeyup: onDismiss,
-      onOutsideModalClick: onDismiss,
-      onAfterLeave: onAfterLeave,
-      onAfterEnter: onAfterEnter,
-      className: className
-    }, /*#__PURE__*/React.createElement("div", __assign({
-      className: modules_67560e97.modal,
-      "data-modal": true
-    }, props), /*#__PURE__*/React.createElement(ModalHeader, {
-      onDismiss: onDismiss
-    }, /*#__PURE__*/React.createElement("div", {
-      className: classnames(modules_67560e97.header, modules_67560e97[variant], isProminent && modules_67560e97.prominent, !unpadded && modules_67560e97.padded)
-    }, /*#__PURE__*/React.createElement("div", {
-      className: classnames(modules_67560e97.iconContainer, isProminent && modules_67560e97.prominent)
-    }, /*#__PURE__*/React.createElement("div", {
-      className: modules_67560e97.spotIcon
-    }, getIcon(variantName, isProminent))), /*#__PURE__*/React.createElement(ModalAccessibleLabel, {
-      isProminent: isProminent
-    }, /*#__PURE__*/React.createElement(Heading, {
-      tag: "h2",
-      variant: "heading-2"
-    }, title)))), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement("div", {
-      className: classnames(isProminent && modules_67560e97.prominent, !unpadded && modules_67560e97.padded)
-    }, /*#__PURE__*/React.createElement(ModalAccessibleDescription, null, children))), /*#__PURE__*/React.createElement(ModalFooter, {
-      actions: footerActions,
-      unpadded: unpadded
-    })));
-  };
-  ConfirmationModal.displayName = 'ConfirmationModal';
-  return ConfirmationModal;
-}();
+var ConfirmationModal = function (_a) {
+  var isOpen = _a.isOpen,
+    _b = _a.isProminent,
+    isProminent = _b === void 0 ? false : _b,
+    _c = _a.unpadded,
+    unpadded = _c === void 0 ? false : _c,
+    variant = _a.variant,
+    title = _a.title,
+    onConfirm = _a.onConfirm,
+    onAfterLeave = _a.onAfterLeave,
+    onAfterEnter = _a.onAfterEnter,
+    _d = _a.confirmLabel,
+    confirmLabel = _d === void 0 ? 'Confirm' : _d,
+    _e = _a.dismissLabel,
+    dismissLabel = _e === void 0 ? 'Cancel' : _e,
+    confirmWorking = _a.confirmWorking,
+    propsOnDismiss = _a.onDismiss,
+    children = _a.children,
+    className = _a.className,
+    props = __rest(_a, ["isOpen", "isProminent", "unpadded", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children", "className"]);
+  var variantName = variant;
+  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
+  var footerActions = [];
+  if (onConfirm) {
+    var confirmAction = {
+      label: confirmLabel,
+      onClick: onConfirm,
+      destructive: variant === 'warning',
+      primary: variant !== 'warning'
+    };
+    var workingProps = confirmWorking ? {
+      working: true,
+      workingLabel: confirmWorking.label,
+      workingLabelHidden: confirmWorking.labelHidden
+    } : {};
+    footerActions.push(__assign(__assign({}, confirmAction), workingProps));
+  }
+  footerActions.push({
+    label: dismissLabel,
+    onClick: onDismiss,
+    disabled: !!confirmWorking
+  });
+  return /*#__PURE__*/React__default.createElement(GenericModal, {
+    isOpen: isOpen,
+    onEscapeKeyup: onDismiss,
+    onOutsideModalClick: onDismiss,
+    onAfterLeave: onAfterLeave,
+    onAfterEnter: onAfterEnter,
+    className: className
+  }, /*#__PURE__*/React__default.createElement("div", __assign({
+    className: modules_67560e97.modal,
+    "data-modal": true
+  }, props), /*#__PURE__*/React__default.createElement(ModalHeader, {
+    onDismiss: onDismiss
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(modules_67560e97.header, modules_67560e97[variant], isProminent && modules_67560e97.prominent, !unpadded && modules_67560e97.padded)
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(modules_67560e97.iconContainer, isProminent && modules_67560e97.prominent)
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: modules_67560e97.spotIcon
+  }, getIcon(variantName, isProminent))), /*#__PURE__*/React__default.createElement(ModalAccessibleLabel, {
+    isProminent: isProminent
+  }, /*#__PURE__*/React__default.createElement(Heading, {
+    tag: "h2",
+    variant: "heading-2"
+  }, title)))), /*#__PURE__*/React__default.createElement(ModalBody, null, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(isProminent && modules_67560e97.prominent, !unpadded && modules_67560e97.padded)
+  }, /*#__PURE__*/React__default.createElement(ModalAccessibleDescription, null, children))), /*#__PURE__*/React__default.createElement(ModalFooter, {
+    actions: footerActions,
+    unpadded: unpadded
+  })));
+};
+ConfirmationModal.displayName = 'ConfirmationModal';
 export { ConfirmationModal };

package/dist/esm/src/Modal/ConfirmationModal/ConfirmationModal.module.scss.mjs

@@ -1,28 +1,28 @@
 var modules_67560e97 = {
-  "defaultModalWidth": "ConfirmationModal_module_defaultModalWidth__baa49d4e",
-  "backdropLayer": "ConfirmationModal_module_backdropLayer__baa49d4e",
-  "scrollLayer": "ConfirmationModal_module_scrollLayer__baa49d4e",
-  "modalLayer": "ConfirmationModal_module_modalLayer__baa49d4e",
-  "modal": "ConfirmationModal_module_modal__baa49d4e",
-  "transitionLayer": "ConfirmationModal_module_transitionLayer__baa49d4e",
-  "fade-0-to-0-5": "ConfirmationModal_module_fade0To05__baa49d4e",
-  "custom-1": "ConfirmationModal_module_custom1__baa49d4e",
-  "animatingEnter": "ConfirmationModal_module_animatingEnter__baa49d4e",
-  "custom-3": "ConfirmationModal_module_custom3__baa49d4e",
-  "animatingLeave": "ConfirmationModal_module_animatingLeave__baa49d4e",
-  "fade-0-5-to-0": "ConfirmationModal_module_fade05To0__baa49d4e",
-  "custom-5": "ConfirmationModal_module_custom5__baa49d4e",
-  "unscrollable": "ConfirmationModal_module_unscrollable__baa49d4e",
-  "pseudoScrollbar": "ConfirmationModal_module_pseudoScrollbar__baa49d4e",
-  "hide": "ConfirmationModal_module_hide__baa49d4e",
-  "spotIcon": "ConfirmationModal_module_spotIcon__baa49d4e",
-  "header": "ConfirmationModal_module_header__baa49d4e",
-  "padded": "ConfirmationModal_module_padded__baa49d4e",
-  "iconContainer": "ConfirmationModal_module_iconContainer__baa49d4e",
-  "prominent": "ConfirmationModal_module_prominent__baa49d4e",
-  "success": "ConfirmationModal_module_success__baa49d4e",
-  "informative": "ConfirmationModal_module_informative__baa49d4e",
-  "warning": "ConfirmationModal_module_warning__baa49d4e",
-  "cautionary": "ConfirmationModal_module_cautionary__baa49d4e"
+  "defaultModalWidth": "ConfirmationModal_module_defaultModalWidth__e2ce9ecc",
+  "backdropLayer": "ConfirmationModal_module_backdropLayer__e2ce9ecc",
+  "scrollLayer": "ConfirmationModal_module_scrollLayer__e2ce9ecc",
+  "modalLayer": "ConfirmationModal_module_modalLayer__e2ce9ecc",
+  "modal": "ConfirmationModal_module_modal__e2ce9ecc",
+  "transitionLayer": "ConfirmationModal_module_transitionLayer__e2ce9ecc",
+  "fade-0-to-0-5": "ConfirmationModal_module_fade0To05__e2ce9ecc",
+  "custom-1": "ConfirmationModal_module_custom1__e2ce9ecc",
+  "animatingEnter": "ConfirmationModal_module_animatingEnter__e2ce9ecc",
+  "custom-3": "ConfirmationModal_module_custom3__e2ce9ecc",
+  "animatingLeave": "ConfirmationModal_module_animatingLeave__e2ce9ecc",
+  "fade-0-5-to-0": "ConfirmationModal_module_fade05To0__e2ce9ecc",
+  "custom-5": "ConfirmationModal_module_custom5__e2ce9ecc",
+  "unscrollable": "ConfirmationModal_module_unscrollable__e2ce9ecc",
+  "pseudoScrollbar": "ConfirmationModal_module_pseudoScrollbar__e2ce9ecc",
+  "hide": "ConfirmationModal_module_hide__e2ce9ecc",
+  "spotIcon": "ConfirmationModal_module_spotIcon__e2ce9ecc",
+  "header": "ConfirmationModal_module_header__e2ce9ecc",
+  "padded": "ConfirmationModal_module_padded__e2ce9ecc",
+  "iconContainer": "ConfirmationModal_module_iconContainer__e2ce9ecc",
+  "prominent": "ConfirmationModal_module_prominent__e2ce9ecc",
+  "success": "ConfirmationModal_module_success__e2ce9ecc",
+  "informative": "ConfirmationModal_module_informative__e2ce9ecc",
+  "warning": "ConfirmationModal_module_warning__e2ce9ecc",
+  "cautionary": "ConfirmationModal_module_cautionary__e2ce9ecc"
 };
 export { modules_67560e97 as default };

package/dist/esm/src/Modal/ContextModal/ContextModal.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React from 'react';
+import React__default from 'react';
 import classnames from 'classnames';
 import { Heading } from '../../Heading/Heading.mjs';
 import { GenericModal } from '../GenericModal/GenericModal.mjs';
@@ -15,84 +15,81 @@ import modules_9111028a from './ContextModal.module.scss.mjs';
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093114/Modal Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-modals--contextmodal--docs Storybook}
  */
-const ContextModal = /*#__PURE__*/function () {
-  const ContextModal = function (_a) {
-    var isOpen = _a.isOpen,
-      _b = _a.unpadded,
-      unpadded = _b === void 0 ? false : _b,
-      _c = _a.layout,
-      layout = _c === void 0 ? 'portrait' : _c,
-      title = _a.title,
-      onConfirm = _a.onConfirm,
-      propsOnDismiss = _a.onDismiss,
-      onAfterLeave = _a.onAfterLeave,
-      onAfterEnter = _a.onAfterEnter,
-      _d = _a.confirmLabel,
-      confirmLabel = _d === void 0 ? 'Confirm' : _d,
-      confirmWorking = _a.confirmWorking,
-      renderBackground = _a.renderBackground,
-      children = _a.children,
-      contentHeader = _a.contentHeader,
-      image = _a.image,
-      secondaryLabel = _a.secondaryLabel,
-      onSecondaryAction = _a.onSecondaryAction,
-      className = _a.className,
-      props = __rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction", "className"]);
-    var onDismiss = confirmWorking ? undefined : propsOnDismiss;
-    var footerActions = [];
-    var workingProps = confirmWorking ? {
-      working: true,
-      workingLabel: confirmWorking.label,
-      workingLabelHidden: confirmWorking.labelHidden
-    } : {};
-    if (onConfirm) {
-      var confirmAction = {
-        label: confirmLabel,
-        onClick: onConfirm
-      };
-      footerActions.push(__assign(__assign({}, confirmAction), workingProps));
-    }
-    if (secondaryLabel) {
-      footerActions.push({
-        label: secondaryLabel,
-        onClick: onSecondaryAction,
-        disabled: !!confirmWorking
-      });
-    }
-    return /*#__PURE__*/React.createElement(GenericModal, {
-      isOpen: isOpen,
-      onEscapeKeyup: onDismiss,
-      onOutsideModalClick: onDismiss,
-      onAfterLeave: onAfterLeave,
-      onAfterEnter: onAfterEnter,
-      className: className
-    }, /*#__PURE__*/React.createElement("div", __assign({
-      className: modules_9111028a.modal,
-      "data-modal": true
-    }, props), renderBackground === null || renderBackground === void 0 ? void 0 : renderBackground(), /*#__PURE__*/React.createElement(ModalHeader, {
-      onDismiss: onDismiss
-    }, /*#__PURE__*/React.createElement("div", {
-      className: classnames(modules_9111028a.header, !unpadded && modules_9111028a.padded)
-    }, /*#__PURE__*/React.createElement(ModalAccessibleLabel, null, /*#__PURE__*/React.createElement(Heading, {
-      variant: "heading-2",
-      tag: "h2"
-    }, title)))), contentHeader && /*#__PURE__*/React.createElement("div", {
-      className: modules_9111028a.contentHeader
-    }, contentHeader), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement("div", {
-      className: classnames(modules_9111028a.contentLayout, modules_9111028a["".concat(layout, "Contentlayout")])
-    }, image && /*#__PURE__*/React.createElement("div", {
-      className: modules_9111028a.image
-    }, image), /*#__PURE__*/React.createElement("div", {
-      className: modules_9111028a.content
-    }, children, onConfirm != null && (/*#__PURE__*/React.createElement("div", {
-      className: secondaryLabel ? modules_9111028a.footerWithSecondaryAction : modules_9111028a.footer
-    }))))), /*#__PURE__*/React.createElement(ModalFooter, {
-      variant: image ? 'context' : undefined,
-      actions: footerActions,
-      unpadded: unpadded
-    })));
-  };
-  ContextModal.displayName = 'ContextModal';
-  return ContextModal;
-}();
+var ContextModal = function (_a) {
+  var isOpen = _a.isOpen,
+    _b = _a.unpadded,
+    unpadded = _b === void 0 ? false : _b,
+    _c = _a.layout,
+    layout = _c === void 0 ? 'portrait' : _c,
+    title = _a.title,
+    onConfirm = _a.onConfirm,
+    propsOnDismiss = _a.onDismiss,
+    onAfterLeave = _a.onAfterLeave,
+    onAfterEnter = _a.onAfterEnter,
+    _d = _a.confirmLabel,
+    confirmLabel = _d === void 0 ? 'Confirm' : _d,
+    confirmWorking = _a.confirmWorking,
+    renderBackground = _a.renderBackground,
+    children = _a.children,
+    contentHeader = _a.contentHeader,
+    image = _a.image,
+    secondaryLabel = _a.secondaryLabel,
+    onSecondaryAction = _a.onSecondaryAction,
+    className = _a.className,
+    props = __rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction", "className"]);
+  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
+  var footerActions = [];
+  var workingProps = confirmWorking ? {
+    working: true,
+    workingLabel: confirmWorking.label,
+    workingLabelHidden: confirmWorking.labelHidden
+  } : {};
+  if (onConfirm) {
+    var confirmAction = {
+      label: confirmLabel,
+      onClick: onConfirm
+    };
+    footerActions.push(__assign(__assign({}, confirmAction), workingProps));
+  }
+  if (secondaryLabel) {
+    footerActions.push({
+      label: secondaryLabel,
+      onClick: onSecondaryAction,
+      disabled: !!confirmWorking
+    });
+  }
+  return /*#__PURE__*/React__default.createElement(GenericModal, {
+    isOpen: isOpen,
+    onEscapeKeyup: onDismiss,
+    onOutsideModalClick: onDismiss,
+    onAfterLeave: onAfterLeave,
+    onAfterEnter: onAfterEnter,
+    className: className
+  }, /*#__PURE__*/React__default.createElement("div", __assign({
+    className: modules_9111028a.modal,
+    "data-modal": true
+  }, props), renderBackground === null || renderBackground === void 0 ? void 0 : renderBackground(), /*#__PURE__*/React__default.createElement(ModalHeader, {
+    onDismiss: onDismiss
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(modules_9111028a.header, !unpadded && modules_9111028a.padded)
+  }, /*#__PURE__*/React__default.createElement(ModalAccessibleLabel, null, /*#__PURE__*/React__default.createElement(Heading, {
+    variant: "heading-2",
+    tag: "h2"
+  }, title)))), contentHeader && /*#__PURE__*/React__default.createElement("div", {
+    className: modules_9111028a.contentHeader
+  }, contentHeader), /*#__PURE__*/React__default.createElement(ModalBody, null, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(modules_9111028a.contentLayout, modules_9111028a["".concat(layout, "Contentlayout")])
+  }, image && /*#__PURE__*/React__default.createElement("div", {
+    className: modules_9111028a.image
+  }, image), /*#__PURE__*/React__default.createElement("div", {
+    className: modules_9111028a.content
+  }, children, onConfirm != null && (/*#__PURE__*/React__default.createElement("div", {
+    className: secondaryLabel ? modules_9111028a.footerWithSecondaryAction : modules_9111028a.footer
+  }))))), /*#__PURE__*/React__default.createElement(ModalFooter, {
+    variant: image ? 'context' : undefined,
+    actions: footerActions,
+    unpadded: unpadded
+  })));
+};
+ContextModal.displayName = 'ContextModal';
 export { ContextModal };