amis-editor 5.2.3-beta.16 → 5.2.3

package/esm/renderer/style-control/ThemeClassName.js

@@ -0,0 +1,228 @@
+/**
+ * amis-editor v5.2.3
+ * Copyright 2018-2023 @fex
+ */
+
+import { __extends, __assign, __decorate } from 'tslib';
+import React__default, { useRef, useState, useEffect } from 'react';
+import { Button, Icon, Overlay, PopOver, Editor } from 'amis-ui';
+import { FormItem, render } from 'amis-core';
+import { parse } from 'amis-postcss';
+import { debounce } from 'lodash';
+import { i18n } from 'i18n-runtime';
+
+var valueMap = {
+  'margin-top': 'marginTop',
+  'margin-right': 'marginRight',
+  'margin-bottom': 'marginBottom',
+  'margin-left': 'marginLeft',
+  'padding-top': 'paddingTop',
+  'padding-right': 'paddingRight',
+  'padding-bottom': 'paddingBottom',
+  'padding-left': 'paddingLeft',
+  'border-top-width': 'top-border-width',
+  'border-right-width': 'right-border-width',
+  'border-bottom-width': 'bottom-border-width',
+  'border-left-width': 'left-border-width',
+  'border-top-style': 'top-border-style',
+  'border-right-style': 'right-border-style',
+  'border-bottom-style': 'bottom-border-style',
+  'border-left-style': 'left-border-style',
+  'border-top-color': 'top-border-color',
+  'border-right-color': 'right-border-color',
+  'border-bottom-color': 'bottom-border-color',
+  'border-left-color': 'left-border-color',
+  'font-size': 'fontSize',
+  'font-weight': 'fontWeight',
+  'line-height': 'lineHeight'
+};
+var fontStyle = ['color', 'font-weight', 'font-size', 'font-style', 'text-decoration', 'text-align', 'vertical-align', 'font-family', 'line-height'];
+function AmisStyleCodeEditor(props) {
+  var name = props.name,
+    classname = props.value,
+    suffix = props.suffix;
+  var _a = useState(''),
+    value = _a[0],
+    setValue = _a[1];
+  function getCssAndSetValue(classname, name, suffix) {
+    try {
+      var id = (classname === null || classname === void 0 ? void 0 : classname.replace(name + '-', '')) + (suffix ? '-' + suffix : '');
+      var dom = document.getElementById(id || '') || null;
+      var content = (dom === null || dom === void 0 ? void 0 : dom.innerHTML) || '';
+      var ast = parse(content);
+      var nodes_1 = [];
+      ast.nodes.forEach(function (node) {
+        var selector = node.selector;
+        if (!selector.endsWith('.hover') && !selector.endsWith('.active')) {
+          nodes_1.push(node);
+        }
+      });
+      ast.nodes = nodes_1;
+      var css = nodes_1.map(function (node) {
+        var style = node.nodes.map(function (n) {
+          return "".concat(n.prop, ": ").concat(n.value, ";");
+        });
+        return "".concat(node.selector, " {\n  ").concat(style.join('\n  '), "\n}");
+      }).join('\n\n');
+      setValue(css);
+    } catch (error) {
+      console.error(error);
+    }
+  }
+  useEffect(function () {
+    getCssAndSetValue(classname, name, suffix);
+  }, []);
+  function handleChange(value) {
+    setValue(value);
+    editorChange(value);
+  }
+  var editorChange = debounce(function (value) {
+    var _a;
+    try {
+      var ast = parse(value);
+      var data = props.data,
+        onBulkChange = props.onBulkChange,
+        name_1 = props.name;
+      var sourceCss = data.css || {};
+      var className_1 = {};
+      ast.nodes.forEach(function (node) {
+        var nodes = node.nodes;
+        var selector = node.selector;
+        var state = 'default';
+        if (!!~selector.indexOf(':hover:active')) {
+          state = 'active';
+        } else if (!!~selector.indexOf(':hover')) {
+          state = 'hover';
+        }
+        nodes.forEach(function (item) {
+          var prop = item.prop;
+          var cssValue = item.value;
+          if (!!~prop.indexOf('radius')) {
+            var type = 'radius:' + state;
+            !className_1[type] && (className_1[type] = {});
+            var radius = cssValue.split(' ');
+            className_1[type]['top-left-border-radius'] = radius[0];
+            className_1[type]['top-right-border-radius'] = radius[1];
+            className_1[type]['bottom-right-border-radius'] = radius[2];
+            className_1[type]['bottom-left-border-radius'] = radius[3];
+          } else if (!!~prop.indexOf('border')) {
+            !className_1['border:' + state] && (className_1['border:' + state] = {});
+            className_1['border:' + state][valueMap[prop] || prop] = cssValue;
+          } else if (!!~prop.indexOf('padding') || !!~prop.indexOf('margin')) {
+            !className_1['padding-and-margin:' + state] && (className_1['padding-and-margin:' + state] = {});
+            className_1['padding-and-margin:' + state][valueMap[prop] || prop] = cssValue;
+          } else if (fontStyle.includes(prop)) {
+            !className_1['font:' + state] && (className_1['font:' + state] = {});
+            className_1['font:' + state][valueMap[prop] || prop] = cssValue;
+          } else {
+            className_1[(valueMap[prop] || prop) + ':' + state] = cssValue;
+          }
+        });
+      });
+      var newCss = __assign(__assign({}, sourceCss), (_a = {}, _a[name_1] = className_1, _a));
+      onBulkChange && onBulkChange({
+        css: newCss
+      });
+    } catch (error) {
+      console.error(error);
+    }
+  });
+  return React__default.createElement("div", {
+    className: "ThemeClassName-editor"
+  }, React__default.createElement("div", {
+    className: "ThemeClassName-editor-title"
+  }, "\u81EA\u5B9A\u4E49\u6837\u5F0F\u6E90\u7801"), React__default.createElement("div", {
+    className: "ThemeClassName-editor-close"
+  }, React__default.createElement(Button, {
+    onClick: props.onHide,
+    level: "link"
+  }, React__default.createElement(Icon, {
+    icon: "close",
+    className: "icon"
+  }))), React__default.createElement("div", {
+    className: "ThemeClassName-editor-content"
+  }, React__default.createElement(Editor, {
+    value: value,
+    language: "css",
+    onChange: handleChange,
+    options: {
+      automaticLayout: true,
+      lineNumbers: 'off',
+      glyphMargin: false,
+      tabSize: 2,
+      wordWrap: 'on',
+      lineDecorationsWidth: 0,
+      lineNumbersMinChars: 0,
+      selectOnLineNumbers: true,
+      scrollBeyondLastLine: false,
+      folding: true,
+      minimap: {
+        enabled: false
+      }
+    }
+  })));
+}
+function ThemeClassName(props) {
+  var ref = useRef(null);
+  var value = props.value;
+  var _a = useState(false),
+    showEditor = _a[0],
+    setShowEditor = _a[1];
+  function handleShowEditor() {
+    setShowEditor(true);
+  }
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+    ref: ref,
+    className: "ThemeClassName"
+  }, React__default.createElement(Button, {
+    onClick: handleShowEditor,
+    level: "link",
+    className: ":ThemeClassName-button"
+  }, React__default.createElement(Icon, {
+    icon: "file",
+    className: "icon"
+  })), render({
+    type: 'input-tag',
+    name: 'class',
+    placeholder: i18n("ec8f3e4a298160dface2fda5c0125df2"),
+    delimiter: ' ',
+    value: value,
+    onChange: function (value) {
+      props.onChange && props.onChange(value);
+    }
+  })), React__default.createElement(Overlay, {
+    container: document.body,
+    placement: "left",
+    target: ref.current,
+    show: showEditor,
+    rootClose: false
+  }, React__default.createElement(PopOver, {
+    overlay: true,
+    onHide: function () {
+      return setShowEditor(false);
+    }
+  }, React__default.createElement(AmisStyleCodeEditor, __assign({}, props, {
+    onHide: function () {
+      return setShowEditor(false);
+    }
+  })))));
+}
+/** @class */(function (_super) {
+  __extends(BorderRenderer, _super);
+  function BorderRenderer() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+  Object.defineProperty(BorderRenderer.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      return React__default.createElement(ThemeClassName, __assign({}, this.props));
+    }
+  });
+  BorderRenderer = __decorate([FormItem({
+    type: 'theme-classname',
+    strictMode: false
+  })], BorderRenderer);
+  return BorderRenderer;
+})(React__default.Component);

package/esm/renderer/style-control/font-family.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/style-control/transformation.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/textarea-formula/FormulaPicker.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/textarea-formula/TextareaFormulaControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/textarea-formula/plugin.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/renderer/textarea-formula/utils.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/tpl/api.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/tpl/common.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 
@@ -517,6 +517,20 @@ setSchemaTpl('className', function (schema) {
     label: tipedLabel((schema === null || schema === void 0 ? void 0 : schema.label) || i18n("4434b33a8731a73613ba5fa1eb984efb"), i18n("7080fa6e0ca1d7e24f6f8cac05077a3a"))
   });
 });
+setSchemaTpl('onlyClassNameTab', function (label) {
+  if (label === void 0) {
+    label = i18n("5e5d3f13111593b2710673006d4c8297");
+  }
+  return {
+    title: i18n("afcde2611bdd13c1e65b4fb6a2f13425"),
+    body: getSchemaTpl('collapseGroup', [{
+      title: i18n("261bba7ad82914e477f4b37f6a83874e"),
+      body: [getSchemaTpl('className', {
+        label: label
+      })]
+    }])
+  };
+});
 /**
  * combo 组件样式包装调整
  */
@@ -537,56 +551,6 @@ setSchemaTpl('combo-container', function (config) {
   }
   return config;
 });
-setSchemaTpl('texts', getSchemaTpl('combo-container', {
-  type: 'combo',
-  label: i18n("3bdd08adab6ea90b9164b20a0e4151ac"),
-  mode: 'normal',
-  name: 'texts',
-  items: [{
-    placeholder: 'Key',
-    type: 'input-number',
-    unique: true,
-    name: 'key',
-    columnClassName: 'w-xs flex-none',
-    min: 0,
-    step: 1,
-    max: 10,
-    precision: 0
-  }, {
-    placeholder: i18n("1a10cd6599219eafb615b34234cfc0b5"),
-    type: 'input-text',
-    name: 'value'
-  }]
-}));
-setSchemaTpl('unitOptions', getSchemaTpl('combo-container', {
-  type: 'combo',
-  label: i18n("7915dcc78c28ed3cda8fc949a86e4806"),
-  mode: 'normal',
-  name: 'unitOptions',
-  flat: true,
-  items: [{
-    placeholder: i18n("7915dcc78c28ed3cda8fc949a86e4806"),
-    type: 'input-text',
-    name: 'text'
-  }],
-  draggable: false,
-  multiple: true,
-  pipeIn: function (value) {
-    if (!isObject(value)) {
-      return Array.isArray(value) ? value : [];
-    }
-    var res = value.map(function (item) {
-      return item.value;
-    });
-    return res;
-  },
-  pipeOut: function (value) {
-    if (!value.length) {
-      return undefined;
-    }
-    return value;
-  }
-}));
 /**
  * 所有组件的状态
  */
@@ -1055,7 +1019,7 @@ setSchemaTpl('optionsTip', {
   label: i18n("9888468550779b1777260b8fafe6abc2"),
   value: i18n("a2cbb42e488dffe644bdb87c26afbc07")
 });
-setSchemaTpl('remark', {
+setSchemaTpl('tableCellRemark', {
   name: 'remark',
   label: i18n("02d9819ddaaaeb1b7b22b12608c7e5ca"),
   type: 'input-text',
@@ -1262,20 +1226,6 @@ setSchemaTpl('tablePlaceholder', {
   type: 'input-text',
   label: i18n("35ba83e053cef95e55dfffde279822b5")
 });
-setSchemaTpl('collapseHeader', function (context) {
-  var _a, _b;
-  return {
-    name: 'header',
-    label: i18n("32c65d8d7431e76029678ec7bb73a5ab"),
-    type: 'input-text',
-    pipeIn: defaultValue(((_a = context === null || context === void 0 ? void 0 : context.schema) === null || _a === void 0 ? void 0 : _a.title) || ((_b = context === null || context === void 0 ? void 0 : context.schema) === null || _b === void 0 ? void 0 : _b.header) || ''),
-    onChange: function (value, oldValue, model, form) {
-      // 转换一下旧版本的title字段
-      form.setValueByName('header', value);
-      form.setValueByName('title', undefined);
-    }
-  };
-});
 setSchemaTpl('collapseOpenHeader', {
   name: 'collapseHeader',
   label: tipedLabel(i18n("81d2b9f20fb2083c75a5b052b84e897a"), i18n("7349194c139069b32889101768aa7428")),
@@ -1306,7 +1256,7 @@ setSchemaTpl('tpl:btnLabel', {
   tpl: '<span class="label label-success">${label}</span>',
   columnClassName: 'p-t-xs'
 });
-setSchemaTpl('option', {
+setSchemaTpl('switchOption', {
   type: 'input-text',
   name: 'option',
   label: i18n("f411d0f1f925d9b48d8c1d451bd809b1")

package/esm/tpl/horizontal.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/tpl/layout.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/tpl/options.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 
@@ -279,6 +279,15 @@ setSchemaTpl('optionControlV2', {
   type: 'ae-optionControl',
   closeDefaultCheck: true // 关闭默认值设置
 });
+/**
+ * mapping组件映射源
+ */
+setSchemaTpl('mapSourceControl', {
+  type: 'ae-mapSourceControl',
+  label: i18n("8b139ce9fa196b602bb1ee3bd25b25df"),
+  mode: 'normal',
+  name: 'source'
+});
 /**
  * 时间轴组件选项控件
  */

package/esm/tpl/style.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 
@@ -352,3 +352,190 @@ setSchemaTpl('style:widthHeight', function (option) {
     }]
   }]
 });
+/**
+ * 新版主题
+ */
+// css类名
+setSchemaTpl('theme:classNames', function (config) {
+  var _a = config || {},
+    _b = _a.isFormItem,
+    isFormItem = _b === void 0 ? true : _b;
+    _a.unsupportStatic;
+    var _d = _a.schema,
+    schema = _d === void 0 ? [] : _d;
+  return {
+    title: i18n("4434b33a8731a73613ba5fa1eb984efb"),
+    body: (isFormItem ? [{
+      type: 'theme-classname',
+      label: 'Label',
+      suffix: 'label',
+      name: 'labelClassName'
+    }, {
+      type: 'theme-classname',
+      label: i18n("3bdd08adab6ea90b9164b20a0e4151ac"),
+      suffix: 'description',
+      name: 'descriptionClassName',
+      visibleOn: 'this.description'
+    }] : [{
+      type: 'theme-classname',
+      label: i18n("5e5d3f13111593b2710673006d4c8297"),
+      name: 'className'
+    }]).concat(schema)
+  };
+});
+// form label
+setSchemaTpl('theme:form-label', function () {
+  return {
+    title: i18n("7e8eb474f73b6fd60c9aa5082f75e008"),
+    body: [getSchemaTpl('theme:font', {
+      label: i18n("ca746b1ff10193a3ce20878dec04a733"),
+      name: 'css.labelClassName.font'
+    }), getSchemaTpl('theme:paddingAndMargin', {
+      name: 'css.labelClassName.padding-and-margin'
+    })]
+  };
+});
+// form description
+setSchemaTpl('theme:form-description', function () {
+  return {
+    title: i18n("ef55ff12fb0d3efa3491236fee4dabc2"),
+    visibleOn: 'this.description',
+    body: [getSchemaTpl('theme:font', {
+      label: i18n("ca746b1ff10193a3ce20878dec04a733"),
+      name: 'css.descriptionClassName.font'
+    }), getSchemaTpl('theme:paddingAndMargin', {
+      name: 'css.descriptionClassName.padding-and-margin'
+    })]
+  };
+});
+// 文字编辑器
+setSchemaTpl('theme:font', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    mode: 'default',
+    type: 'amis-theme-font-editor',
+    label: i18n("ca746b1ff10193a3ce20878dec04a733"),
+    name: "css.className.font",
+    needColorCustom: true
+  }, option);
+});
+// 颜色选择器
+setSchemaTpl('theme:colorPicker', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    mode: 'default',
+    type: 'amis-theme-color-picker',
+    label: i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
+    name: "css.className.color",
+    needCustom: true
+  }, option);
+});
+// 边框选择器
+setSchemaTpl('theme:border', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    mode: 'default',
+    type: 'amis-theme-border',
+    label: i18n("961534b4ea37e4e88aada736b299d063"),
+    name: "css.className.border",
+    needColorCustom: true
+  }, option);
+});
+// 边距选择器
+setSchemaTpl('theme:paddingAndMargin', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    mode: 'default',
+    type: 'amis-theme-padding-and-margin',
+    label: i18n("e8ed49e9fde0bb778e2185876c2d2697"),
+    name: "css.className.padding-and-margin"
+  }, option);
+});
+// 圆角选择器
+setSchemaTpl('theme:radius', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    mode: 'default',
+    type: 'amis-theme-radius',
+    label: i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
+    name: "css.className.radius"
+  }, option);
+});
+// 阴影选择器
+setSchemaTpl('theme:shadow', function (option) {
+  if (option === void 0) {
+    option = {};
+  }
+  return __assign({
+    type: 'amis-theme-shadow-editor',
+    label: false,
+    name: "css.className.boxShadow",
+    hasSenior: true
+  }, option);
+});
+setSchemaTpl('theme:common', function (exclude, include) {
+  // key统一转换成Kebab case，eg: boxShadow => bos-shadow
+  exclude = (exclude ? Array.isArray(exclude) ? exclude : [exclude] : []).map(function (key) {
+    return kebabCase(key);
+  });
+  include = (include ? Array.isArray(include) ? include : [include] : []).map(function (key) {
+    return kebabCase(key);
+  });
+  return [{
+    header: i18n("5aefca559c5a41d10078e21e6d616825"),
+    key: 'layout',
+    body: [{
+      type: 'style-display',
+      label: false,
+      name: 'style'
+    }].filter(function (comp) {
+      return !~exclude.indexOf(comp.type.replace(/^style-/i, ''));
+    })
+  }, {
+    header: i18n("39003734d1d700d5bd97bf1e7a2fcf73"),
+    key: 'style',
+    body: [getSchemaTpl('theme:border', {
+      name: 'style'
+    }), getSchemaTpl('theme:radius', {
+      name: 'style.radius'
+    }), getSchemaTpl('theme:paddingAndMargin', {
+      name: 'style'
+    }), getSchemaTpl('theme:colorPicker', {
+      name: 'style.background',
+      label: i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
+      needCustom: true,
+      needGradient: true,
+      labelMode: 'input'
+    }), getSchemaTpl('theme:shadow', {
+      name: 'style.boxShadow'
+    })]
+  }, {
+    header: i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
+    key: 'radius',
+    body: []
+  }, {
+    header: i18n("60bac4c0a381a42b320a703227be59eb"),
+    key: 'box-model',
+    body: []
+  }, {
+    header: i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
+    key: 'background',
+    body: []
+  }, {
+    header: i18n("803205e38834280d9e6a75993ac00764"),
+    key: 'box-shadow',
+    body: []
+  }].filter(function (item) {
+    return include.length ? ~include.indexOf(item.key) : !~exclude.indexOf(item.key);
+  });
+});

package/esm/tpl/validations.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/util.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/esm/validator.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/lib/component/BaseControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/lib/component/InputComponentName.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */
 

package/lib/component/TableViewEditor.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.3-beta.15
+ * amis-editor v5.2.3
  * Copyright 2018-2023 @fex
  */