ze-react-component-library/lib/components/TsEditor/index.js

ZeroETP React Component Library

"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _react = _interopRequireWildcard(require("react"));

var _reactAce = _interopRequireDefault(require("react-ace"));

var _hooks = require("@umijs/hooks");

var _FullscreenBtn = _interopRequireDefault(require("../FullscreenBtn"));

var _jsBeautify = _interopRequireDefault(require("js-beautify"));

require("ace-builds/src-noconflict/mode-typescript");

require("ace-builds/src-noconflict/theme-github");

require("ace-builds/src-noconflict/ext-language_tools");

var _aceBuilds = _interopRequireDefault(require("ace-builds"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var __assign = void 0 && (void 0).__assign || function () {
  __assign = Object.assign || function (t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];

      for (var p in s) {
        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
      }
    }

    return t;
  };

  return __assign.apply(this, arguments);
};

var __rest = void 0 && (void 0).__rest || function (s, e) {
  var t = {};

  for (var p in s) {
    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  }

  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};

_aceBuilds.default.config.setModuleUrl("ace/mode/typescript", require("file-loader?esModule=false!ace-builds/src-noconflict/mode-typescript.js"));

_aceBuilds.default.config.setModuleUrl("ace/theme/github", require("file-loader?esModule=false!ace-builds/src-noconflict/theme-github.js"));

_aceBuilds.default.config.setModuleUrl("ace/ext/language_tools", require("file-loader?esModule=false!ace-builds/src-noconflict/ext-language_tools.js"));

_aceBuilds.default.config.setModuleUrl("ace/snippets/javascript", require("file-loader?esModule=false!ace-builds/src-noconflict/snippets/javascript.js"));

var BeautifyOptions = {
  indent_size: 2
};
var TsEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
  var _b = _a.name,
      name = _b === void 0 ? "ze-ts-editor" : _b,
      _c = _a.autoFoldFirstLine,
      autoFoldFirstLine = _c === void 0 ? true : _c,
      restProps = __rest(_a, ["name", "autoFoldFirstLine"]);

  var editorRef = (0, _react.useRef)();
  var rootRef = (0, _react.useRef)(null);
  var fullscreenProps = (0, _hooks.useFullscreen)({
    dom: function dom() {
      return rootRef.current;
    }
  });
  var isFullscreen = fullscreenProps.isFullscreen;
  (0, _react.useEffect)(function () {
    var _a;

    var session = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.getSession();

    if (session && autoFoldFirstLine) {
      //@ts-ignore 默认第一层折叠起来
      session.foldAll(1, undefined, 0);
    }
  }, [autoFoldFirstLine]);
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "ze-ts-editor",
    style: {
      padding: isFullscreen ? 24 : 0,
      background: "white"
    },
    ref: rootRef
  }, /*#__PURE__*/_react.default.createElement("div", {
    style: {
      position: "relative"
    }
  }, /*#__PURE__*/_react.default.createElement(_reactAce.default, __assign({
    ref: ref,
    mode: "typescript",
    theme: "github",
    name: name,
    showPrintMargin: true,
    showGutter: true,
    highlightActiveLine: true,
    onLoad: function onLoad(editor) {
      editorRef.current = editor;
    },
    commands: [{
      name: "beautify",
      bindKey: {
        win: "Ctrl-shift-F",
        mac: "Ctrl-shift-F"
      },
      exec: function exec() {
        var _a;

        var session = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.getSession();

        if (session) {
          session.setValue((0, _jsBeautify.default)(session.getValue(), BeautifyOptions));
        }
      }
    }],
    setOptions: {
      enableBasicAutocompletion: true,
      enableLiveAutocompletion: true,
      enableSnippets: true,
      showLineNumbers: true,
      tabSize: 2
    }
  }, restProps, {
    height: isFullscreen ? "calc(100vh - 48px)" : restProps === null || restProps === void 0 ? void 0 : restProps.height
  })), /*#__PURE__*/_react.default.createElement(_FullscreenBtn.default, __assign({}, fullscreenProps))));
});
var _default = TsEditor;
exports.default = _default;