@vtj/materials 0.15.1 → 0.16.0

package/src/element/input.ts

@@ -9,22 +9,31 @@ const Input: MaterialDescription = {
   props: [
     {
       name: 'type',
+      title: '输入类型',
       defaultValue: 'text',
-      options: ['text', 'textarea'],
+      options: ['text', 'textarea', 'number', 'password', 'email', 'search', 'tel', 'url'],
       setters: ['SelectSetter', 'InputSetter']
     },
     {
       name: 'modelValue',
+      title: '绑定值',
       defaultValue: '',
       setters: ['InputSetter', 'NumberSetter']
     },
+    {
+      name: 'modelModifiers',
+      title: 'v-model 修饰符',
+      setters: 'ObjectSetter'
+    },
     {
       name: 'maxlength',
+      title: '同原生 maxlength 属性',
       defaultValue: '',
       setters: ['InputSetter', 'NumberSetter']
     },
     {
       name: 'minlength',
+      title: '原生属性，最小输入长度',
       defaultValue: '',
       setters: ['InputSetter', 'NumberSetter']
     },
@@ -36,23 +45,39 @@ const Input: MaterialDescription = {
       label: '字数统计',
       setters: 'BooleanSetter'
     },
+    {
+      name: 'wordLimitPosition',
+      title: '字数统计的位置，仅当 show-word-limit 为 true 时生效',
+      defaultValue: 'inside',
+      setters: 'SelectSetter',
+      options: ['inside', 'outside']
+    },
     {
       name: 'placeholder',
+      title: '输入框占位文本',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'clearable',
+      title: '是否显示清除按钮，只有当 type 不是 textarea时生效',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
+    {
+      name: 'clearIcon',
+      title: '自定义清除图标',
+      setters: 'StringSetter'
+    },
     {
       name: 'formatter',
+      title: '指定输入值的格式。(只有当 type 是"text"时才能工作)',
       defaultValue: '',
       setters: 'FunctionSetter'
     },
     {
       name: 'parser',
+      title: '指定从格式化器输入中提取的值。(仅当 type 是"text"时才起作用)',
       defaultValue: '',
       setters: 'FunctionSetter'
     },
@@ -65,83 +90,97 @@ const Input: MaterialDescription = {
     },
     {
       name: 'disabled',
+      title: '是否禁用',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     size('size'),
     {
       name: 'prefix-icon',
-      defaultValue: '',
+      title: '自定义前缀图标',
       setters: 'InputSetter'
     },
     {
       name: 'suffix-icon',
-      defaultValue: '',
+      title: '自定义后缀图标',
       setters: 'InputSetter'
     },
     {
       name: 'rows',
+      title: '输入框行数，仅 type 为 \'textarea\' 时有效',
       defaultValue: 2,
       setters: 'NumberSetter'
     },
     {
       name: 'autosize',
+      title: 'textarea 高度是否自适应，仅 type 为 \'textarea\' 时生效。 可以接受一个对象，比如: { minRows: 2, maxRows: 6 }',
       defaultValue: false,
       setters: ['BooleanSetter', 'JSONStter']
     },
     {
       name: 'autocomplete',
+      title: '原生 autocomplete 属性',
       defaultValue: 'off',
       setters: 'InputSetter'
     },
     {
       name: 'name',
+      title: '等价于原生 input name 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'readonly',
+      title: '原生 readonly 属性，是否只读',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'max',
+      title: '原生 max 属性，设置最大值',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'min',
+      title: '原生属性，设置最小值',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'step',
+      title: '原生属性，设置输入字段的合法数字间隔',
       defaultValue: '',
       setters: ['InputSetter', 'NumberSetter']
     },
     {
       name: 'resize',
+      title: '控制是否能被用户缩放',
       defaultValue: '',
       options: ['none', 'both', 'horizontal', 'vertical'],
-      setters: 'InputSetter'
+      setters: 'SelectSetter'
     },
     {
       name: 'autofocus',
+      title: '原生属性，自动获取焦点',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'form',
+      title: '原生属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'aria-label',
+      title: '等价于原生 input aria-label 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'tabindex',
+      title: '输入框的 tabindex',
       defaultValue: '',
       setters: 'InputSetter'
     },
@@ -156,7 +195,17 @@ const Input: MaterialDescription = {
       name: 'inputStyle',
       defaultValue: {},
       setters: ['JSONSetter']
-    }
+    },
+    {
+      name: 'label',
+      title: '等价于原生 input aria-label 属性',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'inputmode',
+      title: '等价于原生 input inputmode 属性',
+      setters: 'InputSetter'
+    },
   ],
   events: [
     {

package/src/element/inputNumber.ts

@@ -1,4 +1,5 @@
 import type { MaterialDescription } from '@vtj/core';
+import { size } from '../shared';
 const InputNumber: MaterialDescription = {
   name: 'ElInputNumber',
   label: '数字输入框',
@@ -9,52 +10,56 @@ const InputNumber: MaterialDescription = {
   props: [
     {
       name: 'modelValue',
+      title: '绑定值',
       defaultValue: '',
       setters: 'NumberSetter'
     },
     {
       name: 'min',
+      title: '设置计数器允许的最小值',
       defaultValue: -Infinity,
       setters: 'NumberSetter'
     },
     {
       name: 'max',
+      title: '设置计数器允许的最大值',
       defaultValue: Infinity,
       setters: 'NumberSetter'
     },
     {
       name: 'step',
+      title: '计数器步长',
       defaultValue: 1,
       setters: 'NumberSetter'
     },
     {
       name: 'stepStrictly',
+      title: '是否只能输入 step 的倍数',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'precision',
+      title: '数值精度',
       defaultValue: '',
       setters: 'NumberSetter'
     },
-    {
-      name: 'size',
-      defaultValue: 'default',
-      options: ['large', 'default', 'small'],
-      setters: 'SelectSetter'
-    },
+    size('size'),
     {
       name: 'readonly',
+      title: '原生 readonly 属性，是否只读',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'disabled',
+      title: '是否禁用状态',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'controls',
+      title: '是否使用控制按钮',
       defaultValue: true,
       setters: 'BooleanSetter'
     },
@@ -68,30 +73,58 @@ const InputNumber: MaterialDescription = {
     },
     {
       name: 'name',
+      title: '等价于原生 input name 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'ariaLabel',
+      title: '等价于原生 input aria-label 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'placeholder',
+      title: '等价于原生 input placeholder 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
     {
       name: 'valueOnClear',
+      title: '当输入框被清空时显示的值',
       defaultValue: '',
       options: ['min', 'max'],
-      setters: ['InputSetter', 'NumberSetter']
+      setters: ['SelectSetter', 'NumberSetter']
     },
     {
       name: 'validateEvent',
+      title: '是否触发表单验证',
       defaultValue: true,
       setters: 'BooleanSetter'
-    }
+    },
+    {
+      name: 'label',
+      title: '等价于原生 input aria-label 属性',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'inputmode',
+      title: '等价于原生 input inputmode 属性',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'align',
+      title: '内部输入文本对齐',
+      defaultValue: 'center',
+      setters: 'SelectSetter',
+      options: ['left', 'center', 'right'],
+    },
+    {
+      name: 'disabledScientific',
+      title: '禁用科学计数法的输入（例如输入 \'e\'）',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
   ],
   slots: [
     { name: 'decrease-icon' },

package/src/element/inputTag.ts

@@ -1,4 +1,5 @@
 import type { MaterialDescription } from '@vtj/core';
+import { effect, size } from '../shared';
 
 const InputTag: MaterialDescription = {
   name: 'ElInputTag',
@@ -8,6 +9,7 @@ const InputTag: MaterialDescription = {
   props: [
     {
       name: 'modelValue',
+      title: '绑定值',
       setters: 'ArraySetter'
     },
     {
@@ -29,6 +31,7 @@ const InputTag: MaterialDescription = {
       setters: 'SelectSetter',
       options: ['light', 'dark', 'plain']
     },
+    effect('effect'),
     {
       name: 'trigger',
       title: '触发输入标签的按键',
@@ -43,10 +46,28 @@ const InputTag: MaterialDescription = {
       setters: 'BooleanSetter'
     },
     {
-      name: 'size',
-      setters: 'SelectSetter',
-      defaultValue: 'default',
-      options: ['large', 'default', 'small']
+      name: 'delimiter',
+      title: '在匹配分隔符时添加标签',
+      setters: 'InputSetter'
+    },
+    size('size'),
+    {
+      name: 'collapseTags',
+      title: '多选时是否将选中值按文字的形式展示',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'collapseTagsTooltip',
+      title: '当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此功能，collapse-tags的值必须为true',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'saveOnBlur',
+      title: '当输入失去焦点时是否保存输入值',
+      defaultValue: true,
+      setters: 'BooleanSetter'
     },
     {
       name: 'clearable',
@@ -54,6 +75,11 @@ const InputTag: MaterialDescription = {
       defaultValue: false,
       setters: 'BooleanSetter'
     },
+    {
+      name: 'clearIcon',
+      title: '自定义清除图标',
+      setters: 'InputSetter'
+    },
     {
       name: 'disabled',
       title: '是否禁用',
@@ -68,41 +94,55 @@ const InputTag: MaterialDescription = {
     },
     {
       name: 'readonly',
+      title: '等价于原生 readonly 属性',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'autofocus',
+      title: '等价于原生  autofocus  属性',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'id',
+      title: '等价于原生 input id 属性',
       setters: 'StringSetter'
     },
     {
       name: 'tabindex',
+      title: '等价于原生  tabindex  属性',
       setters: ['StringSetter', 'NumberSetter']
     },
+    {
+      name: 'maxCollapseTags',
+      title: '需要显示的 Tag 的最大数量 要使用此功能，collapse-tags的值必须为true',
+      setters: 'NumberSetter'
+    },
     {
       name: 'maxlength',
+      title: '等价于原生  maxlength  属性',
       setters: ['StringSetter', 'NumberSetter']
     },
     {
       name: 'minlength',
+      title: '等价于原生  minlength  属性',
       setters: ['StringSetter', 'NumberSetter']
     },
     {
       name: 'placeholder',
+      title: '输入框占位文本',
       setters: 'StringSetter'
     },
     {
       name: 'autocomplete',
+      title: '等价于原生  autocomplete  属性',
       defaultValue: 'off',
       setters: 'StringSetter'
     },
     {
       name: 'ariaLabel',
+      title: '等价于原生  aria-label  属性',
       setters: 'StringSetter'
     }
   ],
@@ -119,6 +159,9 @@ const InputTag: MaterialDescription = {
     {
       name: 'remove-tag'
     },
+    {
+      name: 'drag-tag'
+    },
     {
       name: 'focus'
     },

package/src/element/layout.ts

@@ -59,46 +59,55 @@ const components: MaterialDescription[] = [
     props: [
       {
         name: 'span',
+        title: '栅格占据的列数',
         defaultValue: 24,
         setters: 'NumberSetter'
       },
       {
         name: 'offset',
+        title: '栅格左侧的间隔格数',
         defaultValue: 0,
         setters: 'NumberSetter'
       },
       {
         name: 'push',
+        title: '栅格向右移动格数',
         defaultValue: 0,
         setters: 'NumberSetter'
       },
       {
         name: 'pull',
+        title: '栅格向左移动格数',
         defaultValue: 0,
         setters: 'NumberSetter'
       },
       {
         name: 'xs',
+        title: '<768px 响应式栅格数或者栅格属性对象',
         defaultValue: undefined,
         setters: ['JSONSetter', 'NumberSetter']
       },
       {
         name: 'sm',
+        title: '≥768px 响应式栅格数或者栅格属性对象',
         defaultValue: undefined,
         setters: ['JSONSetter', 'NumberSetter']
       },
       {
         name: 'md',
+        title: '≥992px 响应式栅格数或者栅格属性对象',
         defaultValue: undefined,
         setters: ['JSONSetter', 'NumberSetter']
       },
       {
         name: 'lg',
+        title: '≥1200px 响应式栅格数或者栅格属性对象',
         defaultValue: undefined,
         setters: ['JSONSetter', 'NumberSetter']
       },
       {
         name: 'xl',
+        title: '≥1920px 响应式栅格数或者栅格属性对象',
         defaultValue: undefined,
         setters: ['JSONSetter', 'NumberSetter']
       },

package/src/element/link.ts

@@ -10,16 +10,20 @@ const link: MaterialDescription = {
     type('type'),
     {
       name: 'underline',
+      title: '控制下划线是否出现',
       defaultValue: true,
-      setters: 'BooleanSetter'
+      options: ['always', 'hover', 'never'],
+      setters: ['BooleanSetter', 'SelectSetter'],
     },
     {
       name: 'disabled',
+      title: '是否禁用状态',
       defaultValue: false,
       setters: 'BooleanSetter'
     },
     {
       name: 'href',
+      title: '原生 href 属性',
       defaultValue: '',
       setters: 'InputSetter'
     },
@@ -33,6 +37,7 @@ const link: MaterialDescription = {
     },
     {
       name: 'icon',
+      title: '图标组件',
       defaultValue: '',
       setters: 'IconSetter'
     }

package/src/element/mention.ts

@@ -13,6 +13,12 @@ const Mention: MaterialDescription = {
       defaultValue: [],
       setters: 'ArraySetter'
     },
+    {
+      name: 'props',
+      title: 'options 的配置',
+      defaultValue: {value: 'value', label: 'label', disabled: 'disabled'},
+      setters: 'ObjectSetter'
+    },
     {
       name: 'prefix',
       title: '触发字段的前缀。 字符串长度必须且只能为 1',
@@ -76,6 +82,11 @@ const Mention: MaterialDescription = {
       title: '自定义浮层类名',
       setters: 'StringSetter'
     },
+    {
+      name: 'popperStyle',
+      title: '自定义浮层样式',
+      setters: ['StringSetter', 'ObjectSetter']
+    },
     {
       name: 'popperOptions',
       title: '参数',