@hbtv/code-editor

安装方法

yarn add @hbtv/code-editor

ChangeLog

1.0.2

- 添加 php 支持

使用方法

import React, { useEffect, useState } from 'react';
import CodeEditor from '../CodeEditor';

const Page = () => {
  const [value,setValue] = useState(''); 

  return (
    <CodeEditor
      mode="typescript"
      value={value}  
      onChange={setValue}
    />
  );
}

API

// 支持的语言种类
export type ModeType =
  | 'typescript'
  | 'json'
  | 'javascript'
  | 'java'
  | 'html'
  | 'python'
  | 'css'
  | 'lua'
  | 'xml'
  | 'markdown'
  | 'mysql'
  | 'php';

// 支持的主题
export type ThemeType = 'dark' | 'light';

// 支持的属性
export interface CodeEditorProps {
  name?: string; // 名字 默认为: codeEditor
  value?: string;
  placeholder?: string;
  onChange?: (value: string) => void;
  mode?: ModeType; // 语言类型
  theme?: ThemeType; // 主题 'dark' | 'light'
  width?: string | number; // 宽度
  minHeight?: string | number; // 高度
}