mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
- Fix gray/zinc alias confusion (gray→neutral, zinc→zen) - Consolidate duplicate gray color definition - Add finance components to ui/ directory - Clean up documentation structure - Remove test artifacts and backup files The color aliases were incorrectly mapped: Before: gray→zen, zinc→neutral (wrong) After: gray→neutral, zinc→zen (correct) This ensures Hanzo's branded 'zen' color properly maps to zinc while gray correctly references the standard neutral palette. Verified: - Production build: 544 pages ✓ - All tests passing: 219/219 ✓ - Visual verification: /colors page working ✓ - Code review: Approved ✓ Ready for deployment to ui.hanzo.ai
48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
|
|
import { Button } from "@/registry/default/ui/button"
|
|
import { CodeEditor } from "@/registry/default/ui/code-editor"
|
|
|
|
export default function CodeEditorControlledDemo() {
|
|
const [code, setCode] = React.useState(`// Type some code here
|
|
function greet(name) {
|
|
return \`Hello, \${name}!\`
|
|
}`)
|
|
|
|
const handleReset = () => {
|
|
setCode(`// Code has been reset
|
|
function greet(name) {
|
|
return \`Hello, \${name}!\`
|
|
}`)
|
|
}
|
|
|
|
const handleClear = () => {
|
|
setCode("")
|
|
}
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<CodeEditor
|
|
value={code}
|
|
onChange={(value) => setCode(value || "")}
|
|
language="javascript"
|
|
height="250px"
|
|
/>
|
|
<div className="flex gap-2">
|
|
<Button onClick={handleReset} variant="outline" size="sm">
|
|
Reset Code
|
|
</Button>
|
|
<Button onClick={handleClear} variant="outline" size="sm">
|
|
Clear
|
|
</Button>
|
|
<div className="flex-1" />
|
|
<span className="text-sm text-muted-foreground">
|
|
Characters: {code.length}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|