'use client';
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useEditorMode as r,composeTypographyClassName as l,getGlobalColorStateStyle as i,getGlobalColorResponsiveStyle as a,cls as n}from"@gem-sdk/core";import{useState as o,useRef as p}from"react";import{Transition as s}from"react-transition-group";import{useBodyOverlay as c}from"../../../hooks/useBodyOverlay.js";import g from"../../icons/Dismiss.js";import m from"../../icons/MenuIcon.js";import d from"./MenuMobileItem.js";let u={transitionDuration:"300ms",opacity:0},f={entering:{opacity:1,transform:"translateX(0)"},entered:{opacity:1,transform:"translateX(0)"},exiting:{opacity:0,transform:"translateX(-50px)"},exited:{opacity:0,transform:"translateX(-50px)"},unmounted:{opacity:0}},b={entering:{opacity:1},entered:{opacity:1},exiting:{opacity:0},exited:{opacity:0},unmounted:{opacity:0}},y=({menu:y,typography:h,typo:x,arrow:v,menuTextColor:w,menuBg:N,textColor:j,className:k,itemEnableHoverEffect:M})=>{let O=r(),[z,C]=o(!1),X=p(null),D=p(null),E=y?.ROOT;c(z);let B=e=>{"edit"!==O&&C(e)},I=l(x,h);return e("div",{ref:D,className:n("gp-relative gp-z-5 gp-h-full gp-items-center gp-justify-center",k),children:[t("button",{"aria-label":"Menu",onClick:()=>{B(!0)},style:{...i("c",j)},children:t(m,{className:"gp-w-8"})}),t(s,{in:z,timeout:300,nodeRef:X,unmountOnExit:!1,children:r=>e("div",{className:"gp-fixed gp-inset-0 gp-z-[999] gp-overflow-hidden",style:{pointerEvents:z?"auto":"none",visibility:z?"visible":"hidden"},children:[t("div",{"aria-hidden":!0,"aria-label":"Overlay",onClick:()=>{B(!1)},className:"gp-fixed gp-inset-0 gp-z-[999] gp-bg-slate-600/40",style:{...u,...b[r]}}),e("div",{className:"gp-relative gp-inset-0 gp-z-[9999] gp-h-full gp-w-full gp-max-w-[400px] gp-overflow-hidden",style:{...u,...f[r],...a("bgc",N)},children:[t("div",{className:"gp-flex gp-h-10 gp-items-center gp-border-b gp-pl-4",children:t("button",{onClick:()=>B(!1),className:"gp-ml-auto gp-flex gp-aspect-square gp-h-full gp-items-center gp-justify-center",style:{...i("c",w)},children:t(g,{className:"gp-w-5"})})}),t("ul",{role:"menu",className:n("gp-w-full scrollbar:!gp-h-1.5 scrollbar:!gp-w-1.5 scrollbar:gp-bg-transparent scrollbar-track:!gp-rounded scrollbar-track:!gp-bg-slate-100 scrollbar-thumb:!gp-rounded scrollbar-thumb:!gp-bg-slate-300",I),ref:X,style:{...a("bgc",N)},children:E?.childrens?.map(e=>t(d,{id:e,menu:y,arrow:v,depth:0,maxDepth:2,menuBg:N,menuTextColor:w,closeMenu:()=>B(!1),typo:x,typography:h,enableHoverEffect:M},e))})]})]})})]})};export{y as default};
