18 lines
1.4 KiB
JSON
18 lines
1.4 KiB
JSON
{
|
|
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
|
"name": "code-editor-demo",
|
|
"type": "registry:ui",
|
|
"title": "Code Editor Demo",
|
|
"description": "Demo showing an animated code editor.",
|
|
"registryDependencies": [
|
|
"https://animate-ui.com/r/code-editor"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "registry/demo/components/code-editor/index.tsx",
|
|
"content": "import ReactIcon from '@/components/icons/react-icon';\nimport { CodeEditor } from '@/components/animate-ui/components/code-editor';\n\nexport const CodeEditorDemo = () => {\n return (\n <CodeEditor\n cursor\n className=\"w-[640px] h-[480px]\"\n lang=\"tsx\"\n title=\"component.tsx\"\n icon={<ReactIcon />}\n duration={15}\n delay={0.5}\n copyButton\n >\n {`'use client';\n\nimport * as React from 'react';\n\ntype MyComponentProps = {\n myProps: string;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst MyComponent = React.forwardRef<HTMLDivElement, MyComponentProps>(\n ({ myProps, ...props }, ref) => {\n return (\n <div ref={ref} {...props}>\n <p>My Component</p>\n </div>\n );\n },\n);\nMyComponent.displayName = 'MyComponent';\n\nexport { MyComponent, type MyComponentProps };`}\n </CodeEditor>\n );\n};\n",
|
|
"type": "registry:ui",
|
|
"target": "components/animate-ui/demo/components/code-editor.tsx"
|
|
}
|
|
]
|
|
} |