v-command-palette
TypeScript icon, indicating that this package has built-in type declarations

0.0.17 • Public • Published

v-command-palette

A command palette for Vuetify.

https://github.com/wobsoriano/v-command-palette/assets/13049130/f99bccff-acde-422c-a30b-1a53bac0ffa0

Installation

npm install v-command-palette

Usage

Import the component at the root of your app

<script setup>
import { VCommandPalette, createCommand } from 'v-command-palette'

const commands = [
  createCommand({
    title: 'Home',
    icon: 'mdi-home',
    command() { /** do something */ },
    section: 'Navigation',
    shortcut: ['h'],
  }),
  createCommand({
    title: 'Docs',
    icon: 'mdi-book',
    command() { /** do something */ },
    section: 'Navigation',
    shortcut: ['g', 'd'],
  }),
]
</script>

<template>
  <VApp>
    <VMain>
      <VCommandPalette :commands="commands" />
    </VMain>
  </VApp>
</template>

Props

Name Type Default Description
commands array [] The list of commands to display. See the Command interface.
textFieldProps object {} VTextField props
dialogProps object {} VDIalog props
cardProps object {} VCard props
cardTextProps object {} VCardText props
fuseOptions object {} Fuse.js options

Composables

  • useCommandPalette - Programmaticaly open or close the dialog.

License

MIT

Package Sidebar

Install

npm i v-command-palette

Weekly Downloads

4

Version

0.0.17

License

MIT

Unpacked Size

45.5 kB

Total Files

10

Last publish

Collaborators

  • wobsoriano