sate-lib
Version:
A lightweight and modular React component library designed for modern web interfaces. **SATE Lib** powers the [sate.menu](https://sate.menu) platform with reusable, scalable, and themeable UI components.
2 lines • 1.14 kB
JavaScript
"use client";
import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Portal as t}from"@radix-ui/react-portal";import{Activity as o,useEffect as a}from"react";import{RemoveScroll as i}from"react-remove-scroll";import{ButtonIcon as n}from"../button-icon/button-icon.js";import l from"./drawer.styles.module.js";import{useDrawer as d}from"./useDrawer.js";let m=({open:m,onOpen:s,title:c,className:h,children:p})=>{let{state:u,onClose:f,present:v}=d({onOpenChange:s,open:m});a(()=>{if("undefined"==typeof window)return;let e=window.matchMedia("(width <= 1024px)"),r=e=>{e.matches||f()};return e.addEventListener("change",r),()=>e.removeEventListener("change",r)},[f]);let w=[l.root,l.rootMenu,h].filter(Boolean).join(" ");return e(o,{mode:v?"visible":"hidden",children:r(t,{children:[e("div",{"aria-hidden":!0,className:l.overlay,"data-state":u,onClick:f}),e(i,{forwardProps:!0,children:r("div",{"aria-label":c,"aria-modal":"true",className:w,"data-state":u,role:"dialog",children:[e(n,{className:l.menuClose,icon:"X2",onClick:f,size:"small",variant:"lightOnContent"}),e("div",{className:l.panel,children:p})]})})]})})};export{m as DrawerMenu};