amis-theme-editor/lib/renderers/ThemeWrapper.js

amis主题编辑器

/**
 * amis-theme-editor v2.0.22-beta.2
 * Copyright 2018-2023 @fex
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib = require('tslib');
var React = require('react');
var amis = require('amis');
require('../icons/index.js');
var cx = require('classnames');
var lodash = require('lodash');
var amisUi = require('amis-ui');
var i18nRuntime = require('i18n-runtime');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);

/**
 * @file ThemeWrapper.tsx
 * @description 收缩展开容器
 */
function ThemeWrapperHeader(props) {
  var hasSenior = props.hasSenior,
    hasOpen = props.hasOpen,
    senior = props.senior,
    toggleSenior = props.toggleSenior,
    open = props.open,
    toggleOpen = props.toggleOpen,
    title = props.title;
  return React__default["default"].createElement("div", {
    className: "Theme-Wrapper"
  }, React__default["default"].createElement("div", {
    className: "Theme-Wrapper-header"
  }, React__default["default"].createElement("div", {
    className: "Theme-Wrapper-header-left"
  }, title), React__default["default"].createElement("div", {
    className: "Theme-Wrapper-header-right"
  }, hasSenior && React__default["default"].createElement(amisUi.TooltipWrapper, {
    tooltip: i18nRuntime.i18n("e4e625f8f933ccfd0fe44a41fb02655f"),
    tooltipTheme: "dark",
    placement: "left"
  }, React__default["default"].createElement(amis.Icon, {
    icon: "custom",
    className: "common-icon",
    onClick: function () {
      return toggleSenior && toggleSenior(!senior);
    }
  })), hasOpen && React__default["default"].createElement(amis.Icon, {
    icon: "right-arrow-bold",
    className: cx__default["default"]('arrow-icon', open ? 'arrow-icon-reverse' : ''),
    onClick: function () {
      return toggleOpen && toggleOpen(!open);
    }
  }))));
}
function ThemeWrapperControl(props) {
  var _a = props.hasSenior,
    hasSenior = _a === void 0 ? false : _a,
    _b = props.hasOpen,
    hasOpen = _b === void 0 ? false : _b,
    body = props.body,
    seniorBody = props.seniorBody,
    title = props.title;
  var _c = React__default["default"].useState(true),
    open = _c[0],
    toggleOpen = _c[1];
  var _d = React__default["default"].useState(false),
    senior = _d[0],
    toggleSenior = _d[1];
  var bodyProps = lodash.pick(props, ['data', 'formMode', 'formLabelAlign', 'formLabelWidth', 'formHorizontal', 'onChange']);
  return React__default["default"].createElement("div", {
    className: "Theme-Wrapper"
  }, title || title === '' ? React__default["default"].createElement(ThemeWrapperHeader, {
    hasSenior: hasSenior,
    hasOpen: hasOpen,
    senior: senior,
    toggleSenior: toggleSenior,
    open: open,
    toggleOpen: toggleOpen,
    title: title
  }) : null, React__default["default"].createElement("div", {
    className: "Theme-Wrapper-body",
    style: {
      display: open ? 'block' : 'none'
    }
  }, body ? amis.render(body, bodyProps) : null, React__default["default"].createElement("div", {
    className: "Theme-Wrapper-senior",
    style: {
      display: senior ? 'block' : 'none'
    }
  }, seniorBody ? amis.render(seniorBody, bodyProps) : null)));
}
/** @class */(function (_super) {
  tslib.__extends(ThemeWrapperRenderer, _super);
  function ThemeWrapperRenderer() {
    return _super !== null && _super.apply(this, arguments) || this;
  }
  Object.defineProperty(ThemeWrapperRenderer.prototype, "render", {
    enumerable: false,
    configurable: true,
    writable: true,
    value: function () {
      return React__default["default"].createElement(ThemeWrapperControl, tslib.__assign({}, this.props));
    }
  });
  ThemeWrapperRenderer = tslib.__decorate([amis.Renderer({
    type: 'amis-theme-wrapper'
  })], ThemeWrapperRenderer);
  return ThemeWrapperRenderer;
})(React__default["default"].Component);

exports.ThemeWrapperHeader = ThemeWrapperHeader;