123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- import React from "react";
- import classnames from "classnames";
- import {
- BarftEditorPage,
- BaseEditorProps,
- } from "@components/Editor/BraftEditor";
- import {
- ControlsToolBar,
- ToolListItem,
- } from "@components/Editor/CommonTool/ControlsToolBar";
- import { ContentUtils } from "braft-utils";
- import styles from "./index.less";
-
- interface SimpleEditorProps extends BaseEditorProps {
- toolAlign?: "inner" | "bottom" | "both";
- toolList?: Array<ToolListItem>;
- injectControlsToolBar?: any;
- injectBraftEditorProps?: any;
- toolBarContainerStyle?: any;
- appendToolBtn?: any;
- appendInnderBar?: any;
- }
-
- const SimpleEditor = (props: SimpleEditorProps) => {
- const {
- value,
- onChange,
- toolAlign = "inner",
- toolList = [],
- injectControlsToolBar = {},
- toolBarContainerStyle = {},
- injectBraftEditorProps = {},
- appendToolBtn = null,
- appendInnderBar = null,
- } = props;
-
- if (toolAlign === "inner") {
- return (
- <div className={styles.innerWrapper}>
- <BarftEditorPage
- value={value}
- onChange={onChange}
- controls={[]}
- {...injectBraftEditorProps}
- />
- <div className={classnames(styles.floatControls)}>
- <ControlsToolBar
- editorState={value}
- setEditorState={onChange}
- toolList={toolList}
- {...injectControlsToolBar}
- />
- </div>
- </div>
- );
- }
-
- if (toolAlign === "both") {
- return (
- <div>
- <div className={styles.innerWrapper}>
- <BarftEditorPage
- value={value}
- onChange={onChange}
- controls={[]}
- {...injectBraftEditorProps}
- />
- <div className={classnames(styles.floatControls)}>
- {appendInnderBar}
- </div>
- </div>
- <div style={toolBarContainerStyle}>
- <div className={styles.bottomToolBarWrapper}>
- <ControlsToolBar
- editorState={value}
- setEditorState={onChange}
- toolList={toolList}
- {...injectControlsToolBar}
- />
- </div>
- {appendToolBtn}
- </div>
- </div>
- );
- }
-
- return (
- <div>
- <BarftEditorPage
- value={value}
- onChange={onChange}
- controls={[]}
- {...injectBraftEditorProps}
- />
- <div style={toolBarContainerStyle}>
- <div className={styles.bottomToolBarWrapper}>
- <ControlsToolBar
- editorState={value}
- setEditorState={onChange}
- toolList={toolList}
- {...injectControlsToolBar}
- />
- </div>
- {appendToolBtn}
- </div>
- </div>
- );
- };
-
- export default SimpleEditor;
|