carbon-react 154.3.2 → 154.3.3-beta.1

package/lib/components/pod/pod.style.js

@@ -1,356 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StyledUndoButton = exports.StyledTitle = exports.StyledSubtitle = exports.StyledPod = exports.StyledHeader = exports.StyledFooter = exports.StyledEditAction = exports.StyledDeleteButton = exports.StyledContent = exports.StyledBlock = exports.StyledActionsContainer = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _styledSystem = require("styled-system");
-var _themes = require("../../style/themes");
-var _link = require("../link/link.style");
-var _iconButton = _interopRequireDefault(require("../icon-button"));
-var _icon = _interopRequireDefault(require("../icon/icon.style"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const StyledPod = exports.StyledPod = _styledComponents.default.div`
-  ${_styledSystem.margin}
-  display: flex;
-  align-items: flex-start;
-  width: 100%;
-  ${({
-  internalEditButton
-}) => internalEditButton && "position: relative"};
-  ${({
-  height
-}) => height && `height: ${height}`};
-
-  &:focus {
-    outline: none;
-  }
-`;
-const blockBackgrounds = {
-  primary: "var(--colorsUtilityYang100)",
-  secondary: "var(--colorsUtilityMajor025)",
-  tertiary: "var(--colorsUtilityMajor040)",
-  transparent: "var(--colorsUtilityMajorTransparent)",
-  tile: "var(--colorsUtilityYang100)"
-};
-const StyledBlock = exports.StyledBlock = _styledComponents.default.div`
-  ${({
-  variant,
-  softDelete,
-  noBorder,
-  hasButtons,
-  contentTriggersEdit,
-  fullWidth,
-  internalEditButton,
-  isHovered,
-  isFocused
-}) => (0, _styledComponents.css)`
-    box-sizing: border-box;
-    border-radius: var(--borderRadius100);
-    display: flex;
-    flex-direction: column;
-    background-color: ${blockBackgrounds[variant]};
-    width: 100%;
-    height: 100%;
-
-    ${variant === "tile" && "box-shadow: 0 2px 3px 0 rgba(2, 18, 36, 0.2)"};
-
-    ${noBorder ? "border: none" : `border: 1px solid var(--colorsUtilityMajor100)`};
-
-    ${hasButtons && !(fullWidth || internalEditButton) && "width: auto;"};
-
-    ${contentTriggersEdit && "cursor: pointer"};
-
-    ${(isHovered || isFocused) && (0, _styledComponents.css)`
-      background-color: var(--colorsUtilityMajor075);
-
-      ${internalEditButton && variant === "tile" && "background-color: var(--colorsUtilityMajorTransparent);"}
-
-      ${contentTriggersEdit && (0, _styledComponents.css)`
-        background-color: var(--colorsActionMajor600);
-        * {
-          color: var(--colorsUtilityYang100);
-        }
-      `}
-    `}
-
-    ${(!internalEditButton || contentTriggersEdit) && (isFocused ? (0, _styledComponents.css)`
-          outline: 3px solid var(--colorsSemanticFocus500);
-          border: none;
-          padding: ${noBorder ? 0 : 1}px;
-        ` : (0, _styledComponents.css)`
-          outline: none;
-        `)}
-
-      ${softDelete && (0, _styledComponents.css)`
-      border: none;
-      background-color: var(--colorsActionDisabled500);
-
-      & > * {
-        color: var(--colorsUtilityYin065);
-      }
-    `};
-  `}
-`;
-const contentPaddings = {
-  "extra-small": "8px",
-  small: "8px",
-  medium: "16px",
-  large: "32px 24px",
-  "extra-large": "40px"
-};
-const StyledContent = exports.StyledContent = _styledComponents.default.div`
-  text-align: left;
-  padding: ${({
-  size
-}) => contentPaddings[size]};
-  flex-grow: 1;
-`;
-const footerPaddings = {
-  "extra-small": "8px",
-  small: "8px",
-  medium: "8px 16px",
-  large: "16px 24px",
-  "extra-large": "24px 40px"
-};
-const StyledFooter = exports.StyledFooter = _styledComponents.default.div`
-  ${({
-  variant,
-  size,
-  softDelete
-}) => (0, _styledComponents.css)`
-    background-color: var(--colorsUtilityMajor025);
-    border-bottom-left-radius: var(--borderRadius100);
-    border-bottom-right-radius: var(--borderRadius100);
-    box-shadow: inset 0px 1px 1px 0 rgba(0, 0, 0, 0.1);
-    color: var(--colorsUtilityYin090);
-    padding: ${footerPaddings[size]};
-
-    ${softDelete && `color: var(--colorsUtilityYin055)`};
-
-    ${variant === "tile" && `border-top: 1px solid var(--colorsUtilityMajor100)`};
-  `}
-`;
-const StyledActionsContainer = exports.StyledActionsContainer = _styledComponents.default.div`
-  display: flex;
-  flex-direction: column;
-
-  ${({
-  internalEditButton
-}) => internalEditButton && (0, _styledComponents.css)`
-      position: absolute;
-      right: 2px;
-      top: 2px;
-      z-index: 10;
-    `}
-`;
-const actionButtonSizes = {
-  "extra-small": 34,
-  small: 34,
-  medium: 50,
-  large: 50,
-  "extra-large": 50
-};
-const actionButtonBackgrounds = {
-  primary: "var(--colorsActionMajorYang100)",
-  secondary: "var(--colorsActionMinor050)",
-  tertiary: "var(--colorsActionMinor100)",
-  transparent: "var(--colorsActionMajorTransparent)",
-  tile: "var(--colorsActionMajorYang100)"
-};
-const StyledEditAction = exports.StyledEditAction = (0, _styledComponents.default)(_iconButton.default)`
-  && {
-    ${({
-  displayOnlyOnHover,
-  isHovered,
-  isFocused,
-  variant,
-  size,
-  internalEditButton,
-  noBorder
-}) => (0, _styledComponents.css)`
-      cursor: pointer;
-      background-color: ${actionButtonBackgrounds[variant]};
-      border: 1px solid var(--colorsActionMinor200);
-      margin-left: 8px;
-      margin-bottom: 8px;
-      box-sizing: border-box;
-      height: ${`${actionButtonSizes[size]}px`};
-      width: ${`${actionButtonSizes[size]}px`};
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      border-radius: var(--borderRadius100);
-
-      ${_icon.default} {
-        top: -2px;
-        height: 16px;
-        width: 16px;
-        color: var(--colorsActionMajor500);
-      }
-
-      ${displayOnlyOnHover && !(isHovered || isFocused) && "display: none"}
-
-      ${noBorder && "border: none;"}
-
-      ${internalEditButton && (0, _styledComponents.css)`
-        border: none;
-        background: var(--colorsActionMajorTransparent);
-      `}
-    
-      ${(isHovered || isFocused) && !internalEditButton && (0, _styledComponents.css)`
-        background-color: var(--colorsActionMajor600);
-        color: var(--colorsActionMajorYang100);
-
-        ${_icon.default} {
-          color: var(--colorsActionMajorYang100);
-        }
-      `}
-      
-      ${isFocused && (0, _styledComponents.css)`
-        outline: 3px solid var(--colorsSemanticFocus500);
-        border: none;
-      `};
-    `};
-  }
-
-  ${_link.StyledContent} {
-    clip: rect(1px, 1px, 1px, 1px);
-    position: absolute;
-  }
-`;
-const StyledDeleteButton = exports.StyledDeleteButton = (0, _styledComponents.default)(_iconButton.default)`
-  && {
-    ${({
-  noBorder,
-  internalEditButton,
-  isHovered,
-  isFocused,
-  variant,
-  size
-}) => (0, _styledComponents.css)`
-      cursor: pointer;
-      background-color: ${actionButtonBackgrounds[variant]};
-      border: ${noBorder ? "none" : "1px solid var(--colorsActionMinor200)"};
-      margin-left: 8px;
-      margin-bottom: 8px;
-      box-sizing: border-box;
-      height: ${`${actionButtonSizes[size]}px`};
-      width: ${`${actionButtonSizes[size]}px`};
-      border-radius: var(--borderRadius100);
-
-      ${_icon.default} {
-        top: -2px;
-        height: 16px;
-        width: 16px;
-        color: var(--colorsSemanticNegative500);
-      }
-
-      ${internalEditButton && (0, _styledComponents.css)`
-        border: none;
-        background: var(--colorsActionMajorTransparent);
-      `}
-
-      ${(isHovered || isFocused) && !internalEditButton && (0, _styledComponents.css)`
-        background-color: var(--colorsSemanticNegative600);
-        color: var(--colorsActionMajorYang100);
-
-        ${_icon.default} {
-          color: var(--colorsActionMajorYang100);
-        }
-      `}
-  
-      ${isFocused && (0, _styledComponents.css)`
-        outline: 3px solid var(--colorsSemanticFocus500);
-        border: none;
-      `};
-    `}
-  }
-`;
-const StyledUndoButton = exports.StyledUndoButton = (0, _styledComponents.default)(_iconButton.default)`
-  && {
-    ${({
-  isHovered,
-  isFocused,
-  variant,
-  size,
-  noBorder,
-  internalEditButton
-}) => (0, _styledComponents.css)`
-      cursor: pointer;
-      background-color: ${actionButtonBackgrounds[variant]};
-      border: 1px solid var(--colorsActionMinor200);
-      margin-left: 8px;
-      margin-bottom: 8px;
-      box-sizing: border-box;
-      height: ${`${actionButtonSizes[size]}px`};
-      width: ${`${actionButtonSizes[size]}px`};
-      border-radius: var(--borderRadius100);
-
-      ${_icon.default} {
-        top: -2px;
-        height: 16px;
-        width: 16px;
-        color: var(--colorsActionMajor500);
-      }
-
-      ${noBorder && "border: none;"}
-
-      ${internalEditButton && (0, _styledComponents.css)`
-        border: none;
-        background: var(--colorsActionMajorTransparent);
-      `}
-    
-    ${(isHovered || isFocused) && !internalEditButton && (0, _styledComponents.css)`
-        background-color: var(--colorsActionMajor600);
-        color: var(--colorsActionMajorYang100);
-
-        ${_icon.default} {
-          color: var(--colorsActionMajorYang100);
-        }
-      `}
-    
-    ${isFocused && (0, _styledComponents.css)`
-        outline: 3px solid var(--colorsSemanticFocus500);
-        border: none;
-      `};
-    `}
-  }
-`;
-const headerRightAlignMargins = {
-  "extra-small": 20,
-  small: 25,
-  medium: 30,
-  large: 30,
-  "extra-large": 30
-};
-const StyledHeader = exports.StyledHeader = _styledComponents.default.div`
-  ${({
-  alignTitle,
-  internalEditButton,
-  size
-}) => (0, _styledComponents.css)`
-    margin-bottom: 24px;
-    text-align: ${alignTitle};
-
-    ${alignTitle === "right" && internalEditButton && (0, _styledComponents.css)`
-      margin-right: ${headerRightAlignMargins[size]}px;
-    `};
-  `}
-`;
-const StyledSubtitle = exports.StyledSubtitle = _styledComponents.default.h5`
-  margin-top: 8px;
-  font-size: 14px;
-  font-weight: normal;
-`;
-const StyledTitle = exports.StyledTitle = _styledComponents.default.h4`
-  display: inline;
-  font-size: 18px;
-  font-weight: 500;
-`;
-StyledPod.defaultProps = {
-  theme: _themes.baseTheme
-};
+"use strict";var o=require("styled-components"),r=require("styled-system");require("../../style/themes/sage/index.js");var e=require("../../style/themes/base/index.js");require("../../style/themes/none/index.js");var t=require("../link/link.style.js"),i=require("../icon-button/icon-button.component.js"),a=require("../icon/icon.style.js");function n(o){return o&&o.__esModule?o:{default:o}}var l=n(o);const s=l.default.div.withConfig({displayName:"pod.style__StyledPod",componentId:"sc-e7e11b4b-0"})([""," display:flex;align-items:flex-start;width:100%;",";",";&:focus{outline:none;}"],r.margin,(({internalEditButton:o})=>o&&"position: relative"),(({height:o})=>o&&`height: ${o}`)),d={primary:"var(--colorsUtilityYang100)",secondary:"var(--colorsUtilityMajor025)",tertiary:"var(--colorsUtilityMajor040)",transparent:"var(--colorsUtilityMajorTransparent)",tile:"var(--colorsUtilityYang100)"},c=l.default.div.withConfig({displayName:"pod.style__StyledBlock",componentId:"sc-e7e11b4b-1"})(["",""],(({variant:r,softDelete:e,noBorder:t,hasButtons:i,contentTriggersEdit:a,fullWidth:n,internalEditButton:l,isHovered:s,isFocused:c})=>o.css(["box-sizing:border-box;border-radius:var(--borderRadius100);display:flex;flex-direction:column;background-color:",";width:100%;height:100%;",";",";",";",";"," "," ",";"],d[r],"tile"===r&&"box-shadow: 0 2px 3px 0 rgba(2, 18, 36, 0.2)",t?"border: none":"border: 1px solid var(--colorsUtilityMajor100)",i&&!(n||l)&&"width: auto;",a&&"cursor: pointer",(s||c)&&o.css(["background-color:var(--colorsUtilityMajor075);"," ",""],l&&"tile"===r&&"background-color: var(--colorsUtilityMajorTransparent);",a&&o.css(["background-color:var(--colorsActionMajor600);*{color:var(--colorsUtilityYang100);}"])),(!l||a)&&(c?o.css(["outline:3px solid var(--colorsSemanticFocus500);border:none;padding:","px;"],t?0:1):o.css(["outline:none;"])),e&&o.css(["border:none;background-color:var(--colorsActionDisabled500);& > *{color:var(--colorsUtilityYin065);}"])))),p={"extra-small":"8px",small:"8px",medium:"16px",large:"32px 24px","extra-large":"40px"},u=l.default.div.withConfig({displayName:"pod.style__StyledContent",componentId:"sc-e7e11b4b-2"})(["text-align:left;padding:",";flex-grow:1;"],(({size:o})=>p[o])),x={"extra-small":"8px",small:"8px",medium:"8px 16px",large:"16px 24px","extra-large":"24px 40px"},b=l.default.div.withConfig({displayName:"pod.style__StyledFooter",componentId:"sc-e7e11b4b-3"})(["",""],(({variant:r,size:e,softDelete:t})=>o.css(["background-color:var(--colorsUtilityMajor025);border-bottom-left-radius:var(--borderRadius100);border-bottom-right-radius:var(--borderRadius100);box-shadow:inset 0px 1px 1px 0 rgba(0,0,0,0.1);color:var(--colorsUtilityYin090);padding:",";",";",";"],x[e],t&&"color: var(--colorsUtilityYin055)","tile"===r&&"border-top: 1px solid var(--colorsUtilityMajor100)"))),g=l.default.div.withConfig({displayName:"pod.style__StyledActionsContainer",componentId:"sc-e7e11b4b-4"})(["display:flex;flex-direction:column;",""],(({internalEditButton:r})=>r&&o.css(["position:absolute;right:2px;top:2px;z-index:10;"]))),y={"extra-small":34,small:34,medium:50,large:50,"extra-large":50},m={primary:"var(--colorsActionMajorYang100)",secondary:"var(--colorsActionMinor050)",tertiary:"var(--colorsActionMinor100)",transparent:"var(--colorsActionMajorTransparent)",tile:"var(--colorsActionMajorYang100)"},v=l.default(i.default).withConfig({displayName:"pod.style__StyledEditAction",componentId:"sc-e7e11b4b-5"})(["&&{",";}","{clip:rect(1px,1px,1px,1px);position:absolute;}"],(({displayOnlyOnHover:r,isHovered:e,isFocused:t,variant:i,size:n,internalEditButton:l,noBorder:s})=>o.css(["cursor:pointer;background-color:",";border:1px solid var(--colorsActionMinor200);margin-left:8px;margin-bottom:8px;box-sizing:border-box;height:",";width:",";display:flex;align-items:center;justify-content:center;border-radius:var(--borderRadius100);","{top:-2px;height:16px;width:16px;color:var(--colorsActionMajor500);}"," "," "," "," ",";"],m[i],`${y[n]}px`,`${y[n]}px`,a.default,r&&!(e||t)&&"display: none",s&&"border: none;",l&&o.css(["border:none;background:var(--colorsActionMajorTransparent);"]),(e||t)&&!l&&o.css(["background-color:var(--colorsActionMajor600);color:var(--colorsActionMajorYang100);","{color:var(--colorsActionMajorYang100);}"],a.default),t&&o.css(["outline:3px solid var(--colorsSemanticFocus500);border:none;"]))),t.StyledContent),f=l.default(i.default).withConfig({displayName:"pod.style__StyledDeleteButton",componentId:"sc-e7e11b4b-6"})(["&&{","}"],(({noBorder:r,internalEditButton:e,isHovered:t,isFocused:i,variant:n,size:l})=>o.css(["cursor:pointer;background-color:",";border:",";margin-left:8px;margin-bottom:8px;box-sizing:border-box;height:",";width:",";border-radius:var(--borderRadius100);","{top:-2px;height:16px;width:16px;color:var(--colorsSemanticNegative500);}"," "," ",";"],m[n],r?"none":"1px solid var(--colorsActionMinor200)",`${y[l]}px`,`${y[l]}px`,a.default,e&&o.css(["border:none;background:var(--colorsActionMajorTransparent);"]),(t||i)&&!e&&o.css(["background-color:var(--colorsSemanticNegative600);color:var(--colorsActionMajorYang100);","{color:var(--colorsActionMajorYang100);}"],a.default),i&&o.css(["outline:3px solid var(--colorsSemanticFocus500);border:none;"])))),h=l.default(i.default).withConfig({displayName:"pod.style__StyledUndoButton",componentId:"sc-e7e11b4b-7"})(["&&{","}"],(({isHovered:r,isFocused:e,variant:t,size:i,noBorder:n,internalEditButton:l})=>o.css(["cursor:pointer;background-color:",";border:1px solid var(--colorsActionMinor200);margin-left:8px;margin-bottom:8px;box-sizing:border-box;height:",";width:",";border-radius:var(--borderRadius100);","{top:-2px;height:16px;width:16px;color:var(--colorsActionMajor500);}"," "," "," ",";"],m[t],`${y[i]}px`,`${y[i]}px`,a.default,n&&"border: none;",l&&o.css(["border:none;background:var(--colorsActionMajorTransparent);"]),(r||e)&&!l&&o.css(["background-color:var(--colorsActionMajor600);color:var(--colorsActionMajorYang100);","{color:var(--colorsActionMajorYang100);}"],a.default),e&&o.css(["outline:3px solid var(--colorsSemanticFocus500);border:none;"])))),j={"extra-small":20,small:25,medium:30,large:30,"extra-large":30},M=l.default.div.withConfig({displayName:"pod.style__StyledHeader",componentId:"sc-e7e11b4b-8"})(["",""],(({alignTitle:r,internalEditButton:e,size:t})=>o.css(["margin-bottom:24px;text-align:",";",";"],r,"right"===r&&e&&o.css(["margin-right:","px;"],j[t])))),S=l.default.h5.withConfig({displayName:"pod.style__StyledSubtitle",componentId:"sc-e7e11b4b-9"})(["margin-top:8px;font-size:14px;font-weight:normal;"]),A=l.default.h4.withConfig({displayName:"pod.style__StyledTitle",componentId:"sc-e7e11b4b-10"})(["display:inline;font-size:18px;font-weight:500;"]);s.defaultProps={theme:e.default},exports.StyledActionsContainer=g,exports.StyledBlock=c,exports.StyledContent=u,exports.StyledDeleteButton=f,exports.StyledEditAction=v,exports.StyledFooter=b,exports.StyledHeader=M,exports.StyledPod=s,exports.StyledSubtitle=S,exports.StyledTitle=A,exports.StyledUndoButton=h;

package/lib/components/popover-container/index.js

@@ -1,13 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _popoverContainer.default;
-  }
-});
-var _popoverContainer = _interopRequireDefault(require("./popover-container.component"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./popover-container.component.js");exports.default=e.PopoverContainer;

package/lib/components/popover-container/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "../../../esm/components/popover-container/index.js",
   "main": "./index.js",
+  "module": "../../../esm/components/popover-container/index.js",
   "types": "./index.d.ts"
 }

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

@@ -1,260 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.renderOpen = exports.renderClose = exports.default = exports.PopoverContainer = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactTransitionGroup = require("react-transition-group");
-var _dom = require("@floating-ui/dom");
-var _useMediaQuery = _interopRequireDefault(require("../../hooks/useMediaQuery"));
-var _popoverContainer = require("./popover-container.style");
-var _icon = _interopRequireDefault(require("../icon"));
-var _popover = _interopRequireDefault(require("../../__internal__/popover"));
-var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
-var _utils = require("../../style/utils");
-var _useClickAwayListener = _interopRequireDefault(require("../../hooks/__internal__/useClickAwayListener"));
-var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
-var _focusTrap = _interopRequireDefault(require("../../__internal__/focus-trap"));
-var _modal = _interopRequireDefault(require("../modal/__internal__/modal.context"));
-var _useFocusPortalContent = _interopRequireDefault(require("../../hooks/__internal__/useFocusPortalContent"));
-var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags/tags"));
-var _focusTrapUtils = require("../../__internal__/focus-trap/focus-trap-utils");
-var _flatTable = _interopRequireDefault(require("../flat-table/__internal__/flat-table.context"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const renderOpen = ({
-  tabIndex,
-  onClick,
-  "data-element": dataElement,
-  ref,
-  "aria-label": ariaLabel,
-  id,
-  "aria-expanded": ariaExpanded,
-  "aria-haspopup": ariaHasPopup
-}) => {
-  return /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerOpenIcon, {
-    tabIndex: tabIndex,
-    onClick: onClick,
-    "data-element": dataElement,
-    ref: ref,
-    "aria-label": ariaLabel,
-    "aria-haspopup": ariaHasPopup,
-    "aria-expanded": ariaExpanded,
-    id: id
-  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-    type: "settings"
-  }));
-};
-exports.renderOpen = renderOpen;
-const renderClose = ({
-  "data-element": dataElement,
-  tabIndex,
-  onClick,
-  ref,
-  "aria-label": ariaLabel,
-  closeButtonDataProps
-}) => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerCloseIcon, _extends({
-  tabIndex: tabIndex,
-  onClick: onClick,
-  ref: ref,
-  "aria-label": ariaLabel
-}, (0, _tags.default)("close", {
-  "data-element": dataElement,
-  ...closeButtonDataProps
-})), /*#__PURE__*/_react.default.createElement(_icon.default, {
-  type: "close"
-}));
-exports.renderClose = renderClose;
-function usePopoverMiddleware(shouldCoverButton) {
-  return (0, _react.useMemo)(() => [(0, _dom.offset)(shouldCoverButton ? ({
-    rects
-  }) => ({
-    mainAxis: -rects.reference.height
-  }) : 6), (0, _dom.flip)({
-    fallbackStrategy: "initialPlacement"
-  })], [shouldCoverButton]);
-}
-const PopoverContainer = exports.PopoverContainer = /*#__PURE__*/(0, _react.forwardRef)(({
-  children,
-  title,
-  position = "right",
-  open,
-  onOpen,
-  onClose,
-  renderOpenComponent = renderOpen,
-  renderCloseComponent = renderClose,
-  shouldCoverButton = false,
-  ariaDescribedBy,
-  openButtonAriaLabel,
-  closeButtonAriaLabel = "close",
-  containerAriaLabel,
-  closeButtonDataProps,
-  disableAnimation = false,
-  hasFullWidth = false,
-  ...rest
-}, ref) => {
-  const isControlled = open !== undefined;
-  const [isOpenInternal, setIsOpenInternal] = (0, _react.useState)(false);
-  const closeButtonRef = (0, _react.useRef)(null);
-  const openButtonRef = (0, _react.useRef)(null);
-  const popoverReference = (0, _react.useRef)(null);
-  const guid = (0, _react.useRef)((0, _guid.default)());
-  const popoverContentNodeRef = (0, _react.useRef)(null);
-  const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
-  const isOpen = isControlled ? open : isOpenInternal;
-  const reduceMotion = !(0, _useMediaQuery.default)("screen and (prefers-reduced-motion: no-preference)");
-  const popoverMiddleware = usePopoverMiddleware(shouldCoverButton);
-  const {
-    isInFlatTable
-  } = (0, _react.useContext)(_flatTable.default);
-  const closePopover = (0, _react.useCallback)(ev => {
-    /* istanbul ignore else */
-    if (!isControlled) setIsOpenInternal(false);
-    onClose?.(ev);
-
-    /* istanbul ignore else */
-    if (isOpen) openButtonRef.current?.focus();
-  }, [isControlled, isOpen, onClose]);
-  const handleEscKey = (0, _react.useCallback)(ev => {
-    const eventIsFromSelectInput = _events.default.composedPath(ev).find(element => {
-      return element instanceof HTMLElement && element.getAttribute("data-element") === "input" && element.getAttribute("aria-expanded") === "true";
-    });
-    if (!eventIsFromSelectInput && _events.default.isEscKey(ev)) {
-      closePopover(ev);
-    }
-  }, [closePopover]);
-  (0, _react.useEffect)(() => {
-    document.addEventListener("keydown", handleEscKey);
-    return () => {
-      document.removeEventListener("keydown", handleEscKey);
-    };
-  }, [handleEscKey]);
-  (0, _react.useEffect)(() => {
-    if (!shouldCoverButton && isOpen) {
-      popoverContentNodeRef.current?.focus({
-        preventScroll: true
-      });
-    }
-  }, [isOpen, shouldCoverButton, popoverContentNodeRef]);
-  const handleOpenButtonClick = e => {
-    /* istanbul ignore else */
-    if (!isControlled) setIsOpenInternal(!isOpen);
-
-    // We want the open button to close the popover if it is already open
-    if (!isOpen) onOpen?.(e);else onClose?.(e);
-  };
-  const handleCloseButtonClick = e => {
-    closePopover(e);
-  };
-  (0, _useFocusPortalContent.default)(shouldCoverButton ? undefined : popoverContentNodeRef, shouldCoverButton ? undefined : openButtonRef, closePopover);
-  const onFocusNextElement = (0, _react.useCallback)(ev => {
-    const allFocusableElements = Array.from(document.querySelectorAll(_focusTrapUtils.defaultFocusableSelectors) || /* istanbul ignore next */[]);
-    const filteredElements = allFocusableElements.filter(el => el === openButtonRef.current || Number(el.tabIndex) !== -1);
-    const openButtonRefIndex = filteredElements.indexOf(openButtonRef.current);
-    filteredElements[openButtonRefIndex + 1].focus();
-    closePopover(ev);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  const handleFocusGuard = (direction, ev) => {
-    if (direction === "next" && onFocusNextElement) {
-      // Focus the next focusable element outside of the popover
-      onFocusNextElement(ev);
-      return;
-    }
-
-    // istanbul ignore else
-    if (direction === "prev") openButtonRef.current?.focus();
-  };
-  const renderOpenComponentProps = {
-    tabIndex: 0,
-    "aria-expanded": isOpen,
-    "aria-haspopup": "dialog",
-    isOpen,
-    "data-element": "popover-container-open-component",
-    onClick: handleOpenButtonClick,
-    ref: openButtonRef,
-    "aria-label": openButtonAriaLabel || title,
-    id: isOpen ? undefined : popoverContainerId
-  };
-  const renderCloseComponentProps = {
-    "data-element": "popover-container-close-component",
-    tabIndex: 0,
-    onClick: handleCloseButtonClick,
-    ref: closeButtonRef,
-    "aria-label": closeButtonAriaLabel,
-    closeButtonDataProps
-  };
-  const handleClickAway = e => {
-    if (!isControlled) setIsOpenInternal(false);
-    if (isOpen) onClose?.(e);
-  };
-  const handleClick = (0, _useClickAwayListener.default)(handleClickAway, "mousedown");
-  const [isAnimationComplete, setIsAnimationComplete] = (0, _react.useState)(false);
-  (0, _react.useImperativeHandle)(ref, () => ({
-    focusButton() {
-      openButtonRef.current?.focus();
-    }
-  }), []);
-  const popover = () => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerContentStyle, _extends({
-    "data-element": "popover-container-content",
-    role: "dialog",
-    "aria-labelledby": popoverContainerId,
-    "aria-label": containerAriaLabel,
-    "aria-describedby": ariaDescribedBy,
-    p: "16px 24px",
-    ref: popoverContentNodeRef,
-    tabIndex: -1,
-    disableAnimation: disableAnimation || reduceMotion
-  }, (0, _utils.filterStyledSystemPaddingProps)(rest)), /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerHeaderStyle, null, /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerTitleStyle, {
-    id: popoverContainerId,
-    "data-element": "popover-container-title"
-  }, title), renderCloseComponent(renderCloseComponentProps)), children);
-  const childrenToRender = () => shouldCoverButton ? /*#__PURE__*/_react.default.createElement(_modal.default.Provider, {
-    value: {
-      isAnimationComplete
-    }
-  }, /*#__PURE__*/_react.default.createElement(_focusTrap.default, {
-    wrapperRef: popoverContentNodeRef,
-    isOpen: isOpen
-  }, popover())) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    "data-element": "tab-guard-top"
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
-    tabIndex: 0,
-    "aria-hidden": true,
-    onFocus: ev => handleFocusGuard("prev", ev)
-  }), popover(), /*#__PURE__*/_react.default.createElement("div", {
-    "data-element": "tab-guard-bottom"
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
-    tabIndex: 0,
-    "aria-hidden": true,
-    onFocus: ev => handleFocusGuard("next", ev)
-  }));
-  return /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerWrapperStyle, _extends({
-    onMouseDown: handleClick,
-    hasFullWidth: hasFullWidth
-  }, (0, _tags.default)("popover-container", rest)), /*#__PURE__*/_react.default.createElement("div", {
-    ref: popoverReference
-  }, renderOpenComponent(renderOpenComponentProps)), /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
-    nodeRef: popoverContentNodeRef,
-    timeout: {
-      exit: disableAnimation ? 0 : 300
-    },
-    in: isOpen,
-    unmountOnExit: true,
-    onEntered: shouldCoverButton ? /* istanbul ignore next */() => setIsAnimationComplete(true) : undefined,
-    onExiting: shouldCoverButton ? /* istanbul ignore next */() => setIsAnimationComplete(false) : undefined
-  }, /*#__PURE__*/_react.default.createElement(_popover.default, {
-    reference: popoverReference,
-    placement: position === "right" ? "bottom-start" : "bottom-end",
-    popoverStrategy: disableAnimation || reduceMotion ? "fixed" : "absolute",
-    middleware: popoverMiddleware,
-    childRefOverride: popoverContentNodeRef,
-    disableBackgroundUI: isInFlatTable
-  }, childrenToRender())));
-});
-var _default = exports.default = PopoverContainer;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-transition-group"),n=require("@floating-ui/dom"),o=require("../../hooks/useMediaQuery/useMediaQuery.js"),a=require("./popover-container.style.js"),i=require("../icon/icon.component.js"),l=require("../../__internal__/popover/popover.component.js"),s=require("../../__internal__/utils/helpers/guid/index.js"),u=require("../../style/utils/filter-styled-system-padding-props.js"),c=require("../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js"),d=require("../../__internal__/utils/helpers/events/events.js"),p=require("../../__internal__/focus-trap/focus-trap.component.js"),f=require("../modal/__internal__/modal.context.js"),b=require("../../hooks/__internal__/useFocusPortalContent/useFocusPortalContent.js"),m=require("../../__internal__/utils/helpers/tags/tags.js"),v=require("../../__internal__/focus-trap/focus-trap-utils.js"),x=require("../flat-table/__internal__/flat-table.context.js");function y(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function j(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){y(e,t,r[t])}))}return e}function h(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const _=({tabIndex:t,onClick:r,"data-element":n,ref:o,"aria-label":l,id:s,"aria-expanded":u,"aria-haspopup":c})=>e.jsx(a.PopoverContainerOpenIcon,{tabIndex:t,onClick:r,"data-element":n,ref:o,"aria-label":l,"aria-haspopup":c,"aria-expanded":u,id:s,children:e.jsx(i.default,{type:"settings"})}),O=({"data-element":t,tabIndex:r,onClick:n,ref:o,"aria-label":l,closeButtonDataProps:s})=>e.jsx(a.PopoverContainerCloseIcon,h(j({tabIndex:r,onClick:n,ref:o,"aria-label":l},m.default("close",j({"data-element":t},s))),{children:e.jsx(i.default,{type:"close"})})),C=t.forwardRef(((i,y)=>{var{children:C,title:g,position:P="right",open:k,onOpen:w,onClose:q,renderOpenComponent:S=_,renderCloseComponent:A=O,shouldCoverButton:I=!1,ariaDescribedBy:B,openButtonAriaLabel:E,closeButtonAriaLabel:D="close",containerAriaLabel:L,closeButtonDataProps:F,disableAnimation:R=!1,hasFullWidth:M=!1}=i,T=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(i,["children","title","position","open","onOpen","onClose","renderOpenComponent","renderCloseComponent","shouldCoverButton","ariaDescribedBy","openButtonAriaLabel","closeButtonAriaLabel","containerAriaLabel","closeButtonDataProps","disableAnimation","hasFullWidth"]);const W=void 0!==k,[H,Q]=t.useState(!1),K=t.useRef(null),N=t.useRef(null),U=t.useRef(null),$=t.useRef(s.default()),z=t.useRef(null),G=g?`PopoverContainer_${$.current}`:void 0,J=W?k:H,V=!o.default("screen and (prefers-reduced-motion: no-preference)"),X=function(e){return t.useMemo((()=>[n.offset(e?({rects:e})=>({mainAxis:-e.reference.height}):6),n.flip({fallbackStrategy:"initialPlacement"})]),[e])}(I),{isInFlatTable:Y}=t.useContext(x.default),Z=t.useCallback((e=>{var t;W||Q(!1),null==q||q(e),J&&(null===(t=N.current)||void 0===t||t.focus())}),[W,J,q]),ee=t.useCallback((e=>{!d.default.composedPath(e).find((e=>e instanceof HTMLElement&&"input"===e.getAttribute("data-element")&&"true"===e.getAttribute("aria-expanded")))&&d.default.isEscKey(e)&&Z(e)}),[Z]);t.useEffect((()=>(document.addEventListener("keydown",ee),()=>{document.removeEventListener("keydown",ee)})),[ee]),t.useEffect((()=>{var e;!I&&J&&(null===(e=z.current)||void 0===e||e.focus({preventScroll:!0}))}),[J,I,z]),b.default(I?void 0:z,I?void 0:N,Z);const te=t.useCallback((e=>{const t=Array.from(document.querySelectorAll(v.defaultFocusableSelectors)||[]).filter((e=>e===N.current||-1!==Number(e.tabIndex))),r=t.indexOf(N.current);t[r+1].focus(),Z(e)}),[]),re=(e,t)=>{var r;"next"===e&&te?te(t):"prev"===e&&(null===(r=N.current)||void 0===r||r.focus())},ne={tabIndex:0,"aria-expanded":J,"aria-haspopup":"dialog",isOpen:J,"data-element":"popover-container-open-component",onClick:e=>{W||Q(!J),J?null==q||q(e):null==w||w(e)},ref:N,"aria-label":E||g,id:J?void 0:G},oe={"data-element":"popover-container-close-component",tabIndex:0,onClick:e=>{Z(e)},ref:K,"aria-label":D,closeButtonDataProps:F},ae=c.default((e=>{W||Q(!1),J&&(null==q||q(e))}),"mousedown"),[ie,le]=t.useState(!1);t.useImperativeHandle(y,(()=>({focusButton(){var e;null===(e=N.current)||void 0===e||e.focus()}})),[]);const se=()=>e.jsxs(a.PopoverContainerContentStyle,h(j({"data-element":"popover-container-content",role:"dialog","aria-labelledby":G,"aria-label":L,"aria-describedby":B,p:"16px 24px",ref:z,tabIndex:-1,disableAnimation:R||V},u.default(T)),{children:[e.jsxs(a.PopoverContainerHeaderStyle,{children:[e.jsx(a.PopoverContainerTitleStyle,{id:G,"data-element":"popover-container-title",children:g}),A(oe)]}),C]}));return e.jsxs(a.PopoverContainerWrapperStyle,h(j({onMouseDown:ae,hasFullWidth:M},m.default("popover-container",T)),{children:[e.jsx("div",{ref:U,children:S(ne)}),e.jsx(r.CSSTransition,{nodeRef:z,timeout:{exit:R?0:300},in:J,unmountOnExit:!0,onEntered:I?()=>le(!0):void 0,onExiting:I?()=>le(!1):void 0,children:e.jsx(l.default,{reference:U,placement:"right"===P?"bottom-start":"bottom-end",popoverStrategy:R||V?"fixed":"absolute",middleware:X,childRefOverride:z,disableBackgroundUI:Y,children:I?e.jsx(f.default.Provider,{value:{isAnimationComplete:ie},children:e.jsx(p.default,{wrapperRef:z,isOpen:J,children:se()})}):e.jsxs(e.Fragment,{children:[e.jsx("div",{"data-element":"tab-guard-top",tabIndex:0,"aria-hidden":!0,onFocus:e=>re("prev",e)}),se(),e.jsx("div",{"data-element":"tab-guard-bottom",tabIndex:0,"aria-hidden":!0,onFocus:e=>re("next",e)})]})})})]}))}));exports.PopoverContainer=C,exports.default=C,exports.renderClose=O,exports.renderOpen=_;