{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-primitives-animate-code-block",
  "title": "Animate Code Block Demo",
  "description": "Demo showing an animated code block.",
  "registryDependencies": [
    "@odysseyui/primitives-animate-code-block"
  ],
  "files": [
    {
      "path": "registry/demo/primitives/animate/code-block/index.tsx",
      "content": "'use client';\n\nimport { CodeBlock } from '@/components/odyssey/primitives/animate/code-block';\nimport { cn } from '@/lib/utils';\nimport { useTheme } from 'next-themes';\n\ninterface CodeBlockDemoProps {\n  duration: number;\n  delay: number;\n  writing: boolean;\n  cursor: boolean;\n}\n\nexport const CodeBlockDemo = ({\n  duration,\n  delay,\n  writing,\n  cursor,\n}: CodeBlockDemoProps) => {\n  const { resolvedTheme } = useTheme();\n\n  return (\n    <div\n      key={`${duration}-${delay}-${writing}-${cursor}`}\n      className=\"relative bg-accent w-[420px] h-[372px] text-sm p-4 overflow-auto\"\n    >\n      <CodeBlock\n        code={`'use client';\n \nimport * as React from 'react';\n \ntype MyComponentProps = {\n  myProps: string;\n} & React.ComponentProps<'div'>;\n \nfunction MyComponent(props: MyComponentProps) {\n  return (\n    <div {...props}>\n      <p>My Component</p>\n    </div>\n  );\n}\n\nexport { MyComponent, type MyComponentProps };`}\n        lang=\"tsx\"\n        theme={resolvedTheme === 'dark' ? 'dark' : 'light'}\n        writing={writing}\n        duration={duration}\n        delay={delay}\n        className={cn(\n          '[&>pre,_&_code]:!bg-transparent [&>pre,_&_code]:[background:transparent_!important] [&>pre,_&_code]:border-none [&_code]:!text-[13px] [&_code_.line]:!px-0',\n          cursor &&\n            \"data-[done=false]:[&_.line:last-of-type::after]:content-['|'] data-[done=false]:[&_.line:last-of-type::after]:inline-block data-[done=false]:[&_.line:last-of-type::after]:w-[1ch] data-[done=false]:[&_.line:last-of-type::after]:-translate-px\",\n        )}\n      />\n    </div>\n  );\n};\n",
      "type": "registry:ui",
      "target": "components/odysseyui/demo/primitives/animate/code-block.tsx"
    }
  ],
  "meta": {
    "demoProps": {
      "CodeBlock": {
        "delay": {
          "value": 0,
          "min": 0,
          "max": 3000,
          "step": 100
        },
        "duration": {
          "value": 10000,
          "min": 0,
          "max": 30000,
          "step": 1000
        },
        "writing": {
          "value": true
        },
        "cursor": {
          "value": true
        }
      }
    }
  },
  "type": "registry:ui"
}