@pisell/materials 6.0.6 → 6.0.8

package/lowcode/organization-tenant-switch/meta.ts

@@ -0,0 +1,127 @@
+import { ComponentMetadata, Snippet } from "@alilc/lowcode-types";
+
+const DivMeta: ComponentMetadata = {
+  componentName: "OrganizationTenantSwitcher",
+  title: "企业租户切换",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.3",
+    exportName: "OrganizationTenantSwitcher",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      name: "showLogo",
+      title: "显示商标",
+      setter: "BoolSetter",
+      defaultValue: true,
+      supportVariable: true
+    },
+    {
+      name: "showName",
+      title: "显示企业名称",
+      setter: "BoolSetter", 
+      defaultValue: true,
+      supportVariable: true
+    },
+    {
+      name: "readOnly",
+      title: "是否只读",
+      setter: "BoolSetter",
+      defaultValue: false,
+      supportVariable: true
+    },
+    /*
+    {
+      name: "options",
+      title: "企业列表",
+      setter: {
+        componentName: "ArraySetter",
+        props: {
+          itemSetter: {
+            componentName: "ObjectSetter",
+            props: {
+              config: {
+                items: [
+                  {
+                    name: "label",
+                    title: "企业名称",
+                    propType: "string",
+                    setter: "StringSetter",
+                    isRequired: true,
+                  },
+                  {
+                    name: "value",
+                    title: "企业ID",
+                    propType: "string",
+                    setter: "StringSetter",
+                    isRequired: true,
+                  },
+                  {
+                    name: "logo",
+                    title: "企业Logo",
+                    propType: "string",
+                    setter: "StringSetter",
+                  },
+                ]
+              }
+            }
+          }
+        }
+      },
+      defaultValue: [],
+      supportVariable: true
+    }
+    */
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [
+        {
+          name: "onClick",
+          template:
+            "onClick(event,${extParams}){\n// 点击时的回调\nconsole.log('onClick', event);}",
+        },
+      ],
+    },
+    component: {
+      isContainer: true,
+    },
+  },
+};
+const snippets: Snippet[] = [
+  {
+    title: "企业租户切换",
+    screenshot: "",
+    schema: {
+      title: "企业租户切换",
+      componentName: "OrganizationTenantSwitcher",
+      props: {
+        showLogo: true,
+        showName: true,
+        options: [
+          {
+            label: "企业1",
+            value: "1",
+            logo: 'https://pisell2-dev.s3.cn-north-1.amazonaws.com.cn/media/tenant-0/2025/01/10/01jh7vas0ga68jgajsarv9g46c.png'
+          },
+          {
+            label: "企业2",
+            value: "2",
+          }
+        ]
+      },
+    },
+  },
+];
+
+export default {
+  ...DivMeta,
+  snippets,
+};

package/lowcode/page-header/meta.ts

@@ -3,155 +3,99 @@ import snippets from './snippets';
 export default {
   snippets,
   componentName: 'PageHeader',
-  title: '页头',
+  title: '页面头部',
   category: '导航',
-  docUrl: "",
-  screenshot: "",
-  devMode: "proCode",
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
   npm: {
-    package: "@pisell/materials",
-    version: "1.0.1",
-    exportName: "PageHeader",
-    main: "src/index.tsx",
+    package: '@pisell/materials',
+    version: '1.0.1',
+    exportName: 'PageHeader',
+    main: 'src/index.tsx',
     destructuring: true,
-    subName: "",
+    subName: '',
   },
   props: [
     {
       name: 'title',
-      title: { label: '标题', tip: '自定义标题文字' },
-      propType: { type: 'oneOfType', value: ['string', 'node'] },
-    },
-    {
-      name: 'subTitle',
-      title: { label: '二级标题', tip: '自定义的二级标题文字' },
-      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '标题',
+          'en-US': 'Title',
+          'zh-HK': '標題',
+        },
+      },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
     },
     {
-      name: 'ghost',
-      title: { label: 'ghost风格', tip: 'ghost风格' },
-      propType: 'bool',
+      name: 'showTitle',
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '是否显示标题',
+          'en-US': 'Show Title',
+          'zh-HK': '是否顯示標題',
+        },
+      },
       defaultValue: true,
-    },
-    // {
-    //   name: 'backIcon',
-    //   title: {
-    //     label: '返回按钮',
-    //     tip: '自定义 back icon ，如果为 false 不渲染 back icon',
-    //   },
-    //   propType: { type: 'oneOfType', value: ['node', 'bool'] },
-    // },
-    {
-      name: 'tags',
-      title: { label: 'tag 列表', tip: 'title 旁的 tag 列表' },
-      propType: 'node',
-    },
-    {
-      name: 'extra',
-      title: { label: '操作区', tip: '操作区，位于 title 行的行尾' },
-      propType: 'node',
+      setter: 'BoolSetter',
     },
     {
-      name: 'footer',
-      title: { label: '页脚', tip: 'PageHeader 的页脚，一般用于渲染 TabBar' },
-      propType: 'node',
+      name: 'subTitle',
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '副标题',
+          'en-US': 'Sub Title',
+          'zh-HK': '副標題',
+        },
+      },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
     },
     {
-      name: 'avatar',
-      title: { label: '头像', tip: '标题栏旁的头像' },
-      propType: 'object',
-      supportVariable: false,
-      setter: [
-        {
-          componentName: 'ObjectSetter',
-          props: {
-            config: {
-              items: [
-                {
-                  name: 'src',
-                  title: { label: '地址', tip: '头像地址' },
-                  setter: {
-                    componentName: 'StringSetter',
-                  },
-                },
-              ],
-            },
-          },
+      name: 'showSubTitle',
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '是否显示副标题',
+          'en-US': 'Show Sub Title',
+          'zh-HK': '是否顯示副標題',
         },
-        'JsonSetter',
-      ],
+      },
+      defaultValue: true,
+      setter: 'BoolSetter',
     },
     {
-      name: 'breadcrumb',
-      title: { label: '面包屑的配置', tip: '面包屑的配置' },
-      propType: 'object',
-      supportVariable: false,
-      setter: [
-        {
-          componentName: 'ObjectSetter',
-          props: {
-            config: {
-              items: [
-                {
-                  name: 'routes',
-                  title: { label: '路由栈信息', tip: '路由栈信息' },
-                  setter: {
-                    componentName: 'ArraySetter',
-                    props: {
-                      itemSetter: {
-                        componentName: 'ObjectSetter',
-                        initialValue: {
-                          path: 'path',
-                          breadcrumbName: 'pathName',
-                        },
-                        isRequired: true,
-                        props: {
-                          config: {
-                            items: [
-                              {
-                                name: 'path',
-                                defaultValue: 'path',
-                                title: { label: '路径', tip: 'path | 路径' },
-                                setter: 'StringSetter',
-                              },
-                              {
-                                name: 'breadcrumbName',
-                                defaultValue: 'pathName',
-                                title: {
-                                  label: '名称',
-                                  tip: 'breadcrumbName | 名称',
-                                },
-                                setter: 'StringSetter',
-                              },
-                            ],
-                          },
-                        },
-                      },
-                    },
-                  },
-                },
-              ],
-            },
-          },
+      name: 'showDivider',
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '是否显示分割线',
+          'en-US': 'Show Divider',
+          'zh-HK': '是否顯示分割線',
         },
-        'JsonSetter',
-      ],
+      },
+      setter: 'BoolSetter',
     },
     {
-      name: 'onBack',
-      title: { label: '返回按钮的点击事件', tip: '返回按钮的点击事件' },
-      propType: 'func',
+      name: 'extra',
+      title: {
+        label: {
+          type: 'i18n',
+          'zh-CN': '额外内容',
+          'en-US': 'Extra',
+          'zh-HK': '額外內容',
+        },
+      },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
     },
   ],
   configure: {
     supports: {
       style: true,
-      events: [
-        {
-          name: 'onBack',
-          template: "onBack(${extParams}){\n// 返回按钮的点击事件\nconsole.log('onBack');}",
-        },
-      ],
+      events: [],
     },
   },
 };

package/lowcode/page-header/snippets.ts

@@ -1,6 +1,6 @@
 export default [
   {
-    title: '页头',
+    title: '页面头部',
     screenshot: 'https://alifd.alicdn.com/fusion-cool/icons/icon-antd/page-header-1.jpg',
     schema: {
       componentName: 'PageHeader',

package/lowcode/pisell-avatar/meta.ts

@@ -0,0 +1,111 @@
+import snippets from "./snippets";
+
+export default {
+  snippets,
+  componentName: "PisellAvatar",
+  title: "头像",
+  category: "数据展示",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellAvatar",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      name: "icon",
+      title: { label: "头像图标", tip: "icon | 设置头像的自定义图标" },
+      propType: "node",
+    },
+    {
+      name: "shape",
+      title: { label: "头像形状", tip: "shape | 指定头像的形状" },
+      propType: { type: "oneOf", value: ["circle", "square"] },
+      defaultValue: "circle",
+    },
+    {
+      name: "borderRadius",
+      title: { label: "圆角度数", tip: "borderRadius | 方形头像的圆角大小" },
+      propType: "number",
+      defaultValue: 4,
+      condition: {
+        type: "JSFunction",
+        value: "target => target.getProps().getPropValue('shape') === 'square'",
+      },
+    },
+    {
+      name: "size",
+      title: { label: "尺寸", tip: "size | 设置头像的大小" },
+      propType: {
+        type: "oneOf",
+        value: ["xs", "sm", "md", "lg", "xl", "xxl"],
+      },
+      defaultValue: "xs",
+    },
+    {
+      name: "useTextAvatar",
+      title: { label: "使用文本头像", tip: "useTextAvatar | 是否使用文本作为头像" },
+      propType: "bool",
+      defaultValue: false,
+    },
+    {
+      name: "children",
+      title: { label: "文本内容", tip: "children | 文本头像的内容" },
+      propType: "string",
+      condition: {
+        type: "JSFunction",
+        value: "target => target.getProps().getPropValue('useTextAvatar')",
+      },
+    },
+    {
+      name: "src",
+      title: { label: "图片地址", tip: "src | 图片类头像的资源地址" },
+      propType: "string",
+    },
+    {
+      name: "alt",
+      title: {
+        label: "替代文本",
+        tip: "alt | 图像无法显示时的替代文本",
+      },
+      propType: "string",
+      setter: "PisellI18nSetter",
+    },
+    {
+      name: "onError",
+      title: {
+        label: "图片加载失败的事件",
+        tip: "图片加载失败的事件，返回 false 会关闭组件默认的 fallback 行为",
+      },
+      propType: "func",
+    },
+    {
+      name: "gap",
+      title: {
+        label: "文字边距",
+        tip: "gap | 字符类型距离左右两侧边界单位像素",
+      },
+      propType: "number",
+    },
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [
+        {
+          name: "onError",
+          template:
+            "onError(${extParams}){\n// 图片加载失败的事件\nconsole.log('onError');}",
+        },
+        {
+          name: "onClick",
+          template:
+            "onClick(event,${extParams}){\n// 点击时的回调\nconsole.log('onClick', event);}",
+        }
+      ],
+    },
+  },
+};

package/lowcode/pisell-avatar/snippets.ts

@@ -0,0 +1,14 @@
+export default [
+  {
+    title: '头像',
+    screenshot: 'https://alifd.alicdn.com/fusion-cool/icons/icon-antd/avatar-1.jpg',
+    schema: {
+      componentName: 'PisellAvatar',
+      props: {
+        src: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png',
+        borderRadius: 4,
+        size: 'xs'
+      },
+    },
+  },
+];

package/lowcode/pisell-tags/meta.ts

@@ -0,0 +1,123 @@
+import snippets from "./snippets";
+
+export default {
+  snippets,
+  componentName: "PisellTags",
+  title: "标签",
+  category: "数据展示",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellTags",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      name: "children",
+      title: { label: "内容" },
+      propType: { type: "oneOfType", value: ["string", "node"] },
+      setter: ['PisellI18nSetter', 'SlotSetter']
+    },
+    {
+      name: 'type',
+      title: { label: '展示类型' },
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [
+            {
+              title: '填充',
+              value: 'pill_color',
+            },
+            {
+              title: '边框',
+              value: 'pill_outline',
+            },
+          ],
+        },
+      },
+      propType: { type: 'oneOf', value: ['pill_color', 'pill_outline'] },
+      defaultValue: 'pill_color',
+    },
+    {
+      name: "icon",
+      title: {
+        label: {
+          type: "i18n",
+          "en-US": "icon",
+          "zh-CN": "图标",
+        },
+        tip: "icon | Set the icon component of the button",
+      },
+      propType: { type: "oneOfType", value: ["node"] },
+      setter: [{
+        componentName: "SlotSetter",
+        initialValue: {
+          type: "JSSlot",
+          value: [
+            {
+              componentName: "Icon",
+              props: {
+                type: "SmileOutlined",
+                size: 20,
+                rotate: 0,
+                spin: false,
+              },
+            },
+          ],
+        },
+        defaultValue: null
+      }],
+    },
+    {
+      name: 'color',
+      title: { label: '颜色' },
+      setter: [
+        {
+          componentName: 'RadioGroupSetter',
+          props: {
+            options: [
+              {
+                title: 'Success',
+                value: 'success',
+              },
+              {
+                title: 'Warning',
+                value: 'warning',
+              },
+              {
+                title: 'Error',
+                value: 'error',
+              },
+              {
+                title: 'Gray',
+                value: 'gray',
+              },
+            ],
+          },
+        },
+        'ColorSetter', "StringSetter"
+      ],
+      propType: { type: 'oneOf', value: ['success', 'warning', 'error', 'gray'] },
+      defaultValue: 'success',
+    },
+  ],
+  configure: {
+    component: { isContainer: true },
+    supports: {
+      style: true,
+      events: [
+        {
+          name: "onClick",
+          template:
+            "onClick(event,${extParams}){\n// 点击时的回调\nconsole.log('onClick', event);}",
+        },
+      ],
+    },
+  },
+};

package/lowcode/pisell-tags/snippets.ts

@@ -0,0 +1,14 @@
+export default [
+  {
+    title: '标签',
+    screenshot: 'https://alifd.alicdn.com/fusion-cool/icons/icon-antd/tag-1.png',
+    schema: {
+      componentName: 'PisellTags',
+      props: {
+        children: '标签',
+        type: "pill_color",
+        color: 'success'
+      },
+    },
+  },
+];