https://github.com/socheatsok78/vuetify-kbar

[Incubation] A simple plug-n-play cmd+k interface for Vuetify
https://github.com/socheatsok78/vuetify-kbar

cmdk kbar vuetify

Last synced: 13 days ago
JSON representation

[Incubation] A simple plug-n-play cmd+k interface for Vuetify

• Host: GitHub
• URL: https://github.com/socheatsok78/vuetify-kbar
• Owner: socheatsok78
• License: mit
• Created: 2021-10-31T09:36:24.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2022-02-06T14:21:18.000Z (almost 3 years ago)
• Last Synced: 2024-12-15T19:06:46.106Z (18 days ago)
• Topics: cmdk, kbar, vuetify
• Language: Vue
• Homepage: https://npmjs.com/@socheatsok78/vuetify-kbar
• Size: 2.71 MB
• Stars: 12
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vuetify `kBar`

A simple plug-n-play cmd+k interface for [Vuetify](http://vuetifyjs.com/).

[Live demo](https://socheat.dev/vuetify-kbar/)

> :warning::warning: This project is currently is in work-in-progress stage.

![Screen Shot 2021-10-31 at 8 27 36 PM](https://user-images.githubusercontent.com/4363857/139585888-5a2c6e9d-a57d-49fb-8421-b730ad1157ef.png)

## Guide

**Install**

> Note: You'll need to bring your own `vuetify`.  

> You can install `vuetify` via `npm install vuetify` or `yarn add vuetify`.

```sh

$ npm install @socheatsok78/vuetify-kbar@next

# or

$ yarn add @socheatsok78/vuetify-kbar@next

```

**Usage**

```vue

  

    

  

import { mdiClipboard } from '@mdi/js'

const actions = [

  {

    id: 'blog',

    name: 'Blog',

    description: '',

    shortcut: ['b'],

    keywords: 'writing words',

    perform: () => (window.location.pathname = 'blog')

  },

  {

    id: 'contact',

    name: 'Contact',

    shortcut: ['c'],

    keywords: 'email',

    perform: () => (window.location.pathname = 'contact')

  }

]

export default {

  name: 'App',

  components: {

    VKbar

  },

  data: () => ({

    actions: actions

  })

}

```

## Development

This project was created using `@vue/cli` service.

### Project setup

```

yarn install

```

### Compiles and hot-reloads for development

```

yarn serve

```

### Compiles and minifies for production

```

yarn build

```

### Run your unit tests

```

yarn test:unit

```

### Lints and fixes files

```

yarn lint

```

### Customize configuration

See [Configuration Reference](https://cli.vuejs.org/config/).