carbon-react 158.14.10 → 158.14.11

package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.component.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import n,{forwardRef as t,useState as o,useRef as i,useImperativeHandle as a,useCallback as l,useLayoutEffect as s,useEffect as c}from"react";import{DepthProvider as u}from"./__internal__/depth.context.js";import{ResponsiveVerticalMenuProvider as p,useResponsiveVerticalMenu as d}from"./responsive-vertical-menu.context.js";import{StyledBackdrop as v,StyledButton as m,ModalContainer as f,StyledCloseButton as h,StyledResponsiveMenu as b,StyledGlobalVerticalMenuWrapper as y}from"./responsive-vertical-menu.style.js";import{Box as g}from"../../box/box.component.js";import O from"../../../__internal__/modal/modal.component.js";import j from"../../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js";import w from"../../../hooks/useMediaQuery/useMediaQuery.js";import _ from"../../../hooks/__internal__/useLocale/useLocale.js";import x from"../../../__internal__/focus-trap/focus-trap.component.js";import M from"../../../__internal__/utils/helpers/tags/tags.js";function k(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function L(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){k(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}function E(e,r){if(null==e)return{};var n,t,o=function(e,r){if(null==e)return{};var n,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||(o[n]=e[n]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}const B=t(((t,u)=>{var p,{children:k,height:B,responsiveBreakpoint:C=700,width:D,launcherButtonDataProps:R}=t,S=E(t,["children","height","responsiveBreakpoint","width","launcherButtonDataProps"]);const I=_(),{active:A,activeMenuItem:T,buttonRef:z,containerRef:$,menuRef:q,responsiveMode:Q,setActive:V,setActiveMenuItem:G,setReducedMotion:F,setResponsiveMode:H,setLeft:J,setTop:K}=d(),[N,U]=o(0),W=j(C),[X,Y]=o("100%"),Z=!w("screen and (prefers-reduced-motion: no-preference)"),ee=i(null),{current:re}=q,{current:ne}=z;a(u,(()=>({focusLaunchButton(){null==ne||ne.focus({preventScroll:!0})}})),[ne]);const te=l((()=>{if(A&&Q){const e=re||document.querySelector("[id='responsive-vertical-menu-primary']");e&&Y(`${e.getBoundingClientRect().width}px`)}J(T&&re?`${re.getBoundingClientRect().right}px`:"auto"),K(T&&ne?`${ne.getBoundingClientRect().bottom}px`:"auto")}),[A,Q,T,re,ne,J,K]);s((()=>(te(),window.addEventListener("resize",te),()=>{var e;null===(e=window)||void 0===e||e.removeEventListener("resize",te)})),[A,te,re,Q]),c((()=>{const e=$.current,r=r=>{!A||Q||(null==e?void 0:e.contains(r.relatedTarget))||V(!1)},n=e=>{A&&!Q&&"Escape"===e.key&&(e.preventDefault(),V(!1))};return null==e||e.addEventListener("focusout",r),document.addEventListener("keydown",n),()=>{null==e||e.removeEventListener("focusout",r),document.removeEventListener("keydown",n)}}),[A,$,Q,V]),c((()=>{null==F||F(Z),null==H||H(!W)}),[W,Z,F,H]);const oe=l((e=>{if(!e)return 0;if(n.isValidElement(e))return 1+oe(e.props.children);const r=n.Children.toArray(e);return r.length?r.reduce(((e,r)=>n.isValidElement(r)?e+1+oe(r.props.children):e),0):0}),[]);return c((()=>{const e=N,r=oe(k);e!==r&&(U(r),G(null))}),[N,k,oe,G]),r("div",{ref:$,children:[A&&!Q&&e(v,{onMouseDown:e=>{e.preventDefault(),V(!1)}}),e(m,L({active:A,buttonType:"tertiary",iconType:"squares_nine",id:"responsive-vertical-menu-launcher",onClick:()=>{V((e=>!e)),G(null)},ref:z},M("responsive-vertical-menu-launcher",L({"data-role":"responsive-vertical-menu-launcher"},R)),(()=>{var e,r;return Q?{"aria-label":null===(r=I.verticalMenu.ariaLabels)||void 0===r?void 0:r.responsiveMenuLauncher()}:{"aria-expanded":A,"aria-controls":"responsive-vertical-menu-primary","aria-label":null===(e=I.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuLauncher()}})())),Q&&e(O,{open:A,children:e(x,{wrapperRef:ee,isOpen:A,children:r(f,P(L({ref:ee,width:X,tabIndex:-1,id:"responsive-vertical-menu-dialog"},(()=>{var e;return{role:"dialog","aria-modal":!0,"aria-label":null===(e=I.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuAria()}})()),{children:[e(g,{boxSizing:"border-box",display:"flex",justifyContent:"flex-end",width:"100%",backgroundColor:"var(--colorsGray850)",p:1,children:e(h,{"aria-label":null===(p=I.verticalMenu.ariaLabels)||void 0===p?void 0:p.responsiveMenuCloseButton(),"data-component":"responsive-vertical-menu-close","data-role":"responsive-vertical-menu-close",iconType:"close",size:"small",buttonType:"tertiary",onClick:()=>{V(!1),G(null)}})}),e(b,{height:B,id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:Z,ref:q,responsive:!0,tabIndex:-1,top:"48px",width:D,children:k})]}))})}),A&&!Q&&e(y,P(L({},S,M("responsive-vertical-menu",S)),{children:e(b,{childOpen:!!T,"data-component":"responsive-vertical-menu-primary","data-role":"responsive-vertical-menu-primary",height:B||"100%",id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:Z,ref:q,responsive:!1,tabIndex:-1,width:D,children:k})}))]})})),C=t(((r,n)=>{var{children:t,width:o,height:i}=r,a=E(r,["children","width","height"]);return e(u,{children:e(p,{width:o,height:i,children:e(B,P(L({ref:n,width:o,height:i},a),{children:t}))})})}));export{C as ResponsiveVerticalMenu,C as default};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import n,{forwardRef as t,useState as o,useRef as i,useImperativeHandle as a,useCallback as l,useLayoutEffect as s,useEffect as c}from"react";import{DepthProvider as u}from"./__internal__/depth.context.js";import{ResponsiveVerticalMenuProvider as p,useResponsiveVerticalMenu as d}from"./responsive-vertical-menu.context.js";import{StyledBackdrop as v,StyledButton as m,ModalContainer as f,StyledCloseButton as h,StyledResponsiveMenu as b,StyledGlobalVerticalMenuWrapper as y}from"./responsive-vertical-menu.style.js";import{Box as g}from"../../box/box.component.js";import O from"../../../__internal__/modal/modal.component.js";import j from"../../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js";import w from"../../../hooks/useMediaQuery/useMediaQuery.js";import _ from"../../../hooks/__internal__/useLocale/useLocale.js";import x from"../../../__internal__/focus-trap/focus-trap.component.js";import M from"../../../__internal__/utils/helpers/tags/tags.js";function k(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function L(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){k(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}function E(e,r){if(null==e)return{};var n,t,o=function(e,r){if(null==e)return{};var n,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||(o[n]=e[n]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}const B=t(((t,u)=>{var p,{children:k,height:B,responsiveBreakpoint:C=700,width:D,launcherButtonDataProps:R}=t,S=E(t,["children","height","responsiveBreakpoint","width","launcherButtonDataProps"]);const I=_(),{active:A,activeMenuItem:T,buttonRef:z,containerRef:$,menuRef:q,responsiveMode:Q,top:V,setActive:G,setActiveMenuItem:F,setReducedMotion:H,setResponsiveMode:J,setLeft:K,setTop:N}=d(),[U,W]=o(0),X=j(C),[Y,Z]=o("100%"),ee=!w("screen and (prefers-reduced-motion: no-preference)"),re=i(null),{current:ne}=q,{current:te}=z;a(u,(()=>({focusLaunchButton(){null==te||te.focus({preventScroll:!0})}})),[te]);const oe=l((()=>{if(A&&Q){const e=ne||document.querySelector("[id='responsive-vertical-menu-primary']");e&&Z(`${e.getBoundingClientRect().width}px`)}K(T&&ne?`${ne.getBoundingClientRect().right}px`:"auto"),N(T&&te?`${te.getBoundingClientRect().bottom}px`:"auto")}),[A,Q,T,ne,te,K,N]);s((()=>(oe(),window.addEventListener("resize",oe),()=>{var e;null===(e=window)||void 0===e||e.removeEventListener("resize",oe)})),[A,oe,ne,Q]),c((()=>{const e=$.current,r=r=>{!A||Q||(null==e?void 0:e.contains(r.relatedTarget))||G(!1)},n=e=>{A&&!Q&&"Escape"===e.key&&(e.preventDefault(),G(!1))};return null==e||e.addEventListener("focusout",r),document.addEventListener("keydown",n),()=>{null==e||e.removeEventListener("focusout",r),document.removeEventListener("keydown",n)}}),[A,$,Q,G]),c((()=>{null==H||H(ee),null==J||J(!X)}),[X,ee,H,J]);const ie=l((e=>{if(!e)return 0;if(n.isValidElement(e))return 1+ie(e.props.children);const r=n.Children.toArray(e);return r.length?r.reduce(((e,r)=>n.isValidElement(r)?e+1+ie(r.props.children):e),0):0}),[]);return c((()=>{const e=U,r=ie(k);e!==r&&(W(r),F(null))}),[U,k,ie,F]),r("div",{ref:$,children:[A&&!Q&&e(v,{onMouseDown:e=>{e.preventDefault(),G(!1)}}),e(m,L({active:A,buttonType:"tertiary",iconType:"squares_nine",id:"responsive-vertical-menu-launcher",onClick:()=>{G((e=>!e)),F(null)},ref:z},M("responsive-vertical-menu-launcher",L({"data-role":"responsive-vertical-menu-launcher"},R)),(()=>{var e,r;return Q?{"aria-label":null===(r=I.verticalMenu.ariaLabels)||void 0===r?void 0:r.responsiveMenuLauncher()}:{"aria-expanded":A,"aria-controls":"responsive-vertical-menu-primary","aria-label":null===(e=I.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuLauncher()}})())),Q&&e(O,{open:A,children:e(x,{wrapperRef:re,isOpen:A,children:r(f,P(L({ref:re,width:Y,tabIndex:-1,id:"responsive-vertical-menu-dialog"},(()=>{var e;return{role:"dialog","aria-modal":!0,"aria-label":null===(e=I.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuAria()}})()),{children:[e(g,{boxSizing:"border-box",display:"flex",justifyContent:"flex-end",width:"100%",backgroundColor:"var(--colorsGray850)",p:1,children:e(h,{"aria-label":null===(p=I.verticalMenu.ariaLabels)||void 0===p?void 0:p.responsiveMenuCloseButton(),"data-component":"responsive-vertical-menu-close","data-role":"responsive-vertical-menu-close",iconType:"close",size:"small",buttonType:"tertiary",onClick:()=>{G(!1),F(null)}})}),e(b,{height:B,id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:ee,ref:q,responsive:!0,tabIndex:-1,top:"48px",width:D,children:k})]}))})}),A&&!Q&&e(y,P(L({},S,M("responsive-vertical-menu",S)),{children:e(b,{childOpen:!!T,"data-component":"responsive-vertical-menu-primary","data-role":"responsive-vertical-menu-primary",height:B||"100%",id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:ee,ref:q,responsive:!1,tabIndex:-1,top:V,width:D,children:k})}))]})})),C=t(((r,n)=>{var{children:t,width:o,height:i}=r,a=E(r,["children","width","height"]);return e(u,{children:e(p,{width:o,height:i,children:e(B,P(L({ref:n,width:o,height:i},a),{children:t}))})})}));export{C as ResponsiveVerticalMenu,C as default};

package/lib/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./__internal__/depth.context.js"),n=require("./responsive-vertical-menu.context.js"),i=require("./responsive-vertical-menu.style.js"),o=require("../../box/box.component.js"),s=require("../../../__internal__/modal/modal.component.js"),a=require("../../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js"),l=require("../../../hooks/useMediaQuery/useMediaQuery.js"),u=require("../../../hooks/__internal__/useLocale/useLocale.js"),c=require("../../../__internal__/focus-trap/focus-trap.component.js"),d=require("../../../__internal__/utils/helpers/tags/tags.js");function p(e){return e&&e.__esModule?e:{default:e}}var v=p(r);function f(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function h(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){f(e,r,t[r])}))}return e}function m(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 t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}function y(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}const b=r.forwardRef(((t,p)=>{var f,{children:b,height:j,responsiveBreakpoint:g=700,width:x,launcherButtonDataProps:O}=t,w=y(t,["children","height","responsiveBreakpoint","width","launcherButtonDataProps"]);const _=u.default(),{active:M,activeMenuItem:k,buttonRef:P,containerRef:L,menuRef:R,responsiveMode:S,setActive:E,setActiveMenuItem:B,setReducedMotion:q,setResponsiveMode:C,setLeft:D,setTop:I}=n.useResponsiveVerticalMenu(),[A,T]=r.useState(0),V=a.default(g),[z,$]=r.useState("100%"),G=!l.default("screen and (prefers-reduced-motion: no-preference)"),Q=r.useRef(null),{current:H}=R,{current:W}=P;r.useImperativeHandle(p,(()=>({focusLaunchButton(){null==W||W.focus({preventScroll:!0})}})),[W]);const F=r.useCallback((()=>{if(M&&S){const e=H||document.querySelector("[id='responsive-vertical-menu-primary']");e&&$(`${e.getBoundingClientRect().width}px`)}D(k&&H?`${H.getBoundingClientRect().right}px`:"auto"),I(k&&W?`${W.getBoundingClientRect().bottom}px`:"auto")}),[M,S,k,H,W,D,I]);r.useLayoutEffect((()=>(F(),window.addEventListener("resize",F),()=>{var e;null===(e=window)||void 0===e||e.removeEventListener("resize",F)})),[M,F,H,S]),r.useEffect((()=>{const e=L.current,r=r=>{!M||S||(null==e?void 0:e.contains(r.relatedTarget))||E(!1)},t=e=>{M&&!S&&"Escape"===e.key&&(e.preventDefault(),E(!1))};return null==e||e.addEventListener("focusout",r),document.addEventListener("keydown",t),()=>{null==e||e.removeEventListener("focusout",r),document.removeEventListener("keydown",t)}}),[M,L,S,E]),r.useEffect((()=>{null==q||q(G),null==C||C(!V)}),[V,G,q,C]);const J=r.useCallback((e=>{if(!e)return 0;if(v.default.isValidElement(e))return 1+J(e.props.children);const r=v.default.Children.toArray(e);return r.length?r.reduce(((e,r)=>v.default.isValidElement(r)?e+1+J(r.props.children):e),0):0}),[]);return r.useEffect((()=>{const e=A,r=J(b);e!==r&&(T(r),B(null))}),[A,b,J,B]),e.jsxs("div",{ref:L,children:[M&&!S&&e.jsx(i.StyledBackdrop,{onMouseDown:e=>{e.preventDefault(),E(!1)}}),e.jsx(i.StyledButton,h({active:M,buttonType:"tertiary",iconType:"squares_nine",id:"responsive-vertical-menu-launcher",onClick:()=>{E((e=>!e)),B(null)},ref:P},d.default("responsive-vertical-menu-launcher",h({"data-role":"responsive-vertical-menu-launcher"},O)),(()=>{var e,r;return S?{"aria-label":null===(r=_.verticalMenu.ariaLabels)||void 0===r?void 0:r.responsiveMenuLauncher()}:{"aria-expanded":M,"aria-controls":"responsive-vertical-menu-primary","aria-label":null===(e=_.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuLauncher()}})())),S&&e.jsx(s.default,{open:M,children:e.jsx(c.default,{wrapperRef:Q,isOpen:M,children:e.jsxs(i.ModalContainer,m(h({ref:Q,width:z,tabIndex:-1,id:"responsive-vertical-menu-dialog"},(()=>{var e;return{role:"dialog","aria-modal":!0,"aria-label":null===(e=_.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuAria()}})()),{children:[e.jsx(o.Box,{boxSizing:"border-box",display:"flex",justifyContent:"flex-end",width:"100%",backgroundColor:"var(--colorsGray850)",p:1,children:e.jsx(i.StyledCloseButton,{"aria-label":null===(f=_.verticalMenu.ariaLabels)||void 0===f?void 0:f.responsiveMenuCloseButton(),"data-component":"responsive-vertical-menu-close","data-role":"responsive-vertical-menu-close",iconType:"close",size:"small",buttonType:"tertiary",onClick:()=>{E(!1),B(null)}})}),e.jsx(i.StyledResponsiveMenu,{height:j,id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:G,ref:R,responsive:!0,tabIndex:-1,top:"48px",width:x,children:b})]}))})}),M&&!S&&e.jsx(i.StyledGlobalVerticalMenuWrapper,m(h({},w,d.default("responsive-vertical-menu",w)),{children:e.jsx(i.StyledResponsiveMenu,{childOpen:!!k,"data-component":"responsive-vertical-menu-primary","data-role":"responsive-vertical-menu-primary",height:j||"100%",id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:G,ref:R,responsive:!1,tabIndex:-1,width:x,children:b})}))]})})),j=r.forwardRef(((r,i)=>{var{children:o,width:s,height:a}=r,l=y(r,["children","width","height"]);return e.jsx(t.DepthProvider,{children:e.jsx(n.ResponsiveVerticalMenuProvider,{width:s,height:a,children:e.jsx(b,m(h({ref:i,width:s,height:a},l),{children:o}))})})}));exports.ResponsiveVerticalMenu=j,exports.default=j;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./__internal__/depth.context.js"),n=require("./responsive-vertical-menu.context.js"),i=require("./responsive-vertical-menu.style.js"),o=require("../../box/box.component.js"),s=require("../../../__internal__/modal/modal.component.js"),a=require("../../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js"),l=require("../../../hooks/useMediaQuery/useMediaQuery.js"),u=require("../../../hooks/__internal__/useLocale/useLocale.js"),c=require("../../../__internal__/focus-trap/focus-trap.component.js"),d=require("../../../__internal__/utils/helpers/tags/tags.js");function p(e){return e&&e.__esModule?e:{default:e}}var v=p(r);function f(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function h(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){f(e,r,t[r])}))}return e}function m(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 t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}function y(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}const b=r.forwardRef(((t,p)=>{var f,{children:b,height:j,responsiveBreakpoint:g=700,width:x,launcherButtonDataProps:O}=t,w=y(t,["children","height","responsiveBreakpoint","width","launcherButtonDataProps"]);const _=u.default(),{active:M,activeMenuItem:k,buttonRef:P,containerRef:L,menuRef:R,responsiveMode:S,top:E,setActive:B,setActiveMenuItem:q,setReducedMotion:C,setResponsiveMode:D,setLeft:I,setTop:A}=n.useResponsiveVerticalMenu(),[T,V]=r.useState(0),z=a.default(g),[$,G]=r.useState("100%"),Q=!l.default("screen and (prefers-reduced-motion: no-preference)"),H=r.useRef(null),{current:W}=R,{current:F}=P;r.useImperativeHandle(p,(()=>({focusLaunchButton(){null==F||F.focus({preventScroll:!0})}})),[F]);const J=r.useCallback((()=>{if(M&&S){const e=W||document.querySelector("[id='responsive-vertical-menu-primary']");e&&G(`${e.getBoundingClientRect().width}px`)}I(k&&W?`${W.getBoundingClientRect().right}px`:"auto"),A(k&&F?`${F.getBoundingClientRect().bottom}px`:"auto")}),[M,S,k,W,F,I,A]);r.useLayoutEffect((()=>(J(),window.addEventListener("resize",J),()=>{var e;null===(e=window)||void 0===e||e.removeEventListener("resize",J)})),[M,J,W,S]),r.useEffect((()=>{const e=L.current,r=r=>{!M||S||(null==e?void 0:e.contains(r.relatedTarget))||B(!1)},t=e=>{M&&!S&&"Escape"===e.key&&(e.preventDefault(),B(!1))};return null==e||e.addEventListener("focusout",r),document.addEventListener("keydown",t),()=>{null==e||e.removeEventListener("focusout",r),document.removeEventListener("keydown",t)}}),[M,L,S,B]),r.useEffect((()=>{null==C||C(Q),null==D||D(!z)}),[z,Q,C,D]);const K=r.useCallback((e=>{if(!e)return 0;if(v.default.isValidElement(e))return 1+K(e.props.children);const r=v.default.Children.toArray(e);return r.length?r.reduce(((e,r)=>v.default.isValidElement(r)?e+1+K(r.props.children):e),0):0}),[]);return r.useEffect((()=>{const e=T,r=K(b);e!==r&&(V(r),q(null))}),[T,b,K,q]),e.jsxs("div",{ref:L,children:[M&&!S&&e.jsx(i.StyledBackdrop,{onMouseDown:e=>{e.preventDefault(),B(!1)}}),e.jsx(i.StyledButton,h({active:M,buttonType:"tertiary",iconType:"squares_nine",id:"responsive-vertical-menu-launcher",onClick:()=>{B((e=>!e)),q(null)},ref:P},d.default("responsive-vertical-menu-launcher",h({"data-role":"responsive-vertical-menu-launcher"},O)),(()=>{var e,r;return S?{"aria-label":null===(r=_.verticalMenu.ariaLabels)||void 0===r?void 0:r.responsiveMenuLauncher()}:{"aria-expanded":M,"aria-controls":"responsive-vertical-menu-primary","aria-label":null===(e=_.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuLauncher()}})())),S&&e.jsx(s.default,{open:M,children:e.jsx(c.default,{wrapperRef:H,isOpen:M,children:e.jsxs(i.ModalContainer,m(h({ref:H,width:$,tabIndex:-1,id:"responsive-vertical-menu-dialog"},(()=>{var e;return{role:"dialog","aria-modal":!0,"aria-label":null===(e=_.verticalMenu.ariaLabels)||void 0===e?void 0:e.responsiveMenuAria()}})()),{children:[e.jsx(o.Box,{boxSizing:"border-box",display:"flex",justifyContent:"flex-end",width:"100%",backgroundColor:"var(--colorsGray850)",p:1,children:e.jsx(i.StyledCloseButton,{"aria-label":null===(f=_.verticalMenu.ariaLabels)||void 0===f?void 0:f.responsiveMenuCloseButton(),"data-component":"responsive-vertical-menu-close","data-role":"responsive-vertical-menu-close",iconType:"close",size:"small",buttonType:"tertiary",onClick:()=>{B(!1),q(null)}})}),e.jsx(i.StyledResponsiveMenu,{height:j,id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:Q,ref:R,responsive:!0,tabIndex:-1,top:"48px",width:x,children:b})]}))})}),M&&!S&&e.jsx(i.StyledGlobalVerticalMenuWrapper,m(h({},w,d.default("responsive-vertical-menu",w)),{children:e.jsx(i.StyledResponsiveMenu,{childOpen:!!k,"data-component":"responsive-vertical-menu-primary","data-role":"responsive-vertical-menu-primary",height:j||"100%",id:"responsive-vertical-menu-primary",menu:"primary",reduceMotion:Q,ref:R,responsive:!1,tabIndex:-1,top:E,width:x,children:b})}))]})})),j=r.forwardRef(((r,i)=>{var{children:o,width:s,height:a}=r,l=y(r,["children","width","height"]);return e.jsx(t.DepthProvider,{children:e.jsx(n.ResponsiveVerticalMenuProvider,{width:s,height:a,children:e.jsx(b,m(h({ref:i,width:s,height:a},l),{children:o}))})})}));exports.ResponsiveVerticalMenu=j,exports.default=j;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "158.14.10",
+  "version": "158.14.11",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",