Quick command

1"use client";2 3import { useEffect, useId, useMemo, useRef, useState } from "react";4import { ArrowRight, Command, Search, X } from "lucide-react";5 6export type QuickCommandItem = {7  id: string;8  label: string;9  group: string;10  description?: string;11  keywords?: string[];12  shortcut?: string;13};14export type QuickCommandProps = {15  items: QuickCommandItem[];16  label?: string;17  shortcut?: boolean;18  onSelect: (item: QuickCommandItem) => void;19};20 21/** Searchable action dialog with a keyboard shortcut and roving result selection. */22export function QuickCommand({23  items,24  label = "Open commands",25  shortcut = false,26  onSelect,27}: QuickCommandProps) {28  const dialogRef = useRef<HTMLDialogElement>(null);