feat(CodeEditor): enable readOnly for CodeEditor (v2) (#10517)

* feat(CodeEditor): enable readOnly for CodeEditor (v2)

* docs: update prop comments
This commit is contained in:
one 2025-10-05 18:32:31 +08:00 committed by GitHub
parent a6e58776d2
commit de5fb03efb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 1 deletions

View File

@ -31,6 +31,7 @@ const CodeEditor = ({
style,
className,
editable = true,
readOnly = false,
expanded = true,
wrapped = true
}: CodeEditorProps) => {
@ -111,6 +112,7 @@ const CodeEditor = ({
maxHeight={expanded ? undefined : maxHeight}
minHeight={minHeight}
editable={editable}
readOnly={readOnly}
theme={theme}
extensions={customExtensions}
onCreateEditor={(view: EditorView) => {

View File

@ -91,10 +91,15 @@ export interface CodeEditorProps {
/** CSS class name appended to the default `code-editor` class. */
className?: string
/**
* Whether the editor is editable.
* Whether the editor view is editable.
* @default true
*/
editable?: boolean
/**
* Set the editor state to read only but keep some user interactions, e.g., keymaps.
* @default false
*/
readOnly?: boolean
/**
* Whether the editor is expanded.
* If true, the height and maxHeight props are ignored.

View File

@ -66,6 +66,7 @@ const meta: Meta<typeof CodeEditor> = {
},
fontSize: { control: { type: 'range', min: 12, max: 22, step: 1 } },
editable: { control: 'boolean' },
readOnly: { control: 'boolean' },
expanded: { control: 'boolean' },
wrapped: { control: 'boolean' },
height: { control: 'text' },
@ -89,6 +90,7 @@ export const Default: Story = {
value: `function greet(name: string) {\n return 'Hello ' + name\n}`,
fontSize: 16,
editable: true,
readOnly: false,
expanded: true,
wrapped: true
},
@ -101,6 +103,7 @@ export const Default: Story = {
theme={getCmThemeByName((args as any).theme || 'light')}
fontSize={args.fontSize as number}
editable={args.editable as boolean}
readOnly={args.readOnly as boolean}
expanded={args.expanded as boolean}
wrapped={args.wrapped as boolean}
height={args.height as string | undefined}