@openli1115/lowcode-edit-pro-table 1.0.23

package/lowcode/pro-select/meta.design.ts

@@ -0,0 +1,231 @@
+import snippets from './snippets.design';
+import parseData from '../utils/parse-data';
+
+export default {
+  group: '原子组件',
+  componentName: 'ProSelect',
+  title: '选择器',
+  docUrl: '',
+  screenshot: '',
+  npm: {
+    package: 'lowcode-edit-pro-table',
+    version: '{{version}}',
+    exportName: 'ProSelect',
+    main: '',
+    destructuring: true,
+    subName: '',
+  },
+  configure: {
+    component: {
+      rootSelector: 'span.next-select',
+    },
+    props: [
+      {
+        name: 'mode',
+        title: {
+          label: '模式',
+          tip: '属性: mode',
+        },
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            defaultValue: 'single',
+            options: [
+              { value: 'single', title: '单选' },
+              { value: 'multiple', title: '多选' },
+            ],
+          },
+        },
+      },
+      {
+        name: 'size',
+        title: {
+          label: {
+            type: 'i18n',
+            zh_CN: '尺寸',
+            en_US: 'Button Size',
+          },
+          tip: {
+            type: 'i18n',
+            zh_CN: '属性: size | 说明: 按钮尺寸',
+            en_US: 'prop: size | description: button size',
+          },
+        },
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            options: [
+              {
+                label: '小',
+                value: 'small',
+              },
+              {
+                label: '中',
+                value: 'medium',
+              },
+              {
+                label: '大',
+                value: 'large',
+              },
+            ],
+          },
+        },
+        defaultValue: 'medium',
+      },
+      {
+        name: 'visible',
+        title: {
+          label: '状态',
+          tip: '属性: visible',
+        },
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            defaultValue: 'single',
+            options: [
+              { value: false, title: '普通' },
+              { value: true, title: '展开' },
+            ],
+          },
+        },
+      },
+      {
+        name: 'hasBorder',
+        title: {
+          label: {
+            type: 'i18n',
+            zh_CN: '显示边框',
+            en_US: 'ShowBorder',
+          },
+          tip: {
+            type: 'i18n',
+            zh_CN: '属性: hasBorder | 说明: 是否有边框',
+            en_US: 'prop: hasBorder | description: HasBorder',
+          },
+        },
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            options: [
+              {
+                label: '无',
+                value: false,
+              },
+              {
+                label: '有',
+                value: true,
+              },
+            ],
+          },
+        },
+      },
+      {
+        name: 'style.width',
+        title: '宽度',
+        setter: 'NumberSetter',
+        setValue: (target) => {
+          const visible = target.parent.getPropValue('visible');
+          if (!visible) return;
+          target.parent.setPropValue('visible', false);
+          setTimeout(() => {
+            target.parent.setPropValue('visible', true);
+          }, 300);
+        },
+      },
+      {
+        name: 'label',
+        title: {
+          label: '内联文案',
+          tip: 'label|输入框内置标签',
+        },
+        setter: 'StringSetter',
+      },
+      {
+        name: 'placeholder',
+        title: {
+          label: '占位提示',
+          tip: '属性: placeholder',
+        },
+        defaultValue: '请选择', // 不生效
+        setter: 'StringSetter',
+      },
+      {
+        name: 'showSearch',
+        title: {
+          label: '可搜索',
+          tip: '属性: showSearch',
+        },
+        setter: 'BoolSetter',
+        defaultValue: false,
+      },
+      {
+        name: 'disabled',
+        title: '是否禁用',
+        setter: 'BoolSetter',
+        defaultValue: false,
+      },
+      {
+        name: 'plainData',
+        display: 'block',
+        title: '选项',
+        tip: {
+          title: '数据',
+          url: '',
+        },
+        setValue: (target, value) => {
+          const list = parseData(value).filter(({ type }) => 'node' === type);
+          const dataSource = [];
+          const _value = [];
+
+          list.forEach((item, index) => {
+            dataSource.push({
+              label: item.value,
+              value: index,
+              disabled: item.state === 'disabled',
+            });
+            if (item.state === 'active') {
+              _value.push(index);
+            }
+          });
+          target.parent.setPropValue('dataSource', dataSource);
+          target.parent.setPropValue('value', _value);
+        },
+        setter: {
+          componentName: 'MagicEditorSetter',
+          props: {
+            toolbar: ['normal', 'active', 'disable'],
+            disableIcon: true,
+          },
+        },
+      },
+    ],
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onChange',
+          propType: 'func',
+          description: '值发生变化',
+        },
+        {
+          name: 'onVisibleChange',
+          propType: 'func',
+          description: '弹层显示隐藏变化',
+        },
+        {
+          name: 'onRemove',
+          propType: 'func',
+          description: 'Tag 被删除',
+        },
+        {
+          name: 'onSearch',
+          propType: 'func',
+          description: '搜索',
+        },
+      ],
+    },
+  },
+  icon: '',
+  category: '信息输入',
+  snippets,
+};

package/lowcode/pro-select/meta.ts

@@ -0,0 +1,316 @@
+import snippets from './snippets';
+
+export default {
+  componentName: 'ProSelect',
+  title: '选择器',
+  group: '精选组件',
+  category: '基础元素',
+  docUrl: '',
+  screenshot: '',
+  npm: {
+    package: 'lowcode-edit-pro-table',
+    version: '{{version}}',
+    exportName: 'ProSelect',
+    main: '',
+    destructuring: true,
+    subName: '',
+  },
+  props: [
+    {
+      name: 'placeholder',
+      title: {
+        label: '占位提示',
+        tip: '属性: placeholder',
+      },
+      defaultValue: '请选择', // 不生效
+      propType: 'string',
+    },
+    {
+      name: 'defaultValue',
+      propType: {
+        type: 'oneOfType',
+        value: ['string'],
+      },
+      description: '默认值',
+    },
+    {
+      name: 'mode',
+      propType: {
+        type: 'oneOf',
+        value: ['single', 'multiple', 'tag'],
+      },
+      description: '选择器模式',
+    },
+    {
+      name: 'required',
+      title: {
+        label: {
+          type: 'i18n',
+          zh_CN: '是否必填',
+          en_US: 'Required',
+        },
+        tip: {
+          type: 'i18n',
+          zh_CN: '属性: required | 说明: 是否必填',
+          en_US: 'prop: required | description: required',
+        },
+      },
+      setter: 'BoolSetter',
+      supportVariable: true,
+      defaultValue: false,
+      description: '是否必填',
+    },
+    {
+      name: 'disableEdit',
+      title: {
+        label: {
+          type: 'i18n',
+          zh_CN: '禁止编辑',
+          en_US: 'Disable Edit',
+        },
+        tip: {
+          type: 'i18n',
+          zh_CN: '属性: disableEdit | 说明: 禁止编辑',
+          en_US: 'prop: disableEdit | description: disableEdit',
+        },
+      },
+      setter: 'BoolSetter',
+      supportVariable: true,
+      defaultValue: false,
+      description: '禁止编辑',
+    },
+    {
+      name: 'hasClear',
+      title: {
+        label: '清除按钮',
+        tip: '属性: hasClear',
+      },
+      propType: 'bool',
+      defaultValue: false,
+    },
+    {
+      name: 'showSearch',
+      title: {
+        label: '可搜索',
+        tip: '属性: showSearch',
+      },
+      propType: 'bool',
+      defaultValue: false,
+    },
+    {
+      name: 'dataSource',
+    },
+    {
+      type: 'group',
+      title: '其他配置',
+      display: 'block',
+      items: [
+        {
+          name: 'notFoundContent',
+          title: {
+            label: '空文案',
+            tip: 'notFoundContent|弹层内容为空的文案',
+          },
+          setter: 'StringSetter',
+          supportVariable: true,
+          description: '弹层内容为空的文案',
+        },
+        // {
+        //   name: 'disabled',
+        //   title: {
+        //     label: {
+        //       type: 'i18n',
+        //       zh_CN: '是否禁用',
+        //       en_US: 'Disabled',
+        //     },
+        //     tip: {
+        //       type: 'i18n',
+        //       zh_CN: '属性: disabled | 说明: 是否被禁用',
+        //       en_US: 'prop: disabled | description: disabled',
+        //     },
+        //   },
+        //   setter: 'BoolSetter',
+        //   supportVariable: true,
+        //   description: '是否禁用',
+        // },
+        {
+          name: 'hasBorder',
+          title: {
+            label: '边框',
+            tip: '是否有边框',
+          },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          supportVariable: true,
+          description: '是否有边框',
+        },
+        {
+          name: 'autoWidth',
+          title: '下拉等宽',
+          propType: 'bool',
+          setter: 'BoolSetter',
+          supportVariable: true,
+        },
+        {
+          name: 'hasArrow',
+          title: '下拉箭头',
+          propType: 'bool',
+          setter: 'BoolSetter',
+          supportVariable: true,
+          description: '是否有下拉箭头',
+          defaultValue: true,
+        },
+      ],
+    },
+    {
+      type: 'group',
+      title: '高级',
+      display: 'block',
+      items: [
+        {
+          name: 'id',
+          title: {
+            label: {
+              type: 'i18n',
+              zh_CN: '唯一标识',
+              en_US: 'ID',
+            },
+            tip: {
+              type: 'i18n',
+              zh_CN: '属性: id | 说明: 唯一标识',
+              en_US: 'prop: id | description: switch id',
+            },
+          },
+          setter: 'StringSetter',
+          supportVariable: true,
+        },
+        {
+          name: 'name',
+          title: {
+            label: {
+              type: 'i18n',
+              zh_CN: '表单标识',
+              en_US: 'Name',
+            },
+            tip: {
+              type: 'i18n',
+              zh_CN: '属性: name | 说明: 表单标识',
+              en_US: 'prop: name | description: switch name',
+            },
+          },
+          setter: 'StringSetter',
+          supportVariable: true,
+        },
+      ],
+    },
+  ],
+  configure: {
+    props: {
+      isExtends: true,
+      override: [
+        {
+          name: 'defaultValue',
+          title: '默认值',
+          defaultValue: '',
+          setter: {
+            componentName: 'MixedSetter',
+            props: {
+              setters: ['StringSetter', 'ExpressionSetter'],
+            },
+          },
+        },
+        {
+          name: 'dataSource',
+          display: 'block',
+          title: '选项',
+          tip: {
+            title: '数据格式',
+            url: '',
+          },
+          setter: {
+            componentName: 'MixedSetter',
+            props: {
+              setters: [
+                {
+                  componentName: 'ArraySetter',
+                  props: {
+                    itemSetter: {
+                      componentName: 'ObjectSetter',
+                      props: {
+                        config: {
+                          items: [
+                            {
+                              name: 'label',
+                              title: 'label',
+                              setter: 'StringSetter',
+                              supportVariable: true,
+                            },
+                            {
+                              name: 'value',
+                              title: 'value',
+                              setter: 'StringSetter',
+                              supportVariable: true,
+                            },
+                          ],
+                        },
+                      },
+                      initialValue: {
+                        title: 'Title',
+                      },
+                    },
+                  },
+                },
+                'ExpressionSetter',
+              ],
+            },
+          },
+        },
+        {
+          name: 'mode',
+          title: {
+            label: '模式',
+            tip: '属性: mode',
+          },
+          setter: {
+            componentName: 'RadioGroupSetter',
+            props: {
+              defaultValue: 'single',
+              options: [
+                { value: 'single', title: '单选' },
+                { value: 'multiple', title: '多选' },
+                { value: 'tag', title: '标签' },
+              ],
+            },
+          },
+        },
+      ],
+    },
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onChange',
+          propType: 'func',
+          description: '值发生变化',
+        },
+        {
+          name: 'onVisibleChange',
+          propType: 'func',
+          description: '弹层显示隐藏变化',
+        },
+        {
+          name: 'onRemove',
+          propType: 'func',
+          description: 'Tag 被删除',
+        },
+        {
+          name: 'onSearch',
+          propType: 'func',
+          description: '搜索',
+        },
+      ],
+    },
+  },
+  icon: '',
+  snippets,
+};

package/lowcode/pro-select/snippets.design.ts

@@ -0,0 +1,37 @@
+import parseData from '../utils/parse-data';
+
+const plainData = 'Option 1\n*Option 2\nOption 3\nOption 4\nOption 5';
+const list = parseData(plainData).filter(({ type }) => 'node' === type);
+const dataSource = [];
+const value = [];
+
+list.forEach((item, index) => {
+  dataSource.push({
+    label: item.value,
+    value: index,
+    disabled: item.state === 'disabled',
+  });
+  if (item.state === 'active') {
+    value.push(index);
+  }
+});
+
+export default [
+  {
+    title: '选择器',
+    screenshot:
+      'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_select.png',
+    schema: {
+      componentName: 'ProSelect',
+      props: {
+        mode: 'single',
+        hasArrow: true,
+        cacheValue: true,
+        visible: true,
+        plainData,
+        dataSource,
+        value,
+      },
+    },
+  },
+];

package/lowcode/pro-select/snippets.ts

@@ -0,0 +1,29 @@
+export default [
+  {
+    title: '选择器',
+    screenshot:
+      'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_select.png',
+    schema: {
+      componentName: 'ProSelect',
+      props: {
+        mode: 'single',
+        hasArrow: true,
+        cacheValue: true,
+        dataSource: [
+          {
+            value: '1',
+            label: '选项1',
+          },
+          {
+            value: '2',
+            label: '选项2',
+          },
+          {
+            value: '3',
+            label: '选项3',
+          },
+        ],
+      },
+    },
+  },
+];

package/lowcode/pro-select-option/meta.ts

@@ -0,0 +1,36 @@
+module.exports = {
+  componentName: 'ProSelect.Option',
+  title: 'ProSelect.Option',
+  group: '精选组件',
+  category: '基础元素',
+  docUrl: '',
+  screenshot: '',
+  npm: {
+    package: 'lowcode-edit-pro-table',
+    version: '{{version}}',
+    exportName: 'ProSelect',
+    main: '',
+    destructuring: true,
+    subName: 'Option',
+  },
+  props: [
+    {
+      name: 'value',
+      propType: 'string',
+      description: '选项值',
+      defaultValue: 'test',
+    },
+    {
+      name: 'disabled',
+      propType: 'bool',
+      description: '是否禁用',
+      defaultValue: false,
+    },
+  ],
+  configure: {
+    component: {
+      isContainer: true,
+    },
+  },
+  icon: '',
+};