ze-react-component-library/es/components/LogicformEditor/index.js

ZeroETP React Component Library

import "antd/es/button/style";
import _Button from "antd/es/button";
import React, { useRef, useState } from "react";
import _ from "underscore";
import CodeViewer from "../CodeViewer";
import ZEJsonEditor from "../../ZEJsonEditor";
import "./index.less";

var LogicformEditor = function LogicformEditor(_a) {
  var value = _a.value,
      onChange = _a.onChange;

  var _b = useState(false),
      editing = _b[0],
      setEditing = _b[1];

  var editorRef = useRef();
  return /*#__PURE__*/React.createElement(React.Fragment, null, editing ? /*#__PURE__*/React.createElement("div", {
    className: "ze-card-logicform-editor"
  }, /*#__PURE__*/React.createElement(ZEJsonEditor, {
    value: value,
    mode: "code",
    modes: ["code"],
    editable: true,
    editorRef: editorRef
  }), /*#__PURE__*/React.createElement("div", {
    className: "ze-card-logicform-editor-submitter"
  }, /*#__PURE__*/React.createElement(_Button, {
    type: "primary",
    onClick: function onClick() {
      var _a;

      try {
        var newValue = (_a = editorRef === null || editorRef === void 0 ? void 0 : editorRef.current) === null || _a === void 0 ? void 0 : _a.get();
        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
        setEditing(false);
      } catch (error) {
        console.log(error);
      }
    }
  }, "\u786E\u5B9A"), /*#__PURE__*/React.createElement(_Button, {
    onClick: function onClick() {
      setEditing(false);
    }
  }, "\u53D6\u6D88"))) : /*#__PURE__*/React.createElement(CodeViewer, {
    language: "json",
    editable: true,
    onEditIconClick: function onEditIconClick() {
      setEditing(true);
    },
    code: JSON.stringify(_.omit(value, function (_value, key) {
      return key.startsWith("_");
    }), null, 2)
  }));
};

export default LogicformEditor;