Getting started

Install the package:

npm i kbar-angular

or if you use yarn:

yarn add kbar-angular

Import KbarModule into your app's modules:

import { KbarModule } from 'kbar-angular';

@NgModule({
   imports: [
      KbarModule
   ]
})

Add kbar component to your app's template:

<kbar [actions]="actions">
  <kbar-overlay></kbar-overlay>

  <kbar-positioner>
    <kbar-search></kbar-search>
    <kbar-results></kbar-results>
  </kbar-positioner>
</kbar>

Define actions in your components class:

import { Actions } from 'kbar-angular';

...

export class AppComponent {
  actions: Actions = [
    {
      id: "home",
      name: "Home",
      keywords: ["home"],
      perform: () => {
        document.location.href = "/";
      },
    },
    {
      id: "test",
      name: "Console.log",
      keywords: ["log", "console"],
      perform: () => {
        console.log("Hello world!");
      },
    },
  ];
}