{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "quick-reply",
  "version": "3.2.0",
  "category": "selection",
  "meta": {
    "preview": "https://ui.manifest.build/previews/quick-reply.png",
    "version": "3.2.0",
    "changelog": {
      "1.0.0": "Initial release with quick reply button options",
      "2.0.0": "BREAKING: Removed unused value prop from QuickReply interface",
      "3.0.0": "BREAKING: Removed id from QuickReply interface. Use array index for key.",
      "3.0.2": "Added comprehensive JSDoc documentation",
      "3.1.0": "Moved to selection category for better organization",
      "3.1.1": "Updated Props interface with decorative header and sub-parameter JSDoc documentation",
      "3.1.2": "Fixed defensive property access to handle empty objects and null values",
      "3.1.3": "Additional defensive property access improvements",
      "3.1.4": "Removed default content data - component only renders explicitly provided data",
      "3.2.0": "Added demo data defaults - component renders demo content when no data prop is provided"
    }
  },
  "changelog": {
    "1.0.0": "Initial release with quick reply button options",
    "2.0.0": "BREAKING: Removed unused value prop from QuickReply interface",
    "3.0.0": "BREAKING: Removed id from QuickReply interface. Use array index for key.",
    "3.0.2": "Added comprehensive JSDoc documentation",
    "3.1.0": "Moved to selection category for better organization",
    "3.1.1": "Updated Props interface with decorative header and sub-parameter JSDoc documentation",
    "3.1.2": "Fixed defensive property access to handle empty objects and null values",
    "3.1.3": "Additional defensive property access improvements",
    "3.1.4": "Removed default content data - component only renders explicitly provided data",
    "3.2.0": "Added demo data defaults - component renders demo content when no data prop is provided"
  },
  "title": "Quick Reply",
  "author": "MNFST, Inc",
  "description": "Quick reply buttons for common chat responses.",
  "dependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/selection/quick-reply.tsx",
      "content": "'use client'\n\nimport { cn } from '@/lib/utils'\nimport { demoQuickReplies } from './demo/selection'\n\n/**\n * Represents a quick reply option.\n * @interface QuickReply\n * @property {string} id - Unique identifier for the reply\n * @property {string} label - Display text for the reply button\n * @property {React.ReactNode} [icon] - Optional icon displayed before the label\n */\nexport interface QuickReply {\n  label?: string\n  icon?: React.ReactNode\n}\n\n/**\n * ═══════════════════════════════════════════════════════════════════════════\n * QuickReplyProps\n * ═══════════════════════════════════════════════════════════════════════════\n *\n * Props for the QuickReply component, which displays predefined response\n * options as pill-shaped buttons for chat interfaces.\n */\nexport interface QuickReplyProps {\n  data?: {\n    /** Array of quick reply options to display as buttons. */\n    replies?: QuickReply[]\n  }\n  actions?: {\n    /** Called when a user selects a quick reply option. */\n    onSelectReply?: (reply: QuickReply) => void\n  }\n}\n\n\n/**\n * A quick reply button set for chat interfaces.\n * Displays predefined response options as pill-shaped buttons.\n *\n * Features:\n * - Pill-shaped action buttons\n * - Optional icons\n * - Hover state visual feedback\n * - Compact responsive design\n *\n * @component\n * @example\n * ```tsx\n * <QuickReply\n *   data={{\n *     replies: [\n *       { id: \"1\", label: \"Yes, confirm\" },\n *       { id: \"2\", label: \"No thanks\" },\n *       { id: \"3\", label: \"I have a question\" }\n *     ]\n *   }}\n *   actions={{\n *     onSelectReply: (reply) => console.log(\"Selected:\", reply.label)\n *   }}\n * />\n * ```\n */\nexport function QuickReply({ data, actions }: QuickReplyProps) {\n  const resolved: NonNullable<QuickReplyProps['data']> = data ?? { replies: demoQuickReplies }\n  const replies = resolved.replies ?? []\n  const onSelectReply = actions?.onSelectReply\n  return (\n    <div className=\"w-full bg-card rounded-lg p-4\">\n      <div className=\"flex flex-wrap gap-2\">\n        {replies.map((reply, index) => (\n          <button\n            key={index}\n            onClick={() => onSelectReply?.(reply)}\n            className={cn(\n              'inline-flex items-center gap-1 sm:gap-1.5 rounded-full border border-border bg-background px-2.5 sm:px-3 py-1 sm:py-1.5 text-xs sm:text-sm text-foreground transition-colors cursor-pointer',\n              'hover:bg-foreground hover:text-background hover:border-foreground'\n            )}\n          >\n            {reply.icon}\n            {reply.label && <span>{reply.label}</span>}\n          </button>\n        ))}\n      </div>\n    </div>\n  )\n}\n",
      "type": "registry:block",
      "target": "components/ui/quick-reply.tsx"
    },
    {
      "path": "registry/selection/demo/selection.ts",
      "content": "// Demo data for Selection category components\n// This file contains sample data used for component previews and documentation\n\nimport type { Option } from '../types'\n\n// Default options for OptionList\nexport const demoOptions: Option[] = [\n  { label: 'Standard shipping', description: '3-5 business days' },\n  { label: 'Express shipping', description: '1-2 business days' },\n  { label: 'Store pickup', description: 'Available in 2h' },\n]\n\n// Quick reply options\nexport const demoQuickReplies = [\n  { label: 'Yes, please' },\n  { label: 'No, thanks' },\n  { label: 'Tell me more' },\n]\n\n// Tag select options\nexport const demoTags: { id: string; label: string; color: 'red' | 'yellow' | 'green' }[] = [\n  { id: '1', label: 'Important', color: 'red' },\n  { id: '2', label: 'In Progress', color: 'yellow' },\n  { id: '3', label: 'Done', color: 'green' },\n]\n",
      "type": "registry:lib",
      "target": "components/ui/demo/selection.ts"
    }
  ],
  "categories": [
    "selection"
  ],
  "type": "registry:block"
}