@vtj/materials 0.9.6 → 0.9.8

package/src/element/checkbox.ts

@@ -10,51 +10,51 @@ const Checkbox: MaterialDescription[] = [
     props: [
       {
         name: 'modelValue',
+        title: '选中项绑定值',
         defaultValue: '',
         setters: ['InputSetter', 'NumberSetter', 'BooleanSetter']
       },
       {
         name: 'label',
+        title:
+          '选中状态的值，只有在绑定对象类型为 array 时有效。 如果没有 value， label则作为value使用',
         defaultValue: '',
         setters: ['InputSetter']
       },
       {
         name: 'value',
+        title:
+          '选中状态的值（只有在checkbox-group或者绑定对象类型为array时有效）',
         defaultValue: '',
         setters: ['InputSetter', 'NumberSetter', 'BooleanSetter', 'JSONSetter']
       },
       {
         name: 'trueValue',
+        title: '选中时的值',
         defaultValue: '',
         setters: ['InputSetter', 'NumberSetter']
       },
       {
         name: 'falseValue',
-        defaultValue: '',
-        setters: ['InputSetter', 'NumberSetter']
-      },
-      {
-        name: 'trueLabel',
-        defaultValue: '',
-        setters: ['InputSetter', 'NumberSetter']
-      },
-      {
-        name: 'falseLabel',
+        title: '没有选中时的值',
         defaultValue: '',
         setters: ['InputSetter', 'NumberSetter']
       },
       {
         name: 'disabled',
+        title: '是否禁用',
         defaultValue: false,
         setters: 'BooleanSetter'
       },
       {
         name: 'border',
+        title: '是否显示边框',
         defaultValue: false,
         setters: 'BooleanSetter'
       },
       {
         name: 'size',
+        title: 'Checkbox 的尺寸',
         defaultValue: 'default',
         options: ['large', 'default', 'small'],
         setters: 'SelectSetter'
@@ -66,6 +66,7 @@ const Checkbox: MaterialDescription[] = [
       },
       {
         name: 'checked',
+        title: '当前是否勾选',
         defaultValue: false,
         setters: 'BooleanSetter'
       },
@@ -73,14 +74,14 @@ const Checkbox: MaterialDescription[] = [
         name: 'indeterminate',
         defaultValue: false,
         title: '设置 indeterminate 状态，只负责样式控制',
-        label: '半选',
+        // label: '半选',
         setters: 'BooleanSetter'
       },
       {
         name: 'validateEvent',
         defaultValue: true,
         title: '输入时是否触发表单的校验',
-        label: '表单校验',
+        // label: '表单校验',
         setters: 'BooleanSetter'
       },
       {
@@ -96,8 +97,24 @@ const Checkbox: MaterialDescription[] = [
         setters: 'StringSetter'
       },
       {
-        name: 'controls',
-        label: 'controls',
+        name: 'aria-controls',
+        title: '与 aria-control一致, 当 indeterminate为 true时生效',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'trueLabel',
+        title: '选中时的值(deprecated)',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
+      {
+        name: 'falseLabel',
+        title: '没有选中时的值(deprecated)',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
+      {
+        name: 'controls(deprecated)',
         title: '与 aria-control一致, 当 indeterminate为 true时生效',
         setters: 'BooleanSetter'
       }
@@ -128,42 +145,44 @@ const Checkbox: MaterialDescription[] = [
     props: [
       {
         name: 'modelValue',
+        title: '绑定值',
         defaultValue: [],
         setters: 'JSONSetter'
       },
       {
         name: 'size',
+        title: '多选框组尺寸',
         defaultValue: '',
         options: ['large', 'default', 'small'],
         setters: 'SelectSetter'
       },
       {
         name: 'disabled',
+        title: '是否禁用',
         defaultValue: false,
         setters: 'BooleanSetter'
       },
       {
         name: 'min',
+        title: '可被勾选的 checkbox 的最小数量',
         defaultValue: '',
         setters: 'NumberSetter'
       },
       {
         name: 'max',
+        title: '可被勾选的 checkbox 的最大数量',
         defaultValue: '',
         setters: 'NumberSetter'
       },
       {
-        name: 'label',
+        name: 'aria-label',
+        title: '原生 aria-label属性',
         defaultValue: '',
         setters: 'InputSetter'
       },
-      {
-        name: 'value',
-        defaultValue: '',
-        setters: ['InputSetter', 'NumberSetter', 'BooleanSetter', 'JSONSetter']
-      },
       {
         name: 'textColor',
+        title: '当按钮为活跃状态时的字体颜色',
         defaultValue: '#ffffff',
         setters: 'ColorSetter'
       },
@@ -173,12 +192,23 @@ const Checkbox: MaterialDescription[] = [
         title: '当按钮为活跃状态时的边框和背景颜色',
         setters: 'ColorSetter'
       },
+      {
+        name: 'tag',
+        defaultValue: 'div',
+        title: '复选框组元素标签',
+        setters: 'StringSetter'
+      },
       {
         name: 'validateEvent',
         defaultValue: true,
         title: '输入时是否触发表单的校验',
-        label: '表单校验',
         setters: 'BooleanSetter'
+      },
+      {
+        name: 'label',
+        title: '原生 aria-label属性',
+        defaultValue: '',
+        setters: 'StringSetter'
       }
     ],
     events: ['change', 'update:modelValue'],
@@ -216,37 +246,62 @@ const Checkbox: MaterialDescription[] = [
     categoryId: 'form',
     package: 'element-plus',
     props: [
+      {
+        name: 'modelValue',
+        title: '选中状态的值，只有在绑定对象类型为 array 时有效。',
+        defaultValue: [],
+        setters: ['StringSetter', 'NumberSetter', 'BooleanSetter', 'JSONSetter']
+      },
       {
         name: 'label',
+        title:
+          '选中状态的值，只有在绑定对象类型为 array 时有效。 如果没有 value， label则作为value使用',
         defaultValue: '',
-        setters: ['JSONSetter', 'InputSetter', 'NumberSetter', 'BooleanSetter']
+        setters: ['StringSetter', 'NumberSetter', 'BooleanSetter', 'JSONSetter']
       },
       {
-        name: 'trueLabel',
+        name: 'trueValue',
+        title: '选中时的值',
         defaultValue: '',
-        setters: ['InputSetter', 'NumberSetter']
+        setters: ['StringSetter', 'NumberSetter']
       },
       {
-        name: 'falseLabel',
+        name: 'falseValue',
+        title: '没有选中时的值',
         defaultValue: '',
-        setters: ['InputSetter', 'NumberSetter']
+        setters: ['StringSetter', 'NumberSetter']
       },
       {
         name: 'disabled',
+        title: '是否禁用',
         defaultValue: false,
         setters: 'BooleanSetter'
       },
       {
         name: 'name',
+        title: '原生 name 属性',
         defaultValue: '',
-        setters: 'InputSetter'
+        setters: 'StringSetter'
       },
       {
         name: 'checked',
         defaultValue: false,
         setters: 'BooleanSetter'
+      },
+      {
+        name: 'trueLabel',
+        title: '选中时的值',
+        defaultValue: '',
+        setters: ['StringSetter', 'NumberSetter']
+      },
+      {
+        name: 'falseLabel',
+        title: '没有选中时的值',
+        defaultValue: '',
+        setters: ['StringSetter', 'NumberSetter']
       }
     ],
+    slots: ['default'],
     snippet: {
       props: {
         label: '按钮选项'

package/src/element/collapse.ts

@@ -14,7 +14,7 @@ const Collapse: MaterialDescription[] = [
         defaultValue: '',
         title:
           '当前激活的面板(如果是手风琴模式，绑定值类型需要为string，否则为array)',
-        setters: ['InputSetter', 'JSONSetter']
+        setters: ['InputSetter', 'ArraySetter', 'JSONSetter']
       },
       {
         name: 'accordion',
@@ -63,6 +63,11 @@ const Collapse: MaterialDescription[] = [
         defaultValue: '',
         setters: 'InputSetter'
       },
+      {
+        name: 'icon',
+        defaultValue: 'ArrowRight',
+        setters: 'StringSetter'
+      },
       {
         name: 'disabled',
         defaultValue: false,
@@ -76,6 +81,9 @@ const Collapse: MaterialDescription[] = [
       },
       {
         name: 'title'
+      },
+      {
+        name: 'icon'
       }
     ],
     snippet: {

package/src/element/colorPicker.ts

@@ -10,11 +10,13 @@ const ColorPicker: MaterialDescription = {
   props: [
     {
       name: 'modelValue',
+      title: '选中项绑定值',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'disabled',
+      title: '是否禁用',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
@@ -26,27 +28,32 @@ const ColorPicker: MaterialDescription = {
     },
     {
       name: 'showAlpha',
+      title: '是否支持透明度选择',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'colorFormat',
+      title: '写入 v-model 的颜色的格式',
       defaultValue: '',
       options: ['hsl', 'hsv', 'hex', 'rgb'],
       setters: 'SelectSetter'
     },
     {
       name: 'popperClass',
+      title: 'ColorPicker 下拉框的类名',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'predefine',
+      title: '预定义颜色',
       defaultValue: '',
       setters: 'JSONSetter'
     },
     {
       name: 'validateEvent',
+      title: '输入时是否触发表单的校验',
       defaultValue: true,
       setters: 'BooleanSetter'
     },
@@ -58,16 +65,25 @@ const ColorPicker: MaterialDescription = {
       defaultValue: 0
     },
     {
-      name: 'label',
-      label: 'label',
+      name: 'aria-label',
       title: 'ColorPicker 的 aria-label',
       setters: 'StringSetter'
     },
     {
       name: 'id',
-      label: 'id',
       title: 'ColorPicker 的 id',
       setters: 'StringSetter'
+    },
+    {
+      name: 'teleported',
+      title: '是否将 popover 的下拉列表渲染至 body 下',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'label',
+      title: 'ColorPicker 的 aria-label(deprecated)',
+      setters: 'StringSetter'
     }
   ],
   events: [

package/src/element/datePicker.ts

@@ -9,8 +9,14 @@ const DatePicker: MaterialDescription = {
   props: [
     {
       name: 'modelValue',
+      title: '绑定值，如果它是数组，长度应该是 2',
       defaultValue: '',
-      setters: 'ExpressionSetter'
+      setters: [
+        'NumberSetter',
+        'StringSetter',
+        'ArraySetter',
+        'ExpressionSetter'
+      ]
     },
     {
       name: 'readonly',
@@ -30,6 +36,7 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'editable',
+      title: '文本框可输入',
       defaultValue: true,
       setters: 'BooleanSetter'
     },
@@ -47,14 +54,12 @@ const DatePicker: MaterialDescription = {
       name: 'startPlaceholder',
       defaultValue: '',
       title: '范围选择时开始日期的占位内容',
-      label: '开始日期',
       setters: 'InputSetter'
     },
     {
       name: 'endPlaceholder',
       defaultValue: '',
       title: '范围选择时结束日期的占位内容',
-      label: '结束日期',
       setters: 'InputSetter'
     },
     {
@@ -63,61 +68,62 @@ const DatePicker: MaterialDescription = {
       title: '显示类型',
       options: [
         'year',
+        'years',
         'month',
+        'months',
         'date',
         'dates',
         'datetime',
         'week',
         'datetimerange',
         'daterange',
-        'monthrange'
+        'monthrange',
+        'yearrange'
       ],
       setters: 'SelectSetter'
     },
     {
       name: 'format',
+      title: '显示在输入框中的格式',
       defaultValue: 'YYYY-MM-DD',
       setters: 'InputSetter'
     },
     {
       name: 'popperClass',
+      title: 'DatePicker 下拉框的类名',
       defaultValue: '',
       setters: 'InputSetter'
     },
+    {
+      name: 'popper-options',
+      title: '自定义 popper 选项',
+      defaultValue: '',
+      setters: ['ObjectSetter', 'JSONSetter']
+    },
     {
       name: 'rangeSeparator',
       defaultValue: '-',
       title: '选择范围时的分隔符',
-      label: '分隔符',
       setters: 'InputSetter'
     },
     {
       name: 'defaultValue',
+      title: '可选，选择器打开时默认显示的时间',
       defaultValue: '',
       setters: 'ExpressionSetter'
     },
     {
       name: 'defaultTime',
+      title: '范围选择时选中日期所使用的当日内具体时刻',
       defaultValue: '',
       setters: 'ExpressionSetter'
     },
     {
       name: 'valueFormat',
+      title: '可选，绑定值的格式。 不指定则绑定值为 Date 对象',
       defaultValue: '',
       setters: 'InputSetter'
     },
-    {
-      name: 'dateFormat',
-      defaultValue: '',
-      setters: 'InputSetter',
-      title: '时间选择器下拉列表中显示的日期格式'
-    },
-    {
-      name: 'timeFormat',
-      defaultValue: '',
-      setters: 'InputSetter',
-      title: '时间选择器下拉列表中显示的时间格式'
-    },
     {
       name: 'id',
       defaultValue: '',
@@ -130,6 +136,7 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'unlinkPanels',
+      title: '在范围选择器里取消两个日期面板之间的联动',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
@@ -153,6 +160,8 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'disabledDate',
+      title:
+        '一个用来判断该日期是否被禁用的函数，接受一个 Date 对象作为参数。 应该返回一个 Boolean 值。',
       defaultValue: '',
       setters: 'FunctionSetter'
     },
@@ -171,8 +180,48 @@ const DatePicker: MaterialDescription = {
     {
       name: 'teleported',
       defaultValue: true,
-      title: '设置自定义类名',
+      title: '是否将 date-picker 的下拉列表插入至 body 元素',
       setters: 'BooleanSetter'
+    },
+    {
+      name: 'empty-values',
+      title: '组件的空值配置',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'value-on-clear',
+      title: '清空选项的值',
+      setters: [
+        'StringSetter',
+        'NumberSetter',
+        'BooleanSetter',
+        'FunctionSetter'
+      ]
+    },
+    {
+      name: 'fallback-placements',
+      title: 'Tooltip 可用的 positions',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'placement',
+      title: '下拉框出现的位置',
+      defaultValue: 'bottom',
+      setters: 'SelectSetter',
+      options: [
+        'top',
+        'top-start',
+        'top-end',
+        'bottom',
+        'bottom-start',
+        'bottom-end',
+        'left',
+        'left-start',
+        'left-end',
+        'right',
+        'right-start',
+        'right-end'
+      ]
     }
   ],
   events: [
@@ -185,6 +234,9 @@ const DatePicker: MaterialDescription = {
     {
       name: 'focus'
     },
+    {
+      name: 'clear'
+    },
     {
       name: 'calendar-change'
     },
@@ -204,6 +256,18 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'range-separator'
+    },
+    {
+      name: 'prev-month'
+    },
+    {
+      name: 'next-month'
+    },
+    {
+      name: 'prev-year'
+    },
+    {
+      name: 'next-year'
     }
   ]
 };