@vtj/materials 0.8.44 → 0.8.45

package/src/antdv/datePicker.ts

@@ -0,0 +1,450 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'ADatePicker',
+    alias: 'DatePicker',
+    label: '日期选择框',
+    categoryId: 'input',
+    doc: 'https://www.antdv.com/components/date-picker-cn',
+    props: [
+      {
+        name: 'allowClear',
+        label: 'allowClear',
+        title: '是否显示清除按钮',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'autofocus',
+        label: 'autofocus',
+        title: '自动获取焦点',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'bordered',
+        label: 'bordered',
+        title: '是否有边框',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'disabled',
+        label: 'disabled',
+        title: '禁用',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'disabledDate',
+        label: 'disabledDate',
+        title: '不可选择的日期',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'format',
+        label: 'format',
+        title: '设置日期格式，为数组时支持多格式匹配，展示以第一个为准',
+        setters: 'StringSetter',
+        defaultValue: 'YYYY-MM-DD'
+      },
+      {
+        name: 'dropdownClassName',
+        label: 'dropdownClassName',
+        title: '额外的弹出日历 className',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'getPopupContainer',
+        label: 'getPopupContainer',
+        title: '定义浮层的容器，默认为 body 上新建 div',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'inputReadOnly',
+        label: 'inputReadOnly',
+        title: '设置输入框为只读（避免在移动设备上打开虚拟键盘）',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'local',
+        label: 'local',
+        title: '国际化配置',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'mode',
+        label: 'mode',
+        title: '日期面板的状态',
+        setters: 'SelectSetter',
+        options: ['time', 'date', 'month', 'year', 'decade']
+      },
+      {
+        name: 'open',
+        label: 'open',
+        title: '控制弹层是否展开',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'picker',
+        label: 'picker',
+        title: '设置选择器类型',
+        setters: 'SelectSetter',
+        options: ['date', 'week', 'month', 'quarter', 'year'],
+        defaultValue: 'date'
+      },
+      {
+        name: 'placeholder',
+        label: 'placeholder',
+        title: '输入框提示文字',
+        setters: ['StringSetter', 'ArraySetter']
+      },
+      {
+        name: 'placement',
+        label: 'placement',
+        title: '选择框弹出的位置',
+        setters: 'SelectSetter',
+        options: ['bottomLeft', 'bottomRight', 'topLeft', 'topRight'],
+        defaultValue: 'bottomLeft'
+      },
+      {
+        name: 'popupStyle',
+        label: 'popupStyle',
+        title: '额外的弹出日历样式',
+        setters: 'ObjectSetter',
+        defaultValue: {}
+      },
+      {
+        name: 'presets',
+        label: 'presets',
+        title: '预设时间范围快捷选择',
+        setters: 'ArraySetter'
+      },
+      {
+        name: 'size',
+        label: 'size',
+        title: '输入框大小，large 高度为 40px，small 为 24px，默认是 32px',
+        setters: 'SelectSetter',
+        options: ['large', 'middle', 'small']
+      },
+      {
+        name: 'status',
+        label: 'status',
+        title: '设置校验状态',
+        setters: 'SelectSetter',
+        options: ['error', 'warning']
+      },
+      {
+        name: 'valueFormat',
+        label: 'valueFormat',
+        title:
+          '可选，绑定值的格式，对 value、defaultValue、defaultPickerValue 起作用。不指定则绑定值为 dayjs 对象',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'defaultPickerValue',
+        label: 'defaultPickerValue',
+        title: '默认面板日期',
+        setters: 'FunctionSetter' //?? dayjs
+      },
+      {
+        name: 'disabledTime',
+        label: 'disabledTime',
+        title: '不可选择的时间',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'format',
+        label: 'format',
+        title: '展示的日期格式，配置参考 dayjs',
+        setters: 'StringSetter', //?? 	formatType
+        defaultValue: 'YYYY-MM-DD'
+      },
+      {
+        name: 'showNow',
+        label: 'showNow',
+        title: '当设定了 showTime 的时候，面板是否显示“此刻”按钮',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'showTime',
+        label: 'showTime',
+        title: '增加时间选择功能',
+        setters: ['ObjectSetter', 'BooleanSetter']
+        // defaultValue: '' //?? TimePicker Options
+      },
+      {
+        name: 'showTime.defaultValue',
+        label: 'showTime.defaultValue',
+        title: '设置用户选择日期时默认的时分秒',
+        setters: 'FunctionSetter' //?? 	dayjs
+      },
+      {
+        name: 'showToday',
+        label: 'showToday',
+        title: '是否展示“今天”按钮',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'value',
+        label: 'value',
+        title: '日期',
+        setters: 'FunctionSetter' //?? 	dayjs
+      }
+    ],
+    events: ['openChange', 'panelChange', 'change', 'ok', 'update:value'],
+    slots: [
+      'dateRender',
+      'nextIcon',
+      'prevIcon',
+      'suffixIcon',
+      'superNextIcon',
+      'superPrevIcon',
+      'renderExtraFooter'
+    ]
+  },
+  {
+    name: 'ARangePicker',
+    alias: 'RangePicker',
+    label: '日期选择框',
+    categoryId: 'input',
+    doc: 'https://www.antdv.com/components/date-picker-cn',
+    props: [
+      // 以下 API 为 DatePicker、 RangePicker 共享的 API。
+      {
+        name: 'allowClear',
+        label: 'allowClear',
+        title: '是否显示清除按钮',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'autofocus',
+        label: 'autofocus',
+        title: '自动获取焦点',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'bordered',
+        label: 'bordered',
+        title: '是否有边框',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'dateRender',
+        label: 'dateRender',
+        title: '自定义日期单元格的内容'
+      },
+      {
+        name: 'disabled',
+        label: 'disabled',
+        title: '禁用',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'disabledDate',
+        label: 'disabledDate',
+        title: '不可选择的日期',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'format',
+        label: 'format',
+        title: '设置日期格式，为数组时支持多格式匹配，展示以第一个为准',
+        setters: 'StringSetter',
+        defaultValue: 'YYYY-MM-DD'
+      },
+      {
+        name: 'dropdownClassName',
+        label: 'dropdownClassName',
+        title: '额外的弹出日历 className',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'getPopupContainer',
+        label: 'getPopupContainer',
+        title: '定义浮层的容器，默认为 body 上新建 div',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'inputReadOnly',
+        label: 'inputReadOnly',
+        title: '设置输入框为只读（避免在移动设备上打开虚拟键盘）',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'local',
+        label: 'local',
+        title: '国际化配置',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'mode',
+        label: 'mode',
+        title: '日期面板的状态',
+        setters: 'SelectSetter',
+        options: ['time', 'date', 'month', 'year', 'decade']
+      },
+      {
+        name: 'open',
+        label: 'open',
+        title: '控制弹层是否展开',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'picker',
+        label: 'picker',
+        title: '设置选择器类型',
+        setters: 'SelectSetter',
+        options: ['date', 'week', 'month', 'quarter', 'year'],
+        defaultValue: 'date'
+      },
+      {
+        name: 'placeholder',
+        label: 'placeholder',
+        title: '输入框提示文字',
+        setters: ['StringSetter', 'ArraySetter']
+      },
+      {
+        name: 'placement',
+        label: 'placement',
+        title: '选择框弹出的位置',
+        setters: 'SelectSetter',
+        options: ['bottomLeft', 'bottomRight', 'topLeft', 'topRight'],
+        defaultValue: 'bottomLeft'
+      },
+      {
+        name: 'popupStyle',
+        label: 'popupStyle',
+        title: '额外的弹出日历样式',
+        setters: 'ObjectSetter',
+        defaultValue: {}
+      },
+      {
+        name: 'presets',
+        label: 'presets',
+        title: '预设时间范围快捷选择',
+        setters: 'ArraySetter'
+      },
+      {
+        name: 'size',
+        label: 'size',
+        title: '输入框大小，large 高度为 40px，small 为 24px，默认是 32px',
+        setters: 'SelectSetter',
+        options: ['large', 'middle', 'small']
+      },
+      {
+        name: 'status',
+        label: 'status',
+        title: '设置校验状态',
+        setters: 'SelectSetter',
+        options: ['error', 'warning']
+      },
+      {
+        name: 'valueFormat',
+        label: 'valueFormat',
+        title:
+          '可选，绑定值的格式，对 value、defaultValue、defaultPickerValue 起作用。不指定则绑定值为 dayjs 对象',
+        setters: 'StringSetter'
+      },
+      //  以下是 rangePicker
+      {
+        name: 'allowEmpty',
+        label: 'allowEmpty',
+        title: '允许起始项部分为空',
+        setters: ['BooleanSetter', 'BooleanSetter'],
+        defaultValue: [false, false]
+      },
+      {
+        name: 'defaultPickerValue',
+        label: 'defaultPickerValue',
+        title: '默认面板日期',
+        setters: 'ArraySetter' //?? 	dayjs[]
+      },
+      {
+        name: 'disabled',
+        label: 'disabled',
+        title: '禁用起始项',
+        setters: ['BooleanSetter', 'BooleanSetter']
+      },
+      {
+        name: 'disabledTime',
+        label: 'disabledTime',
+        title: '不可选择的时间',
+        setters: 'FunctionSetter' //?? 	function(date: dayjs, partial: start | end)
+      },
+      {
+        name: 'format',
+        label: 'format',
+        title: '展示的日期格式',
+        setters: 'StringSetter', //??  formatType
+        defaultValue: 'YYYY-MM-DD HH:mm:ss'
+      },
+      {
+        name: 'presets',
+        label: 'presets',
+        title: '预设时间范围快捷选择',
+        setters: 'ArraySetter' //??  { label: slot, value: dayjs[] }[]
+      },
+      {
+        name: 'ranges',
+        label: 'ranges',
+        title: '预设时间范围快捷选择',
+        setters: 'ObjectSetter' //??  	{ [range: string]: dayjs[] } | { [range: string]: () => dayjs[] }
+      },
+      {
+        name: 'separator',
+        label: 'separator',
+        title: '设置分隔符',
+        setters: 'StringSetter' //??  	string | v-slot:separator,
+        // defaultValue: '<SwapRightOutlined />' //?? 组件
+      },
+      {
+        name: 'showTime',
+        label: 'showTime',
+        title: '增加时间选择功能',
+        setters: ['ObjectSetter', 'BooleanSetter']
+        // defaultValue: '' //??	TimePicker Options
+      },
+      {
+        name: 'showTime.defaultValue',
+        label: 'showTime.defaultValue',
+        title: '设置用户选择日期时默认的时分秒',
+        setters: 'ArraySetter' //?? 	dayjs[]
+        // defaultValue: [dayjs(), dayjs()] //?? [dayjs(), dayjs()],
+      },
+      {
+        name: 'value',
+        label: 'value',
+        title: '日期',
+        setters: 'ArraySetter' //?? 	dayjs[]
+      }
+    ],
+    events: [
+      'openChange',
+      'panelChange',
+      'calendarChange',
+      'change',
+      'ok',
+      'update:value'
+    ],
+    slots: [
+      'dateRender',
+      'nextIcon',
+      'prevIcon',
+      'suffixIcon',
+      'superNextIcon',
+      'superPrevIcon',
+      'dateRender',
+      'renderExtraFooter'
+    ]
+  }
+];
+export default components;

package/src/antdv/description.ts

@@ -0,0 +1,153 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'ADescriptions',
+    alias: 'Descriptions',
+    label: '描述列表',
+    categoryId: 'data',
+    doc: 'https://www.antdv.com/components/descriptions-cn',
+    props: [
+      {
+        name: 'bordered',
+        label: 'bordered',
+        title: '是否展示边框',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'colon',
+        label: 'colon',
+        title: '配置 Descriptions.Item 的 colon 的默认值',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'column',
+        label: 'column',
+        title:
+          '一行的 DescriptionItems 数量，可以写成像素值或支持响应式的对象写法 { xs: 8, sm: 16, md: 24}',
+        setters: 'NumberSetter',
+        defaultValue: 3
+      },
+      {
+        name: 'contentStyle',
+        label: 'contentStyle',
+        title: '自定义内容样式',
+        setters: 'ObjectSetter' //?? cssProperties
+      },
+      {
+        name: 'extra',
+        label: 'extra',
+        title: '描述列表的操作区域，显示在右上方',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'labelStyle',
+        label: 'labelStyle',
+        title: '自定义标签样式',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'layout',
+        label: 'layout',
+        title: '描述布局',
+        setters: 'SelectSetter',
+        options: ['horizontal', 'vertical'],
+        defaultValue: 'horizontal'
+      },
+      {
+        name: 'size',
+        label: 'size',
+        title:
+          '设置列表的大小。可以设置为 middle 、small, 或不填（只有设置 bordered={true} 生效）',
+        setters: 'SelectSetter',
+        options: ['default', 'middle', 'small'],
+        defaultValue: 'default'
+      },
+      {
+        name: 'title',
+        label: 'title',
+        title: '描述列表的标题，显示在最顶部',
+        setters: 'StringSetter' //?? 	string | VNode | slot
+      }
+    ],
+    slots: ['extra', 'title'],
+    snippet: {
+      props: {
+        title: 'User Info'
+      },
+      children: [
+        {
+          name: 'ADescriptionsItem',
+          props: { label: 'UserName' },
+          children: 'chenshuishui'
+        },
+        {
+          name: 'ADescriptionsItem',
+          props: { label: 'Telephone' },
+          children: '18912345678'
+        },
+        {
+          name: 'ADescriptionsItem',
+          props: { label: 'Live' },
+          children: 'HongKong'
+        },
+        {
+          name: 'ADescriptionsItem',
+          props: { label: 'Remark' },
+          children: 'empty'
+        },
+        {
+          name: 'ADescriptionsItem',
+          props: {
+            label: 'Address'
+          },
+          children: '弥敦道9号, HongKong, China'
+        }
+      ]
+    }
+  },
+  {
+    name: 'ADescriptionsItem',
+    alias: 'DescriptionsItem',
+    label: '描述列表项',
+    categoryId: 'data',
+    doc: 'https://www.antdv.com/components/descriptions-cn',
+    props: [
+      {
+        name: 'contentStyle',
+        label: 'contentStyle',
+        title: '自定义内容样式',
+        setters: 'ObjectSetter' //?? CSSProperties
+      },
+      {
+        name: 'label',
+        label: 'label',
+        title: '内容的描述',
+        setters: 'StringSetter' //?? 	string | VNode | slot
+      },
+      {
+        name: 'labelStyle',
+        label: 'labelStyle',
+        title: '自定义标签样式',
+        setters: 'ObjectSetter' //?? 	CSSProperties
+      },
+      {
+        name: 'span',
+        label: 'span',
+        title: '包含列的数量',
+        setters: 'NumberSetter',
+        defaultValue: 1
+      }
+    ],
+    slots: ['label'],
+    snippet: {
+      props: {
+        label: 'Address'
+      },
+      children: '弥敦道9号, HongKong, China'
+    }
+  }
+];
+export default components;

package/src/antdv/divider.ts

@@ -0,0 +1,63 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'ADivider',
+    alias: 'Divider',
+    label: '分割线',
+    categoryId: 'layout',
+    doc: 'https://www.antdv.com/components/divider-cn',
+    props: [
+      {
+        name: 'dashed',
+        label: 'dashed',
+        title: '是否虚线',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'orientation',
+        label: 'orientation',
+        title: '分割线标题的位置',
+        setters: 'SelectSetter',
+        options: ['left', 'right', 'center'],
+        defaultValue: 'center'
+      },
+      {
+        name: 'orientationMargin',
+        label: 'orientationMargin',
+        title:
+          '标题和最近 left/right 边框之间的距离，去除了分割线，同时 orientation 必须为 left 或 right',
+        setters: ['StringSetter', 'NumberSetter']
+      },
+      {
+        name: 'plain',
+        label: 'plain',
+        title: '文字是否显示为普通正文样式',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'type',
+        label: 'type',
+        title: '水平还是垂直类型',
+        setters: 'SelectSetter',
+        options: ['vertical', 'horizontal'],
+        defaultValue: 'horizontal'
+      }
+    ],
+    snippet: {
+      props: {
+        type: 'horizontal',
+        dashed: true,
+        style: {
+          height: '60px',
+          borderColor: '#7cb305'
+        }
+      },
+      children: 'Text'
+    }
+  }
+];
+
+export default components;