@vtj/materials 0.9.6 → 0.9.8

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/descriptions.ts

@@ -26,8 +26,8 @@ const Descriptions: MaterialDescription[] = [
       },
       {
         name: 'size',
-        defaultValue: 'default',
-        options: ['large', 'default', 'small'],
+        defaultValue: '',
+        options: ['', 'large', 'default', 'small'],
         setters: 'SelectSetter'
       },
       {
@@ -39,6 +39,11 @@ const Descriptions: MaterialDescription[] = [
         name: 'extra',
         defaultValue: '',
         setters: 'InputSetter'
+      },
+      {
+        name: 'labelWidth',
+        defaultValue: '',
+        setters: ['StringSetter', 'NumberSetter']
       }
     ],
     slots: ['default', 'title', 'extra'],
@@ -97,6 +102,11 @@ const Descriptions: MaterialDescription[] = [
         defaultValue: 1,
         setters: 'NumberSetter'
       },
+      {
+        name: 'rowspan',
+        defaultValue: 1,
+        setters: 'NumberSetter'
+      },
       {
         name: 'width',
         defaultValue: '',
@@ -107,6 +117,11 @@ const Descriptions: MaterialDescription[] = [
         defaultValue: '',
         setters: ['InputSetter', 'NumberSetter']
       },
+      {
+        name: 'labelWidth',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
       {
         name: 'align',
         defaultValue: 'left',

package/src/element/dialog.ts

@@ -19,8 +19,8 @@ const components: MaterialDescription = {
     },
     {
       name: 'width',
-      defaultValue: '50%',
-      setters: 'InputSetter'
+      defaultValue: '',
+      setters: ['InputSetter', 'NumberSetter']
     },
     {
       name: 'fullscreen',
@@ -29,7 +29,7 @@ const components: MaterialDescription = {
     },
     {
       name: 'top',
-      defaultValue: '15vh',
+      defaultValue: '',
       setters: 'InputSetter'
     },
     {
@@ -60,11 +60,6 @@ const components: MaterialDescription = {
       defaultValue: true,
       setters: 'BooleanSetter'
     },
-    {
-      name: 'customClass',
-      defaultValue: '',
-      setters: 'InputSetter'
-    },
     {
       name: 'openDelay',
       defaultValue: 0,
@@ -82,7 +77,7 @@ const components: MaterialDescription = {
       setters: 'BooleanSetter'
     },
     {
-      name: 'closOonPressEscape',
+      name: 'closeOnPressEscape',
       label: 'ESC键关闭',
       defaultValue: true,
       setters: 'BooleanSetter'
@@ -128,7 +123,7 @@ const components: MaterialDescription = {
       name: 'closeIcon',
       label: 'closeIcon',
       title: '自定义关闭图标',
-      setters: ['StringSetter', 'IconSetter'] //!  string / Component
+      setters: ['StringSetter', 'IconSetter']
     },
     {
       name: 'z-index',
@@ -142,6 +137,11 @@ const components: MaterialDescription = {
       title: 'header 的 aria-level 属性',
       setters: 'StringSetter',
       defaultValue: 2
+    },
+    {
+      name: 'customClass',
+      defaultValue: '',
+      setters: 'InputSetter'
     }
   ],
   events: [
@@ -176,6 +176,9 @@ const components: MaterialDescription = {
     },
     {
       name: 'footer'
+    },
+    {
+      name: 'title'
     }
   ],
   snippet: {

package/src/element/drawer.ts

@@ -17,6 +17,11 @@ const components: MaterialDescription = {
       defaultValue: false,
       setters: 'BooleanSetter'
     },
+    {
+      name: 'appendTo',
+      defaultValue: 'body',
+      setters: 'StringSetter'
+    },
     {
       name: 'lockScroll',
       defaultValue: true,
@@ -49,11 +54,6 @@ const components: MaterialDescription = {
       defaultValue: 0,
       setters: 'NumberSetter'
     },
-    {
-      name: 'customClass',
-      defaultValue: '',
-      setters: 'InputSetter'
-    },
     {
       name: 'destroyOnClose',
       defaultValue: false,
@@ -108,6 +108,11 @@ const components: MaterialDescription = {
       title: 'header 的 aria-level 属性',
       setters: 'StringSetter',
       defaultValue: 2
+    },
+    {
+      name: 'customClass',
+      defaultValue: '',
+      setters: 'InputSetter'
     }
   ],
   events: [
@@ -139,6 +144,9 @@ const components: MaterialDescription = {
     },
     {
       name: 'footer'
+    },
+    {
+      name: 'title'
     }
   ],
   snippet: {

package/src/element/dropdown.ts

@@ -11,7 +11,16 @@ const Dropdown: MaterialDescription[] = [
       {
         name: 'type',
         defaultValue: '',
-        options: ['primary', 'warning', 'success', 'danger', 'info'],
+        options: [
+          '',
+          'default',
+          'primary',
+          'success',
+          'warning',
+          'info',
+          'danger',
+          'text'
+        ],
         setters: 'SelectSetter'
       },
       {
@@ -54,6 +63,12 @@ const Dropdown: MaterialDescription[] = [
         setters: 'SelectSetter',
         options: ['hover', 'click', 'contextmenu']
       },
+      {
+        name: 'triggerKeys',
+        title: '指定键盘上哪些按键可以触发操作',
+        defaultValue: ['Enter', 'Space', 'ArrowDown', 'NumpadEnter'],
+        setters: 'ArraySetter'
+      },
       {
         name: 'hideOnClick',
         defaultValue: true,
@@ -61,7 +76,7 @@ const Dropdown: MaterialDescription[] = [
       },
       {
         name: 'showTimeout',
-        defaultValue: 250,
+        defaultValue: 150,
         setters: 'NumberSetter'
       },
       {
@@ -77,7 +92,7 @@ const Dropdown: MaterialDescription[] = [
       {
         name: 'tabindex',
         defaultValue: 0,
-        setters: 'NumberSetter'
+        setters: ['NumberSetter', 'StringSetter']
       },
       {
         name: 'popperClass',
@@ -86,7 +101,11 @@ const Dropdown: MaterialDescription[] = [
       },
       {
         name: 'popperOptions',
-        defaultValue: undefined,
+        defaultValue: {
+          modifiers: [
+            { name: 'computeStyles', options: { gpuAcceleration: false } }
+          ]
+        },
         setters: 'JSONSetter'
       },
       {
@@ -164,7 +183,8 @@ const Dropdown: MaterialDescription[] = [
     label: '下拉菜单Menu',
 
     categoryId: 'nav',
-    package: 'element-plus'
+    package: 'element-plus',
+    slots: ['default']
   },
   {
     name: 'ElDropdownItem',
@@ -195,7 +215,7 @@ const Dropdown: MaterialDescription[] = [
         setters: ['InputSetter']
       }
     ],
-    slots: ['default'],
+    slots: ['default', 'icon'],
     snippet: {
       name: 'ElDropdownItem',
       children: '下拉选项'

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: {
@@ -147,13 +150,19 @@ const form: MaterialDescription[] = [
       {
         name: 'prop',
         defaultValue: '',
-        setters: ['InputSetter']
+        setters: ['InputSetter', 'ArraySetter']
       },
       {
         name: 'label',
         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/image.ts

@@ -16,7 +16,7 @@ const Image: MaterialDescription = {
     {
       name: 'fit',
       defaultValue: '',
-      options: ['fill', 'contain', 'cover', 'none', 'scale-down'],
+      options: ['', 'fill', 'contain', 'cover', 'none', 'scale-down'],
       setters: 'SelectSetter'
     },
     {
@@ -60,7 +60,7 @@ const Image: MaterialDescription = {
     {
       name: 'previewSrcList',
       defaultValue: '',
-      setters: 'JSONSetter'
+      setters: ['ArraySetter', 'JSONSetter']
     },
     {
       name: 'zIndex',

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';
@@ -58,6 +60,7 @@ import tree from './tree';
 import treeSelect from './treeSelect';
 import treeV2 from './treeV2';
 import statistic from './statistic';
+import Segmented from './segmented';
 
 // * nav 导航
 import affix from './affix';
@@ -115,6 +118,8 @@ const components: MaterialDescription[] = [
   image,
   input,
   inputNumber,
+  inputTag,
+  Mention,
   layout,
   link,
   menu,
@@ -133,6 +138,7 @@ const components: MaterialDescription[] = [
   slider,
   space,
   statistic,
+  Segmented,
   steps,
   Switch,
   table,

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'