Code Editor

"use client"

import * as React from "react"

Installation

pnpmnpmyarnbun
pnpm dlx openteam-ui@latest add code-editor
Copy

Usage

Copyimport { CodeEditor } from "@/components/ui/code-editor"

Copy<CodeEditor
  lang="typescript"
  value={value}
  onChange={setValue}
  minHeight={320}
/>

Notes

• This is a controlled component. Keep the current source in React state and pass it back through value.
• Supported languages are html, css, javascript, typescript, json, and markdown.
• Use height for a fixed editor height or minHeight for an auto-growing editor area.