vant 4.0.0-beta.1 → 4.0.0-rc.2

package/es/picker/Picker.mjs

@@ -1,24 +1,22 @@
-import { createVNode as _createVNode } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { ref, watch, computed, defineComponent } from "vue";
-import { extend, unitToPx, truthProp, isSameValue, makeArrayProp, preventDefault, makeStringProp, makeNumericProp, createNamespace, HAPTICS_FEEDBACK, BORDER_UNSET_TOP_BOTTOM } from "../utils/index.mjs";
-import { isOptionExist, getColumnsType, findOptionByValue, formatCascadeColumns, getFirstEnabledOption, assignDefaultFields } from "./utils.mjs";
-import { useChildren } from "@vant/use";
+import { pick, extend, unitToPx, truthProp, isSameValue, makeArrayProp, preventDefault, makeStringProp, makeNumericProp, BORDER_UNSET_TOP_BOTTOM } from "../utils/index.mjs";
+import { bem, name, isOptionExist, getColumnsType, findOptionByValue, assignDefaultFields, formatCascadeColumns, getFirstEnabledOption } from "./utils.mjs";
+import { useChildren, useEventListener, useParent } from "@vant/use";
 import { useExpose } from "../composables/use-expose.mjs";
 import { Loading } from "../loading/index.mjs";
 import Column, { PICKER_KEY } from "./PickerColumn.mjs";
-const [name, bem, t] = createNamespace("picker");
-const pickerSharedProps = {
-  title: String,
+import Toolbar, { pickerToolbarPropKeys, pickerToolbarProps, pickerToolbarSlots } from "./PickerToolbar.mjs";
+import { PICKER_GROUP_KEY } from "../picker-group/PickerGroup.mjs";
+const pickerSharedProps = extend({
   loading: Boolean,
   readonly: Boolean,
   allowHtml: Boolean,
   optionHeight: makeNumericProp(44),
   showToolbar: truthProp,
   swipeDuration: makeNumericProp(1e3),
-  visibleOptionNum: makeNumericProp(6),
-  cancelButtonText: String,
-  confirmButtonText: String
-};
+  visibleOptionNum: makeNumericProp(6)
+}, pickerToolbarProps);
 const pickerProps = extend({}, pickerSharedProps, {
   columns: makeArrayProp(),
   modelValue: makeArrayProp(),
@@ -33,7 +31,11 @@ var stdin_default = defineComponent({
     emit,
     slots
   }) {
-    const selectedValues = ref(props.modelValue);
+    const columnsRef = ref();
+    const selectedValues = ref(props.modelValue.slice(0));
+    const {
+      parent
+    } = useParent(PICKER_GROUP_KEY);
     const {
       children,
       linkChildren
@@ -64,6 +66,10 @@ var stdin_default = defineComponent({
         selectedValues.value = newValues;
       }
     };
+    const getEventParams = () => ({
+      selectedValues: selectedValues.value.slice(0),
+      selectedOptions: selectedOptions.value
+    });
     const onChange = (value, columnIndex) => {
       setValue(columnIndex, value);
       if (columnsType.value === "cascade") {
@@ -74,62 +80,21 @@ var stdin_default = defineComponent({
           }
         });
       }
-      emit("change", {
-        columnIndex,
-        selectedValues: selectedValues.value,
-        selectedOptions: selectedOptions.value
-      });
+      emit("change", extend({
+        columnIndex
+      }, getEventParams()));
     };
-    const onClickOption = (currentOption, columnIndex) => emit("clickOption", {
+    const onClickOption = (currentOption, columnIndex) => emit("clickOption", extend({
       columnIndex,
-      currentOption,
-      selectedValues: selectedValues.value,
-      selectedOptions: selectedOptions.value
-    });
+      currentOption
+    }, getEventParams()));
     const confirm = () => {
       children.forEach((child) => child.stopMomentum());
-      emit("confirm", {
-        selectedValues: selectedValues.value,
-        selectedOptions: selectedOptions.value
-      });
-    };
-    const cancel = () => emit("cancel", {
-      selectedValues: selectedValues.value,
-      selectedOptions: selectedOptions.value
-    });
-    const renderTitle = () => {
-      if (slots.title) {
-        return slots.title();
-      }
-      if (props.title) {
-        return _createVNode("div", {
-          "class": [bem("title"), "van-ellipsis"]
-        }, [props.title]);
-      }
-    };
-    const renderCancel = () => {
-      const text = props.cancelButtonText || t("cancel");
-      return _createVNode("button", {
-        "type": "button",
-        "class": [bem("cancel"), HAPTICS_FEEDBACK],
-        "onClick": cancel
-      }, [slots.cancel ? slots.cancel() : text]);
-    };
-    const renderConfirm = () => {
-      const text = props.confirmButtonText || t("confirm");
-      return _createVNode("button", {
-        "type": "button",
-        "class": [bem("confirm"), HAPTICS_FEEDBACK],
-        "onClick": confirm
-      }, [slots.confirm ? slots.confirm() : text]);
-    };
-    const renderToolbar = () => {
-      if (props.showToolbar) {
-        return _createVNode("div", {
-          "class": bem("toolbar")
-        }, [slots.toolbar ? slots.toolbar() : [renderCancel(), renderTitle(), renderConfirm()]]);
-      }
+      const params = getEventParams();
+      emit("confirm", params);
+      return params;
     };
+    const cancel = () => emit("cancel", getEventParams());
     const renderColumnItems = () => currentColumns.value.map((options, columnIndex) => _createVNode(Column, {
       "value": selectedValues.value[columnIndex],
       "fields": fields.value,
@@ -167,11 +132,19 @@ var stdin_default = defineComponent({
         height: `${wrapHeight}px`
       };
       return _createVNode("div", {
+        "ref": columnsRef,
         "class": bem("columns"),
-        "style": columnsStyle,
-        "onTouchmove": preventDefault
+        "style": columnsStyle
       }, [renderColumnItems(), renderMask(wrapHeight)]);
     };
+    const renderToolbar = () => {
+      if (props.showToolbar && !parent) {
+        return _createVNode(Toolbar, _mergeProps(pick(props, pickerToolbarPropKeys), {
+          "onConfirm": confirm,
+          "onCancel": cancel
+        }), pick(slots, pickerToolbarSlots));
+      }
+    };
     watch(currentColumns, (columns) => {
       columns.forEach((options, index) => {
         if (options.length && !isOptionExist(options, selectedValues.value[index], fields.value)) {
@@ -181,20 +154,25 @@ var stdin_default = defineComponent({
     }, {
       immediate: true
     });
+    let lastEmittedModelValue;
     watch(() => props.modelValue, (newValues) => {
-      if (!isSameValue(newValues, selectedValues.value)) {
-        selectedValues.value = newValues;
+      if (!isSameValue(newValues, selectedValues.value) && !isSameValue(newValues, lastEmittedModelValue)) {
+        selectedValues.value = newValues.slice(0);
       }
     }, {
       deep: true
     });
     watch(selectedValues, (newValues) => {
       if (!isSameValue(newValues, props.modelValue)) {
-        emit("update:modelValue", newValues);
+        lastEmittedModelValue = newValues.slice(0);
+        emit("update:modelValue", lastEmittedModelValue);
       }
     }, {
       immediate: true
     });
+    useEventListener("touchmove", preventDefault, {
+      target: columnsRef
+    });
     const getSelectedOptions = () => selectedOptions.value;
     useExpose({
       confirm,
@@ -212,5 +190,6 @@ var stdin_default = defineComponent({
 });
 export {
   stdin_default as default,
+  pickerProps,
   pickerSharedProps
 };

package/es/picker/PickerColumn.mjs

@@ -2,7 +2,7 @@ import { createVNode as _createVNode } from "vue";
 import { ref, watchEffect, defineComponent } from "vue";
 import { clamp, numericProp, makeArrayProp, preventDefault, createNamespace, makeRequiredProp } from "../utils/index.mjs";
 import { getElementTranslateY, findIndexOfEnabledOption } from "./utils.mjs";
-import { useParent } from "@vant/use";
+import { useEventListener, useParent } from "@vant/use";
 import { useTouch } from "../composables/use-touch.mjs";
 import { useExpose } from "../composables/use-expose.mjs";
 const DEFAULT_DURATION = 200;
@@ -32,6 +32,7 @@ var stdin_default = defineComponent({
     let touchStartTime;
     let momentumOffset;
     let transitionEndTrigger;
+    const root = ref();
     const wrapper = ref();
     const currentOffset = ref(0);
     const currentDuration = ref(0);
@@ -165,10 +166,13 @@ var stdin_default = defineComponent({
       const offset = -enabledIndex * props.optionHeight;
       currentOffset.value = offset;
     });
+    useEventListener("touchmove", onTouchMove, {
+      target: root
+    });
     return () => _createVNode("div", {
+      "ref": root,
       "class": bem(),
       "onTouchstartPassive": onTouchStart,
-      "onTouchmove": onTouchMove,
       "onTouchend": onTouchEnd,
       "onTouchcancel": onTouchEnd
     }, [_createVNode("ul", {

package/es/picker/PickerToolbar.d.ts

@@ -0,0 +1,21 @@
+export declare const pickerToolbarProps: {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+};
+export declare const pickerToolbarSlots: string[];
+export declare type PickerToolbarPropKeys = Array<keyof typeof pickerToolbarProps>;
+export declare const pickerToolbarPropKeys: PickerToolbarPropKeys;
+declare const _default: import("vue").DefineComponent<{
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "confirm")[], "cancel" | "confirm", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}>> & {
+    onCancel?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}, {}>;
+export default _default;

package/es/picker/PickerToolbar.mjs

@@ -0,0 +1,59 @@
+import { createVNode as _createVNode } from "vue";
+import { defineComponent } from "vue";
+import { bem, t } from "./utils.mjs";
+import { createNamespace, HAPTICS_FEEDBACK } from "../utils/index.mjs";
+const [name] = createNamespace("picker-toolbar");
+const pickerToolbarProps = {
+  title: String,
+  cancelButtonText: String,
+  confirmButtonText: String
+};
+const pickerToolbarSlots = ["cancel", "confirm", "title", "toolbar"];
+const pickerToolbarPropKeys = Object.keys(pickerToolbarProps);
+var stdin_default = defineComponent({
+  name,
+  props: pickerToolbarProps,
+  emits: ["confirm", "cancel"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const renderTitle = () => {
+      if (slots.title) {
+        return slots.title();
+      }
+      if (props.title) {
+        return _createVNode("div", {
+          "class": [bem("title"), "van-ellipsis"]
+        }, [props.title]);
+      }
+    };
+    const onCancel = () => emit("cancel");
+    const onConfirm = () => emit("confirm");
+    const renderCancel = () => {
+      const text = props.cancelButtonText || t("cancel");
+      return _createVNode("button", {
+        "type": "button",
+        "class": [bem("cancel"), HAPTICS_FEEDBACK],
+        "onClick": onCancel
+      }, [slots.cancel ? slots.cancel() : text]);
+    };
+    const renderConfirm = () => {
+      const text = props.confirmButtonText || t("confirm");
+      return _createVNode("button", {
+        "type": "button",
+        "class": [bem("confirm"), HAPTICS_FEEDBACK],
+        "onClick": onConfirm
+      }, [slots.confirm ? slots.confirm() : text]);
+    };
+    return () => _createVNode("div", {
+      "class": bem("toolbar")
+    }, [slots.toolbar ? slots.toolbar() : [renderCancel(), renderTitle(), renderConfirm()]]);
+  }
+});
+export {
+  stdin_default as default,
+  pickerToolbarPropKeys,
+  pickerToolbarProps,
+  pickerToolbarSlots
+};

package/es/picker/index.css

@@ -1 +1 @@
-body{--van-picker-background: var(--van-background-2);--van-picker-toolbar-height: 44px;--van-picker-title-font-size: var(--van-font-size-lg);--van-picker-title-line-height: var(--van-line-height-md);--van-picker-action-padding: 0 var(--van-padding-md);--van-picker-action-font-size: var(--van-font-size-md);--van-picker-confirm-action-color: var(--van-link-color);--van-picker-cancel-action-color: var(--van-text-color-2);--van-picker-option-font-size: var(--van-font-size-lg);--van-picker-option-padding: 0 var(--van-padding-base);--van-picker-option-text-color: var(--van-text-color);--van-picker-option-disabled-opacity: .3;--van-picker-loading-icon-color: var(--van-primary-color);--van-picker-loading-mask-color: rgba(255, 255, 255, .9);--van-picker-mask-color: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4)), linear-gradient(0deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4))}.van-theme-dark{--van-picker-mask-color: linear-gradient(180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .1)), linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .1))}.van-picker{position:relative;background:var(--van-picker-background);-webkit-user-select:none;user-select:none}.van-picker__toolbar{display:flex;align-items:center;justify-content:space-between;height:var(--van-picker-toolbar-height)}.van-picker__cancel,.van-picker__confirm{height:100%;padding:var(--van-picker-action-padding);font-size:var(--van-picker-action-font-size);background-color:transparent;border:none}.van-picker__confirm{color:var(--van-picker-confirm-action-color)}.van-picker__cancel{color:var(--van-picker-cancel-action-color)}.van-picker__title{color:var(--van-text-color);max-width:50%;font-weight:var(--van-font-bold);font-size:var(--van-picker-title-font-size);line-height:var(--van-picker-title-line-height);text-align:center}.van-picker__columns{position:relative;display:flex;cursor:-webkit-grab;cursor:grab}.van-picker__loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:flex;align-items:center;justify-content:center;color:var(--van-picker-loading-icon-color);background:var(--van-picker-loading-mask-color)}.van-picker__frame{position:absolute;top:50%;right:var(--van-padding-md);left:var(--van-padding-md);z-index:2;transform:translateY(-50%);pointer-events:none}.van-picker__mask{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background-image:var(--van-picker-mask-color);background-repeat:no-repeat;background-position:top,bottom;transform:translateZ(0);pointer-events:none}.van-picker-column{flex:1;overflow:hidden;font-size:var(--van-picker-option-font-size)}.van-picker-column__wrapper{transition-timing-function:cubic-bezier(.23,1,.68,1)}.van-picker-column__item{display:flex;align-items:center;justify-content:center;padding:var(--van-picker-option-padding);color:var(--van-picker-option-text-color)}.van-picker-column__item--disabled{cursor:not-allowed;opacity:var(--van-picker-option-disabled-opacity)}
+:root{--van-picker-background: var(--van-background-2);--van-picker-toolbar-height: 44px;--van-picker-title-font-size: var(--van-font-size-lg);--van-picker-title-line-height: var(--van-line-height-md);--van-picker-action-padding: 0 var(--van-padding-md);--van-picker-action-font-size: var(--van-font-size-md);--van-picker-confirm-action-color: var(--van-link-color);--van-picker-cancel-action-color: var(--van-text-color-2);--van-picker-option-font-size: var(--van-font-size-lg);--van-picker-option-padding: 0 var(--van-padding-base);--van-picker-option-text-color: var(--van-text-color);--van-picker-option-disabled-opacity: .3;--van-picker-loading-icon-color: var(--van-primary-color);--van-picker-loading-mask-color: rgba(255, 255, 255, .9);--van-picker-mask-color: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4)), linear-gradient(0deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4))}.van-theme-dark{--van-picker-mask-color: linear-gradient(180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .1)), linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .1))}.van-picker{position:relative;background:var(--van-picker-background);-webkit-user-select:none;user-select:none}.van-picker__toolbar{display:flex;align-items:center;justify-content:space-between;height:var(--van-picker-toolbar-height)}.van-picker__cancel,.van-picker__confirm{height:100%;padding:var(--van-picker-action-padding);font-size:var(--van-picker-action-font-size);background-color:transparent;border:none}.van-picker__confirm{color:var(--van-picker-confirm-action-color)}.van-picker__cancel{color:var(--van-picker-cancel-action-color)}.van-picker__title{color:var(--van-text-color);max-width:50%;font-weight:var(--van-font-bold);font-size:var(--van-picker-title-font-size);line-height:var(--van-picker-title-line-height);text-align:center}.van-picker__columns{position:relative;display:flex;cursor:-webkit-grab;cursor:grab}.van-picker__loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:flex;align-items:center;justify-content:center;color:var(--van-picker-loading-icon-color);background:var(--van-picker-loading-mask-color)}.van-picker__frame{position:absolute;top:50%;right:var(--van-padding-md);left:var(--van-padding-md);z-index:2;transform:translateY(-50%);pointer-events:none}.van-picker__mask{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background-image:var(--van-picker-mask-color);background-repeat:no-repeat;background-position:top,bottom;transform:translateZ(0);pointer-events:none}.van-picker-column{flex:1;overflow:hidden;font-size:var(--van-picker-option-font-size)}.van-picker-column__wrapper{transition-timing-function:cubic-bezier(.23,1,.68,1)}.van-picker-column__item{display:flex;align-items:center;justify-content:center;padding:var(--van-picker-option-padding);color:var(--van-picker-option-text-color)}.van-picker-column__item--disabled{cursor:not-allowed;opacity:var(--van-picker-option-disabled-opacity)}

package/es/picker/index.d.ts

@@ -1,6 +1,5 @@
 import { PickerProps } from './Picker';
 export declare const Picker: import("../utils").WithInstall<import("vue").DefineComponent<{
-    title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
     allowHtml: BooleanConstructor;
@@ -20,6 +19,8 @@ export declare const Picker: import("../utils").WithInstall<import("vue").Define
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
+} & {
+    title: StringConstructor;
     cancelButtonText: StringConstructor;
     confirmButtonText: StringConstructor;
 } & {
@@ -37,7 +38,6 @@ export declare const Picker: import("../utils").WithInstall<import("vue").Define
     };
     columnsFieldNames: import("vue").PropType<import("./types").PickerFieldNames>;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "cancel" | "clickOption" | "confirm")[], "update:modelValue" | "change" | "cancel" | "clickOption" | "confirm", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
     allowHtml: BooleanConstructor;
@@ -57,6 +57,8 @@ export declare const Picker: import("../utils").WithInstall<import("vue").Define
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
+} & {
+    title: StringConstructor;
     cancelButtonText: StringConstructor;
     confirmButtonText: StringConstructor;
 } & {
@@ -92,6 +94,7 @@ export declare const Picker: import("../utils").WithInstall<import("vue").Define
     toolbarPosition: import("./types").PickerToolbarPosition;
 }>>;
 export default Picker;
+export { pickerProps } from './Picker';
 export type { PickerProps };
 export type { PickerColumn, PickerOption, PickerInstance, PickerFieldNames, PickerToolbarPosition, PickerCancelEventParams, PickerChangeEventParams, PickerConfirmEventParams, } from './types';
 declare module 'vue' {

package/es/picker/index.mjs

@@ -2,7 +2,9 @@ import { withInstall } from "../utils/index.mjs";
 import _Picker from "./Picker.mjs";
 const Picker = withInstall(_Picker);
 var stdin_default = Picker;
+import { pickerProps } from "./Picker.mjs";
 export {
   Picker,
-  stdin_default as default
+  stdin_default as default,
+  pickerProps
 };

package/es/picker/style/index.mjs

@@ -1,3 +1,10 @@
 import "../../style/base.css";
+import "../../badge/index.css";
 import "../../loading/index.css";
+import "../../sticky/index.css";
+import "../../swipe/index.css";
+import "../../swipe-item/index.css";
+import "../../tabs/index.css";
+import "../../tab/index.css";
+import "../../picker-group/index.css";
 import "../index.css";

package/es/picker/utils.d.ts

@@ -1,6 +1,8 @@
 import { type Numeric } from '../utils';
 import type { Ref } from 'vue';
 import type { PickerOption, PickerColumn, PickerFieldNames } from './types';
+declare const name: string, bem: (el?: import("../utils").Mods | undefined, mods?: import("../utils").Mods | undefined) => import("../utils").Mods, t: (path: string, ...args: unknown[]) => any;
+export { name, bem, t };
 export declare const getFirstEnabledOption: (options: PickerOption[]) => PickerOption | undefined;
 export declare function getColumnsType(columns: PickerColumn | PickerColumn[], fields: Required<PickerFieldNames>): "default" | "multiple" | "cascade";
 export declare function findIndexOfEnabledOption(options: PickerOption[], index: number): number;

package/es/picker/utils.mjs

@@ -1,4 +1,5 @@
-import { isDef, clamp, extend } from "../utils/index.mjs";
+import { isDef, clamp, extend, createNamespace } from "../utils/index.mjs";
+const [name, bem, t] = createNamespace("picker");
 const getFirstEnabledOption = (options) => options.find((option) => !option.disabled) || options[0];
 function getColumnsType(columns, fields) {
   const firstColumn = columns[0];
@@ -55,19 +56,25 @@ function getElementTranslateY(element) {
   return Number(translateY);
 }
 function assignDefaultFields(fields) {
-  return extend({
-    text: "text",
-    value: "value",
-    children: "children"
-  }, fields);
+  return extend(
+    {
+      text: "text",
+      value: "value",
+      children: "children"
+    },
+    fields
+  );
 }
 export {
   assignDefaultFields,
+  bem,
   findIndexOfEnabledOption,
   findOptionByValue,
   formatCascadeColumns,
   getColumnsType,
   getElementTranslateY,
   getFirstEnabledOption,
-  isOptionExist
+  isOptionExist,
+  name,
+  t
 };

package/es/picker-group/PickerGroup.d.ts

@@ -0,0 +1,39 @@
+import { type InjectionKey, type ExtractPropTypes } from 'vue';
+export declare type PickerGroupProvide = Record<string, string>;
+export declare const PICKER_GROUP_KEY: InjectionKey<PickerGroupProvide>;
+export declare const pickerGroupProps: {
+    tabs: {
+        type: import("vue").PropType<string[]>;
+        default: () => never[];
+    };
+} & {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+};
+export declare type PickerGroupProps = ExtractPropTypes<typeof pickerGroupProps>;
+declare const _default: import("vue").DefineComponent<{
+    tabs: {
+        type: import("vue").PropType<string[]>;
+        default: () => never[];
+    };
+} & {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "confirm")[], "cancel" | "confirm", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    tabs: {
+        type: import("vue").PropType<string[]>;
+        default: () => never[];
+    };
+} & {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}>> & {
+    onCancel?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}, {
+    tabs: string[];
+}>;
+export default _default;

package/es/picker-group/PickerGroup.mjs

@@ -0,0 +1,57 @@
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { defineComponent } from "vue";
+import { extend, makeArrayProp, createNamespace } from "../utils/index.mjs";
+import { useChildren } from "@vant/use";
+import { Tab } from "../tab/index.mjs";
+import { Tabs } from "../tabs/index.mjs";
+import Toolbar, { pickerToolbarProps } from "../picker/PickerToolbar.mjs";
+const [name, bem] = createNamespace("picker-group");
+const PICKER_GROUP_KEY = Symbol(name);
+const pickerGroupProps = extend({
+  tabs: makeArrayProp()
+}, pickerToolbarProps);
+var stdin_default = defineComponent({
+  name,
+  props: pickerGroupProps,
+  emits: ["confirm", "cancel"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const {
+      children,
+      linkChildren
+    } = useChildren(PICKER_GROUP_KEY);
+    linkChildren();
+    const onConfirm = () => {
+      emit("confirm", children.map((item) => item.confirm()));
+    };
+    const onCancel = () => emit("cancel");
+    return () => {
+      var _a;
+      const childNodes = (_a = slots.default) == null ? void 0 : _a.call(slots);
+      return _createVNode("div", {
+        "class": bem()
+      }, [_createVNode(Toolbar, _mergeProps(props, {
+        "onConfirm": onConfirm,
+        "onCancel": onCancel
+      }), null), _createVNode(Tabs, {
+        "shrink": true,
+        "class": bem("tabs"),
+        "animated": true
+      }, {
+        default: () => [props.tabs.map((title, index) => _createVNode(Tab, {
+          "title": title,
+          "titleClass": bem("tab-title")
+        }, {
+          default: () => [childNodes == null ? void 0 : childNodes[index]]
+        }))]
+      })]);
+    };
+  }
+});
+export {
+  PICKER_GROUP_KEY,
+  stdin_default as default,
+  pickerGroupProps
+};

package/es/picker-group/index.css

@@ -0,0 +1 @@
+:root{--van-picker-group-background: var(--van-background-2)}.van-picker-group{background:var(--van-picker-group-background)}.van-picker-group__tabs{margin-top:var(--van-padding-base)}.van-picker-group__tab-title{margin-right:16px}

package/es/picker-group/index.d.ts

@@ -0,0 +1,33 @@
+import { PickerGroupProps } from './PickerGroup';
+export declare const PickerGroup: import("../utils").WithInstall<import("vue").DefineComponent<{
+    tabs: {
+        type: import("vue").PropType<string[]>;
+        default: () => never[];
+    };
+} & {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "confirm")[], "cancel" | "confirm", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    tabs: {
+        type: import("vue").PropType<string[]>;
+        default: () => never[];
+    };
+} & {
+    title: StringConstructor;
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+}>> & {
+    onCancel?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}, {
+    tabs: string[];
+}>>;
+export default PickerGroup;
+export { pickerGroupProps } from './PickerGroup';
+export type { PickerGroupProps };
+declare module 'vue' {
+    interface GlobalComponents {
+        VanPickerGroup: typeof PickerGroup;
+    }
+}

package/es/picker-group/index.mjs

@@ -0,0 +1,10 @@
+import { withInstall } from "../utils/index.mjs";
+import _PickerGroup from "./PickerGroup.mjs";
+const PickerGroup = withInstall(_PickerGroup);
+var stdin_default = PickerGroup;
+import { pickerGroupProps } from "./PickerGroup.mjs";
+export {
+  PickerGroup,
+  stdin_default as default,
+  pickerGroupProps
+};

package/es/picker-group/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/es/picker-group/style/index.mjs

@@ -0,0 +1,9 @@
+import "../../style/base.css";
+import "../../badge/index.css";
+import "../../sticky/index.css";
+import "../../swipe/index.css";
+import "../../swipe-item/index.css";
+import "../../tabs/index.css";
+import "../../tab/index.css";
+import "../../picker/index.css";
+import "../index.css";

package/es/popover/Popover.d.ts

@@ -1,6 +1,6 @@
 import { type PropType, type CSSProperties, type ExtractPropTypes } from 'vue';
 import { PopoverTheme, PopoverAction, PopoverTrigger, PopoverPlacement } from './types';
-declare const popoverProps: {
+export declare const popoverProps: {
     show: BooleanConstructor;
     theme: {
         type: PropType<PopoverTheme>;

package/es/popover/Popover.mjs

@@ -174,5 +174,6 @@ var stdin_default = defineComponent({
   }
 });
 export {
-  stdin_default as default
+  stdin_default as default,
+  popoverProps
 };

package/es/popover/index.css

@@ -1 +1 @@
-body{--van-popover-arrow-size: 6px;--van-popover-radius: var(--van-radius-lg);--van-popover-action-width: 128px;--van-popover-action-height: 44px;--van-popover-action-font-size: var(--van-font-size-md);--van-popover-action-line-height: var(--van-line-height-md);--van-popover-action-icon-size: 20px;--van-popover-light-text-color: var(--van-text-color);--van-popover-light-background: var(--van-background-2);--van-popover-light-action-disabled-text-color: var(--van-text-color-3);--van-popover-dark-text-color: var(--van-white);--van-popover-dark-background: #4a4a4a;--van-popover-dark-action-disabled-text-color: var(--van-text-color-2)}.van-popover{position:absolute;overflow:visible;background-color:transparent;transition:opacity .15s,transform .15s}.van-popover__wrapper{display:inline-block}.van-popover__arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;border-width:var(--van-popover-arrow-size)}.van-popover__content{overflow:hidden;border-radius:var(--van-popover-radius)}.van-popover__action{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--van-popover-action-width);height:var(--van-popover-action-height);padding:0 var(--van-padding-md);font-size:var(--van-popover-action-font-size);line-height:var(--van-line-height-md);cursor:pointer}.van-popover__action:last-child .van-popover__action-text:after{display:none}.van-popover__action-text{display:flex;flex:1;align-items:center;justify-content:center;height:100%}.van-popover__action-icon{margin-right:var(--van-padding-xs);font-size:var(--van-popover-action-icon-size)}.van-popover__action--with-icon .van-popover__action-text{justify-content:flex-start}.van-popover[data-popper-placement^=top] .van-popover__arrow{bottom:0;border-top-color:currentColor;border-bottom-width:0;transform:translate(-50%);margin-bottom:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=top]{transform-origin:50% 100%}.van-popover[data-popper-placement=top] .van-popover__arrow{left:50%}.van-popover[data-popper-placement=top-start]{transform-origin:0 100%}.van-popover[data-popper-placement=top-start] .van-popover__arrow{left:var(--van-padding-md)}.van-popover[data-popper-placement=top-end]{transform-origin:100% 100%}.van-popover[data-popper-placement=top-end] .van-popover__arrow{right:var(--van-padding-md)}.van-popover[data-popper-placement^=left] .van-popover__arrow{right:0;border-right-width:0;border-left-color:currentColor;transform:translateY(-50%);margin-right:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=left]{transform-origin:100% 50%}.van-popover[data-popper-placement=left] .van-popover__arrow{top:50%}.van-popover[data-popper-placement=left-start]{transform-origin:100% 0}.van-popover[data-popper-placement=left-start] .van-popover__arrow{top:var(--van-padding-md)}.van-popover[data-popper-placement=left-end]{transform-origin:100% 100%}.van-popover[data-popper-placement=left-end] .van-popover__arrow{bottom:var(--van-padding-md)}.van-popover[data-popper-placement^=right] .van-popover__arrow{left:0;border-right-color:currentColor;border-left-width:0;transform:translateY(-50%);margin-left:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=right]{transform-origin:0 50%}.van-popover[data-popper-placement=right] .van-popover__arrow{top:50%}.van-popover[data-popper-placement=right-start]{transform-origin:0 0}.van-popover[data-popper-placement=right-start] .van-popover__arrow{top:var(--van-padding-md)}.van-popover[data-popper-placement=right-end]{transform-origin:0 100%}.van-popover[data-popper-placement=right-end] .van-popover__arrow{bottom:var(--van-padding-md)}.van-popover[data-popper-placement^=bottom] .van-popover__arrow{top:0;border-top-width:0;border-bottom-color:currentColor;transform:translate(-50%);margin-top:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=bottom]{transform-origin:50% 0}.van-popover[data-popper-placement=bottom] .van-popover__arrow{left:50%}.van-popover[data-popper-placement=bottom-start]{transform-origin:0 0}.van-popover[data-popper-placement=bottom-start] .van-popover__arrow{left:var(--van-padding-md)}.van-popover[data-popper-placement=bottom-end]{transform-origin:100% 0}.van-popover[data-popper-placement=bottom-end] .van-popover__arrow{right:var(--van-padding-md)}.van-popover--light{color:var(--van-popover-light-text-color)}.van-popover--light .van-popover__content{background:var(--van-popover-light-background);box-shadow:0 2px 12px rgba(50,50,51,.12)}.van-popover--light .van-popover__arrow{color:var(--van-popover-light-background)}.van-popover--light .van-popover__action:active{background-color:var(--van-active-color)}.van-popover--light .van-popover__action--disabled{color:var(--van-popover-light-action-disabled-text-color);cursor:not-allowed}.van-popover--light .van-popover__action--disabled:active{background-color:transparent}.van-popover--dark{color:var(--van-popover-dark-text-color)}.van-popover--dark .van-popover__content{background:var(--van-popover-dark-background)}.van-popover--dark .van-popover__arrow{color:var(--van-popover-dark-background)}.van-popover--dark .van-popover__action:active{background-color:rgba(0,0,0,.2)}.van-popover--dark .van-popover__action--disabled{color:var(--van-popover-dark-action-disabled-text-color)}.van-popover--dark .van-popover__action--disabled:active{background-color:transparent}.van-popover--dark .van-popover__action-text:after{border-color:var(--van-gray-7)}.van-popover-zoom-enter-from,.van-popover-zoom-leave-active{transform:scale(.8);opacity:0}.van-popover-zoom-enter-active{transition-timing-function:var(--van-ease-out)}.van-popover-zoom-leave-active{transition-timing-function:var(--van-ease-in)}
+:root{--van-popover-arrow-size: 6px;--van-popover-radius: var(--van-radius-lg);--van-popover-action-width: 128px;--van-popover-action-height: 44px;--van-popover-action-font-size: var(--van-font-size-md);--van-popover-action-line-height: var(--van-line-height-md);--van-popover-action-icon-size: 20px;--van-popover-light-text-color: var(--van-text-color);--van-popover-light-background: var(--van-background-2);--van-popover-light-action-disabled-text-color: var(--van-text-color-3);--van-popover-dark-text-color: var(--van-white);--van-popover-dark-background: #4a4a4a;--van-popover-dark-action-disabled-text-color: var(--van-text-color-2)}.van-popover{position:absolute;overflow:visible;background-color:transparent;transition:opacity .15s,transform .15s}.van-popover__wrapper{display:inline-block}.van-popover__arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;border-width:var(--van-popover-arrow-size)}.van-popover__content{overflow:hidden;border-radius:var(--van-popover-radius)}.van-popover__action{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--van-popover-action-width);height:var(--van-popover-action-height);padding:0 var(--van-padding-md);font-size:var(--van-popover-action-font-size);line-height:var(--van-line-height-md);cursor:pointer}.van-popover__action:last-child .van-popover__action-text:after{display:none}.van-popover__action-text{display:flex;flex:1;align-items:center;justify-content:center;height:100%}.van-popover__action-icon{margin-right:var(--van-padding-xs);font-size:var(--van-popover-action-icon-size)}.van-popover__action--with-icon .van-popover__action-text{justify-content:flex-start}.van-popover[data-popper-placement^=top] .van-popover__arrow{bottom:0;border-top-color:currentColor;border-bottom-width:0;transform:translate(-50%);margin-bottom:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=top]{transform-origin:50% 100%}.van-popover[data-popper-placement=top] .van-popover__arrow{left:50%}.van-popover[data-popper-placement=top-start]{transform-origin:0 100%}.van-popover[data-popper-placement=top-start] .van-popover__arrow{left:var(--van-padding-md)}.van-popover[data-popper-placement=top-end]{transform-origin:100% 100%}.van-popover[data-popper-placement=top-end] .van-popover__arrow{right:var(--van-padding-md)}.van-popover[data-popper-placement^=left] .van-popover__arrow{right:0;border-right-width:0;border-left-color:currentColor;transform:translateY(-50%);margin-right:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=left]{transform-origin:100% 50%}.van-popover[data-popper-placement=left] .van-popover__arrow{top:50%}.van-popover[data-popper-placement=left-start]{transform-origin:100% 0}.van-popover[data-popper-placement=left-start] .van-popover__arrow{top:var(--van-padding-md)}.van-popover[data-popper-placement=left-end]{transform-origin:100% 100%}.van-popover[data-popper-placement=left-end] .van-popover__arrow{bottom:var(--van-padding-md)}.van-popover[data-popper-placement^=right] .van-popover__arrow{left:0;border-right-color:currentColor;border-left-width:0;transform:translateY(-50%);margin-left:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=right]{transform-origin:0 50%}.van-popover[data-popper-placement=right] .van-popover__arrow{top:50%}.van-popover[data-popper-placement=right-start]{transform-origin:0 0}.van-popover[data-popper-placement=right-start] .van-popover__arrow{top:var(--van-padding-md)}.van-popover[data-popper-placement=right-end]{transform-origin:0 100%}.van-popover[data-popper-placement=right-end] .van-popover__arrow{bottom:var(--van-padding-md)}.van-popover[data-popper-placement^=bottom] .van-popover__arrow{top:0;border-top-width:0;border-bottom-color:currentColor;transform:translate(-50%);margin-top:calc(var(--van-popover-arrow-size) * -1)}.van-popover[data-popper-placement=bottom]{transform-origin:50% 0}.van-popover[data-popper-placement=bottom] .van-popover__arrow{left:50%}.van-popover[data-popper-placement=bottom-start]{transform-origin:0 0}.van-popover[data-popper-placement=bottom-start] .van-popover__arrow{left:var(--van-padding-md)}.van-popover[data-popper-placement=bottom-end]{transform-origin:100% 0}.van-popover[data-popper-placement=bottom-end] .van-popover__arrow{right:var(--van-padding-md)}.van-popover--light{color:var(--van-popover-light-text-color)}.van-popover--light .van-popover__content{background:var(--van-popover-light-background);box-shadow:0 2px 12px rgba(50,50,51,.12)}.van-popover--light .van-popover__arrow{color:var(--van-popover-light-background)}.van-popover--light .van-popover__action:active{background-color:var(--van-active-color)}.van-popover--light .van-popover__action--disabled{color:var(--van-popover-light-action-disabled-text-color);cursor:not-allowed}.van-popover--light .van-popover__action--disabled:active{background-color:transparent}.van-popover--dark{color:var(--van-popover-dark-text-color)}.van-popover--dark .van-popover__content{background:var(--van-popover-dark-background)}.van-popover--dark .van-popover__arrow{color:var(--van-popover-dark-background)}.van-popover--dark .van-popover__action:active{background-color:rgba(0,0,0,.2)}.van-popover--dark .van-popover__action--disabled{color:var(--van-popover-dark-action-disabled-text-color)}.van-popover--dark .van-popover__action--disabled:active{background-color:transparent}.van-popover--dark .van-popover__action-text:after{border-color:var(--van-gray-7)}.van-popover-zoom-enter-from,.van-popover-zoom-leave-active{transform:scale(.8);opacity:0}.van-popover-zoom-enter-active{transition-timing-function:var(--van-ease-out)}.van-popover-zoom-leave-active{transition-timing-function:var(--van-ease-in)}

package/es/popover/index.d.ts

@@ -111,6 +111,7 @@ export declare const Popover: import("../utils").WithInstall<import("vue").Defin
     placement: import("./types").PopoverPlacement;
 }>>;
 export default Popover;
+export { popoverProps } from './Popover';
 export type { PopoverProps } from './Popover';
 export type { PopoverTheme, PopoverAction, PopoverTrigger, PopoverPlacement, } from './types';
 declare module 'vue' {