@dckj-npm/dc-material 0.1.358 → 0.1.360

package/lowcode/teletext-list/meta.ts

@@ -1,845 +1,846 @@
-import {
-  IPublicTypeComponentMetadata,
-  IPublicTypeSnippet,
-  IPublicTypeConfigure,
-} from '@alilc/lowcode-types'
-
-const TeletextListMeta: IPublicTypeComponentMetadata = {
-  group: '低代码组件',
-  componentName: 'TeletextList',
-  title: '图文列表',
-  docUrl: '',
-  screenshot: '',
-  devMode: 'proCode',
-  npm: {
-    package: '@dckj-npm/dc-material',
-    version: '0.1.8',
-    exportName: 'TeletextList',
-    main: 'src/index.tsx',
-    destructuring: true,
-    subName: '',
-  },
-  configure: {
-    props: [
-      {
-        title: {
-          label: {
-            type: 'i18n',
-            'en-US': 'type',
-            'zh-CN': '类型',
-          },
-        },
-        name: 'type',
-        description: '类型',
-        setter: {
-          componentName: 'RadioGroupSetter',
-          props: {
-            dataSource: [
-              {
-                label: '图文',
-                value: 'textAndImg',
-              },
-              {
-                label: '仅有图片',
-                value: 'imgOnly',
-              },
-              {
-                label: '仅有文字',
-                value: 'textOnly',
-              },
-            ],
-            options: [
-              {
-                label: '图文',
-                value: 'textAndImg',
-              },
-              {
-                label: '仅有图片',
-                value: 'imgOnly',
-              },
-              {
-                label: '仅有文字',
-                value: 'textOnly',
-              },
-            ],
-          },
-          initialValue: 'textAndImg',
-        },
-      },
-      {
-        title: {
-          label: {
-            type: 'i18n',
-            'en-US': 'imagePlacement',
-            'zh-CN': '图片位置',
-          },
-        },
-        name: 'imagePlacement',
-        description: '图片位置',
-        setter: {
-          componentName: 'RadioGroupSetter',
-          props: {
-            dataSource: [
-              {
-                label: '左',
-                value: 'left',
-              },
-              {
-                label: '右',
-                value: 'right',
-              },
-              {
-                label: '上',
-                value: 'top',
-              },
-              {
-                label: '下',
-                value: 'bottom',
-              },
-              {
-                label: '无',
-                value: 'none',
-              },
-            ],
-            options: [
-              {
-                label: '左',
-                value: 'left',
-              },
-              {
-                label: '右',
-                value: 'right',
-              },
-              {
-                label: '上',
-                value: 'top',
-              },
-              {
-                label: '下',
-                value: 'bottom',
-              },
-              {
-                label: '无',
-                value: 'none',
-              },
-            ],
-          },
-          initialValue: 'left',
-        },
-        extraProps: {
-          setValue: (target, value) => {
-            target.getProps().setPropValue('imagePlacement', value)
-          },
-        },
-      },
-      {
-        title: '图片宽度',
-        name: 'imgWidth',
-        description: '图片宽度',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 100,
-          defaultValue: 100,
-        },
-      },
-      {
-        title: '图片高度',
-        name: 'imgHeight',
-        description: '图片高度',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 100,
-          defaultValue: 100,
-        },
-      },
-      {
-        title: '数据源绑定',
-        name: 'dataListBind',
-        setter: {
-          componentName: 'SetterFormVariable',
-          props: {
-            attributes: [
-              {
-                label: '图文数据',
-                value: 'dataList',
-                children: [
-                  { label: '图片链接', value: 'image' },
-                  { label: '类型', value: 'itemType' },
-                  { label: '标题', value: 'title' },
-                  { label: '说明', value: 'description' },
-                ],
-              },
-            ],
-          },
-        },
-        extraProps: {
-          setValue: (target, value) => {
-            console.log('dataList setValue', target, value)
-          },
-        },
-      },
-      {
-        title: '标题',
-        name: 'title',
-        description: '标题',
-        setter: {
-          componentName: 'StringSetter',
-          isRequired: false,
-          initialValue: '',
-        },
-      },
-      {
-        title: {
-          label: {
-            type: 'i18n',
-            'en-US': 'moreText',
-            'zh-CN': '更多文字',
-          },
-          tip: 'moreText | 更多文字',
-        },
-        name: 'moreText',
-        description: '更多文字',
-        setter: {
-          componentName: 'StringSetter',
-          isRequired: false,
-          initialValue: '',
-        },
-      },
-      {
-        title: '文字行数',
-        name: 'textLines',
-        description: '文字行数',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 2,
-          defaultValue: 2,
-          props: {
-            min: 2,
-            max: 4,
-          },
-        },
-        extraProps: {
-          setValue(target, value) {
-            target.getProps().setPropValue('textLines', value)
-            const schema = target?.node?.schema
-            const node = target?.node
-
-            // 获取当前文本组件数量
-            const currentLength =
-              schema?.children?.filter(
-                (child) =>
-                  child.componentName === 'NextText' && child.props.key?.startsWith('text-'),
-              )?.length || 0
-
-            if (value > currentLength) {
-              // 需要添加新的文本组件
-              for (let i = currentLength + 1; i <= value; i++) {
-                const newChild = {
-                  componentName: 'NextText',
-                  props: {
-                    type: 'inherit',
-                    children: '基于 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台',
-                    key: `text-${i}`,
-                  },
-                }
-                console.log('node', node, 'node-children', node?.children)
-                node?.children?.push(newChild)
-              }
-            } else if (value < currentLength) {
-              // 需要移除多余的文本组件
-              node?.children?.filter(
-                (child) =>
-                  !(
-                    child.componentName === 'NextText' &&
-                    child.props?.key?.startsWith('text-') &&
-                    parseInt(child?.props?.key.split('-')[1]) > value
-                  ),
-              )
-            }
-
-            // 更新数据源绑定的配置
-            const dataListBindProp = target.parent.items.find(
-              (item) => item.name === 'dataListBind',
-            )
-            if (dataListBindProp && dataListBindProp.setter) {
-              const baseChildren = [
-                { label: '图片链接', value: 'image' },
-                { label: '类型', value: 'itemType' },
-                { label: '标题', value: 'title' },
-                { label: '说明', value: 'description' },
-              ]
-
-              // 只有当value大于2时才添加额外的文本字段
-              const textChildren =
-                value > 2
-                  ? Array.from({ length: value - 2 }).map((_, index) => ({
-                      label: `文本${index + 3}`,
-                      value: `text${index + 3}`,
-                    }))
-                  : []
-
-              // 更新setter的attributes
-              dataListBindProp.setter.props.attributes[0].children = [
-                ...baseChildren,
-                ...textChildren,
-              ]
-            }
-
-            console.log(
-              '文字行数',
-              target,
-              value,
-              schema,
-              target.node,
-              target.parent,
-              target.parent.getPropValue('dataListBind'),
-              target.parent.node?.getProp('dataListBind'),
-            )
-          },
-        },
-      },
-      {
-        title: '子项列数',
-        name: 'itemColumns',
-        description: '子项列数',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: (target) => {
-            const isTwoColumns =
-              target.getProps().getPropValue('imagePlacement') === 'top' ||
-              target.getProps().getPropValue('imagePlacement') === 'bottom'
-            return isTwoColumns ? 2 : 1
-          },
-          defaultValue: (target) => {
-            const isTwoColumns =
-              target.getProps().getPropValue('imagePlacement') === 'top' ||
-              target.getProps().getPropValue('imagePlacement') === 'bottom'
-            return isTwoColumns ? 2 : 1
-          },
-          props: {
-            min: 1,
-            max: 2,
-          },
-        },
-      },
-      {
-        title: '子项间距',
-        name: 'itemGap',
-        description: '子项间距',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 10,
-          defaultValue: 10,
-        },
-      },
-      {
-        title: '子项内边距',
-        name: 'itemPadding',
-        description: '子项内边距',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 0,
-          defaultValue: 0,
-        },
-      },
-      {
-        title: '子项背景颜色',
-        name: 'itemBgColor',
-        description: '子项背景颜色',
-        setter: {
-          componentName: 'ColorSetter',
-          isRequired: false,
-          initialValue: '#fff',
-          defaultValue: '#fff',
-        },
-      },
-      {
-        title: '子项分布',
-        name: 'itemRowAlign',
-        description: '子项分布',
-        setter: {
-          componentName: 'SelectSetter',
-          props: {
-            options: [
-              {
-                label: '列分布',
-                value: 'column',
-              },
-              {
-                label: '一行显示',
-                value: 'row',
-              },
-            ],
-          },
-          initialValue: 'column',
-        },
-      },
-      {
-        title: '图文对齐方式',
-        name: 'textAlign',
-        description: '图文对齐方式',
-        setter: {
-          componentName: 'SelectSetter',
-          props: {
-            options: [
-              {
-                label: '左对齐',
-                value: 'flex-start',
-              },
-              {
-                label: '右对齐',
-                value: 'flex-end',
-              },
-              {
-                label: '居中对齐',
-                value: 'center',
-              },
-            ],
-          },
-          initialValue: 'flex-start',
-        },
-      },
-      {
-        title: '图文间距',
-        name: 'textImgGap',
-        description: '图文间距',
-        setter: {
-          componentName: 'NumberSetter',
-          isRequired: false,
-          initialValue: 0,
-          defaultValue: 0,
-        },
-      },
-      {
-        title: '图标配置',
-        name: 'iconList',
-        extraProps: {
-          display: 'accordion',
-          defaultCollapsed: false,
-        },
-        setter: {
-          componentName: 'ArraySetter',
-          props: {
-            itemSetter: {
-              componentName: 'ObjectSetter',
-              props: {
-                config: {
-                  items: [
-                    {
-                      name: 'icon',
-                      title: '图标',
-                      setter: 'IconSetter',
-                      isRequired: true,
-                      props: {
-                        hasClear: false,
-                      },
-                    },
-                    {
-                      name: 'size',
-                      title: '图标尺寸',
-                      setter: {
-                        componentName: 'SelectSetter',
-                        props: {
-                          options: [
-                            {
-                              label: 'xxs',
-                              value: 'xxs',
-                            },
-                            {
-                              label: 'xs',
-                              value: 'xs',
-                            },
-                            {
-                              label: 'small',
-                              value: 'small',
-                            },
-                            {
-                              label: 'medium',
-                              value: 'medium',
-                            },
-                            {
-                              label: 'large',
-                              value: 'large',
-                            },
-                            {
-                              label: 'xl',
-                              value: 'xl',
-                            },
-                            {
-                              label: 'xxl',
-                              value: 'xxl',
-                            },
-                            {
-                              label: 'xxxl',
-                              value: 'xxxl',
-                            },
-                            {
-                              label: 'inherit',
-                              value: 'inherit',
-                            },
-                          ],
-                        },
-                      },
-                      defaultValue: 'medium',
-                    },
-                    {
-                      name: 'position',
-                      title: '图标位置',
-                      defaultValue: 'rightTop',
-                      isRequired: true,
-                      setter: {
-                        componentName: 'SelectSetter',
-                        props: {
-                          options: [
-                            {
-                              label: '左上角',
-                              value: 'leftTop',
-                            },
-                            {
-                              label: '左下角',
-                              value: 'leftBottom',
-                            },
-                            {
-                              label: '右上角',
-                              value: 'rightTop',
-                            },
-                            {
-                              label: '右下角',
-                              value: 'rightBottom',
-                            },
-                            {
-                              label: '自定义',
-                              value: 'customize',
-                            },
-                          ],
-                        },
-                      },
-                      extraProps: {
-                        setValue: (target, value) => {
-                          target.getProps().setPropValue('position', value)
-                        },
-                      },
-                    },
-                    {
-                      name: 'rightOffset',
-                      title: '右偏移',
-                      setter: 'NumberSetter',
-                      defaultValue: 0,
-                      condition: (target) => {
-                        return target.getProps().getPropValue('position') === 'customize'
-                      },
-                    },
-                    {
-                      name: 'topOffset',
-                      title: '上偏移',
-                      setter: 'NumberSetter',
-                      defaultValue: 0,
-                      condition: (target) => {
-                        return target.getProps().getPropValue('position') === 'customize'
-                      },
-                    },
-                  ],
-                },
-              },
-              initialValue: {
-                size: 'medium',
-                position: 'rightTop',
-                rightOffset: 0,
-                topOffset: 0,
-              },
-            },
-          },
-        },
-      },
-      {
-        title: '是否为购物车列表',
-        name: 'isShoppingCart',
-        description: '是否为购物车列表',
-        setter: {
-          componentName: 'BoolSetter',
-          isRequired: true,
-          initialValue: false,
-        },
-      },
-      {
-        title: '是否为愿望单列表',
-        name: 'isWishList',
-        description: '是否为愿望单列表',
-        setter: {
-          componentName: 'BoolSetter',
-          isRequired: true,
-          initialValue: false,
-        },
-      },
-      {
-        title: '是否为用户菜单列表',
-        name: 'isUserMenu',
-        description: '是否为用户菜单列表',
-        setter: {
-          componentName: 'BoolSetter',
-          isRequired: true,
-          initialValue: false,
-        },
-      },
-      {
-        title: {
-          label: {
-            type: 'i18n',
-            'en-US': 'dataList',
-            'zh-CN': '数据',
-          },
-          tip: 'dataList | 数据',
-        },
-        name: 'dataList',
-        description: '数据',
-        setter: {
-          componentName: 'ArraySetter',
-          props: {
-            itemSetter: {
-              componentName: 'ObjectSetter',
-              props: {
-                config: {
-                  items: [
-                    {
-                      title: {
-                        label: {
-                          type: 'i18n',
-                          'en-US': 'title',
-                          'zh-CN': '标题',
-                        },
-                      },
-                      name: 'title',
-                      description: '标题',
-                      setter: {
-                        componentName: 'StringSetter',
-                        isRequired: false,
-                        initialValue: '',
-                      },
-                    },
-                    {
-                      title: {
-                        label: {
-                          type: 'i18n',
-                          'en-US': 'image',
-                          'zh-CN': '图片地址',
-                        },
-                      },
-                      name: 'image',
-                      description: '图片地址',
-                      setter: {
-                        componentName: 'CustomImageSetter',
-                        isRequired: false,
-                        initialValue: '',
-                      },
-                    },
-                    {
-                      title: {
-                        label: {
-                          type: 'i18n',
-                          'en-US': 'description',
-                          'zh-CN': '描述',
-                        },
-                      },
-                      name: 'description',
-                      description: '描述',
-                      setter: {
-                        componentName: 'StringSetter',
-                        isRequired: false,
-                        initialValue: '',
-                      },
-                    },
-                  ],
-                  extraSetter: {
-                    componentName: 'MixedSetter',
-                    isRequired: false,
-                    props: {},
-                  },
-                },
-              },
-            },
-          },
-          initialValue: [
-            {
-              image: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
-              title: '标题名称',
-              description:
-                '说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字',
-            },
-            {
-              image: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
-              title: '标题名称',
-              description:
-                '说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字',
-              tags: [
-                {
-                  name: '报名火热',
-                  color: 'orange',
-                },
-                {
-                  name: '人数众多',
-                  color: 'blue',
-                },
-              ],
-            },
-          ],
-        },
-      },
-    ],
-    supports: {
-      style: true,
-      events: [
-        {
-          name: 'onClick',
-          template: "onClick(key,${extParams}){\n// 点击项目的事件\nconsole.log('onClick', key);}",
-        },
-        {
-          name: 'handleMoreClick',
-          template: "handleMoreClick(){\n// 查看更多\nconsole.log('handleMoreClick');}",
-        },
-      ],
-    },
-    component: {
-      disableBehaviors: ['copy'],
-    },
-  },
-}
-
-const getSnippets = (textLines = 2): IPublicTypeSnippet[] => [
-  {
-    title: '图文列表',
-    screenshot: '',
-    schema: {
-      componentName: 'TeletextList',
-      props: {},
-      children: [
-        {
-          componentName: 'NextText',
-          props: {
-            type: 'h5',
-            children: '列表标题',
-            key: 'box-title',
-            style: {
-              fontSize: '16px',
-              fontWeight: 'bold',
-            },
-          },
-        },
-        {
-          componentName: 'Image',
-          props: {
-            imgSrc: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
-            key: 'image',
-          },
-        },
-        // 动态生成文本组件
-        // ...Array.from({ length: textLines }).map((_, index) => ({
-        //   componentName: 'NextText',
-        //   props: {
-        //     type: index === 0 ? 'h5' : 'inherit',
-        //     children:
-        //       index === 0
-        //         ? '标题标题'
-        //         : '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
-        //     key: `text-${index + 1}`,
-        //   },
-        // })),
-        {
-          componentName: 'NextText',
-          props: {
-            type: 'h5',
-            children: '标题标题',
-            key: `text-1`,
-          },
-        },
-        {
-          componentName: 'NextText',
-          props: {
-            type: 'inherit',
-            children:
-              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
-            key: `text-2`,
-          },
-        },
-        {
-          componentName: 'NextText',
-          props: {
-            type: 'inherit',
-            children:
-              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
-            key: `text-3`,
-          },
-        },
-        {
-          componentName: 'NextText',
-          props: {
-            type: 'inherit',
-            children:
-              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
-            key: `text-4`,
-          },
-        },
-        {
-          componentName: 'Select',
-          props: {
-            popType: 'dialog',
-            selectType: 'number',
-            value: 1,
-            prefix: '数量: ',
-            dialogTitle: '选择数量',
-            btnText: '确定',
-            key: 'select-box-1',
-          },
-        },
-        {
-          componentName: 'Select',
-          props: {
-            popType: 'dialog',
-            selectType: 'string',
-            dataList: [
-              {
-                label: 'M',
-                value: 'M',
-              },
-              {
-                label: 'X',
-                value: 'X',
-              },
-              {
-                label: 'XL',
-                value: 'XL',
-              },
-            ],
-            value: 'X',
-            prefix: '尺码: ',
-            dialogTitle: '选择尺码',
-            btnText: '确定',
-            key: 'select-box-2',
-          },
-        },
-        {
-          componentName: 'Switch',
-          props: {
-            size: 'small',
-            disabled: false,
-            key: 'switch-1',
-          },
-        },
-      ],
-    },
-  },
-]
-
-export default {
-  ...TeletextListMeta,
-  snippets: getSnippets(
-    (TeletextListMeta.configure as IPublicTypeConfigure).props
-      ?.find((prop) => prop.name === 'textLines')
-      ?.setter?.getValue?.() || 2,
-  ),
-}
+import {
+  IPublicTypeComponentMetadata,
+  IPublicTypeSnippet,
+  IPublicTypeConfigure,
+} from '@alilc/lowcode-types'
+
+const TeletextListMeta: IPublicTypeComponentMetadata = {
+  group: '低代码组件',
+  componentName: 'TeletextList',
+  title: '图文列表',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  category: '信息展示',
+  npm: {
+    package: '@dckj-npm/dc-material',
+    version: '0.1.8',
+    exportName: 'TeletextList',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  configure: {
+    props: [
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'type',
+            'zh-CN': '类型',
+          },
+        },
+        name: 'type',
+        description: '类型',
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            dataSource: [
+              {
+                label: '图文',
+                value: 'textAndImg',
+              },
+              {
+                label: '仅有图片',
+                value: 'imgOnly',
+              },
+              {
+                label: '仅有文字',
+                value: 'textOnly',
+              },
+            ],
+            options: [
+              {
+                label: '图文',
+                value: 'textAndImg',
+              },
+              {
+                label: '仅有图片',
+                value: 'imgOnly',
+              },
+              {
+                label: '仅有文字',
+                value: 'textOnly',
+              },
+            ],
+          },
+          initialValue: 'textAndImg',
+        },
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'imagePlacement',
+            'zh-CN': '图片位置',
+          },
+        },
+        name: 'imagePlacement',
+        description: '图片位置',
+        setter: {
+          componentName: 'RadioGroupSetter',
+          props: {
+            dataSource: [
+              {
+                label: '左',
+                value: 'left',
+              },
+              {
+                label: '右',
+                value: 'right',
+              },
+              {
+                label: '上',
+                value: 'top',
+              },
+              {
+                label: '下',
+                value: 'bottom',
+              },
+              {
+                label: '无',
+                value: 'none',
+              },
+            ],
+            options: [
+              {
+                label: '左',
+                value: 'left',
+              },
+              {
+                label: '右',
+                value: 'right',
+              },
+              {
+                label: '上',
+                value: 'top',
+              },
+              {
+                label: '下',
+                value: 'bottom',
+              },
+              {
+                label: '无',
+                value: 'none',
+              },
+            ],
+          },
+          initialValue: 'left',
+        },
+        extraProps: {
+          setValue: (target, value) => {
+            target.getProps().setPropValue('imagePlacement', value)
+          },
+        },
+      },
+      {
+        title: '图片宽度',
+        name: 'imgWidth',
+        description: '图片宽度',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 100,
+          defaultValue: 100,
+        },
+      },
+      {
+        title: '图片高度',
+        name: 'imgHeight',
+        description: '图片高度',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 100,
+          defaultValue: 100,
+        },
+      },
+      {
+        title: '数据源绑定',
+        name: 'dataListBind',
+        setter: {
+          componentName: 'SetterFormVariable',
+          props: {
+            attributes: [
+              {
+                label: '图文数据',
+                value: 'dataList',
+                children: [
+                  { label: '图片链接', value: 'image' },
+                  { label: '类型', value: 'itemType' },
+                  { label: '标题', value: 'title' },
+                  { label: '说明', value: 'description' },
+                ],
+              },
+            ],
+          },
+        },
+        extraProps: {
+          setValue: (target, value) => {
+            console.log('dataList setValue', target, value)
+          },
+        },
+      },
+      {
+        title: '标题',
+        name: 'title',
+        description: '标题',
+        setter: {
+          componentName: 'StringSetter',
+          isRequired: false,
+          initialValue: '',
+        },
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'moreText',
+            'zh-CN': '更多文字',
+          },
+          tip: 'moreText | 更多文字',
+        },
+        name: 'moreText',
+        description: '更多文字',
+        setter: {
+          componentName: 'StringSetter',
+          isRequired: false,
+          initialValue: '',
+        },
+      },
+      {
+        title: '文字行数',
+        name: 'textLines',
+        description: '文字行数',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 2,
+          defaultValue: 2,
+          props: {
+            min: 2,
+            max: 4,
+          },
+        },
+        extraProps: {
+          setValue(target, value) {
+            target.getProps().setPropValue('textLines', value)
+            const schema = target?.node?.schema
+            const node = target?.node
+
+            // 获取当前文本组件数量
+            const currentLength =
+              schema?.children?.filter(
+                (child) =>
+                  child.componentName === 'NextText' && child.props.key?.startsWith('text-'),
+              )?.length || 0
+
+            if (value > currentLength) {
+              // 需要添加新的文本组件
+              for (let i = currentLength + 1; i <= value; i++) {
+                const newChild = {
+                  componentName: 'NextText',
+                  props: {
+                    type: 'inherit',
+                    children: '基于 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台',
+                    key: `text-${i}`,
+                  },
+                }
+                console.log('node', node, 'node-children', node?.children)
+                node?.children?.push(newChild)
+              }
+            } else if (value < currentLength) {
+              // 需要移除多余的文本组件
+              node?.children?.filter(
+                (child) =>
+                  !(
+                    child.componentName === 'NextText' &&
+                    child.props?.key?.startsWith('text-') &&
+                    parseInt(child?.props?.key.split('-')[1]) > value
+                  ),
+              )
+            }
+
+            // 更新数据源绑定的配置
+            const dataListBindProp = target.parent.items.find(
+              (item) => item.name === 'dataListBind',
+            )
+            if (dataListBindProp && dataListBindProp.setter) {
+              const baseChildren = [
+                { label: '图片链接', value: 'image' },
+                { label: '类型', value: 'itemType' },
+                { label: '标题', value: 'title' },
+                { label: '说明', value: 'description' },
+              ]
+
+              // 只有当value大于2时才添加额外的文本字段
+              const textChildren =
+                value > 2
+                  ? Array.from({ length: value - 2 }).map((_, index) => ({
+                      label: `文本${index + 3}`,
+                      value: `text${index + 3}`,
+                    }))
+                  : []
+
+              // 更新setter的attributes
+              dataListBindProp.setter.props.attributes[0].children = [
+                ...baseChildren,
+                ...textChildren,
+              ]
+            }
+
+            console.log(
+              '文字行数',
+              target,
+              value,
+              schema,
+              target.node,
+              target.parent,
+              target.parent.getPropValue('dataListBind'),
+              target.parent.node?.getProp('dataListBind'),
+            )
+          },
+        },
+      },
+      {
+        title: '子项列数',
+        name: 'itemColumns',
+        description: '子项列数',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: (target) => {
+            const isTwoColumns =
+              target.getProps().getPropValue('imagePlacement') === 'top' ||
+              target.getProps().getPropValue('imagePlacement') === 'bottom'
+            return isTwoColumns ? 2 : 1
+          },
+          defaultValue: (target) => {
+            const isTwoColumns =
+              target.getProps().getPropValue('imagePlacement') === 'top' ||
+              target.getProps().getPropValue('imagePlacement') === 'bottom'
+            return isTwoColumns ? 2 : 1
+          },
+          props: {
+            min: 1,
+            max: 2,
+          },
+        },
+      },
+      {
+        title: '子项间距',
+        name: 'itemGap',
+        description: '子项间距',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 10,
+          defaultValue: 10,
+        },
+      },
+      {
+        title: '子项内边距',
+        name: 'itemPadding',
+        description: '子项内边距',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 0,
+          defaultValue: 0,
+        },
+      },
+      {
+        title: '子项背景颜色',
+        name: 'itemBgColor',
+        description: '子项背景颜色',
+        setter: {
+          componentName: 'ColorSetter',
+          isRequired: false,
+          initialValue: '#fff',
+          defaultValue: '#fff',
+        },
+      },
+      {
+        title: '子项分布',
+        name: 'itemRowAlign',
+        description: '子项分布',
+        setter: {
+          componentName: 'SelectSetter',
+          props: {
+            options: [
+              {
+                label: '列分布',
+                value: 'column',
+              },
+              {
+                label: '一行显示',
+                value: 'row',
+              },
+            ],
+          },
+          initialValue: 'column',
+        },
+      },
+      {
+        title: '图文对齐方式',
+        name: 'textAlign',
+        description: '图文对齐方式',
+        setter: {
+          componentName: 'SelectSetter',
+          props: {
+            options: [
+              {
+                label: '左对齐',
+                value: 'flex-start',
+              },
+              {
+                label: '右对齐',
+                value: 'flex-end',
+              },
+              {
+                label: '居中对齐',
+                value: 'center',
+              },
+            ],
+          },
+          initialValue: 'flex-start',
+        },
+      },
+      {
+        title: '图文间距',
+        name: 'textImgGap',
+        description: '图文间距',
+        setter: {
+          componentName: 'NumberSetter',
+          isRequired: false,
+          initialValue: 0,
+          defaultValue: 0,
+        },
+      },
+      {
+        title: '图标配置',
+        name: 'iconList',
+        extraProps: {
+          display: 'accordion',
+          defaultCollapsed: false,
+        },
+        setter: {
+          componentName: 'ArraySetter',
+          props: {
+            itemSetter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      name: 'icon',
+                      title: '图标',
+                      setter: 'IconSetter',
+                      isRequired: true,
+                      props: {
+                        hasClear: false,
+                      },
+                    },
+                    {
+                      name: 'size',
+                      title: '图标尺寸',
+                      setter: {
+                        componentName: 'SelectSetter',
+                        props: {
+                          options: [
+                            {
+                              label: 'xxs',
+                              value: 'xxs',
+                            },
+                            {
+                              label: 'xs',
+                              value: 'xs',
+                            },
+                            {
+                              label: 'small',
+                              value: 'small',
+                            },
+                            {
+                              label: 'medium',
+                              value: 'medium',
+                            },
+                            {
+                              label: 'large',
+                              value: 'large',
+                            },
+                            {
+                              label: 'xl',
+                              value: 'xl',
+                            },
+                            {
+                              label: 'xxl',
+                              value: 'xxl',
+                            },
+                            {
+                              label: 'xxxl',
+                              value: 'xxxl',
+                            },
+                            {
+                              label: 'inherit',
+                              value: 'inherit',
+                            },
+                          ],
+                        },
+                      },
+                      defaultValue: 'medium',
+                    },
+                    {
+                      name: 'position',
+                      title: '图标位置',
+                      defaultValue: 'rightTop',
+                      isRequired: true,
+                      setter: {
+                        componentName: 'SelectSetter',
+                        props: {
+                          options: [
+                            {
+                              label: '左上角',
+                              value: 'leftTop',
+                            },
+                            {
+                              label: '左下角',
+                              value: 'leftBottom',
+                            },
+                            {
+                              label: '右上角',
+                              value: 'rightTop',
+                            },
+                            {
+                              label: '右下角',
+                              value: 'rightBottom',
+                            },
+                            {
+                              label: '自定义',
+                              value: 'customize',
+                            },
+                          ],
+                        },
+                      },
+                      extraProps: {
+                        setValue: (target, value) => {
+                          target.getProps().setPropValue('position', value)
+                        },
+                      },
+                    },
+                    {
+                      name: 'rightOffset',
+                      title: '右偏移',
+                      setter: 'NumberSetter',
+                      defaultValue: 0,
+                      condition: (target) => {
+                        return target.getProps().getPropValue('position') === 'customize'
+                      },
+                    },
+                    {
+                      name: 'topOffset',
+                      title: '上偏移',
+                      setter: 'NumberSetter',
+                      defaultValue: 0,
+                      condition: (target) => {
+                        return target.getProps().getPropValue('position') === 'customize'
+                      },
+                    },
+                  ],
+                },
+              },
+              initialValue: {
+                size: 'medium',
+                position: 'rightTop',
+                rightOffset: 0,
+                topOffset: 0,
+              },
+            },
+          },
+        },
+      },
+      {
+        title: '是否为购物车列表',
+        name: 'isShoppingCart',
+        description: '是否为购物车列表',
+        setter: {
+          componentName: 'BoolSetter',
+          isRequired: true,
+          initialValue: false,
+        },
+      },
+      {
+        title: '是否为愿望单列表',
+        name: 'isWishList',
+        description: '是否为愿望单列表',
+        setter: {
+          componentName: 'BoolSetter',
+          isRequired: true,
+          initialValue: false,
+        },
+      },
+      {
+        title: '是否为用户菜单列表',
+        name: 'isUserMenu',
+        description: '是否为用户菜单列表',
+        setter: {
+          componentName: 'BoolSetter',
+          isRequired: true,
+          initialValue: false,
+        },
+      },
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'dataList',
+            'zh-CN': '数据',
+          },
+          tip: 'dataList | 数据',
+        },
+        name: 'dataList',
+        description: '数据',
+        setter: {
+          componentName: 'ArraySetter',
+          props: {
+            itemSetter: {
+              componentName: 'ObjectSetter',
+              props: {
+                config: {
+                  items: [
+                    {
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'title',
+                          'zh-CN': '标题',
+                        },
+                      },
+                      name: 'title',
+                      description: '标题',
+                      setter: {
+                        componentName: 'StringSetter',
+                        isRequired: false,
+                        initialValue: '',
+                      },
+                    },
+                    {
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'image',
+                          'zh-CN': '图片地址',
+                        },
+                      },
+                      name: 'image',
+                      description: '图片地址',
+                      setter: {
+                        componentName: 'CustomImageSetter',
+                        isRequired: false,
+                        initialValue: '',
+                      },
+                    },
+                    {
+                      title: {
+                        label: {
+                          type: 'i18n',
+                          'en-US': 'description',
+                          'zh-CN': '描述',
+                        },
+                      },
+                      name: 'description',
+                      description: '描述',
+                      setter: {
+                        componentName: 'StringSetter',
+                        isRequired: false,
+                        initialValue: '',
+                      },
+                    },
+                  ],
+                  extraSetter: {
+                    componentName: 'MixedSetter',
+                    isRequired: false,
+                    props: {},
+                  },
+                },
+              },
+            },
+          },
+          initialValue: [
+            {
+              image: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
+              title: '标题名称',
+              description:
+                '说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字',
+            },
+            {
+              image: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
+              title: '标题名称',
+              description:
+                '说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字说明文字',
+              tags: [
+                {
+                  name: '报名火热',
+                  color: 'orange',
+                },
+                {
+                  name: '人数众多',
+                  color: 'blue',
+                },
+              ],
+            },
+          ],
+        },
+      },
+    ],
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onClick',
+          template: "onClick(key,${extParams}){\n// 点击项目的事件\nconsole.log('onClick', key);}",
+        },
+        {
+          name: 'handleMoreClick',
+          template: "handleMoreClick(){\n// 查看更多\nconsole.log('handleMoreClick');}",
+        },
+      ],
+    },
+    component: {
+      disableBehaviors: ['copy'],
+    },
+  },
+}
+
+const getSnippets = (textLines = 2): IPublicTypeSnippet[] => [
+  {
+    title: '图文列表',
+    screenshot: '',
+    schema: {
+      componentName: 'TeletextList',
+      props: {},
+      children: [
+        {
+          componentName: 'NextText',
+          props: {
+            type: 'h5',
+            children: '列表标题',
+            key: 'box-title',
+            style: {
+              fontSize: '16px',
+              fontWeight: 'bold',
+            },
+          },
+        },
+        {
+          componentName: 'Image',
+          props: {
+            imgSrc: 'https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg',
+            key: 'image',
+          },
+        },
+        // 动态生成文本组件
+        // ...Array.from({ length: textLines }).map((_, index) => ({
+        //   componentName: 'NextText',
+        //   props: {
+        //     type: index === 0 ? 'h5' : 'inherit',
+        //     children:
+        //       index === 0
+        //         ? '标题标题'
+        //         : '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
+        //     key: `text-${index + 1}`,
+        //   },
+        // })),
+        {
+          componentName: 'NextText',
+          props: {
+            type: 'h5',
+            children: '标题标题',
+            key: `text-1`,
+          },
+        },
+        {
+          componentName: 'NextText',
+          props: {
+            type: 'inherit',
+            children:
+              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
+            key: `text-2`,
+          },
+        },
+        {
+          componentName: 'NextText',
+          props: {
+            type: 'inherit',
+            children:
+              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
+            key: `text-3`,
+          },
+        },
+        {
+          componentName: 'NextText',
+          props: {
+            type: 'inherit',
+            children:
+              '基于1 Ali-Lowcode-Engine 快速打造高生产力的低代码研发平台, 基于自然布局体系快速搭建页面',
+            key: `text-4`,
+          },
+        },
+        {
+          componentName: 'Select',
+          props: {
+            popType: 'dialog',
+            selectType: 'number',
+            value: 1,
+            prefix: '数量: ',
+            dialogTitle: '选择数量',
+            btnText: '确定',
+            key: 'select-box-1',
+          },
+        },
+        {
+          componentName: 'Select',
+          props: {
+            popType: 'dialog',
+            selectType: 'string',
+            dataList: [
+              {
+                label: 'M',
+                value: 'M',
+              },
+              {
+                label: 'X',
+                value: 'X',
+              },
+              {
+                label: 'XL',
+                value: 'XL',
+              },
+            ],
+            value: 'X',
+            prefix: '尺码: ',
+            dialogTitle: '选择尺码',
+            btnText: '确定',
+            key: 'select-box-2',
+          },
+        },
+        {
+          componentName: 'Switch',
+          props: {
+            size: 'small',
+            disabled: false,
+            key: 'switch-1',
+          },
+        },
+      ],
+    },
+  },
+]
+
+export default {
+  ...TeletextListMeta,
+  snippets: getSnippets(
+    (TeletextListMeta.configure as IPublicTypeConfigure).props
+      ?.find((prop) => prop.name === 'textLines')
+      ?.setter?.getValue?.() || 2,
+  ),
+}