@uiw/react-md-editor 4.0.11 → 4.1.1

package/esm/components/TextArea/index.js

@@ -1,101 +1,6 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["prefixCls", "className", "onScroll", "renderTextarea"];
-import React, { useEffect, Fragment, useContext } from 'react';
-import { EditorContext } from "../../Context.js";
-import shortcuts from "./shortcuts.js";
 import Markdown from "./Markdown.js";
-import Textarea from "./Textarea.js";
-import { TextAreaCommandOrchestrator } from "../../commands/index.js";
-import "./index.css";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function TextArea(props) {
-  var _ref = props || {},
-    {
-      prefixCls,
-      className,
-      onScroll,
-      renderTextarea
-    } = _ref,
-    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var {
-    markdown,
-    scrollTop,
-    commands,
-    minHeight,
-    highlightEnable,
-    extraCommands,
-    dispatch
-  } = useContext(EditorContext);
-  var textRef = React.useRef(null);
-  var executeRef = React.useRef();
-  var warp = /*#__PURE__*/React.createRef();
-  useEffect(() => {
-    var state = {};
-    if (warp.current) {
-      state.textareaWarp = warp.current || undefined;
-      warp.current.scrollTop = scrollTop || 0;
-    }
-    if (dispatch) {
-      dispatch(_extends({}, state));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  useEffect(() => {
-    if (textRef.current && dispatch) {
-      var commandOrchestrator = new TextAreaCommandOrchestrator(textRef.current);
-      executeRef.current = commandOrchestrator;
-      dispatch({
-        textarea: textRef.current,
-        commandOrchestrator
-      });
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  var textStyle = highlightEnable ? {} : {
-    WebkitTextFillColor: 'initial',
-    overflow: 'auto'
-  };
-  return /*#__PURE__*/_jsx("div", {
-    ref: warp,
-    className: prefixCls + "-area " + (className || ''),
-    onScroll: onScroll,
-    children: /*#__PURE__*/_jsx("div", {
-      className: prefixCls + "-text",
-      style: {
-        minHeight
-      },
-      children: renderTextarea ? (/*#__PURE__*/React.cloneElement(renderTextarea(_extends({}, otherProps, {
-        value: markdown,
-        autoComplete: 'off',
-        autoCorrect: 'off',
-        spellCheck: 'false',
-        autoCapitalize: 'off',
-        className: prefixCls + "-text-input",
-        style: {
-          WebkitTextFillColor: 'inherit',
-          overflow: 'auto'
-        }
-      }), {
-        dispatch,
-        onChange: otherProps.onChange,
-        shortcuts,
-        useContext: {
-          commands,
-          extraCommands,
-          commandOrchestrator: executeRef.current
-        }
-      }), {
-        ref: textRef
-      })) : /*#__PURE__*/_jsxs(Fragment, {
-        children: [highlightEnable && /*#__PURE__*/_jsx(Markdown, {
-          prefixCls: prefixCls
-        }), /*#__PURE__*/_jsx(Textarea, _extends({
-          prefixCls: prefixCls
-        }, otherProps, {
-          style: textStyle
-        }))]
-      })
-    })
-  });
-}
+import { createTextArea } from "./factory.js";
+export default createTextArea({
+  Markdown,
+  useMinHeight: true
+});

package/esm/components/TextArea/index.nohighlight.d.ts

@@ -1,27 +1,3 @@
-import React, { JSX } from 'react';
-import { type ContextStore, ExecuteCommandState } from '../../Context';
-import { TextAreaProps } from './Textarea';
-import { type IProps } from '../../Types';
-import { TextAreaCommandOrchestrator, type ICommand } from '../../commands/';
-import './index.less';
-type RenderTextareaHandle = {
-    dispatch: ContextStore['dispatch'];
-    onChange?: TextAreaProps['onChange'];
-    useContext?: {
-        commands: ContextStore['commands'];
-        extraCommands: ContextStore['extraCommands'];
-        commandOrchestrator?: TextAreaCommandOrchestrator;
-    };
-    shortcuts?: (e: KeyboardEvent | React.KeyboardEvent<HTMLTextAreaElement>, commands: ICommand[], commandOrchestrator?: TextAreaCommandOrchestrator, dispatch?: React.Dispatch<ContextStore>, state?: ExecuteCommandState) => void;
-};
-export interface ITextAreaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'onScroll'>, IProps {
-    value?: string;
-    onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;
-    renderTextarea?: (props: React.TextareaHTMLAttributes<HTMLTextAreaElement> | React.HTMLAttributes<HTMLDivElement>, opts: RenderTextareaHandle) => JSX.Element;
-}
-export type TextAreaRef = {
-    text?: HTMLTextAreaElement;
-    warp?: HTMLDivElement;
-};
-export default function TextArea(props: ITextAreaProps): import("react/jsx-runtime").JSX.Element;
-export {};
+export type { ITextAreaProps, RenderTextareaHandle, TextAreaRef } from './factory';
+declare const _default: (props: import("./factory").ITextAreaProps) => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/esm/components/TextArea/index.nohighlight.js

@@ -1,93 +1,2 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["prefixCls", "className", "onScroll", "renderTextarea"];
-import React, { useEffect, Fragment, useContext } from 'react';
-import { EditorContext } from "../../Context.js";
-import shortcuts from "./shortcuts.js";
-import Textarea from "./Textarea.js";
-import { TextAreaCommandOrchestrator } from "../../commands/index.js";
-import "./index.css";
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function TextArea(props) {
-  var _ref = props || {},
-    {
-      prefixCls,
-      className,
-      onScroll,
-      renderTextarea
-    } = _ref,
-    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var {
-    markdown,
-    scrollTop,
-    commands,
-    extraCommands,
-    dispatch
-  } = useContext(EditorContext);
-  var textRef = React.useRef(null);
-  var executeRef = React.useRef();
-  var warp = /*#__PURE__*/React.createRef();
-  useEffect(() => {
-    var state = {};
-    if (warp.current) {
-      state.textareaWarp = warp.current || undefined;
-      warp.current.scrollTop = scrollTop || 0;
-    }
-    if (dispatch) {
-      dispatch(_extends({}, state));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  useEffect(() => {
-    if (textRef.current && dispatch) {
-      var commandOrchestrator = new TextAreaCommandOrchestrator(textRef.current);
-      executeRef.current = commandOrchestrator;
-      dispatch({
-        textarea: textRef.current,
-        commandOrchestrator
-      });
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  var textStyle = {
-    WebkitTextFillColor: 'initial',
-    overflow: 'auto'
-  };
-  return /*#__PURE__*/_jsx("div", {
-    ref: warp,
-    className: prefixCls + "-area " + (className || ''),
-    onScroll: onScroll,
-    children: /*#__PURE__*/_jsx("div", {
-      className: prefixCls + "-text",
-      children: renderTextarea ? (/*#__PURE__*/React.cloneElement(renderTextarea(_extends({}, otherProps, {
-        value: markdown,
-        autoComplete: 'off',
-        autoCorrect: 'off',
-        spellCheck: 'false',
-        autoCapitalize: 'off',
-        className: prefixCls + "-text-input",
-        style: {
-          WebkitTextFillColor: 'inherit',
-          overflow: 'auto'
-        }
-      }), {
-        dispatch,
-        onChange: otherProps.onChange,
-        shortcuts,
-        useContext: {
-          commands,
-          extraCommands,
-          commandOrchestrator: executeRef.current
-        }
-      }), {
-        ref: textRef
-      })) : /*#__PURE__*/_jsx(Fragment, {
-        children: /*#__PURE__*/_jsx(Textarea, _extends({
-          prefixCls: prefixCls
-        }, otherProps, {
-          style: textStyle
-        }))
-      })
-    })
-  });
-}
+import { createTextArea } from "./factory.js";
+export default createTextArea();

package/esm/components/Toolbar/Child.js

@@ -5,15 +5,14 @@ import Toolbar from "./index.js";
 import { EditorContext } from "../../Context.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export default function Child(props) {
-  var {
-    prefixCls,
-    groupName,
-    commands,
-    children
-  } = props || {};
-  var {
-    barPopup = {}
-  } = useContext(EditorContext);
+  var _ref = props || {},
+    prefixCls = _ref.prefixCls,
+    groupName = _ref.groupName,
+    commands = _ref.commands,
+    children = _ref.children;
+  var _useContext = useContext(EditorContext),
+    _useContext$barPopup = _useContext.barPopup,
+    barPopup = _useContext$barPopup === void 0 ? {} : _useContext$barPopup;
   return useMemo(() => /*#__PURE__*/_jsx("div", {
     className: prefixCls + "-toolbar-child " + (groupName && barPopup[groupName] ? 'active' : ''),
     onClick: e => e.stopPropagation(),

package/esm/components/Toolbar/index.js

@@ -5,18 +5,16 @@ import Child from "./Child.js";
 import "./index.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function ToolbarItems(props) {
-  var {
-    prefixCls,
-    overflow
-  } = props;
-  var {
-    fullscreen,
-    preview,
-    barPopup = {},
-    components,
-    commandOrchestrator,
-    dispatch
-  } = useContext(EditorContext);
+  var prefixCls = props.prefixCls,
+    overflow = props.overflow;
+  var _useContext = useContext(EditorContext),
+    fullscreen = _useContext.fullscreen,
+    preview = _useContext.preview,
+    _useContext$barPopup = _useContext.barPopup,
+    barPopup = _useContext$barPopup === void 0 ? {} : _useContext$barPopup,
+    components = _useContext.components,
+    commandOrchestrator = _useContext.commandOrchestrator,
+    dispatch = _useContext.dispatch;
   var originalOverflow = useRef('');
   function handleClick(command, name) {
     if (!dispatch) return;
@@ -110,15 +108,13 @@ export default function Toolbar(props) {
   if (props === void 0) {
     props = {};
   }
-  var {
-    prefixCls,
-    isChild,
-    className
-  } = props;
-  var {
-    commands,
-    extraCommands
-  } = useContext(EditorContext);
+  var _props = props,
+    prefixCls = _props.prefixCls,
+    isChild = _props.isChild,
+    className = _props.className;
+  var _useContext2 = useContext(EditorContext),
+    commands = _useContext2.commands,
+    extraCommands = _useContext2.extraCommands;
   return /*#__PURE__*/_jsxs("div", {
     className: prefixCls + "-toolbar " + className,
     children: [/*#__PURE__*/_jsx(ToolbarItems, _extends({}, props, {
@@ -129,13 +125,11 @@ export default function Toolbar(props) {
   });
 }
 export function ToolbarVisibility(props) {
-  var {
-    hideToolbar,
-    toolbarBottom,
-    placement,
-    overflow,
-    prefixCls
-  } = props;
+  var hideToolbar = props.hideToolbar,
+    toolbarBottom = props.toolbarBottom,
+    placement = props.placement,
+    overflow = props.overflow,
+    prefixCls = props.prefixCls;
   if (hideToolbar || placement === 'bottom' && !toolbarBottom || placement === 'top' && toolbarBottom) {
     return null;
   }

package/esm/index.common.d.ts

@@ -0,0 +1,16 @@
+import MDEditor from './Editor.common';
+import * as commands from './commands/';
+import * as MarkdownUtil from './utils/markdownUtils';
+import './index.less';
+export { headingExecute } from './commands/title';
+export * from './commands/';
+export * from './commands/group';
+export * from './utils/markdownUtils';
+export * from './utils/InsertTextAtPosition';
+export * from './Editor.common';
+export * from './Context';
+export * from './Types';
+export { default as handleKeyDown } from './components/TextArea/handleKeyDown';
+export { default as shortcuts } from './components/TextArea/shortcuts';
+export { MarkdownUtil, commands };
+export default MDEditor;

package/esm/index.common.js

@@ -0,0 +1,16 @@
+import MDEditor from './Editor.common';
+import * as commands from "./commands/index.js";
+import * as MarkdownUtil from "./utils/markdownUtils.js";
+import "./index.css";
+export { headingExecute } from "./commands/title.js";
+export * from "./commands/index.js";
+export * from "./commands/group.js";
+export * from "./utils/markdownUtils.js";
+export * from "./utils/InsertTextAtPosition.js";
+export * from './Editor.common';
+export * from "./Context.js";
+export * from "./Types.js";
+export { default as handleKeyDown } from "./components/TextArea/handleKeyDown.js";
+export { default as shortcuts } from "./components/TextArea/shortcuts.js";
+export { MarkdownUtil, commands };
+export default MDEditor;

package/esm/react-markdown-preview.common.d.ts

@@ -0,0 +1,4 @@
+declare module '@uiw/react-markdown-preview/common' {
+  export { default } from '@uiw/react-markdown-preview/nohighlight';
+  export * from '@uiw/react-markdown-preview/nohighlight';
+}

package/esm/utils/markdownUtils.js

@@ -1,10 +1,9 @@
 export function selectWord(_ref) {
-  var {
-    text,
-    selection,
-    prefix,
-    suffix = prefix
-  } = _ref;
+  var text = _ref.text,
+    selection = _ref.selection,
+    prefix = _ref.prefix,
+    _ref$suffix = _ref.suffix,
+    suffix = _ref$suffix === void 0 ? prefix : _ref$suffix;
   var result = selection;
   if (text && text.length && selection.start === selection.end) {
     result = getSurroundingWord(text, selection.start);
@@ -21,10 +20,8 @@ export function selectWord(_ref) {
   return result;
 }
 export function selectLine(_ref2) {
-  var {
-    text,
-    selection
-  } = _ref2;
+  var text = _ref2.text,
+    selection = _ref2.selection;
   var start = text.slice(0, selection.start).lastIndexOf('\n') + 1;
   var end = text.slice(selection.end).indexOf('\n') + selection.end;
   if (end === selection.end - 1) {
@@ -133,13 +130,12 @@ export function getSurroundingWord(text, position) {
   };
 }
 export function executeCommand(_ref3) {
-  var {
-    api,
-    selectedText,
-    selection,
-    prefix,
-    suffix = prefix
-  } = _ref3;
+  var api = _ref3.api,
+    selectedText = _ref3.selectedText,
+    selection = _ref3.selection,
+    prefix = _ref3.prefix,
+    _ref3$suffix = _ref3.suffix,
+    suffix = _ref3$suffix === void 0 ? prefix : _ref3$suffix;
   if (selectedText.length >= prefix.length + suffix.length && selectedText.startsWith(prefix) && selectedText.endsWith(suffix)) {
     api.replaceSelection(selectedText.slice(prefix.length, suffix.length ? -suffix.length : undefined));
     api.setSelectionRange({

package/lib/Editor.common.d.ts

@@ -0,0 +1,5 @@
+export type { RefMDEditor } from './Editor.factory';
+declare const _default: import("react").ForwardRefExoticComponent<import("./Types").MDEditorProps & import("react").RefAttributes<import("./Editor.factory").RefMDEditor>> & {
+    Markdown: import("react").ForwardRefExoticComponent<import("@uiw/react-markdown-preview/common").MarkdownPreviewProps & import("react").RefAttributes<import("@uiw/react-markdown-preview/common").MarkdownPreviewRef>>;
+};
+export default _default;

package/lib/Editor.common.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _common = _interopRequireDefault(require("@uiw/react-markdown-preview/common"));
+var _index = _interopRequireDefault(require("./components/TextArea/index.common"));
+var _Editor = require("./Editor.factory");
+var _default = exports["default"] = (0, _Editor.createMDEditor)({
+  MarkdownPreview: _common["default"],
+  TextArea: _index["default"]
+});
+module.exports = exports.default;

package/lib/Editor.d.ts

@@ -1,12 +1,5 @@
-import React from 'react';
-import MarkdownPreview from '@uiw/react-markdown-preview';
-import { type ContextStore } from './Context';
-import type { MDEditorProps } from './Types';
-export interface RefMDEditor extends ContextStore {
-}
-declare const InternalMDEditor: React.ForwardRefExoticComponent<MDEditorProps & React.RefAttributes<RefMDEditor>>;
-type EditorComponent = typeof InternalMDEditor & {
-    Markdown: typeof MarkdownPreview;
+export type { RefMDEditor } from './Editor.factory';
+declare const _default: import("react").ForwardRefExoticComponent<import("./Types").MDEditorProps & import("react").RefAttributes<import("./Editor.factory").RefMDEditor>> & {
+    Markdown: import("react").ForwardRefExoticComponent<import("@uiw/react-markdown-preview").MarkdownPreviewProps & import("react").RefAttributes<import("@uiw/react-markdown-preview").MarkdownPreviewRef>>;
 };
-declare const Editor: EditorComponent;
-export default Editor;
+export default _default;

package/lib/Editor.factory.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { type ContextStore } from './Context';
+import type { MDEditorProps } from './Types';
+export interface RefMDEditor extends ContextStore {
+}
+type PreviewComponent = React.ComponentType<any>;
+type TextAreaComponent = React.ComponentType<any>;
+export declare function createMDEditor<TMarkdownPreview extends PreviewComponent, TTextArea extends TextAreaComponent>(options: {
+    MarkdownPreview: TMarkdownPreview;
+    TextArea: TTextArea;
+}): React.ForwardRefExoticComponent<MDEditorProps & React.RefAttributes<RefMDEditor>> & {
+    Markdown: TMarkdownPreview;
+};
+export {};