Prompt Suggestions

import { PromptSuggestions } from "@/components/ui/prompt-suggestions";

export default function Example() {
  return <PromptSuggestions />;
}

import { forwardRef } from "react";
import { cn } from "@/lib/utils";

const PromptSuggestions = forwardRef(({ className, suggestions = [], onSelect, ...props }, ref) => (
  <div ref={ref} className={cn("flex flex-wrap gap-2", className)} {...props}>
    {suggestions.map((s, i) => (
      <button key={i} onClick={() => onSelect?.(typeof s === "string" ? s : s.text)}
        className="inline-flex items-center gap-1.5 rounded-full border px-3 py-1.5 text-sm transition-colors hover:bg-accent"
      >
        {typeof s === "string" ? s : <><span>{s.icon}</span><span>{s.text}</span></>}
      </button>
    ))}
  </div>
));
PromptSuggestions.displayName = "PromptSuggestions";

export { PromptSuggestions };