zartui 3.1.23 → 3.1.25

package/es/loading/index.d.ts

@@ -1,4 +1,4 @@
-export declare const Loading: import("../utils").WithInstall<import("vue").DefineComponent<{
+export declare const Loading: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     size: (NumberConstructor | StringConstructor)[];
     type: {
         type: import("vue").PropType<import("./Loading").LoadingType>;
@@ -8,7 +8,7 @@ export declare const Loading: import("../utils").WithInstall<import("vue").Defin
     vertical: BooleanConstructor;
     textSize: (NumberConstructor | StringConstructor)[];
     textColor: StringConstructor;
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     size: (NumberConstructor | StringConstructor)[];
     type: {
         type: import("vue").PropType<import("./Loading").LoadingType>;
@@ -18,10 +18,10 @@ export declare const Loading: import("../utils").WithInstall<import("vue").Defin
     vertical: BooleanConstructor;
     textSize: (NumberConstructor | StringConstructor)[];
     textColor: StringConstructor;
-}>>, {
+}>> & Readonly<{}>, {
     type: import("./Loading").LoadingType;
     vertical: boolean;
-}, {}>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
 export default Loading;
 export type { LoadingType, LoadingProps } from './Loading';
 export type { LoadingThemeVars } from './types';

package/es/media-picker/MediaPicker.d.ts

@@ -1,5 +1,6 @@
 import { ExtractPropTypes, PropType } from 'vue';
 import type { Media, MediaAfterRead, MediaBeforeDelete, MediaBeforeRead, MediaPick, MediaPreview, MediaSizeType } from './type';
+import { MediaPlayerProps } from '../media-player';
 declare const mediaPickerProps: {
     disabled: BooleanConstructor;
     showTitle: BooleanConstructor;
@@ -77,9 +78,10 @@ declare const mediaPickerProps: {
         type: PropType<MediaSizeType>;
         default: MediaSizeType;
     };
+    mediaPlayerProps: PropType<Partial<MediaPlayerProps>>;
 };
 export type MediaPickerProps = ExtractPropTypes<typeof mediaPickerProps>;
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     disabled: BooleanConstructor;
     showTitle: BooleanConstructor;
     useFileNameAsLabel: BooleanConstructor;
@@ -156,7 +158,8 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<MediaSizeType>;
         default: MediaSizeType;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:mediaList")[], "delete" | "update:mediaList", import("vue").PublicProps, Readonly<ExtractPropTypes<{
+    mediaPlayerProps: PropType<Partial<MediaPlayerProps>>;
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:mediaList")[], "delete" | "update:mediaList", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     disabled: BooleanConstructor;
     showTitle: BooleanConstructor;
     useFileNameAsLabel: BooleanConstructor;
@@ -233,10 +236,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<MediaSizeType>;
         default: MediaSizeType;
     };
-}>> & {
+    mediaPlayerProps: PropType<Partial<MediaPlayerProps>>;
+}>> & Readonly<{
     onDelete?: ((...args: any[]) => any) | undefined;
     "onUpdate:mediaList"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     title: string;
     disabled: boolean;
     showTitle: boolean;
@@ -259,5 +263,5 @@ declare const _default: import("vue").DefineComponent<{
     allowPickFile: boolean;
     useWx: boolean;
     imageSizeType: MediaSizeType;
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/MediaPicker.mjs

@@ -1,4 +1,4 @@
-import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, mergeProps as _mergeProps, vShow as _vShow, withDirectives as _withDirectives } from "vue";
 import { createNamespace, isDef, isPromise, isWeixin, makeArrayProp, makeNumberProp, makeStringProp, truthProp } from "../utils/index.mjs";
 import { computed, defineComponent, ref } from "vue";
 import { showFailToast, showLoadingToast, closeToast } from "../toast/index.mjs";
@@ -75,7 +75,8 @@ const mediaPickerProps = {
   beforeDelete: Function,
   // 是否强制使用微信
   useWx: Boolean,
-  imageSizeType: makeStringProp("compressed")
+  imageSizeType: makeStringProp("compressed"),
+  mediaPlayerProps: Object
 };
 var stdin_default = defineComponent({
   name,
@@ -681,7 +682,8 @@ var stdin_default = defineComponent({
           images: imageList.value.map((image) => ({
             url: image.url || image.showSrc || ""
           })),
-          startPosition: imageIndex
+          startPosition: imageIndex,
+          closeable: true
         });
       } else if (media.type === "audio" || media.type === "video") {
         if (!media.file && !media.url) {
@@ -722,12 +724,12 @@ var stdin_default = defineComponent({
       const showButtons = props.allowTakePhoto || props.allowPickPhoto || props.allowTakeVideo || props.allowPickVideo || props.allowTakeAudio || props.allowPickAudio || props.allowPickFile;
       return _createVNode("div", {
         "class": bem()
-      }, [title, hiddenInput(), _createVNode(ZtMediaPlayer, {
+      }, [title, hiddenInput(), _createVNode(ZtMediaPlayer, _mergeProps({
         "show": mediaPlayerVisible.value,
         "onUpdate:show": ($event) => mediaPlayerVisible.value = $event,
         "mediaType": mediaTypeToPlay.value,
         "mediaUrl": mediaUrlToPlay.value
-      }, null), _createVNode(ZtActionSheet, {
+      }, props.mediaPlayerProps), null), _createVNode(ZtActionSheet, {
         "show": actionVisible.value,
         "onUpdate:show": ($event) => actionVisible.value = $event,
         "actions": actionOptions.value,

package/es/media-picker/image/DefaultAudioIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/DefaultAudioIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "DefaultAudioIcon",
   setup() {

package/es/media-picker/image/DefaultFileIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/DefaultFileIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "DefaultFileIcon",
   setup() {

package/es/media-picker/image/DefaultVideoIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/DefaultVideoIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "DefaultVideoIcon",
   setup() {

package/es/media-picker/image/DeleteIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/DeleteIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "DeleteIcon",
   setup() {

package/es/media-picker/image/PickFileIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/PickFileIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "PickFileIcon",
   setup() {

package/es/media-picker/image/PickPhotoIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/PickPhotoIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "PickPhotoIcon",
   setup() {

package/es/media-picker/image/TakeAudioIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/TakeAudioIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "TakeAudioIcon",
   setup() {

package/es/media-picker/image/TakePhotoIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/TakePhotoIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "TakePhotoIcon",
   setup() {

package/es/media-picker/image/TakeVideoIcon.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-picker/image/TakeVideoIcon.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
+import { defineComponent, createVNode as _createVNode } from "vue";
 var stdin_default = defineComponent({
   name: "TakeVideoIcon",
   setup() {

package/es/media-picker/index.css

@@ -1 +1 @@
-:root{--zt-media-picker-image-color: var(--zt-text-color);--zt-media-picker-button-background: linear-gradient(135deg, #e6ebf0 0%, #fff 100%, #fff 100%);--zt-media-picker-button-box-shadow: -4px -4px 8px 0 var(--zt-white), 4px 4px 8px 0 var(--zt-gray-a1);--zt-media-picker-button-border: 0;--zt-media-picker-button-active-border: 1px solid rgba(255, 255, 255, .75);--zt-media-picker-button-active-box-shadow: inset 4px 4px 8px 0 var(--zt-gray-a2);--zt-media-picker-line-height: 46px;--zt-media-picker-box-size: 48px;--zt-media-picker-icon-size: 32px;--zt-media-picker-title-height: 44px;--zt-media-picker-thumbnail-label-background: rgba(var(--zt-gray-rgb), .5);--zt-media-picker-thumbnail-label-color: var(--zt-white)}:root[zt-theme-size=large]{--zt-media-picker-line-height: 52px;--zt-media-picker-box-size: 54px;--zt-media-picker-icon-size: 38px;--zt-media-picker-title-height: 56px}.zt-media-picker__hidden{display:none}.zt-media-picker__title{position:relative;height:var(--zt-media-picker-title-height);line-height:var(--zt-media-picker-title-height);font-weight:700;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);padding:0 16px}.zt-media-picker__title:before{position:absolute;width:4px;height:16px;background:var(--zt-primary-color);left:0;top:14px;content:" "}.zt-media-picker__title:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-media-picker__line{width:100%;height:calc(var(--zt-media-picker-line-height) * 2);display:flex;align-items:center;overflow-x:auto}.zt-media-picker__line::-webkit-scrollbar{width:0;height:0}.zt-media-picker__line:after{content:" ";min-width:16px;height:10px}.zt-media-picker__box{width:var(--zt-media-picker-box-size);display:flex;flex-direction:column;align-items:center}.zt-media-picker__box:first-child{margin-left:16px}.zt-media-picker__box:not(:last-child){margin-right:24px}.zt-media-picker__button{display:flex;align-items:center;justify-content:center;width:var(--zt-media-picker-box-size);height:var(--zt-media-picker-box-size);background:var(--zt-media-picker-button-background);box-shadow:var(--zt-media-picker-button-box-shadow);border:var(--zt-media-picker-button-border);border-radius:8px;box-sizing:border-box}.zt-media-picker__button:active{background:var(--zt-gray-a04);border:var(--zt-media-picker-button-active-border);box-shadow:var(--zt-media-picker-button-active-box-shadow)}.zt-media-picker__icon{width:var(--zt-media-picker-icon-size);height:var(--zt-media-picker-icon-size);color:var(--zt-media-picker-image-color)}.zt-media-picker__label{margin-top:8px;font-size:var(--zt-font-size-sm);color:var(--zt-gray-a8);letter-spacing:0;text-align:center;line-height:var(--zt-line-height-sm);-webkit-user-select:none;user-select:none}.zt-media-picker__grid{padding:0 16px 8px!important}.zt-media-picker__delete{box-sizing:content-box;width:20px;height:20px;position:absolute;padding:4px;top:0;right:0}.zt-media-picker .zt-image{width:100%;height:100%}.zt-media-picker .zt-grid-item__content{padding:0}.zt-media-picker__thumbnail{width:100%;height:100%}.zt-media-picker__thumbnail-label{position:absolute;bottom:0;left:0;box-sizing:border-box;width:100%;height:var(--zt-line-height-lg);line-height:var(--zt-line-height-lg);padding:0 var(--zt-padding-xs);overflow:hidden;text-align:center;border-radius:0 0 4px 4px;font-size:var(--zt-font-size-sm);text-overflow:ellipsis;word-break:break-all;white-space:nowrap;color:var(--zt-media-picker-thumbnail-label-color);background-color:var(--zt-media-picker-thumbnail-label-background)}.zt-media-picker__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--zt-white);background-color:var(--zt-uploader-mask-background);border-radius:4px}.zt-media-picker__mask-icon{font-size:var(--zt-font-size-xxxl)}.zt-media-picker__mask-message{margin-top:6px;padding:0 var(--zt-padding-base);font-size:var(--zt-font-size-sm);line-height:var(--zt-uploader-mask-message-line-height)}.zt-media-picker__loading{width:var(--zt-uploader-loading-icon-size);height:var(--zt-uploader-loading-icon-size);color:var(--zt-uploader-icon-color)}.zt-theme-dark{--zt-media-picker-button-background: linear-gradient(135deg, #111c29 0%, #1d2c3e 100%, #1c2a3c 100%);--zt-media-picker-button-box-shadow: -4px -4px 8px 0 rgba(255, 255, 255, .08), 4px 4px 8px 0 rgba(0, 12, 24, .8);--zt-media-picker-button-border: 1px solid var(--zt-gray-a1);--zt-media-picker-button-active-border: 1px solid var(--zt-gray-a1);--zt-media-picker-button-active-box-shadow: inset 6px 6px 6px 0 #000d1b}
+:root{--zt-media-picker-image-color: var(--zt-text-color);--zt-media-picker-button-background: linear-gradient(135deg, #e6ebf0 0%, #fff 100%, #fff 100%);--zt-media-picker-button-box-shadow: -4px -4px 8px 0 var(--zt-white), 4px 4px 8px 0 var(--zt-gray-a1);--zt-media-picker-button-border: 0;--zt-media-picker-button-active-border: 1px solid rgba(255, 255, 255, .75);--zt-media-picker-button-active-box-shadow: inset 4px 4px 8px 0 var(--zt-gray-a2);--zt-media-picker-line-height: 46px;--zt-media-picker-box-size: 48px;--zt-media-picker-icon-size: 32px;--zt-media-picker-title-height: 44px;--zt-media-picker-thumbnail-label-background: rgba(var(--zt-gray-rgb), .5);--zt-media-picker-thumbnail-label-color: var(--zt-white)}:root[zt-theme-size=large]{--zt-media-picker-line-height: 52px;--zt-media-picker-box-size: 54px;--zt-media-picker-icon-size: 38px;--zt-media-picker-title-height: 56px}.zt-media-picker__hidden{display:none}.zt-media-picker__title{position:relative;height:var(--zt-media-picker-title-height);line-height:var(--zt-media-picker-title-height);font-weight:700;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);padding:0 16px}.zt-media-picker__title:before{position:absolute;width:4px;height:16px;background:var(--zt-primary-color);left:0;top:14px;content:" "}.zt-media-picker__title:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-media-picker__line{width:100%;height:calc(var(--zt-media-picker-line-height) * 2);display:flex;align-items:center;overflow-x:auto}.zt-media-picker__line::-webkit-scrollbar{width:0;height:0}.zt-media-picker__line:after{content:" ";min-width:16px;height:10px}.zt-media-picker__box{width:var(--zt-media-picker-box-size);display:flex;flex-direction:column;align-items:center}.zt-media-picker__box:first-child{margin-left:16px}.zt-media-picker__box:not(:last-child){margin-right:24px}.zt-media-picker__button{display:flex;align-items:center;justify-content:center;width:var(--zt-media-picker-box-size);height:var(--zt-media-picker-box-size);background:var(--zt-media-picker-button-background);box-shadow:var(--zt-media-picker-button-box-shadow);border:var(--zt-media-picker-button-border);border-radius:8px;box-sizing:border-box}.zt-media-picker__button:active{background:var(--zt-gray-a04);border:var(--zt-media-picker-button-active-border);box-shadow:var(--zt-media-picker-button-active-box-shadow)}.zt-media-picker__icon{width:var(--zt-media-picker-icon-size);height:var(--zt-media-picker-icon-size);color:var(--zt-media-picker-image-color)}.zt-media-picker__label{margin-top:8px;font-size:var(--zt-font-size-sm);color:var(--zt-gray-a8);letter-spacing:0;text-align:center;line-height:var(--zt-line-height-sm);-webkit-user-select:none;-moz-user-select:none;user-select:none}.zt-media-picker__grid{padding:0 16px 8px!important}.zt-media-picker__delete{box-sizing:content-box;width:20px;height:20px;position:absolute;padding:4px;top:0;right:0}.zt-media-picker .zt-image{width:100%;height:100%}.zt-media-picker .zt-grid-item__content{padding:0}.zt-media-picker__thumbnail{width:100%;height:100%}.zt-media-picker__thumbnail-label{position:absolute;bottom:0;left:0;box-sizing:border-box;width:100%;height:var(--zt-line-height-lg);line-height:var(--zt-line-height-lg);padding:0 var(--zt-padding-xs);overflow:hidden;text-align:center;border-radius:0 0 4px 4px;font-size:var(--zt-font-size-sm);text-overflow:ellipsis;word-break:break-all;white-space:nowrap;color:var(--zt-media-picker-thumbnail-label-color);background-color:var(--zt-media-picker-thumbnail-label-background)}.zt-media-picker__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--zt-white);background-color:var(--zt-uploader-mask-background);border-radius:4px}.zt-media-picker__mask-icon{font-size:var(--zt-font-size-xxxl)}.zt-media-picker__mask-message{margin-top:6px;padding:0 var(--zt-padding-base);font-size:var(--zt-font-size-sm);line-height:var(--zt-uploader-mask-message-line-height)}.zt-media-picker__loading{width:var(--zt-uploader-loading-icon-size);height:var(--zt-uploader-loading-icon-size);color:var(--zt-uploader-icon-color)}.zt-theme-dark{--zt-media-picker-button-background: linear-gradient(135deg, #111c29 0%, #1d2c3e 100%, #1c2a3c 100%);--zt-media-picker-button-box-shadow: -4px -4px 8px 0 rgba(255, 255, 255, .08), 4px 4px 8px 0 rgba(0, 12, 24, .8);--zt-media-picker-button-border: 1px solid var(--zt-gray-a1);--zt-media-picker-button-active-border: 1px solid var(--zt-gray-a1);--zt-media-picker-button-active-box-shadow: inset 6px 6px 6px 0 #000d1b}

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

@@ -1,4 +1,4 @@
-export declare const MediaPicker: import("../utils").WithInstall<import("vue").DefineComponent<{
+export declare const MediaPicker: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     disabled: BooleanConstructor;
     showTitle: BooleanConstructor;
     useFileNameAsLabel: BooleanConstructor;
@@ -65,7 +65,8 @@ export declare const MediaPicker: import("../utils").WithInstall<import("vue").D
         type: import("vue").PropType<import("./type").MediaSizeType>;
         default: import("./type").MediaSizeType;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:mediaList")[], "delete" | "update:mediaList", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    mediaPlayerProps: import("vue").PropType<Partial<import("..").MediaPlayerProps>>;
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:mediaList")[], "delete" | "update:mediaList", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     disabled: BooleanConstructor;
     showTitle: BooleanConstructor;
     useFileNameAsLabel: BooleanConstructor;
@@ -132,10 +133,11 @@ export declare const MediaPicker: import("../utils").WithInstall<import("vue").D
         type: import("vue").PropType<import("./type").MediaSizeType>;
         default: import("./type").MediaSizeType;
     };
-}>> & {
+    mediaPlayerProps: import("vue").PropType<Partial<import("..").MediaPlayerProps>>;
+}>> & Readonly<{
     onDelete?: ((...args: any[]) => any) | undefined;
     "onUpdate:mediaList"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     title: string;
     disabled: boolean;
     showTitle: boolean;
@@ -158,7 +160,7 @@ export declare const MediaPicker: import("../utils").WithInstall<import("vue").D
     allowPickFile: boolean;
     useWx: boolean;
     imageSizeType: import("./type").MediaSizeType;
-}, {}>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
 export default MediaPicker;
 export type { MediaPickerProps } from './MediaPicker';
 export type { Media, MediaType, MediaAddType, MediaUploadStatus, MediaPreview, MediaPick, MediaBeforeRead, MediaAfterRead, MediaBeforeDelete, MediaPickerThemeVars, MediaSizeType, } from './type';

package/es/media-player/MediaPlayer.d.ts

@@ -10,9 +10,14 @@ declare const mediaPlayerProps: {
         type: import("vue").PropType<string>;
         default: string;
     };
+    /** 视频播放时的控件展示列表，参考：https://wicg.github.io/controls-list/explainer.html */
+    controlsList: {
+        type: import("vue").PropType<string[]>;
+        default: () => string[];
+    };
 };
 export type MediaPlayerProps = ExtractPropTypes<typeof mediaPlayerProps>;
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     show: BooleanConstructor;
     mediaType: {
         type: import("vue").PropType<MediaType>;
@@ -22,7 +27,12 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<string>;
         default: string;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:show"[], "update:show", import("vue").PublicProps, Readonly<ExtractPropTypes<{
+    /** 视频播放时的控件展示列表，参考：https://wicg.github.io/controls-list/explainer.html */
+    controlsList: {
+        type: import("vue").PropType<string[]>;
+        default: () => string[];
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:show"[], "update:show", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     show: BooleanConstructor;
     mediaType: {
         type: import("vue").PropType<MediaType>;
@@ -32,11 +42,17 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<string>;
         default: string;
     };
-}>> & {
+    /** 视频播放时的控件展示列表，参考：https://wicg.github.io/controls-list/explainer.html */
+    controlsList: {
+        type: import("vue").PropType<string[]>;
+        default: () => string[];
+    };
+}>> & Readonly<{
     "onUpdate:show"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     show: boolean;
+    controlsList: string[];
     mediaType: MediaType;
     mediaUrl: string;
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/media-player/MediaPlayer.mjs

@@ -1,11 +1,13 @@
-import { createVNode as _createVNode, createTextVNode as _createTextVNode } from "vue";
-import { createNamespace, isIOS, isWeixin, makeStringProp } from "../utils/index.mjs";
+import { createTextVNode as _createTextVNode, createVNode as _createVNode } from "vue";
+import { createNamespace, isIOS, isWeixin, makeArrayProp, makeStringProp } from "../utils/index.mjs";
 import { defineComponent, nextTick, ref } from "vue";
 import ZtPopup from "../popup/index.mjs";
 const mediaPlayerProps = {
   show: Boolean,
   mediaType: makeStringProp("file"),
-  mediaUrl: makeStringProp("")
+  mediaUrl: makeStringProp(""),
+  /** 视频播放时的控件展示列表，参考：https://wicg.github.io/controls-list/explainer.html */
+  controlsList: makeArrayProp([])
 };
 const [name, bem] = createNamespace("media-player");
 var stdin_default = defineComponent({
@@ -63,6 +65,7 @@ var stdin_default = defineComponent({
             "src": props.mediaUrl,
             "ref": videoRef,
             "controls": true,
+            "controlslist": props.controlsList.join(" "),
             "autoplay": true,
             "id": "video",
             "webkit-playsinline": true,
@@ -74,6 +77,7 @@ var stdin_default = defineComponent({
             "src": props.mediaUrl,
             "ref": audioRef,
             "controls": true,
+            "controlslist": props.controlsList.join(" "),
             "autoplay": true,
             "id": "audio"
           }, [_createTextVNode("\u60A8\u7684\u6D4F\u89C8\u5668\u4E0D\u652F\u6301audio\u6807\u7B7E")]);

package/es/media-player/index.d.ts

@@ -1,4 +1,4 @@
-export declare const MediaPlayer: import("../utils").WithInstall<import("vue").DefineComponent<{
+export declare const MediaPlayer: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     show: BooleanConstructor;
     mediaType: {
         type: import("vue").PropType<import("..").MediaType>;
@@ -8,7 +8,11 @@ export declare const MediaPlayer: import("../utils").WithInstall<import("vue").D
         type: import("vue").PropType<string>;
         default: string;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:show"[], "update:show", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    controlsList: {
+        type: import("vue").PropType<string[]>;
+        default: () => string[];
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:show"[], "update:show", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     show: BooleanConstructor;
     mediaType: {
         type: import("vue").PropType<import("..").MediaType>;
@@ -18,13 +22,18 @@ export declare const MediaPlayer: import("../utils").WithInstall<import("vue").D
         type: import("vue").PropType<string>;
         default: string;
     };
-}>> & {
+    controlsList: {
+        type: import("vue").PropType<string[]>;
+        default: () => string[];
+    };
+}>> & Readonly<{
     "onUpdate:show"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     show: boolean;
+    controlsList: string[];
     mediaType: import("..").MediaType;
     mediaUrl: string;
-}, {}>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
 export default MediaPlayer;
 export type { MediaPlayerProps } from './MediaPlayer';
 declare module 'vue' {

package/es/multiple-picker/MultiplePicker.d.ts

@@ -62,7 +62,7 @@ declare const multiplePickerProps: {
     };
 };
 export type MultiplePickerProps = ExtractPropTypes<typeof multiplePickerProps>;
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
@@ -121,7 +121,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue")[], "cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue", import("vue").PublicProps, Readonly<ExtractPropTypes<{
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue")[], "cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
@@ -180,14 +180,14 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
-}>> & {
+}>> & Readonly<{
     onChange?: ((...args: any[]) => any) | undefined;
     onCancel?: ((...args: any[]) => any) | undefined;
     onConfirm?: ((...args: any[]) => any) | undefined;
     "onUpdate:showPicker"?: ((...args: any[]) => any) | undefined;
     "onUpdate:selectedIndex"?: ((...args: any[]) => any) | undefined;
     "onUpdate:selectedValue"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     readonly: boolean;
     closeOnClickOverlay: boolean;
     closeOnPopstate: boolean;
@@ -204,5 +204,5 @@ declare const _default: import("vue").DefineComponent<{
     toolbarPosition: string;
     selectedIndex: number[];
     selectedValue: Numeric[];
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/multiple-picker/MultiplePicker.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { ref, watch, computed, defineComponent } from "vue";
+import { ref, watch, computed, defineComponent, createVNode as _createVNode } from "vue";
 import { createNamespace, makeArrayProp, makeNumberProp, makeNumericProp, makeStringProp, truthProp } from "../utils/index.mjs";
 import { unitToPx } from "../utils/format.mjs";
 import { deepClone } from "../utils/deep-clone.mjs";

package/es/multiple-picker/MultiplePickerOptions.d.ts

@@ -24,7 +24,7 @@ declare const multiplePickerOptionsProps: {
     };
 };
 export type MultiplePickerOptionsProps = ExtractPropTypes<typeof multiplePickerOptionsProps>;
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     textKey: {
         type: import("vue").PropType<string>;
         default: string;
@@ -47,7 +47,7 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<number[]>;
         default: () => number[];
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:currentIndexes")[], "change" | "update:currentIndexes", import("vue").PublicProps, Readonly<ExtractPropTypes<{
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:currentIndexes")[], "change" | "update:currentIndexes", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     textKey: {
         type: import("vue").PropType<string>;
         default: string;
@@ -70,10 +70,10 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<number[]>;
         default: () => number[];
     };
-}>> & {
+}>> & Readonly<{
     onChange?: ((...args: any[]) => any) | undefined;
     "onUpdate:currentIndexes"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     readonly: boolean;
     allowHtml: boolean;
     textKey: string;
@@ -81,5 +81,5 @@ declare const _default: import("vue").DefineComponent<{
     columnCounts: number;
     initialOptions: object[];
     currentIndexes: number[];
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/multiple-picker/MultiplePickerOptions.mjs

@@ -1,5 +1,4 @@
-import { createVNode as _createVNode } from "vue";
-import { ref, defineComponent, reactive } from "vue";
+import { ref, defineComponent, reactive, createVNode as _createVNode } from "vue";
 import { createNamespace, isObject, makeArrayProp, makeNumberProp, makeStringProp } from "../utils/index.mjs";
 import { deepClone } from "../utils/deep-clone.mjs";
 import { useExpose } from "../composables/use-expose.mjs";

package/es/multiple-picker/index.css

@@ -1 +1 @@
-:root{--zt-multiple-picker-warpper-padding: 12px 16px 4px 16px;--zt-multiple-picker-option-text-color: var(--zt-gray-a6);--zt-multiple-picker-background-color: var(--zt-background-popup);--zt-multiple-picker-toolbar-height: 44px;--zt-multiple-picker-title-text-color: var(--zt-gray-a4);--zt-multiple-picker-title-padding: 12px 0;--zt-multiple-picker-item-padding: 0 4px 8px 0;--zt-multiple-picker-option-disabled-opacity: var(--zt-disabled-opacity);--zt-multiple-picker-option-disabled-background: var(--zt-gray-a04);--zt-multiple-picker-max-height: 84vh;--zt-multiple-picker-loading-icon-color: var(--zt-primary-color);--zt-multiple-picker-loading-mask-color: var(--zt-picker-loading-mask-color);--zt-multiple-picker-toolbar-padding: 8px 16px;--zt-multiple-picker-ellipsis-border: 1px solid var(--zt-gray-a2);--zt-multiple-picker-ellipsis-border-selected: 1px solid var(--zt-blue-a6);--zt-multiple-picker-title-background: var(--zt-background-popup);--zt-multiple-picker-ellipsis-height: 38px}:root[zt-theme-size=large]{--zt-multiple-picker-ellipsis-height: 50px}.zt-multiple-picker{display:flex;flex-direction:column;justify-content:space-between;position:relative;background-color:var(--zt-multiple-picker-background-color);-webkit-user-select:none;user-select:none;max-height:var(--zt-multiple-picker-max-height)}.zt-multiple-picker__toolbar{display:flex;align-items:center;justify-content:space-between;box-sizing:content-box;flex-shrink:0;background:var(--zt-multiple-picker-title-background);height:var(--zt-multiple-picker-toolbar-height);padding:var(--zt-multiple-picker-toolbar-padding)}.zt-multiple-picker__title{flex-shrink:0;font-weight:var(--zt-multiple-picker-cancel-action-font-weight);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center;background:var(--zt-multiple-picker-title-background);color:var(--zt-multiple-picker-title-text-color);padding:var(--zt-multiple-picker-title-padding)}.zt-multiple-picker__options{position:relative;display:flex;cursor:-webkit-grab;cursor:grab;overflow-y:scroll}.zt-multiple-picker__options:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-multiple-picker__options:before{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:0;right:0;left:0;border-top:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-multiple-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(--zt-multiple-picker-loading-icon-color);background-color:var(--zt-multiple-picker-loading-mask-color)}.zt-multiple-picker-options{flex:1;overflow-y:scroll;font-size:var(--zt-font-size-md);margin:0;outline:0 none;padding:0}.zt-multiple-picker-options__wrapper{display:flex;flex-wrap:wrap;background-color:var(--zt-multiple-picker-background-color);padding:var(--zt-multiple-picker-warpper-padding)}.zt-multiple-picker-options__item{color:var(--zt-multiple-picker-option-text-color);padding:var(--zt-multiple-picker-item-padding);box-sizing:border-box;text-align:center;font-size:var(--zt-font-size-md)}.zt-multiple-picker-options__item .zt-ellipsis{height:var(--zt-multiple-picker-ellipsis-height);line-height:var(--zt-multiple-picker-ellipsis-height);border-radius:calc(var(--zt-multiple-picker-ellipsis-height) / 2);border:var(--zt-multiple-picker-ellipsis-border);padding:0 var(--zt-padding-md)}.zt-multiple-picker-options__item:active{opacity:var(--zt-active-opacity)}.zt-multiple-picker-options__item--disabled{cursor:not-allowed;color:var(--zt-gray-a2)}.zt-multiple-picker-options__item--disabled .zt-ellipsis{background:var(--zt-multiple-picker-option-disabled-background);border:0}.zt-multiple-picker-options__item--last{padding-right:0}.zt-multiple-picker-options__item--selected{color:var(--zt-primary-color)}.zt-multiple-picker-options__item--selected .zt-ellipsis{background:var(--zt-primary-color-a1);border:var(--zt-multiple-picker-ellipsis-border-selected)}.zt-multiple-picker-options__item--disabled-selected{cursor:not-allowed;color:var(--zt-gray)!important}.zt-multiple-picker-options__item--disabled-selected .zt-ellipsis{background:var(--zt-picker-option-disabled-background)!important;border:0!important}
+:root{--zt-multiple-picker-warpper-padding: 12px 16px 4px 16px;--zt-multiple-picker-option-text-color: var(--zt-gray-a6);--zt-multiple-picker-background-color: var(--zt-background-popup);--zt-multiple-picker-toolbar-height: 44px;--zt-multiple-picker-title-text-color: var(--zt-gray-a4);--zt-multiple-picker-title-padding: 12px 0;--zt-multiple-picker-item-padding: 0 4px 8px 0;--zt-multiple-picker-option-disabled-opacity: var(--zt-disabled-opacity);--zt-multiple-picker-option-disabled-background: var(--zt-gray-a04);--zt-multiple-picker-max-height: 84vh;--zt-multiple-picker-loading-icon-color: var(--zt-primary-color);--zt-multiple-picker-loading-mask-color: var(--zt-picker-loading-mask-color);--zt-multiple-picker-toolbar-padding: 8px 16px;--zt-multiple-picker-ellipsis-border: 1px solid var(--zt-gray-a2);--zt-multiple-picker-ellipsis-border-selected: 1px solid var(--zt-blue-a6);--zt-multiple-picker-title-background: var(--zt-background-popup);--zt-multiple-picker-ellipsis-height: 38px}:root[zt-theme-size=large]{--zt-multiple-picker-ellipsis-height: 50px}.zt-multiple-picker{display:flex;flex-direction:column;justify-content:space-between;position:relative;background-color:var(--zt-multiple-picker-background-color);-webkit-user-select:none;-moz-user-select:none;user-select:none;max-height:var(--zt-multiple-picker-max-height)}.zt-multiple-picker__toolbar{display:flex;align-items:center;justify-content:space-between;box-sizing:content-box;flex-shrink:0;background:var(--zt-multiple-picker-title-background);height:var(--zt-multiple-picker-toolbar-height);padding:var(--zt-multiple-picker-toolbar-padding)}.zt-multiple-picker__title{flex-shrink:0;font-weight:var(--zt-multiple-picker-cancel-action-font-weight);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center;background:var(--zt-multiple-picker-title-background);color:var(--zt-multiple-picker-title-text-color);padding:var(--zt-multiple-picker-title-padding)}.zt-multiple-picker__options{position:relative;display:flex;cursor:grab;overflow-y:scroll}.zt-multiple-picker__options:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-multiple-picker__options:before{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:0;right:0;left:0;border-top:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-multiple-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(--zt-multiple-picker-loading-icon-color);background-color:var(--zt-multiple-picker-loading-mask-color)}.zt-multiple-picker-options{flex:1;overflow-y:scroll;font-size:var(--zt-font-size-md);margin:0;outline:0 none;padding:0}.zt-multiple-picker-options__wrapper{display:flex;flex-wrap:wrap;background-color:var(--zt-multiple-picker-background-color);padding:var(--zt-multiple-picker-warpper-padding)}.zt-multiple-picker-options__item{color:var(--zt-multiple-picker-option-text-color);padding:var(--zt-multiple-picker-item-padding);box-sizing:border-box;text-align:center;font-size:var(--zt-font-size-md)}.zt-multiple-picker-options__item .zt-ellipsis{height:var(--zt-multiple-picker-ellipsis-height);line-height:var(--zt-multiple-picker-ellipsis-height);border-radius:calc(var(--zt-multiple-picker-ellipsis-height) / 2);border:var(--zt-multiple-picker-ellipsis-border);padding:0 var(--zt-padding-md)}.zt-multiple-picker-options__item:active{opacity:var(--zt-active-opacity)}.zt-multiple-picker-options__item--disabled{cursor:not-allowed;color:var(--zt-gray-a2)}.zt-multiple-picker-options__item--disabled .zt-ellipsis{background:var(--zt-multiple-picker-option-disabled-background);border:0}.zt-multiple-picker-options__item--last{padding-right:0}.zt-multiple-picker-options__item--selected{color:var(--zt-primary-color)}.zt-multiple-picker-options__item--selected .zt-ellipsis{background:var(--zt-primary-color-a1);border:var(--zt-multiple-picker-ellipsis-border-selected)}.zt-multiple-picker-options__item--disabled-selected{cursor:not-allowed;color:var(--zt-gray)!important}.zt-multiple-picker-options__item--disabled-selected .zt-ellipsis{background:var(--zt-picker-option-disabled-background)!important;border:0!important}

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

@@ -1,6 +1,6 @@
 import { MultiplePickerProps } from './MultiplePicker';
 export type { MultiplePickerThemeVars } from './types';
-export declare const MultiplePicker: import("../utils").WithInstall<import("vue").DefineComponent<{
+export declare const MultiplePicker: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
@@ -59,7 +59,7 @@ export declare const MultiplePicker: import("../utils").WithInstall<import("vue"
         type: BooleanConstructor;
         default: true;
     };
-}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue")[], "cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue")[], "cancel" | "change" | "confirm" | "update:showPicker" | "update:selectedIndex" | "update:selectedValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     title: StringConstructor;
     loading: BooleanConstructor;
     readonly: BooleanConstructor;
@@ -118,14 +118,14 @@ export declare const MultiplePicker: import("../utils").WithInstall<import("vue"
         type: BooleanConstructor;
         default: true;
     };
-}>> & {
+}>> & Readonly<{
     onChange?: ((...args: any[]) => any) | undefined;
     onCancel?: ((...args: any[]) => any) | undefined;
     onConfirm?: ((...args: any[]) => any) | undefined;
     "onUpdate:showPicker"?: ((...args: any[]) => any) | undefined;
     "onUpdate:selectedIndex"?: ((...args: any[]) => any) | undefined;
     "onUpdate:selectedValue"?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
     readonly: boolean;
     closeOnClickOverlay: boolean;
     closeOnPopstate: boolean;
@@ -142,7 +142,7 @@ export declare const MultiplePicker: import("../utils").WithInstall<import("vue"
     toolbarPosition: string;
     selectedIndex: number[];
     selectedValue: import("../utils").Numeric[];
-}, {}>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
 export default MultiplePicker;
 export type { MultiplePickerProps };
 declare module 'vue' {