@vtj/materials 0.8.146 → 0.8.148

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vtj/materials",
   "private": false,
-  "version": "0.8.146",
+  "version": "0.8.148",
   "type": "module",
   "devDependencies": {
     "@vueuse/core": "~11.1.0",
@@ -11,11 +11,11 @@
     "vant": "~4.9.0",
     "vue": "~3.5.5",
     "vue-router": "~4.4.0",
-    "@vtj/charts": "~0.8.146",
-    "@vtj/core": "~0.8.146",
-    "@vtj/utils": "~0.8.146",
-    "@vtj/cli": "~0.8.36",
-    "@vtj/ui": "~0.8.146"
+    "@vtj/charts": "~0.8.148",
+    "@vtj/cli": "~0.8.37",
+    "@vtj/core": "~0.8.148",
+    "@vtj/utils": "~0.8.148",
+    "@vtj/ui": "~0.8.148"
   },
   "files": [
     "dist",
@@ -26,11 +26,12 @@
     "access": "public"
   },
   "scripts": {
-    "build": "npm run remove && npm run build:ui && npm run build:charts && npm run build:element && npm run build:antdv && npm run copy",
+    "build": "npm run remove && npm run build:ui && npm run build:charts && npm run build:element && npm run build:antdv && npm run build:vant && npm run copy",
     "build:ui": "vue-tsc && cross-env BUILD_TYPE=ui vite build",
     "build:element": "vue-tsc && cross-env BUILD_TYPE=element vite build",
     "build:antdv": "vue-tsc && cross-env BUILD_TYPE=antdv vite build",
     "build:charts": "vue-tsc && cross-env BUILD_TYPE=charts vite build",
+    "build:vant": "vue-tsc && cross-env BUILD_TYPE=vant vite build",
     "remove": "node scripts/rm.mjs",
     "copy": "node scripts/copy.mjs"
   }

package/src/vant/action-bar.ts

@@ -0,0 +1,199 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const ActionBar: MaterialDescription[] = [
+  {
+    name: 'VantActionBar',
+    alias: 'ActionBar',
+    label: '动作栏',
+    categoryId: 'nav',
+    doc: 'https://vant-ui.github.io/vant/#/zh-CN/action-bar',
+    props: [
+      {
+        name: 'safe-area-inset-bottom',
+        title: '是否开启底部安全区适配',
+        defaultValue: true,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'placeholder',
+        title: '是否在标签位置生成一个等高的占位元素',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      }
+    ],
+    snippet: {
+      children: [
+        {
+          name: 'VantActionBarIcon',
+          props: {
+            icon: 'chat-o',
+            text: '客服'
+          }
+        },
+        {
+          name: 'VantActionBarIcon',
+          props: {
+            icon: 'cart-o',
+            text: '购物车'
+          }
+        },
+        {
+          name: 'VantActionBarIcon',
+          props: {
+            icon: 'shop-o',
+            text: '店铺'
+          }
+        },
+        {
+          name: 'VantActionBarButton',
+          props: {
+            type: 'danger',
+            text: '立即购买'
+          }
+        }
+      ]
+    }
+  },
+  {
+    name: 'VantActionBarIcon',
+    alias: 'ActionBarIcon',
+    label: '动作栏图标',
+    categoryId: 'nav',
+    doc: 'https://vant-ui.github.io/vant/#/zh-CN/action-bar',
+    props: [
+      {
+        name: 'text',
+        title: '按钮文字',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'icon',
+        title: '图标',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'color',
+        title: '图标颜色',
+        defaultValue: '#323233',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'icon-class',
+        title: '图标额外类名',
+        setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+      },
+      {
+        name: 'icon-prefix',
+        title: '图标类名前缀，等同于 Icon 组件的 class-prefix 属性',
+        defaultValue: 'van-icon',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'dot',
+        title: '是否显示图标右上角小红点',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'badge',
+        title: '图标右上角徽标的内容',
+        setters: ['NumberSetter', 'StringSetter']
+      },
+      {
+        name: 'badge-props',
+        title: '自定义徽标的属性，传入的对象会被透传给 Badge 组件的 props',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'url',
+        title: '点击后跳转的链接地址',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'to',
+        title: '点击后跳转的目标路由对象，等同于 Vue Router 的 to 属性',
+        setters: ['StringSetter', 'ObjectSetter']
+      },
+      {
+        name: 'replace',
+        title: '是否在跳转时替换当前页面历史',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      }
+    ],
+    slots: ['default', 'icon'],
+    snippet: {
+      props: {
+        icon: 'chat-o',
+        text: '客服'
+      }
+    }
+  },
+  {
+    name: 'VantActionBarButton',
+    alias: 'ActionBarButton',
+    label: '动作栏按钮',
+    categoryId: 'nav',
+    doc: 'https://vant-ui.github.io/vant/#/zh-CN/action-bar',
+    props: [
+      {
+        name: 'text',
+        title: '按钮文字',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'type',
+        title: '按钮类型',
+        defaultValue: 'default',
+        setters: 'SelectSetter',
+        options: ['default', 'primary', 'success', 'warning', 'danger']
+      },
+      {
+        name: 'color',
+        title: '按钮颜色，支持传入 linear-gradient 渐变色',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'icon',
+        title: '左侧图标名称或图片链接，等同于 Icon 组件的 name 属性',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'disabled',
+        title: '是否禁用按钮',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'loading',
+        title: '是否显示为加载状态',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'url',
+        title: '点击后跳转的链接地址',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'to',
+        title: '点击后跳转的目标路由对象，等同于 Vue Router 的 to 属性',
+        setters: ['StringSetter', 'ObjectSetter']
+      },
+      {
+        name: 'replace',
+        title: '是否在跳转时替换当前页面历史',
+        defaultValue: false,
+        setters: 'BooleanSetter'
+      }
+    ],
+    snippet: {
+      props: {
+        type: 'danger',
+        text: '立即购买'
+      }
+    }
+  }
+];
+
+export default ActionBar;

package/src/vant/action-sheet.ts

@@ -0,0 +1,149 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const ActionSheet: MaterialDescription = {
+  name: 'VantActionSheet',
+  alias: 'ActionSheet',
+  label: '动作面板',
+  categoryId: 'feedback',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/action-sheet',
+  props: [
+    {
+      name: 'show',
+      title: '是否显示动作面板',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'actions',
+      title: '面板选项列表',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'title',
+      title: '顶部标题',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'cancel-text',
+      title: '取消按钮文字',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'description',
+      title: '选项上方的描述信息',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'closeable',
+      title: '是否显示关闭图标',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-icon',
+      title: '关闭图标名称或图片链接，等同于 Icon 组件的 name 属性',
+      defaultValue: 'cross',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'duration',
+      title: '动画时长，单位秒，设置为 0 可以禁用动画',
+      defaultValue: 0.3,
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'z-index',
+      title: '将面板的 z-index 层级设置为一个固定值',
+      defaultValue: 2000,
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'round',
+      title: '是否显示圆角',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'overlay',
+      title: '是否显示遮罩层',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'overlay-class',
+      title: '自定义遮罩层类名',
+      setters: ['StringSetter', 'ArraySetter', 'ObjectSetter']
+    },
+    {
+      name: 'overlay-style',
+      title: '自定义遮罩层样式',
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'lock-scroll',
+      title: '是否锁定背景滚动',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'lazy-render',
+      title: 'lazy-render',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-on-popstate',
+      title: '是否在页面回退时自动关闭',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-on-click-action',
+      title: '是否在点击选项后关闭',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'close-on-click-overlay',
+      title: '是否在点击遮罩层后关闭',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'safe-area-inset-bottom',
+      title: '是否开启底部安全区适配',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'teleport',
+      title: '指定挂载的节点，等同于 Teleport 组件的 to 属性',
+      setters: ['StringSetter', 'ExpressionSetter']
+    },
+    {
+      name: 'before-close',
+      title: '关闭前的回调函数，返回 false 可阻止关闭，支持返回 Promise',
+      setters: 'FunctionSetter'
+    }
+  ],
+  events: [
+    { name: 'update:show' },
+    { name: 'select', params: ['action', 'index'] },
+    { name: 'cancel' },
+    { name: 'open' },
+    { name: 'close' },
+    { name: 'opened' },
+    { name: 'closed' },
+    { name: 'click-overlay', params: ['event'] }
+  ],
+  slots: ['default', 'description', 'cancel', 'action'],
+  snippet: {
+    props: {
+      show: true,
+      actions: [{ name: '选项一' }, { name: '选项二' }, { name: '选项三' }]
+    }
+  }
+};
+
+export default ActionSheet;

package/src/vant/address-edit.ts

@@ -0,0 +1,156 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const AddressEdit: MaterialDescription = {
+  name: 'VantAddressEdit',
+  alias: 'AddressEdit',
+  label: '地址编辑',
+  categoryId: 'business',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/address-edit',
+  props: [
+    {
+      name: 'area-list',
+      title: '地区列表',
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'area-columns-placeholder',
+      title: '地区选择列占位提示文字',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'area-placeholder',
+      title: '地区输入框占位提示文字',
+      defaultValue: '选择省 / 市 / 区',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'address-info',
+      title: '地址信息初始值',
+      defaultValue: {},
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'search-result',
+      title: '详细地址搜索结果',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'show-delete',
+      title: '是否显示删除按钮',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-set-default',
+      title: '是否显示默认地址栏',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-search-result',
+      title: '是否显示搜索结果',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-area',
+      title: '是否显示地区',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-detail',
+      title: '是否显示详细地址',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'disable-area',
+      title: '是否禁用地区选择',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'save-button-text',
+      title: '保存按钮文字',
+      defaultValue: '保存',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'delete-button-text',
+      title: '删除按钮文字',
+      defaultValue: '删除',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'detail-rows',
+      title: '详细地址输入框行数',
+      defaultValue: 1,
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'detail-maxlength',
+      title: '详细地址最大长度',
+      defaultValue: 200,
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'is-saving',
+      title: '是否显示保存按钮加载动画',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'is-deleting',
+      title: '是否显示删除按钮加载动画',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'tel-validator',
+      title: '手机号格式校验函数',
+      setters: 'FunctionSetter'
+    },
+    {
+      name: 'tel-maxlength',
+      title: '手机号最大长度',
+      setters: ['NumberSetter', 'StringSetter']
+    },
+    {
+      name: 'validator',
+      title: '自定义校验函数',
+      setters: 'FunctionSetter'
+    }
+  ],
+  events: [
+    { name: 'save', params: ['info'] },
+    { name: 'focus', params: ['key'] },
+    { name: 'change', params: ['data'] },
+    { name: 'delete', params: ['info'] },
+    { name: 'select-search', params: ['value'] },
+    { name: 'click-area' },
+    { name: 'change-area', params: ['selectedOptions'] },
+    { name: 'change-detail', params: ['value'] },
+    { name: 'change-default', params: ['checked'] }
+  ],
+  slots: ['default'],
+  snippet: {
+    props: {
+      'show-delete': true,
+      'show-set-default': true,
+      'show-search-result': true,
+      'area-list': [],
+      'area-columns-placeholder': ['请选择', '请选择', '请选择'],
+      'search-result': [
+        {
+          name: '黄龙万科中心',
+          address: '杭州市西湖区'
+        }
+      ]
+    }
+  }
+};
+
+export default AddressEdit;

package/src/vant/address-list.ts

@@ -0,0 +1,104 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const AddressList: MaterialDescription = {
+  name: 'VantAddressList',
+  alias: 'AddressList',
+  label: '地址列表',
+  categoryId: 'business',
+  doc: 'https://vant-ui.github.io/vant/#/zh-CN/address-list',
+  props: [
+    {
+      name: 'modelValue',
+      title: '当前选中地址的 id，支持多选（类型为 []）',
+      setters: ['NumberSetter', 'StringSetter', 'ArraySetter']
+    },
+    {
+      name: 'list',
+      title: '地址列表',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'disabled-list',
+      title: '不可配送地址列表',
+      defaultValue: [],
+      setters: 'ArraySetter'
+    },
+    {
+      name: 'disabled-text',
+      title: '不可配送提示文案',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'switchable',
+      title: '是否允许切换地址',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'show-add-button',
+      title: '是否显示底部按钮',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'add-button-text',
+      title: '底部按钮文字',
+      defaultValue: '	新增地址',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'default-tag-text',
+      title: '默认地址标签文字',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'right-icon',
+      title: '右侧图标名称或图片链接，等同于 Icon 组件的 name 属性',
+      defaultValue: 'edit',
+      setters: 'StringSetter'
+    }
+  ],
+  events: [
+    { name: 'update:modelValue' },
+    { name: 'add', params: ['item', 'index'] },
+    { name: 'edit', params: ['item', 'index'] },
+    { name: 'select', params: ['item', 'index'] },
+    { name: 'edit-disabled', params: ['item', 'index'] },
+    { name: 'select-disabled', params: ['item', 'index'] },
+    { name: 'click-item', params: ['item', 'index', 'data'] }
+  ],
+  slots: ['default', 'top', 'item-bottom', 'tag'],
+  snippet: {
+    props: {
+      'disabled-text': '以下地址超出配送范围',
+      'default-tag-text': '默认',
+      modelValue: 1,
+      list: [
+        {
+          id: '1',
+          name: '张三',
+          tel: '13000000000',
+          address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
+          isDefault: true
+        },
+        {
+          id: '2',
+          name: '李四',
+          tel: '1310000000',
+          address: '浙江省杭州市拱墅区莫干山路 50 号'
+        }
+      ],
+      disabledList: [
+        {
+          id: '3',
+          name: '王五',
+          tel: '1320000000',
+          address: '浙江省杭州市滨江区江南大道 15 号'
+        }
+      ]
+    }
+  }
+};
+
+export default AddressList;