@vtj/materials 0.8.146 → 0.8.148

package/src/vant/calendar.ts

@@ -0,0 +1,268 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const Calendar: MaterialDescription = {
+  name: 'VantCalendar',
+  alias: 'Calendar',
+  label: '日历',
+  categoryId: 'form',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/calendar',
+  props: [
+    {
+      name: 'type',
+      title: '选择类型',
+      defaultValue: 'single',
+      setters: 'SelectSetter',
+      options: ['single', 'multiple', 'range']
+    },
+    {
+      name: 'switch-mode',
+      title: '切换模式',
+      defaultValue: 'none',
+      setters: 'SelectSetter',
+      options: ['none', 'month', 'year-month']
+    },
+    {
+      name: 'title',
+      title: '日历标题',
+      defaultValue: '日期选择',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'color',
+      title: '主题色，对底部按钮和选中日期生效',
+      defaultValue: '#1989fa',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'min-date',
+      title: '可选择的最小日期',
+      defaultValue: '',
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'max-date',
+      title: '可选择的最大日期',
+      defaultValue: '',
+      setters: 'ExpressionSetter'
+    },
+    {
+      name: 'default-date',
+      title:
+        '默认选中的日期，type 为 multiple 或 range 时为数组，传入 null 表示默认不选择',
+      setters: ['ExpressionSetter', 'ArraySetter', 'StringSetter']
+    },
+    {
+      name: 'row-height',
+      title: '日期行高',
+      defaultValue: 64,
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'formatter',
+      title: '日期格式化函数',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'poppable',
+      title: '是否以弹层的形式展示日历',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'lazy-render',
+      title: '是否只渲染可视区域的内容',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-mark',
+      title: '是否显示月份背景水印',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-title',
+      title: '是否展示日历标题',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-subtitle',
+      title: '是否展示日历副标题（年月）',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-confirm',
+      title: '是否展示确认按钮',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'readonly',
+      title: '是否为只读状态，只读状态下不能选择日期',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'confirmText',
+      title: '确认按钮的文字',
+      defaultValue: '确定',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'confirm-disabled-text',
+      title: '确认按钮处于禁用状态时的文字',
+      defaultValue: '确定',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'first-day-of-week',
+      title: '设置周起始日',
+      defaultValue: 0,
+      setters: 'SelectSetter',
+      options: [
+        {
+          label: '0',
+          value: 0
+        },
+        {
+          label: '1',
+          value: 1
+        },
+        {
+          label: '2',
+          value: 2
+        },
+        {
+          label: '3',
+          value: 3
+        },
+        {
+          label: '4',
+          value: 4
+        },
+        {
+          label: '5',
+          value: 5
+        },
+        {
+          label: '6',
+          value: 6
+        }
+      ]
+    },
+    //当 Calendar 的 poppable 为 true 时，支持以下 props:
+    {
+      name: 'show',
+      title: '是否显示日历弹窗',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'position',
+      title: '弹出位置',
+      defaultValue: 'bottom',
+      setters: 'SelectSetter',
+      options: ['top', 'bottom', 'right', 'left']
+    },
+    {
+      name: 'round',
+      title: '是否显示圆角弹窗',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-on-popstate',
+      title: '是否在页面回退时自动关闭',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-on-click-overlay',
+      title: '是否在点击遮罩层后关闭',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'safe-area-inset-top',
+      title: '是否开启顶部安全区适配',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'safe-area-inset-bottom',
+      title: '是否开启顶部安全区适配',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'teleport',
+      title: '指定挂载的节点，等同于 Teleport 组件的 to 属性',
+      setters: ['StringSetter', 'ExpressionSetter']
+    },
+    // 当 Calendar 的 type 为 range 时，支持以下 props:
+    // 当 Calendar 的 type 为 multiple 时，支持以下 props:
+    {
+      name: 'max-range',
+      title: '日期区间最多可选天数',
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'range-prompt',
+      title: '范围选择超过最多可选天数时的提示文案',
+      defaultValue: '	最多选择 xx 天',
+      setters: 'StringSetter'
+    },
+    // 当 Calendar 的 type 为 range 时，支持以下 props:
+    {
+      name: 'show-range-prompt',
+      title: '范围选择超过最多可选天数时，是否展示提示文案',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'allow-same-day',
+      title: '是否允许日期范围的起止时间为同一天',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    }
+    // 当 Calendar 的 type 为 multiple 时，支持以下 props:
+  ],
+  events: [
+    'update:show',
+    'select',
+    'confirm',
+    'open',
+    'close',
+    'opened',
+    'closed',
+    'unselect',
+    'month-show',
+    'over-range',
+    'click-subtitle',
+    'click-disabled-date',
+    'panel-change'
+  ],
+  slots: [
+    'title',
+    'subtitle',
+    'month-title',
+    'footer',
+    'confirm-text',
+    'top-info',
+    'bottom-info',
+    'prev-month',
+    'prev-year',
+    'next-month',
+    'next-year'
+  ],
+  snippet: {
+    props: {
+      show: true,
+      switchMode: 'month'
+    }
+  }
+};
+
+export default Calendar;

package/src/vant/card.ts

@@ -0,0 +1,97 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const Card: MaterialDescription = {
+  name: 'VantCard',
+  alias: 'Card',
+  label: '卡片',
+  categoryId: 'business',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/card',
+  props: [
+    {
+      name: 'thumb',
+      title: '左侧图片 URL',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'title',
+      title: '标题',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'desc',
+      title: '描述',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'tag',
+      title: '图片角标',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'num',
+      title: '商品数量',
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'price',
+      title: '商品价格',
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'origin-price',
+      title: '商品划线原价',
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'centered',
+      title: '内容是否垂直居中',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'currency',
+      title: '货币符号',
+      defaultValue: '￥',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'thumb-link',
+      title: '点击左侧图片后跳转的链接地址',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'lazy-load',
+      title: '是否开启图片懒加载，须配合 Lazyload 组件使用',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    }
+  ],
+  events: [
+    { name: 'click', params: ['event'] },
+    { name: 'click-thumb', params: ['event'] }
+  ],
+  slots: [
+    'title',
+    'desc',
+    'num',
+    'price',
+    'origin-price',
+    'price-top',
+    'bottom',
+    'thumb',
+    'tag',
+    'tags',
+    'footer'
+  ],
+  snippet: {
+    props: {
+      num: 2,
+      price: '2.00',
+      desc: '描述信息',
+      title: '商品标题',
+      thumb: 'https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg'
+    }
+  }
+};
+
+export default Card;

package/src/vant/cascader.ts

@@ -0,0 +1,91 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const Cascader: MaterialDescription = {
+  name: 'VantCascader',
+  alias: 'Cascader',
+  label: '级联选择',
+  categoryId: 'form',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/cascader',
+  props: [
+    {
+      name: 'modelValue',
+      title: '选中项的值',
+      setters: ['StringSetter', 'NumberSetter']
+    },
+    {
+      name: 'title',
+      title: '顶部标题',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'options',
+      title: '可选项数据源',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'placeholder',
+      title: '未选中时的提示文案',
+      defaultValue: '请选择',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'active-color',
+      title: '选中状态的高亮颜色',
+      defaultValue: '#1989fa',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'swipeable',
+      title: '是否开启手势左右滑动切换',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'closeable',
+      title: '是否显示关闭图标',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-header',
+      title: '是否展示标题栏',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-icon',
+      title: '关闭图标名称或图片链接，等同于 Icon 组件的 name 属性',
+      defaultValue: 'cross',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'field-names',
+      title: '自定义 options 结构中的字段',
+      defaultValue: { text: 'text', value: 'value', children: 'children' },
+      setters: 'ObjectSetter'
+    }
+  ],
+  events: ['update:modelValue', 'change', 'finish', 'close', 'click-tab'],
+  slots: ['title', 'option', 'options-top', 'options-bottom'],
+  snippet: {
+    props: {
+      modelValue: '',
+      title: '请选择所在地区',
+      options: [
+        {
+          text: '浙江省',
+          value: '330000',
+          children: [{ text: '杭州市', value: '330100' }]
+        },
+        {
+          text: '江苏省',
+          value: '320000',
+          children: [{ text: '南京市', value: '320100' }]
+        }
+      ]
+    }
+  }
+};
+
+export default Cascader;

package/src/vant/cell.ts

@@ -0,0 +1,180 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const Cell: MaterialDescription[] = [
+  {
+    name: 'VantCell',
+    alias: 'Cell',
+    label: '单元格',
+    categoryId: 'base',
+    doc: 'https://vant-ui.github.io/vant/#/zh-CN/cell',
+    props: [
+      {
+        name: 'title',
+        title: '左侧标题',
+        setters: ['NumberSetter', 'StringSetter']
+      },
+      {
+        name: 'value',
+        title: '右侧标题',
+        setters: ['NumberSetter', 'StringSetter']
+      },
+      {
+        name: 'label',
+        title: '标题下方的描述信息',
+        setters: ['NumberSetter', 'StringSetter']
+      },
+      {
+        name: 'size',
+        title: '单元格大小，可选值为 large normal',
+        setters: 'SelectSetter',
+        options: ['large', 'normal']
+      },
+      {
+        name: 'icon',
+        title: '左侧图标名称或图片链接，等同于 Icon 组件的 name 属性',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'icon-prefix',
+        title: '图标类名前缀，等同于 Icon 组件的 class-prefix 属性',
+        defaultValue: 'van-icon',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'tag',
+        title: '根节点对应的 HTML 标签名',
+        defaultValue: 'div',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'url',
+        title: '点击后跳转的链接地址',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'to',
+        title: '点击后跳转的目标路由对象，等同于 Vue Router 的 to 属性',
+        setters: ['StringSetter', 'ObjectSetter']
+      },
+      {
+        name: 'border',
+        title: '是否显示内边框',
+        defaultValue: true,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'replace',
+        title: '是否在跳转时替换当前页面历史',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'clickable',
+        title: '是否开启点击反馈',
+        defaultValue: null,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'is-link',
+        title: '是否展示右侧箭头并开启点击反馈',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'required',
+        title: '是否显示表单必填星号',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'center',
+        title: '是否使内容垂直居中',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'arrow-direction',
+        title: '箭头方向，可选值为 left up down',
+        defaultValue: 'right',
+        setters: 'SelectSetter',
+        options: ['left', 'right', 'up', 'down']
+      },
+      {
+        name: 'title-style',
+        title: '左侧标题额外样式',
+        setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+      },
+      {
+        name: 'title-class',
+        title: '左侧标题额外类名',
+        setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+      },
+      {
+        name: 'value-class',
+        title: '右侧内容额外类名',
+        setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+      },
+      {
+        name: 'label-class',
+        title: '描述信息额外类名',
+        setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+      }
+    ],
+    events: ['click'],
+    slots: ['title', 'value', 'label', 'icon', 'right-icon', 'extra'],
+    snippet: {
+      props: {
+        title: '单元格',
+        value: '内容'
+      }
+    }
+  },
+  {
+    name: 'VantCellGroup',
+    alias: 'CellGroup',
+    label: '单元格组',
+    categoryId: 'base',
+    doc: 'https://vant-ui.github.io/vant/#/zh-CN/cell',
+    props: [
+      {
+        name: 'title',
+        title: '分组标题',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'inset',
+        title: '是否展示为圆角卡片风格',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'border',
+        title: '是否显示外边框',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      }
+    ],
+    slots: ['default', 'title'],
+    snippet: {
+      children: [
+        {
+          name: 'VantCell',
+          props: {
+            title: '单元格',
+            value: '内容'
+          }
+        },
+        {
+          name: 'VantCell',
+          props: {
+            title: '单元格',
+            value: '内容',
+            label: '描述信息'
+          }
+        }
+      ]
+    }
+  }
+];
+
+export default Cell;