x-star-editor 0.3.1 → 0.3.2

package/dist/utils/handler.js

@@ -1,6 +1,6 @@
 import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
 import { createKeybindingsHandler } from 'tinykeys';
-import { createSelection, getRange } from "./container";
+import { createSelection } from "./container";
 
 /**
  * 处理函数上下文
@@ -116,56 +116,22 @@ export var getDefaultKeyboardEventHandlers = function getDefaultKeyboardEventHan
           type: 'redo'
         });
       },
-      ArrowLeft: function ArrowLeft(e) {
-        e.preventDefault();
-        var _getRange = getRange(selection),
-          startOffset = _getRange.startOffset,
-          endOffset = _getRange.endOffset;
-        if (startOffset < endOffset) {
-          dispatch({
-            type: 'select',
-            selection: createSelection(startOffset)
-          });
-        } else if (startOffset) {
-          dispatch({
-            type: 'select',
-            selection: createSelection(startOffset - 1)
-          });
-        }
-      },
-      'Shift+ArrowLeft': function ShiftArrowLeft(e) {
-        e.preventDefault();
+      ArrowRight: function ArrowRight(e) {
         var anchorOffset = selection.anchorOffset,
           focusOffset = selection.focusOffset;
-        if (focusOffset) {
+        if (anchorOffset === focusOffset && sourceCode[focusOffset] === '\n') {
+          e.preventDefault();
           dispatch({
             type: 'select',
-            selection: createSelection(anchorOffset, focusOffset - 1)
-          });
-        }
-      },
-      ArrowRight: function ArrowRight(e) {
-        e.preventDefault();
-        var _getRange2 = getRange(selection),
-          startOffset = _getRange2.startOffset,
-          endOffset = _getRange2.endOffset;
-        if (startOffset < endOffset) {
-          dispatch({
-            type: 'select',
-            selection: createSelection(endOffset)
-          });
-        } else if (startOffset < sourceCode.length) {
-          dispatch({
-            type: 'select',
-            selection: createSelection(startOffset + 1)
+            selection: createSelection(focusOffset + 1)
           });
         }
       },
       'Shift+ArrowRight': function ShiftArrowRight(e) {
-        e.preventDefault();
         var anchorOffset = selection.anchorOffset,
           focusOffset = selection.focusOffset;
-        if (focusOffset < sourceCode.length) {
+        if (sourceCode[focusOffset] === '\n') {
+          e.preventDefault();
           dispatch({
             type: 'select',
             selection: createSelection(anchorOffset, focusOffset + 1)

package/dist/utils/markdown.js

@@ -331,6 +331,9 @@ export var viewerRender = function viewerRender(root, schema) {
  */
 export var postViewerRender = function postViewerRender(root, options) {
   var components = _objectSpread(_objectSpread({}, options.customHTMLElements), {}, {
+    input: function input(props) {
+      return jsx('input', props);
+    },
     custom: function custom(props) {
       var _options$customBlocks;
       return jsx((_options$customBlocks = options.customBlocks[props.meta]) !== null && _options$customBlocks !== void 0 ? _options$customBlocks : 'div', {

package/dist/x-star-editor/index.d.ts

@@ -37,6 +37,10 @@ export interface XStarEditorProps {
      * 查看器属性
      */
     viewerProps?: Omit<XStarMdViewerProps, 'height' | 'value' | 'enableWebWorker'>;
+    /**
+     * 自定义查看器渲染函数
+     */
+    viewerRender?: (value: string) => React.ReactNode;
     /**
      * 文本变化回调函数
      */

package/dist/x-star-editor/index.js

@@ -6,17 +6,40 @@ import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';
 import { prefix } from "../utils/global";
 import XStarMdEditor, { useMdEditorRef } from "../x-star-md-editor";
 import XStarMdViewer, { useMdViewerRef } from "../x-star-md-viewer";
-var XStarEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
+var ViewerRenderWrapper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
     style = _ref.style,
-    height = _ref.height,
-    locale = _ref.locale,
-    initialValue = _ref.initialValue,
-    enableWebWorker = _ref.enableWebWorker,
-    editorProps = _ref.editorProps,
-    viewerProps = _ref.viewerProps,
-    _onChange = _ref.onChange,
-    onInsertFile = _ref.onInsertFile;
+    height = _ref.height;
+  var containerRef = useRef(null);
+  useImperativeHandle(ref, function () {
+    return {
+      getViewerContainer: function getViewerContainer() {
+        return containerRef.current;
+      }
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    className: classNames("".concat(prefix, "md-viewer"), className),
+    style: _objectSpread(_objectSpread({}, style), {}, {
+      height: height
+    })
+  }, children);
+});
+var XStarEditor = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
+  var className = _ref2.className,
+    style = _ref2.style,
+    height = _ref2.height,
+    locale = _ref2.locale,
+    _ref2$initialValue = _ref2.initialValue,
+    initialValue = _ref2$initialValue === void 0 ? '' : _ref2$initialValue,
+    enableWebWorker = _ref2.enableWebWorker,
+    editorProps = _ref2.editorProps,
+    viewerProps = _ref2.viewerProps,
+    viewerRender = _ref2.viewerRender,
+    _onChange = _ref2.onChange,
+    onInsertFile = _ref2.onInsertFile;
   var editorRef = useMdEditorRef();
   var viewerRef = useMdViewerRef();
   var containerRef = useRef(null);
@@ -94,10 +117,10 @@ var XStarEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       if (ignore || !editor || !viewer) {
         return;
       }
-      var _ref2 = e.currentTarget === editor ? [editor, viewer] : [viewer, editor],
-        _ref3 = _slicedToArray(_ref2, 2),
-        fromElement = _ref3[0],
-        toElement = _ref3[1];
+      var _ref3 = e.currentTarget === editor ? [editor, viewer] : [viewer, editor],
+        _ref4 = _slicedToArray(_ref3, 2),
+        fromElement = _ref4[0],
+        toElement = _ref4[1];
       var _getOffsetTops = getOffsetTops(fromElement, toElement),
         _getOffsetTops2 = _slicedToArray(_getOffsetTops, 2),
         fromOffsetTops = _getOffsetTops2[0],
@@ -149,7 +172,12 @@ var XStarEditor = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       _onChange === null || _onChange === void 0 ? void 0 : _onChange(value);
     },
     onInsertFile: onInsertFile
-  })), /*#__PURE__*/React.createElement(XStarMdViewer, _extends({
+  })), viewerRender ? /*#__PURE__*/React.createElement(ViewerRenderWrapper, {
+    ref: viewerRef,
+    className: viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.className,
+    style: viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.style,
+    height: height
+  }, viewerRender(value)) : /*#__PURE__*/React.createElement(XStarMdViewer, _extends({
     ref: viewerRef
   }, viewerProps, {
     height: height,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "x-star-editor",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "An editor developed by turingstar",
   "license": "MIT",
   "module": "dist/index.js",