@vtj/materials 0.9.7 → 0.9.8

package/src/element/avatar.ts

@@ -11,7 +11,7 @@ const Avatar: MaterialDescription = {
     {
       name: 'icon',
       defaultValue: '',
-      setters: 'IconSetter' //!
+      setters: 'IconSetter'
     },
     {
       name: 'size',
@@ -48,7 +48,7 @@ const Avatar: MaterialDescription = {
     }
   ],
   events: ['error'],
-  slots: ['default'],
+  slots: ['default', 'icon'],
   snippet: {
     props: {
       src: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'

package/src/element/badge.ts

@@ -47,9 +47,24 @@ const Badge: MaterialDescription = {
       name: 'color',
       title: '背景色',
       setters: 'ColorSetter'
+    },
+    {
+      name: 'offset',
+      title: 'badge 的偏移量',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'badgeStyle',
+      title: '自定义 badge 样式',
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'badgeClass',
+      title: '自定义 badge 类名',
+      setters: 'StringSetter'
     }
   ],
-  slots: ['default'],
+  slots: ['default', 'content'],
   snippet: {
     props: {
       value: 12

package/src/element/breadcrumb.ts

@@ -11,7 +11,7 @@ const Breadcrumb: MaterialDescription[] = [
     props: [
       {
         name: 'separator',
-        defaultValue: '',
+        defaultValue: '/',
         setters: 'InputSetter'
       },
       {
@@ -20,7 +20,7 @@ const Breadcrumb: MaterialDescription[] = [
         setters: ['InputSetter']
       }
     ],
-    slots: ['default'],
+    slots: ['default', 'separatorIcon'],
     snippet: {
       children: [
         {

package/src/element/calendar.ts

@@ -10,12 +10,12 @@ const Calendar: MaterialDescription = {
     {
       name: 'modelValue',
       defaultValue: '',
-      setters: 'ExpressionSetter'
+      setters: ['StringSetter', 'ExpressionSetter']
     },
     {
       name: 'range',
       defaultValue: '',
-      setters: 'JSONSetter'
+      setters: ['ArraySetter', 'JSONSetter']
     }
   ],
   events: ['update:modelValue'],

package/src/element/carousel.ts

@@ -38,7 +38,7 @@ const Carousel: MaterialDescription[] = [
       {
         name: 'indicatorPosition',
         defaultValue: '',
-        options: ['outside', 'none'],
+        options: ['', 'outside', 'none'],
         label: '指示器',
         setters: 'InputSetter'
       },
@@ -54,6 +54,11 @@ const Carousel: MaterialDescription[] = [
         options: ['', 'card'],
         setters: 'SelectSetter'
       },
+      {
+        name: 'cardScale',
+        defaultValue: 0.83,
+        setters: 'NumberSetter'
+      },
       {
         name: 'loop',
         defaultValue: true,
@@ -77,6 +82,7 @@ const Carousel: MaterialDescription[] = [
       }
     ],
     events: ['change'],
+    slots: ['default'],
     snippet: {
       props: {
         height: '300px',
@@ -136,6 +142,7 @@ const Carousel: MaterialDescription[] = [
         setters: 'InputSetter'
       }
     ],
+    slots: ['default'],
     snippet: {
       props: {
         style: {

package/src/element/cascader.ts

@@ -220,14 +220,7 @@ const Cascader: MaterialDescription[] = [
         name: 'update:modelValue'
       }
     ],
-    slots: [
-      {
-        name: 'default'
-      },
-      {
-        name: 'empty'
-      }
-    ],
+    slots: [{ name: 'default', params: ['node', 'data'] }, { name: 'empty' }],
     snippet: {
       props: {
         options: mockTreeData(),
@@ -273,7 +266,7 @@ const Cascader: MaterialDescription[] = [
         name: 'close'
       }
     ],
-    slots: ['default', 'empty'],
+    slots: [{ name: 'default', params: ['node', 'data'] }, { name: 'empty' }],
     snippet: {
       props: {
         options: mockTreeData(),

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

@@ -68,14 +68,17 @@ const DatePicker: MaterialDescription = {
       title: '显示类型',
       options: [
         'year',
+        'years',
         'month',
+        'months',
         'date',
         'dates',
         'datetime',
         'week',
         'datetimerange',
         'daterange',
-        'monthrange'
+        'monthrange',
+        'yearrange'
       ],
       setters: 'SelectSetter'
     },

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

@@ -150,7 +150,7 @@ const form: MaterialDescription[] = [
       {
         name: 'prop',
         defaultValue: '',
-        setters: ['InputSetter']
+        setters: ['InputSetter', 'ArraySetter']
       },
       {
         name: 'label',

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

@@ -60,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';
@@ -137,6 +138,7 @@ const components: MaterialDescription[] = [
   slider,
   space,
   statistic,
+  Segmented,
   steps,
   Switch,
   table,

package/src/element/menu.ts

@@ -28,7 +28,7 @@ const Menu: MaterialDescription[] = [
         name: 'ellipsisIcon',
         label: 'ellipsisIcon',
         title: '自定义省略图标 (仅在水平模式下可用)',
-        setters: 'StringSetter' //?? component
+        setters: 'StringSetter'
       },
       {
         name: 'popperOffset',
@@ -37,21 +37,6 @@ const Menu: MaterialDescription[] = [
         setters: 'NumberSetter',
         defaultValue: 6
       },
-      {
-        name: 'backgroundColor',
-        defaultValue: '#ffffff',
-        setters: 'ColorSetter'
-      },
-      {
-        name: 'textColor',
-        defaultValue: '#303133',
-        setters: 'ColorSetter'
-      },
-      {
-        name: 'activeTextColor',
-        defaultValue: '#409EFF',
-        setters: 'ColorSetter'
-      },
       {
         name: 'defaultActive',
         defaultValue: '',
@@ -99,8 +84,8 @@ const Menu: MaterialDescription[] = [
         defaultValue: false
       },
       {
-        name: 'popperClass ',
-        label: 'popperClass ',
+        name: 'popperClass',
+        label: 'popperClass',
         title: '为 popper 添加类名',
         setters: 'StringSetter'
       },
@@ -117,6 +102,21 @@ const Menu: MaterialDescription[] = [
         title: '菜单消失前的延迟',
         setters: 'NumberSetter',
         defaultValue: 300
+      },
+      {
+        name: 'backgroundColor',
+        defaultValue: '#ffffff',
+        setters: 'ColorSetter'
+      },
+      {
+        name: 'textColor',
+        defaultValue: '#303133',
+        setters: 'ColorSetter'
+      },
+      {
+        name: 'activeTextColor',
+        defaultValue: '#409EFF',
+        setters: 'ColorSetter'
       }
     ],
     events: [
@@ -130,7 +130,7 @@ const Menu: MaterialDescription[] = [
         name: 'close'
       }
     ],
-    slots: ['default'],
+    slots: ['default', 'ellipsis-icon'],
     snippet: {
       props: {
         mode: 'horizontal'
@@ -192,6 +192,7 @@ const Menu: MaterialDescription[] = [
     props: [
       {
         name: 'index',
+        label: 'index *',
         defaultValue: '',
         setters: 'InputSetter'
       },
@@ -202,12 +203,10 @@ const Menu: MaterialDescription[] = [
       },
       {
         name: 'showTimeout',
-        defaultValue: 300,
         setters: 'NumberSetter'
       },
       {
         name: 'hideTimeout',
-        defaultValue: 300,
         setters: 'NumberSetter'
       },
       {
@@ -215,6 +214,11 @@ const Menu: MaterialDescription[] = [
         defaultValue: false,
         setters: 'BooleanSetter'
       },
+      {
+        name: 'teleported',
+        defaultValue: undefined,
+        setters: 'BooleanSetter'
+      },
       {
         name: 'popperOffset',
         defaultValue: 6,
@@ -281,7 +285,7 @@ const Menu: MaterialDescription[] = [
       {
         name: 'route',
         defaultValue: '',
-        setters: 'JSONSetter'
+        setters: ['StringSetter', 'JSONSetter']
       },
       {
         name: 'disabled',

package/src/element/pageHeader.ts

@@ -10,12 +10,12 @@ const components: MaterialDescription = {
   props: [
     {
       name: 'icon',
-      defaultValue: undefined,
+      defaultValue: 'Back',
       setters: 'InputSetter'
     },
     {
       name: 'title',
-      defaultValue: 'Back',
+      defaultValue: '',
       setters: 'InputSetter'
     },
     {