carbon-react 111.12.3 → 111.12.5

package/lib/components/accordion/accordion-group/accordion-group.component.js

@@ -4,26 +4,38 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.AccordionGroup = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _invariant = _interopRequireDefault(require("invariant"));
+
 var _events = _interopRequireDefault(require("../../../__internal__/utils/helpers/events"));
+
 var _accordion = _interopRequireDefault(require("../accordion.component"));
+
 var _accordion2 = require("../accordion.style");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const AccordionGroup = ({
   children,
   ...rest
 }) => {
   const hasProperChildren = (0, _react.useMemo)(() => {
     let hasAccordionChildren = true;
+
     _react.default.Children.toArray(children).forEach(child => {
       if (typeof child === "string" || /*#__PURE__*/_react.default.isValidElement(child) && child.type.displayName !== "Accordion") {
         hasAccordionChildren = false;
       }
     });
+
     return hasAccordionChildren;
   }, [children]);
   !hasProperChildren ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, `AccordionGroup accepts only children of type \`${_accordion.default.displayName}\`.`) : (0, _invariant.default)(false) : void 0;
@@ -33,14 +45,18 @@ const AccordionGroup = ({
   const refs = (0, _react.useMemo)(() => filteredChildren.map(child => child.ref || /*#__PURE__*/_react.default.createRef()), [filteredChildren]);
   const focusAccordion = (0, _react.useCallback)((ev, index) => {
     ev.preventDefault();
+
     if (index === -1) {
       var _refs$current;
+
       (_refs$current = refs[refs.length - 1].current) === null || _refs$current === void 0 ? void 0 : _refs$current.focus();
     } else if (index === refs.length) {
       var _refs$0$current;
+
       (_refs$0$current = refs[0].current) === null || _refs$0$current === void 0 ? void 0 : _refs$0$current.focus();
     } else {
       var _refs$index$current;
+
       (_refs$index$current = refs[index].current) === null || _refs$index$current === void 0 ? void 0 : _refs$index$current.focus();
     }
   }, [refs]);
@@ -48,12 +64,15 @@ const AccordionGroup = ({
     if (_events.default.isUpKey(ev)) {
       focusAccordion(ev, index - 1);
     }
+
     if (_events.default.isDownKey(ev)) {
       focusAccordion(ev, index + 1);
     }
+
     if (_events.default.isHomeKey(ev)) {
       focusAccordion(ev, 0);
     }
+
     if (_events.default.isEndKey(ev)) {
       focusAccordion(ev, refs.length - 1);
     }
@@ -67,6 +86,7 @@ const AccordionGroup = ({
     handleKeyboardAccessibility
   })));
 };
+
 exports.AccordionGroup = AccordionGroup;
 AccordionGroup.propTypes = {
   "children": _propTypes.default.oneOfType([_propTypes.default.element, _propTypes.default.shape({

package/lib/components/accordion/accordion.component.js

@@ -4,17 +4,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Accordion = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _useResizeObserver = _interopRequireDefault(require("../../hooks/__internal__/useResizeObserver"));
+
 var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
+
 var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
+
 var _accordion = require("./accordion.style");
+
 var _validations = _interopRequireDefault(require("../../__internal__/validations"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const Accordion = /*#__PURE__*/_react.default.forwardRef(({
   borders = "default",
   defaultExpanded,
@@ -48,22 +60,26 @@ const Accordion = /*#__PURE__*/_react.default.forwardRef(({
   const isExpanded = isControlled ? expanded : isExpandedInternal;
   (0, _useResizeObserver.default)(accordionContent, () => {
     var _accordionContent$cur;
+
     setContentHeight((_accordionContent$cur = accordionContent.current) === null || _accordionContent$cur === void 0 ? void 0 : _accordionContent$cur.scrollHeight);
   });
   (0, _react.useEffect)(() => {
     var _accordionContent$cur2;
+
     setContentHeight((_accordionContent$cur2 = accordionContent.current) === null || _accordionContent$cur2 === void 0 ? void 0 : _accordionContent$cur2.scrollHeight);
   }, [isExpanded]);
   const toggleAccordion = (0, _react.useCallback)(ev => {
     if (!isControlled) {
       setIsExpandedInternal(!isExpanded);
     }
+
     if (onChange) onChange(ev, !isExpanded);
   }, [isControlled, isExpanded, onChange]);
   const handleKeyDown = (0, _react.useCallback)(ev => {
     if (handleKeyboardAccessibility) {
       handleKeyboardAccessibility(ev, index);
     }
+
     if (_events.default.isEnterKey(ev) || _events.default.isSpaceKey(ev)) {
       toggleAccordion(ev);
     }
@@ -73,7 +89,9 @@ const Accordion = /*#__PURE__*/_react.default.forwardRef(({
   const headerId = `AccordionHeader_${guid.current}`;
   const contentId = `AccordionContent_${guid.current}`;
   const showValidationIcon = !!(error || warning || info);
+
   const getTitle = () => isExpanded ? openTitle || title : title;
+
   return /*#__PURE__*/_react.default.createElement(_accordion.StyledAccordionContainer, _extends({
     id: accordionId,
     "data-component": "accordion",
@@ -129,6 +147,7 @@ const Accordion = /*#__PURE__*/_react.default.forwardRef(({
     disableContentPadding: disableContentPadding
   }, children)));
 });
+
 exports.Accordion = Accordion;
 Accordion.propTypes = {
   "borders": _propTypes.default.oneOf(["default", "full", "none"]),

package/lib/components/accordion/accordion.style.js

@@ -4,14 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledAccordionContentContainer = exports.StyledAccordionContent = exports.StyledAccordionIcon = exports.StyledAccordionTitle = exports.StyledAccordionTitleContainer = exports.StyledAccordionSubTitle = exports.StyledAccordionHeadingsContainer = exports.StyledAccordionContainer = exports.StyledAccordionGroup = void 0;
+
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
 var _styledSystem = require("styled-system");
+
 var _icon = _interopRequireDefault(require("../icon"));
+
 var _themes = require("../../style/themes");
+
 var _validationIcon = _interopRequireDefault(require("../../__internal__/validations/validation-icon.style"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const StyledAccordionGroup = _styledComponents.default.div`
   ${_styledSystem.margin}
 `;

package/lib/components/accordion/index.js

@@ -15,6 +15,9 @@ Object.defineProperty(exports, "AccordionGroup", {
     return _accordionGroup.default;
   }
 });
+
 var _accordion = _interopRequireDefault(require("./accordion.component"));
+
 var _accordionGroup = _interopRequireDefault(require("./accordion-group/accordion-group.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/action-popover/action-popover-context.js

@@ -4,8 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const ActionPopoverContext = /*#__PURE__*/_react.default.createContext(null);
+
 var _default = ActionPopoverContext;
 exports.default = _default;

package/lib/components/action-popover/action-popover-divider/action-popover-divider.component.js

@@ -4,7 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _actionPopover = require("../action-popover.style");
+
 _actionPopover.MenuItemDivider.displayName = "ActionPopoverDivider";
 var _default = _actionPopover.MenuItemDivider;
 exports.default = _default;

package/lib/components/action-popover/action-popover-item/action-popover-item.component.js

@@ -4,23 +4,39 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ActionPopoverItem = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _invariant = _interopRequireDefault(require("invariant"));
+
 var _actionPopover = require("../action-popover.style");
+
 var _events = _interopRequireDefault(require("../../../__internal__/utils/helpers/events"));
+
 var _guid = _interopRequireDefault(require("../../../__internal__/utils/helpers/guid"));
+
 var _actionPopoverContext = _interopRequireDefault(require("../action-popover-context"));
+
 var _useLocale = _interopRequireDefault(require("../../../hooks/__internal__/useLocale"));
+
 var _actionPopoverMenu = _interopRequireDefault(require("../action-popover-menu/action-popover-menu.component"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const INTERVAL = 150;
+
 function checkRef(ref) {
   return Boolean(ref && ref.current);
 }
+
 function leftAlignSubmenu(ref, submenuRef) {
   /* istanbul ignore if */
   if (!ref.current || !submenuRef.current) return true;
@@ -32,6 +48,7 @@ function leftAlignSubmenu(ref, submenuRef) {
   } = submenuRef.current;
   return left >= offsetWidth;
 }
+
 function getContainerPosition(itemRef, submenuRef, placement) {
   /* istanbul ignore if */
   if (!itemRef.current || !submenuRef.current) return undefined;
@@ -49,6 +66,7 @@ function getContainerPosition(itemRef, submenuRef, placement) {
     right: "auto"
   };
 }
+
 const ActionPopoverItem = ({
   children,
   icon,
@@ -95,8 +113,10 @@ const ActionPopoverItem = ({
   }, [submenu, placement]);
   (0, _react.useEffect)(() => {
     alignSubmenu();
+
     if (focusItem) {
       var _ref$current;
+
       (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.focus();
     }
   }, [alignSubmenu, focusItem]);
@@ -115,14 +135,17 @@ const ActionPopoverItem = ({
   }, [alignSubmenu]);
   const onClick = (0, _react.useCallback)(e => {
     e.stopPropagation();
+
     if (!disabled) {
       setOpenPopover(false);
       focusButton();
+
       if (onClickProp) {
         onClickProp(e);
       }
     } else {
       var _ref$current2;
+
       (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.focus();
       e.preventDefault();
     }
@@ -145,6 +168,7 @@ const ActionPopoverItem = ({
             e.stopPropagation();
           } else if (_events.default.isRightKey(e)) {
             var _ref$current3;
+
             setOpen(false);
             (_ref$current3 = ref.current) === null || _ref$current3 === void 0 ? void 0 : _ref$current3.focus();
             e.stopPropagation();
@@ -156,19 +180,24 @@ const ActionPopoverItem = ({
             setFocusIndex(0);
             e.stopPropagation();
           }
+
           if (_events.default.isLeftKey(e)) {
             var _ref$current4;
+
             setOpen(false);
             (_ref$current4 = ref.current) === null || _ref$current4 === void 0 ? void 0 : _ref$current4.focus();
             e.stopPropagation();
           }
         }
+
         e.preventDefault();
       } else if (_events.default.isEnterKey(e)) {
         if (isHref && download) {
           var _ref$current5;
+
           (_ref$current5 = ref.current) === null || _ref$current5 === void 0 ? void 0 : _ref$current5.click();
         }
+
         e.preventDefault();
         onClick(e);
       }
@@ -176,8 +205,7 @@ const ActionPopoverItem = ({
       e.stopPropagation();
     }
   }, [disabled, download, focusButton, isHref, isLeftAligned, onClick, setOpenPopover, submenu]);
-  const itemSubmenuProps = {
-    ...(!disabled && {
+  const itemSubmenuProps = { ...(!disabled && {
       onMouseEnter: e => {
         if (mouseEnterTimer.current) clearTimeout(mouseEnterTimer.current);
         setFocusIndex(-1);
@@ -195,6 +223,7 @@ const ActionPopoverItem = ({
       },
       onClick: e => {
         var _ref$current6;
+
         setOpen(true);
         (_ref$current6 = ref.current) === null || _ref$current6 === void 0 ? void 0 : _ref$current6.focus();
         e.preventDefault();
@@ -206,12 +235,14 @@ const ActionPopoverItem = ({
     "aria-controls": `ActionPopoverMenu_${guid}`,
     "aria-expanded": isOpen
   };
+
   const renderMenuItemIcon = () => {
     return icon && /*#__PURE__*/_react.default.createElement(_actionPopover.MenuItemIcon, {
       as: undefined,
       type: icon
     });
   };
+
   return /*#__PURE__*/_react.default.createElement(_actionPopover.StyledMenuItem, _extends({}, rest, {
     ref: ref,
     onClick: onClick,
@@ -243,6 +274,7 @@ const ActionPopoverItem = ({
     type: "chevron_right"
   }) : null);
 };
+
 exports.ActionPopoverItem = ActionPopoverItem;
 ActionPopoverItem.propTypes = {
   "children": _propTypes.default.string.isRequired,

package/lib/components/action-popover/action-popover-menu/action-popover-menu.component.js

@@ -4,18 +4,31 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _invariant = _interopRequireDefault(require("invariant"));
+
 var _actionPopover = require("../action-popover.style");
+
 var _events = _interopRequireDefault(require("../../../__internal__/utils/helpers/events"));
+
 var _actionPopoverItem = _interopRequireDefault(require("../action-popover-item/action-popover-item.component"));
+
 var _actionPopoverDivider = _interopRequireDefault(require("../action-popover-divider/action-popover-divider.component"));
+
 var _actionPopoverContext = _interopRequireDefault(require("../action-popover-context"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
   children,
   parentID,
@@ -39,8 +52,10 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
       if (! /*#__PURE__*/_react.default.isValidElement(child)) {
         return true;
       }
+
       return child.type !== _actionPopoverItem.default && child.type !== _actionPopoverDivider.default;
     });
+
     return !incorrectChild;
   }, [children]);
   !hasProperChildren ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, `ActionPopoverMenu only accepts children of type \`${_actionPopoverItem.default.displayName}\`` + ` and \`${_actionPopoverDivider.default.displayName}\`.`) : (0, _invariant.default)(false) : void 0;
@@ -51,8 +66,8 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
   }, [children]);
   const onKeyDown = (0, _react.useCallback)(e => {
     if (_events.default.isTabKey(e)) {
-      e.preventDefault();
-      // TAB: close menu and allow focus to change to next focusable element
+      e.preventDefault(); // TAB: close menu and allow focus to change to next focusable element
+
       focusButton();
       setOpen(false);
     } else if (_events.default.isDownKey(e)) {
@@ -83,16 +98,19 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
       e.stopPropagation();
       let firstMatch;
       let nextMatch;
+
       _react.default.Children.forEach(items, (child, index) => {
         if ( /*#__PURE__*/_react.default.isValidElement(child) && child.props.children.toLowerCase().startsWith(e.key.toLowerCase())) {
           if (firstMatch === undefined) {
             firstMatch = index;
           }
+
           if (index > focusIndex && nextMatch === undefined) {
             nextMatch = index;
           }
         }
       });
+
       if (nextMatch !== undefined) {
         setFocusIndex(nextMatch);
       } else if (firstMatch !== undefined) {
@@ -111,6 +129,7 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
           horizontalAlignment
         });
       }
+
       return child;
     });
   }, [children, focusIndex, isOpen, placement, horizontalAlignment]);
@@ -124,6 +143,7 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
     ref: ref
   }, rest), clonedChildren);
 });
+
 ActionPopoverMenu.propTypes = {
   "children": _propTypes.default.node,
   "data-element": _propTypes.default.string,

package/lib/components/action-popover/action-popover-menu-button/action-popover-menu-button.component.js

@@ -4,12 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _actionPopover = require("../action-popover.style");
+
 var _button = _interopRequireDefault(require("../../button"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const ActionPopoverMenuButton = ({
   buttonType,
   iconType,
@@ -23,6 +30,7 @@ const ActionPopoverMenuButton = ({
   iconPosition: iconPosition,
   size: size
 }, props), children));
+
 ActionPopoverMenuButton.propTypes = {
   "ariaAttributes": _propTypes.default.shape({
     "aria-controls": _propTypes.default.string.isRequired,

package/lib/components/action-popover/action-popover.component.js

@@ -4,24 +4,43 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ActionPopover = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _invariant = _interopRequireDefault(require("invariant"));
+
 var _actionPopover = require("./action-popover.style");
+
 var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
+
 var _popover = _interopRequireDefault(require("../../__internal__/popover"));
+
 var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
+
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
+
 var _actionPopoverMenu = _interopRequireDefault(require("./action-popover-menu/action-popover-menu.component"));
+
 var _actionPopoverItem = _interopRequireDefault(require("./action-popover-item/action-popover-item.component"));
+
 var _actionPopoverDivider = _interopRequireDefault(require("./action-popover-divider/action-popover-divider.component"));
+
 var _actionPopoverContext = _interopRequireDefault(require("./action-popover-context"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 const onOpenDefault = () => {};
+
 const onCloseDefault = () => {};
+
 const ActionPopover = ({
   children,
   id,
@@ -49,8 +68,10 @@ const ActionPopover = ({
       if (! /*#__PURE__*/_react.default.isValidElement(child)) {
         return true;
       }
+
       return child.type !== _actionPopoverItem.default && child.type !== _actionPopoverDivider.default;
     });
+
     return !incorrectChild;
   }, [children]);
   !hasProperChildren ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, `ActionPopover only accepts children of type \`${_actionPopoverItem.default.displayName}\`` + ` and \`${_actionPopoverDivider.default.displayName}\`.`) : (0, _invariant.default)(false) : void 0;
@@ -58,25 +79,31 @@ const ActionPopover = ({
     if (placement === "top" && !rightAlignMenu) {
       return "top-end";
     }
+
     if (placement === "top" && rightAlignMenu) {
       return "top-start";
     }
+
     if (placement === "bottom" && rightAlignMenu) {
       return "bottom-start";
     }
+
     return "bottom-end";
   }, [placement, rightAlignMenu]);
   const setOpen = (0, _react.useCallback)(value => {
     if (value && !isOpen) {
       onOpen();
     }
+
     if (!value && isOpen) {
       onClose();
     }
+
     setOpenState(value);
   }, [isOpen, onOpen, onClose]);
   const focusButton = (0, _react.useCallback)(() => {
     var _buttonRef$current;
+
     const button = (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.querySelector("[data-element='action-popover-button']");
     button === null || button === void 0 ? void 0 : button.focus();
   }, []);
@@ -84,13 +111,12 @@ const ActionPopover = ({
     e.stopPropagation();
     const isOpening = !isOpen;
     setOpen(isOpening);
+
     if (!isOpening) {
       // Closing the menu should focus the MenuButton
       focusButton();
     }
-  }, [isOpen, setOpen, focusButton]);
-
-  // Keyboard commands implemented as recommended by WAI-ARIA best practices
+  }, [isOpen, setOpen, focusButton]); // Keyboard commands implemented as recommended by WAI-ARIA best practices
   // https://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-actions.html
 
   const onButtonKeyDown = (0, _react.useCallback)(e => {
@@ -113,13 +139,14 @@ const ActionPopover = ({
       // If the event didn't came from part of this component, close the menu.
       // There will be multiple document click listeners but we cant prevent propagation because it will interfere with
       // other instances on the same page
-
       const isInMenu = menu.current && menu.current.contains(target);
       const isInButton = buttonRef.current && buttonRef.current.contains(target);
+
       if (!isInMenu && !isInButton) {
         setOpen(false);
       }
     };
+
     const event = "click";
     document.addEventListener(event, handler, {
       capture: true
@@ -130,6 +157,7 @@ const ActionPopover = ({
       });
     };
   }, [setOpen]);
+
   const menuButton = menuID => {
     if (renderButton) {
       return renderButton({
@@ -143,6 +171,7 @@ const ActionPopover = ({
         }
       });
     }
+
     return /*#__PURE__*/_react.default.createElement(_actionPopover.StyledButtonIcon, {
       role: "button",
       "aria-haspopup": "true",
@@ -155,6 +184,7 @@ const ActionPopover = ({
       type: "ellipsis_vertical"
     }));
   };
+
   const parentID = id || `ActionPopoverButton_${guid}`;
   const menuID = `ActionPopoverMenu_${guid}`;
   const menuProps = {
@@ -191,6 +221,7 @@ const ActionPopover = ({
     ref: menu
   }, menuProps), children))));
 };
+
 exports.ActionPopover = ActionPopover;
 ActionPopover.propTypes = {
   "children": _propTypes.default.node,

package/lib/components/action-popover/action-popover.style.js

@@ -4,15 +4,25 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledMenuItem = exports.MenuButtonOverrideWrapper = exports.SubMenuItemIcon = exports.MenuItemDivider = exports.MenuItemIcon = exports.StyledButtonIcon = exports.ButtonIcon = exports.MenuButton = exports.Menu = void 0;
+
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
 var _styledSystem = require("styled-system");
+
 var _icon = _interopRequireDefault(require("../icon"));
+
 var _icon2 = _interopRequireDefault(require("../icon/icon.style"));
+
 var _button = _interopRequireDefault(require("../button/button.style"));
+
 var _browserTypeCheck = require("../../__internal__/utils/helpers/browser-type-check");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const Menu = _styledComponents.default.div`
   ${({
   isOpen