{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "prompt-library-demo",
  "type": "registry:component",
  "registryDependencies": [
    "prompt-library"
  ],
  "files": [
    {
      "path": "registry/default/example/prompt-library-demo.tsx",
      "content": "\"use client\"\n\nimport { useState } from \"react\"\n\nimport {\n  PromptLibrary,\n  PromptLibraryContent,\n  PromptLibraryCreateDialog,\n  PromptLibraryCreateTrigger,\n  PromptLibraryEmpty,\n  PromptLibraryFooter,\n  PromptLibraryGroup,\n  PromptLibraryItem,\n  PromptLibraryList,\n  PromptLibrarySearch,\n  PromptLibraryTrigger,\n  type Prompt,\n} from \"../ui/prompt-library\"\n\nconst SAMPLE_PROMPTS: Prompt[] = [\n  {\n    id: \"code-review\",\n    title: \"Code Review\",\n    description: \"Review code for best practices and potential issues\",\n    prompt:\n      \"Please review the following code for:\\n- Best practices and coding standards\\n- Potential bugs or edge cases\\n- Performance optimizations\\n- Security vulnerabilities\\n- Suggestions for improvement\",\n    category: \"Development\",\n  },\n  {\n    id: \"explain-code\",\n    title: \"Explain Code\",\n    description: \"Get a detailed explanation of how code works\",\n    prompt:\n      \"Please explain this code in detail:\\n- What does each part do?\\n- How do the components interact?\\n- What are the key concepts being used?\\n- Are there any important patterns or techniques?\",\n    category: \"Development\",\n  },\n  {\n    id: \"write-tests\",\n    title: \"Write Tests\",\n    description: \"Generate unit tests for the given code\",\n    prompt:\n      \"Please write comprehensive unit tests for this code:\\n- Cover all public methods and functions\\n- Include edge cases and error scenarios\\n- Use descriptive test names\\n- Add comments explaining what each test validates\",\n    category: \"Testing\",\n  },\n  {\n    id: \"refactor\",\n    title: \"Refactor Code\",\n    description: \"Suggest improvements and cleaner implementations\",\n    prompt:\n      \"Please refactor this code to:\\n- Improve readability and maintainability\\n- Follow SOLID principles\\n- Reduce complexity and duplication\\n- Use modern language features where appropriate\",\n    category: \"Development\",\n  },\n  {\n    id: \"document\",\n    title: \"Generate Documentation\",\n    description: \"Create documentation for code or APIs\",\n    prompt:\n      \"Please generate documentation for this code including:\\n- Overview and purpose\\n- Parameters and return values\\n- Usage examples\\n- Any important notes or caveats\",\n    category: \"Documentation\",\n  },\n]\n\nfunction PromptLibraryExample() {\n  const [prompts, setPrompts] = useState<Prompt[]>(SAMPLE_PROMPTS)\n  const [lastSelected, setLastSelected] = useState<Prompt | null>(null)\n\n  return (\n    <div className=\"flex w-full max-w-md flex-col gap-4\">\n      <div className=\"bg-card rounded-lg border p-4\">\n        <p className=\"text-muted-foreground mb-3 text-sm\">\n          Browse and insert prompt templates. Click a prompt to copy it to\n          clipboard, or pass onInsert to put it straight into your input.\n        </p>\n        <PromptLibrary\n          onPromptsChange={setPrompts}\n          onSelect={setLastSelected}\n          prompts={prompts}\n        >\n          <PromptLibraryTrigger />\n          <PromptLibraryContent>\n            <PromptLibrarySearch />\n            <PromptLibraryList>\n              <PromptLibraryEmpty />\n              <PromptLibraryGroup heading=\"Development\">\n                {prompts\n                  .filter((p) => p.category === \"Development\")\n                  .map((prompt) => (\n                    <PromptLibraryItem key={prompt.id} prompt={prompt} />\n                  ))}\n              </PromptLibraryGroup>\n              <PromptLibraryGroup heading=\"Testing\">\n                {prompts\n                  .filter((p) => p.category === \"Testing\")\n                  .map((prompt) => (\n                    <PromptLibraryItem key={prompt.id} prompt={prompt} />\n                  ))}\n              </PromptLibraryGroup>\n              <PromptLibraryGroup heading=\"Documentation\">\n                {prompts\n                  .filter((p) => p.category === \"Documentation\")\n                  .map((prompt) => (\n                    <PromptLibraryItem key={prompt.id} prompt={prompt} />\n                  ))}\n              </PromptLibraryGroup>\n              <PromptLibraryGroup heading=\"Custom\">\n                {prompts\n                  .filter((p) => p.isCustom)\n                  .map((prompt) => (\n                    <PromptLibraryItem key={prompt.id} prompt={prompt} />\n                  ))}\n              </PromptLibraryGroup>\n            </PromptLibraryList>\n            <PromptLibraryFooter>\n              <PromptLibraryCreateTrigger />\n            </PromptLibraryFooter>\n          </PromptLibraryContent>\n          <PromptLibraryCreateDialog />\n        </PromptLibrary>\n      </div>\n      {lastSelected && (\n        <div className=\"bg-muted/50 rounded-lg border p-3\">\n          <p className=\"mb-2 text-xs font-medium\">Last copied:</p>\n          <p className=\"text-sm font-medium\">{lastSelected.title}</p>\n          <p className=\"text-muted-foreground mt-1 line-clamp-2 text-xs\">\n            {lastSelected.prompt}\n          </p>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default PromptLibraryExample\n",
      "type": "registry:component"
    }
  ]
}