import { Command } from "cmdk";
import React from "react";

function Item({
  children,
  shortcut,
  key,
  disabled,
  onSelect = () => {},
}: {
  children: React.ReactNode;
  shortcut?: string;
  key?: string;
  disabled?: boolean;
  onSelect?: (value: string) => void;
}) {
  return (
    <Command.Item
      disabled={disabled}
      key={`word-${children}`}
      onSelect={onSelect}
    >
      {children}
      {shortcut && (
        <div cmdk-vercel-shortcuts="">
          {shortcut.split(" ").map((key) => {
            return <kbd key={key}>{key}</kbd>;
          })}
        </div>
      )}
    </Command.Item>
  );
}

export default Item;
