zartui 3.1.2 → 3.1.4

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

@@ -0,0 +1,136 @@
+import { RadioPickerProps } from './RadioPicker';
+export declare const RadioPicker: import("../utils").WithInstall<import("vue").DefineComponent<{
+    loading: BooleanConstructor;
+    readonly: BooleanConstructor;
+    allowHtml: BooleanConstructor;
+    showToolbar: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    showTitle: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    swipeDuration: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    title: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+} & {
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+} & {
+    columns: {
+        type: import("vue").PropType<(import("./types").PickerColumn | import("./types").RadioPickerOption)[]>;
+        default: () => (import("./types").PickerColumn | import("./types").RadioPickerOption)[];
+    };
+    modelValue: {
+        type: import("vue").PropType<import("../utils").Numeric[]>;
+        default: () => import("../utils").Numeric[];
+    };
+    columnsFieldNames: import("vue").PropType<import("./types").PickerFieldNames>;
+    wrapHeight: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    showPicker: BooleanConstructor;
+    popup: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    searchable: BooleanConstructor;
+    autoSearch: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    searchPlaceholder: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "cancel" | "change" | "confirm" | "clickOption" | "update:showPicker")[], "update:modelValue" | "cancel" | "change" | "confirm" | "clickOption" | "update:showPicker", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    loading: BooleanConstructor;
+    readonly: BooleanConstructor;
+    allowHtml: BooleanConstructor;
+    showToolbar: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    showTitle: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    swipeDuration: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    title: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+} & {
+    cancelButtonText: StringConstructor;
+    confirmButtonText: StringConstructor;
+} & {
+    columns: {
+        type: import("vue").PropType<(import("./types").PickerColumn | import("./types").RadioPickerOption)[]>;
+        default: () => (import("./types").PickerColumn | import("./types").RadioPickerOption)[];
+    };
+    modelValue: {
+        type: import("vue").PropType<import("../utils").Numeric[]>;
+        default: () => import("../utils").Numeric[];
+    };
+    columnsFieldNames: import("vue").PropType<import("./types").PickerFieldNames>;
+    wrapHeight: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    showPicker: BooleanConstructor;
+    popup: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    searchable: BooleanConstructor;
+    autoSearch: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    searchPlaceholder: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onCancel?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+    onClickOption?: ((...args: any[]) => any) | undefined;
+    "onUpdate:showPicker"?: ((...args: any[]) => any) | undefined;
+}, {
+    title: string;
+    modelValue: import("../utils").Numeric[];
+    readonly: boolean;
+    popup: boolean;
+    loading: boolean;
+    showTitle: boolean;
+    columns: (import("./types").PickerColumn | import("./types").RadioPickerOption)[];
+    allowHtml: boolean;
+    showToolbar: boolean;
+    swipeDuration: string | number;
+    showPicker: boolean;
+    wrapHeight: string | number;
+    searchable: boolean;
+    autoSearch: boolean;
+    searchPlaceholder: string;
+}, {}>>;
+export default RadioPicker;
+export { radioPickerProps } from './RadioPicker';
+export type { PickerCancelEventParams as RadioPickerCancelEventParams, PickerChangeEventParams as RadioPickerChangeEventParams, PickerColumn as RadioPickerColumn, PickerConfirmEventParams as RadioPickerConfirmEventParams, PickerFieldNames as RadioPickerFieldNames, RadioPickerInstance, RadioPickerOption, PickerToolbarPosition as RadioPickerToolbarPosition, } from './types';
+export type { RadioPickerProps };
+declare module 'vue' {
+    interface GlobalComponents {
+        ZtRadioPicker: typeof RadioPicker;
+    }
+}

package/es/radio-picker/index.mjs

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

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

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

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

@@ -0,0 +1,16 @@
+import "../../style/base.css";
+import "../../badge/index.css";
+import "../../icon/index.css";
+import "../../cell/index.css";
+import "../../field/index.css";
+import "../../search/index.css";
+import "../../overlay/index.css";
+import "../../popup/index.css";
+import "../../loading/index.css";
+import "../../button/index.css";
+import "../../divider/index.css";
+import "../../checkbox/index.css";
+import "../../empty/index.css";
+import "../../radio-group/index.css";
+import "../../radio/index.css";
+import "../index.css";

package/es/radio-picker/types.d.ts

@@ -0,0 +1,44 @@
+import type { ComponentPublicInstance } from 'vue';
+import type { Numeric } from '../utils';
+import type { RadioPickerProps } from './RadioPicker';
+export type PickerToolbarPosition = 'top' | 'bottom';
+export type PickerFieldNames = {
+    text?: string;
+    value?: string;
+    children?: string;
+};
+export type RadioPickerOption = {
+    text?: Numeric;
+    value?: Numeric;
+    disabled?: boolean;
+    children?: PickerColumn;
+    className?: unknown;
+    [key: PropertyKey]: any;
+};
+export type PickerColumn = RadioPickerOption[];
+export type PickerExpose = {
+    confirm: () => void;
+    getSelectedOptions: () => Array<RadioPickerOption | undefined>;
+};
+export type PickerColumnProvide = {
+    state: {
+        index: number;
+        offset: number;
+        duration: number;
+        options: RadioPickerOption[];
+    };
+    setIndex: (index: number, emitChange?: boolean | undefined) => void;
+    getValue: () => RadioPickerOption;
+    setValue: (value: string) => void;
+    setOptions: (options: RadioPickerOption[]) => void;
+    stopMomentum: () => void;
+};
+export type RadioPickerInstance = ComponentPublicInstance<RadioPickerProps, PickerExpose>;
+export type PickerConfirmEventParams = {
+    selectedValues: Numeric[];
+    selectedOptions: Array<RadioPickerOption | undefined>;
+};
+export type PickerCancelEventParams = PickerConfirmEventParams;
+export type PickerChangeEventParams = PickerConfirmEventParams & {
+    columnIndex: number;
+};

package/es/radio-picker/utils.d.ts

@@ -0,0 +1,13 @@
+import type { Ref } from 'vue';
+import type { Numeric } from '../utils';
+import type { PickerColumn, PickerFieldNames, RadioPickerOption } 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 { bem, name, t };
+export declare const getFirstEnabledOption: (options: RadioPickerOption[]) => RadioPickerOption | undefined;
+export declare function getColumnsType(columns: PickerColumn | PickerColumn[], fields: Required<PickerFieldNames>): "default" | "multiple" | "cascade";
+export declare function findIndexOfEnabledOption(options: RadioPickerOption[], index: number): number;
+export declare const isOptionExist: (options: RadioPickerOption[], value: Numeric | undefined, fields: Required<PickerFieldNames>) => boolean;
+export declare function findOptionByValue(options: RadioPickerOption[], value: Numeric, fields: Required<PickerFieldNames>): RadioPickerOption | undefined;
+export declare function formatCascadeColumns(columns: PickerColumn | PickerColumn[], fields: Required<PickerFieldNames>, selectedValues: Ref<Numeric[]>): PickerColumn[];
+export declare function getElementTranslateY(element: Element): number;
+export declare function assignDefaultFields(fields: PickerFieldNames | undefined): Required<PickerFieldNames>;

package/es/radio-picker/utils.mjs

@@ -0,0 +1,80 @@
+import { clamp, createNamespace, extend, isDef } from "../utils/index.mjs";
+const [name, bem, t] = createNamespace("radio-picker");
+const getFirstEnabledOption = (options) => options.find((option) => !option.disabled) || options[0];
+function getColumnsType(columns, fields) {
+  const firstColumn = columns[0];
+  if (firstColumn) {
+    if (Array.isArray(firstColumn)) {
+      return "multiple";
+    }
+    if (fields.children in firstColumn) {
+      return "cascade";
+    }
+  }
+  return "default";
+}
+function findIndexOfEnabledOption(options, index) {
+  index = clamp(index, 0, options.length);
+  for (let i = index; i < options.length; i++) {
+    if (!options[i].disabled)
+      return i;
+  }
+  for (let i = index - 1; i >= 0; i--) {
+    if (!options[i].disabled)
+      return i;
+  }
+  return 0;
+}
+const isOptionExist = (options, value, fields) => value !== void 0 && !!options.find((option) => option[fields.value] === value);
+function findOptionByValue(options, value, fields) {
+  const index = options.findIndex((option) => option[fields.value] === value);
+  const enabledIndex = findIndexOfEnabledOption(options, index);
+  return options[enabledIndex];
+}
+function formatCascadeColumns(columns, fields, selectedValues) {
+  const formatted = [];
+  let cursor = {
+    [fields.children]: columns
+  };
+  let columnIndex = 0;
+  while (cursor && cursor[fields.children]) {
+    const options = cursor[fields.children];
+    const value = selectedValues.value[columnIndex];
+    cursor = isDef(value) ? findOptionByValue(options, value, fields) : void 0;
+    if (!cursor && options.length) {
+      const firstValue = getFirstEnabledOption(options)[fields.value];
+      cursor = findOptionByValue(options, firstValue, fields);
+    }
+    columnIndex++;
+    formatted.push(options);
+  }
+  return formatted;
+}
+function getElementTranslateY(element) {
+  const { transform } = window.getComputedStyle(element);
+  const translateY = transform.slice(7, transform.length - 1).split(", ")[5];
+  return Number(translateY);
+}
+function assignDefaultFields(fields) {
+  return extend(
+    {
+      text: "text",
+      value: "value",
+      children: "children"
+    },
+    fields
+  );
+}
+export {
+  assignDefaultFields,
+  bem,
+  findIndexOfEnabledOption,
+  findOptionByValue,
+  formatCascadeColumns,
+  getColumnsType,
+  getElementTranslateY,
+  getFirstEnabledOption,
+  isOptionExist,
+  name,
+  t
+};

package/es/utils/debounce.d.ts

@@ -0,0 +1,46 @@
+import { Ref } from 'vue';
+export interface FunctionWrapperOptions<Args extends any[] = any[], This = any> {
+    fn: FunctionArgs<Args, This>;
+    args: Args;
+    thisArg: This;
+}
+export type EventFilter<Args extends any[] = any[], This = any, Invoke extends AnyFn = AnyFn> = (invoke: Invoke, options: FunctionWrapperOptions<Args, This>) => ReturnType<Invoke> | Promise<ReturnType<Invoke>>;
+export type AnyFn = (...args: any[]) => any;
+export type MaybeRef<T> = T | Ref<T>;
+export type FunctionArgs<Args extends any[] = any[], Return = void> = (...args: Args) => Return;
+export type MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);
+export type ArgumentsType<T> = T extends (...args: infer U) => any ? U : never;
+export type PromisifyFn<T extends AnyFn> = (...args: ArgumentsType<T>) => Promise<ReturnType<T>>;
+export interface DebounceFilterOptions {
+    /**
+     * The maximum time allowed to be delayed before it's invoked.
+     * In milliseconds.
+     */
+    maxWait?: MaybeRefOrGetter<number>;
+    /**
+     * Whether to reject the last call if it's been cancel.
+     *
+     * @default false
+     */
+    rejectOnCancel?: boolean;
+}
+/**
+ * Get the value of value/ref/getter.
+ */
+export declare function toValue<T>(r: MaybeRefOrGetter<T>): T;
+/**
+ * Create an EventFilter that debounce the events
+ */
+export declare function debounceFilter(ms: MaybeRefOrGetter<number>, options?: DebounceFilterOptions): EventFilter<any[], any, AnyFn>;
+export declare function createFilterWrapper<T extends AnyFn>(filter: EventFilter, fn: T): (this: any, ...args: ArgumentsType<T>) => Promise<ReturnType<T>>;
+/**
+ * Debounce execution of a function.
+ *
+ * @see https://vueuse.org/useDebounceFn
+ * @param  fn          A function to be executed after delay milliseconds debounced.
+ * @param  ms          A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
+ * @param  opts        options
+ *
+ * @return A new, debounce, function.
+ */
+export declare function useDebounceFn<T extends FunctionArgs>(fn: T, ms?: MaybeRefOrGetter<number>, options?: DebounceFilterOptions): PromisifyFn<T>;

package/es/utils/debounce.mjs

@@ -0,0 +1,65 @@
+import { unref } from "vue";
+import { noop } from "../utils/index.mjs";
+function toValue(r) {
+  return typeof r === "function" ? r() : unref(r);
+}
+function debounceFilter(ms, options = {}) {
+  let timer;
+  let maxTimer;
+  let lastRejector = noop;
+  const _clearTimeout = (timer2) => {
+    clearTimeout(timer2);
+    lastRejector();
+    lastRejector = noop;
+  };
+  const filter = (invoke) => {
+    const duration = toValue(ms);
+    const maxDuration = toValue(options.maxWait);
+    if (timer)
+      _clearTimeout(timer);
+    if (duration <= 0 || maxDuration !== void 0 && maxDuration <= 0) {
+      if (maxTimer) {
+        _clearTimeout(maxTimer);
+        maxTimer = null;
+      }
+      return Promise.resolve(invoke());
+    }
+    return new Promise((resolve, reject) => {
+      lastRejector = options.rejectOnCancel ? reject : resolve;
+      if (maxDuration && !maxTimer) {
+        maxTimer = setTimeout(() => {
+          if (timer)
+            _clearTimeout(timer);
+          maxTimer = null;
+          resolve(invoke());
+        }, maxDuration);
+      }
+      timer = setTimeout(() => {
+        if (maxTimer)
+          _clearTimeout(maxTimer);
+        maxTimer = null;
+        resolve(invoke());
+      }, duration);
+    });
+  };
+  return filter;
+}
+function createFilterWrapper(filter, fn) {
+  function wrapper(...args) {
+    return new Promise((resolve, reject) => {
+      Promise.resolve(
+        filter(() => fn.apply(this, args), { fn, thisArg: this, args })
+      ).then(resolve).catch(reject);
+    });
+  }
+  return wrapper;
+}
+function useDebounceFn(fn, ms = 200, options = {}) {
+  return createFilterWrapper(debounceFilter(ms, options), fn);
+}
+export {
+  createFilterWrapper,
+  debounceFilter,
+  toValue,
+  useDebounceFn
+};

package/es/vue-sfc-shim.d.ts

@@ -1,6 +1,6 @@
-declare module '*.vue' {
-  // eslint-disable-next-line
-  import { DefineComponent } from 'vue';
-  const Component: DefineComponent;
-  export default Component;
-}
+declare module '*.vue' {
+  // eslint-disable-next-line
+  import { DefineComponent } from 'vue';
+  const Component: DefineComponent;
+  export default Component;
+}

package/es/vue-tsx-shim.d.ts

@@ -1,23 +1,23 @@
-import 'vue';
-
-type EventHandler = (...args: any[]) => void;
-
-declare module 'vue' {
-  interface ComponentCustomProps {
-    id?: string;
-    role?: string;
-    tabindex?: number;
-    onClick?: EventHandler;
-    onTouchend?: EventHandler;
-    onTouchmove?: EventHandler;
-    onTouchstart?: EventHandler;
-    onTouchcancel?: EventHandler;
-    onTouchmovePassive?: EventHandler;
-    onTouchstartPassive?: EventHandler;
-  }
-
-  interface HTMLAttributes {
-    onTouchmovePassive?: EventHandler;
-    onTouchstartPassive?: EventHandler;
-  }
-}
+import 'vue';
+
+type EventHandler = (...args: any[]) => void;
+
+declare module 'vue' {
+  interface ComponentCustomProps {
+    id?: string;
+    role?: string;
+    tabindex?: number;
+    onClick?: EventHandler;
+    onTouchend?: EventHandler;
+    onTouchmove?: EventHandler;
+    onTouchstart?: EventHandler;
+    onTouchcancel?: EventHandler;
+    onTouchmovePassive?: EventHandler;
+    onTouchstartPassive?: EventHandler;
+  }
+
+  interface HTMLAttributes {
+    onTouchmovePassive?: EventHandler;
+    onTouchstartPassive?: EventHandler;
+  }
+}

package/lib/cascader/index.css

@@ -1 +1 @@
-:root{--zt-cascader-header-height: 44px;--zt-cascader-header-padding: 0 var(--zt-padding-sm);--zt-cascader-title-font-size: var(--zt-font-size-md);--zt-cascader-title-line-height: 44px;--zt-cascader-title-color: var(--zt-gray-a4);--zt-cascader-close-icon-size: 24px;--zt-cascader-close-icon-color: var(--zt-gray-5);--zt-cascader-selected-icon-size: 18px;--zt-cascader-tabs-height: 44px;--zt-cascader-active-color: var(--zt-primary-color);--zt-cascader-height: 75vh;--zt-cascader-option-disabled-color: var(--zt-text-color-3);--zt-cascader-tab-color: var(--zt-text-color);--zt-cascader-unselected-tab-color: var(--zt-gray-a4);--zt-cascader-tabs-margin: 0 8px;--zt-cascader-tabs-padding: 8px;--zt-cascader-tabs-line-height: 44px;--zt-cascader-option-disabled-active-color: rgba(0, 0, 0, .04);--zt-cascader-cancel-margin: 8px 16px;--zt-cascader-cancel-background: rgba(45, 75, 115, .04);--zt-cascader-cancel-width:calc(100% - 32px);--zt-cascader-cancel-border-radius: 20.5px}.zt-cascader{display:flex;justify-content:space-between;flex-direction:column;height:var(--zt-cascader-height)}.zt-cascader__header{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--zt-cascader-header-height);padding:var(--zt-cascader-header-padding)}.zt-cascader__title{font-size:var(--zt-cascader-title-font-size);line-height:var(--zt-cascader-title-line-height);color:var(--zt-cascader-title-color)}.zt-cascader__close-icon{color:var(--zt-cascader-close-icon-color);font-size:var(--zt-cascader-close-icon-size)}.zt-cascader__tabs{flex:1}.zt-cascader__tabs .zt-tab{flex:none;margin:var(--zt-cascader-tabs-margin);padding:0}.zt-cascader__tabs .zt-tabs__wrap{position:relative;height:var(--zt-cascader-tabs-height)}.zt-cascader__tabs .zt-tabs__wrap: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-cascader__tabs .zt-tabs__nav--complete{padding-right:var(--zt-cascader-tabs-padding);padding-left:var(--zt-cascader-tabs-padding)}.zt-cascader__tab{color:var(--zt-cascader-tab-color);font-weight:var(--zt-font-bold);line-height:var(--zt-cascader-tabs-line-height);font-size:var(--zt-font-size-md)}.zt-cascader__tab--unselected{color:var(--zt-cascader-unselected-tab-color);font-weight:400}.zt-cascader__option{display:flex;align-items:center;justify-content:space-between;color:var(--zt-text-color);padding:0 var(--zt-padding-md);font-size:var(--zt-font-size-md);line-height:var(--zt-cascader-tabs-line-height);cursor:pointer;font-weight:400}.zt-cascader__option:active{background-color:var(--zt-active-color)}.zt-cascader__option--selected{color:var(--zt-cascader-active-color);font-weight:var(--zt-font-bold)}.zt-cascader__option--disabled{color:var(--zt-cascader-option-disabled-color);cursor:not-allowed}.zt-cascader__option--disabled:active{background-color:var(--zt-cascader-option-disabled-active-color)}.zt-cascader__selected-icon{font-size:var(--zt-cascader-selected-icon-size)}.zt-cascader__options{box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-cascader .zt-tabs__nav{background:var(--zt-background-2)}.zt-cascader__cancel{margin:var(--zt-cascader-cancel-margin);width:var(--zt-cascader-cancel-width);background:var(--zt-cascader-cancel-background);border-radius:var(--zt-cascader-cancel-border-radius);color:var(--zt-text-color);border:0}.zt-theme-dark{--zt-cascader-cancel-background: var(--zt-background-card)}
+:root{--zt-cascader-header-height: 44px;--zt-cascader-header-padding: 0 var(--zt-padding-sm);--zt-cascader-title-font-size: var(--zt-font-size-md);--zt-cascader-title-line-height: 44px;--zt-cascader-title-color: var(--zt-gray-a4);--zt-cascader-close-icon-size: 24px;--zt-cascader-close-icon-color: var(--zt-gray-5);--zt-cascader-selected-icon-size: 18px;--zt-cascader-tabs-height: 44px;--zt-cascader-active-color: var(--zt-primary-color);--zt-cascader-height: 75vh;--zt-cascader-option-disabled-color: var(--zt-text-color-3);--zt-cascader-tab-color: var(--zt-text-color);--zt-cascader-unselected-tab-color: var(--zt-gray-a4);--zt-cascader-tabs-margin: 0 8px;--zt-cascader-tabs-padding: 8px;--zt-cascader-tabs-line-height: 44px;--zt-cascader-option-disabled-active-color: rgba(0, 0, 0, .04);--zt-cascader-cancel-margin: 8px 16px;--zt-cascader-cancel-background: rgba(45, 75, 115, .04);--zt-cascader-cancel-width:calc(100% - 32px);--zt-cascader-cancel-border-radius: 20.5px}.zt-cascader{display:flex;justify-content:space-between;flex-direction:column;height:var(--zt-cascader-height)}.zt-cascader__header{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--zt-cascader-header-height);padding:var(--zt-cascader-header-padding)}.zt-cascader__title{font-size:var(--zt-cascader-title-font-size);line-height:var(--zt-cascader-title-line-height);color:var(--zt-cascader-title-color)}.zt-cascader__close-icon{color:var(--zt-cascader-close-icon-color);font-size:var(--zt-cascader-close-icon-size)}.zt-cascader__tabs{flex:1;min-height:0}.zt-cascader__tabs .zt-tab{flex:none;margin:var(--zt-cascader-tabs-margin);padding:0}.zt-cascader__tabs .zt-tabs__wrap{position:relative;height:var(--zt-cascader-tabs-height)}.zt-cascader__tabs .zt-tabs__wrap: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-cascader__tabs .zt-tabs__nav--complete{padding-right:var(--zt-cascader-tabs-padding);padding-left:var(--zt-cascader-tabs-padding)}.zt-cascader__tabs .zt-tabs__content{height:calc(100% - var(--zt-cascader-tabs-height))}.zt-cascader__tabs .zt-tab__panel{height:100%}.zt-cascader__tab{color:var(--zt-cascader-tab-color);font-weight:var(--zt-font-bold);line-height:var(--zt-cascader-tabs-line-height);font-size:var(--zt-font-size-md)}.zt-cascader__tab--unselected{color:var(--zt-cascader-unselected-tab-color);font-weight:400}.zt-cascader__option{display:flex;align-items:center;justify-content:space-between;color:var(--zt-text-color);padding:0 var(--zt-padding-md);font-size:var(--zt-font-size-md);line-height:var(--zt-cascader-tabs-line-height);cursor:pointer;font-weight:400}.zt-cascader__option:active{background-color:var(--zt-active-color)}.zt-cascader__option--selected{color:var(--zt-cascader-active-color);font-weight:var(--zt-font-bold)}.zt-cascader__option--disabled{color:var(--zt-cascader-option-disabled-color);cursor:not-allowed}.zt-cascader__option--disabled:active{background-color:var(--zt-cascader-option-disabled-active-color)}.zt-cascader__selected-icon{font-size:var(--zt-cascader-selected-icon-size)}.zt-cascader__options{height:100%;box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-cascader .zt-tabs__nav{background:var(--zt-background-2)}.zt-cascader__cancel{margin:var(--zt-cascader-cancel-margin);width:var(--zt-cascader-cancel-width);background:var(--zt-cascader-cancel-background);border-radius:var(--zt-cascader-cancel-border-radius);color:var(--zt-text-color);border:0}.zt-theme-dark{--zt-cascader-cancel-background: var(--zt-background-card)}

package/lib/date-time-picker/DateTimePickerWrapper.js

@@ -211,10 +211,12 @@ var stdin_default = (0, import_vue2.defineComponent)({
       });
       return result;
     });
-    (0, import_vue2.watch)(dateValuesRef, (newValues) => {
+    (0, import_vue2.watch)(dateValuesRef, (newValues, oldValues) => {
       const date = parseDateValues(props.modelValue);
-      if (!(0, import_utils.isSameValue)(newValues, date)) {
-        currentValuesRef.value = genResult(newValues, timeValuesRef.value);
+      if (!(0, import_utils.isSameValue)(newValues, date) && !(0, import_utils.isSameValue)(newValues, oldValues)) {
+        const formatRangeNewValues = (0, import_utils2.formatValueRange)(newValues, dateColumns.value);
+        currentValuesRef.value = genResult(formatRangeNewValues, timeValuesRef.value);
+        dateValuesRef.value = formatRangeNewValues;
       }
     });
     (0, import_vue2.watch)(timeValuesRef, (newValues) => {

package/lib/date-time-picker/utils.d.ts

@@ -50,4 +50,5 @@ export declare const pickerInheritKeys: ("title" | "readonly" | "loading" | "sho
 export declare function times<T>(n: number, iteratee: (index: number) => T): T[];
 export declare const getMonthEndDay: (year: number, month: number) => number;
 export declare const genOptions: <T extends string>(min: number, max: number, type: T, formatter: Formatter, filter?: Filter) => PickerOption[];
+export declare const formatValueRange: (values: string[], columns: PickerOption[][]) => string[];
 export {};

package/lib/date-time-picker/utils.js

@@ -17,6 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var stdin_exports = {};
 __export(stdin_exports, {
+  formatValueRange: () => formatValueRange,
   genOptions: () => genOptions,
   getMonthEndDay: () => getMonthEndDay,
   pickerInheritKeys: () => pickerInheritKeys,
@@ -59,3 +60,12 @@ const genOptions = (min, max, type, formatter, filter) => {
   });
   return filter ? filter(type, options) : options;
 };
+const formatValueRange = (values, columns) => values.map((value, index) => {
+  const column = columns[index];
+  if (column.length) {
+    const minValue = +column[0].value;
+    const maxValue = +column[column.length - 1].value;
+    return (0, import_utils.padZero)((0, import_utils.clamp)(+value, minValue, maxValue));
+  }
+  return value;
+});