@vtj/materials 0.8.43 → 0.8.45

package/src/element/selectV2.ts

@@ -0,0 +1,299 @@
+import type { MaterialDescription } from '@vtj/core';
+const SelectV2: MaterialDescription = {
+  name: 'ElSelectV2',
+  label: '虚拟列表选择器',
+
+  doc: 'https://element-plus.org/zh-CN/component/select-v2.html',
+  categoryId: 'data',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'modelValue',
+      defaultValue: '',
+      setters: ['InputSetter', 'NumberSetter', 'JSONSetter']
+    },
+    {
+      name: 'options',
+      label: 'options',
+      title: '选项的数据源， value 的 key 和 label 可以通过 props自定义.',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'props',
+      label: 'props',
+      title: '配置选项，具体看下表',
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'multiple',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'disabled',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'valueKey',
+      defaultValue: 'value',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'size',
+      defaultValue: 'default',
+      options: ['large', 'default', 'small'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'clearable',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'clearIcon',
+      label: 'clearIcon',
+      title: '自定义清除图标',
+      setters: ['StringSetter', 'ObjectSetter'],
+      defaultValue: 'CircleClose'
+    },
+    {
+      name: 'collapseTags',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'multipleLimit',
+      label: 'multipleLimit',
+      title: '多选时可被选择的最大数目。 当被设置为0时，可被选择的数目不设限。',
+      setters: 'NumberSetter',
+      defaultValue: 0
+    },
+    {
+      name: 'name',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'effect',
+      defaultValue: 'light',
+      options: ['dark', 'light'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'autocomplete',
+      defaultValue: 'off',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'placeholder',
+      defaultValue: 'Select',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'filterable',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'allowCreate',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'filterMethod',
+      label: 'filterMethod',
+      title: '自定义筛选方法',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'loading',
+      label: 'loading',
+      title: '是否从远程加载数据',
+      setters: 'BooleanSetter',
+      defaultValue: false
+    },
+    {
+      name: 'loadingText',
+      label: 'loadingText',
+      title: '从服务器加载数据时显示的文本，默认为“Loading”',
+      setters: 'StringSetter',
+      defaultValue: 'Loading'
+    },
+    {
+      name: 'reserveKeyword',
+      label: 'reserveKeyword',
+      title: '筛选时，是否在选择选项后保留关键字',
+      setters: 'BooleanSetter',
+      defaultValue: true
+    },
+    {
+      name: 'noMatchText',
+      label: 'noMatchText',
+      title:
+        '搜索条件无匹配时显示的文字，也可以使用 empty 插槽设置，默认是 “No matching data“',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'noDataText',
+      label: 'noDataText',
+      title: '当在没有数据时显示的文字，你同时可以使用empty插槽进行设置。',
+      setters: 'StringSetter',
+      defaultValue: 'No Data'
+    },
+    {
+      name: 'popperClass',
+      label: 'popperClass',
+      title: '选择器下拉菜单的自定义类名',
+      setters: 'StringSetter',
+      defaultValue: ''
+    },
+    {
+      name: 'popperAppendToBody ',
+      label: 'popperAppendToBody ',
+      title:
+        '是否将弹出框插入至 body 元素 当弹出框的位置出现问题时，你可以尝试将该属性设置为false。',
+      setters: 'BooleanSetter',
+      defaultValue: false
+    }, //?? deprecated
+    {
+      name: 'teleported',
+      label: 'teleported',
+      title: '是否将下拉列表元素插入 append-to 指向的元素下',
+      setters: 'BooleanSetter',
+      defaultValue: true
+    },
+    {
+      name: 'persistent',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'popperOptions',
+      label: 'popperOptions',
+      setters: 'ObjectSetter',
+      defaultValue: {}
+    },
+    {
+      name: 'automaticDropdown',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'height',
+      defaultValue: 274,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'itemHeight',
+      label: 'itemHeight',
+      title: '下拉项的高度',
+      setters: 'NumberSetter',
+      defaultValue: 34
+    },
+    {
+      name: 'scrollbarAlwaysOn',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'remote',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'remoteMethod',
+      defaultValue: '',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'validateEvent',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'placement',
+      label: 'placement',
+      title: '下拉框出现的位置',
+      setters: 'SelectSetter',
+      options: [
+        'top',
+        'top-start',
+        'top-end',
+        'bottom',
+        'bottom-start',
+        'bottom-end',
+        'left',
+        'left-start',
+        'left-end',
+        'right',
+        'right-start',
+        'right-end'
+      ],
+      defaultValue: 'bottom-start'
+    },
+    {
+      name: 'fallbackPlacements',
+      setters: 'ArraySetter',
+      defaultValue: ['bottom-start', 'top-start', 'right', 'left']
+    },
+    {
+      name: 'collapseTagsTooltip',
+      setters: 'BooleanSetter',
+      defaultValue: false
+    },
+    {
+      name: 'maxCollapseTags',
+      setters: 'NumberSetter',
+      defaultValue: 1
+    },
+    {
+      name: 'tagType',
+      label: 'tagType',
+      title: '标签类型',
+      setters: 'SelectSetter',
+      options: ['', 'success', 'info', 'warning', 'danger'],
+      defaultValue: 'info'
+    },
+    {
+      name: 'ariaLabel',
+      label: 'ariaLabel',
+      title: '等价于原生 input aria-label 属性',
+      setters: 'StringSetter'
+    }
+  ],
+  events: [
+    'change',
+    'visible-change',
+    'remove-tag',
+    'clear',
+    'blur',
+    'focus',
+    'update:modelValue'
+  ],
+  slots: [
+    {
+      name: 'default'
+    },
+    {
+      name: 'header'
+    },
+    {
+      name: 'footer'
+    },
+    {
+      name: 'prefix'
+    },
+    {
+      name: 'empty'
+    },
+    {
+      name: 'tag'
+    },
+    {
+      name: 'loading'
+    }
+  ]
+};
+
+export default SelectV2;

package/src/element/skeleton.ts

@@ -0,0 +1,75 @@
+import type { MaterialDescription } from '@vtj/core';
+const Skeleton: MaterialDescription = {
+  name: 'ElSkeleton',
+  label: '骨架屏',
+  doc: 'https://element-plus.org/zh-CN/component/skeleton.html',
+
+  categoryId: 'data',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'animated',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'count',
+      defaultValue: 1,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'loading',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'rows',
+      defaultValue: 3,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'throttle',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    }
+  ],
+  slots: ['default', 'template']
+};
+
+const SkeletonItem: MaterialDescription = {
+  name: 'ElSkeletonItem',
+  label: '骨架项',
+  doc: 'https://element-plus.org/zh-CN/component/skeleton.html',
+
+  categoryId: 'data',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'variant',
+      setters: 'SelectSetter',
+      options: [
+        'p',
+        'text',
+        'h1',
+        'h3',
+        'caption',
+        'button',
+        'image',
+        'circle',
+        'rect'
+      ],
+      defaultValue: 'text'
+    }
+  ],
+  snippet: {
+    props: {
+      variant: 'image',
+      style: {
+        width: '240px',
+        height: '240px'
+      }
+    }
+  }
+};
+
+export default [Skeleton, SkeletonItem];

package/src/element/slider.ts

@@ -0,0 +1,165 @@
+import type { MaterialDescription } from '@vtj/core';
+const Slider: MaterialDescription = {
+  name: 'ElSlider',
+  label: '滑块',
+
+  childIncludes: false,
+  doc: 'https://element-plus.org/zh-CN/component/slider.html',
+  categoryId: 'form',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'modelValue',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'min',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'max',
+      defaultValue: 100,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'disabled',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'step',
+      defaultValue: 1,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'showInput',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'showInputControls',
+      defaultValue: true,
+      label: '输入框按钮',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'size',
+      defaultValue: 'default',
+      title: '滑块的大小',
+      options: ['large', 'default', 'small'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'inputSize',
+      defaultValue: 'default',
+      options: ['large', 'default', 'small'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'showStops',
+      defaultValue: false,
+      title: '是否显示间断点',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'showTooltip',
+      defaultValue: true,
+      title: '是否显示提示信息',
+      label: '显示提示',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'formatTooltip',
+      defaultValue: '',
+      title: '格式化提示信息',
+      label: '格式化信息',
+      setters: 'JSONSetter'
+    },
+    {
+      name: 'range',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'vertical',
+      defaultValue: false,
+      title: '垂直模式',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'height',
+      defaultValue: '',
+      title: '滑块高度，垂直模式必填',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'label',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'rangeStartLabel',
+      defaultValue: '',
+      title: '当 range 为true时，屏幕阅读器标签开始的标记',
+      label: '开始的标记',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'rangeEndLabel',
+      defaultValue: '',
+      title: '当 range 为true时，屏幕阅读器标签结尾的标记',
+      label: '结尾的标记',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'formatValueText',
+      defaultValue: '',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'debounce',
+      defaultValue: 300,
+      title: '输入时的去抖延迟，毫秒，仅在 show-input 等于 true 时有效',
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'tooltipClass',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'placement',
+      defaultValue: 'top',
+      options: [
+        'top',
+        'top-start',
+        'top-end',
+        'bottom',
+        'bottom-start',
+        'bottom-end',
+        'left',
+        'left-start',
+        'left-end',
+        'right',
+        'right-start',
+        'right-end'
+      ],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'marks',
+      defaultValue: '',
+      setters: 'JSONSetter'
+    },
+    {
+      name: 'validateEvent',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    }
+  ],
+  events: ['change', 'input', 'update:modelValue']
+};
+
+export default Slider;

package/src/element/space.ts

@@ -0,0 +1,101 @@
+import type { MaterialDescription } from '@vtj/core';
+const Space: MaterialDescription = {
+  name: 'ElSpace',
+  label: '间距',
+
+  categoryId: 'base',
+  doc: 'https://element-plus.org/zh-CN/component/space.html',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'alignment',
+      defaultValue: 'center',
+      title: '对齐的方式',
+      options: [
+        'normal',
+        'stretch',
+        'center',
+        'start',
+        'end',
+        'flex-start',
+        'flex-end',
+        'baseline',
+        'first baseline',
+        'last baseline',
+        'safe center',
+        'unsafe center',
+        'inherit',
+        'initial',
+        'revert',
+        'revert-layer',
+        'unset'
+      ],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'class',
+      defaultValue: '',
+      setters: ['InputSetter']
+    },
+    {
+      name: 'direction',
+      defaultValue: 'horizontal',
+      options: ['vertical', 'horizontal'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'prefixCls',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'style',
+      defaultValue: '',
+      setters: ['InputSetter', 'JSONSetter']
+    },
+    {
+      name: 'spacer',
+      defaultValue: '',
+      setters: ['InputSetter', 'NumberSetter']
+    },
+    {
+      name: 'size',
+      defaultValue: 'small',
+      setters: ['InputSetter', 'NumberSetter', 'JSONSetter']
+    },
+    {
+      name: 'wrap',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'fill',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'fillRatio',
+      defaultValue: 100,
+      setters: 'NumberSetter'
+    }
+  ],
+  slots: ['default'],
+  snippet: {
+    props: {
+      fill: true,
+      style: {
+        width: '100%'
+      }
+    },
+    children: [
+      {
+        name: 'ElCard'
+      },
+      {
+        name: 'ElCard'
+      }
+    ]
+  }
+};
+
+export default Space;