UNPKG

@nexusui/components

Version:

These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.

3 lines (2 loc) 1.25 kB
"use client"; "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material/IconButton"),a=require("@mui/material/Menu"),i=require("@mui/material/MenuItem"),u=require("@mui/icons-material/MoreVert"),n=require("lodash/uniqueId");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(r),s=l(a),d=l(i),c=l(u),m=l(n);const p="NexusHexMenu";exports.HexMenu=({items:r})=>{const[a]=t.useState((()=>m.default(`${p}-`))),[i,u]=t.useState(null),n=Boolean(i),l=()=>{u(null)};return e.jsxs("div",{children:[e.jsx(o.default,{"aria-label":"more",id:a,"data-testid":"menu-icon","aria-controls":"menu","aria-expanded":n?"true":void 0,"aria-haspopup":"true",onClick:e=>{const t=e.currentTarget;u(t)},children:e.jsx(c.default,{})}),e.jsx(s.default,{MenuListProps:{"aria-labelledby":a},className:`${p}-menu`,"data-testid":`${p}-menu`,anchorEl:i,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},open:n,onClose:l,slotProps:{paper:{style:{width:"auto"}}},children:r.map((t=>e.jsx(d.default,{className:`${p}-menuItem`,"data-testid":`${p}-menuItem`,onClick:()=>{t.onClick(),l()},children:t.title},t.title)))})]})};