@uiw/react-md-editor/lib/components/TextArea/Markdown.js

A markdown editor with preview, implemented with React.js and TypeScript.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = Markdown;
var _react = _interopRequireWildcard(require("react"));
var _rehype = require("rehype");
var _rehypePrismPlus = _interopRequireDefault(require("rehype-prism-plus"));
var _Context = require("../../Context");
var _jsxRuntime = require("react/jsx-runtime");
function html2Escape(sHtml) {
  return sHtml.replace(/```(tsx?|jsx?|html|xml)(.*)\s+([\s\S]*?)(\s.+)?```/g, function (str) {
    return str.replace(/[<&"]/g, function (c) {
      return {
        '<': '&lt;',
        '>': '&gt;',
        '&': '&amp;',
        '"': '&quot;'
      }[c];
    });
  }).replace(/[<&"]/g, function (c) {
    return {
      '<': '&lt;',
      '>': '&gt;',
      '&': '&amp;',
      '"': '&quot;'
    }[c];
  });
}
function Markdown(props) {
  var prefixCls = props.prefixCls;
  var _useContext = (0, _react.useContext)(_Context.EditorContext),
    _useContext$markdown = _useContext.markdown,
    markdown = _useContext$markdown === void 0 ? '' : _useContext$markdown,
    highlightEnable = _useContext.highlightEnable,
    dispatch = _useContext.dispatch;
  var preRef = /*#__PURE__*/_react["default"].createRef();
  (0, _react.useEffect)(function () {
    if (preRef.current && dispatch) {
      dispatch({
        textareaPre: preRef.current
      });
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  return (0, _react.useMemo)(function () {
    if (!markdown) {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)("pre", {
        ref: preRef,
        className: "".concat(prefixCls, "-text-pre wmde-markdown-color")
      });
    }
    var mdStr = "<pre class=\"language-markdown ".concat(prefixCls, "-text-pre wmde-markdown-color\"><code class=\"language-markdown\">").concat(html2Escape(markdown), "\n</code></pre>");
    if (highlightEnable) {
      try {
        mdStr = (0, _rehype.rehype)().data('settings', {
          fragment: true
        }).use(_rehypePrismPlus["default"], {
          ignoreMissing: true
        }).processSync(mdStr).toString();
      } catch (error) {}
    }
    return /*#__PURE__*/_react["default"].createElement('div', {
      className: 'wmde-markdown-color',
      dangerouslySetInnerHTML: {
        __html: mdStr || ''
      }
    });
  }, [markdown, preRef, prefixCls]);
}
module.exports = exports.default;
//# sourceMappingURL=Markdown.js.map