@vtj/materials 0.9.6 → 0.9.7

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'
     },
     {
@@ -76,48 +81,46 @@ const DatePicker: MaterialDescription = {
     },
     {
       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 +133,7 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'unlinkPanels',
+      title: '在范围选择器里取消两个日期面板之间的联动',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
@@ -153,6 +157,8 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'disabledDate',
+      title:
+        '一个用来判断该日期是否被禁用的函数，接受一个 Date 对象作为参数。 应该返回一个 Boolean 值。',
       defaultValue: '',
       setters: 'FunctionSetter'
     },
@@ -171,8 +177,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 +231,9 @@ const DatePicker: MaterialDescription = {
     {
       name: 'focus'
     },
+    {
+      name: 'clear'
+    },
     {
       name: 'calendar-change'
     },
@@ -204,6 +253,18 @@ const DatePicker: MaterialDescription = {
     },
     {
       name: 'range-separator'
+    },
+    {
+      name: 'prev-month'
+    },
+    {
+      name: 'next-month'
+    },
+    {
+      name: 'prev-year'
+    },
+    {
+      name: 'next-year'
     }
   ]
 };

package/src/element/dateTime.ts

@@ -11,7 +11,7 @@ const dateTime: MaterialDescription = {
     {
       name: 'modelValue',
       defaultValue: '',
-      setters: 'ExpressionSetter'
+      setters: ['NumberSetter', 'StringSetter', 'ExpressionSetter']
     },
     {
       name: 'readonly',
@@ -42,25 +42,22 @@ const dateTime: MaterialDescription = {
     {
       name: 'placeholder',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'startPlaceholder',
       defaultValue: '',
       title: '范围选择时开始日期的占位内容',
-      label: '开始日期',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'endPlaceholder',
       defaultValue: '',
       title: '范围选择时结束日期的占位内容',
-      label: '结束日期',
       setters: 'InputSetter'
     },
     {
       name: 'arrowControl',
-      label: 'arrowControl',
       title: '是否使用箭头进行时间选择',
       setters: 'BooleanSetter',
       defaultValue: false
@@ -84,60 +81,65 @@ const dateTime: MaterialDescription = {
     },
     {
       name: 'format',
+      title: '显示在输入框中的格式',
       defaultValue: 'YYYY-MM-DD HH:mm:ss',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'popperClass',
+      title: 'DateTimePicker 下拉框的类名',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'rangeSeparator',
       defaultValue: '-',
       title: '选择范围时的分隔符',
-      label: '分隔符',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'defaultValue',
+      title: '可选，选择器打开时默认显示的时间',
       defaultValue: '',
       setters: 'ExpressionSetter'
     },
     {
       name: 'defaultTime',
+      title: '选择日期后的默认时间值。 如未指定则默认时间值为 00:00:00',
       defaultValue: '',
       setters: 'ExpressionSetter'
     },
     {
       name: 'valueFormat',
+      title: '可选，绑定值的格式。 不指定则绑定值为 Date 对象',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'dateFormat',
       defaultValue: '',
-      setters: 'InputSetter',
+      setters: 'StringSetter',
       title: '时间选择器下拉列表中显示的日期格式'
     },
     {
       name: 'timeFormat',
       defaultValue: '',
-      setters: 'InputSetter',
+      setters: 'StringSetter',
       title: '时间选择器下拉列表中显示的时间格式'
     },
     {
       name: 'id',
       defaultValue: '',
-      setters: ['InputSetter']
+      setters: ['StringSetter', 'ArraySetter', 'ExpressionSetter']
     },
     {
       name: 'name',
       defaultValue: '',
-      setters: 'InputSetter'
+      setters: 'StringSetter'
     },
     {
       name: 'unlinkPanels',
+      title: '在范围选择器里取消两个日期面板之间的联动',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
@@ -176,6 +178,27 @@ const dateTime: MaterialDescription = {
       defaultValue: true,
       title: '设置自定义类名',
       setters: 'BooleanSetter'
+    },
+    {
+      name: 'emptyValues',
+      title: '组件的空值配置',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'valueOnClear',
+      title: '清空选项的值',
+      setters: [
+        'StringSetter',
+        'NumberSetter',
+        'BooleanSetter',
+        'FunctionSetter'
+      ]
+    },
+    {
+      name: 'showNow',
+      title: '是否显示 now 按钮',
+      defaultValue: true,
+      setters: 'BooleanSetter'
     }
   ],
   events: [
@@ -188,6 +211,9 @@ const dateTime: MaterialDescription = {
     {
       name: 'focus'
     },
+    {
+      name: 'clear'
+    },
     {
       name: 'calendar-change'
     },
@@ -204,6 +230,18 @@ const dateTime: MaterialDescription = {
     },
     {
       name: 'range-separator'
+    },
+    {
+      name: 'prev-month'
+    },
+    {
+      name: 'next-month'
+    },
+    {
+      name: 'prev-year'
+    },
+    {
+      name: 'next-year'
     }
   ],
   snippet: {

package/src/element/form.ts

@@ -10,6 +10,7 @@ const form: MaterialDescription[] = [
     props: [
       {
         name: 'model',
+        title: '表单数据对象',
         defaultValue: '',
         setters: 'ExpressionSetter'
       },
@@ -43,14 +44,12 @@ const form: MaterialDescription[] = [
         name: 'hideRequiredAsterisk',
         defaultValue: false,
         title: '是否显示必填字段的标签旁边的红色星号',
-        label: '隐藏必填星号',
         setters: 'BooleanSetter'
       },
       {
         name: 'requireAsteriskPosition',
         defaultValue: 'left',
         title: '星号的位置',
-        label: '星号位置',
         options: ['left', 'right'],
         setters: 'SelectSetter'
       },
@@ -58,7 +57,6 @@ const form: MaterialDescription[] = [
         name: 'showMessage',
         defaultValue: true,
         title: '是否显示校验错误信息',
-        label: '显示错误',
         setters: 'BooleanSetter'
       },
       {
@@ -77,7 +75,6 @@ const form: MaterialDescription[] = [
         name: 'validateOnRuleChange',
         defaultValue: true,
         title: '是否在 rules 属性改变后立即触发一次验证',
-        label: 'validate',
         setters: 'BooleanSetter'
       },
       {
@@ -95,6 +92,11 @@ const form: MaterialDescription[] = [
         name: 'scrollToError',
         defaultValue: false,
         setters: 'BooleanSetter'
+      },
+      {
+        name: 'scrollIntoViewOptions',
+        defaultValue: '',
+        setters: ['ExpressionSetter', 'BooleanSetter']
       }
     ],
     events: [
@@ -102,6 +104,7 @@ const form: MaterialDescription[] = [
         name: 'validate'
       }
     ],
+    slots: ['default'],
     snippet: {
       name: 'ElForm',
       props: {
@@ -154,6 +157,12 @@ const form: MaterialDescription[] = [
         defaultValue: '',
         setters: 'InputSetter'
       },
+      {
+        name: 'labelPosition',
+        defaultValue: '',
+        setters: 'SelectSetter',
+        options: ['left', 'right', 'top']
+      },
       {
         name: 'labelWidth',
         defaultValue: '',
@@ -193,6 +202,17 @@ const form: MaterialDescription[] = [
         defaultValue: 'default',
         options: ['large', 'default', 'small'],
         setters: 'SelectSetter'
+      },
+      {
+        name: 'for',
+        defaultValue: '',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'validateStatus',
+        title: 'formitem 校验的状态',
+        options: ['', 'error', 'validating', 'success'],
+        setters: 'SelectSetter'
       }
     ],
     slots: ['default', 'label', 'error'],

package/src/element/index.ts

@@ -24,6 +24,8 @@ import datePicker from './datePicker';
 import dateTime from './dateTime';
 import input from './input';
 import inputNumber from './inputNumber';
+import inputTag from './inputTag';
+import Mention from './mention';
 import radio from './radio';
 import rate from './rate';
 import select from './select';
@@ -115,6 +117,8 @@ const components: MaterialDescription[] = [
   image,
   input,
   inputNumber,
+  inputTag,
+  Mention,
   layout,
   link,
   menu,

package/src/element/input.ts

@@ -136,7 +136,7 @@ const Input: MaterialDescription = {
       setters: 'InputSetter'
     },
     {
-      name: 'label',
+      name: 'aria-label',
       defaultValue: '',
       setters: 'InputSetter'
     },

package/src/element/inputNumber.ts

@@ -41,7 +41,7 @@ const InputNumber: MaterialDescription = {
     {
       name: 'size',
       defaultValue: 'default',
-      options: ['large', 'small'],
+      options: ['large', 'default', 'small'],
       setters: 'SelectSetter'
     },
     {
@@ -73,7 +73,7 @@ const InputNumber: MaterialDescription = {
       setters: 'InputSetter'
     },
     {
-      name: 'label',
+      name: 'ariaLabel',
       defaultValue: '',
       setters: 'InputSetter'
     },
@@ -94,7 +94,7 @@ const InputNumber: MaterialDescription = {
       setters: 'BooleanSetter'
     }
   ],
-  slots: ['decrease-icon', 'increase-icon'],
+  slots: ['decrease-icon', 'increase-icon', 'prefix', 'suffix'],
   events: [
     {
       name: 'change'