{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"artifact","type":"registry:component","title":"Artifact","description":"AI-powered artifact component.","files":[{"path":"registry/default/ai-elements/artifact.tsx","type":"registry:component","content":"\"use client\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { cn } from \"@/lib/utils\";\nimport { type LucideIcon, XIcon } from \"lucide-react\";\nimport type { ComponentProps, HTMLAttributes } from \"react\";\n\nexport type ArtifactProps = HTMLAttributes<HTMLDivElement>;\n\nexport const Artifact = ({ className, ...props }: ArtifactProps) => (\n  <div\n    className={cn(\n      \"flex flex-col overflow-hidden rounded-lg border bg-background shadow-sm\",\n      className\n    )}\n    {...props}\n  />\n);\n\nexport type ArtifactHeaderProps = HTMLAttributes<HTMLDivElement>;\n\nexport const ArtifactHeader = ({\n  className,\n  ...props\n}: ArtifactHeaderProps) => (\n  <div\n    className={cn(\n      \"flex items-center justify-between border-b bg-muted/50 px-4 py-3\",\n      className\n    )}\n    {...props}\n  />\n);\n\nexport type ArtifactCloseProps = ComponentProps<typeof Button>;\n\nexport const ArtifactClose = ({\n  className,\n  children,\n  size = \"sm\",\n  variant = \"ghost\",\n  ...props\n}: ArtifactCloseProps) => (\n  <Button\n    className={cn(\n      \"size-8 p-0 text-muted-foreground hover:text-foreground\",\n      className\n    )}\n    size={size}\n    type=\"button\"\n    variant={variant}\n    {...props}\n  >\n    {children ?? <XIcon className=\"size-4\" />}\n    <span className=\"sr-only\">Close</span>\n  </Button>\n);\n\nexport type ArtifactTitleProps = HTMLAttributes<HTMLParagraphElement>;\n\nexport const ArtifactTitle = ({ className, ...props }: ArtifactTitleProps) => (\n  <p\n    className={cn(\"font-medium text-foreground text-sm\", className)}\n    {...props}\n  />\n);\n\nexport type ArtifactDescriptionProps = HTMLAttributes<HTMLParagraphElement>;\n\nexport const ArtifactDescription = ({\n  className,\n  ...props\n}: ArtifactDescriptionProps) => (\n  <p className={cn(\"text-muted-foreground text-sm\", className)} {...props} />\n);\n\nexport type ArtifactActionsProps = HTMLAttributes<HTMLDivElement>;\n\nexport const ArtifactActions = ({\n  className,\n  ...props\n}: ArtifactActionsProps) => (\n  <div className={cn(\"flex items-center gap-1\", className)} {...props} />\n);\n\nexport type ArtifactActionProps = ComponentProps<typeof Button> & {\n  tooltip?: string;\n  label?: string;\n  icon?: LucideIcon;\n};\n\nexport const ArtifactAction = ({\n  tooltip,\n  label,\n  icon: Icon,\n  children,\n  className,\n  size = \"sm\",\n  variant = \"ghost\",\n  ...props\n}: ArtifactActionProps) => {\n  const button = (\n    <Button\n      className={cn(\n        \"size-8 p-0 text-muted-foreground hover:text-foreground\",\n        className\n      )}\n      size={size}\n      type=\"button\"\n      variant={variant}\n      {...props}\n    >\n      {Icon ? <Icon className=\"size-4\" /> : children}\n      <span className=\"sr-only\">{label || tooltip}</span>\n    </Button>\n  );\n\n  if (tooltip) {\n    return (\n      <TooltipProvider>\n        <Tooltip>\n          <TooltipTrigger asChild>{button}</TooltipTrigger>\n          <TooltipContent>\n            <p>{tooltip}</p>\n          </TooltipContent>\n        </Tooltip>\n      </TooltipProvider>\n    );\n  }\n\n  return button;\n};\n\nexport type ArtifactContentProps = HTMLAttributes<HTMLDivElement>;\n\nexport const ArtifactContent = ({\n  className,\n  ...props\n}: ArtifactContentProps) => (\n  <div className={cn(\"flex-1 overflow-auto p-4\", className)} {...props} />\n);\n","target":"components/ai-elements/artifact.tsx"}],"dependencies":["lucide-react"],"devDependencies":[],"registryDependencies":["button","tooltip"]}