Applications Manager

A command palette style application launcher inspired by macOS Spotlight and Windows search. Triggered by keyboard shortcut, it provides quick access to applications organized by category.

Features

Keyboard Shortcut - Open with Ctrl+K (Windows/Linux) or ⌘+K (Mac)
Category Groups - Applications organized by category (Browsers, Social Media, etc.)
Search - Filter applications by name
External Links - Opens applications in new tabs

Examples

Applications Manager Basics

@chatcn/applications-manager

Installation

pnpm dlx shadcn@latest add https://chatcn.me/c/system/applications-manager

Usage

Basic Usage

Simply render the component anywhere in your app. It will listen for the keyboard shortcut globally:

import { ApplicationManager } from "@/components/chatcn/system/applications-manager"
 
export default function App() {
  return (
    <div>
      <main>Your app content</main>
      <ApplicationManager />
    </div>
  )
}

In a Layout

Add to your root layout to make it available throughout your application:

// app/layout.tsx
import { ApplicationManager } from "@/components/chatcn/system/applications-manager"
 
export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <ApplicationManager />
      </body>
    </html>
  )
}

How It Works

Press Ctrl+K or ⌘+K to open the command palette
Type to search for applications
Use arrow keys or mouse to navigate
Press Enter or click to open the selected application
Press Escape or click outside to close

Customization

To customize the available applications, modify the applications object in the component source file. Applications are organized by category:

const applications: Record<string, Application[]> = {
  "Category Name": [
    {
      name: "App Name",
      icon: "https://path-to-icon.svg",
      url: "https://app-url.com",
    },
  ],
}

Props

This component doesn't accept any props. It uses internal state management and automatically handles:

Keyboard shortcut detection
Dialog open/close state
Application selection and navigation

Search Documentation