@uiw/react-md-editor 3.12.2 → 3.14.0

package/dist/mdeditor.min.js.LICENSE.txt

@@ -1,9 +1,3 @@
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/
-
 /*!
  * @uiw/copy-to-clipboard v1.0.12
  * Copy to clipboard.
@@ -32,15 +26,7 @@ object-assign
  */
 
 /**
- * Prism: Lightweight, robust, elegant syntax highlighting
- *
- * @license MIT <https://opensource.org/licenses/MIT>
- * @author Lea Verou <https://lea.verou.me>
- * @namespace
- * @public
- */
-
-/** @license React v17.0.2
+ * @license React
  * react-jsx-runtime.production.min.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.

package/esm/Editor.d.ts

@@ -39,7 +39,7 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
     /**
      * Show drag and drop tool. Set the height of the editor.
      */
-    visiableDragbar?: boolean;
+    visibleDragbar?: boolean;
     /**
      * Show markdown preview.
      */
@@ -53,11 +53,11 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
      */
     overflow?: boolean;
     /**
-     * Maximum drag height. `visiableDragbar=true`
+     * Maximum drag height. `visibleDragbar=true`
      */
     maxHeight?: number;
     /**
-     * Minimum drag height. `visiableDragbar=true`
+     * Minimum drag height. `visibleDragbar=true`
      */
     minHeight?: number;
     /**
@@ -103,6 +103,8 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
     hideToolbar?: boolean;
     /** Whether to enable scrolling */
     enableScroll?: boolean;
+    /** Toolbar on bottom */
+    toolbarBottom?: boolean;
 }
 declare const mdEditor: React.ForwardRefExoticComponent<MDEditorProps & React.RefAttributes<ContextStore>>;
 declare type MDEditor = typeof mdEditor & {

package/esm/Editor.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["prefixCls", "className", "value", "commands", "commandsFilter", "extraCommands", "height", "toolbarHeight", "enableScroll", "visiableDragbar", "highlightEnable", "preview", "fullscreen", "overflow", "previewOptions", "textareaProps", "maxHeight", "minHeight", "autoFocus", "tabSize", "defaultTabEnable", "onChange", "onHeightChange", "hideToolbar", "renderTextarea"];
+var _excluded = ["prefixCls", "className", "value", "commands", "commandsFilter", "extraCommands", "height", "toolbarHeight", "enableScroll", "visibleDragbar", "highlightEnable", "preview", "fullscreen", "overflow", "previewOptions", "textareaProps", "maxHeight", "minHeight", "autoFocus", "tabSize", "defaultTabEnable", "onChange", "onHeightChange", "hideToolbar", "toolbarBottom", "renderTextarea"];
 import React, { useEffect, useReducer, useMemo, useRef, useImperativeHandle } from 'react';
 import MarkdownPreview from '@uiw/react-markdown-preview';
 import TextArea from './components/TextArea';
@@ -35,7 +35,7 @@ var InternalMDEditor = (props, ref) => {
     height = 200,
     toolbarHeight = 29,
     enableScroll = true,
-    visiableDragbar = true,
+    visibleDragbar = true,
     highlightEnable = true,
     preview: previewType = 'live',
     fullscreen = false,
@@ -50,6 +50,7 @@ var InternalMDEditor = (props, ref) => {
     onChange: _onChange,
     onHeightChange,
     hideToolbar,
+    toolbarBottom = false,
     renderTextarea
   } = _ref,
       other = _objectWithoutPropertiesLoose(_ref, _excluded);
@@ -192,10 +193,11 @@ var InternalMDEditor = (props, ref) => {
       style: _extends({}, other.style, {
         height: state.fullscreen ? '100%' : hideToolbar ? Number(state.height) - toolbarHeight : state.height
       }),
-      children: [!hideToolbar && /*#__PURE__*/_jsx(Toolbar, {
+      children: [!hideToolbar && !toolbarBottom && /*#__PURE__*/_jsx(Toolbar, {
         prefixCls: prefixCls,
         height: toolbarHeight,
-        overflow: overflow
+        overflow: overflow,
+        toolbarBottom: toolbarBottom
       }), /*#__PURE__*/_jsxs("div", {
         className: prefixCls + "-content",
         style: {
@@ -216,7 +218,7 @@ var InternalMDEditor = (props, ref) => {
           renderTextarea: renderTextarea,
           onScroll: e => handleScroll(e, 'text')
         })), /(live|preview)/.test(state.preview || '') && mdPreview]
-      }), visiableDragbar && !state.fullscreen && /*#__PURE__*/_jsx(DragBar, {
+      }), visibleDragbar && !state.fullscreen && /*#__PURE__*/_jsx(DragBar, {
         prefixCls: prefixCls,
         height: state.height,
         maxHeight: maxHeight,
@@ -226,6 +228,11 @@ var InternalMDEditor = (props, ref) => {
             height: newHeight
           });
         }
+      }), !hideToolbar && toolbarBottom && /*#__PURE__*/_jsx(Toolbar, {
+        prefixCls: prefixCls,
+        height: toolbarHeight,
+        overflow: overflow,
+        toolbarBottom: toolbarBottom
       })]
     }))
   });

package/esm/Editor.js.map

@@ -34,7 +34,7 @@
     "height",
     "toolbarHeight",
     "enableScroll",
-    "visiableDragbar",
+    "visibleDragbar",
     "highlightEnable",
     "preview",
     "previewType",
@@ -50,6 +50,7 @@
     "onChange",
     "onHeightChange",
     "hideToolbar",
+    "toolbarBottom",
     "renderTextarea",
     "other",
     "cmds",
@@ -102,7 +103,7 @@
     "../src/Editor.tsx"
   ],
   "sourcesContent": [
-    "import React, { useEffect, useReducer, useMemo, useRef, useImperativeHandle } from 'react';\nimport MarkdownPreview, { MarkdownPreviewProps, MarkdownPreviewRef } from '@uiw/react-markdown-preview';\nimport TextArea, { ITextAreaProps } from './components/TextArea';\nimport Toolbar from './components/Toolbar';\nimport DragBar from './components/DragBar';\nimport { getCommands, getExtraCommands, ICommand } from './commands';\nimport { reducer, EditorContext, ContextStore, PreviewType } from './Context';\nimport './index.less';\n\nexport interface IProps {\n  prefixCls?: string;\n  className?: string;\n}\n\nexport interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, IProps {\n  /**\n   * The Markdown value.\n   */\n  value?: string;\n  /**\n   * Event handler for the `onChange` event.\n   */\n  onChange?: (value?: string, event?: React.ChangeEvent<HTMLTextAreaElement>, state?: ContextStore) => void;\n  /**\n   * editor height change listener\n   */\n  onHeightChange?: (value?: number, oldValue?: number, state?: ContextStore) => void;\n  /**\n   * Can be used to make `Markdown Editor` focus itself on initialization. Defaults to on.\n   * it will be set to true when either the source `textarea` is focused,\n   * or it has an `autofocus` attribute and no other element is focused.\n   */\n  autoFocus?: ITextAreaProps['autoFocus'];\n  /**\n   * The height of the editor.\n   */\n  height?: number;\n  /**\n   * Custom toolbar heigth\n   * @default 29px\n   */\n  toolbarHeight?: number;\n  /**\n   * Show drag and drop tool. Set the height of the editor.\n   */\n  visiableDragbar?: boolean;\n  /**\n   * Show markdown preview.\n   */\n  preview?: PreviewType;\n  /**\n   * Full screen display editor.\n   */\n  fullscreen?: boolean;\n  /**\n   * Disable `fullscreen` setting body styles\n   */\n  overflow?: boolean;\n  /**\n   * Maximum drag height. `visiableDragbar=true`\n   */\n  maxHeight?: number;\n  /**\n   * Minimum drag height. `visiableDragbar=true`\n   */\n  minHeight?: number;\n  /**\n   * This is reset [react-markdown](https://github.com/rexxars/react-markdown) settings.\n   */\n  previewOptions?: Omit<MarkdownPreviewProps, 'source'>;\n  /**\n   * Set the `textarea` related props.\n   */\n  textareaProps?: ITextAreaProps;\n  /** Use div to replace TextArea or re-render TextArea */\n  renderTextarea?: ITextAreaProps['renderTextarea'];\n  /**\n   * Disable editing area code highlighting. The value is `false`, which increases the editing speed.\n   * @default true\n   */\n  highlightEnable?: boolean;\n  /**\n   * The number of characters to insert when pressing tab key.\n   * Default `2` spaces.\n   */\n  tabSize?: number;\n  /**\n   * If `false`, the `tab` key inserts a tab character into the textarea. If `true`, the `tab` key executes default behavior e.g. focus shifts to next element.\n   */\n  defaultTabEnable?: boolean;\n  /**\n   * You can create your own commands or reuse existing commands.\n   */\n  commands?: ICommand[];\n  /**\n   * Filter or modify your commands.\n   * https://github.com/uiwjs/react-md-editor/issues/296\n   */\n  commandsFilter?: (command: ICommand, isExtra: boolean) => false | ICommand;\n  /**\n   * You can create your own commands or reuse existing commands.\n   */\n  extraCommands?: ICommand[];\n  /**\n   * Hide the tool bar\n   */\n  hideToolbar?: boolean;\n  /** Whether to enable scrolling */\n  enableScroll?: boolean;\n}\n\nfunction setGroupPopFalse(data: Record<string, boolean> = {}) {\n  Object.keys(data).forEach((keyname) => {\n    data[keyname] = false;\n  });\n  return data;\n}\n\nconst InternalMDEditor = (\n  props: MDEditorProps,\n  ref?: ((instance: ContextStore) => void) | React.RefObject<ContextStore> | null,\n) => {\n  const {\n    prefixCls = 'w-md-editor',\n    className,\n    value: propsValue,\n    commands = getCommands(),\n    commandsFilter,\n    extraCommands = getExtraCommands(),\n    height = 200,\n    toolbarHeight = 29,\n    enableScroll = true,\n    visiableDragbar = true,\n    highlightEnable = true,\n    preview: previewType = 'live',\n    fullscreen = false,\n    overflow = true,\n    previewOptions = {},\n    textareaProps,\n    maxHeight = 1200,\n    minHeight = 100,\n    autoFocus,\n    tabSize = 2,\n    defaultTabEnable = false,\n    onChange,\n    onHeightChange,\n    hideToolbar,\n    renderTextarea,\n    ...other\n  } = props || {};\n  const cmds = commands\n    .map((item) => (commandsFilter ? commandsFilter(item, false) : item))\n    .filter(Boolean) as ICommand[];\n  const extraCmds = extraCommands\n    .map((item) => (commandsFilter ? commandsFilter(item, true) : item))\n    .filter(Boolean) as ICommand[];\n  let [state, dispatch] = useReducer(reducer, {\n    markdown: propsValue,\n    preview: previewType,\n    height,\n    highlightEnable,\n    tabSize,\n    defaultTabEnable,\n    scrollTop: 0,\n    scrollTopPreview: 0,\n    commands: cmds,\n    extraCommands: extraCmds,\n    fullscreen,\n    barPopup: {},\n  });\n  const container = useRef<HTMLDivElement>(null);\n  const previewRef = useRef<MarkdownPreviewRef>(null);\n  const enableScrollRef = useRef(enableScroll);\n\n  useImperativeHandle(ref, () => ({ ...state }));\n  useMemo(() => (enableScrollRef.current = enableScroll), [enableScroll]);\n  useEffect(() => {\n    const stateInit: ContextStore = {};\n    if (container.current) {\n      stateInit.container = container.current || undefined;\n    }\n    stateInit.markdown = propsValue || '';\n    stateInit.barPopup = {};\n    if (dispatch) {\n      dispatch({ ...state, ...stateInit });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const cls = [\n    className,\n    'wmde-markdown-var',\n    prefixCls,\n    state.preview ? `${prefixCls}-show-${state.preview}` : null,\n    state.fullscreen ? `${prefixCls}-fullscreen` : null,\n  ]\n    .filter(Boolean)\n    .join(' ')\n    .trim();\n\n  useMemo(\n    () => propsValue !== state.markdown && dispatch({ markdown: propsValue || '' }),\n    [propsValue, state.markdown],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => previewType !== state.preview && dispatch({ preview: previewType }), [previewType]);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => tabSize !== state.tabSize && dispatch({ tabSize }), [tabSize]);\n  useMemo(\n    () => highlightEnable !== state.highlightEnable && dispatch({ highlightEnable }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [highlightEnable],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => autoFocus !== state.autoFocus && dispatch({ autoFocus: autoFocus }), [autoFocus]);\n  useMemo(\n    () => fullscreen !== state.fullscreen && dispatch({ fullscreen: fullscreen }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [fullscreen],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => height !== state.height && dispatch({ height: height }), [height]);\n  useMemo(\n    () => height !== state.height && onHeightChange && onHeightChange(state.height, height, state),\n    [height, onHeightChange, state],\n  );\n\n  const textareaDomRef = useRef<HTMLDivElement>();\n  const active = useRef<'text' | 'preview'>('preview');\n  const initScroll = useRef(false);\n\n  useMemo(() => {\n    textareaDomRef.current = state.textareaWarp;\n    if (state.textareaWarp) {\n      state.textareaWarp.addEventListener('mouseover', () => {\n        active.current = 'text';\n      });\n      state.textareaWarp.addEventListener('mouseleave', () => {\n        active.current = 'preview';\n      });\n    }\n  }, [state.textareaWarp]);\n\n  const handleScroll = (e: React.UIEvent<HTMLDivElement>, type: 'text' | 'preview') => {\n    if (!enableScrollRef.current) return;\n    const textareaDom = textareaDomRef.current;\n    const previewDom = previewRef.current ? previewRef.current.mdp.current : undefined;\n    if (!initScroll.current) {\n      active.current = type;\n      initScroll.current = true;\n    }\n    if (textareaDom && previewDom) {\n      const scale =\n        (textareaDom.scrollHeight - textareaDom.offsetHeight) / (previewDom.scrollHeight - previewDom.offsetHeight);\n      if (e.target === textareaDom && active.current === 'text') {\n        previewDom.scrollTop = textareaDom.scrollTop / scale;\n      }\n      if (e.target === previewDom && active.current === 'preview') {\n        textareaDom.scrollTop = previewDom.scrollTop * scale;\n      }\n      let scrollTop = 0;\n      if (active.current === 'text') {\n        scrollTop = textareaDom.scrollTop || 0;\n      } else if (active.current === 'preview') {\n        scrollTop = previewDom.scrollTop || 0;\n      }\n      dispatch({ scrollTop });\n    }\n  };\n\n  const mdPreview = useMemo(\n    () => (\n      <MarkdownPreview\n        {...previewOptions}\n        onScroll={(e) => handleScroll(e, 'preview')}\n        ref={previewRef}\n        source={state.markdown || ''}\n        className={`${prefixCls}-preview ${previewOptions.className || ''}`}\n      />\n    ),\n    [prefixCls, previewOptions, state.markdown],\n  );\n\n  return (\n    <EditorContext.Provider value={{ ...state, dispatch }}>\n      <div\n        ref={container}\n        className={cls}\n        {...other}\n        onClick={() => {\n          dispatch({ barPopup: { ...setGroupPopFalse(state.barPopup) } });\n        }}\n        style={{\n          ...other.style,\n          height: state.fullscreen ? '100%' : hideToolbar ? Number(state.height) - toolbarHeight : state.height,\n        }}\n      >\n        {!hideToolbar && <Toolbar prefixCls={prefixCls} height={toolbarHeight} overflow={overflow} />}\n        <div\n          className={`${prefixCls}-content`}\n          style={{\n            height: state.fullscreen ? `calc(100% - ${toolbarHeight}px)` : Number(state.height) - toolbarHeight,\n          }}\n        >\n          {/(edit|live)/.test(state.preview || '') && (\n            <TextArea\n              className={`${prefixCls}-input`}\n              prefixCls={prefixCls}\n              autoFocus={autoFocus}\n              {...textareaProps}\n              onChange={(evn) => {\n                onChange && onChange(evn.target.value, evn, state);\n                if (textareaProps && textareaProps.onChange) {\n                  textareaProps.onChange(evn);\n                }\n              }}\n              renderTextarea={renderTextarea}\n              onScroll={(e) => handleScroll(e, 'text')}\n            />\n          )}\n          {/(live|preview)/.test(state.preview || '') && mdPreview}\n        </div>\n        {visiableDragbar && !state.fullscreen && (\n          <DragBar\n            prefixCls={prefixCls}\n            height={state.height as number}\n            maxHeight={maxHeight!}\n            minHeight={minHeight!}\n            onChange={(newHeight) => {\n              dispatch({ height: newHeight });\n            }}\n          />\n        )}\n      </div>\n    </EditorContext.Provider>\n  );\n};\n\nconst mdEditor = React.forwardRef<ContextStore, MDEditorProps>(InternalMDEditor);\n\ntype MDEditor = typeof mdEditor & {\n  Markdown: typeof MarkdownPreview;\n};\n\n(mdEditor as MDEditor).Markdown = MarkdownPreview;\n\nexport default mdEditor as MDEditor;\n"
+    "import React, { useEffect, useReducer, useMemo, useRef, useImperativeHandle } from 'react';\nimport MarkdownPreview, { MarkdownPreviewProps, MarkdownPreviewRef } from '@uiw/react-markdown-preview';\nimport TextArea, { ITextAreaProps } from './components/TextArea';\nimport Toolbar from './components/Toolbar';\nimport DragBar from './components/DragBar';\nimport { getCommands, getExtraCommands, ICommand } from './commands';\nimport { reducer, EditorContext, ContextStore, PreviewType } from './Context';\nimport './index.less';\n\nexport interface IProps {\n  prefixCls?: string;\n  className?: string;\n}\n\nexport interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, IProps {\n  /**\n   * The Markdown value.\n   */\n  value?: string;\n  /**\n   * Event handler for the `onChange` event.\n   */\n  onChange?: (value?: string, event?: React.ChangeEvent<HTMLTextAreaElement>, state?: ContextStore) => void;\n  /**\n   * editor height change listener\n   */\n  onHeightChange?: (value?: number, oldValue?: number, state?: ContextStore) => void;\n  /**\n   * Can be used to make `Markdown Editor` focus itself on initialization. Defaults to on.\n   * it will be set to true when either the source `textarea` is focused,\n   * or it has an `autofocus` attribute and no other element is focused.\n   */\n  autoFocus?: ITextAreaProps['autoFocus'];\n  /**\n   * The height of the editor.\n   */\n  height?: number;\n  /**\n   * Custom toolbar heigth\n   * @default 29px\n   */\n  toolbarHeight?: number;\n  /**\n   * Show drag and drop tool. Set the height of the editor.\n   */\n  visibleDragbar?: boolean;\n  /**\n   * Show markdown preview.\n   */\n  preview?: PreviewType;\n  /**\n   * Full screen display editor.\n   */\n  fullscreen?: boolean;\n  /**\n   * Disable `fullscreen` setting body styles\n   */\n  overflow?: boolean;\n  /**\n   * Maximum drag height. `visibleDragbar=true`\n   */\n  maxHeight?: number;\n  /**\n   * Minimum drag height. `visibleDragbar=true`\n   */\n  minHeight?: number;\n  /**\n   * This is reset [react-markdown](https://github.com/rexxars/react-markdown) settings.\n   */\n  previewOptions?: Omit<MarkdownPreviewProps, 'source'>;\n  /**\n   * Set the `textarea` related props.\n   */\n  textareaProps?: ITextAreaProps;\n  /** Use div to replace TextArea or re-render TextArea */\n  renderTextarea?: ITextAreaProps['renderTextarea'];\n  /**\n   * Disable editing area code highlighting. The value is `false`, which increases the editing speed.\n   * @default true\n   */\n  highlightEnable?: boolean;\n  /**\n   * The number of characters to insert when pressing tab key.\n   * Default `2` spaces.\n   */\n  tabSize?: number;\n  /**\n   * If `false`, the `tab` key inserts a tab character into the textarea. If `true`, the `tab` key executes default behavior e.g. focus shifts to next element.\n   */\n  defaultTabEnable?: boolean;\n  /**\n   * You can create your own commands or reuse existing commands.\n   */\n  commands?: ICommand[];\n  /**\n   * Filter or modify your commands.\n   * https://github.com/uiwjs/react-md-editor/issues/296\n   */\n  commandsFilter?: (command: ICommand, isExtra: boolean) => false | ICommand;\n  /**\n   * You can create your own commands or reuse existing commands.\n   */\n  extraCommands?: ICommand[];\n  /**\n   * Hide the tool bar\n   */\n  hideToolbar?: boolean;\n  /** Whether to enable scrolling */\n  enableScroll?: boolean;\n  /** Toolbar on bottom */\n  toolbarBottom?: boolean;\n}\n\nfunction setGroupPopFalse(data: Record<string, boolean> = {}) {\n  Object.keys(data).forEach((keyname) => {\n    data[keyname] = false;\n  });\n  return data;\n}\n\nconst InternalMDEditor = (\n  props: MDEditorProps,\n  ref?: ((instance: ContextStore) => void) | React.RefObject<ContextStore> | null,\n) => {\n  const {\n    prefixCls = 'w-md-editor',\n    className,\n    value: propsValue,\n    commands = getCommands(),\n    commandsFilter,\n    extraCommands = getExtraCommands(),\n    height = 200,\n    toolbarHeight = 29,\n    enableScroll = true,\n    visibleDragbar = true,\n    highlightEnable = true,\n    preview: previewType = 'live',\n    fullscreen = false,\n    overflow = true,\n    previewOptions = {},\n    textareaProps,\n    maxHeight = 1200,\n    minHeight = 100,\n    autoFocus,\n    tabSize = 2,\n    defaultTabEnable = false,\n    onChange,\n    onHeightChange,\n    hideToolbar,\n    toolbarBottom = false,\n    renderTextarea,\n    ...other\n  } = props || {};\n  const cmds = commands\n    .map((item) => (commandsFilter ? commandsFilter(item, false) : item))\n    .filter(Boolean) as ICommand[];\n  const extraCmds = extraCommands\n    .map((item) => (commandsFilter ? commandsFilter(item, true) : item))\n    .filter(Boolean) as ICommand[];\n  let [state, dispatch] = useReducer(reducer, {\n    markdown: propsValue,\n    preview: previewType,\n    height,\n    highlightEnable,\n    tabSize,\n    defaultTabEnable,\n    scrollTop: 0,\n    scrollTopPreview: 0,\n    commands: cmds,\n    extraCommands: extraCmds,\n    fullscreen,\n    barPopup: {},\n  });\n  const container = useRef<HTMLDivElement>(null);\n  const previewRef = useRef<MarkdownPreviewRef>(null);\n  const enableScrollRef = useRef(enableScroll);\n\n  useImperativeHandle(ref, () => ({ ...state }));\n  useMemo(() => (enableScrollRef.current = enableScroll), [enableScroll]);\n  useEffect(() => {\n    const stateInit: ContextStore = {};\n    if (container.current) {\n      stateInit.container = container.current || undefined;\n    }\n    stateInit.markdown = propsValue || '';\n    stateInit.barPopup = {};\n    if (dispatch) {\n      dispatch({ ...state, ...stateInit });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const cls = [\n    className,\n    'wmde-markdown-var',\n    prefixCls,\n    state.preview ? `${prefixCls}-show-${state.preview}` : null,\n    state.fullscreen ? `${prefixCls}-fullscreen` : null,\n  ]\n    .filter(Boolean)\n    .join(' ')\n    .trim();\n\n  useMemo(\n    () => propsValue !== state.markdown && dispatch({ markdown: propsValue || '' }),\n    [propsValue, state.markdown],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => previewType !== state.preview && dispatch({ preview: previewType }), [previewType]);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => tabSize !== state.tabSize && dispatch({ tabSize }), [tabSize]);\n  useMemo(\n    () => highlightEnable !== state.highlightEnable && dispatch({ highlightEnable }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [highlightEnable],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => autoFocus !== state.autoFocus && dispatch({ autoFocus: autoFocus }), [autoFocus]);\n  useMemo(\n    () => fullscreen !== state.fullscreen && dispatch({ fullscreen: fullscreen }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [fullscreen],\n  );\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useMemo(() => height !== state.height && dispatch({ height: height }), [height]);\n  useMemo(\n    () => height !== state.height && onHeightChange && onHeightChange(state.height, height, state),\n    [height, onHeightChange, state],\n  );\n\n  const textareaDomRef = useRef<HTMLDivElement>();\n  const active = useRef<'text' | 'preview'>('preview');\n  const initScroll = useRef(false);\n\n  useMemo(() => {\n    textareaDomRef.current = state.textareaWarp;\n    if (state.textareaWarp) {\n      state.textareaWarp.addEventListener('mouseover', () => {\n        active.current = 'text';\n      });\n      state.textareaWarp.addEventListener('mouseleave', () => {\n        active.current = 'preview';\n      });\n    }\n  }, [state.textareaWarp]);\n\n  const handleScroll = (e: React.UIEvent<HTMLDivElement>, type: 'text' | 'preview') => {\n    if (!enableScrollRef.current) return;\n    const textareaDom = textareaDomRef.current;\n    const previewDom = previewRef.current ? previewRef.current.mdp.current : undefined;\n    if (!initScroll.current) {\n      active.current = type;\n      initScroll.current = true;\n    }\n    if (textareaDom && previewDom) {\n      const scale =\n        (textareaDom.scrollHeight - textareaDom.offsetHeight) / (previewDom.scrollHeight - previewDom.offsetHeight);\n      if (e.target === textareaDom && active.current === 'text') {\n        previewDom.scrollTop = textareaDom.scrollTop / scale;\n      }\n      if (e.target === previewDom && active.current === 'preview') {\n        textareaDom.scrollTop = previewDom.scrollTop * scale;\n      }\n      let scrollTop = 0;\n      if (active.current === 'text') {\n        scrollTop = textareaDom.scrollTop || 0;\n      } else if (active.current === 'preview') {\n        scrollTop = previewDom.scrollTop || 0;\n      }\n      dispatch({ scrollTop });\n    }\n  };\n\n  const mdPreview = useMemo(\n    () => (\n      <MarkdownPreview\n        {...previewOptions}\n        onScroll={(e) => handleScroll(e, 'preview')}\n        ref={previewRef}\n        source={state.markdown || ''}\n        className={`${prefixCls}-preview ${previewOptions.className || ''}`}\n      />\n    ),\n    [prefixCls, previewOptions, state.markdown],\n  );\n\n  return (\n    <EditorContext.Provider value={{ ...state, dispatch }}>\n      <div\n        ref={container}\n        className={cls}\n        {...other}\n        onClick={() => {\n          dispatch({ barPopup: { ...setGroupPopFalse(state.barPopup) } });\n        }}\n        style={{\n          ...other.style,\n          height: state.fullscreen ? '100%' : hideToolbar ? Number(state.height) - toolbarHeight : state.height,\n        }}\n      >\n        {!hideToolbar && !toolbarBottom && (\n          <Toolbar prefixCls={prefixCls} height={toolbarHeight} overflow={overflow} toolbarBottom={toolbarBottom} />\n        )}\n        <div\n          className={`${prefixCls}-content`}\n          style={{\n            height: state.fullscreen ? `calc(100% - ${toolbarHeight}px)` : Number(state.height) - toolbarHeight,\n          }}\n        >\n          {/(edit|live)/.test(state.preview || '') && (\n            <TextArea\n              className={`${prefixCls}-input`}\n              prefixCls={prefixCls}\n              autoFocus={autoFocus}\n              {...textareaProps}\n              onChange={(evn) => {\n                onChange && onChange(evn.target.value, evn, state);\n                if (textareaProps && textareaProps.onChange) {\n                  textareaProps.onChange(evn);\n                }\n              }}\n              renderTextarea={renderTextarea}\n              onScroll={(e) => handleScroll(e, 'text')}\n            />\n          )}\n          {/(live|preview)/.test(state.preview || '') && mdPreview}\n        </div>\n        {visibleDragbar && !state.fullscreen && (\n          <DragBar\n            prefixCls={prefixCls}\n            height={state.height as number}\n            maxHeight={maxHeight!}\n            minHeight={minHeight!}\n            onChange={(newHeight) => {\n              dispatch({ height: newHeight });\n            }}\n          />\n        )}\n        {!hideToolbar && toolbarBottom && (\n          <Toolbar prefixCls={prefixCls} height={toolbarHeight} overflow={overflow} toolbarBottom={toolbarBottom} />\n        )}\n      </div>\n    </EditorContext.Provider>\n  );\n};\n\nconst mdEditor = React.forwardRef<ContextStore, MDEditorProps>(InternalMDEditor);\n\ntype MDEditor = typeof mdEditor & {\n  Markdown: typeof MarkdownPreview;\n};\n\n(mdEditor as MDEditor).Markdown = MarkdownPreview;\n\nexport default mdEditor as MDEditor;\n"
   ],
-  "mappings": "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"
+  "mappings": "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"
 }

package/esm/components/TextArea/index.css

@@ -50,8 +50,15 @@
 }
 .w-md-editor-text-pre {
   position: relative;
-  margin: 0px;
+  margin: 0px !important;
   pointer-events: none;
+  background-color: transparent !important;
+}
+.w-md-editor-text-pre > code {
+  padding: 0 !important;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
+  font-size: 14px !important;
+  line-height: 18px !important;
 }
 .w-md-editor-text-input {
   position: absolute;

package/esm/components/TextArea/index.less

@@ -48,8 +48,15 @@
     }
     &-pre {
       position: relative;
-      margin: 0px;
+      margin: 0px !important;
       pointer-events: none;
+      background-color: transparent !important;
+      > code {
+        padding: 0 !important;
+        font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
+        font-size: 14px !important;
+        line-height: 18px !important;
+      }
     }
     &-input {
       position: absolute;

package/esm/components/Toolbar/index.css

@@ -9,6 +9,11 @@
   -webkit-user-select: none;
           user-select: none;
 }
+.w-md-editor-toolbar.bottom {
+  border-bottom: 0px;
+  border-top: 1px solid var(--color-border-default);
+  border-radius: 0 0 3px 3px;
+}
 .w-md-editor-toolbar ul,
 .w-md-editor-toolbar li {
   margin: 0;

package/esm/components/Toolbar/index.d.ts

@@ -5,6 +5,7 @@ import './index.less';
 export interface IToolbarProps extends IProps {
     overflow?: boolean;
     height?: React.CSSProperties['height'];
+    toolbarBottom?: boolean;
     onCommand?: (command: ICommand<string>, groupName?: string) => void;
     commands?: ICommand<string>[];
     isChild?: boolean;

package/esm/components/Toolbar/index.js

@@ -120,14 +120,16 @@ export default function Toolbar(props) {
   var {
     prefixCls,
     height = 29,
+    toolbarBottom,
     isChild
   } = props;
   var {
     commands,
     extraCommands
   } = useContext(EditorContext);
+  var bottomClassName = toolbarBottom ? 'bottom' : '';
   return /*#__PURE__*/_jsxs("div", {
-    className: prefixCls + "-toolbar",
+    className: prefixCls + "-toolbar " + bottomClassName,
     style: {
       height
     },

package/esm/components/Toolbar/index.js.map

@@ -65,14 +65,16 @@
     "isArray",
     "Toolbar",
     "height",
+    "toolbarBottom",
     "isChild",
-    "extraCommands"
+    "extraCommands",
+    "bottomClassName"
   ],
   "sources": [
     "../../../src/components/Toolbar/index.tsx"
   ],
   "sourcesContent": [
-    "import React, { Fragment, useContext, useEffect, useRef } from 'react';\nimport { IProps } from '../../Editor';\nimport { EditorContext, PreviewType, ContextStore } from '../../Context';\nimport { ICommand } from '../../commands';\nimport Child from './Child';\nimport './index.less';\n\nexport interface IToolbarProps extends IProps {\n  overflow?: boolean;\n  height?: React.CSSProperties['height'];\n  onCommand?: (command: ICommand<string>, groupName?: string) => void;\n  commands?: ICommand<string>[];\n  isChild?: boolean;\n}\n\nexport function ToolbarItems(props: IToolbarProps) {\n  const { prefixCls, overflow } = props;\n  const { fullscreen, preview, barPopup = {}, commandOrchestrator, dispatch } = useContext(EditorContext);\n  const originalOverflow = useRef('');\n\n  function handleClick(command: ICommand<string>, name?: string) {\n    if (!dispatch) return;\n    const state: ContextStore = { barPopup: { ...barPopup } };\n    if (command.keyCommand === 'preview') {\n      state.preview = command.value as PreviewType;\n    }\n    if (command.keyCommand === 'fullscreen') {\n      state.fullscreen = !fullscreen;\n    }\n    if (props.commands && command.keyCommand === 'group') {\n      props.commands.forEach((item) => {\n        if (name === item.groupName) {\n          state.barPopup![name!] = true;\n        } else if (item.keyCommand) {\n          state.barPopup![item.groupName!] = false;\n        }\n      });\n    } else if (name || command.parent) {\n      Object.keys(state.barPopup || {}).forEach((keyName) => {\n        state.barPopup![keyName] = false;\n      });\n    }\n\n    if (Object.keys(state).length) {\n      dispatch({ ...state });\n    }\n    commandOrchestrator && commandOrchestrator.executeCommand(command);\n  }\n\n  useEffect(() => {\n    if (document && overflow) {\n      if (fullscreen) {\n        // prevent scroll on fullscreen\n        document.body.style.overflow = 'hidden';\n      } else {\n        // get the original overflow only the first time\n        if (!originalOverflow.current) {\n          originalOverflow.current = window.getComputedStyle(document.body, null).overflow;\n        }\n        // reset to the original overflow\n        document.body.style.overflow = originalOverflow.current;\n      }\n    }\n  }, [fullscreen, originalOverflow, overflow]);\n\n  return (\n    <ul>\n      {(props.commands || []).map((item, idx) => {\n        if (item.keyCommand === 'divider') {\n          return <li key={idx} {...item.liProps} className={`${prefixCls}-toolbar-divider`} />;\n        }\n        if (!item.keyCommand) return <Fragment key={idx} />;\n        const activeBtn =\n          (fullscreen && item.keyCommand === 'fullscreen') || (item.keyCommand === 'preview' && preview === item.value);\n        const childNode =\n          item.children && typeof item.children === 'function'\n            ? item.children({\n                getState: () => commandOrchestrator!.getState(),\n                textApi: commandOrchestrator ? commandOrchestrator!.textApi : undefined,\n                close: () => handleClick({}, item.groupName),\n                execute: () => handleClick({ execute: item.execute }),\n              })\n            : undefined;\n        const disabled = barPopup && preview && preview === 'preview' && !/(preview|fullscreen)/.test(item.keyCommand);\n        return (\n          <li key={idx} {...item.liProps} className={activeBtn ? `active` : ''}>\n            {!item.buttonProps && item.icon}\n            {item.buttonProps &&\n              React.createElement(\n                'button',\n                {\n                  type: 'button',\n                  key: idx,\n                  disabled,\n                  'data-name': item.name,\n                  ...item.buttonProps,\n                  onClick: (evn: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n                    evn.stopPropagation();\n                    handleClick(item, item.groupName);\n                  },\n                },\n                item.icon,\n              )}\n            {item.children && (\n              <Child\n                overflow={overflow}\n                groupName={item.groupName}\n                prefixCls={prefixCls}\n                children={childNode}\n                commands={Array.isArray(item.children) ? item.children : undefined}\n              />\n            )}\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n\nexport default function Toolbar(props: IToolbarProps = {}) {\n  const { prefixCls, height = 29, isChild } = props;\n  const { commands, extraCommands } = useContext(EditorContext);\n  return (\n    <div className={`${prefixCls}-toolbar`} style={{ height }}>\n      <ToolbarItems {...props} commands={props.commands || commands || []} />\n      {!isChild && <ToolbarItems {...props} commands={extraCommands || []} />}\n    </div>\n  );\n}\n"
+    "import React, { Fragment, useContext, useEffect, useRef } from 'react';\nimport { IProps } from '../../Editor';\nimport { EditorContext, PreviewType, ContextStore } from '../../Context';\nimport { ICommand } from '../../commands';\nimport Child from './Child';\nimport './index.less';\n\nexport interface IToolbarProps extends IProps {\n  overflow?: boolean;\n  height?: React.CSSProperties['height'];\n  toolbarBottom?: boolean;\n  onCommand?: (command: ICommand<string>, groupName?: string) => void;\n  commands?: ICommand<string>[];\n  isChild?: boolean;\n}\n\nexport function ToolbarItems(props: IToolbarProps) {\n  const { prefixCls, overflow } = props;\n  const { fullscreen, preview, barPopup = {}, commandOrchestrator, dispatch } = useContext(EditorContext);\n  const originalOverflow = useRef('');\n\n  function handleClick(command: ICommand<string>, name?: string) {\n    if (!dispatch) return;\n    const state: ContextStore = { barPopup: { ...barPopup } };\n    if (command.keyCommand === 'preview') {\n      state.preview = command.value as PreviewType;\n    }\n    if (command.keyCommand === 'fullscreen') {\n      state.fullscreen = !fullscreen;\n    }\n    if (props.commands && command.keyCommand === 'group') {\n      props.commands.forEach((item) => {\n        if (name === item.groupName) {\n          state.barPopup![name!] = true;\n        } else if (item.keyCommand) {\n          state.barPopup![item.groupName!] = false;\n        }\n      });\n    } else if (name || command.parent) {\n      Object.keys(state.barPopup || {}).forEach((keyName) => {\n        state.barPopup![keyName] = false;\n      });\n    }\n\n    if (Object.keys(state).length) {\n      dispatch({ ...state });\n    }\n    commandOrchestrator && commandOrchestrator.executeCommand(command);\n  }\n\n  useEffect(() => {\n    if (document && overflow) {\n      if (fullscreen) {\n        // prevent scroll on fullscreen\n        document.body.style.overflow = 'hidden';\n      } else {\n        // get the original overflow only the first time\n        if (!originalOverflow.current) {\n          originalOverflow.current = window.getComputedStyle(document.body, null).overflow;\n        }\n        // reset to the original overflow\n        document.body.style.overflow = originalOverflow.current;\n      }\n    }\n  }, [fullscreen, originalOverflow, overflow]);\n\n  return (\n    <ul>\n      {(props.commands || []).map((item, idx) => {\n        if (item.keyCommand === 'divider') {\n          return <li key={idx} {...item.liProps} className={`${prefixCls}-toolbar-divider`} />;\n        }\n        if (!item.keyCommand) return <Fragment key={idx} />;\n        const activeBtn =\n          (fullscreen && item.keyCommand === 'fullscreen') || (item.keyCommand === 'preview' && preview === item.value);\n        const childNode =\n          item.children && typeof item.children === 'function'\n            ? item.children({\n                getState: () => commandOrchestrator!.getState(),\n                textApi: commandOrchestrator ? commandOrchestrator!.textApi : undefined,\n                close: () => handleClick({}, item.groupName),\n                execute: () => handleClick({ execute: item.execute }),\n              })\n            : undefined;\n        const disabled = barPopup && preview && preview === 'preview' && !/(preview|fullscreen)/.test(item.keyCommand);\n        return (\n          <li key={idx} {...item.liProps} className={activeBtn ? `active` : ''}>\n            {!item.buttonProps && item.icon}\n            {item.buttonProps &&\n              React.createElement(\n                'button',\n                {\n                  type: 'button',\n                  key: idx,\n                  disabled,\n                  'data-name': item.name,\n                  ...item.buttonProps,\n                  onClick: (evn: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n                    evn.stopPropagation();\n                    handleClick(item, item.groupName);\n                  },\n                },\n                item.icon,\n              )}\n            {item.children && (\n              <Child\n                overflow={overflow}\n                groupName={item.groupName}\n                prefixCls={prefixCls}\n                children={childNode}\n                commands={Array.isArray(item.children) ? item.children : undefined}\n              />\n            )}\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n\nexport default function Toolbar(props: IToolbarProps = {}) {\n  const { prefixCls, height = 29, toolbarBottom, isChild } = props;\n  const { commands, extraCommands } = useContext(EditorContext);\n  const bottomClassName = toolbarBottom ? 'bottom' : '';\n  return (\n    <div className={`${prefixCls}-toolbar ${bottomClassName}`} style={{ height }}>\n      <ToolbarItems {...props} commands={props.commands || commands || []} />\n      {!isChild && <ToolbarItems {...props} commands={extraCommands || []} />}\n    </div>\n  );\n}\n"
   ],
-  "mappings": "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"
+  "mappings": "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"
 }

package/esm/components/Toolbar/index.less

@@ -10,6 +10,11 @@
     align-items: center;
     border-radius: 3px 3px 0 0;
     user-select: none;
+    &.bottom {
+      border-bottom: 0px;
+      border-top: 1px solid var(--color-border-default);
+      border-radius: 0 0 3px 3px;
+    }
     ul,
     li {
       margin: 0;

package/esm/index.css

@@ -30,6 +30,9 @@
   top: 0;
   right: 0;
   bottom: 0;
+  border-radius: 0 0 5px 0;
+  display: flex;
+  flex-direction: column;
 }
 .w-md-editor-preview .anchor {
   display: none;

package/esm/index.less

@@ -32,6 +32,9 @@
     top: 0;
     right: 0;
     bottom: 0;
+    border-radius: 0 0 5px 0;
+    display: flex;
+    flex-direction: column;
     .anchor {
       display: none;
     }

package/lib/Context.js.map

@@ -15,5 +15,5 @@
   "sourcesContent": [
     "import React from 'react';\nimport { ICommand, TextAreaCommandOrchestrator } from './commands';\n\nexport type PreviewType = 'live' | 'edit' | 'preview';\n\nexport type ContextStore = {\n  commands?: ICommand<string>[];\n  extraCommands?: ICommand<string>[];\n  markdown?: string;\n  preview?: PreviewType;\n  height?: number;\n  fullscreen?: boolean;\n  highlightEnable?: boolean;\n  autoFocus?: boolean;\n  textarea?: HTMLTextAreaElement;\n  commandOrchestrator?: TextAreaCommandOrchestrator;\n  textareaWarp?: HTMLDivElement;\n  textareaPre?: HTMLPreElement;\n  container?: HTMLDivElement | null;\n  dispatch?: React.Dispatch<ContextStore>;\n  barPopup?: Record<string, boolean>;\n  scrollTop?: number;\n  scrollTopPreview?: number;\n  tabSize?: number;\n  defaultTabEnable?: boolean;\n};\n\nexport type ExecuteCommandState = Pick<ContextStore, 'fullscreen' | 'preview' | 'highlightEnable'>;\n\nexport function reducer(state: ContextStore, action: ContextStore) {\n  return { ...state, ...action };\n}\n\nexport const EditorContext = React.createContext<ContextStore>({ markdown: '' });\n"
   ],
-  "mappings": ";;;;;;;;;;;;AAAA;;AA6BO,SAASA,OAAT,CAAiBC,KAAjB,EAAsCC,MAAtC,EAA4D;EACjE,mEAAYD,KAAZ,GAAsBC,MAAtB;AACD;;AAEM,IAAMC,aAAa,gBAAGC,eAAMC,aAAN,CAAkC;EAAEC,QAAQ,EAAE;AAAZ,CAAlC,CAAtB"
+  "mappings": ";;;;;;;;;;;;AAAA;;AA6BO,SAASA,OAAT,CAAiBC,KAAjB,EAAsCC,MAAtC,EAA4D;EACjE,mEAAYD,KAAZ,GAAsBC,MAAtB;AACD;;AAEM,IAAMC,aAAa,gBAAGC,cAAA,CAAMC,aAAN,CAAkC;EAAEC,QAAQ,EAAE;AAAZ,CAAlC,CAAtB"
 }

package/lib/Editor.d.ts

@@ -39,7 +39,7 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
     /**
      * Show drag and drop tool. Set the height of the editor.
      */
-    visiableDragbar?: boolean;
+    visibleDragbar?: boolean;
     /**
      * Show markdown preview.
      */
@@ -53,11 +53,11 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
      */
     overflow?: boolean;
     /**
-     * Maximum drag height. `visiableDragbar=true`
+     * Maximum drag height. `visibleDragbar=true`
      */
     maxHeight?: number;
     /**
-     * Minimum drag height. `visiableDragbar=true`
+     * Minimum drag height. `visibleDragbar=true`
      */
     minHeight?: number;
     /**
@@ -103,6 +103,8 @@ export interface MDEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>
     hideToolbar?: boolean;
     /** Whether to enable scrolling */
     enableScroll?: boolean;
+    /** Toolbar on bottom */
+    toolbarBottom?: boolean;
 }
 declare const mdEditor: React.ForwardRefExoticComponent<MDEditorProps & React.RefAttributes<ContextStore>>;
 declare type MDEditor = typeof mdEditor & {

package/lib/Editor.js

@@ -31,7 +31,7 @@ var _Context = require("./Context");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["prefixCls", "className", "value", "commands", "commandsFilter", "extraCommands", "height", "toolbarHeight", "enableScroll", "visiableDragbar", "highlightEnable", "preview", "fullscreen", "overflow", "previewOptions", "textareaProps", "maxHeight", "minHeight", "autoFocus", "tabSize", "defaultTabEnable", "onChange", "onHeightChange", "hideToolbar", "renderTextarea"];
+var _excluded = ["prefixCls", "className", "value", "commands", "commandsFilter", "extraCommands", "height", "toolbarHeight", "enableScroll", "visibleDragbar", "highlightEnable", "preview", "fullscreen", "overflow", "previewOptions", "textareaProps", "maxHeight", "minHeight", "autoFocus", "tabSize", "defaultTabEnable", "onChange", "onHeightChange", "hideToolbar", "toolbarBottom", "renderTextarea"];
 
 function setGroupPopFalse() {
   var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -58,8 +58,8 @@ var InternalMDEditor = function InternalMDEditor(props, ref) {
       toolbarHeight = _ref$toolbarHeight === void 0 ? 29 : _ref$toolbarHeight,
       _ref$enableScroll = _ref.enableScroll,
       enableScroll = _ref$enableScroll === void 0 ? true : _ref$enableScroll,
-      _ref$visiableDragbar = _ref.visiableDragbar,
-      visiableDragbar = _ref$visiableDragbar === void 0 ? true : _ref$visiableDragbar,
+      _ref$visibleDragbar = _ref.visibleDragbar,
+      visibleDragbar = _ref$visibleDragbar === void 0 ? true : _ref$visibleDragbar,
       _ref$highlightEnable = _ref.highlightEnable,
       highlightEnable = _ref$highlightEnable === void 0 ? true : _ref$highlightEnable,
       _ref$preview = _ref.preview,
@@ -83,6 +83,8 @@ var InternalMDEditor = function InternalMDEditor(props, ref) {
       _onChange = _ref.onChange,
       onHeightChange = _ref.onHeightChange,
       hideToolbar = _ref.hideToolbar,
+      _ref$toolbarBottom = _ref.toolbarBottom,
+      toolbarBottom = _ref$toolbarBottom === void 0 ? false : _ref$toolbarBottom,
       renderTextarea = _ref.renderTextarea,
       other = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
@@ -257,10 +259,11 @@ var InternalMDEditor = function InternalMDEditor(props, ref) {
       style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, other.style), {}, {
         height: state.fullscreen ? '100%' : hideToolbar ? Number(state.height) - toolbarHeight : state.height
       }),
-      children: [!hideToolbar && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toolbar.default, {
+      children: [!hideToolbar && !toolbarBottom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toolbar.default, {
         prefixCls: prefixCls,
         height: toolbarHeight,
-        overflow: overflow
+        overflow: overflow,
+        toolbarBottom: toolbarBottom
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "".concat(prefixCls, "-content"),
         style: {
@@ -283,7 +286,7 @@ var InternalMDEditor = function InternalMDEditor(props, ref) {
             return handleScroll(e, 'text');
           }
         })), /(live|preview)/.test(state.preview || '') && mdPreview]
-      }), visiableDragbar && !state.fullscreen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DragBar.default, {
+      }), visibleDragbar && !state.fullscreen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DragBar.default, {
         prefixCls: prefixCls,
         height: state.height,
         maxHeight: maxHeight,
@@ -293,6 +296,11 @@ var InternalMDEditor = function InternalMDEditor(props, ref) {
             height: newHeight
           });
         }
+      }), !hideToolbar && toolbarBottom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toolbar.default, {
+        prefixCls: prefixCls,
+        height: toolbarHeight,
+        overflow: overflow,
+        toolbarBottom: toolbarBottom
       })]
     }))
   });