@dckj-npm/dc-material 0.1.14 → 0.1.16

package/lowcode/position/meta.ts

@@ -1,211 +1,161 @@
-
-import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
-
-const PositionMeta: IPublicTypeComponentMetadata = {
-  group: '低代码组件',
-  "componentName": "Position",
-  "title": "Position",
-  "docUrl": "",
-  "screenshot": "",
-  "devMode": "proCode",
-  "npm": {
-    "package": "@dckj-npm/dc-material",
-    "version": "0.1.7",
-    "exportName": "Position",
-    "main": "src\\index.tsx",
-    "destructuring": true,
-    "subName": ""
-  },
-  "configure": {
-    "props": [
-      {
-        "title": {
-          "label": {
-            "type": "i18n",
-            "en-US": "itemArray",
-            "zh-CN": "选择项"
-          }
-        },
-        "name": "itemArray",
-        "setter": {
-          "componentName": "ArraySetter",
-          "props": {
-            "itemSetter": {
-              "componentName": "ObjectSetter",
-              "props": {
-                "config": {
-                  "items": [
-                    {
-                      "title": {
-                        "label": {
-                          "type": "i18n",
-                          "en-US": "lat",
-                          "zh-CN": "lat"
-                        }
-                      },
-                      "name": "lat",
-                      "setter": {
-                        "componentName": "StringSetter",
-                        "isRequired": true,
-                        "initialValue": ""
-                      }
-                    },
-                    {
-                      "title": {
-                        "label": {
-                          "type": "i18n",
-                          "en-US": "lng",
-                          "zh-CN": "lng"
-                        }
-                      },
-                      "name": "lng",
-                      "setter": {
-                        "componentName": "StringSetter",
-                        "isRequired": true,
-                        "initialValue": ""
-                      }
-                    },
-                    {
-                      "title": {
-                        "label": {
-                          "type": "i18n",
-                          "en-US": "address",
-                          "zh-CN": "address"
-                        }
-                      },
-                      "name": "address",
-                      "setter": {
-                        "componentName": "StringSetter",
-                        "isRequired": true,
-                        "initialValue": ""
-                      }
-                    }
-                  ],
-                  "extraSetter": {
-                    "componentName": "MixedSetter",
-                    "isRequired": false,
-                    "props": {}
-                  }
-                }
-              }
-            }
-          },
-          "isRequired": true,
-          "initialValue": []
-        }
-      },
-      {
-        "title": {
-          "label": {
-            "type": "i18n",
-            "en-US": "defaultLocation",
-            "zh-CN": "默认地址"
-          }
-        },
-        "name": "defaultLocation",
-        "setter": {
-          "componentName": "ObjectSetter",
-          "props": {
-            "config": {
-              "items": [
-                {
-                  "title": {
-                    "label": {
-                      "type": "i18n",
-                      "en-US": "lat",
-                      "zh-CN": "lat"
-                    }
-                  },
-                  "name": "lat",
-                  "setter": {
-                    "componentName": "StringSetter",
-                    "isRequired": true,
-                    "initialValue": ""
-                  }
-                },
-                {
-                  "title": {
-                    "label": {
-                      "type": "i18n",
-                      "en-US": "lng",
-                      "zh-CN": "lng"
-                    }
-                  },
-                  "name": "lng",
-                  "setter": {
-                    "componentName": "StringSetter",
-                    "isRequired": true,
-                    "initialValue": ""
-                  }
-                },
-                {
-                  "title": {
-                    "label": {
-                      "type": "i18n",
-                      "en-US": "address",
-                      "zh-CN": "address"
-                    }
-                  },
-                  "name": "address",
-                  "setter": {
-                    "componentName": "StringSetter",
-                    "isRequired": true,
-                    "initialValue": ""
-                  }
-                }
-              ],
-              "extraSetter": {
-                "componentName": "MixedSetter",
-                "isRequired": false,
-                "props": {}
-              }
-            }
-          },
-          "isRequired": true
-        }
-      }
-    ],
-    "supports": {
-      "style": true
-    },
-    "component": {}
-  }
-};
-const snippets: IPublicTypeSnippet[] = [
-  {
-    "title": "定位",
-    "screenshot": "",
-    "schema": {
-      "componentName": "Position",
-      "props": {
-        defaultLocation: {
-          lng: '123',
-          lat: '123',
-          address: '嘉兴市'
-        },
-        itemArray: [
-          {
-            lng: '123',
-            lat: '123',
-            address: '嘉兴市'
-          },
-          {
-            lng: '123',
-            lat: '123',
-            address: '杭州市'
-          },
-          {
-            lng: '123',
-            lat: '123',
-            address: '上海市'
-          }
-        ]
-      }
-    }
-  }
-];
-
-export default {
-  ...PositionMeta,
-  snippets
-};
+
+import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
+
+const PositionMeta: IPublicTypeComponentMetadata = {
+  group: '低代码组件',
+  "componentName": "Position",
+  "title": "Position",
+  "docUrl": "",
+  "screenshot": "",
+  "devMode": "proCode",
+  "npm": {
+    "package": "@dckj-npm/dc-material",
+    "version": "0.1.7",
+    "exportName": "Position",
+    "main": "src\\index.tsx",
+    "destructuring": true,
+    "subName": ""
+  },
+  "configure": {
+    "props": [
+      {
+        "title": {
+          "label": {
+            "type": "i18n",
+            "en-US": "itemArray",
+            "zh-CN": "数据源绑定"
+          }
+        },
+        "name": "itemArray",
+        "setter": {
+          componentName: 'SetterFormVariable',
+          props: {
+            attributes: [
+              {
+                label: '经纬度',
+                value: 'itemArray',
+                children: [
+                  { label: '城市', value: 'address' },
+                  { label: '纬度', value: 'lat' },
+                  { label: '经度', value: 'lng' }
+                ]
+              }
+            ]
+          }
+        }
+      },
+      {
+        "title": {
+          "label": {
+            "type": "i18n",
+            "en-US": "defaultLocation",
+            "zh-CN": "默认地址"
+          }
+        },
+        "name": "defaultLocation",
+        "setter": {
+          "componentName": "ObjectSetter",
+          "props": {
+            "config": {
+              "items": [
+                {
+                  "title": {
+                    "label": {
+                      "type": "i18n",
+                      "en-US": "lat",
+                      "zh-CN": "lat"
+                    }
+                  },
+                  "name": "lat",
+                  "setter": {
+                    "componentName": "StringSetter",
+                    "isRequired": true,
+                    "initialValue": ""
+                  }
+                },
+                {
+                  "title": {
+                    "label": {
+                      "type": "i18n",
+                      "en-US": "lng",
+                      "zh-CN": "lng"
+                    }
+                  },
+                  "name": "lng",
+                  "setter": {
+                    "componentName": "StringSetter",
+                    "isRequired": true,
+                    "initialValue": ""
+                  }
+                },
+                {
+                  "title": {
+                    "label": {
+                      "type": "i18n",
+                      "en-US": "address",
+                      "zh-CN": "address"
+                    }
+                  },
+                  "name": "address",
+                  "setter": {
+                    "componentName": "StringSetter",
+                    "isRequired": true,
+                    "initialValue": ""
+                  }
+                }
+              ],
+              "extraSetter": {
+                "componentName": "MixedSetter",
+                "isRequired": false,
+                "props": {}
+              }
+            }
+          },
+          "isRequired": true
+        }
+      }
+    ],
+    "supports": {
+      "style": true
+    },
+    "component": {}
+  }
+};
+const snippets: IPublicTypeSnippet[] = [
+  {
+    "title": "定位",
+    "screenshot": "",
+    "schema": {
+      "componentName": "Position",
+      "props": {
+        defaultLocation: {
+          lng: '123',
+          lat: '123',
+          address: '嘉兴市'
+        },
+        itemArray: [
+          {
+            lng: '123',
+            lat: '123',
+            address: '嘉兴市'
+          },
+          {
+            lng: '123',
+            lat: '123',
+            address: '杭州市'
+          },
+          {
+            lng: '123',
+            lat: '123',
+            address: '上海市'
+          }
+        ]
+      }
+    }
+  }
+];
+
+export default {
+  ...PositionMeta,
+  snippets
+};

package/lowcode/search-bar/meta.ts

@@ -22,7 +22,6 @@ const SearchBarMeta: IPublicTypeComponentMetadata = {
       events: [{
         name: 'onClick',
         // template: "onSearch(params,${extParams}){\n window.location.href=`http://localhost:4500/preview.html?pathId=${params.pathId}`;\n console.log(params.pathId) \n}"
-        template: "onClick(${extParams}){\n// 点击按钮的回调函数\nconsole.log('onClick');}",
       }],
     },
     "props": [

package/lowcode/tab-container/meta.ts

@@ -0,0 +1,70 @@
+import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from "@alilc/lowcode-types";
+
+import props from "./props";
+
+const snippets: IPublicTypeSnippet[] = [
+  {
+    title: "选项卡",
+    schema: {
+      componentName: "TabContainer",
+      props: {
+        shape: "pure",
+        size: "medium",
+        excessMode: "slide",
+      },
+      children: [
+        {
+          componentName: "TabContainerItem",
+          props: {
+            title: "标签项1",
+            primaryKey: "tab-item-1",
+          },
+        },
+        {
+          componentName: "TabContainerItem",
+          props: {
+            title: "标签项2",
+            primaryKey: "tab-item-2",
+          },
+        },
+      ],
+    },
+  },
+];
+
+const TabContainerMeta: IPublicTypeComponentMetadata = {
+    "group": "低代码组件",
+    componentName: "TabContainer",
+    title: "选项卡",
+    category: "布局容器类",
+    docUrl: "",
+    screenshot:
+      "https://img.alicdn.com/imgextra/i4/O1CN01mh9LPG268B90t8DaA_!!6000000007616-55-tps-56-56.svg",
+    devMode: "proCode",
+    npm: {
+      "package": "@dckj-npm/dc-material",
+      "version": "0.1.13",
+      "exportName": "TabContainer",
+      "main": "src\\index.tsx",
+      "destructuring": true,
+      "subName": ""
+    },
+    configure: {
+      component: {
+        isContainer: true,
+        nestingRule: {
+          childWhitelist: ["TabContainerItem"],
+        },
+      },
+      props,
+      supports: {
+        style: true,
+      },
+    },
+    snippets,
+  };
+
+export default {
+  ...TabContainerMeta,
+  snippets
+};

package/lowcode/tab-container/props.ts

@@ -0,0 +1,194 @@
+export default [
+  {
+    name: 'items',
+    title: '标签项',
+    setter: {
+      componentName: 'ArraySetter',
+      props: {
+        itemSetter: {
+          componentName: 'ObjectSetter',
+          props: {
+            config: {
+              items: [
+                {
+                  name: 'title',
+                  title: '名称',
+                  defaultValue: '标签项',
+                  important: true,
+                  setter: 'StringSetter',
+                },
+                {
+                  name: 'primaryKey',
+                  title: '项目编号',
+                  condition: () => false,
+                  setter: 'StringSetter',
+                },
+                {
+                  name: 'closeable',
+                  title: '可关闭',
+                  initialValue: false,
+                  setter: 'BoolSetter',
+                },
+                {
+                  name: 'disabled',
+                  title: '是否禁用',
+                  initialValue: false,
+                  setter: 'BoolSetter',
+                },
+              ],
+            },
+          },
+          initialValue: () => {
+            return {
+              primaryKey: String(Math.floor(Math.random() * 10000)),
+              title: '标签项',
+              closeable: false,
+              disabled: false,
+            };
+          },
+        },
+      },
+    },
+    extraProps: {
+      getValue(target) {
+        const map = target.node.children.map((child) => {
+          const primaryKey = child.getPropValue('primaryKey')
+            ? String(child.getPropValue('primaryKey'))
+            : child.id;
+          return {
+            primaryKey,
+            title: child.getPropValue('title') || '标签项',
+            closeable: child.getPropValue('closeable'),
+            disabled: child.getPropValue('disabled'),
+          };
+        });
+        return map;
+      },
+      setValue(target, value) {
+        const { node } = target;
+        const map = {};
+        if (!Array.isArray(value)) {
+          value = [];
+        }
+        value.forEach((item) => {
+          const tabitem = Object.assign({}, item);
+          map[item.primaryKey] = tabitem;
+        });
+
+        node.children.mergeChildren(
+          (child) => {
+            const primaryKey = String(child.getPropValue('primaryKey'));
+            if (Object.hasOwnProperty.call(map, primaryKey)) {
+              child.setPropValue('title', map[primaryKey].title);
+              child.setPropValue('closeable', map[primaryKey].closeable);
+              child.setPropValue('disabled', map[primaryKey].disabled);
+              delete map[primaryKey];
+              return false;
+            }
+            return true;
+          },
+          () => {
+            const items: any = [];
+            for (const primaryKey in map) {
+              if (Object.hasOwnProperty.call(map, primaryKey)) {
+                items.push({
+                  componentName: 'TabContainerItem',
+                  props: map[primaryKey],
+                });
+              }
+            }
+            return items;
+          },
+          (child1, child2) => {
+            const a = value.findIndex(
+              (item) => String(item.primaryKey) === String(child1.getPropValue('primaryKey')),
+            );
+            const b = value.findIndex(
+              (item) => String(item.primaryKey) === String(child2.getPropValue('primaryKey')),
+            );
+            return a - b;
+          },
+        );
+      },
+    },
+  },
+  {
+    name: 'shape',
+    title: '形态',
+    defaultValue: 'pure',
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [
+          { title: '普通型', value: 'pure' },
+          { title: '包裹型', value: 'wrapped' },
+          { title: '文本型', value: 'text' },
+          { title: '胶囊型', value: 'capsule' },
+        ],
+      },
+    },
+  },
+  {
+    name: 'size',
+    title: '尺寸',
+    defaultValue: 'medium',
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [
+          { title: '小', value: 'small' },
+          { title: '中', value: 'medium' },
+        ],
+      },
+    },
+  },
+  {
+    name: 'excessMode',
+    title: '选项卡过多时的滑动模式',
+    defaultValue: 'slide',
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [
+          { title: '滑动', value: 'slide' },
+          { title: '下拉', value: 'dropdown' },
+        ],
+      },
+    },
+  },
+  {
+    name: 'tabPosition',
+    title: {
+      label: '导航选项卡的位置',
+      tip: '只适用于包裹型（wrapped）选项卡',
+    },
+    condition: (target) => {
+      const shape = target.getProps().getPropValue('shape');
+      return shape === 'wrapped';
+    },
+    defaultValue: 'top',
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [
+          {
+            title: '顶部',
+            value: 'top',
+          },
+          {
+            title: '底部',
+            value: 'bottom',
+          },
+          {
+            title: '左边',
+            value: 'left',
+          },
+          {
+            title: '右边',
+            value: 'right',
+          },
+        ],
+      },
+    },
+  },
+];