UNPKG

carbon-react

Version:

A library of reusable React components for easily building user interfaces.

2 lines (1 loc) 2.82 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),n=require("react-transition-group"),l=require("./menu-full-screen.style.js"),t=require("../menu.style.js"),o=require("../__internal__/strict-menu.context.js"),a=require("../../../__internal__/utils/helpers/events/events.js"),i=require("../../box/box.component.js"),u=require("../../icon-button/icon-button.component.js"),s=require("../../icon/icon.component.js"),d=require("../../portal/portal.js"),c=require("../../../__internal__/focus-trap/focus-trap.component.js"),m=require("../menu-divider/menu-divider.component.js"),p=require("../../../__internal__/dom/globals.js"),f=require("../../../hooks/__internal__/useLocale/useLocale.js"),_=require("../../../hooks/__internal__/useModalAria/useModalAria.js"),j=require("../../../hooks/__internal__/useModalManager/useModalManager.js");function x(e){return e&&e.__esModule?e:{default:e}}var h=x(r);const v=({"aria-label":x="Fullscreen menu","data-element":v,"data-role":M,children:q,isOpen:y=!1,onClose:b,startPosition:g="left",topModalOverride:S})=>{var k;const C=r.useRef(null),F=r.useRef(null),O=r.useRef(null),T=_.default(F),{menuType:P}=o.useStrictMenuContext(),R=["dark","black"].includes(P),w=f.default(),A=h.default.Children.toArray(q),E=h.default.Children.toArray(A.map(((r,n)=>n<A.length-1?e.jsxs(e.Fragment,{children:[r,e.jsx(m.default,{"data-role":"divider"})]}):r))),I=r.useCallback((e=>{b&&a.default.isEscKey(e)&&(e.stopImmediatePropagation(),b(e))}),[b]);return j.default({open:y,closeModal:I,modalRef:C,topModalOverride:S,focusCallToActionElement:null===(k=p.getDocument())||void 0===k?void 0:k.activeElement}),e.jsx("li",{children:e.jsx(d.Portal,{children:e.jsx(n.CSSTransition,{nodeRef:C,in:y,timeout:200,unmountOnExit:!0,children:e.jsx(l.StyledMenuFullscreen,{ref:C,startPosition:g,transitionDuration:200,children:e.jsx(c.default,{wrapperRef:F,isOpen:y,children:e.jsxs(l.StyledMenuModal,{"aria-label":x,"aria-modal":!!T||void 0,"data-component":"menu-fullscreen","data-element":v,"data-role":M,menuType:P,ref:F,role:"dialog",tabIndex:-1,children:[e.jsx(l.StyledMenuFullscreenHeader,{menuType:P,children:e.jsx(u.default,{"aria-label":w.menuFullscreen.ariaLabels.closeButton(),onClick:b,"data-element":"close",children:e.jsx(s.default,{type:"close",color:R?"--colorsYang100":void 0})})}),e.jsx(i.Box,{overflowY:"auto",scrollVariant:R?"dark":"light",width:"100%",height:"calc(100% - 40px)",children:e.jsx(t.StyledMenuWrapper,{"data-component":"menu",menuType:P,ref:O,display:"flex",flexDirection:"column",role:"list",inFullscreenView:!0,children:e.jsx(o.StrictMenuProvider,{value:{inFullscreenView:!0,menuType:P,openSubmenuId:null,setOpenSubmenuId:()=>{}},children:E})})})]})})})})})})};exports.MenuFullscreen=v,exports.default=v;