@gct-paas/design 0.1.4-dev.6 → 0.1.4-dev.8

package/es/views/design-view.d.ts

@@ -0,0 +1,87 @@
+import { PropType } from 'vue';
+import { IDesignData, IDesignViewOptions } from '../interface';
+import { DesignViewPrefix } from '../constant';
+export declare const DesignView: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    isEditName: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideUndoRedo: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
+    data: {
+        type: PropType<IDesignData>;
+    };
+    save: {
+        type: PropType<(data: IData) => Promise<boolean>>;
+        required: true;
+    };
+    errMsg: {
+        type: StringConstructor;
+        default: string;
+    };
+    context: {
+        type: PropType<IContext>;
+        default: () => {};
+    };
+    opts: {
+        type: PropType<IDesignViewOptions>;
+        default: () => {
+            title: string;
+            prefix: DesignViewPrefix;
+        };
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("close" | "preview" | "save" | "update:name" | "update:errMsg")[], "close" | "preview" | "save" | "update:name" | "update:errMsg", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    isEditName: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideUndoRedo: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
+    data: {
+        type: PropType<IDesignData>;
+    };
+    save: {
+        type: PropType<(data: IData) => Promise<boolean>>;
+        required: true;
+    };
+    errMsg: {
+        type: StringConstructor;
+        default: string;
+    };
+    context: {
+        type: PropType<IContext>;
+        default: () => {};
+    };
+    opts: {
+        type: PropType<IDesignViewOptions>;
+        default: () => {
+            title: string;
+            prefix: DesignViewPrefix;
+        };
+    };
+}>> & Readonly<{
+    onClose?: ((...args: any[]) => any) | undefined;
+    onPreview?: ((...args: any[]) => any) | undefined;
+    onSave?: ((...args: any[]) => any) | undefined;
+    "onUpdate:name"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:errMsg"?: ((...args: any[]) => any) | undefined;
+}>, {
+    name: string;
+    context: IContext;
+    opts: IDesignViewOptions;
+    isEditName: boolean;
+    hideUndoRedo: boolean;
+    errMsg: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/views/design-view.mjs

@@ -0,0 +1,343 @@
+import { defineComponent, ref, computed, watch, onUnmounted, createVNode, createTextVNode, withDirectives, resolveComponent, vShow, nextTick } from 'vue';
+import { onClickOutside } from '@vueuse/core';
+import { Modal } from 'ant-design-vue';
+import '../hooks/design-view/useDesigner.mjs';
+import '../hooks/design-view/useGlobal.mjs';
+import '../hooks/design-view/usePage.mjs';
+import '../hooks/design-view/usePageOccupy.mjs';
+import '../hooks/design-view/usePropEditor.mjs';
+import '../hooks/design-view/useScope.mjs';
+import '../hooks/design-view/useSelectedWidget.mjs';
+import '@gct-paas/schema';
+import '../hooks/design-view/useToolkit.mjs';
+import '../hooks/design-view/useWidget.mjs';
+import '../hooks/develop/useCacheHistory.mjs';
+import { useNamespace, t } from '@gct-paas/core';
+import { useDesignViewController } from '../hooks/use-design-view-controller/use-design-view-controller.mjs';
+import 'qx-util';
+import { DesignViewPrefix } from '../constant/index.mjs';
+import 'lodash-es';
+import './design-view.css';import '../components/design/design-not-found/design-not-found.css';import '../components/design/design-drop-container/design-drop-container.css';import '../components/design/design-content/design-content.css';import '../components/design/design-not-drag-item/design-not-drag-item.css';import '../components/design/design-drop-line/design-drop-line.css';import '../components/design/design-drag-item/design-drag-item.css';import '../components/mobile-container/mobile-container.css';import '../components/design/design-item-highlighter/design-item-highlighter.css';import '../components/design/design-item-hover-title/design-item-hover-title.css';import '../components/design/design-item-actions/design-item-actions.css';import '../components/design/design-item-highlighter-container/design-item-highlighter-container.css';/* empty css                                                                                             */
+import 'vue3-dnd';
+/* empty css                                                                 */
+/* empty css                                                                        */
+/* empty css                                                                         */
+import 'dayjs';
+import '@ant-design/icons-vue';
+/* empty css                                                    */
+import 'react-dnd-html5-backend';
+import '../provider/design-editor-node/design-editor-node.provider.mjs';
+import '../utils/find-deep-types/find-deep-types.mjs';
+import '../utils/field-attrs/basicAttrs.mjs';
+/* empty css                                                           */
+/* empty css                                                           */
+/* empty css                                                                   */
+/* empty css                                                       */
+/* empty css                                                                     */
+/* empty css                                                           */
+import { DesignItemPreview } from '../components/design/design-item-preview/design-item-preview.mjs';
+/* empty css                  */
+
+const DesignView = /* @__PURE__ */ defineComponent({
+  name: 'DesignView',
+  props: {
+    // 是否启用名称编辑
+    isEditName: {
+      type: Boolean,
+      default: false
+    },
+    // 是否隐藏撤销、重做
+    hideUndoRedo: {
+      type: Boolean,
+      default: false
+    },
+    // 默认显示名称
+    name: {
+      type: String,
+      default: ''
+    },
+    data: {
+      type: Object
+    },
+    save: {
+      type: Function,
+      required: true
+    },
+    errMsg: {
+      type: String,
+      default: ''
+    },
+    context: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    opts: {
+      type: Object,
+      default: () => {
+        return {
+          title: t('sys.designView.title.default'),
+          prefix: DesignViewPrefix.CUSTOM_HOME
+        };
+      }
+    }
+  },
+  emits: ['close', 'save', 'preview', 'update:name', 'update:errMsg'],
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace('design-view');
+    const nameRef = ref();
+    const c = useDesignViewController();
+    const oldTitleName = ref(props.name);
+    const titleName = ref(props.name);
+    const isEdit = ref(false);
+
+    // 是否正在保存中
+    const isSave = ref(false);
+
+    // 是否正在预览中
+    const isPreview = ref(false);
+    const errInfo = computed(() => {
+      if (titleName.value.length > 100) {
+        emit('update:errMsg', '');
+        return t('sys.designView.title.errorMsg');
+      }
+      if (props.errMsg) {
+        return props.errMsg;
+      }
+      return '';
+    });
+    watch(() => props.name, val => {
+      oldTitleName.value = val;
+      titleName.value = val;
+    });
+
+    // 配置参数处理
+    {
+      const {
+        prefix
+      } = props.opts;
+      if (prefix) {
+        c.store.prefix = prefix;
+      }
+    }
+    const onClose = () => {
+      if (c.store.isChange) {
+        const cfg = Modal.confirm({
+          title: t('sys.designView.saveConfirm.title'),
+          content: createVNode("div", null, [createVNode("span", null, [t('sys.designView.saveConfirm.content')]), createVNode("div", {
+            "class": ns.b('continue-edit')
+          }, [createVNode("button", {
+            "type": "button",
+            "onClick": () => cfg.destroy()
+          }, [createTextVNode("\u7EE7\u7EED\u7F16\u8F91")])])]),
+          okText: t('sys.designView.saveConfirm.confirm'),
+          cancelText: t('sys.designView.saveConfirm.cancel'),
+          onOk: async () => {
+            const bol = await onSave();
+            if (bol === true) {
+              emit('close');
+            }
+          },
+          onCancel: () => {
+            emit('close');
+          },
+          class: ns.b('confirm'),
+          maskStyle: {
+            backgroundColor: 'transparent'
+          }
+        });
+      } else {
+        emit('close');
+      }
+    };
+    const save = async () => {
+      if (props.save) {
+        const validate = await c.validate();
+        if (!validate) {
+          return false;
+        }
+        const bol = await props.save(getData());
+        if (bol === true) {
+          c.store.isChange = false;
+          return true;
+        }
+      }
+      return false;
+    };
+    const onSave = async () => {
+      try {
+        isSave.value = true;
+        const bol = await save();
+        if (bol) {
+          onClose();
+        }
+      } finally {
+        setTimeout(() => {
+          isSave.value = false;
+        }, 300);
+      }
+      return false;
+    };
+    const onPreview = async () => {
+      try {
+        isPreview.value = true;
+        const bol = await save();
+        if (bol) {
+          emit('preview', getData());
+        }
+      } finally {
+        setTimeout(() => {
+          isPreview.value = false;
+        }, 300);
+      }
+    };
+    const getData = () => {
+      return c.store.getData();
+    };
+    const setData = data => {
+      c.store.setData(data);
+    };
+    setData(props.data || {
+      nodes: [],
+      pageNode: null,
+      tree: [],
+      type: ''
+    });
+    onUnmounted(() => {
+      c.unmounted();
+    });
+    const onEdit = e => {
+      if (props.isEditName) {
+        e.stopPropagation();
+        isEdit.value = true;
+        oldTitleName.value = titleName.value;
+        nextTick(() => {
+          nameRef.value.focus();
+          nameRef.value.select();
+        });
+      }
+    };
+    onClickOutside(nameRef, e => {
+      if (isEdit.value) {
+        if (errInfo.value) {
+          e.stopPropagation();
+          nameRef.value.focus();
+          nameRef.value.select();
+          return;
+        }
+        isEdit.value = false;
+        const newVal = titleName.value = titleName.value.trim();
+        if (titleName.value.length > 100) {
+          emit('update:name', newVal);
+          return;
+        }
+        if (oldTitleName.value !== newVal) {
+          if (newVal == '') {
+            titleName.value = oldTitleName.value;
+          } else {
+            e.stopPropagation();
+            emit('update:name', newVal);
+            c.store.isChange = true;
+            // emit('save', false);
+          }
+        }
+      }
+    });
+    const onPref = () => {
+      c.store.undo();
+    };
+    const onNext = () => {
+      c.store.redo();
+    };
+    return () => {
+      return createVNode("div", {
+        "class": ns.b()
+      }, [createVNode("div", {
+        "class": ns.b('header')
+      }, [createVNode("div", {
+        "class": ns.be('header', 'left')
+      }, [createVNode("div", {
+        "class": ns.be('header', 'back'),
+        "onClick": onClose
+      }, [createVNode("i", {
+        "class": "iconfont icon-a-Leftarrow"
+      }, null)]), createVNode("div", {
+        "class": ns.be('header', 'title')
+      }, [props.opts.title ?? t('sys.designView.title.default'), createTextVNode("\uFF1A\xA0")]), createVNode("div", {
+        "class": ns.be('header', 'view-title-edit')
+      }, [withDirectives(createVNode(resolveComponent("a-input"), {
+        "ref": "nameRef",
+        "value": titleName.value,
+        "onUpdate:value": $event => titleName.value = $event,
+        "bordered": false,
+        "onClick": e => e.stopPropagation()
+      }, null), [[vShow, isEdit]]), withDirectives(createVNode("span", {
+        "class": ns.e('edit-title'),
+        "onClick": onEdit
+      }, [createVNode("span", {
+        "title": titleName.value
+      }, [titleName.value]), createVNode("i", {
+        "class": "iconfont icon-a-Single-linetext"
+      }, null)]), [[vShow, !isEdit.value]]), errInfo.value ? createVNode("div", {
+        "class": ns.bem('header', 'view-title-edit', 'error-info')
+      }, [createVNode("span", null, [errInfo])]) : null])]), createVNode("div", {
+        "class": ns.be('header', 'right')
+      }, [props.opts.isBacktrack !== false && !props.hideUndoRedo ? createVNode("div", {
+        "class": ns.be('header', 'design-actions')
+      }, [createVNode(resolveComponent("a-button"), {
+        "type": "text",
+        "onClick": onPref,
+        "disabled": !c.store.history.canUndo()
+      }, {
+        default: () => t('sys.designView.undo'),
+        icon: () => createVNode("i", {
+          "class": "iconfont icon-shangyibu"
+        }, null)
+      }), createVNode(resolveComponent("a-button"), {
+        "type": "text",
+        "onClick": onNext,
+        "disabled": !c.store.history.canRedo()
+      }, {
+        default: () => t('sys.designView.redo'),
+        icon: () => createVNode("i", {
+          "class": "iconfont icon-xiayibu"
+        }, null)
+      })]) : null, createVNode("div", {
+        "class": ns.be('header', 'view-actions')
+      }, [props.opts.isPreview !== false ? createVNode(resolveComponent("a-button"), {
+        "onClick": onPreview,
+        "loading": isPreview
+      }, {
+        default: () => t('sys.designView.preview'),
+        icon: () => createVNode("i", {
+          "class": "iconfont icon-yulan"
+        }, null)
+      }) : null, createVNode(resolveComponent("a-button"), {
+        "onClick": onSave,
+        "loading": isSave
+      }, {
+        default: () => t('sys.designView.save'),
+        icon: () => createVNode("i", {
+          "class": "iconfont icon-baocun1"
+        }, null)
+      })])])]), createVNode("div", {
+        "class": ns.b('content')
+      }, [createVNode(DesignItemPreview, null, null), props.opts.isMaterial !== false ? createVNode("div", {
+        "class": ns.be('content', 'left')
+      }, [createVNode(resolveComponent("material-content"), null, null)]) : null, createVNode("div", {
+        "class": ns.be('content', 'center')
+      }, [createVNode(resolveComponent("design-content"), {
+        "opts": props.opts
+      }, null)]), createVNode("div", {
+        "class": ns.be('content', 'right')
+      }, [createVNode(resolveComponent("panel-content"), {
+        "context": props.context
+      }, null)])])]);
+    };
+  }
+});
+
+export { DesignView };

package/es/views/index.d.ts

@@ -0,0 +1 @@
+export { DesignView } from './design-view';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gct-paas/design",
-  "version": "0.1.4-dev.6",
+  "version": "0.1.4-dev.8",
   "type": "module",
   "description": "paas 平台设计界面底包",
   "main": "dist/index.min.cjs",
@@ -31,8 +31,9 @@
   "license": "MIT",
   "author": "gct",
   "scripts": {
-    "dev": "rollup -c -w --environment=NODE_ENV:development",
-    "build": "npm run lint && rollup -c --environment=NODE_ENV:production && vite build --mode production --config vite.config.ts",
+    "dev": "cross-env NODE_ENV=development vite build --watch --config vite.dev.config.ts",
+    "es:build": "vite build --config vite.dev.config.ts",
+    "build": "npm run lint && vite build --config vite.dev.config.ts && vite build --config vite.config.ts",
     "lint": "eslint src --fix",
     "publish:next": "npm run build && npm publish --access public --tag=next --registry=https://registry.npmjs.org/",
     "publish:dev": "npm run build && npm publish --access public --tag=dev --registry=https://registry.npmjs.org/",
@@ -41,19 +42,33 @@
     "publish:npm": "npm run build && npm publish --access public --registry=https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@gct-paas/build": "0.1.4-dev.6",
-    "@gct-paas/core": "0.1.4-dev.6",
+    "@ant-design/icons-vue": "^7.0.1",
+    "@gct-paas/api": "0.1.0-dev.8",
+    "@gct-paas/core": "0.1.4-dev.8",
+    "@gct-paas/core-web": "0.1.4-dev.8",
+    "@gct-paas/schema": "0.1.4-dev.8",
+    "@gct-paas/scss": "0.1.4-dev.8",
+    "@jsplumb/browser-ui": "^6.2.10",
+    "@vueuse/core": "^14.1.0",
     "ant-design-vue": "3.2.20",
-    "lodash-es": "^4.17.21",
-    "lokijs": "^1.5.12",
+    "async-validator": "^4.2.5",
+    "dayjs": "^1.11.19",
+    "escodegen": "^2.1.0",
+    "esprima-next": "5.8.4",
+    "estraverse": "^5.3.0",
+    "lodash-es": "^4.17.23",
+    "pinia": "^3.0.4",
     "qx-util": "^0.4.8",
-    "vue": "^3.5.13"
+    "react-dnd-html5-backend": "^16.0.1",
+    "vue": "^3.5.27",
+    "vue3-dnd": "^2.1.0"
   },
   "peerDependencies": {
     "vue": "^3.x"
   },
   "devDependencies": {
-    "@types/lokijs": "^1.5.14"
+    "@gct-paas/build": "^0.1.5-dev.6",
+    "@types/estraverse": "^5.1.7"
   },
-  "gitHead": "89142a76f256070c57ff8a6dcf062eba397f797a"
+  "gitHead": "bf7f4f9672c3906ec834e6d58b999ce78f7cad08"
 }

package/es/constant/variable-type/variable-type.d.ts

@@ -1,12 +0,0 @@
-/**
- * 变量类型
- */
-export declare enum VariableTypeEnum {
-    String = "String",
-    Number = "Number",
-    Boolean = "Boolean",
-    Object = "Object",
-    Array = "Array",
-    DataTime = "DataTime",
-    Null = "Null"
-}

package/es/constant/variable-type/variable-type.mjs

@@ -1,13 +0,0 @@
-"use strict";
-var VariableTypeEnum = /* @__PURE__ */ ((VariableTypeEnum2) => {
-  VariableTypeEnum2["String"] = "String";
-  VariableTypeEnum2["Number"] = "Number";
-  VariableTypeEnum2["Boolean"] = "Boolean";
-  VariableTypeEnum2["Object"] = "Object";
-  VariableTypeEnum2["Array"] = "Array";
-  VariableTypeEnum2["DataTime"] = "DataTime";
-  VariableTypeEnum2["Null"] = "Null";
-  return VariableTypeEnum2;
-})(VariableTypeEnum || {});
-
-export { VariableTypeEnum };

package/es/hooks/index.mjs

@@ -1,3 +0,0 @@
-export { useStyle } from './useStyle.mjs';
-
-"use strict";

package/es/hooks/useStyle.d.ts

@@ -1,15 +0,0 @@
-import { LowCodeWidget } from '@gct-paas/core';
-export declare function useStyle(widget: LowCodeWidget.BasicSchema): {
-    wrapperStyle: import('vue').ComputedRef<any>;
-    wStyle: import('vue').ComputedRef<any>;
-    labelFont: import('vue').ComputedRef<any>;
-    contentFont: import('vue').ComputedRef<any>;
-};
-export declare const schemaToStyle: (schema: any) => any;
-export declare function propsToStyle(styleProps?: any): any;
-export declare const transAlign2flex: {
-    left: string;
-    center: string;
-    right: string;
-    justify: string;
-};

package/es/hooks/useStyle.mjs

@@ -1,135 +0,0 @@
-import { computed } from 'vue';
-import { notNeedPxStyle } from '../schema/common-config/common-style.mjs';
-import { pick, isEmpty, isNil } from 'lodash-es';
-
-"use strict";
-function pxToVw(pxValue) {
-  if (import.meta.env.VITE_APP_ENV === "mobile") {
-    return pxValue / 375 * 100 + "vw";
-  } else {
-    return pxValue + "px";
-  }
-}
-const cmpStyle = {
-  fontAttrs: [
-    "fontWeight",
-    "fontSize",
-    "color",
-    "textDecorationLine",
-    "textAlign"
-  ],
-  mapAttrs: {
-    bold: {
-      attr: "fontWeight",
-      callback: (value) => {
-        return value ? 700 : 400;
-      }
-    },
-    italic: {
-      attr: "fontStyle",
-      callback: (value) => {
-        return value ? "italic" : "normal";
-      }
-    },
-    textDecoration: {
-      attr: "textDecorationLine"
-    },
-    fontSize: {
-      attr: "fontSize",
-      callback: (value) => {
-        return value ? pxToVw(value) : "";
-      }
-    },
-    align: {
-      attr: "textAlign"
-    }
-  },
-  // 获取font样式，
-  font(font) {
-    if (!font) return {};
-    const o = {};
-    Object.assign(o, pick(font, cmpStyle.fontAttrs));
-    if (typeof cmpStyle.mapAttrs === "object") {
-      Object.keys(cmpStyle.mapAttrs).forEach((k) => {
-        const { attr, callback } = cmpStyle.mapAttrs[k];
-        o[attr] = typeof callback === "function" ? callback(font[k]) : font[k];
-      });
-    }
-    return o;
-  }
-};
-function useStyle(widget) {
-  const { style = {}, ignoringStyle = [] } = widget || {};
-  const wStyle = computed(() => {
-    return propsToStyle(style);
-  });
-  const wrapperStyle = computed(() => {
-    const styleData = {
-      position: isEmpty(style.position) ? "" : style.position + " !important",
-      top: isEmpty(style.top) ? "" : style.top + "px !important",
-      left: isEmpty(style.left) ? "" : style.left + "px !important",
-      right: isEmpty(style.right) ? "" : style.right + "px !important",
-      bottom: isEmpty(style.bottom) ? "" : style.bottom + "px !important",
-      width: isEmpty(style.width) ? "" : style.width + "px !important",
-      height: isEmpty(style.height) ? "" : style.height + "px !important",
-      backgroundColor: isEmpty(style.backgroundColor) ? "" : style.backgroundColor + " !important",
-      marginTop: isEmpty(style.marginTop) ? "" : style.marginTop + "px !important",
-      marginRight: isEmpty(style.marginRight) ? "" : style.marginRight + "px !important",
-      marginBottom: isEmpty(style.marginBottom) ? "" : style.marginBottom + "px !important",
-      marginLeft: isEmpty(style.marginLeft) ? "" : style.marginLeft + "px !important",
-      paddingTop: isEmpty(style.paddingTop) ? "" : style.paddingTop + "px !important",
-      paddingRight: isEmpty(style.paddingRight) ? "" : style.paddingRight + "px !important",
-      paddingBottom: isEmpty(style.paddingBottom) ? "" : style.paddingBottom + "px !important",
-      paddingLeft: isEmpty(style.paddingLeft) ? "" : style.paddingLeft + "px !important",
-      borderLeft: `${style.borderLeft?.borderWidth}px ${style.borderLeft?.borderStyle} ${style.borderLeft?.borderColor} !important`,
-      borderRight: `${style.borderRight?.borderWidth}px ${style.borderRight?.borderStyle} ${style.borderRight?.borderColor} !important`,
-      borderBottom: `${style.borderBottom?.borderWidth}px ${style.borderBottom?.borderStyle} ${style.borderBottom?.borderColor} !important`,
-      borderTop: `${style.borderTop?.borderWidth}px ${style.borderTop?.borderStyle} ${style.borderTop?.borderColor} !important`,
-      borderTopRightRadius: isEmpty(style.borderTopRightRadius) ? "" : style.borderTopRightRadius + "px !important",
-      borderTopLeftRadius: isEmpty(style.borderTopLeftRadius) ? "" : style.borderTopLeftRadius + "px !important",
-      borderBottomRightRadius: isEmpty(style.borderBottomRightRadius) ? "" : style.borderBottomRightRadius + "px !important",
-      borderBottomLeftRadius: isEmpty(style.borderBottomLeftRadius) ? "" : style.borderBottomLeftRadius + "px !important"
-    };
-    ignoringStyle.forEach((key) => {
-      styleData[key] = void 0;
-    });
-    return styleData;
-  });
-  const labelFont = computed(() => {
-    return cmpStyle.font(style.labelFont);
-  });
-  const contentFont = computed(() => {
-    return cmpStyle.font(style.contentFont);
-  });
-  return {
-    wrapperStyle,
-    wStyle,
-    labelFont,
-    contentFont
-  };
-}
-const schemaToStyle = (schema) => cmpStyle.font(schema);
-function propsToStyle(styleProps = {}) {
-  const wStyle = {};
-  for (const prop in styleProps) {
-    wStyle[prop] = makeStyleProp(prop, styleProps[prop]);
-  }
-  return wStyle;
-}
-function makeStyleProp(prop, value) {
-  if (isNil(value) || isEmpty(value)) {
-    return "";
-  }
-  if (notNeedPxStyle.includes(prop)) {
-    return value + " !important";
-  }
-  return value + "px !important";
-}
-const transAlign2flex = {
-  left: "flex-start",
-  center: "center",
-  right: "flex-end",
-  justify: "space-between"
-};
-
-export { propsToStyle, schemaToStyle, transAlign2flex, useStyle };