@pisell/materials 6.0.6 → 6.0.8

package/lowcode/pisell-view-grid/meta.ts

@@ -0,0 +1,167 @@
+import snippets from "./snippets";
+
+export default {
+  snippets,
+  componentName: "PisellViewGrid",
+  title: "栅格视图",
+  category: "数据展示",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellViewGrid",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      title: '数据源',
+      display: 'block',
+      type: 'group',
+      items: [
+        {
+          name: 'dataSource',
+          title: { label: '列表数据源', tip: 'dataSource | 列表数据源' },
+          propType: { type: 'arrayOf', value: 'any' },
+          setter: ['JsonSetter', 'VariableSetter'],
+        },
+        {
+          name: 'loading',
+          title: {
+            label: '是否加载中',
+            tip: 'loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位',
+          },
+          propType: 'bool',
+          defaultValue: false,
+          setter: ['BoolSetter', 'VariableSetter'],
+        },
+        {
+          name: 'rowKey',
+          title: {
+            label: '行Key',
+            tip: 'rowKey | 当 renderItem 自定义渲染列表项有效时，自定义每一行的 key 的获取方式',
+          },
+          propType: {
+            type: 'oneOfType',
+            value: ['string', 'function'],
+          },
+          defaultValue: 'id',
+          setter: [
+            'StringSetter',
+            {
+              componentName: 'FunctionSetter',
+              props: {
+                template:
+                  'rowKey(item,${extParams}){\n// 自定义每一行的 key\nreturn `key-${item.id}`;\n}',
+              },
+            },
+            'VariableSetter',
+          ],
+        },
+      ],
+    },
+    {
+      title: '栅格  ',
+      display: 'block',
+      type: 'group',
+      items: [
+        {
+          name: 'columns',
+          title: { label: '列数', tip: 'columns | 列数' },
+          propType: 'number',
+          setter: 'NumberSetter',
+          defaultValue: 3,
+        },
+        {
+          name: 'horizontalGap',
+          title: { label: '水平间隔', tip: 'horizontalGap | 栅格水平间隔，单位为像素(px)' },
+          propType: 'number',
+          setter: {
+            componentName: 'NumberSetter', props: {
+              min: 0,
+            },
+          },
+          defaultValue: 10,
+        },
+        {
+          name: 'verticalGap',
+          title: { label: '垂直间隔', tip: 'verticalGap | 栅格垂直间隔，单位为像素(px)' },
+          propType: 'number',
+          setter: {
+            componentName: 'NumberSetter',
+            props: {
+              min: 0,
+            },
+          },
+          defaultValue: 10,
+        },
+        {
+          name: 'singleRow',
+          title: { label: '一行展示', tip: 'singleRow | 一行展示' },
+          propType: 'boolean',
+          defaultValue: false,
+          setter: 'BoolSetter',
+        },
+      ]
+    },
+    {
+      title: '扩展',
+      display: 'block',
+      type: 'group',
+      items: [
+        {
+          name: 'renderItem',
+          title: {
+            label: '渲染函数',
+            tip: 'renderItem | 当使用 dataSource 时，可以用 `renderItem` 自定义渲染列表项',
+          },
+          propType: 'func',
+          setter: [
+            {
+              componentName: 'SlotSetter',
+              title: '渲染函数插槽',
+              initialValue: {
+                type: 'JSSlot',
+                params: ['item'],
+                value: [
+                  {
+                    componentName: 'List.Item',
+                    props: {},
+                    children: {
+                      componentName: 'Typography.Text',
+                      props: {
+                        children: {
+                          type: 'JSExpression',
+                          value: 'this.item.text',
+                        },
+                      },
+                    },
+                  },
+                ],
+              },
+            },
+            {
+              componentName: 'FunctionSetter',
+              props: {
+                template: 'renderItem(item,${extParams}){\n// 自定义渲染列表项\nreturn `item`;\n}',
+              },
+            },
+            'VariableSetter',
+          ],
+        },
+      ],
+    },
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [],
+    },
+    component: {
+      isContainer: true,
+    },
+  },
+};

package/lowcode/pisell-view-grid/snippets.ts

@@ -0,0 +1,54 @@
+export default [
+  {
+    title: '栅格视图',
+    schema: {
+      componentName: 'PisellViewGrid',
+      props: {
+        dataSource: [
+          {
+            id: 1,
+            text: "Racing car sprays burning fuel into crowd.",
+          },
+          {
+            id: 2,
+            text: "Japanese princess to wed commoner.",
+          },
+          {
+            id: 3,
+            text: "Australian walks 100km after outback crash.",
+          },
+          {
+            id: 4,
+            text: "Man charged over missing wedding girl.",
+          },
+          {
+            id: 5,
+            text: "Los Angeles battles huge wildfires.",
+          },
+        ],
+        columns: 3,
+        horizontalGap: 10,
+        verticalGap: 10,
+        renderItem: {
+          type: "JSSlot",
+          params: ["item"],
+          value: [
+            {
+              componentName: "List.Item",
+              props: {},
+              children: {
+                componentName: "Typography.Text",
+                props: {
+                  children: {
+                    type: "JSExpression",
+                    value: "this.item.text",
+                  },
+                },
+              },
+            },
+          ],
+        },
+      },
+    },
+  },
+];

package/lowcode/profile-menu/meta.ts

@@ -0,0 +1,175 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'ProfileMenu',
+  title: '个人中心菜单',
+  category: '通用',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.0',
+    exportName: 'ProfileMenu',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  props: [
+    {
+      title: {
+        label: "入口菜单设置"
+      },
+      display: "block",
+      type: "group",
+      items: [
+        {
+          name: 'showBadge',
+          title: { label: '显示徽标', tip: '是否在头像右上角显示徽标' },
+          propType: 'bool',
+          defaultValue: false,
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'badgeCount',
+          title: { label: '徽标数量', tip: '徽标显示的数字' },
+          propType: 'number',
+          defaultValue: 1,
+          setter: 'NumberSetter',
+        },
+        {
+          name: 'menuIcon',
+          title: { label: '菜单图标', tip: '左侧菜单图标' },
+          propType: { type: 'oneOfType', value: ['string', 'node'] },
+          setter: [{
+            componentName: 'IconSetter',
+          }, {
+            componentName: 'SlotSetter',
+          }],
+        },
+        {
+          name: 'userName',
+          title: { label: '用户名', tip: '显示的用户名' },
+          propType: 'string',
+          setter: 'StringSetter',
+        },
+        {
+          name: 'email',
+          title: { label: '邮箱', tip: '显示的邮箱地址' },
+          propType: 'string',
+          setter: 'StringSetter',
+        },
+        {
+          name: 'isShowUserName',
+          title: { label: '显示用户名', tip: '是否显示用户名' },
+          propType: 'bool',
+          defaultValue: false,
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'isShowEmail',
+          title: { label: '显示邮箱', tip: '是否显示邮箱' },
+          propType: 'bool',
+          defaultValue: false,
+          setter: 'BoolSetter',
+        },
+      ]
+    },
+    {
+      title: {
+        label: "菜单字段设置"
+      },
+      display: "block",
+      type: "group",
+      items: [
+        {
+          name: 'isShowUserInfo',
+          title: { 
+            label: '显示用户信息展示区域', 
+            tip: '在下拉菜单顶部显示用户信息' 
+          },
+          propType: 'bool',
+          defaultValue: false,
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'menuItems',
+          title: { label: '下拉菜单项', tip: '下拉菜单的配置项' },
+          propType: {
+            type: 'arrayOf',
+            value: {
+              type: 'shape',
+              value: {
+                key: 'string',
+                label: 'string',
+                icon: 'node',
+                danger: 'bool',
+                disabled: 'bool',
+              },
+            },
+          },
+          setter: {
+            componentName: 'ArraySetter',
+            props: {
+              itemSetter: {
+                componentName: 'ObjectSetter',
+                props: {
+                  config: {
+                    items: [
+                      {
+                        name: 'key',
+                        title: '唯一标识',
+                        setter: 'StringSetter',
+                      },
+                      {
+                        name: 'label',
+                        title: '菜单项文本',
+                        setter: 'StringSetter',
+                      },
+                      {
+                        name: 'icon',
+                        title: '图标',
+                        setter: 'IconSetter',
+                      },
+                      {
+                        name: 'danger',
+                        title: '危险项',
+                        setter: 'BoolSetter',
+                      },
+                      {
+                        name: 'disabled',
+                        title: '禁用',
+                        setter: 'BoolSetter',
+                      },
+                    ],
+                  },
+                },
+              },
+            },
+          },
+        },
+        {
+          name: 'placement',
+          title: { label: '弹出位置', tip: '下拉菜单弹出的位置' },
+          propType: {
+            type: 'oneOf',
+            value: ['bottomLeft', 'bottomCenter', 'bottomRight', 'topLeft', 'topCenter', 'topRight'],
+          },
+          defaultValue: 'bottomRight',
+          setter: {
+            componentName: 'SelectSetter',
+            props: {
+              options: [
+                { label: '左下', value: 'bottomLeft' },
+                { label: '下居中', value: 'bottomCenter' },
+                { label: '右下', value: 'bottomRight' },
+                { label: '左上', value: 'topLeft' },
+                { label: '上居中', value: 'topCenter' },
+                { label: '右上', value: 'topRight' },
+              ],
+            },
+          },
+        },
+      ]
+    }
+  ],
+  configure: { supports: { style: true, className: true } },
+};

package/lowcode/profile-menu/snippets.ts

@@ -0,0 +1,71 @@
+export default [
+  {
+    title: '个人中心菜单',
+    screenshot: '',
+    schema: {
+      componentName: 'ProfileMenu',
+      props: {
+        isShowEmail: true,
+        isShowUserName: true,
+        isShowUserInfo: false,
+        avatar: {
+          src: 'https://gimg3.baidu.com/topone/src=https%3A%2F%2Fbkimg.cdn.bcebos.com%2Fsmart%2F9f2f070828381f30e924fc5514595b086e061c955a8c-bkimg-process%2Cv_1%2Crw_1%2Crh_1%2Cmaxl_800%2Cpad_1%3Fx-bce-process%3Dimage%2Fresize%2Cm_pad%2Cw_348%2Ch_348%2Ccolor_ffffff&refer=http%3A%2F%2Fwww.baidu.com&app=2011&size=f200,200&n=0&g=0n&er=404&q=75&fmt=auto&maxorilen2heic=2000000?sec=1737219600&t=2b8ad3e14f26d66ed678724e7e1235fd',
+          alt: 'avatar',
+        },
+        menuIcon: {
+          type: "JSSlot",
+          value: [
+            {
+              componentName: "Icon",
+              props: {
+                type: "MenuOutlined",
+                size: 20,
+                rotate: 0,
+                spin: false,
+              },
+            },
+          ],
+        },
+        menuItems: [
+          {
+            key: 'account',
+            label: 'My Account',
+            icon: {
+              type: "JSSlot",
+              value: [
+                {
+                  componentName: "Icon",
+                  props: {
+                    type: "UserOutlined",
+                  },
+                },
+              ],
+            },
+          },
+          {
+            type: 'divider',
+          },
+          {
+            key: 'logout',
+            label: 'Log Out',
+            icon: {
+              type: "JSSlot",
+              value: [
+                {
+                  componentName: "Icon",
+                  props: {
+                    type: "LogoutOutlined",
+                  },
+                },
+              ],
+            },
+            danger: true,
+          },
+        ],
+        placement: 'bottomRight',
+        showBadge: false,
+        badgeCount: 1,
+      },
+    },
+  },
+];

package/lowcode/submit-button/meta.ts

@@ -763,6 +763,12 @@ const SubmitButtonMeta: ComponentMetadata = {
                 'target => !!target.getProps().getPropValue("href")?.trim()',
             },
           },
+          {
+            name: 'customSubmit',
+            title: '自定义提交',
+            propType: 'func',
+            setter: 'FunctionSetter',
+          },
         ],
       },
       {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "6.0.6",
+  "version": "6.0.8",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",