@vtj/materials 0.8.44 → 0.8.46

package/src/antdv/list.ts

@@ -0,0 +1,255 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'AList',
+    alias: 'List',
+    label: '列表',
+    categoryId: 'data',
+    doc: 'https://www.antdv.com/components/list-cn',
+    props: [
+      {
+        name: 'bordered',
+        label: 'bordered',
+        title: '是否展示边框',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'dataSource',
+        label: 'dataSource',
+        title: '列表数据源',
+        setters: 'ArraySetter'
+      },
+      {
+        name: 'footer',
+        label: 'footer',
+        title: '列表底部',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'grid',
+        label: 'grid',
+        title: '列表栅格配置',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'header',
+        label: 'header',
+        title: '列表头部',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'itemLayout',
+        label: 'itemLayout',
+        title: '设置 List.Item 布局, 设置成 vertical 则竖直样式显示, 默认横排',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'loading',
+        label: 'loading',
+        title: '当卡片内容还在加载中时，可以用 loading 展示一个占位',
+        setters: ['BooleanSetter', 'ObjectSetter'],
+        defaultValue: false
+      },
+      {
+        name: 'loadMore',
+        label: 'loadMore',
+        title: '加载更多',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'locale',
+        label: 'locale',
+        title: '默认文案设置，目前包括空数据文案',
+        setters: 'ObjectSetter',
+        defaultValue: { emptyText: '暂无数据' }
+      },
+      {
+        name: 'pagination',
+        label: 'pagination',
+        title: '对应的 pagination 配置, 设置 false 不显示',
+        setters: ['BooleanSetter', 'ObjectSetter'],
+        defaultValue: false
+      },
+      {
+        name: 'renderItem',
+        label: 'renderItem',
+        title: '自定义Item函数，也可使用 #renderItem="{item, index}"',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'rowKey',
+        label: 'rowKey',
+        title: '各项 key 的取值，可以是字符串或一个函数',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'size',
+        label: 'size',
+        title: 'list 的尺寸',
+        setters: 'SelectSetter',
+        options: ['default', 'middle', 'small'],
+        defaultValue: 'default'
+      },
+      {
+        name: 'split',
+        label: 'split',
+        title: '是否展示分割线',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      }
+    ],
+    slots: [
+      {
+        name: 'footer'
+      },
+      {
+        name: 'header'
+      },
+      {
+        name: 'loadMore'
+      },
+      {
+        name: 'renderItem',
+        params: ['item', 'index']
+      }
+    ],
+    snippet: {
+      props: {
+        itemLayout: 'horizontal',
+        dataSource: [
+          {
+            title: 'Ant Design Title 1'
+          },
+          {
+            title: 'Ant Design Title 2'
+          },
+          {
+            title: 'Ant Design Title 3'
+          },
+          {
+            title: 'Ant Design Title 4'
+          }
+        ]
+      },
+      slot: 'renderItem',
+      children: [
+        {
+          name: 'span',
+          slot: { name: 'renderItem', params: ['item', 'index'] },
+          children: [
+            {
+              name: 'AListItem',
+              children: [
+                {
+                  name: 'AListItemMeta',
+                  props: {
+                    description:
+                      'Ant Design, a design language for background applications, is refined by Ant UED Team'
+                  },
+                  children: [
+                    {
+                      name: 'a',
+                      slot: { name: 'title' },
+                      props: { href: 'https://www.antdv.com/' }
+                    },
+                    {
+                      name: 'AAvatar',
+                      slot: { name: 'avatar' },
+                      props: { href: 'https://joeschmoe.io/api/v1/random' }
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  },
+  {
+    name: 'AListItem',
+    alias: 'Item',
+    parent: 'List',
+    label: '列表项',
+    categoryId: 'data',
+    doc: 'https://www.antdv.com/components/list-cn',
+    props: [
+      {
+        name: 'actions',
+        label: 'actions',
+        title: '列表操作组，根据 itemLayout 的不同, 位置在卡片底部或者最右侧',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'extra',
+        label: 'extra',
+        title:
+          '额外内容, 通常用在 itemLayout 为 vertical 的情况下, 展示右侧内容; horizontal 展示在列表元素最右侧',
+        setters: 'StringSetter'
+      }
+    ],
+    slots: ['actions', 'extra'],
+    snippet: {
+      children: [
+        {
+          name: 'AListItemMeta',
+          props: {
+            description:
+              'Ant Design, a design language for background applications, is refined by Ant UED Team'
+          },
+          children: [
+            {
+              name: 'a',
+              slot: { name: 'title' },
+              props: { href: 'https://www.antdv.com/' },
+              children: 'itemTitle'
+            },
+            {
+              name: 'AAvatar',
+              slot: { name: 'avatar' },
+              props: { href: 'https://joeschmoe.io/api/v1/random' }
+            }
+          ]
+        }
+      ]
+    }
+  },
+  {
+    name: 'AListItemMeta',
+    alias: 'Meta',
+    parent: 'ListItem',
+    label: '列表项meta',
+    categoryId: 'data',
+    doc: 'https://www.antdv.com/components/list-cn',
+    props: [
+      {
+        name: 'avatar',
+        label: 'avatar',
+        title: '列表元素的图标',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'description',
+        label: 'description',
+        title: '列表元素的描述内容',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'title',
+        label: 'title',
+        title: '列表元素的标题',
+        setters: 'StringSetter'
+      }
+    ],
+    slots: ['avatar', 'description', 'title'],
+    snippet: {
+      props: {
+        description:
+          'Ant Design, a design language for background applications, is refined by Ant UED Team'
+      }
+    }
+  }
+];
+export default components;

package/src/antdv/mentions.ts

@@ -0,0 +1,171 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'AMentions',
+    alias: 'Mentions',
+    label: '提及',
+    categoryId: 'input',
+    doc: 'https://www.antdv.com/components/mentions-cn',
+    props: [
+      {
+        name: 'autofocus',
+        label: 'autofocus',
+        title: '自动获得焦点',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'defaultValue',
+        label: 'defaultValue',
+        title: '默认值',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'filterOption',
+        label: 'filterOption',
+        title: '自定义过滤逻辑',
+        setters: ['BooleanSetter', 'FunctionSetter']
+      },
+      {
+        name: 'getPopupContainer',
+        label: 'getPopupContainer',
+        title: '指定建议框挂载的 HTML 节点',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'notFoundContent',
+        label: 'notFoundContent',
+        title: '当下拉列表为空时显示的内容',
+        setters: 'StringSetter',
+        defaultValue: 'Not Found'
+      },
+      {
+        name: 'placement',
+        label: 'placement',
+        title: '弹出层展示位置',
+        setters: 'SelectSetter',
+        options: ['top', 'bottom'],
+        defaultValue: 'bottom'
+      },
+      {
+        name: 'prefix',
+        label: 'prefix',
+        title: '设置触发关键字',
+        setters: ['StringSetter', 'ArraySetter'],
+        defaultValue: '@'
+      },
+      {
+        name: 'split',
+        label: 'split',
+        title: '设置选中项前后分隔符',
+        setters: 'StringSetter',
+        defaultValue: ' '
+      },
+      {
+        name: 'status',
+        label: 'status',
+        title: '设置校验状态',
+        setters: 'SelectSetter',
+        options: ['error', 'warning']
+      },
+      {
+        name: 'validateSearch',
+        label: 'validateSearch',
+        title: '自定义触发验证逻辑',
+        setters: 'FunctionSetter' //?? (text: string, props: MentionsProps) => void
+      },
+      {
+        name: 'value',
+        label: 'value',
+        title: '设置值',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'options',
+        label: 'options',
+        title: '选项配置',
+        setters: 'ObjectSetter', //?? Options
+        defaultValue: []
+      },
+      {
+        name: 'option',
+        label: 'option',
+        title: '通过 option 插槽，自定义节点'
+      }
+    ],
+    events: ['blur', 'change', 'focus', 'search', 'select', 'update:value'],
+    slots: [
+      { name: 'notFoundContent' },
+      { name: 'option', params: ['object'] }
+    ],
+    snippet: {
+      props: {
+        value: '@afc163',
+        options: [
+          {
+            value: 'afc163',
+            label: 'afc163'
+          },
+          {
+            value: 'zombieJ',
+            label: 'zombieJ'
+          },
+          {
+            value: 'yesmeck',
+            label: 'yesmeck'
+          }
+        ]
+      }
+    }
+  }
+  // {
+  //   name: 'AMentionOption',
+  //   alias: 'Option',
+  //   parent: 'Mention',
+  //   label: '提及项',
+  //   categoryId: 'input',
+  //   doc: 'https://www.antdv.com/components/mentions-cn',
+  //   props: [
+  //     {
+  //       name: 'value',
+  //       label: 'value',
+  //       title: '选择时填充的值',
+  //       setters: 'StringSetter',
+  //       defaultValue: 'number'
+  //     },
+  //     {
+  //       name: 'label',
+  //       label: 'label',
+  //       title: '选项的标题',
+  //       setters: 'FunctionSetter'
+  //     },
+  //     {
+  //       name: 'disabled',
+  //       label: 'disabled',
+  //       title: '是否可选',
+  //       setters: 'BooleanSetter'
+  //     },
+  //     {
+  //       name: 'class',
+  //       label: 'class',
+  //       title: 'css 类名',
+  //       setters: 'StringSetter'
+  //     },
+  //     {
+  //       name: 'style',
+  //       label: 'style',
+  //       title: '选项样式',
+  //       setters: 'ObjectSetter'
+  //     },
+  //     {
+  //       name: 'payload',
+  //       label: 'payload',
+  //       title: '其它数据',
+  //       setters: 'ObjectSetter'
+  //     }
+  //   ],
+  //   slots: ['label']
+  // }
+];
+export default components;