carbon-react 158.9.0 → 158.10.1

package/esm/__internal__/modal/modal.component.js

@@ -1 +1 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useRef as r,useState as t,useEffect as n,useCallback as l}from"react";import{TransitionGroup as a,CSSTransition as i}from"react-transition-group";import c from"../../hooks/__internal__/useScrollBlock/useScrollBlock.js";import{Portal as s}from"../../components/portal/portal.js";import{getDocument as d}from"../dom/globals.js";import m from"../utils/helpers/events/events.js";import p from"../../hooks/__internal__/useModalManager/useModalManager.js";import{StyledModal as u,StyledModalBackground as f}from"./modal.style.js";import b from"./modal.context.js";function O(e,o,r){return o in e?Object.defineProperty(e,o,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[o]=r,e}function g(e){for(var o=1;o<arguments.length;o++){var r=null!=arguments[o]?arguments[o]:{},t=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),t.forEach((function(o){O(e,o,r[o])}))}return e}const y=300,j=O=>{var{children:j,"data-element":v,"data-role":h="modal",open:P,onCancel:k,disableEscKey:w=!1,disableClose:E,enableBackgroundUI:M=!1,topModalOverride:S,restoreFocusOnClose:C=!0}=O,_=function(e,o){if(null==e)return{};var r,t,n=function(e,o){if(null==e)return{};var r,t,n={},l=Object.keys(e);for(t=0;t<l.length;t++)r=l[t],o.indexOf(r)>=0||(n[r]=e[r]);return n}(e,o);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(t=0;t<l.length;t++)r=l[t],o.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(O,["children","data-element","data-role","open","onCancel","disableEscKey","disableClose","enableBackgroundUI","topModalOverride","restoreFocusOnClose"]);const x=r(null),I=r(null),R=r(null),[B,D]=t(!1),[F,N]=t(!1),{blockScroll:T,allowScroll:K}=c();n((()=>{M||(P?T():K())}),[K,T,M,P]),n((()=>()=>{M||K()}),[K,M]);const A=l((e=>{k&&!E&&!w&&m.isEscKey(e)&&(e.stopImmediatePropagation(),k(e))}),[E,w,k]),U=d();let q,z;return p({open:P,closeModal:A,modalRef:x,setTriggerRefocusFlag:N,topModalOverride:S,focusCallToActionElement:C&&U?U.activeElement:void 0}),P&&(q=M?null:e(f,{ref:I,"data-element":"modal-background","data-role":"modal-background",transitionName:"modal-background",transitionTime:y}),z=j),e(s,{children:o(u,(G=g({"data-component":"modal","data-element":v,"data-role":h,"data-state":P?"open":"closed",transitionName:"modal",transitionTime:y,topModalOverride:S,ref:x},_),H={children:[e(a,{children:q&&e(i,{nodeRef:I,appear:!0,classNames:"modal-background",timeout:y,onEntered:()=>D(!0),onExiting:()=>D(!1),children:q},"modal")}),e(a,{children:z&&e(i,{nodeRef:R,appear:!0,classNames:"modal",timeout:y,children:e(b.Provider,{value:{isAnimationComplete:B,triggerRefocusFlag:F,isInModal:!0},children:e("div",{ref:R,children:z})})})})]},H=null!=H?H:{},Object.getOwnPropertyDescriptors?Object.defineProperties(G,Object.getOwnPropertyDescriptors(H)):function(e){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);o.push.apply(o,r)}return o}(Object(H)).forEach((function(e){Object.defineProperty(G,e,Object.getOwnPropertyDescriptor(H,e))})),G))});var G,H};export{j as default};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useRef as r,useState as t,useEffect as n,useCallback as l}from"react";import{TransitionGroup as a,CSSTransition as i}from"react-transition-group";import c from"../../hooks/__internal__/useScrollBlock/useScrollBlock.js";import{Portal as s}from"../../components/portal/portal.js";import{getDocument as d}from"../dom/globals.js";import m from"../utils/helpers/events/events.js";import p from"../../hooks/__internal__/useModalManager/useModalManager.js";import{StyledModal as u,StyledModalBackground as f}from"./modal.style.js";import b from"./modal.context.js";function O(e,o,r){return o in e?Object.defineProperty(e,o,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[o]=r,e}function g(e){for(var o=1;o<arguments.length;o++){var r=null!=arguments[o]?arguments[o]:{},t=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),t.forEach((function(o){O(e,o,r[o])}))}return e}const y=300,j=O=>{var{children:j,"data-element":v,"data-role":h="modal",open:P,onCancel:k,disableEscKey:w=!1,disableClose:E,enableBackgroundUI:M=!1,topModalOverride:S,restoreFocusOnClose:C=!0}=O,_=function(e,o){if(null==e)return{};var r,t,n=function(e,o){if(null==e)return{};var r,t,n={},l=Object.keys(e);for(t=0;t<l.length;t++)r=l[t],o.indexOf(r)>=0||(n[r]=e[r]);return n}(e,o);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(t=0;t<l.length;t++)r=l[t],o.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(O,["children","data-element","data-role","open","onCancel","disableEscKey","disableClose","enableBackgroundUI","topModalOverride","restoreFocusOnClose"]);const x=r(null),I=r(null),R=r(null),[B,D]=t(!1),[F,N]=t(!1),{blockScroll:T,allowScroll:K}=c();n((()=>{M||(P?T():K())}),[K,T,M,P]),n((()=>()=>{M||K()}),[K,M]);const A=l((e=>{k&&!E&&!w&&m.isEscKey(e)&&(e.stopImmediatePropagation(),k(e))}),[E,w,k]),U=d();let q,z;return p({open:P,closeModal:A,modalRef:x,setTriggerRefocusFlag:N,topModalOverride:S,focusCallToActionElement:C&&U?U.activeElement:void 0}),P&&(q=M?null:e(f,{ref:I,"data-element":"modal-background","data-role":"modal-background",transitionName:"modal-background",transitionTime:y}),z=j),e(s,{children:o(u,(G=g({"data-component":"modal","data-element":v,"data-role":h,"data-state":P&&B?"open":"closed",transitionName:"modal",transitionTime:y,topModalOverride:S,ref:x},_),H={children:[e(a,{children:q&&e(i,{nodeRef:I,appear:!0,classNames:"modal-background",timeout:y,onEntered:()=>D(!0),onExiting:()=>D(!1),children:q},"modal")}),e(a,{children:z&&e(i,{nodeRef:R,appear:!0,classNames:"modal",timeout:y,children:e(b.Provider,{value:{isAnimationComplete:B,triggerRefocusFlag:F,isInModal:!0},children:e("div",{ref:R,children:z})})})})]},H=null!=H?H:{},Object.getOwnPropertyDescriptors?Object.defineProperties(G,Object.getOwnPropertyDescriptors(H)):function(e){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);o.push.apply(o,r)}return o}(Object(H)).forEach((function(e){Object.defineProperty(G,e,Object.getOwnPropertyDescriptor(H,e))})),G))});var G,H};export{j as default};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import r,{useRef as o,useContext as i,createContext as l,useEffect as c,forwardRef as s,useMemo as d,useState as a}from"react";import{StyledResponsiveMenu as p}from"../responsive-vertical-menu.style.js";import{StyledResponsiveMenuListItem as u,StyledResponsiveMenuItem as m,StyledIcon as v,StyledNestedMenuWrapper as h,StyledNestedMenu as f,StyledMenuItemContent as y,StyledResponsiveMenuActionButton as b,StyledResponsiveMenuActionLink as g}from"./responsive-vertical-menu-item.style.js";import"../../../../style/utils/filter-styled-system-padding-props.js";import O from"../../../../style/utils/filter-styled-system-margin-props.js";import{useDepth as j,IncreaseDepth as w}from"../__internal__/depth.context.js";import{useMenuFocus as I}from"../__internal__/focus.context.js";import{useResponsiveVerticalMenu as x}from"../responsive-vertical-menu.context.js";import _ from"../../../icon/icon.component.js";import P from"../../../../__internal__/utils/helpers/guid/index.js";function k(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function $(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),r.forEach((function(n){k(e,n,t[n])}))}return e}function C(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n.push.apply(n,t)}return n}(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})),e}function D(e,n){if(null==e)return{};var t,r,o=function(e,n){if(null==e)return{};var t,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)t=i[r],n.indexOf(t)>=0||(o[t]=e[t]);return o}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)t=i[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}const M=l(void 0),S=({customIcon:t,depth:r,hasChildren:o,icon:i,label:l,responsive:c})=>n(y,t?{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:r,hasChildren:o,icon:!0,responsive:c,children:[t,l]}:{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:r,hasChildren:o,icon:!!i,responsive:c,children:[i&&e(_,{type:i}),l]}),A=s(((l,s)=>{var{children:y,customIcon:w,icon:_,id:P,href:k,label:A,onClick:E,rel:K,target:F}=l,q=D(l,["children","customIcon","icon","id","href","label","onClick","rel","target"]);const{activeMenuItem:R,containerRef:T,responsiveMode:z,setActive:B,setActiveMenuItem:G,reducedMotion:H,left:J,top:L,width:N,height:Q}=x(),{expandItem:U,focusItem:V,getRegisteredItems:W,moveFocus:X,registerMenuItem:Y}=I(),Z=j(),ee=(null==R?void 0:R.id)===P,ne=r.Children.count(y)>0,te=i(M),re=o(null),oe=d((()=>z&&0===Z),[Z,z]),[ie,le]=a(oe&&ne||Z>=2);c((()=>{Y(P,s,te)}),[P,te,s,Y]);const ce=e=>{let n,t;switch(e.key){case"Tab":var r;if(t=(null===(r=T.current)||void 0===r?void 0:r.querySelectorAll(`[data-depth="${Z}"]`))||[],n=Array.from(t),0===Z&&ne&&(null==R?void 0:R.id)===P&&e.shiftKey&&(e.preventDefault(),X("lastChild")),1===Z&&n.findIndex((e=>e.id===P))===n.length-1&&(!ne||ne&&!ie)&&(e.shiftKey||(e.preventDefault(),X("parent"))),2===Z&&n.findIndex((e=>e.id===P))===n.length-1&&(!ne||ne&&!ie)){const n=W(),t=n.find((e=>e.id===te)),r=n.find((e=>e.id===(null==t?void 0:t.parentId)));if(r){var o;const n=Array.from((null===(o=T.current)||void 0===o?void 0:o.querySelectorAll(`[data-depth="${Z-1}"]`))||[]);n.findIndex((e=>e.id===te))===n.length-1&&!e.shiftKey&&(e.preventDefault(),V(r.id))}}break;case"Enter":case" ":if(ne&&e.preventDefault(),E||" "!==e.key||e.preventDefault(),oe)return;if(ne)if(0!==Z||z)le(!ie),U(P,!ie);else{const e=(null==R?void 0:R.id)===P;G(e?null:{id:P,label:A,children:y})}else k&&"Enter"===e.key&&(window.location.href=k)}},se=e=>{null==E||E(e),B(!1)};return e(u,C($({},O(q)),{children:ne?n(t,{children:[n(m,C($({active:ee,"aria-expanded":z&&0===Z?void 0:ee||ie,"aria-controls":ee||ie?z?0===Z?void 0:`${P}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${P}`,"data-depth":Z,"data-role":`responsive-vertical-menu-item-${P}`,depth:Z,hasIcon:!!_||!!w,id:P,onClick:()=>{if(!oe){if(0!==Z||z)le(!ie),U(P,!ie);else{const e=(null==R?void 0:R.id)===P;G(e?null:{id:P,label:A,children:y})}V(P)}},onKeyDown:e=>{z||ce(e)},onFocus:()=>V(P),ref:s,responsive:z,tabIndex:oe?-1:0,type:"button"},q),{children:[e(S,{customIcon:w,depth:Z,hasChildren:!0,icon:_,label:A,responsive:z}),!oe&&e(v,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:Z,expanded:ie||ee,reduceMotion:!!H,type:Z>=1?"chevron_down_thick":"chevron_right_thick"})]})),ie&&e(h,{"data-component":`${P}-nested-menu-wrapper`,"data-role":`${P}-nested-menu-wrapper`,depth:Z,hasIcon:!!_||!!w,id:`${P}-nested-menu-wrapper`,responsive:z,children:e(f,{"data-component":`${P}-nested-menu`,"data-role":`${P}-nested-menu`,depth:Z,hasIcon:!!_||!!w,id:`${P}-nested-menu`,responsive:z,children:e(M.Provider,{value:P,children:y})})}),ee&&!z&&e(p,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:Q||"100%",id:"responsive-vertical-menu-secondary",left:J,menu:"secondary",reduceMotion:!1,ref:re,responsive:!1,tabIndex:-1,top:L,width:N,children:R.children})]}):(()=>{const n=$({"data-component":`responsive-vertical-menu-item-${P}`,"data-depth":Z,"data-role":`responsive-vertical-menu-item-${P}`,depth:Z,href:k,id:P,onClick:se,onFocus:()=>V(P),onKeyDown:e=>{z||ce(e)},rel:K,responsive:z,tabIndex:0,target:F},q),t=e(S,{customIcon:w,depth:Z,hasChildren:!1,icon:_,label:A,responsive:z});return e(E&&!k?b:g,C($({ref:s},n),{children:t}))})()}))})),E=n=>{var{children:t,id:r,label:l}=n,s=D(n,["children","id","label"]);const d=j(),a=o(null),{registerMenuItem:p}=I(),u=i(M),m=o(r||P());return c((()=>{const e=m.current;p(e,a,u)}),[u,p]),e(A,C($({id:m.current,label:l},s),{"data-depth":d,ref:a,children:t&&e(M.Provider,{value:r,children:e(w,{children:t})})}))};export{E as ResponsiveVerticalMenuItem,E as default};
+import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import r,{useRef as o,forwardRef as i,createContext as c,useMemo as l,useState as s}from"react";import{StyledResponsiveMenu as a}from"../responsive-vertical-menu.style.js";import{StyledResponsiveMenuListItem as d,StyledResponsiveMenuItem as p,StyledIcon as u,StyledNestedMenuWrapper as m,StyledNestedMenu as v,StyledMenuItemContent as h,StyledResponsiveMenuActionButton as f,StyledResponsiveMenuActionLink as y}from"./responsive-vertical-menu-item.style.js";import"../../../../style/utils/filter-styled-system-padding-props.js";import b from"../../../../style/utils/filter-styled-system-margin-props.js";import{useDepth as O,IncreaseDepth as j}from"../__internal__/depth.context.js";import{useResponsiveVerticalMenu as g}from"../responsive-vertical-menu.context.js";import w from"../../../icon/icon.component.js";import _ from"../../../../__internal__/utils/helpers/guid/index.js";import P from"../../../../__internal__/utils/helpers/events/events.js";function x(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function I(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),r.forEach((function(n){x(e,n,t[n])}))}return e}function $(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n.push.apply(n,t)}return n}(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})),e}function C(e,n){if(null==e)return{};var t,r,o=function(e,n){if(null==e)return{};var t,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)t=i[r],n.indexOf(t)>=0||(o[t]=e[t]);return o}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)t=i[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}const k=c(void 0),D=({customIcon:t,depth:r,hasChildren:o,icon:i,label:c,responsive:l})=>n(h,t?{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:r,hasChildren:o,icon:!0,responsive:l,children:[t,c]}:{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:r,hasChildren:o,icon:!!i,responsive:l,children:[i&&e(w,{type:i}),c]}),S=i(((i,c)=>{var{children:h,customIcon:j,icon:w,id:_,href:x,label:S,onClick:M,rel:K,target:E}=i,A=C(i,["children","customIcon","icon","id","href","label","onClick","rel","target"]);const{activeMenuItem:q,responsiveMode:z,setActive:B,setActiveMenuItem:F,reducedMotion:G,left:H,top:J,width:L,height:N}=g(),Q=O(),R=(null==q?void 0:q.id)===_,T=r.Children.count(h)>0,U=o(null),V=l((()=>z&&0===Q),[Q,z]),[W,X]=s(V&&T||Q>=2),Y=e=>{if(P.isEnterKey(e)||P.isSpaceKey(e)){if(T&&e.preventDefault(),!M&&P.isSpaceKey(e)&&e.preventDefault(),V)return;if(T)if(0!==Q||z)X(!W);else{const e=(null==q?void 0:q.id)===_;F(e?null:{id:_,label:S,children:h})}}},Z=e=>{null==M||M(e),B(!1)};return e(d,$(I({},b(A)),{children:T?n(t,{children:[n(p,$(I({active:R,"aria-expanded":z&&0===Q?void 0:R||W,"aria-controls":R||W?z?0===Q?void 0:`${_}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":Q,"data-role":`responsive-vertical-menu-item-${_}`,depth:Q,hasIcon:!!w||!!j,id:_,onClick:()=>{if(!V)if(0!==Q||z)X(!W);else{const e=(null==q?void 0:q.id)===_;F(e?null:{id:_,label:S,children:h})}},onKeyDown:e=>{z||Y(e)},ref:c,responsive:z,tabIndex:V?-1:0,type:"button"},A),{children:[e(D,{customIcon:j,depth:Q,hasChildren:!0,icon:w,label:S,responsive:z}),!V&&e(u,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:Q,expanded:W||R,reduceMotion:!!G,type:Q>=1?"chevron_down_thick":"chevron_right_thick"})]})),W&&e(m,{"data-component":`${_}-nested-menu-wrapper`,"data-role":`${_}-nested-menu-wrapper`,depth:Q,hasIcon:!!w||!!j,id:`${_}-nested-menu-wrapper`,responsive:z,children:e(v,{"data-component":`${_}-nested-menu`,"data-role":`${_}-nested-menu`,depth:Q,hasIcon:!!w||!!j,id:`${_}-nested-menu`,responsive:z,children:e(k.Provider,{value:_,children:h})})}),R&&!z&&e(a,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:N||"100%",id:"responsive-vertical-menu-secondary",left:H,menu:"secondary",reduceMotion:!1,ref:U,responsive:!1,tabIndex:-1,top:J,width:L,children:q.children})]}):(()=>{const n=I({"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":Q,"data-role":`responsive-vertical-menu-item-${_}`,depth:Q,href:x,id:_,onClick:Z,onKeyDown:e=>{z||Y(e)},rel:K,responsive:z,tabIndex:0,target:E},A),t=e(D,{customIcon:j,depth:Q,hasChildren:!1,icon:w,label:S,responsive:z});return e(M&&!x?f:y,$(I({ref:c},n),{children:t}))})()}))})),M=n=>{var{children:t,id:r,label:i}=n,c=C(n,["children","id","label"]);const l=O(),s=o(null),a=o(r||_());return e(S,$(I({id:a.current,label:i},c),{"data-depth":l,ref:s,children:t&&e(k.Provider,{value:r,children:e(j,{children:t})})}))};export{M as ResponsiveVerticalMenuItem,M as default};

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

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

package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.style.d.ts

@@ -12,6 +12,7 @@ interface StyledResponsiveMenuProps {
 interface StyledButtonProps {
     active?: boolean;
 }
+export declare const StyledBackdrop: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ModalContainer: import("styled-components").StyledComponent<"div", any, {
     width: string;
 }, never>;

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

@@ -1 +1 @@
-import o,{css as i}from"styled-components";import t from"../../button/button.component.js";import e from"../../../style/utils/add-focus-styling.js";const n=o.div.withConfig({displayName:"responsive-vertical-menu.style__ModalContainer",componentId:"sc-54b8b588-0"})(["position:fixed;top:0;",""],(({width:o})=>i(["width:",";"],o))),a=o(t).withConfig({displayName:"responsive-vertical-menu.style__StyledButton",componentId:"sc-54b8b588-1"})(["border-radius:0;background-color:var( ",' );[data-component="icon"]{color:var(--colorsUtilityYang100);}&:focus{appearance:none;-webkit-appearance:none;-webkit-box-shadow:',";box-shadow:",";border:1px solid black;outline:transparent 3px solid;}"],(({active:o})=>o?"--colorsActionMinorGray700":"--colorsUtilityYin100"),e(!0),e(!0)),r=o(t).withConfig({displayName:"responsive-vertical-menu.style__StyledCloseButton",componentId:"sc-54b8b588-2"})(['border-radius:0;[data-component="icon"]{color:var(--colorsUtilityYang100);}']),s=o.div.withConfig({displayName:"responsive-vertical-menu.style__StyledGlobalVerticalMenuWrapper",componentId:"sc-54b8b588-3"})(["background-color:black;color:white;display:flex;flex-direction:row;position:absolute;width:fit-content;"]),l=o.ul.withConfig({displayName:"responsive-vertical-menu.style__StyledResponsiveMenu",componentId:"sc-54b8b588-4"})(["margin:0;padding:0;align-items:stretch;background-color:var(--colorsUtilityYin100);box-sizing:border-box;display:flex;flex-direction:column;height:",";justify-content:flex-start;overflow-y:auto;padding-bottom:var(--spacing100);",";padding-top:var(--spacing100);position:fixed;width:",";max-width:375px;z-index:1000;border-right:",";"," "," ",""],(({height:o})=>o||"100%"),(({responsive:o})=>!o&&i(["padding-left:var(--spacing200);padding-right:var(--spacing200);"])),(({width:o})=>o||"100%"),(({childOpen:o,menu:i})=>"secondary"===i||!o&&"primary"===i?"2px solid var(--colorsGray850)":"1px solid var(--colorsGray850)"),(({top:o})=>i(["top:",";max-height:calc(100% - ",");"],o,"auto"===o?"40px":o)),(({childOpen:o})=>o&&i(["padding-right:calc(var(--spacing200) + 1px);"])),(({height:o,left:t,menu:e})=>"secondary"===e&&i(["left:",";height:",";"],t,o)));export{n as ModalContainer,a as StyledButton,r as StyledCloseButton,s as StyledGlobalVerticalMenuWrapper,l as StyledResponsiveMenu};
+import o,{css as i}from"styled-components";import e from"../../button/button.component.js";import t from"../../../style/utils/add-focus-styling.js";const n=o.div.withConfig({displayName:"responsive-vertical-menu.style__StyledBackdrop",componentId:"sc-fef5633f-0"})(["position:fixed;inset:0;"]),a=o.div.withConfig({displayName:"responsive-vertical-menu.style__ModalContainer",componentId:"sc-fef5633f-1"})(["position:fixed;top:0;",""],(({width:o})=>i(["width:",";"],o))),r=o(e).withConfig({displayName:"responsive-vertical-menu.style__StyledButton",componentId:"sc-fef5633f-2"})(["border-radius:0;background-color:var( ",' );[data-component="icon"]{color:var(--colorsUtilityYang100);}&:focus{appearance:none;-webkit-appearance:none;-webkit-box-shadow:',";box-shadow:",";border:1px solid black;outline:transparent 3px solid;}"],(({active:o})=>o?"--colorsActionMinorGray700":"--colorsUtilityYin100"),t(!0),t(!0)),s=o(e).withConfig({displayName:"responsive-vertical-menu.style__StyledCloseButton",componentId:"sc-fef5633f-3"})(['border-radius:0;[data-component="icon"]{color:var(--colorsUtilityYang100);}']),l=o.div.withConfig({displayName:"responsive-vertical-menu.style__StyledGlobalVerticalMenuWrapper",componentId:"sc-fef5633f-4"})(["background-color:black;color:white;display:flex;flex-direction:row;position:absolute;width:fit-content;"]),d=o.ul.withConfig({displayName:"responsive-vertical-menu.style__StyledResponsiveMenu",componentId:"sc-fef5633f-5"})(["margin:0;padding:0;align-items:stretch;background-color:var(--colorsUtilityYin100);box-sizing:border-box;display:flex;flex-direction:column;height:",";justify-content:flex-start;overflow-y:auto;padding-bottom:var(--spacing100);",";padding-top:var(--spacing100);position:fixed;width:",";max-width:375px;z-index:1000;border-right:",";"," "," ",""],(({height:o})=>o||"100%"),(({responsive:o})=>!o&&i(["padding-left:var(--spacing200);padding-right:var(--spacing200);"])),(({width:o})=>o||"100%"),(({childOpen:o,menu:i})=>"secondary"===i||!o&&"primary"===i?"2px solid var(--colorsGray850)":"1px solid var(--colorsGray850)"),(({top:o})=>i(["top:",";max-height:calc(100% - ",");"],o,"auto"===o?"40px":o)),(({childOpen:o})=>o&&i(["padding-right:calc(var(--spacing200) + 1px);"])),(({height:o,left:e,menu:t})=>"secondary"===t&&i(["left:",";height:",";"],e,o)));export{a as ModalContainer,n as StyledBackdrop,r as StyledButton,s as StyledCloseButton,l as StyledGlobalVerticalMenuWrapper,d as StyledResponsiveMenu};

package/lib/__internal__/modal/modal.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("react-transition-group"),o=require("../../hooks/__internal__/useScrollBlock/useScrollBlock.js"),n=require("../../components/portal/portal.js"),l=require("../dom/globals.js"),a=require("../utils/helpers/events/events.js"),s=require("../../hooks/__internal__/useModalManager/useModalManager.js"),i=require("./modal.style.js"),c=require("./modal.context.js");function u(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function d(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){u(e,r,t[r])}))}return e}const p=300;exports.default=u=>{var{children:f,"data-element":m,"data-role":b="modal",open:O,onCancel:j,disableEscKey:g=!1,disableClose:y,enableBackgroundUI:v=!1,topModalOverride:h,restoreFocusOnClose:S=!0}=u,P=function(e,r){if(null==e)return{};var t,o,n=function(e,r){if(null==e)return{};var t,o,n={},l=Object.keys(e);for(o=0;o<l.length;o++)t=l[o],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(o=0;o<l.length;o++)t=l[o],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(u,["children","data-element","data-role","open","onCancel","disableEscKey","disableClose","enableBackgroundUI","topModalOverride","restoreFocusOnClose"]);const k=r.useRef(null),x=r.useRef(null),M=r.useRef(null),[w,E]=r.useState(!1),[C,q]=r.useState(!1),{blockScroll:_,allowScroll:R}=o.default();r.useEffect((()=>{v||(O?_():R())}),[R,_,v,O]),r.useEffect((()=>()=>{v||R()}),[R,v]);const T=r.useCallback((e=>{j&&!y&&!g&&a.default.isEscKey(e)&&(e.stopImmediatePropagation(),j(e))}),[y,g,j]),B=l.getDocument();let D,I;return s.default({open:O,closeModal:T,modalRef:k,setTriggerRefocusFlag:q,topModalOverride:h,focusCallToActionElement:S&&B?B.activeElement:void 0}),O&&(D=v?null:e.jsx(i.StyledModalBackground,{ref:x,"data-element":"modal-background","data-role":"modal-background",transitionName:"modal-background",transitionTime:p}),I=f),e.jsx(n.Portal,{children:e.jsxs(i.StyledModal,(F=d({"data-component":"modal","data-element":m,"data-role":b,"data-state":O?"open":"closed",transitionName:"modal",transitionTime:p,topModalOverride:h,ref:k},P),N={children:[e.jsx(t.TransitionGroup,{children:D&&e.jsx(t.CSSTransition,{nodeRef:x,appear:!0,classNames:"modal-background",timeout:p,onEntered:()=>E(!0),onExiting:()=>E(!1),children:D},"modal")}),e.jsx(t.TransitionGroup,{children:I&&e.jsx(t.CSSTransition,{nodeRef:M,appear:!0,classNames:"modal",timeout:p,children:e.jsx(c.default.Provider,{value:{isAnimationComplete:w,triggerRefocusFlag:C,isInModal:!0},children:e.jsx("div",{ref:M,children:I})})})})]},N=null!=N?N:{},Object.getOwnPropertyDescriptors?Object.defineProperties(F,Object.getOwnPropertyDescriptors(N)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(N)).forEach((function(e){Object.defineProperty(F,e,Object.getOwnPropertyDescriptor(N,e))})),F))});var F,N};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("react-transition-group"),o=require("../../hooks/__internal__/useScrollBlock/useScrollBlock.js"),n=require("../../components/portal/portal.js"),l=require("../dom/globals.js"),a=require("../utils/helpers/events/events.js"),s=require("../../hooks/__internal__/useModalManager/useModalManager.js"),i=require("./modal.style.js"),c=require("./modal.context.js");function u(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function d(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){u(e,r,t[r])}))}return e}const p=300;exports.default=u=>{var{children:f,"data-element":m,"data-role":b="modal",open:O,onCancel:j,disableEscKey:g=!1,disableClose:y,enableBackgroundUI:v=!1,topModalOverride:h,restoreFocusOnClose:S=!0}=u,P=function(e,r){if(null==e)return{};var t,o,n=function(e,r){if(null==e)return{};var t,o,n={},l=Object.keys(e);for(o=0;o<l.length;o++)t=l[o],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(o=0;o<l.length;o++)t=l[o],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(u,["children","data-element","data-role","open","onCancel","disableEscKey","disableClose","enableBackgroundUI","topModalOverride","restoreFocusOnClose"]);const k=r.useRef(null),x=r.useRef(null),M=r.useRef(null),[w,E]=r.useState(!1),[C,q]=r.useState(!1),{blockScroll:_,allowScroll:R}=o.default();r.useEffect((()=>{v||(O?_():R())}),[R,_,v,O]),r.useEffect((()=>()=>{v||R()}),[R,v]);const T=r.useCallback((e=>{j&&!y&&!g&&a.default.isEscKey(e)&&(e.stopImmediatePropagation(),j(e))}),[y,g,j]),B=l.getDocument();let D,I;return s.default({open:O,closeModal:T,modalRef:k,setTriggerRefocusFlag:q,topModalOverride:h,focusCallToActionElement:S&&B?B.activeElement:void 0}),O&&(D=v?null:e.jsx(i.StyledModalBackground,{ref:x,"data-element":"modal-background","data-role":"modal-background",transitionName:"modal-background",transitionTime:p}),I=f),e.jsx(n.Portal,{children:e.jsxs(i.StyledModal,(F=d({"data-component":"modal","data-element":m,"data-role":b,"data-state":O&&w?"open":"closed",transitionName:"modal",transitionTime:p,topModalOverride:h,ref:k},P),N={children:[e.jsx(t.TransitionGroup,{children:D&&e.jsx(t.CSSTransition,{nodeRef:x,appear:!0,classNames:"modal-background",timeout:p,onEntered:()=>E(!0),onExiting:()=>E(!1),children:D},"modal")}),e.jsx(t.TransitionGroup,{children:I&&e.jsx(t.CSSTransition,{nodeRef:M,appear:!0,classNames:"modal",timeout:p,children:e.jsx(c.default.Provider,{value:{isAnimationComplete:w,triggerRefocusFlag:C,isInModal:!0},children:e.jsx("div",{ref:M,children:I})})})})]},N=null!=N?N:{},Object.getOwnPropertyDescriptors?Object.defineProperties(F,Object.getOwnPropertyDescriptors(N)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(N)).forEach((function(e){Object.defineProperty(F,e,Object.getOwnPropertyDescriptor(N,e))})),F))});var F,N};

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../responsive-vertical-menu.style.js"),r=require("./responsive-vertical-menu-item.style.js");require("../../../../style/utils/filter-styled-system-padding-props.js");var i=require("../../../../style/utils/filter-styled-system-margin-props.js"),o=require("../__internal__/depth.context.js"),s=require("../__internal__/focus.context.js"),l=require("../responsive-vertical-menu.context.js"),c=require("../../../icon/icon.component.js"),d=require("../../../../__internal__/utils/helpers/guid/index.js");function a(e){return e&&e.__esModule?e:{default:e}}var u=a(t);function p(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function v(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){p(e,t,n[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 n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))})),e}function f(e,t){if(null==e)return{};var n,r,i=function(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}const m=t.createContext(void 0),y=({customIcon:t,depth:n,hasChildren:i,icon:o,label:s,responsive:l})=>t?e.jsxs(r.StyledMenuItemContent,{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:n,hasChildren:i,icon:!0,responsive:l,children:[t,s]}):e.jsxs(r.StyledMenuItemContent,{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:n,hasChildren:i,icon:!!o,responsive:l,children:[o&&e.jsx(c.default,{type:o}),s]}),j=t.forwardRef(((c,d)=>{var{children:a,customIcon:p,icon:j,id:b,href:x,label:g,onClick:O,rel:I,target:w}=c,M=f(c,["children","customIcon","icon","id","href","label","onClick","rel","target"]);const{activeMenuItem:_,containerRef:S,responsiveMode:C,setActive:P,setActiveMenuItem:k,reducedMotion:D,left:q,top:R,width:$,height:A}=l.useResponsiveVerticalMenu(),{expandItem:E,focusItem:F,getRegisteredItems:K,moveFocus:L,registerMenuItem:N}=s.useMenuFocus(),V=o.useDepth(),B=(null==_?void 0:_.id)===b,T=u.default.Children.count(a)>0,W=t.useContext(m),z=t.useRef(null),G=t.useMemo((()=>C&&0===V),[V,C]),[H,J]=t.useState(G&&T||V>=2);t.useEffect((()=>{N(b,d,W)}),[b,W,d,N]);const Q=e=>{let t,n;switch(e.key){case"Tab":var r;if(n=(null===(r=S.current)||void 0===r?void 0:r.querySelectorAll(`[data-depth="${V}"]`))||[],t=Array.from(n),0===V&&T&&(null==_?void 0:_.id)===b&&e.shiftKey&&(e.preventDefault(),L("lastChild")),1===V&&t.findIndex((e=>e.id===b))===t.length-1&&(!T||T&&!H)&&(e.shiftKey||(e.preventDefault(),L("parent"))),2===V&&t.findIndex((e=>e.id===b))===t.length-1&&(!T||T&&!H)){const t=K(),n=t.find((e=>e.id===W)),r=t.find((e=>e.id===(null==n?void 0:n.parentId)));if(r){var i;const t=Array.from((null===(i=S.current)||void 0===i?void 0:i.querySelectorAll(`[data-depth="${V-1}"]`))||[]);t.findIndex((e=>e.id===W))===t.length-1&&!e.shiftKey&&(e.preventDefault(),F(r.id))}}break;case"Enter":case" ":if(T&&e.preventDefault(),O||" "!==e.key||e.preventDefault(),G)return;if(T)if(0!==V||C)J(!H),E(b,!H);else{const e=(null==_?void 0:_.id)===b;k(e?null:{id:b,label:g,children:a})}else x&&"Enter"===e.key&&(window.location.href=x)}},U=e=>{null==O||O(e),P(!1)};return e.jsx(r.StyledResponsiveMenuListItem,h(v({},i.default(M)),{children:T?e.jsxs(e.Fragment,{children:[e.jsxs(r.StyledResponsiveMenuItem,h(v({active:B,"aria-expanded":C&&0===V?void 0:B||H,"aria-controls":B||H?C?0===V?void 0:`${b}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${b}`,"data-depth":V,"data-role":`responsive-vertical-menu-item-${b}`,depth:V,hasIcon:!!j||!!p,id:b,onClick:()=>{if(!G){if(0!==V||C)J(!H),E(b,!H);else{const e=(null==_?void 0:_.id)===b;k(e?null:{id:b,label:g,children:a})}F(b)}},onKeyDown:e=>{C||Q(e)},onFocus:()=>F(b),ref:d,responsive:C,tabIndex:G?-1:0,type:"button"},M),{children:[e.jsx(y,{customIcon:p,depth:V,hasChildren:!0,icon:j,label:g,responsive:C}),!G&&e.jsx(r.StyledIcon,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:V,expanded:H||B,reduceMotion:!!D,type:V>=1?"chevron_down_thick":"chevron_right_thick"})]})),H&&e.jsx(r.StyledNestedMenuWrapper,{"data-component":`${b}-nested-menu-wrapper`,"data-role":`${b}-nested-menu-wrapper`,depth:V,hasIcon:!!j||!!p,id:`${b}-nested-menu-wrapper`,responsive:C,children:e.jsx(r.StyledNestedMenu,{"data-component":`${b}-nested-menu`,"data-role":`${b}-nested-menu`,depth:V,hasIcon:!!j||!!p,id:`${b}-nested-menu`,responsive:C,children:e.jsx(m.Provider,{value:b,children:a})})}),B&&!C&&e.jsx(n.StyledResponsiveMenu,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:A||"100%",id:"responsive-vertical-menu-secondary",left:q,menu:"secondary",reduceMotion:!1,ref:z,responsive:!1,tabIndex:-1,top:R,width:$,children:_.children})]}):(()=>{const t=v({"data-component":`responsive-vertical-menu-item-${b}`,"data-depth":V,"data-role":`responsive-vertical-menu-item-${b}`,depth:V,href:x,id:b,onClick:U,onFocus:()=>F(b),onKeyDown:e=>{C||Q(e)},rel:I,responsive:C,tabIndex:0,target:w},M),n=e.jsx(y,{customIcon:p,depth:V,hasChildren:!1,icon:j,label:g,responsive:C});return O&&!x?e.jsx(r.StyledResponsiveMenuActionButton,h(v({ref:d},t),{children:n})):e.jsx(r.StyledResponsiveMenuActionLink,h(v({ref:d},t),{children:n}))})()}))})),b=n=>{var{children:r,id:i,label:l}=n,c=f(n,["children","id","label"]);const a=o.useDepth(),u=t.useRef(null),{registerMenuItem:p}=s.useMenuFocus(),y=t.useContext(m),b=t.useRef(i||d.default());return t.useEffect((()=>{const e=b.current;p(e,u,y)}),[y,p]),e.jsx(j,h(v({id:b.current,label:l},c),{"data-depth":a,ref:u,children:r&&e.jsx(m.Provider,{value:i,children:e.jsx(o.IncreaseDepth,{children:r})})}))};exports.ResponsiveVerticalMenuItem=b,exports.default=b;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../responsive-vertical-menu.style.js"),r=require("./responsive-vertical-menu-item.style.js");require("../../../../style/utils/filter-styled-system-padding-props.js");var i=require("../../../../style/utils/filter-styled-system-margin-props.js"),s=require("../__internal__/depth.context.js"),o=require("../responsive-vertical-menu.context.js"),l=require("../../../icon/icon.component.js"),c=require("../../../../__internal__/utils/helpers/guid/index.js"),a=require("../../../../__internal__/utils/helpers/events/events.js");function d(e){return e&&e.__esModule?e:{default:e}}var u=d(t);function p(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function v(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){p(e,t,n[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 n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))})),e}function m(e,t){if(null==e)return{};var n,r,i=function(e,t){if(null==e)return{};var n,r,i={},s=Object.keys(e);for(r=0;r<s.length;r++)n=s[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(r=0;r<s.length;r++)n=s[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}const f=t.createContext(void 0),y=({customIcon:t,depth:n,hasChildren:i,icon:s,label:o,responsive:c})=>t?e.jsxs(r.StyledMenuItemContent,{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:n,hasChildren:i,icon:!0,responsive:c,children:[t,o]}):e.jsxs(r.StyledMenuItemContent,{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:n,hasChildren:i,icon:!!s,responsive:c,children:[s&&e.jsx(l.default,{type:s}),o]}),j=t.forwardRef(((l,c)=>{var{children:d,customIcon:p,icon:j,id:b,href:x,label:O,onClick:g,rel:w,target:I}=l,M=m(l,["children","customIcon","icon","id","href","label","onClick","rel","target"]);const{activeMenuItem:_,responsiveMode:S,setActive:P,setActiveMenuItem:C,reducedMotion:q,left:D,top:R,width:$,height:k}=o.useResponsiveVerticalMenu(),K=s.useDepth(),A=(null==_?void 0:_.id)===b,E=u.default.Children.count(d)>0,L=t.useRef(null),N=t.useMemo((()=>S&&0===K),[K,S]),[V,B]=t.useState(N&&E||K>=2),F=e=>{if(a.default.isEnterKey(e)||a.default.isSpaceKey(e)){if(E&&e.preventDefault(),!g&&a.default.isSpaceKey(e)&&e.preventDefault(),N)return;if(E)if(0!==K||S)B(!V);else{const e=(null==_?void 0:_.id)===b;C(e?null:{id:b,label:O,children:d})}}},W=e=>{null==g||g(e),P(!1)};return e.jsx(r.StyledResponsiveMenuListItem,h(v({},i.default(M)),{children:E?e.jsxs(e.Fragment,{children:[e.jsxs(r.StyledResponsiveMenuItem,h(v({active:A,"aria-expanded":S&&0===K?void 0:A||V,"aria-controls":A||V?S?0===K?void 0:`${b}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${b}`,"data-depth":K,"data-role":`responsive-vertical-menu-item-${b}`,depth:K,hasIcon:!!j||!!p,id:b,onClick:()=>{if(!N)if(0!==K||S)B(!V);else{const e=(null==_?void 0:_.id)===b;C(e?null:{id:b,label:O,children:d})}},onKeyDown:e=>{S||F(e)},ref:c,responsive:S,tabIndex:N?-1:0,type:"button"},M),{children:[e.jsx(y,{customIcon:p,depth:K,hasChildren:!0,icon:j,label:O,responsive:S}),!N&&e.jsx(r.StyledIcon,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:K,expanded:V||A,reduceMotion:!!q,type:K>=1?"chevron_down_thick":"chevron_right_thick"})]})),V&&e.jsx(r.StyledNestedMenuWrapper,{"data-component":`${b}-nested-menu-wrapper`,"data-role":`${b}-nested-menu-wrapper`,depth:K,hasIcon:!!j||!!p,id:`${b}-nested-menu-wrapper`,responsive:S,children:e.jsx(r.StyledNestedMenu,{"data-component":`${b}-nested-menu`,"data-role":`${b}-nested-menu`,depth:K,hasIcon:!!j||!!p,id:`${b}-nested-menu`,responsive:S,children:e.jsx(f.Provider,{value:b,children:d})})}),A&&!S&&e.jsx(n.StyledResponsiveMenu,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:k||"100%",id:"responsive-vertical-menu-secondary",left:D,menu:"secondary",reduceMotion:!1,ref:L,responsive:!1,tabIndex:-1,top:R,width:$,children:_.children})]}):(()=>{const t=v({"data-component":`responsive-vertical-menu-item-${b}`,"data-depth":K,"data-role":`responsive-vertical-menu-item-${b}`,depth:K,href:x,id:b,onClick:W,onKeyDown:e=>{S||F(e)},rel:w,responsive:S,tabIndex:0,target:I},M),n=e.jsx(y,{customIcon:p,depth:K,hasChildren:!1,icon:j,label:O,responsive:S});return g&&!x?e.jsx(r.StyledResponsiveMenuActionButton,h(v({ref:c},t),{children:n})):e.jsx(r.StyledResponsiveMenuActionLink,h(v({ref:c},t),{children:n}))})()}))})),b=n=>{var{children:r,id:i,label:o}=n,l=m(n,["children","id","label"]);const a=s.useDepth(),d=t.useRef(null),u=t.useRef(i||c.default());return e.jsx(j,h(v({id:u.current,label:o},l),{"data-depth":a,ref:d,children:r&&e.jsx(f.Provider,{value:i,children:e.jsx(s.IncreaseDepth,{children:r})})}))};exports.ResponsiveVerticalMenuItem=b,exports.default=b;

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

package/lib/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.style.d.ts

@@ -12,6 +12,7 @@ interface StyledResponsiveMenuProps {
 interface StyledButtonProps {
     active?: boolean;
 }
+export declare const StyledBackdrop: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ModalContainer: import("styled-components").StyledComponent<"div", any, {
     width: string;
 }, never>;

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

@@ -1 +1 @@
-"use strict";var e=require("styled-components"),t=require("../../button/button.component.js"),o=require("../../../style/utils/add-focus-styling.js");function i(e){return e&&e.__esModule?e:{default:e}}var n=i(e);const a=n.default.div.withConfig({displayName:"responsive-vertical-menu.style__ModalContainer",componentId:"sc-54b8b588-0"})(["position:fixed;top:0;",""],(({width:t})=>e.css(["width:",";"],t))),r=n.default(t.default).withConfig({displayName:"responsive-vertical-menu.style__StyledButton",componentId:"sc-54b8b588-1"})(["border-radius:0;background-color:var( ",' );[data-component="icon"]{color:var(--colorsUtilityYang100);}&:focus{appearance:none;-webkit-appearance:none;-webkit-box-shadow:',";box-shadow:",";border:1px solid black;outline:transparent 3px solid;}"],(({active:e})=>e?"--colorsActionMinorGray700":"--colorsUtilityYin100"),o.default(!0),o.default(!0)),s=n.default(t.default).withConfig({displayName:"responsive-vertical-menu.style__StyledCloseButton",componentId:"sc-54b8b588-2"})(['border-radius:0;[data-component="icon"]{color:var(--colorsUtilityYang100);}']),l=n.default.div.withConfig({displayName:"responsive-vertical-menu.style__StyledGlobalVerticalMenuWrapper",componentId:"sc-54b8b588-3"})(["background-color:black;color:white;display:flex;flex-direction:row;position:absolute;width:fit-content;"]),d=n.default.ul.withConfig({displayName:"responsive-vertical-menu.style__StyledResponsiveMenu",componentId:"sc-54b8b588-4"})(["margin:0;padding:0;align-items:stretch;background-color:var(--colorsUtilityYin100);box-sizing:border-box;display:flex;flex-direction:column;height:",";justify-content:flex-start;overflow-y:auto;padding-bottom:var(--spacing100);",";padding-top:var(--spacing100);position:fixed;width:",";max-width:375px;z-index:1000;border-right:",";"," "," ",""],(({height:e})=>e||"100%"),(({responsive:t})=>!t&&e.css(["padding-left:var(--spacing200);padding-right:var(--spacing200);"])),(({width:e})=>e||"100%"),(({childOpen:e,menu:t})=>"secondary"===t||!e&&"primary"===t?"2px solid var(--colorsGray850)":"1px solid var(--colorsGray850)"),(({top:t})=>e.css(["top:",";max-height:calc(100% - ",");"],t,"auto"===t?"40px":t)),(({childOpen:t})=>t&&e.css(["padding-right:calc(var(--spacing200) + 1px);"])),(({height:t,left:o,menu:i})=>"secondary"===i&&e.css(["left:",";height:",";"],o,t)));exports.ModalContainer=a,exports.StyledButton=r,exports.StyledCloseButton=s,exports.StyledGlobalVerticalMenuWrapper=l,exports.StyledResponsiveMenu=d;
+"use strict";var e=require("styled-components"),t=require("../../button/button.component.js"),o=require("../../../style/utils/add-focus-styling.js");function i(e){return e&&e.__esModule?e:{default:e}}var n=i(e);const a=n.default.div.withConfig({displayName:"responsive-vertical-menu.style__StyledBackdrop",componentId:"sc-fef5633f-0"})(["position:fixed;inset:0;"]),s=n.default.div.withConfig({displayName:"responsive-vertical-menu.style__ModalContainer",componentId:"sc-fef5633f-1"})(["position:fixed;top:0;",""],(({width:t})=>e.css(["width:",";"],t))),r=n.default(t.default).withConfig({displayName:"responsive-vertical-menu.style__StyledButton",componentId:"sc-fef5633f-2"})(["border-radius:0;background-color:var( ",' );[data-component="icon"]{color:var(--colorsUtilityYang100);}&:focus{appearance:none;-webkit-appearance:none;-webkit-box-shadow:',";box-shadow:",";border:1px solid black;outline:transparent 3px solid;}"],(({active:e})=>e?"--colorsActionMinorGray700":"--colorsUtilityYin100"),o.default(!0),o.default(!0)),l=n.default(t.default).withConfig({displayName:"responsive-vertical-menu.style__StyledCloseButton",componentId:"sc-fef5633f-3"})(['border-radius:0;[data-component="icon"]{color:var(--colorsUtilityYang100);}']),d=n.default.div.withConfig({displayName:"responsive-vertical-menu.style__StyledGlobalVerticalMenuWrapper",componentId:"sc-fef5633f-4"})(["background-color:black;color:white;display:flex;flex-direction:row;position:absolute;width:fit-content;"]),c=n.default.ul.withConfig({displayName:"responsive-vertical-menu.style__StyledResponsiveMenu",componentId:"sc-fef5633f-5"})(["margin:0;padding:0;align-items:stretch;background-color:var(--colorsUtilityYin100);box-sizing:border-box;display:flex;flex-direction:column;height:",";justify-content:flex-start;overflow-y:auto;padding-bottom:var(--spacing100);",";padding-top:var(--spacing100);position:fixed;width:",";max-width:375px;z-index:1000;border-right:",";"," "," ",""],(({height:e})=>e||"100%"),(({responsive:t})=>!t&&e.css(["padding-left:var(--spacing200);padding-right:var(--spacing200);"])),(({width:e})=>e||"100%"),(({childOpen:e,menu:t})=>"secondary"===t||!e&&"primary"===t?"2px solid var(--colorsGray850)":"1px solid var(--colorsGray850)"),(({top:t})=>e.css(["top:",";max-height:calc(100% - ",");"],t,"auto"===t?"40px":t)),(({childOpen:t})=>t&&e.css(["padding-right:calc(var(--spacing200) + 1px);"])),(({height:t,left:o,menu:i})=>"secondary"===i&&e.css(["left:",";height:",";"],o,t)));exports.ModalContainer=s,exports.StyledBackdrop=a,exports.StyledButton=r,exports.StyledCloseButton=l,exports.StyledGlobalVerticalMenuWrapper=d,exports.StyledResponsiveMenu=c;

package/package.json

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

package/esm/components/vertical-menu/responsive-vertical-menu/__internal__/focus.context.d.ts

@@ -1,24 +0,0 @@
-/**
- * Provides context for managing focus within a menu component.
- * This context allows for tracking expanded items, focusing on specific items,
- * and moving focus in various directions (next, previous, parent, first child, last child).
- */
-import React, { ReactNode, RefObject } from "react";
-interface MenuFocusContextType {
-    expandedItems: string[];
-    expandItem: (id: string, expand: boolean) => void;
-    focusedItemId: string | null;
-    getRegisteredItems: () => Array<{
-        id: string;
-        ref: RefObject<HTMLElement>;
-        parentId?: string;
-    }>;
-    focusItem: (id: string) => void;
-    moveFocus: (direction: "next" | "prev" | "parent" | "lastChild") => void;
-    registerMenuItem: (id: string, ref: RefObject<HTMLElement>, parentId?: string) => void;
-}
-export declare const useMenuFocus: () => MenuFocusContextType;
-export declare const MenuFocusProvider: ({ children }: {
-    children: ReactNode;
-}) => React.JSX.Element;
-export {};

package/esm/components/vertical-menu/responsive-vertical-menu/__internal__/focus.context.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{useContext as r,createContext as t,useState as n,useRef as d,useCallback as s}from"react";import i from"../../../../__internal__/utils/logger/index.js";const c=t(void 0),u=()=>r(c)||(i.error("useMenuFocus must be used within a MenuFocusProvider"),{expandedItems:[],expandItem:()=>{},focusedItemId:null,getRegisteredItems:()=>[],focusItem:()=>{},moveFocus:()=>{},registerMenuItem:()=>{}}),l=({children:r})=>{const[t,i]=n([]),[u,l]=n(null),o=d(new Map),I=s(((e,r,t)=>{if(o.current.set(e,{ref:r,parentId:t,childIds:[]}),t){const r=o.current.get(t);null==r||r.childIds.push(e)}}),[]),a=s((()=>Array.from(o.current.entries()).map((([e,{ref:r,parentId:t,childIds:n}])=>({id:e,ref:r,parentId:t,childIds:n})))),[]),f=s((e=>{var r;const t=o.current.get(e);(null==t||null===(r=t.ref)||void 0===r?void 0:r.current)&&(t.ref.current.focus(),l(e))}),[]),m=s(((e,r)=>{i(r?r=>[...r,e]:r=>r.filter((r=>r!==e)))}),[]),h=s((e=>{if(!u)return;const r=o.current.get(u);if(!r)return;let n=[],d=[],s=-1;switch(e){case"parent":r.parentId&&f(r.parentId);break;case"lastChild":if(r.childIds.length>0){const e=r.childIds[r.childIds.length-1];if(e)if(t.includes(e)){const r=a().find((r=>r.id===e));r&&f(r.childIds[r.childIds.length-1])}else f(e)}break;default:if(n=Array.from(o.current.keys()),d=n.filter((e=>{const r=o.current.get(e);return!r||!r.parentId||t.includes(r.parentId)})),s=d.indexOf(u),-1!==s){const r="next"===e?(s+1)%d.length:(s-1+d.length)%d.length;f(d[r])}}}),[u,f,t,m,a]),p={expandedItems:t,expandItem:m,focusedItemId:u,focusItem:f,getRegisteredItems:a,registerMenuItem:I,moveFocus:h};return e(c.Provider,{value:p,children:r})};export{l as MenuFocusProvider,u as useMenuFocus};

package/lib/components/vertical-menu/responsive-vertical-menu/__internal__/focus.context.d.ts

@@ -1,24 +0,0 @@
-/**
- * Provides context for managing focus within a menu component.
- * This context allows for tracking expanded items, focusing on specific items,
- * and moving focus in various directions (next, previous, parent, first child, last child).
- */
-import React, { ReactNode, RefObject } from "react";
-interface MenuFocusContextType {
-    expandedItems: string[];
-    expandItem: (id: string, expand: boolean) => void;
-    focusedItemId: string | null;
-    getRegisteredItems: () => Array<{
-        id: string;
-        ref: RefObject<HTMLElement>;
-        parentId?: string;
-    }>;
-    focusItem: (id: string) => void;
-    moveFocus: (direction: "next" | "prev" | "parent" | "lastChild") => void;
-    registerMenuItem: (id: string, ref: RefObject<HTMLElement>, parentId?: string) => void;
-}
-export declare const useMenuFocus: () => MenuFocusContextType;
-export declare const MenuFocusProvider: ({ children }: {
-    children: ReactNode;
-}) => React.JSX.Element;
-export {};

package/lib/components/vertical-menu/responsive-vertical-menu/__internal__/focus.context.js

@@ -1 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../__internal__/utils/logger/index.js");const s=t.createContext(void 0);exports.MenuFocusProvider=({children:r})=>{const[n,u]=t.useState([]),[d,c]=t.useState(null),l=t.useRef(new Map),i=t.useCallback(((e,t,r)=>{if(l.current.set(e,{ref:t,parentId:r,childIds:[]}),r){const t=l.current.get(r);null==t||t.childIds.push(e)}}),[]),a=t.useCallback((()=>Array.from(l.current.entries()).map((([e,{ref:t,parentId:r,childIds:s}])=>({id:e,ref:t,parentId:r,childIds:s})))),[]),o=t.useCallback((e=>{var t;const r=l.current.get(e);(null==r||null===(t=r.ref)||void 0===t?void 0:t.current)&&(r.ref.current.focus(),c(e))}),[]),I=t.useCallback(((e,t)=>{u(t?t=>[...t,e]:t=>t.filter((t=>t!==e)))}),[]),f=t.useCallback((e=>{if(!d)return;const t=l.current.get(d);if(!t)return;let r=[],s=[],u=-1;switch(e){case"parent":t.parentId&&o(t.parentId);break;case"lastChild":if(t.childIds.length>0){const e=t.childIds[t.childIds.length-1];if(e)if(n.includes(e)){const t=a().find((t=>t.id===e));t&&o(t.childIds[t.childIds.length-1])}else o(e)}break;default:if(r=Array.from(l.current.keys()),s=r.filter((e=>{const t=l.current.get(e);return!t||!t.parentId||n.includes(t.parentId)})),u=s.indexOf(d),-1!==u){const t="next"===e?(u+1)%s.length:(u-1+s.length)%s.length;o(s[t])}}}),[d,o,n,I,a]),h={expandedItems:n,expandItem:I,focusedItemId:d,focusItem:o,getRegisteredItems:a,registerMenuItem:i,moveFocus:f};return e.jsx(s.Provider,{value:h,children:r})},exports.useMenuFocus=()=>t.useContext(s)||(r.default.error("useMenuFocus must be used within a MenuFocusProvider"),{expandedItems:[],expandItem:()=>{},focusedItemId:null,getRegisteredItems:()=>[],focusItem:()=>{},moveFocus:()=>{},registerMenuItem:()=>{}});