@pisell/materials 6.7.4 → 6.8.2

package/lowcode/graphic-text-card/meta.ts

@@ -0,0 +1,1145 @@
+import { IPublicTypeComponentMetadata } from '@alilc/lowcode-types';
+import snippets from './snippets';
+
+const GraphicTextCardMeta: IPublicTypeComponentMetadata = {
+  componentName: 'PisellCards.GraphicTextCard',
+  title: '图文卡片',
+  category: '基础组件',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.3',
+    exportName: 'PisellCards',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: 'GraphicTextCard',
+  },
+  configure: {
+    props: [
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Basic',
+            'zh-CN': '基础',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'text',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Text',
+                'zh-CN': '文本内容',
+              },
+              tip: 'text | 卡片显示的文本内容，必填',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['string', 'node'],
+            },
+            setter: ['PisellI18nSetter', 'StringSetter', 'SlotSetter'],
+            isRequired: true,
+          },
+          {
+            name: 'variant',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Variant',
+                'zh-CN': '样式变体',
+              },
+              tip: 'variant | 卡片样式变体',
+            },
+            propType: {
+              type: 'oneOf',
+              value: ['vertical-image', 'vertical-icon', 'horizontal', 'card'],
+            },
+            setter: [
+              {
+                componentName: 'SelectSetter',
+                props: {
+                  options: [
+                    {
+                      title: '垂直布局-图片',
+                      value: 'vertical-image',
+                    },
+                    {
+                      title: '垂直布局-图标',
+                      value: 'vertical-icon',
+                    },
+                    {
+                      title: '横向布局',
+                      value: 'horizontal',
+                    },
+                    {
+                      title: '卡片式',
+                      value: 'card',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+            defaultValue: 'vertical-image',
+          },
+          {
+            name: 'size',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Size',
+                'zh-CN': '尺寸',
+              },
+              tip: 'size | 卡片尺寸',
+            },
+            propType: {
+              type: 'oneOf',
+              value: ['small', 'default', 'large'],
+            },
+            setter: [
+              {
+                componentName: 'RadioGroupSetter',
+                props: {
+                  options: [
+                    {
+                      title: '小',
+                      value: 'small',
+                    },
+                    {
+                      title: '中',
+                      value: 'default',
+                    },
+                    {
+                      title: '大',
+                      value: 'large',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+            defaultValue: 'default',
+          },
+          {
+            name: 'clickable',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Clickable',
+                'zh-CN': '可点击',
+              },
+              tip: 'clickable | 是否可点击',
+            },
+            propType: 'bool',
+            setter: ['BoolSetter', 'VariableSetter'],
+            defaultValue: true,
+          },
+          {
+            name: 'className',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'ClassName',
+                'zh-CN': '样式类名',
+              },
+              tip: 'className | 自定义样式类名',
+            },
+            propType: 'string',
+            setter: 'StringSetter',
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Graphic',
+            'zh-CN': '图形区域',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'image',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Image',
+                'zh-CN': '图片地址',
+              },
+              tip: 'image | 图片地址（与 icon 二选一）',
+            },
+            propType: 'string',
+            setter: ['StringSetter', 'VariableSetter'],
+          },
+          {
+            name: 'icon',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Icon',
+                'zh-CN': '图标',
+              },
+              tip: 'icon | 图标（与 image 二选一）',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node', 'string'],
+            },
+            setter: [
+              {
+                componentName: 'SlotSetter',
+                initialValue: {
+                  type: 'JSSlot',
+                  value: [
+                    {
+                      componentName: 'Icon',
+                      props: {
+                        type: 'SmileOutlined',
+                        size: 24,
+                      },
+                    },
+                  ],
+                },
+              },
+              'StringSetter',
+              'VariableSetter',
+            ],
+          },
+          {
+            name: 'graphicSlot',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Graphic Slot',
+                'zh-CN': '图形区域插槽',
+              },
+              tip: 'graphicSlot | 图形区域插槽（替换 image 和 icon）',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node'],
+            },
+            setter: 'SlotSetter',
+          },
+          {
+            name: 'graphicConfig',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Graphic Config',
+                'zh-CN': '图形配置',
+              },
+              tip: 'graphicConfig | 图形区域配置',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'width',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Width',
+                          'zh-CN': '宽度',
+                        },
+                        tip: '图形区域宽度（单位：px），不设置则自动计算',
+                      },
+                      propType: 'number',
+                      setter: ['NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'height',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Height',
+                          'zh-CN': '高度',
+                        },
+                        tip: '图形区域高度（单位：px），不设置则自动计算',
+                      },
+                      propType: 'number',
+                      setter: ['NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'borderRadius',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Border Radius',
+                          'zh-CN': '圆角',
+                        },
+                        tip: '图形区域圆角',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['string', 'number'],
+                      },
+                      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'background',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Background',
+                          'zh-CN': '背景色',
+                        },
+                        tip: '图形区域背景色',
+                      },
+                      propType: 'string',
+                      setter: ['ColorSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'border',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Border',
+                          'zh-CN': '边框',
+                        },
+                        tip: '图形区域边框',
+                      },
+                      propType: 'string',
+                      setter: ['StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'boxShadow',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Box Shadow',
+                          'zh-CN': '阴影',
+                        },
+                        tip: '图形区域阴影',
+                      },
+                      propType: 'string',
+                      setter: ['StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'padding',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Padding',
+                          'zh-CN': '内边距',
+                        },
+                        tip: '图形区域内边距',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['string', 'number'],
+                      },
+                      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'iconSize',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Icon Size',
+                          'zh-CN': '图标大小',
+                        },
+                        tip: '图标大小（当使用 icon 时有效，单位：px）',
+                      },
+                      propType: 'number',
+                      setter: ['NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'iconColor',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Icon Color',
+                          'zh-CN': '图标颜色',
+                        },
+                        tip: '图标颜色（当使用 icon 时有效）',
+                      },
+                      propType: 'string',
+                      setter: ['ColorSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'style',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Style',
+                          'zh-CN': '自定义样式',
+                        },
+                        tip: '图形区域自定义样式',
+                      },
+                      propType: 'object',
+                      setter: 'StyleSetter',
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Badge',
+            'zh-CN': '角标',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'badge',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Badge Config',
+                'zh-CN': '角标配置',
+              },
+              tip: 'badge | 角标配置对象',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'type',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Type',
+                          'zh-CN': '角标类型',
+                        },
+                        tip: '角标类型',
+                      },
+                      propType: {
+                        type: 'oneOf',
+                        value: ['dot', 'number', 'text'],
+                      },
+                      setter: [
+                        {
+                          componentName: 'RadioGroupSetter',
+                          props: {
+                            options: [
+                              {
+                                title: '红点',
+                                value: 'dot',
+                              },
+                              {
+                                title: '数字',
+                                value: 'number',
+                              },
+                              {
+                                title: '文本',
+                                value: 'text',
+                              },
+                            ],
+                          },
+                        },
+                        'VariableSetter',
+                      ],
+                      defaultValue: 'dot',
+                    },
+                    {
+                      name: 'content',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Content',
+                          'zh-CN': '角标内容',
+                        },
+                        tip: '角标内容（数字或文本）',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['string', 'number', 'node'],
+                      },
+                      setter: ['StringSetter', 'NumberSetter', 'SlotSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'position',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Position',
+                          'zh-CN': '角标位置',
+                        },
+                        tip: '角标位置',
+                      },
+                      propType: {
+                        type: 'oneOf',
+                        value: ['top-right', 'top-left', 'bottom-right', 'bottom-left'],
+                      },
+                      setter: [
+                        {
+                          componentName: 'SelectSetter',
+                          props: {
+                            options: [
+                              {
+                                title: '右上',
+                                value: 'top-right',
+                              },
+                              {
+                                title: '左上',
+                                value: 'top-left',
+                              },
+                              {
+                                title: '右下',
+                                value: 'bottom-right',
+                              },
+                              {
+                                title: '左下',
+                                value: 'bottom-left',
+                              },
+                            ],
+                          },
+                        },
+                        'VariableSetter',
+                      ],
+                      defaultValue: 'top-right',
+                    },
+                    {
+                      name: 'offset',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Offset',
+                          'zh-CN': '偏移量',
+                        },
+                        tip: '角标偏移量 [x, y]',
+                      },
+                      propType: 'object',
+                      setter: 'JsonSetter',
+                    },
+                    {
+                      name: 'color',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Color',
+                          'zh-CN': '角标颜色',
+                        },
+                        tip: '角标颜色',
+                      },
+                      propType: 'string',
+                      setter: ['ColorSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'style',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Style',
+                          'zh-CN': '角标样式',
+                        },
+                        tip: '角标自定义样式',
+                      },
+                      propType: 'object',
+                      setter: 'StyleSetter',
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Slot',
+            'zh-CN': '插槽',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'prefixSlot',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Prefix Slot',
+                'zh-CN': '前置插槽',
+              },
+              tip: 'prefixSlot | 前置插槽',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node'],
+            },
+            setter: 'SlotSetter',
+          },
+          {
+            name: 'suffixSlot',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Suffix Slot',
+                'zh-CN': '后置插槽',
+              },
+              tip: 'suffixSlot | 后置插槽',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node'],
+            },
+            setter: 'SlotSetter',
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Text Config',
+            'zh-CN': '文本配置',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'textConfig',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Text Config',
+                'zh-CN': '文本配置',
+              },
+              tip: 'textConfig | 文本配置',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'fontSize',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Font Size',
+                          'zh-CN': '字体大小',
+                        },
+                        tip: '字体大小（单位：px）',
+                      },
+                      propType: 'number',
+                      setter: ['NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'fontWeight',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Font Weight',
+                          'zh-CN': '字体粗细',
+                        },
+                        tip: '字体粗细',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['string', 'number'],
+                      },
+                      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'color',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Color',
+                          'zh-CN': '文本颜色',
+                        },
+                        tip: '文本颜色',
+                      },
+                      propType: 'string',
+                      setter: ['ColorSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'maxLines',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Max Lines',
+                          'zh-CN': '最大行数',
+                        },
+                        tip: '最大显示行数',
+                      },
+                      propType: 'number',
+                      setter: ['NumberSetter', 'VariableSetter'],
+                      defaultValue: 1,
+                    },
+                    {
+                      name: 'ellipsis',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Ellipsis',
+                          'zh-CN': '显示省略号',
+                        },
+                        tip: '是否显示省略号',
+                      },
+                      propType: 'bool',
+                      setter: ['BoolSetter', 'VariableSetter'],
+                      defaultValue: true,
+                    },
+                    {
+                      name: 'textAlign',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Text Align',
+                          'zh-CN': '文本对齐',
+                        },
+                        tip: '文本对齐方式',
+                      },
+                      propType: {
+                        type: 'oneOf',
+                        value: ['left', 'center', 'right'],
+                      },
+                      setter: [
+                        {
+                          componentName: 'RadioGroupSetter',
+                          props: {
+                            options: [
+                              {
+                                title: '左对齐',
+                                value: 'left',
+                              },
+                              {
+                                title: '居中',
+                                value: 'center',
+                              },
+                              {
+                                title: '右对齐',
+                                value: 'right',
+                              },
+                            ],
+                          },
+                        },
+                        'VariableSetter',
+                      ],
+                      defaultValue: 'left',
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Width Config',
+            'zh-CN': '宽度配置',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'widthMode',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Width Mode',
+                'zh-CN': '宽度模式',
+              },
+              tip: 'widthMode | 宽度模式',
+            },
+            propType: {
+              type: 'oneOf',
+              value: ['auto', 'fixed', 'full'],
+            },
+            setter: [
+              {
+                componentName: 'RadioGroupSetter',
+                props: {
+                  options: [
+                    {
+                      title: '内容撑满',
+                      value: 'auto',
+                    },
+                    {
+                      title: '固定宽度',
+                      value: 'fixed',
+                    },
+                    {
+                      title: '撑满父容器',
+                      value: 'full',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+            defaultValue: 'auto',
+          },
+          {
+            name: 'width',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Width',
+                'zh-CN': '固定宽度',
+              },
+              tip: 'width | 固定宽度值（widthMode=fixed 时有效）',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['string', 'number'],
+            },
+            setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+          },
+          {
+            name: 'maxWidth',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Max Width',
+                'zh-CN': '最大宽度',
+              },
+              tip: 'maxWidth | 最大宽度（widthMode=auto 时有效）',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['string', 'number'],
+            },
+            setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+            defaultValue: 400,
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'State',
+            'zh-CN': '状态',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'active',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Active State',
+                'zh-CN': '激活状态',
+              },
+              tip: 'active | 激活状态配置',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'value',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Is Active',
+                          'zh-CN': '是否激活',
+                        },
+                        tip: '是否处于激活状态',
+                      },
+                      propType: 'bool',
+                      setter: ['BoolSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'className',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'ClassName',
+                          'zh-CN': '激活类名',
+                        },
+                        tip: '激活状态下的自定义类名',
+                      },
+                      propType: 'string',
+                      setter: 'StringSetter',
+                    },
+                    {
+                      name: 'style',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Style',
+                          'zh-CN': '激活样式',
+                        },
+                        tip: '激活状态下的自定义样式',
+                      },
+                      propType: 'object',
+                      setter: 'StyleSetter',
+                    },
+                    {
+                      name: 'extra',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Extra',
+                          'zh-CN': '额外内容',
+                        },
+                        tip: '激活状态下的额外渲染内容',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['node', 'string', 'number', 'object'],
+                      },
+                      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                  ],
+                },
+              },
+            },
+          },
+          {
+            name: 'disabled',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Disabled State',
+                'zh-CN': '禁用状态',
+              },
+              tip: 'disabled | 禁用状态配置',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'value',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Is Disabled',
+                          'zh-CN': '是否禁用',
+                        },
+                        tip: '是否处于禁用状态',
+                      },
+                      propType: 'bool',
+                      setter: ['BoolSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'className',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'ClassName',
+                          'zh-CN': '禁用类名',
+                        },
+                        tip: '禁用状态下的自定义类名',
+                      },
+                      propType: 'string',
+                      setter: 'StringSetter',
+                    },
+                    {
+                      name: 'style',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Style',
+                          'zh-CN': '禁用样式',
+                        },
+                        tip: '禁用状态下的自定义样式',
+                      },
+                      propType: 'object',
+                      setter: 'StyleSetter',
+                    },
+                    {
+                      name: 'extra',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Extra',
+                          'zh-CN': '额外内容',
+                        },
+                        tip: '禁用状态下的额外渲染内容',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['node', 'string', 'number', 'object'],
+                      },
+                      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                  ],
+                },
+              },
+            },
+          },
+          {
+            name: 'loading',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Loading State',
+                'zh-CN': '加载状态',
+              },
+              tip: 'loading | 加载状态配置',
+            },
+            propType: 'object',
+            setter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'value',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Is Loading',
+                          'zh-CN': '是否加载中',
+                        },
+                        tip: '是否处于加载状态',
+                      },
+                      propType: 'bool',
+                      setter: ['BoolSetter', 'VariableSetter'],
+                    },
+                    {
+                      name: 'className',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'ClassName',
+                          'zh-CN': '加载类名',
+                        },
+                        tip: '加载状态下的自定义类名',
+                      },
+                      propType: 'string',
+                      setter: 'StringSetter',
+                    },
+                    {
+                      name: 'style',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Style',
+                          'zh-CN': '加载样式',
+                        },
+                        tip: '加载状态下的自定义样式',
+                      },
+                      propType: 'object',
+                      setter: 'StyleSetter',
+                    },
+                    {
+                      name: 'extra',
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'Extra',
+                          'zh-CN': '额外内容',
+                        },
+                        tip: '加载状态下的额外渲染内容，如 Loading 组件',
+                      },
+                      propType: {
+                        type: 'oneOfType',
+                        value: ['node', 'string', 'number', 'object'],
+                      },
+                      setter: ['SlotSetter', 'StringSetter', 'VariableSetter'],
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        ],
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Advanced',
+            'zh-CN': '高级',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'render',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Custom Render',
+                'zh-CN': '自定义渲染',
+              },
+              tip: 'render | 自定义渲染函数，完全控制卡片内容',
+            },
+            propType: 'func',
+            setter: [
+              {
+                componentName: 'FunctionSetter',
+                props: {
+                  template:
+                    'render(props,${extParams}){\n// 自定义渲染卡片内容\nreturn <div>{props.text}</div>;\n}',
+                },
+              },
+              'VariableSetter',
+            ],
+          },
+          {
+            name: 'children',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Children',
+                'zh-CN': '子内容',
+              },
+              tip: 'children | 自定义子内容',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node'],
+            },
+            setter: 'SlotSetter',
+          },
+        ],
+      },
+    ],
+    supports: {
+      style: true,
+      className: true,
+      events: [
+        {
+          name: 'onClick',
+          template:
+            'onClick(event, ${extParams}){\n// 点击卡片时的回调\nconsole.log(\'onClick\', event);\n}',
+        },
+      ],
+    },
+    component: {
+      isContainer: false,
+    },
+  },
+};
+
+export default {
+  ...GraphicTextCardMeta,
+  snippets,
+};
+