@ebfe/vant-kit 0.0.2 → 0.0.4

package/package.json

@@ -1,55 +1,54 @@
 {
   "name": "@ebfe/vant-kit",
-  "version": "0.0.2",
+  "version": "0.0.4",
+  "type": "module",
   "description": "A project that includes common components from the H5 project (dependent on vant) and some utility functions",
-  "main": "lib/index.js",
-  "module": "es/index.js",
-  "style": "lib/index.css",
-  "typings": "lib/index.d.ts",
+  "main": "dist/vant-kit.umd.js",
+  "module": "dist/vant-kit.es.js",
+  "types": "dist/index.d.ts",
   "files": [
-    "lib",
-    "es"
+    "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/vant-kit.es.js",
+      "require": "./dist/vant-kit.umd.js"
+    },
+    "./style.css": "./dist/vant-kit.css"
+  },
   "publishConfig": {
     "access": "public"
   },
-  "license": "MIT",
+  "keywords": [],
   "author": "astfn",
+  "license": "MIT",
   "peerDependencies": {
-    "vue": "^3.3.4"
+    "vant": "^4.9.0",
+    "vue": "^3.5.0"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.52.9",
-    "@types/lodash": "^4.17.20",
-    "@vant/cli": "^7.0.0",
-    "sass": "^1.49.7",
+    "@vant/auto-import-resolver": "^1.3.0",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "postcss": "^8.5.6",
+    "typescript": "^5.8.3",
+    "unplugin-auto-import": "^20.1.0",
     "unplugin-dts": "1.0.0-beta.0",
-    "vue": "^3.3.4"
-  },
-  "eslintConfig": {
-    "root": true,
-    "extends": [
-      "@vant"
-    ]
-  },
-  "prettier": {
-    "singleQuote": true
+    "unplugin-vue-components": "^28.8.0",
+    "vant": "^4.9.21",
+    "vite": "^7.0.5",
+    "vue": "^3.5.17",
+    "vue-tsc": "^3.0.3",
+    "@ebfe/tsconfig": "0.0.1",
+    "@ebfe/eslint-config": "0.0.1"
   },
-  "browserslist": [
-    "Chrome >= 51",
-    "iOS >= 10"
-  ],
   "dependencies": {
     "lodash": "^4.17.21",
-    "vant": "^4.9.21",
     "@ebfe/utils": "0.0.1",
-    "@ebfe/vhooks": "0.0.1"
+    "@ebfe/vhooks": "0.0.3"
   },
   "scripts": {
-    "dev": "vant-cli dev",
-    "lint": "vant-cli lint",
-    "build": "vant-cli build",
-    "build:site": "vant-cli build-site",
-    "release:site": "pnpm build:site && npx gh-pages -d site-dist"
+    "build": "vite build"
   }
 }

package/es/field-multi-picker/README.md

@@ -1,97 +0,0 @@
-# FieldMultiPicker
-
-### 介绍
-
-基于 MultiPicker 以及 vant 的 field 组件进行二次封装，方便处理表单中的单项选择需求场景。
-
-- 支持传入所有 MultiPicker props（类型 TMultiPickerProps）
-- 支持传入所有的 [vant field props](https://vant-ui.github.io/vant/#/zh-CN/field#props)
-
-**主要功能描述**
-
-- 集成 MultiPicker 所有功能
-
-**对开发者的解脱**
-
-- 符合 ui 设计
-- 默认场景下 van-field 绑定值就是展示值，FieldMultiPicker 内部将绑定值与展示值表单真正需要收集的值分隔开。
-
-## 代码演示
-
-### 基础用法
-
-```html
-<template>
-  <span @click="getIdMapData">modelValue: {{ pickerValue }}</span>
-  <FieldMultiPicker
-    ref="FieldMultiPickerRef"
-    v-model="pickerValue"
-    :options="options"
-    :field-names="fieldNames"
-    title="基础用法"
-    tip-txt="这就是基础组件 - MultiPicke"
-    :field-props="{
-      name: 'fieldName',
-      label: '多选',
-      placeholder: '请选择',
-      required: true,
-      rules: [{ required: true, message: '请选择' }],
-    }"
-  />
-</template>
-
-<script setup lang="ts">
-  import { useWrapperRef } from '@ebfe/vhooks';
-  import FieldMultiPicker from '../index.vue';
-  import { ref } from 'vue';
-
-  const options = [
-    { name: '选项1', value: '1' },
-    { name: '选项2', value: '2', disabled: true },
-    { name: '选项3', value: '3' },
-  ];
-  const fieldNames = {
-    label: 'name',
-    value: 'value',
-  };
-  const [pickerValue, _setPickerValue] = useWrapperRef<string[]>([]);
-
-  const FieldMultiPickerRef = ref<InstanceType<typeof FieldMultiPicker>>();
-  const getIdMapData = () => {
-    console.log('getIdMapData', FieldMultiPickerRef.value?.getOptionsIdMapData?.());
-  };
-</script>
-
-<style scoped lang="less">
-  .desc {
-    font-size: 12px;
-    text-align: center;
-  }
-</style>
-```
-
-## API
-
-### Props
-
-继承 TMultiPickerProps 的同时
-
-| 参数       | 说明               | 类型             | 默认值 |
-| ---------- | ------------------ | ---------------- | ------ |
-| fieldProps | 当前选中项对应的值 | vant field props | -      |
-
-### Events
-
-继承 MultiPicker
-
-| 事件名 | 说明 | 回调参数 |
-| :----- | :--- | :------- |
-| -      | -    | -        |
-
-### Slots
-
-继承 MultiPicker
-
-| 名称 | 说明 | 参数 |
-| :--- | :--- | :--- |
-| -    | -    | -    |

package/es/field-multi-picker/index-sfc.less

@@ -1,3 +0,0 @@
-.hidden[data-v-780fee58] {
-  display: none;
-}

package/es/field-multi-picker/index.ts

@@ -1,139 +0,0 @@
-// @ts-nocheck
-import './index-sfc.css';
-import { defineComponent as _defineComponent } from 'vue';
-import MultiPicker, { TConfirmEventPayload, TMultiPickerProps } from '../multi-picker/index.vue';
-import { Field as VanField } from 'vant';
-import { isNullOrUndefined } from '@ebfe/utils';
-import { useWrapperRef } from '@ebfe/vhooks';
-import type { FieldProps } from 'vant';
-import { computed, ref, watch } from 'vue';
-
-const __default__ = {
-  name: 'FieldMultiPicker',
-};
-
-const __vue_sfc__ = /*@__PURE__*/ _defineComponent({
-  ...__default__,
-  props: {
-    modelValue: { type: Array, required: true },
-    options: { type: Array, required: true },
-    fieldNames: { type: Object, required: false },
-    title: { type: String, required: false },
-    tipTxt: { type: String, required: false },
-    showSearch: { type: Boolean, required: false },
-    searchDelay: { type: Number, required: false },
-    fieldProps: { type: Object, required: true },
-  },
-  emits: ['search', 'toggleCheckbox', 'confirm', 'update:modelValue'],
-  setup(__props: any, { expose: __expose, emit: __emit }) {
-    const Props = __props;
-
-    const computedFieldProps = computed(() => {
-      const defaultProps: typeof Props.fieldProps = {
-        inputAlign: 'right',
-        errorMessageAlign: 'right',
-      };
-      return Object.assign(Props?.fieldProps ?? {}, defaultProps);
-    });
-
-    const isViewMode = computed(
-      () => computedFieldProps.value?.readonly || computedFieldProps.value?.disabled || false
-    );
-    const isLink = computed(() => {
-      if (isNullOrUndefined(computedFieldProps.value?.isLink)) {
-        return !isViewMode.value;
-      } else {
-        return computedFieldProps.value?.isLink;
-      }
-    });
-
-    const Emitter = __emit;
-
-    const [modelFieldValue, setModelFieldValue] = useWrapperRef<any>(Props.modelValue ?? []);
-    watch(() => Props.modelValue, setModelFieldValue, { immediate: true });
-    const updateModelFieldValue = (newValue: any[] = []) => {
-      setModelFieldValue(newValue);
-      // console.log('updateModelFieldValue');
-      Emitter('update:modelValue', newValue);
-    };
-
-    const MultiPickerRef = ref<InstanceType<typeof MultiPicker>>();
-    __expose({
-      getOptionsIdMapData() {
-        return MultiPickerRef.value?.getOptionsIdMapData?.();
-      },
-    });
-
-    const __returned__ = {
-      Props,
-      computedFieldProps,
-      isViewMode,
-      isLink,
-      Emitter,
-      modelFieldValue,
-      setModelFieldValue,
-      updateModelFieldValue,
-      MultiPickerRef,
-      MultiPicker,
-      get VanField() {
-        return VanField;
-      },
-    };
-    Object.defineProperty(__returned__, '__isScriptSetup', { enumerable: false, value: true });
-    return __returned__;
-  },
-});
-import {
-  mergeProps as _mergeProps,
-  createVNode as _createVNode,
-  withCtx as _withCtx,
-  openBlock as _openBlock,
-  createBlock as _createBlock,
-} from 'vue';
-
-function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
-  return (
-    _openBlock(),
-    _createBlock(
-      $setup['MultiPicker'],
-      _mergeProps({ ref: 'MultiPickerRef' }, $setup.Props, {
-        'show-search': $props.showSearch,
-        modelValue: $setup.modelFieldValue,
-        'onUpdate:modelValue': [
-          _cache[0] || (_cache[0] = ($event) => ($setup.modelFieldValue = $event)),
-          _cache[1] || (_cache[1] = (...args) => $setup.updateModelFieldValue(...args)),
-        ],
-        onSearch: _cache[2] || (_cache[2] = (...args) => $setup.Emitter('search', ...args)),
-        onToggleCheckbox: _cache[3] || (_cache[3] = (...args) => $setup.Emitter('toggleCheckbox', ...args)),
-        onConfirm: _cache[4] || (_cache[4] = (...args) => $setup.Emitter('confirm', ...args)),
-      }),
-      {
-        trigger: _withCtx(({ triggerPopupShow, showValue }) => [
-          _createVNode(
-            $setup['VanField'],
-            _mergeProps($setup.computedFieldProps, {
-              'is-link': $setup.isLink,
-              readonly: '',
-              modelValue: showValue!,
-              'onUpdate:modelValue': ($event) => (showValue! = $event),
-              onClick: () => {
-                if ($setup.isViewMode) return;
-                triggerPopupShow();
-              },
-            }),
-            null,
-            16 /* FULL_PROPS */,
-            ['is-link', 'modelValue', 'onUpdate:modelValue', 'onClick']
-          ),
-        ]),
-        _: 1 /* STABLE */,
-      },
-      16 /* FULL_PROPS */,
-      ['show-search', 'modelValue']
-    )
-  );
-}
-__vue_sfc__.render = __vue_render__;
-
-__vue_sfc__.__scopeId = 'data-v-780fee58';
-export default __vue_sfc__;

package/es/field-single-picker/README.md

@@ -1,94 +0,0 @@
-# FieldSinglePicker
-
-### 介绍
-
-基于 SinglePicker 以及 vant 的 field 组件进行二次封装，方便处理表单中的单项选择需求场景。
-
-- 支持传入所有 SinglePicker props（类型 TSinglePickerProps）
-- 支持传入所有的 [vant field props](https://vant-ui.github.io/vant/#/zh-CN/field#props)
-
-**主要功能描述**
-
-- 集成 SinglePicker 所有功能
-
-**对开发者的解脱**
-
-- 符合 ui 设计
-- 默认场景下 van-field 绑定值就是展示值，FieldSinglePicker 内部将绑定值与展示值表单真正需要收集的值分隔开。
-
-## 代码演示
-
-### 基础用法
-
-```html
-<template>
-  modelValue: {{ pickerValue }}
-  <FieldSinglePicker
-    v-model="pickerValue"
-    :field-props="{
-      name: 'declarationType',
-      label: '单选',
-      placeholder: '请选择',
-      required: true,
-      rules: [{ required: true, message: '请选择' }],
-    }"
-    :picker-props="{
-      title: '基础用法',
-      columns: columns,
-      columnsFieldNames: columnsFieldNames,
-    }"
-  >
-    <template #columns-top>
-      <div class="desc">这就是基础组件 - SinglePicker</div>
-    </template>
-  </FieldSinglePicker>
-</template>
-
-<script setup lang="ts">
-  import { useWrapperRef } from '@ebfe/vhooks';
-  import FieldSinglePicker from '../index.vue';
-
-  const columns = [
-    { name: '选项1', value: '1' },
-    { name: '选项2', value: '2' },
-  ];
-  const columnsFieldNames = {
-    text: 'name',
-    value: 'value',
-  };
-  const [pickerValue, _setPickerValue] = useWrapperRef<string | undefined>(undefined);
-</script>
-
-<style scoped lang="less">
-  .desc {
-    font-size: 12px;
-    text-align: center;
-  }
-</style>
-```
-
-## API
-
-### Props
-
-继承 TSinglePickerProps 的同时
-
-| 参数       | 说明               | 类型             | 默认值 |
-| ---------- | ------------------ | ---------------- | ------ |
-| fieldProps | 当前选中项对应的值 | vant field props | -      |
-
-### Events
-
-继承 SinglePicker
-
-| 事件名 | 说明 | 回调参数 |
-| :----- | :--- | :------- |
-| -      | -    | -        |
-
-### Slots
-
-继承 SinglePicker
-
-| 名称 | 说明 | 参数 |
-| :--- | :--- | :--- |
-| -    | -    | -    |

package/es/field-single-picker/index-sfc.less

@@ -1,3 +0,0 @@
-.hidden[data-v-308c2b1b] {
-  display: none;
-}

package/es/field-single-picker/index.ts

@@ -1,158 +0,0 @@
-// @ts-nocheck
-import './index-sfc.css';
-import { defineComponent as _defineComponent } from 'vue';
-import SinglePicker, { TSinglePickerProps, TConfirmDisabledOptionPayload } from '../single-picker/index.vue';
-import { Field as VanField } from 'vant';
-import { isNullOrUndefined } from '@ebfe/utils';
-import { useWrapperRef } from '@ebfe/vhooks';
-import type { FieldProps } from 'vant';
-import { computed, watch } from 'vue';
-
-const __default__ = {
-  name: 'FieldSinglePicker',
-};
-
-const __vue_sfc__ = /*@__PURE__*/ _defineComponent({
-  ...__default__,
-  props: {
-    showSearch: { type: Boolean, required: false, default: false },
-    searchDelay: { type: Number, required: false },
-    modelValue: { type: null, required: true },
-    pickerProps: { type: Object, required: true },
-    fieldProps: { type: Object, required: true },
-  },
-  emits: ['search', 'confirm', 'confirmDisabledOption', 'update:modelValue'],
-  setup(__props: any, { expose: __expose, emit: __emit }) {
-    const Props = __props;
-
-    const computedFieldProps = computed(() => {
-      const defaultProps: typeof Props.fieldProps = {
-        inputAlign: 'right',
-        errorMessageAlign: 'right',
-      };
-      return Object.assign(Props?.fieldProps ?? {}, defaultProps);
-    });
-
-    const isViewMode = computed(
-      () => computedFieldProps.value?.readonly || computedFieldProps.value?.disabled || false
-    );
-    const isLink = computed(() => {
-      if (isNullOrUndefined(computedFieldProps.value?.isLink)) {
-        return !isViewMode.value;
-      } else {
-        return computedFieldProps.value?.isLink;
-      }
-    });
-
-    const Emitter = __emit;
-
-    const [modelFieldValue, setModelFieldValue] = useWrapperRef<any>(Props.modelValue);
-    watch(() => Props.modelValue, setModelFieldValue, { immediate: true });
-    const updateModelFieldValue = (newValue) => {
-      setModelFieldValue(newValue);
-      // console.log('updateModelFieldValue');
-      Emitter('update:modelValue', newValue);
-    };
-
-    __expose({});
-
-    const __returned__ = {
-      Props,
-      computedFieldProps,
-      isViewMode,
-      isLink,
-      Emitter,
-      modelFieldValue,
-      setModelFieldValue,
-      updateModelFieldValue,
-      SinglePicker,
-      get VanField() {
-        return VanField;
-      },
-    };
-    Object.defineProperty(__returned__, '__isScriptSetup', { enumerable: false, value: true });
-    return __returned__;
-  },
-});
-import {
-  createCommentVNode as _createCommentVNode,
-  mergeProps as _mergeProps,
-  renderSlot as _renderSlot,
-  createVNode as _createVNode,
-  withCtx as _withCtx,
-  renderList as _renderList,
-  createSlots as _createSlots,
-  openBlock as _openBlock,
-  createBlock as _createBlock,
-} from 'vue';
-
-function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
-  return (
-    _openBlock(),
-    _createBlock(
-      $setup['SinglePicker'],
-      {
-        modelValue: $setup.modelFieldValue,
-        'onUpdate:modelValue': [
-          _cache[1] || (_cache[1] = ($event) => ($setup.modelFieldValue = $event)),
-          _cache[2] || (_cache[2] = (...args) => $setup.updateModelFieldValue(...args)),
-        ],
-        'picker-props': $props.pickerProps,
-        'show-search': $props.showSearch,
-        onSearch: _cache[3] || (_cache[3] = (...args) => $setup.Emitter('search', ...args)),
-        onConfirm: _cache[4] || (_cache[4] = (...args) => $setup.Emitter('confirm', ...args)),
-        onConfirmDisabledOption:
-          _cache[5] || (_cache[5] = (...args) => $setup.Emitter('confirmDisabledOption', ...args)),
-      },
-      _createSlots(
-        {
-          trigger: _withCtx(({ triggerPopupShow, showValue }) => [
-            _createVNode(
-              $setup['VanField'],
-              _mergeProps({ class: 'hidden' }, $setup.computedFieldProps, {
-                modelValue: $setup.modelFieldValue,
-                'onUpdate:modelValue': _cache[0] || (_cache[0] = ($event) => ($setup.modelFieldValue = $event)),
-                'is-link': $setup.isLink,
-              }),
-              null,
-              16 /* FULL_PROPS */,
-              ['modelValue', 'is-link']
-            ),
-            _createVNode(
-              $setup['VanField'],
-              _mergeProps($setup.computedFieldProps, {
-                'is-link': $setup.isLink,
-                readonly: '',
-                name: undefined,
-                modelValue: showValue!,
-                'onUpdate:modelValue': ($event) => (showValue! = $event),
-                onClick: () => {
-                  if ($setup.isViewMode) return;
-                  triggerPopupShow();
-                },
-              }),
-              null,
-              16 /* FULL_PROPS */,
-              ['is-link', 'modelValue', 'onUpdate:modelValue', 'onClick']
-            ),
-          ]),
-          _: 2 /* DYNAMIC */,
-        },
-        [
-          _renderList(_ctx.$slots, (_slot, name) => {
-            return {
-              name: name,
-              fn: _withCtx((slotData) => [_renderSlot(_ctx.$slots, name, _mergeProps(slotData, { key: name }))]),
-            };
-          }),
-        ]
-      ),
-      1032 /* PROPS, DYNAMIC_SLOTS */,
-      ['modelValue', 'picker-props', 'show-search']
-    )
-  );
-}
-__vue_sfc__.render = __vue_render__;
-
-__vue_sfc__.__scopeId = 'data-v-308c2b1b';
-export default __vue_sfc__;

package/es/index.js

@@ -1,25 +0,0 @@
-import FieldMultiPicker from './field-multi-picker';
-import FieldSinglePicker from './field-single-picker';
-import MultiPicker from './multi-picker';
-import SinglePicker from './single-picker';
-
-const version = '0.0.1';
-
-function install(app) {
-  const components = [FieldMultiPicker, FieldSinglePicker, MultiPicker, SinglePicker];
-
-  components.forEach((item) => {
-    if (item.install) {
-      app.use(item);
-    } else if (item.name) {
-      app.component(item.name, item);
-    }
-  });
-}
-
-export { install, version, FieldMultiPicker, FieldSinglePicker, MultiPicker, SinglePicker };
-
-export default {
-  install,
-  version,
-};