@vtj/materials 0.8.44 → 0.8.46

package/src/element/text.ts

@@ -0,0 +1,54 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const text: MaterialDescription = {
+  name: 'ElText',
+  label: '文本',
+  categoryId: 'base',
+  doc: 'https://element-plus.org/zh-CN/component/text.html',
+  props: [
+    {
+      name: 'type',
+      label: 'type',
+      title: '类型',
+      setters: 'SelectSetter',
+      options: ['primary', 'success', 'warning', 'danger', 'info']
+    },
+    {
+      name: 'size',
+      label: 'size',
+      title: '大小',
+      setters: 'SelectSetter',
+      options: ['large', 'default', 'small'],
+      defaultValue: 'default'
+    },
+    {
+      name: 'truncated',
+      label: 'truncated',
+      title: '显示省略号',
+      setters: 'BooleanSetter',
+      defaultValue: false
+    },
+    {
+      name: 'lineClamp',
+      label: 'lineClamp',
+      title: '最大行数',
+      setters: ['StringSetter', 'NumberSetter']
+    },
+    {
+      name: 'tag',
+      label: 'tag',
+      title: '自定义元素标签',
+      setters: 'StringSetter',
+      defaultValue: 'span'
+    }
+  ],
+  slots: ['default'],
+  snippet: {
+    props: {
+      type: 'primary'
+    },
+    children: '这是一段Primary颜色的文本'
+  }
+};
+
+export default text;

package/src/element/timePicker.ts

@@ -0,0 +1,139 @@
+import type { MaterialDescription } from '@vtj/core';
+const TimePicker: MaterialDescription = {
+  name: 'ElTimePicker',
+  label: '时间选择器',
+
+  childIncludes: false,
+  doc: 'https://element-plus.org/zh-CN/component/time-picker.html',
+  categoryId: 'form',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'modelValue',
+      defaultValue: '',
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'readonly',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'disabled',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'editable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'clearable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'size',
+      defaultValue: 'default',
+      options: ['large', 'default', 'small'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'placeholder',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'startPlaceholder',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'endPlaceholder',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'isRange',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'arrowControl',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'popperClass',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'rangeSeparator',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'format',
+      defaultValue: 'HH:mm:ss',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'defaultValue',
+      defaultValue: '',
+      setters: ['InputSetter', 'ExpressionSetter']
+    },
+    {
+      name: 'id',
+      defaultValue: '',
+      setters: ['InputSetter']
+    },
+    {
+      name: 'name',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    { name: 'label', defaultValue: '', setters: 'InputSetter' },
+    {
+      name: 'prefixIcon',
+      defaultValue: 'Clock',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'clearIcon',
+      defaultValue: 'CircleClose',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'disabledHours',
+      defaultValue: '',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'disabledMinutes',
+      defaultValue: '',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'disabledSeconds',
+      defaultValue: '',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'teleported',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'tabindex',
+      label: 'tabindex',
+      title: '输入框的 tabindex',
+      setters: ['StringSetter', 'NumberSetter'],
+      defaultValue: 0
+    }
+  ],
+  events: ['change', 'blur', 'focus', 'visible-change', 'update:modelValue']
+};
+
+export default TimePicker;

package/src/element/timeSelect.ts

@@ -0,0 +1,103 @@
+import type { MaterialDescription } from '@vtj/core';
+const TimeSelect: MaterialDescription = {
+  name: 'ElTimeSelect',
+  label: '时间选择',
+
+  childIncludes: false,
+  doc: 'https://element-plus.org/zh-CN/component/time-select.html',
+  categoryId: 'form',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'modelValue',
+      defaultValue: '',
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'disabled',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'editable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'clearable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'size',
+      defaultValue: 'default',
+      options: ['large', 'default', 'small'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'placeholder',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'name',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'effect',
+      defaultValue: 'light',
+      options: ['dark', 'light'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'effect',
+      defaultValue: 'light',
+      options: ['dark', 'light'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'format',
+      defaultValue: 'HH:mm',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'prefixIcon',
+      defaultValue: 'Clock',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'clearIcon',
+      defaultValue: 'CircleClose',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'start',
+      defaultValue: '09:00',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'end',
+      defaultValue: '18:00',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'step',
+      defaultValue: '00:30',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'minTime',
+      defaultValue: '00:00',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'maxTime',
+      defaultValue: '',
+      setters: 'InputSetter'
+    }
+  ],
+  events: ['change', 'blur', 'focus', 'update:modelValue']
+};
+
+export default TimeSelect;

package/src/element/timeline.ts

@@ -0,0 +1,106 @@
+import type { MaterialDescription } from '@vtj/core';
+const Timeline: MaterialDescription[] = [
+  {
+    name: 'ElTimeline',
+    label: '时间线',
+
+    doc: 'https://element-plus.org/zh-CN/component/timeline.html',
+    categoryId: 'form',
+    package: 'element-plus',
+    slots: ['default'],
+    snippet: {
+      name: 'ElTimeline',
+      children: [
+        {
+          name: 'ElTimelineItem',
+          children: 'Event start',
+          props: {
+            timestamp: '2018-04-15',
+            size: 'large',
+            type: 'primary',
+            icon: 'MoreFilled'
+          }
+        },
+        {
+          name: 'ElTimelineItem',
+          children: 'Approved',
+          props: {
+            timestamp: '2018-04-13',
+            color: '#0bbd87'
+          }
+        },
+        {
+          name: 'ElTimelineItem',
+          children: 'Success',
+          props: {
+            timestamp: '2018-04-11',
+            hollow: true,
+            icon: 'el-icon-more'
+          }
+        }
+      ]
+    }
+  },
+  {
+    name: 'ElTimelineItem',
+    label: '时间线子项',
+
+    // childIncludes: false,
+    categoryId: 'form',
+    package: 'element-plus',
+    props: [
+      {
+        name: 'timestamp',
+        defaultValue: '',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'hide-timestamp',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'center',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'placement',
+        defaultValue: 'bottom',
+        options: ['top', 'bottom'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'type',
+        defaultValue: '',
+        options: ['primary', 'success', 'warning', 'danger', 'info'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'color',
+        defaultValue: '',
+        options: ['hsl', 'hsv', 'hex', 'rgb'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'size',
+        defaultValue: 'normal',
+        options: ['normal', 'large'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'icon',
+        defaultValue: '',
+        setters: 'IconSetter'
+      },
+      {
+        name: 'hollow',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      }
+    ],
+    slots: ['default', 'dot']
+  }
+];
+
+export default Timeline;

package/src/element/tooltip.ts

@@ -0,0 +1,179 @@
+import type { MaterialDescription } from '@vtj/core';
+const components: MaterialDescription = {
+  name: 'ElTooltip',
+  childIncludes: true,
+  label: '文字提示',
+
+  doc: 'https://element-plus.org/zh-CN/component/tooltip.html',
+  categoryId: 'other',
+  // icon: 'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_button.png',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'appendTo',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'effect',
+      defaultValue: 'dark',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'content',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'rawContent',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'placement',
+      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'
+      ]
+    },
+    {
+      name: 'fallback-placements',
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'visible',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'disabled',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'offset',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'transition',
+      defaultValue: 'el-fade-in-linear',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'popperOptions',
+      defaultValue: { boundariesElement: 'body', gpuAcceleration: false },
+      setters: 'JSONSetter'
+    },
+    {
+      name: 'showAfter',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'show-arrow',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'hide-after',
+      defaultValue: 200,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'auto-close',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'popper-class',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'enterable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'teleported',
+      label: 'teleported',
+      title: '是否使用 teleport。设置成 true则会被追加到 append-to 的位置',
+      setters: 'BooleanSetter',
+      defaultValue: true
+    },
+    {
+      name: 'trigger',
+      label: 'trigger',
+      title: '如何触发 Tooltip',
+      setters: 'SelectSetter',
+      options: ['hover', 'click', 'focus', 'contextmenu'],
+      defaultValue: 'hover'
+    },
+    {
+      name: 'virtual-triggering',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'virtual-ref',
+      defaultValue: '',
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'trigger-keys',
+      defaultValue: ['Enter', 'Space'],
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'persistent',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'ariaLabel',
+      label: 'ariaLabel',
+      title: '和 aria-label 属性保持一致',
+      setters: 'StringSetter'
+    }
+  ],
+  events: [
+    {
+      name: 'confirm'
+    },
+    {
+      name: 'cancel'
+    },
+    {
+      name: 'update:visible '
+    }
+  ],
+  slots: [
+    {
+      name: 'default'
+    },
+    {
+      name: 'content'
+    }
+  ],
+  snippet: {
+    name: 'ElTooltip',
+    children: '文字提示',
+    props: {
+      content: '自定义弹出框的内容'
+    }
+  }
+};
+
+export default components;