@lingxiteam/theme-utils 0.5.3 → 0.5.4

package/dist/config/TreeSelect.d.ts

@@ -0,0 +1,197 @@
+export declare const TreeSelect: {
+    type: string;
+    hasPrefixClass: boolean;
+    variable: {
+        labelTextColor: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        labelFontSize: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        labelLineHeight: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        textColor: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        fontSize: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        itemBorderRadius: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        itemBorderColor: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        itemHoverBorderColor: {
+            type: string;
+            label: string;
+            groupsName: string;
+            hidden: boolean;
+            desc: string;
+            canEdit: boolean;
+            extendsKey: string;
+        };
+        iconColor: {
+            type: string;
+            label: string;
+            groupsName: string;
+        };
+        iconFontSize: {
+            type: string;
+            label: string;
+            groupsName: string;
+            desc: string;
+        };
+        iconTop: {
+            type: string;
+            label: string;
+            groupsName: string;
+        };
+    };
+    groupsName: string;
+    icon: string;
+    title: string;
+    defaultValue: {
+        iconFontSize: string;
+        iconColor: string;
+        iconTop: string;
+    }[];
+    tpl: string;
+    components: {
+        id: string;
+        label: string;
+        compName: string;
+        type: string;
+        compType: number;
+        compLib: string;
+        props: {
+            name: string;
+            colSpan: number;
+            labelCol: number;
+            wrapperCol: number;
+            layout: string;
+            colon: boolean;
+            labelAlign: string;
+            basicStatus: number;
+            colSpace: number;
+            rowSpace: number;
+            formCode: string;
+        };
+        style: {
+            padding: string;
+        };
+        isContainer: boolean;
+        isBusiObjContainer: boolean;
+        cmdgroup: string[];
+        platform: string;
+        icon: string;
+        description: string;
+        image: string;
+        groupsName: string;
+        engineApi: string[];
+        setEvents: never[];
+        isLabelDropBoxChild: boolean;
+        components: {
+            id: string;
+            label: string;
+            compName: string;
+            type: string;
+            compType: number;
+            compLib: string;
+            props: {
+                name: string;
+                filter: string;
+                basicStatus: number;
+                titleTip: string;
+                tipSize: string;
+                tipWidth: string;
+                tipHeight: string;
+                selfSpan: string;
+                labelCol: number;
+                wrapperCol: number;
+                treeDefaultExpandAll: boolean;
+                size: string;
+                showSearch: boolean;
+                treeNodeFilterProp: string;
+                treeData: {
+                    title: string;
+                    key: string;
+                    $$isParent: boolean;
+                    selectable: boolean;
+                    children: ({
+                        title: string;
+                        key: string;
+                        selectable: boolean;
+                        children: never[];
+                        value: string;
+                    } | {
+                        title: string;
+                        key: string;
+                        selectable: boolean;
+                        value: string;
+                        children?: undefined;
+                    })[];
+                    value: string;
+                }[];
+                allowClear: boolean;
+                formItemIndex: number;
+                fieldName: string;
+            };
+            style: {};
+            isContainer: boolean;
+            isBusiObjContainer: boolean;
+            cmdgroup: string[];
+            platform: string;
+            fieldProps: {
+                trigger: string;
+                valuePropName: string;
+            };
+            engineApi: string[];
+            icon: string;
+            description: string;
+            image: string;
+            groupsName: string;
+            setEvents: never[];
+            isLabelDropBoxChild: boolean;
+            components: never[];
+            path: string[];
+        }[];
+        path: string[];
+    }[];
+};

package/dist/config/TreeSelect.js

@@ -0,0 +1,213 @@
+export var TreeSelect = {
+  type: 'TreeSelect',
+  hasPrefixClass: true,
+  variable: {
+    labelTextColor: {
+      type: 'color',
+      label: '标题颜色',
+      groupsName: '标题',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    labelFontSize: {
+      type: 'px',
+      label: '标题尺寸',
+      groupsName: '标题',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    labelLineHeight: {
+      type: 'px',
+      label: '标题行高',
+      groupsName: '标题',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    textColor: {
+      type: 'color',
+      label: '文本颜色',
+      groupsName: '文字',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    fontSize: {
+      type: 'px',
+      label: '文本尺寸',
+      groupsName: '文字',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    itemBorderRadius: {
+      type: 'px',
+      label: '圆角',
+      groupsName: '边框',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    itemBorderColor: {
+      type: 'color',
+      label: '颜色',
+      groupsName: '边框',
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    itemHoverBorderColor: {
+      type: 'color',
+      label: '组件激活边框颜色',
+      groupsName: '边框',
+      hidden: true,
+      desc: '继承自表单，此处不可编辑',
+      canEdit: false,
+      extendsKey: 'Form'
+    },
+    iconColor: {
+      type: 'color',
+      label: '后缀图标颜色',
+      groupsName: '其他'
+    },
+    iconFontSize: {
+      type: 'px',
+      label: '后缀图标尺寸',
+      groupsName: '其他',
+      desc: '请根据实际【文本尺寸】调整，不宜与【文本尺寸】大小差异过大'
+    },
+    iconTop: {
+      type: 'px',
+      label: '后缀图标向下偏移',
+      groupsName: '其他'
+    }
+  },
+  groupsName: '数据录入',
+  icon: 'icon-ico-comp-treeSelect',
+  title: '树选择',
+  defaultValue: [{
+    iconFontSize: '12px',
+    iconColor: 'rgba(28,36,46,.25)',
+    iconTop: '16px'
+  }],
+  tpl: ".pcFactory-from-component{\n    .ued-treeSelect-wrap {\n    .pcfactory-select-arrow{\n      color: iconColor;\n      width: iconFontSize;\n      height: iconFontSize;\n      top: iconTop;\n      .anticon>svg{\n        width: iconFontSize;\n        height: iconFontSize;\n      }\n    }\n    .pcfactory-select-clear {\n      color: iconColor;\n      width: iconFontSize;\n      height: iconFontSize;\n      top: iconTop;\n      .anticon>svg{\n        width: iconFontSize;\n        height: iconFontSize;\n      }\n    }\n  }}",
+  components: [{
+    id: 'Form_180373',
+    label: '表单',
+    compName: 'Form',
+    type: 'Form',
+    compType: 0,
+    compLib: 'comm',
+    props: {
+      name: '表单',
+      colSpan: 12,
+      labelCol: 8,
+      wrapperCol: 16,
+      layout: 'vertical',
+      colon: true,
+      labelAlign: 'right',
+      basicStatus: 1,
+      colSpace: 16,
+      rowSpace: 16,
+      formCode: 'Code_Form_180373'
+    },
+    style: {
+      padding: '0px 0px 0px 0px'
+    },
+    isContainer: true,
+    isBusiObjContainer: true,
+    cmdgroup: ['basic'],
+    platform: 'pc',
+    icon: 'Form',
+    description: '',
+    image: '',
+    groupsName: '容器',
+    engineApi: ['service.downloadFileByFileCode', 'getVisible', 'stateListener'],
+    setEvents: [],
+    isLabelDropBoxChild: false,
+    components: [{
+      id: 'TreeSelect_357899',
+      label: '树选择',
+      compName: 'TreeSelect',
+      type: 'TreeSelect',
+      compType: 2,
+      compLib: 'comm',
+      props: {
+        name: '树选择',
+        filter: 'local',
+        basicStatus: 1,
+        titleTip: 'notext',
+        tipSize: 'default',
+        tipWidth: '240px',
+        tipHeight: 'auto',
+        selfSpan: '',
+        labelCol: 8,
+        wrapperCol: 16,
+        treeDefaultExpandAll: true,
+        size: 'default',
+        showSearch: false,
+        treeNodeFilterProp: 'title',
+        treeData: [{
+          title: '标题1',
+          key: '982968',
+          $$isParent: true,
+          selectable: true,
+          children: [{
+            title: '副标题1',
+            key: '223275',
+            selectable: true,
+            children: [],
+            value: '223275'
+          }, {
+            title: '副标题2',
+            key: '6154336',
+            selectable: true,
+            value: '6154336'
+          }],
+          value: '982968'
+        }, {
+          title: '标题2',
+          key: '589191',
+          $$isParent: true,
+          selectable: true,
+          children: [{
+            title: '副标题21',
+            key: '974854',
+            selectable: true,
+            value: '974854'
+          }, {
+            title: '副标题22',
+            key: '555559',
+            selectable: true,
+            value: '555559'
+          }],
+          value: '589191'
+        }],
+        allowClear: true,
+        formItemIndex: 0,
+        fieldName: '32'
+      },
+      style: {},
+      isContainer: false,
+      isBusiObjContainer: false,
+      cmdgroup: ['basic'],
+      platform: 'pc',
+      fieldProps: {
+        trigger: 'onChange',
+        valuePropName: 'value'
+      },
+      engineApi: ['service.commonFetch'],
+      icon: 'TreeSelect',
+      description: '',
+      image: '',
+      groupsName: '数据录入',
+      setEvents: [],
+      isLabelDropBoxChild: false,
+      components: [],
+      path: ['998509', 'Form_180373']
+    }],
+    path: ['998509']
+  }]
+};

package/dist/css.d.ts

@@ -0,0 +1,6 @@
+export declare function stringifyCss(tpl: string, values: any): string;
+export declare function parseCss(tpl: string, a: string): any;
+export declare function normalizeCSS(css: string, selector?: string): string;
+export declare function prefixAnyCSS(css: string, prefix?: string, hasPrefix?: boolean): string;
+export declare function insertRules(id: string, rules: string, selector?: HTMLHeadElement): void;
+export declare function insertLink(id: string, href: string, insertBefore?: boolean): void;

package/dist/css.js

@@ -0,0 +1,126 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { compile, stringify, serialize } from 'stylis';
+export function stringifyCss(tpl, values) {
+  if (!tpl) return '';
+  var result = tpl;
+
+  // eslint-disable-next-line guard-for-in
+  for (var key in values) {
+    var value = values[key];
+    var regex = new RegExp("".concat(key, "\\b"), 'g');
+    result = result.replace(regex, value);
+  }
+  return result;
+}
+export function parseCss(tpl, a) {
+  if (!tpl) return {};
+  var tplRegex = /\.(\w+)\s*{\s*(.*?)\s*}/g;
+  var tplMatches = _toConsumableArray(tpl.matchAll(tplRegex));
+  var aRegex = /\.(\w+)\s*{\s*(.*?)\s*}/g;
+  var aMatches = _toConsumableArray(a.matchAll(aRegex));
+  var result = {};
+  // eslint-disable-next-line
+  var _loop = function _loop() {
+    var tplMatch = tplMatches[i];
+    var tplSelector = tplMatch[1];
+    var tplStyles = tplMatch[2].split(';').map(function (style) {
+      return style.trim();
+    }).filter(Boolean);
+    var aMatch = aMatches.find(function (match) {
+      return match[1] === tplSelector;
+    });
+    if (aMatch) {
+      var aStyles = aMatch[2].split(';').map(function (style) {
+        return style.trim();
+      }).filter(Boolean);
+      // eslint-disable-next-line
+      var _loop2 = function _loop2() {
+        var tplStyle = tplStyles[j];
+        var _tplStyle$split$map = tplStyle.split(':').map(function (item) {
+            return item.trim();
+          }),
+          _tplStyle$split$map2 = _slicedToArray(_tplStyle$split$map, 2),
+          tplKey = _tplStyle$split$map2[0],
+          tplValue = _tplStyle$split$map2[1];
+        var aStyle = aStyles.find(function (style) {
+          return style.startsWith(tplKey);
+        });
+        if (aStyle) {
+          var _aStyle$split$map = aStyle.split(':').map(function (item) {
+              return item.trim();
+            }),
+            _aStyle$split$map2 = _slicedToArray(_aStyle$split$map, 2),
+            aValue = _aStyle$split$map2[1];
+          result[tplValue] = aValue;
+        }
+      };
+      for (var j = 0; j < tplStyles.length; j++) {
+        _loop2();
+      }
+    }
+  };
+  for (var i = 0; i < tplMatches.length; i++) {
+    _loop();
+  }
+  return result;
+}
+export function normalizeCSS(css, selector) {
+  var mergeCss = css;
+  if (selector) {
+    var hasD = selector.startsWith('.') || selector.startsWith('#');
+    mergeCss = "".concat(hasD ? '' : '.').concat(selector, " {").concat(css, "}");
+  }
+  var compiled = compile(mergeCss);
+  return serialize(compiled, stringify);
+}
+
+// 这个解法不是特别好，但是组件有些是有嵌套的 div 有些是没有嵌套，所以给可用的 class 添加一个 &. 的样式前缀
+export function prefixAnyCSS(css, prefix, hasPrefix) {
+  if (prefix) {
+    var hasD = prefix.startsWith('.') || prefix.startsWith('#');
+    var prefixCss = "".concat(hasD ? '' : '.').concat(prefix);
+    if (hasPrefix) return "".concat(prefixCss).concat(css);
+    return css.split('\n').map(function (i) {
+      if (i.trimStart().startsWith('.')) {
+        return "".concat(prefixCss).concat(i.trimStart());
+      }
+      return i;
+    }).join('\n');
+  }
+  return css;
+}
+export function insertRules(id, rules) {
+  var selector = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : document.head;
+  var style = document.getElementById(id);
+  if (!style) {
+    style = document.createElement('style');
+    style.id = id;
+    (selector !== null && selector !== void 0 ? selector : document.head).appendChild(style);
+    style.innerHTML = rules;
+  } else {
+    style.innerHTML = rules;
+  }
+}
+export function insertLink(id, href) {
+  var insertBefore = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  if (document.getElementById(id)) return;
+  var link = document.createElement('link');
+  link.id = id;
+  link.type = 'text/css';
+  link.rel = 'stylesheet';
+  link.href = href;
+  if (insertBefore) {
+    document.body.insertBefore(link, document.body.firstElementChild);
+  } else {
+    document.head.appendChild(link);
+  }
+}

package/dist/demo.d.ts

@@ -0,0 +1,5 @@
+export declare const ASSETS_CSS_TPL: any;
+export declare const ASSETS_COMPONENT_LIST: unknown[];
+export declare function getItemByType(type: string): any;
+export declare function stringifyCssByType(type: string, values: any): string;
+export declare function parseCssByType(type: string, css: string): any;

package/dist/demo.js

@@ -0,0 +1,79 @@
+import { stringifyCss, parseCss } from "./css";
+import { objToListByGroupsName } from "./utils";
+export var ASSETS_CSS_TPL = {
+  // 演示，并非真正的组件
+  Root: {
+    type: 'Root',
+    variable: {
+      backgroundColor: {
+        type: 'color',
+        label: '背景颜色',
+        groupsName: '背景'
+      },
+      fontSize: {
+        type: 'px',
+        label: '文本字号',
+        groupsName: '标签统一设置'
+      },
+      borderLeftWidth: {
+        type: 'select',
+        label: '边框圆角',
+        groupsName: '组件统一设置',
+        desc: '说明',
+        options: ['2px', '3px', '5px']
+      }
+    },
+    groupsName: '页面',
+    icon: 'root',
+    title: '根节点',
+    defaultValue: [{
+      backgroundColor: 'red',
+      fontSize: '12px',
+      borderLeftWidth: '2px'
+    }, {
+      backgroundColor: 'blue',
+      fontSize: '14px',
+      borderLeftWidth: '5px'
+    }],
+    tpl: '.engine-dynamicPage-view_box>div{ background-color: backgroundColor; font-size:fontSize; border-left-width:borderLeftWidth; }'
+  },
+  RootItem: {
+    canEdit: false,
+    extendsKey: 'Root',
+    variable: {
+      backgroundColor: {
+        type: 'color',
+        label: '背景颜色',
+        groupsName: '背景'
+      },
+      fontSize: {
+        type: 'px',
+        label: '文本字号',
+        groupsName: '标签统一设置'
+      },
+      borderLeftWidth: {
+        type: 'select',
+        label: '边框圆角',
+        groupsName: '组件统一设置',
+        options: ['2px', '3px', '5px']
+      }
+    },
+    title: '子节点'
+  }
+};
+export var ASSETS_COMPONENT_LIST = objToListByGroupsName(Object.values(ASSETS_CSS_TPL));
+export function getItemByType(type) {
+  var com = ASSETS_CSS_TPL[type];
+  if (!type || !com) return {
+    tpl: ''
+  };
+  return com;
+}
+export function stringifyCssByType(type, values) {
+  var item = getItemByType(type);
+  return stringifyCss(item.tpl, values);
+}
+export function parseCssByType(type, css) {
+  var item = getItemByType(type);
+  return parseCss(item.tpl, css);
+}