Luna Command Palette

Command palette.

Demo

https://luna.liriliri.io/?path=/story/command-palette

Install

Add the following script and style to your page.

``html


`

You can also get it on npm.

`bash
npm install luna-command-palette --save
`

`javascript
import 'luna-command-palette/luna-command-palette.css'
import LunaCommandPalette from 'luna-command-palette'
`

Usage

`javascript
const container = document.getElementById('container')
const commandPalette = new LunaCommandPalette(container, {
placeholder: 'Type a command',
shortcut: 'Ctrl+P',
commands: [
{
title: 'Reload Page',
shortcut: 'Ctrl+R',
handler(e) {
if (e && e.preventDefault) {
e.preventDefault()
}
location.reload()
}
}
]
})
commandPalette.show()
``

Configuration

* commands(ICommand[]): Commands to show.
* placeholder(string): Search input placeholder.
* shortcut(string): Keyboard shortcut for opening the command palette.

Api

$3

Hide command palette.

$3

Show command palette.

Types

$3

* title(string): Command title.