npm - amis-editor - Versions diffs - 5.2.5-beta.6 → 5.2.5-beta.7 - Mend

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-beta.6
+ * amis-editor v5.2.5-alpha.12
  * Copyright 2018-2023 @fex
  */
@@ -362,31 +362,30 @@ amisEditorCore.setSchemaTpl('style:widthHeight', function (option) {
  * 新版主题
  */
 // css类名
-amisEditorCore.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: i18nRuntime.i18n("4434b33a8731a73613ba5fa1eb984efb"),
-    body: (isFormItem ? [{
-      type: 'theme-classname',
-      label: 'Label',
-      suffix: 'label',
-      name: 'labelClassName'
+amisEditorCore.setSchemaTpl('theme:cssCode', function (_a) {
+  var _b = _a === void 0 ? {} : _a,
+    _c = _b.themeClass,
+    themeClass = _c === void 0 ? [] : _c,
+    isFormItem = _b.isFormItem;
+    _b.isLayout;
+  if (isFormItem) {
+    themeClass.push.apply(themeClass, [{
+      name: 'description',
+      value: 'description',
+      className: 'descriptionClassName'
     }, {
-      type: 'theme-classname',
-      label: i18nRuntime.i18n("3bdd08adab6ea90b9164b20a0e4151ac"),
-      suffix: 'description',
-      name: 'descriptionClassName',
-      visibleOn: 'this.description'
-    }] : [{
-      type: 'theme-classname',
-      label: i18nRuntime.i18n("5e5d3f13111593b2710673006d4c8297"),
-      name: 'className'
-    }]).concat(schema)
+      name: 'label',
+      value: 'label',
+      className: 'labelClassName'
+    }]);
+  }
+  return {
+    title: '样式源码',
+    body: [{
+      type: 'theme-cssCode',
+      label: false,
+      themeClass: themeClass
+    }]
   };
 });
 // form label
@@ -395,9 +394,10 @@ amisEditorCore.setSchemaTpl('theme:form-label', function () {
     title: i18nRuntime.i18n("7e8eb474f73b6fd60c9aa5082f75e008"),
     body: [amisEditorCore.getSchemaTpl('theme:font', {
       label: i18nRuntime.i18n("ca746b1ff10193a3ce20878dec04a733"),
-      name: 'css.labelClassName.font'
+      name: 'themeCss.labelClassName.font:default',
+      editorThemePath: 'form.item.default.label.body.font'
     }), amisEditorCore.getSchemaTpl('theme:paddingAndMargin', {
-      name: 'css.labelClassName.padding-and-margin'
+      name: 'themeCss.labelClassName.padding-and-margin:default'
     })]
   };
 });
@@ -408,9 +408,10 @@ amisEditorCore.setSchemaTpl('theme:form-description', function () {
     visibleOn: 'this.description',
     body: [amisEditorCore.getSchemaTpl('theme:font', {
       label: i18nRuntime.i18n("ca746b1ff10193a3ce20878dec04a733"),
-      name: 'css.descriptionClassName.font'
+      name: 'themeCss.descriptionClassName.font:default',
+      editorThemePath: 'form.item.default.description.body.font'
     }), amisEditorCore.getSchemaTpl('theme:paddingAndMargin', {
-      name: 'css.descriptionClassName.padding-and-margin'
+      name: 'themeCss.descriptionClassName.padding-and-margin:default'
     })]
   };
 });
@@ -423,7 +424,7 @@ amisEditorCore.setSchemaTpl('theme:font', function (option) {
     mode: 'default',
     type: 'amis-theme-font-editor',
     label: i18nRuntime.i18n("ca746b1ff10193a3ce20878dec04a733"),
-    name: "css.className.font",
+    name: "themeCss.className.font:default",
     needColorCustom: true
   }, option);
 });
@@ -436,7 +437,7 @@ amisEditorCore.setSchemaTpl('theme:colorPicker', function (option) {
     mode: 'default',
     type: 'amis-theme-color-picker',
     label: i18nRuntime.i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
-    name: "css.className.color",
+    name: "themeCss.className.color:default",
     needCustom: true
   }, option);
 });
@@ -449,7 +450,7 @@ amisEditorCore.setSchemaTpl('theme:border', function (option) {
     mode: 'default',
     type: 'amis-theme-border',
     label: i18nRuntime.i18n("961534b4ea37e4e88aada736b299d063"),
-    name: "css.className.border",
+    name: "themeCss.className.border:default",
     needColorCustom: true
   }, option);
 });
@@ -462,7 +463,7 @@ amisEditorCore.setSchemaTpl('theme:paddingAndMargin', function (option) {
     mode: 'default',
     type: 'amis-theme-padding-and-margin',
     label: i18nRuntime.i18n("e8ed49e9fde0bb778e2185876c2d2697"),
-    name: "css.className.padding-and-margin"
+    name: "themeCss.className.padding-and-margin:default"
   }, option);
 });
 // 圆角选择器
@@ -474,7 +475,7 @@ amisEditorCore.setSchemaTpl('theme:radius', function (option) {
     mode: 'default',
     type: 'amis-theme-radius',
     label: i18nRuntime.i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
-    name: "css.className.radius"
+    name: "themeCss.className.radius:default"
   }, option);
 });
 // 阴影选择器
@@ -485,7 +486,7 @@ amisEditorCore.setSchemaTpl('theme:shadow', function (option) {
   return tslib.__assign({
     type: 'amis-theme-shadow-editor',
     label: false,
-    name: "css.className.boxShadow",
+    name: "themeCss.className.boxShadow:default",
     hasSenior: true
   }, option);
 });
@@ -494,9 +495,26 @@ amisEditorCore.setSchemaTpl('theme:common', function (exclude, include) {
   exclude = (exclude ? Array.isArray(exclude) ? exclude : [exclude] : []).map(function (key) {
     return kebabCase__default["default"](key);
   });
-  include = (include ? Array.isArray(include) ? include : [include] : []).map(function (key) {
-    return kebabCase__default["default"](key);
-  });
+  var moreStyle = (include === null || include === void 0 ? void 0 : include.map(function (key) {
+    return amisEditorCore.getSchemaTpl("theme:".concat(key), {
+      name: 'style'
+    });
+  })) || [];
+  var styles = moreStyle.concat([amisEditorCore.getSchemaTpl('theme:border', {
+    name: 'style'
+  }), amisEditorCore.getSchemaTpl('theme:radius', {
+    name: 'style.radius'
+  }), amisEditorCore.getSchemaTpl('theme:paddingAndMargin', {
+    name: 'style'
+  }), amisEditorCore.getSchemaTpl('theme:colorPicker', {
+    name: 'style.background',
+    label: i18nRuntime.i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
+    needCustom: true,
+    needGradient: true,
+    labelMode: 'input'
+  }), amisEditorCore.getSchemaTpl('theme:shadow', {
+    name: 'style.boxShadow'
+  })]);
   return [{
     header: i18nRuntime.i18n("5aefca559c5a41d10078e21e6d616825"),
     key: 'layout',
@@ -508,40 +526,16 @@ amisEditorCore.setSchemaTpl('theme:common', function (exclude, include) {
       return !~exclude.indexOf(comp.type.replace(/^style-/i, ''));
     })
   }, {
-    header: i18nRuntime.i18n("39003734d1d700d5bd97bf1e7a2fcf73"),
-    key: 'style',
-    body: [amisEditorCore.getSchemaTpl('theme:border', {
-      name: 'style'
-    }), amisEditorCore.getSchemaTpl('theme:radius', {
-      name: 'style.radius'
-    }), amisEditorCore.getSchemaTpl('theme:paddingAndMargin', {
-      name: 'style'
-    }), amisEditorCore.getSchemaTpl('theme:colorPicker', {
-      name: 'style.background',
-      label: i18nRuntime.i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
-      needCustom: true,
-      needGradient: true,
-      labelMode: 'input'
-    }), amisEditorCore.getSchemaTpl('theme:shadow', {
-      name: 'style.boxShadow'
-    })]
-  }, {
-    header: i18nRuntime.i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
-    key: 'radius',
-    body: []
-  }, {
-    header: i18nRuntime.i18n("60bac4c0a381a42b320a703227be59eb"),
-    key: 'box-model',
-    body: []
-  }, {
-    header: i18nRuntime.i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
-    key: 'background',
-    body: []
+    title: i18nRuntime.i18n("f01c3cd99ecb0c534cc47081d3433c9f"),
+    body: styles
   }, {
-    header: i18nRuntime.i18n("803205e38834280d9e6a75993ac00764"),
-    key: 'box-shadow',
-    body: []
+    title: '样式源码',
+    body: [{
+      type: 'theme-cssCode',
+      label: false,
+      isLayout: true
+    }]
   }].filter(function (item) {
-    return include.length ? ~include.indexOf(item.key) : !~exclude.indexOf(item.key);
+    return !~exclude.indexOf(item.key || '');
   });
 });

package/lib/tpl/validations.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-beta.6
+ * amis-editor v5.2.5-alpha.12
  * Copyright 2018-2023 @fex
  */

package/lib/util.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-beta.6
+ * amis-editor v5.2.5-alpha.12
  * Copyright 2018-2023 @fex
  */

package/lib/validator.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.5-beta.6
+ * amis-editor v5.2.5-alpha.12
  * Copyright 2018-2023 @fex
  */

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "amis-editor",
-  "version": "5.2.5-beta.6",
+  "version": "5.2.5-beta.7",
   "description": "amis 可视化编辑器",
   "main": "lib/index.js",
   "module": "esm/index.js",

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

@@ -1,223 +0,0 @@
-/**
- * amis-editor v5.2.5-beta.6
- * Copyright 2018-2023 @fex
- */
-import { __extends, __assign, __decorate, __read } 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 = __read(useState(''), 2),
-    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 = __read(useState(false), 2),
-    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;
-  }
-  BorderRenderer.prototype.render = function () {
-    return React__default.createElement(ThemeClassName, __assign({}, this.props));
-  };
-  BorderRenderer = __decorate([FormItem({
-    type: 'theme-classname',
-    strictMode: false
-  })], BorderRenderer);
-  return BorderRenderer;
-})(React__default.Component);