carbon-react 154.4.0 → 154.4.2

package/lib/__internal__/fieldset/fieldset.component.js

@@ -1,112 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _fieldset = require("./fieldset.style");
-var _validationIcon = _interopRequireDefault(require("../validations/validation-icon.component"));
-var _newValidation = _interopRequireDefault(require("../../components/carbon-provider/__internal__/new-validation.context"));
-var _inputBehaviour = require("../input-behaviour");
-var _help = _interopRequireDefault(require("../../components/help"));
-var _typography = _interopRequireDefault(require("../../components/typography"));
-var _utils = require("../../style/utils");
-var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
-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 Fieldset = ({
-  legend,
-  children,
-  inline = false,
-  legendWidth,
-  legendAlign,
-  legendSpacing = 2,
-  error,
-  warning,
-  info,
-  isRequired,
-  blockGroupBehaviour,
-  legendMargin = {},
-  isDisabled,
-  isOptional,
-  labelHelp,
-  validationId,
-  ...rest
-}) => {
-  const {
-    validationRedesignOptIn
-  } = (0, _react.useContext)(_newValidation.default);
-  const marginProps = (0, _utils.filterStyledSystemMarginProps)(rest);
-  const [ref, setRef] = (0, _react.useState)(null);
-  const [isFocused, setFocus] = (0, _react.useState)(false);
-  const locale = (0, _useLocale.default)();
-  const optionalLabel = locale.label.optional();
-  (0, _react.useEffect)(() => {
-    if (ref && isRequired) {
-      Array.from(ref.querySelectorAll("input") || /* istanbul ignore next */[]).forEach(el => {
-        el.setAttribute("required", "");
-      });
-    }
-  }, [ref, isRequired]);
-  const tooltipIcon = () => {
-    if (error || warning || info) {
-      return /*#__PURE__*/_react.default.createElement(_fieldset.StyledIconWrapper, {
-        "aria-hidden": "true"
-      }, /*#__PURE__*/_react.default.createElement(_validationIcon.default, {
-        error: error,
-        warning: warning,
-        info: info,
-        tooltipFlipOverrides: ["top", "bottom"]
-      }));
-    }
-    const helpProps = {
-      onFocus: () => setFocus(true),
-      onBlur: () => setFocus(false)
-    };
-    if (labelHelp) {
-      return /*#__PURE__*/_react.default.createElement(_fieldset.StyledIconWrapper, helpProps, /*#__PURE__*/_react.default.createElement(_help.default, {
-        isFocused: isFocused
-      }, labelHelp));
-    }
-    return null;
-  };
-  let legendAlignment;
-  if (inline && !legendAlign) {
-    legendAlignment = "right";
-  } else if (!legendAlign) {
-    legendAlignment = "left";
-  } else {
-    legendAlignment = legendAlign;
-  }
-  return /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupBehaviour, {
-    blockGroupBehaviour: blockGroupBehaviour
-  }, /*#__PURE__*/_react.default.createElement(_fieldset.StyledFieldset, _extends({
-    ref: setRef,
-    "data-component": "fieldset"
-  }, rest, marginProps), legend && /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupContext.Consumer, null, ({
-    onMouseEnter,
-    onMouseLeave
-  }) => /*#__PURE__*/_react.default.createElement(_fieldset.StyledLegend, _extends({
-    onMouseEnter: onMouseEnter,
-    onMouseLeave: onMouseLeave,
-    inline: inline,
-    width: legendWidth,
-    align: legendAlignment,
-    rightPadding: legendSpacing
-  }, legendMargin, {
-    "data-element": "legend",
-    "data-role": "legend"
-  }), /*#__PURE__*/_react.default.createElement(_fieldset.StyledLegendContent, {
-    isRequired: isRequired,
-    isOptional: isOptional,
-    optionalLabel: optionalLabel,
-    isDisabled: isDisabled
-  }, legend, !validationRedesignOptIn && tooltipIcon()))), !validationRedesignOptIn && /*#__PURE__*/_react.default.createElement(_typography.default, {
-    screenReaderOnly: true,
-    id: validationId
-  }, error || warning || info), children));
-};
-var _default = exports.default = Fieldset;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),n=require("./fieldset.style.js"),t=require("../validations/validation-icon.component.js"),i=require("../../components/carbon-provider/__internal__/new-validation.context.js"),o=require("../input-behaviour/input-group-behaviour.component.js"),l=require("../../components/help/help.component.js"),s=require("../../components/typography/typography.component.js");require("../../style/utils/filter-styled-system-padding-props.js");var a=require("../../style/utils/filter-styled-system-margin-props.js"),u=require("../../hooks/__internal__/useLocale/useLocale.js");function c(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function d(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),t.forEach((function(r){c(e,r,n[r])}))}return e}function p(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))})),e}exports.default=c=>{var{legend:g,children:y,inline:f=!1,legendWidth:b,legendAlign:j,legendSpacing:O=2,error:h,warning:v,info:m,isRequired:x,blockGroupBehaviour:q,legendMargin:w={},isDisabled:S,isOptional:P,labelHelp:_,validationId:I}=c,k=function(e,r){if(null==e)return{};var n,t,i=function(e,r){if(null==e)return{};var n,t,i={},o=Object.keys(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||(i[n]=e[n]);return i}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}(c,["legend","children","inline","legendWidth","legendAlign","legendSpacing","error","warning","info","isRequired","blockGroupBehaviour","legendMargin","isDisabled","isOptional","labelHelp","validationId"]);const{validationRedesignOptIn:D}=r.useContext(i.default),E=a.default(k),[L,M]=r.useState(null),[A,B]=r.useState(!1),G=u.default().label.optional();r.useEffect((()=>{L&&x&&Array.from(L.querySelectorAll("input")||[]).forEach((e=>{e.setAttribute("required","")}))}),[L,x]);const R=()=>{if(h||v||m)return e.jsx(n.StyledIconWrapper,{"aria-hidden":"true",children:e.jsx(t.ValidationIcon,{error:h,warning:v,info:m,tooltipFlipOverrides:["top","bottom"]})});const r={onFocus:()=>B(!0),onBlur:()=>B(!1)};return _?e.jsx(n.StyledIconWrapper,p(d({},r),{children:e.jsx(l.Help,{isFocused:A,children:_})})):null};let C;return C=f&&!j?"right":j||"left",e.jsx(o.InputGroupBehaviour,{blockGroupBehaviour:q,children:e.jsxs(n.StyledFieldset,p(d({ref:M,"data-component":"fieldset"},k,E),{children:[g&&e.jsx(o.InputGroupContext.Consumer,{children:({onMouseEnter:r,onMouseLeave:t})=>e.jsx(n.StyledLegend,p(d({onMouseEnter:r,onMouseLeave:t,inline:f,width:b,align:C,rightPadding:O},w),{"data-element":"legend","data-role":"legend",children:e.jsxs(n.StyledLegendContent,{isRequired:x,isOptional:P,optionalLabel:G,isDisabled:S,children:[g,!D&&R()]})}))}),!D&&e.jsx(s.Typography,{screenReaderOnly:!0,id:I,children:h||v||m}),y]}))})};

package/lib/__internal__/fieldset/fieldset.style.js

@@ -1,102 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StyledLegendContent = exports.StyledLegend = exports.StyledIconWrapper = exports.StyledFieldset = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _styledSystem = require("styled-system");
-var _base = _interopRequireDefault(require("../../style/themes/base"));
-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 StyledFieldset = exports.StyledFieldset = _styledComponents.default.fieldset`
-  margin: 0;
-  margin-bottom: var(--fieldSpacing);
-  ${_styledSystem.margin}
-  border: none;
-  padding: 0;
-  min-width: 0;
-  min-inline-size: 0;
-  ${({
-  width
-}) => width && `width: ${width};`}
-`;
-StyledFieldset.defaultProps = {
-  theme: _base.default
-};
-const StyledLegendContent = exports.StyledLegendContent = _styledComponents.default.span`
-  display: flex;
-  align-items: center;
-  line-height: 24px;
-  ${({
-  isRequired
-}) => isRequired && (0, _styledComponents.css)`
-      ::after {
-        content: "*";
-        line-height: 24px;
-        color: var(--colorsSemanticNegative500);
-        font-weight: var(--fontWeights500);
-        margin-left: var(--spacing050);
-        position: relative;
-        top: 1px;
-      }
-    `}
-
-  ${({
-  isOptional,
-  optionalLabel
-}) => isOptional && (0, _styledComponents.css)`
-      ::after {
-        content: "(${optionalLabel})";
-        color: var(--colorsUtilityYin055);
-        font-weight: var(--fontWeights400);
-        margin-left: var(--spacing050);
-      }
-    `}
-
-  ${({
-  isDisabled
-}) => isDisabled && (0, _styledComponents.css)`
-      color: var(--colorsUtilityYin030);
-      ::after {
-        color: var(--colorsUtilityYin030);
-      }
-    `}
-`;
-const StyledLegend = exports.StyledLegend = _styledComponents.default.legend`
-  display: flex;
-  align-items: center;
-  margin-bottom: var(--spacing100);
-  padding: 0;
-  font-weight: var(--fontWeights500);
-  color: var(--colorsUtilityYin090);
-
-  ${({
-  align,
-  inline
-}) => align && (0, _styledComponents.css)`
-      text-align: ${align};
-      justify-content: ${align === "right" ? "flex-end" : "flex-start"};
-
-      ${!inline && (0, _styledComponents.css)`
-        width: -moz-available;
-      `}
-    `};
-
-  ${({
-  inline,
-  width,
-  rightPadding
-}) => inline && (0, _styledComponents.css)`
-      float: left;
-      box-sizing: border-box;
-      margin: 0;
-      ${width && `width: ${width}%`};
-      padding-right: ${rightPadding === 1 ? "var(--spacing100)" : "var(--spacing200)"};
-    `}
-  ${_styledSystem.margin}
-`;
-const StyledIconWrapper = exports.StyledIconWrapper = _styledComponents.default.div`
-  margin-left: var(--spacing050);
-`;
+"use strict";var e=require("styled-components"),t=require("styled-system"),i=require("../../style/themes/base/index.js");function n(e){return e&&e.__esModule?e:{default:e}}var a=n(e);const s=a.default.fieldset.withConfig({displayName:"fieldset.style__StyledFieldset",componentId:"sc-6ccd69fa-0"})(["margin:0;margin-bottom:var(--fieldSpacing);"," border:none;padding:0;min-width:0;min-inline-size:0;",""],t.margin,(({width:e})=>e&&`width: ${e};`));s.defaultProps={theme:i.default};const l=a.default.span.withConfig({displayName:"fieldset.style__StyledLegendContent",componentId:"sc-6ccd69fa-1"})(["display:flex;align-items:center;line-height:24px;"," "," ",""],(({isRequired:t})=>t&&e.css(['::after{content:"*";line-height:24px;color:var(--colorsSemanticNegative500);font-weight:var(--fontWeights500);margin-left:var(--spacing050);position:relative;top:1px;}'])),(({isOptional:t,optionalLabel:i})=>t&&e.css(['::after{content:"(',')";color:var(--colorsUtilityYin055);font-weight:var(--fontWeights400);margin-left:var(--spacing050);}'],i)),(({isDisabled:t})=>t&&e.css(["color:var(--colorsUtilityYin030);::after{color:var(--colorsUtilityYin030);}"]))),o=a.default.legend.withConfig({displayName:"fieldset.style__StyledLegend",componentId:"sc-6ccd69fa-2"})(["display:flex;align-items:center;margin-bottom:var(--spacing100);padding:0;font-weight:var(--fontWeights500);color:var(--colorsUtilityYin090);",";"," ",""],(({align:t,inline:i})=>t&&e.css(["text-align:",";justify-content:",";",""],t,"right"===t?"flex-end":"flex-start",!i&&e.css(["width:-moz-available;"]))),(({inline:t,width:i,rightPadding:n})=>t&&e.css(["float:left;box-sizing:border-box;margin:0;",";padding-right:",";"],i&&`width: ${i}%`,1===n?"var(--spacing100)":"var(--spacing200)")),t.margin),r=a.default.div.withConfig({displayName:"fieldset.style__StyledIconWrapper",componentId:"sc-6ccd69fa-3"})(["margin-left:var(--spacing050);"]);exports.StyledFieldset=s,exports.StyledIconWrapper=r,exports.StyledLegend=o,exports.StyledLegendContent=l;

package/lib/__internal__/fieldset/index.js

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

package/lib/__internal__/fieldset/package.json

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

package/lib/__internal__/filter-object-properties/filter-object-properties.js

@@ -1,12 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = filterObjectProperties;
-function filterObjectProperties(originalObject, keyList) {
-  return Object.keys(originalObject).filter(key => keyList.includes(key)).reduce((acc, key) => {
-    acc[key] = originalObject[key];
-    return acc;
-  }, {});
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(e,t){return Object.keys(e).filter((e=>t.includes(e))).reduce(((t,r)=>(t[r]=e[r],t)),{})};

package/lib/__internal__/filter-object-properties/index.js

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

package/lib/__internal__/filter-object-properties/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "../../../esm/__internal__/filter-object-properties/index.js",
   "main": "./index.js",
+  "module": "../../../esm/__internal__/filter-object-properties/index.js",
   "types": "./index.d.ts"
 }

package/lib/__internal__/focus-trap/focus-trap-utils.js

@@ -1,156 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.trapFunction = exports.setElementFocus = exports.onTabGuardFocus = exports.getNextElement = exports.defaultFocusableSelectors = void 0;
-const defaultFocusableSelectors = exports.defaultFocusableSelectors = 'button:not([disabled]), [href], input:not([type="hidden"]):not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]';
-const INTERVAL = 10;
-const MAX_TIME = 100;
-const setElementFocus = element => {
-  let timeSoFar = 0;
-  const stylesMatch = () => {
-    const actualStyles = window.getComputedStyle(element);
-    return actualStyles.visibility === "visible";
-  };
-  const check = () => {
-    /* istanbul ignore else */
-    if (stylesMatch()) {
-      element.focus();
-    } else if (timeSoFar < MAX_TIME) {
-      setTimeout(check, INTERVAL);
-      timeSoFar += INTERVAL;
-    }
-    // just "fail" silently if maxTime exceeded - callback will never be called
-  };
-  check();
-};
-exports.setElementFocus = setElementFocus;
-const isRadio = element => {
-  return element.hasAttribute("type") && element.getAttribute("type") === "radio";
-};
-const getRadioElementToFocus = (groupName, shiftKey) => {
-  const buttonsInGroup = document.querySelectorAll(`input[type="radio"][name="${groupName}"]`);
-  const selectedButton = [...buttonsInGroup].find(button => button.checked);
-  if (selectedButton) {
-    return selectedButton;
-  }
-  return buttonsInGroup[shiftKey ? buttonsInGroup.length - 1 : 0];
-};
-const getNextElement = (element, focusableElements, shiftKey) => {
-  const currentIndex = focusableElements.indexOf(element);
-  if (currentIndex === -1) {
-    // we're not currently on a focusable element - most likely because the focusableElements come from a different focus trap!
-    // So we need to leave focus where it is.
-    return undefined;
-  }
-  const increment = shiftKey ? -1 : 1;
-  let nextIndex = currentIndex;
-  let foundElement;
-  while (!foundElement) {
-    nextIndex += increment;
-    if (nextIndex < 0) {
-      nextIndex += focusableElements.length;
-    }
-    if (nextIndex >= focusableElements.length) {
-      nextIndex -= focusableElements.length;
-    }
-    const nextElement = focusableElements[nextIndex];
-    if (nextElement === element) {
-      // guard in case there is only one focusable element (or only a single radio group) in the trap.
-      // If this happens we don't want to freeze the browser by looping forever, and it's OK to just focus
-      // the same element we're already on.
-      // There is an exception though: if we're in a single radio group, we need to ensure we focus on
-      // the correct one. This may not be "element" if it's not currently focused (due to the focus actually
-      // being on a wrapper element and this function being called with the first/last element as "element").
-      if (isRadio(element) && document.activeElement !== element) {
-        return getRadioElementToFocus(element.getAttribute("name"), shiftKey);
-      }
-      return element;
-    }
-    if (isRadio(nextElement)) {
-      // if we've reached a radio element we need to ensure we focus the correct button in its group
-      const nextElementGroupName = nextElement.getAttribute("name");
-      if (isRadio(element)) {
-        const groupName = element.getAttribute("name");
-
-        // if the name is different we're in a new group so can focus the appropriate button in it*/
-        if (nextElementGroupName !== groupName) {
-          foundElement = getRadioElementToFocus(nextElementGroupName, shiftKey);
-        }
-
-        // otherwise we're still in the same radio group so need to continue the loop
-      } else {
-        // if we've moved into a radio group from a non-radio starting point, we still have to ensure we focus
-        // the correct button in the group
-        foundElement = getRadioElementToFocus(nextElementGroupName, shiftKey);
-      }
-    } else {
-      // if we've reached a non-radio element, we can focus it with no issues
-      foundElement = nextElement;
-    }
-  }
-  return foundElement;
-};
-exports.getNextElement = getNextElement;
-const onTabGuardFocus = (trapWrappers, focusableSelectors, position) => guardWrapperRef => () => {
-  const isTop = position === "top";
-  const currentIndex = trapWrappers.indexOf(guardWrapperRef);
-  let index = currentIndex;
-  let nextWrapper;
-  let allFocusableElementsInNextWrapper;
-  do {
-    index += isTop ? -1 : 1;
-    if (index < 0) {
-      index += trapWrappers.length;
-    }
-    if (index >= trapWrappers.length) {
-      index -= trapWrappers.length;
-    }
-    nextWrapper = trapWrappers[index];
-    allFocusableElementsInNextWrapper = Array.from(nextWrapper?.current?.querySelectorAll(focusableSelectors || defaultFocusableSelectors) || /* istanbul ignore next */[]).filter(el => Number(el.tabIndex) !== -1);
-  } while (index !== currentIndex && !allFocusableElementsInNextWrapper?.length);
-  const toFocus = allFocusableElementsInNextWrapper?.[isTop ? allFocusableElementsInNextWrapper.length - 1 : 0];
-  if (isRadio(toFocus)) {
-    const radioToFocus = getRadioElementToFocus(toFocus.getAttribute("name"), isTop);
-    setElementFocus(radioToFocus);
-  } else {
-    setElementFocus(toFocus);
-  }
-};
-exports.onTabGuardFocus = onTabGuardFocus;
-const trapFunction = (ev, defaultFocusableElements, isWrapperFocused, focusableSelectors, bespokeTrap) => {
-  const customFocusableElements = focusableSelectors ? defaultFocusableElements.filter(element => element.matches(focusableSelectors)) : defaultFocusableElements;
-  const firstElement = customFocusableElements[0];
-  const lastElement = customFocusableElements[customFocusableElements.length - 1];
-  if (bespokeTrap) {
-    bespokeTrap(ev, firstElement, lastElement);
-    return;
-  }
-  if (ev.key !== "Tab") return;
-  if (!customFocusableElements?.length) {
-    /* Block the trap */
-    ev.preventDefault();
-    return;
-  }
-  const activeElement = document.activeElement;
-
-  // special case if focus is on document body
-  if (activeElement === document.body) {
-    ev.preventDefault();
-    setElementFocus(firstElement);
-    return;
-  }
-  if (!focusableSelectors) {
-    return;
-  }
-  const elementWhenWrapperFocused = ev.shiftKey ? firstElement : lastElement;
-  const elementToFocus = getNextElement(isWrapperFocused ? elementWhenWrapperFocused : activeElement, customFocusableElements, ev.shiftKey);
-  const defaultNextElement = getNextElement(isWrapperFocused ? elementWhenWrapperFocused : activeElement, defaultFocusableElements, ev.shiftKey);
-  if (elementToFocus && elementToFocus !== defaultNextElement) {
-    // if next element would match the custom selector anyway, then no need to prevent default
-    setElementFocus(elementToFocus);
-    ev.preventDefault();
-  }
-};
-exports.trapFunction = trapFunction;
+"use strict";const t='button:not([disabled]), [href], input:not([type="hidden"]):not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]',e=t=>{let e=0;const n=()=>{"visible"===window.getComputedStyle(t).visibility?t.focus():e<100&&(setTimeout(n,10),e+=10)};n()},n=t=>t.hasAttribute("type")&&"radio"===t.getAttribute("type"),o=(t,e)=>{const n=document.querySelectorAll(`input[type="radio"][name="${t}"]`);return[...n].find((t=>t.checked))||n[e?n.length-1:0]},i=(t,e,i)=>{const r=e.indexOf(t);if(-1===r)return;const l=i?-1:1;let u,s=r;for(;!u;){s+=l,s<0&&(s+=e.length),s>=e.length&&(s-=e.length);const r=e[s];if(r===t)return n(t)&&document.activeElement!==t?o(t.getAttribute("name"),i):t;if(n(r)){const e=r.getAttribute("name");n(t)?e!==t.getAttribute("name")&&(u=o(e,i)):u=o(e,i)}else u=r}return u};exports.defaultFocusableSelectors=t,exports.getNextElement=i,exports.onTabGuardFocus=(i,r,l)=>u=>()=>{const s="top"===l,d=i.indexOf(u);let c,a,f=d;do{var b;f+=s?-1:1,f<0&&(f+=i.length),f>=i.length&&(f-=i.length),c=i[f],a=Array.from((null==c||null===(b=c.current)||void 0===b?void 0:b.querySelectorAll(r||t))||[]).filter((t=>-1!==Number(t.tabIndex)))}while(f!==d&&!(null==a?void 0:a.length));const h=null==a?void 0:a[s?a.length-1:0];if(n(h)){const t=o(h.getAttribute("name"),s);e(t)}else e(h)},exports.setElementFocus=e,exports.trapFunction=(t,n,o,r,l)=>{const u=r?n.filter((t=>t.matches(r))):n,s=u[0],d=u[u.length-1];if(l)return void l(t,s,d);if("Tab"!==t.key)return;if(!(null==u?void 0:u.length))return void t.preventDefault();const c=document.activeElement;if(c===document.body)return t.preventDefault(),void e(s);if(!r)return;const a=t.shiftKey?s:d,f=i(o?a:c,u,t.shiftKey),b=i(o?a:c,n,t.shiftKey);f&&f!==b&&(e(f),t.preventDefault())};

package/lib/__internal__/focus-trap/focus-trap.component.js

@@ -1,188 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TAB_GUARD_TOP = exports.TAB_GUARD_BOTTOM = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _focusTrapUtils = require("./focus-trap-utils");
-var _modal = _interopRequireDefault(require("../../components/modal/__internal__/modal.context"));
-var _usePrevious = _interopRequireDefault(require("../../hooks/__internal__/usePrevious"));
-var _topModal = _interopRequireDefault(require("../../components/carbon-provider/__internal__/top-modal.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; }
-const TAB_GUARD_TOP = exports.TAB_GUARD_TOP = "tab-guard-top";
-const TAB_GUARD_BOTTOM = exports.TAB_GUARD_BOTTOM = "tab-guard-bottom";
-
-// TODO investigate why React.RefObject<T> produces a failed prop type when current = null
-
-const FocusTrap = ({
-  children,
-  autoFocus = true,
-  focusableSelectors,
-  focusFirstElement,
-  bespokeTrap,
-  wrapperRef,
-  isOpen,
-  additionalWrapperRefs
-}) => {
-  const trapRef = (0, _react.useRef)(null);
-  const [currentFocusedElement, setCurrentFocusedElement] = (0, _react.useState)();
-  const {
-    isAnimationComplete = true,
-    triggerRefocusFlag
-  } = (0, _react.useContext)(_modal.default);
-  const {
-    topModal
-  } = (0, _react.useContext)(_topModal.default);
-  // we ensure that isTopModal is true if there is no TopModalContext, so that consumers who have not
-  // wrapped their app in CarbonProvider do not have all FocusTrap behaviour broken
-  const isTopModal = !topModal || wrapperRef.current && topModal.contains(wrapperRef.current);
-  const trapWrappers = (0, _react.useMemo)(() => additionalWrapperRefs?.length ? [wrapperRef, ...additionalWrapperRefs] : [wrapperRef], [additionalWrapperRefs, wrapperRef]);
-  const onTabGuardTopFocus = (0, _react.useMemo)(() => (0, _focusTrapUtils.onTabGuardFocus)(trapWrappers, focusableSelectors, "top"), [focusableSelectors, trapWrappers]);
-  const onTabGuardBottomFocus = (0, _react.useMemo)(() => (0, _focusTrapUtils.onTabGuardFocus)(trapWrappers, focusableSelectors, "bottom"), [focusableSelectors, trapWrappers]);
-  (0, _react.useEffect)(() => {
-    additionalWrapperRefs?.forEach(ref => {
-      const {
-        current: containerElement
-      } = ref;
-      // istanbul ignore else
-      if (containerElement) {
-        // istanbul ignore else
-        if (!containerElement.previousElementSibling?.matches(`[data-element=${TAB_GUARD_TOP}]`)) {
-          const topTabGuard = document.createElement("div");
-          topTabGuard.tabIndex = 0;
-          topTabGuard.dataset.element = TAB_GUARD_TOP;
-          containerElement.insertAdjacentElement("beforebegin", topTabGuard);
-          topTabGuard.addEventListener("focus", onTabGuardTopFocus(ref));
-        }
-        // istanbul ignore else
-        if (!containerElement.nextElementSibling?.matches(`[data-element=${TAB_GUARD_BOTTOM}]`)) {
-          const bottomTabGuard = document.createElement("div");
-          bottomTabGuard.tabIndex = 0;
-          bottomTabGuard.dataset.element = TAB_GUARD_BOTTOM;
-          containerElement.insertAdjacentElement("afterend", bottomTabGuard);
-          bottomTabGuard.addEventListener("focus", onTabGuardBottomFocus(ref));
-        }
-      }
-    });
-    return () => {
-      additionalWrapperRefs?.forEach(ref => {
-        const previousElement = ref.current?.previousElementSibling;
-        if (previousElement?.matches(`[data-element=${TAB_GUARD_TOP}]`)) {
-          previousElement.remove();
-        }
-        const nextElement = ref.current?.nextElementSibling;
-        if (nextElement?.matches(`[data-element=${TAB_GUARD_BOTTOM}]`)) {
-          nextElement.remove();
-        }
-      });
-    };
-  }, [additionalWrapperRefs, onTabGuardTopFocus, onTabGuardBottomFocus]);
-  const shouldSetFocus = autoFocus && isOpen && isAnimationComplete;
-  const prevShouldSetFocus = (0, _usePrevious.default)(shouldSetFocus);
-  const getFocusableElements = (0, _react.useCallback)(selector => {
-    const elements = [];
-    trapWrappers.forEach(ref => {
-      // istanbul ignore else
-      if (ref.current) {
-        elements.push(...Array.from(ref.current.querySelectorAll(selector)).filter(el => Number(el.tabIndex) !== -1));
-      }
-    });
-    return elements;
-  }, [trapWrappers]);
-  (0, _react.useEffect)(() => {
-    if (shouldSetFocus && !prevShouldSetFocus) {
-      const candidateFirstElement = focusFirstElement && "current" in focusFirstElement ? focusFirstElement.current : focusFirstElement;
-      const autoFocusedElement = getFocusableElements(_focusTrapUtils.defaultFocusableSelectors).find(el => el.getAttribute("data-has-autofocus") === "true");
-      const elementToFocus = candidateFirstElement || autoFocusedElement || wrapperRef.current;
-      // istanbul ignore else
-      if (elementToFocus) {
-        (0, _focusTrapUtils.setElementFocus)(elementToFocus);
-      }
-    }
-  }, [shouldSetFocus, prevShouldSetFocus, getFocusableElements, focusFirstElement, wrapperRef]);
-  (0, _react.useEffect)(() => {
-    const trapFn = ev => {
-      // block focus trap from working if it's not the topmost trap, or is currently closed
-      if (!isTopModal || !isOpen) {
-        return;
-      }
-      const focusableElements = getFocusableElements(_focusTrapUtils.defaultFocusableSelectors);
-      (0, _focusTrapUtils.trapFunction)(ev, focusableElements, document.activeElement === wrapperRef.current, focusableSelectors, bespokeTrap);
-    };
-    document.addEventListener("keydown", trapFn, true);
-    return function cleanup() {
-      document.removeEventListener("keydown", trapFn, true);
-    };
-  }, [bespokeTrap, wrapperRef, focusableSelectors, getFocusableElements, isTopModal, isOpen]);
-  const updateCurrentFocusedElement = (0, _react.useCallback)(() => {
-    const focusableElements = getFocusableElements(focusableSelectors || _focusTrapUtils.defaultFocusableSelectors);
-    const element = focusableElements?.find(el => el === document.activeElement);
-    if (element) {
-      setCurrentFocusedElement(element);
-    }
-  }, [getFocusableElements, focusableSelectors]);
-  const refocusTrap = (0, _react.useCallback)(() => {
-    if (currentFocusedElement && !currentFocusedElement.hasAttribute("disabled")) {
-      // the trap breaks if it tries to refocus a disabled element
-      (0, _focusTrapUtils.setElementFocus)(currentFocusedElement);
-    } else if (wrapperRef.current?.hasAttribute("tabindex")) {
-      (0, _focusTrapUtils.setElementFocus)(wrapperRef.current);
-    } else {
-      const focusableElements = getFocusableElements(focusableSelectors || _focusTrapUtils.defaultFocusableSelectors);
-      /* istanbul ignore else */
-      if (focusableElements.length) {
-        (0, _focusTrapUtils.setElementFocus)(focusableElements[0]);
-      }
-    }
-  }, [currentFocusedElement, wrapperRef, focusableSelectors, getFocusableElements]);
-  (0, _react.useEffect)(() => {
-    if (triggerRefocusFlag) {
-      refocusTrap();
-    }
-  }, [triggerRefocusFlag, refocusTrap]);
-  const [tabIndex, setTabIndex] = (0, _react.useState)(0);
-  (0, _react.useEffect)(() => {
-    // tabIndex is set to 0 and removed on blur.
-    if (!isOpen) {
-      setTabIndex(0);
-    }
-  }, [isOpen]);
-  const onBlur = () => {
-    /* istanbul ignore else */
-    if (isOpen) {
-      setTabIndex(undefined);
-    }
-  };
-  const focusProps = hasNoTabIndex => ({
-    ...(hasNoTabIndex && {
-      tabIndex,
-      onBlur
-    }),
-    onFocus: updateCurrentFocusedElement
-  });
-
-  // passes focusProps, sets tabIndex and onBlur if no tabIndex has been explicitly set on child
-  const clonedChildren = _react.default.Children.map(children, child => {
-    const focusableChild = child;
-    return /*#__PURE__*/_react.default.cloneElement(focusableChild, focusProps(focusableChild?.props?.tabIndex === undefined));
-  });
-  return /*#__PURE__*/_react.default.createElement("div", {
-    ref: trapRef
-  }, isOpen && /*#__PURE__*/_react.default.createElement("div", {
-    "data-element": TAB_GUARD_TOP
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
-    tabIndex: 0,
-    onFocus: onTabGuardTopFocus(wrapperRef)
-  }), clonedChildren, isOpen && /*#__PURE__*/_react.default.createElement("div", {
-    "data-element": TAB_GUARD_BOTTOM
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
-    tabIndex: 0,
-    onFocus: onTabGuardBottomFocus(wrapperRef)
-  }));
-};
-var _default = exports.default = FocusTrap;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("./focus-trap-utils.js"),r=require("../../components/modal/__internal__/modal.context.js"),o=require("../../hooks/__internal__/usePrevious/index.js"),u=require("../../components/carbon-provider/__internal__/top-modal.context.js");function c(e){return e&&e.__esModule?e:{default:e}}var s=c(t);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const a="tab-guard-top",i="tab-guard-bottom";exports.TAB_GUARD_BOTTOM=i,exports.TAB_GUARD_TOP=a,exports.default=({children:c,autoFocus:d=!0,focusableSelectors:f,focusFirstElement:m,bespokeTrap:b,wrapperRef:v,isOpen:p,additionalWrapperRefs:E})=>{const O=t.useRef(null),[j,g]=t.useState(),{isAnimationComplete:x=!0,triggerRefocusFlag:y}=t.useContext(r.default),{topModal:h}=t.useContext(u.default),_=!h||v.current&&h.contains(v.current),F=t.useMemo((()=>(null==E?void 0:E.length)?[v,...E]:[v]),[E,v]),S=t.useMemo((()=>n.onTabGuardFocus(F,f,"top")),[f,F]),P=t.useMemo((()=>n.onTabGuardFocus(F,f,"bottom")),[f,F]);t.useEffect((()=>(null==E||E.forEach((e=>{const{current:t}=e;if(t){var n,r;if(!(null===(n=t.previousElementSibling)||void 0===n?void 0:n.matches(`[data-element=${a}]`))){const n=document.createElement("div");n.tabIndex=0,n.dataset.element=a,t.insertAdjacentElement("beforebegin",n),n.addEventListener("focus",S(e))}if(!(null===(r=t.nextElementSibling)||void 0===r?void 0:r.matches(`[data-element=${i}]`))){const n=document.createElement("div");n.tabIndex=0,n.dataset.element=i,t.insertAdjacentElement("afterend",n),n.addEventListener("focus",P(e))}}})),()=>{null==E||E.forEach((e=>{var t,n;const r=null===(t=e.current)||void 0===t?void 0:t.previousElementSibling;(null==r?void 0:r.matches(`[data-element=${a}]`))&&r.remove();const o=null===(n=e.current)||void 0===n?void 0:n.nextElementSibling;(null==o?void 0:o.matches(`[data-element=${i}]`))&&o.remove()}))})),[E,S,P]);const w=d&&p&&x,A=o.default(w),k=t.useCallback((e=>{const t=[];return F.forEach((n=>{n.current&&t.push(...Array.from(n.current.querySelectorAll(e)).filter((e=>-1!==Number(e.tabIndex))))})),t}),[F]);t.useEffect((()=>{if(w&&!A){const e=m&&"current"in m?m.current:m,t=k(n.defaultFocusableSelectors).find((e=>"true"===e.getAttribute("data-has-autofocus"))),r=e||t||v.current;r&&n.setElementFocus(r)}}),[w,A,k,m,v]),t.useEffect((()=>{const e=e=>{if(!_||!p)return;const t=k(n.defaultFocusableSelectors);n.trapFunction(e,t,document.activeElement===v.current,f,b)};return document.addEventListener("keydown",e,!0),function(){document.removeEventListener("keydown",e,!0)}}),[b,v,f,k,_,p]);const T=t.useCallback((()=>{const e=k(f||n.defaultFocusableSelectors),t=null==e?void 0:e.find((e=>e===document.activeElement));t&&g(t)}),[k,f]),q=t.useCallback((()=>{var e;if(j&&!j.hasAttribute("disabled"))n.setElementFocus(j);else if(null===(e=v.current)||void 0===e?void 0:e.hasAttribute("tabindex"))n.setElementFocus(v.current);else{const e=k(f||n.defaultFocusableSelectors);e.length&&n.setElementFocus(e[0])}}),[j,v,f,k]);t.useEffect((()=>{y&&q()}),[y,q]);const[C,I]=t.useState(0);t.useEffect((()=>{p||I(0)}),[p]);const M=()=>{p&&I(void 0)},D=e=>{return t=function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},r=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),r.forEach((function(t){l(e,t,n[t])}))}return e}({},e&&{tabIndex:C,onBlur:M}),n=null!=(n={onFocus:T})?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))})),t;var t,n},R=s.default.Children.map(c,(e=>{var t;const n=e;return s.default.cloneElement(n,D(void 0===(null==n||null===(t=n.props)||void 0===t?void 0:t.tabIndex)))}));return e.jsxs("div",{ref:O,children:[p&&e.jsx("div",{"data-element":a,tabIndex:0,onFocus:S(v)}),R,p&&e.jsx("div",{"data-element":i,tabIndex:0,onFocus:P(v)})]})};

package/lib/__internal__/focus-trap/index.js

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