ak-dropdown-menu

Dropdown menu

This is a Dropdown menu component which creates a menu with groups and items within groups.

Try it out

See more detailed documentation and code examples in the live demo of the component.

Installation

npm install ak-dropdown-menu --save

Using the component

See examples of usage and detailed documentation in the live demo of the component.

DropdownMenu

Kind: global class

• Properties

  • DropdownMenu.appearance
  • DropdownMenu.position
  • DropdownMenu.triggerType
  • DropdownMenu.isTriggerNotTabbable
  • DropdownMenu.items
  • DropdownMenu.defaultOpen
  • DropdownMenu.onItemActivated
  • DropdownMenu.onOpenChange

new DropdownMenu()

This is a basic building block of a dropdown's list.

DropdownMenu.appearance

Controls the appearance of the dropdown. Available types: 'default', 'tall'. Default dropdown has scroll after its height exceeds the pre-defined amount. Tall dropdown has no restrictions.

Kind: static property of DropdownMenu
Default: default

DropdownMenu.position

Position of the menu. See the documentation of ak-layer for more details.

Kind: static property of DropdownMenu
Default: bottom left

DropdownMenu.triggerType

Types of the menu's built-in trigger. Available types: 'default', 'button'.

Kind: static property of DropdownMenu
Default: default

DropdownMenu.isTriggerNotTabbable

Controls whether trigger is tabbable. Set this to true when you use interactive elements inside trigger (links, buttons, inputs)

Kind: static property of DropdownMenu
Default: false

DropdownMenu.items

List of menu items. Should be an array of groups (see the documentation for ak-droplist-group for available props). Every group should contain array of items (see the documentation for ak-droplist-item for available props).

Kind: static property of DropdownMenu
JS Example

[
   {
       heading: 'Title of a group',
       items: [
         { content: 'First item in the group' },
         { content: 'Second item in the group' }
       ]
   }
]

DropdownMenu.defaultOpen

Whether the dropdown should be open by default

Kind: static property of DropdownMenu
Default: []

DropdownMenu.onItemActivated

Handler function to be called when the item is activated.

Kind: static property of DropdownMenu

DropdownMenu.onOpenChange

Handler function to be called when the menu is opened/closed.

Kind: static property of DropdownMenu

Support and feedback

We're here to help!

Let us know what you think of our components and docs, your feedback is really important for us.

Community support

Ask a question in our forum.

Check if someone has already asked the same question before.

Create a support ticket

Are you in trouble? Let us know!