@sourecode/menu-bar

Classic desktop-style menu bar library for web apps.

Installation

npm install @sourecode/menu-bar

Usage

import{MenuBar}from'@sourecode/menu-bar';import'@sourecode/menu-bar/styles';constmount=document.getElementById('app');if(mount){constmenuBar=newMenuBar(mount,{menus: [{id: 'file',label: 'File',items: [{id: 'new',label: 'New',shortcut: 'Ctrl+N'},{id: 'open',label: 'Open'},{type: 'divider'},{id: 'recent',label: 'Open Recent',items: [{id: 'project-a',label: 'Project A'},],},],},],});menuBar.element.addEventListener('menu-bar:select',(event)=>{constcustom=eventasCustomEvent<{menuId: string;itemId: string}>;console.log(custom.detail.menuId,custom.detail.itemId);});}

API

• new MenuBar(mount, options?)
• setMenus(menus)
• openMenu(menuId)
• close()
• destroy()

Events

• menu-bar:open
• menu-bar:close
• menu-bar:select

Development

npm ci
npm run build
npm test
npm run test:e2e
npm pack --dry-run