@inax/buttonmenuui

module for a button menu

Stats

StarsIssuesVersionUpdatedCreatedSize
@inax/buttonmenuui
0.2.262 months ago5 years agoMinified + gzip package size for @inax/buttonmenuui in KB

Readme

@inax/buttonmenuui

module for a generic menu system

Install

You can install this package with npm.

npm

npm install @inax/buttonmenuui

Documentation

To implement a buttonmenu into your application, you need to:

  • import MenuModule and ButtonMenuModule into your Module
  • add <button-menu></button-menu> to your HTML-code
  • provide the desired menu structure (described in the following section)

Creating the menu

  1. create a file menu.ts in your app-directory (e.g. /app/resources)
  2. provide a token for the menu, you can just copy the following into your file from step 1: ```ts import { IMenuItem, BUTTONMENU_TOKEN, DefaultMenuItem } from '@inax/menu';

export function createMenu(): Array { return [ new DefaultMenuItem(0, 'Main', '', [ new DefaultMenuItem(0, 'Text-on-the-button', '/path-to-page'), new DefaultMenuItem(1, 'Text-on-next-button', '/path'), new DefaultMenuItem(2, 'you can also add layers', '', [ new DefaultMenuItem(0, 'nested item') // the ID-number as the first parameter should be unique inside an array // --> ID's inside of []-brackets cannot interfere with numbers outside of // The brackets (and the ones outside don't affect the ones inside) ]) ]), new DefaultMenuItem(1, 'TopLevelItem', '', [ // add more items here to access them via the "TopLevelItem" button ]), new DefaultMenuItem(2), // empty items to fill the line new DefaultMenuItem(3), new DefaultMenuItem(4), new DefaultMenuItem(5), new DefaultMenuItem(6), new DefaultMenuItem(7) ]; }

export const APP_MENU: any = { provide: BUTTONMENU_TOKEN, useFactory: createMenu };

3. customice the returned value of the `createMenu()`-function to suit your application


# License

Copyright (c) insite-gmbh. All rights reserved.

See License in the project root for license information.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.