@vtj/materials 0.8.44 → 0.8.46

package/src/element/dropdown.ts

@@ -0,0 +1,205 @@
+import type { MaterialDescription } from '@vtj/core';
+const Dropdown: MaterialDescription[] = [
+  {
+    name: 'ElDropdown',
+    label: '下拉菜单',
+
+    categoryId: 'nav',
+    doc: 'https://element-plus.org/zh-CN/component/dropdown.html',
+    package: 'element-plus',
+    props: [
+      {
+        name: 'type',
+        defaultValue: '',
+        options: ['primary', 'warning', 'success', 'danger', 'info'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'size',
+        defaultValue: 'default',
+        setters: 'SelectSetter',
+        options: ['large', 'default', 'small']
+      },
+      {
+        name: 'maxHeight',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
+      {
+        name: 'splitButton',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'disabled',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'placement',
+        defaultValue: 'bottom',
+        setters: 'SelectSetter',
+        options: [
+          'top',
+          'top-start',
+          'top-end',
+          'bottom',
+          'bottom-start',
+          'bottom-end'
+        ]
+      },
+      {
+        name: 'trigger',
+        defaultValue: 'hover',
+        setters: 'SelectSetter',
+        options: ['hover', 'click', 'contextmenu']
+      },
+      {
+        name: 'hideOnClick',
+        defaultValue: true,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'showTimeout',
+        defaultValue: 250,
+        setters: 'NumberSetter'
+      },
+      {
+        name: 'hideTimeout',
+        defaultValue: 150,
+        setters: 'NumberSetter'
+      },
+      {
+        name: 'role',
+        defaultValue: 'menu',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'tabindex',
+        defaultValue: 0,
+        setters: 'NumberSetter'
+      },
+      {
+        name: 'popperClass',
+        defaultValue: '',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'popperOptions',
+        defaultValue: undefined,
+        setters: 'JSONSetter'
+      },
+      {
+        name: 'teleported',
+        label: 'teleported',
+        title: '是否将下拉列表插入至 body 元素',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      }
+    ],
+    slots: [
+      {
+        name: 'default'
+      },
+      {
+        name: 'dropdown'
+      }
+    ],
+    events: [
+      {
+        name: 'click'
+      },
+      {
+        name: 'command'
+      },
+      {
+        name: 'visible-change'
+      }
+    ],
+    snippet: {
+      name: 'ElDropdown',
+      children: [
+        {
+          name: 'ElButton',
+          children: [
+            {
+              name: 'component',
+              props: {
+                is: 'span'
+              },
+              children: '下拉菜单'
+            },
+            {
+              name: 'component',
+              props: {
+                is: 'span'
+              },
+              children: ' V'
+            }
+          ]
+        },
+        {
+          name: 'ElDropdownMenu',
+          slot: 'dropdown',
+          children: [
+            {
+              name: 'ElDropdownItem',
+              children: 'Action 1'
+            },
+            {
+              name: 'ElDropdownItem',
+              children: 'Action 2'
+            },
+            {
+              name: 'ElDropdownItem',
+              children: 'Action 3'
+            }
+          ]
+        }
+      ]
+    }
+  },
+  {
+    name: 'ElDropdownMenu',
+    label: '下拉菜单Menu',
+
+    categoryId: 'nav',
+    package: 'element-plus'
+  },
+  {
+    name: 'ElDropdownItem',
+    childIncludes: true,
+    label: '下拉菜单项',
+
+    categoryId: 'nav',
+    package: 'element-plus',
+    props: [
+      {
+        name: 'command',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter', 'JSONSetter']
+      },
+      {
+        name: 'disabled',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'divided',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'icon',
+        defaultValue: '',
+        setters: ['InputSetter']
+      }
+    ],
+    slots: ['default'],
+    snippet: {
+      name: 'ElDropdownItem',
+      children: '下拉选项'
+    }
+  }
+];
+export default Dropdown;

package/src/element/empty.ts

@@ -0,0 +1,39 @@
+import type { MaterialDescription } from '@vtj/core';
+const Empty: MaterialDescription = {
+  name: 'ElEmpty',
+  label: '空状态',
+  doc: 'https://element-plus.org/zh-CN/component/empty.html',
+
+  categoryId: 'data',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'image',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'imageSize',
+      defaultValue: '',
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'description',
+      defaultValue: '',
+      setters: 'InputSetter'
+    }
+  ],
+  slots: [
+    {
+      name: 'default'
+    },
+    {
+      name: 'image'
+    },
+    {
+      name: 'description'
+    }
+  ]
+};
+
+export default Empty;

package/src/element/form.ts

@@ -0,0 +1,212 @@
+import type { MaterialDescription } from '@vtj/core';
+const form: MaterialDescription[] = [
+  {
+    name: 'ElForm',
+    label: '表单',
+
+    categoryId: 'form',
+    doc: 'https://element-plus.org/zh-CN/component/form.html',
+    package: 'element-plus',
+    props: [
+      {
+        name: 'model',
+        defaultValue: '',
+        setters: 'ExpressionSetter'
+      },
+      {
+        name: 'rules',
+        defaultValue: '',
+        setters: 'ExpressionSetter'
+      },
+      {
+        name: 'inline',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'labelPosition',
+        defaultValue: 'right',
+        options: ['left', 'right', 'top'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'labelWidth',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
+      {
+        name: 'labelSuffix',
+        defaultValue: '',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'hideRequiredAsterisk',
+        defaultValue: false,
+        title: '是否显示必填字段的标签旁边的红色星号',
+        label: '隐藏必填星号',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'requireAsteriskPosition',
+        defaultValue: 'left',
+        title: '星号的位置',
+        label: '星号位置',
+        options: ['left', 'right'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'showMessage',
+        defaultValue: true,
+        title: '是否显示校验错误信息',
+        label: '显示错误',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'inlineMessage',
+        defaultValue: false,
+        title: '是否以行内形式展示校验信息',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'statusIcon',
+        defaultValue: false,
+        title: '是否在输入框中显示校验结果反馈图标',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'validateOnRuleChange',
+        defaultValue: true,
+        title: '是否在 rules 属性改变后立即触发一次验证',
+        label: 'validate',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'size',
+        defaultValue: '',
+        options: ['large', 'default', 'small'],
+        setters: 'SelectSetter'
+      },
+      {
+        name: 'disabled',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'scrollToError',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      }
+    ],
+    events: [
+      {
+        name: 'validate'
+      }
+    ],
+    snippet: {
+      name: 'ElForm',
+      props: {
+        labelWidth: '80px'
+      },
+      children: [
+        {
+          name: 'ElFormItem',
+          props: {
+            label: '表单项'
+          },
+          children: [
+            {
+              name: 'ElInput'
+            }
+          ]
+        },
+        {
+          name: 'ElFormItem',
+          props: {
+            label: ' '
+          },
+          children: [
+            {
+              name: 'ElButton',
+              props: {
+                type: 'primary'
+              },
+              children: '确定'
+            }
+          ]
+        }
+      ]
+    }
+  },
+  {
+    name: 'ElFormItem',
+    label: '表单项',
+
+    categoryId: 'form',
+    package: 'element-plus',
+    props: [
+      {
+        name: 'prop',
+        defaultValue: '',
+        setters: ['InputSetter']
+      },
+      {
+        name: 'label',
+        defaultValue: '',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'labelWidth',
+        defaultValue: '',
+        setters: ['InputSetter', 'NumberSetter']
+      },
+      {
+        name: 'required',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'rules',
+        defaultValue: '',
+        setters: 'JSONSetter'
+      },
+      {
+        name: 'error',
+        defaultValue: '',
+        setters: 'InputSetter'
+      },
+      {
+        name: 'showMessage',
+        defaultValue: true,
+        title: '是否显示校验错误信息',
+        label: '错误信息',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'inlineMessage',
+        defaultValue: false,
+        title: '是否在行内显示校验信息',
+        label: '校验信息',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'size',
+        defaultValue: 'default',
+        options: ['large', 'default', 'small'],
+        setters: 'SelectSetter'
+      }
+    ],
+    slots: ['default', 'label', 'error'],
+    snippet: {
+      props: {
+        label: '表单项'
+      },
+      children: [
+        {
+          name: 'ElInput'
+        }
+      ]
+    }
+  }
+];
+
+export default form;

package/src/element/image.ts

@@ -0,0 +1,149 @@
+import type { MaterialDescription } from '@vtj/core';
+const Image: MaterialDescription = {
+  name: 'ElImage',
+  label: '图片',
+
+  categoryId: 'data',
+  doc: 'https://element-plus.org/zh-CN/component/image.html',
+  childIncludes: false,
+  package: 'element-plus',
+  props: [
+    {
+      name: 'src',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'fit',
+      defaultValue: '',
+      options: ['fill', 'contain', 'cover', 'none', 'scale-down'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'hideOnClickModal',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'loading',
+      defaultValue: '',
+      options: ['eager', 'lazy'],
+      setters: 'SelectSetter'
+    },
+    {
+      name: 'lazy',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'scrollContainer',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'alt',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'referrerPolicy',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'crossorigin',
+      label: 'crossorigin',
+      title: '原生属性 crossorigin',
+      setters: 'SelectSetter',
+      options: ['', 'anonymous', 'use-credentials']
+    },
+    {
+      name: 'previewSrcList',
+      defaultValue: '',
+      setters: 'JSONSetter'
+    },
+    {
+      name: 'zIndex',
+      defaultValue: '',
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'initialIndex',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'close-on-press-escape',
+      label: 'close-on-press-escape',
+      defaultValue: true,
+      title: '是否可以通过按下 ESC 关闭 Image Viewer',
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'previewTeleported',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'infinite',
+      defaultValue: true,
+      setters: 'BooleanSetter',
+      title: '是否可以无限循环预览'
+    },
+    {
+      name: 'zoomRate',
+      defaultValue: 1.2,
+      setters: {
+        name: 'NumberSetter',
+        props: {
+          precision: 1
+        }
+      },
+      title: '图像查看器缩放事件的缩放速率'
+    },
+    {
+      name: 'minScale',
+      defaultValue: 0.2,
+      setters: {
+        name: 'NumberSetter',
+        props: {
+          precision: 1
+        }
+      },
+      title: '图像查看器缩放事件的最小缩放比例'
+    },
+    {
+      name: 'maxScale',
+      defaultValue: 7,
+      setters: {
+        name: 'NumberSetter',
+        props: {
+          precision: 1
+        }
+      },
+      title: '图像查看器缩放事件的最大缩放比例'
+    }
+  ],
+  events: ['load', 'error', 'switch', 'close', 'show'],
+  slots: ['placeholder', 'error', 'viewer'],
+  snippet: {
+    props: {
+      style: {
+        width: '100px',
+        height: '100px'
+      },
+      src: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+      previewSrcList: [
+        'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+        'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
+        'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
+        'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
+        'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg',
+        'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',
+        'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg'
+      ]
+    }
+  }
+};
+
+export default Image;