naive-ui 2.24.0 → 2.24.4

package/es/carousel/src/Carousel.d.ts

@@ -41,7 +41,7 @@ declare const carouselProps: {
         default: boolean;
     };
     effect: {
-        type: PropType<"slide" | "fade" | "custom">;
+        type: PropType<"card" | "slide" | "fade" | "custom">;
         default: string;
     };
     showDots: {
@@ -133,7 +133,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     effect: {
-        type: PropType<"slide" | "fade" | "custom">;
+        type: PropType<"card" | "slide" | "fade" | "custom">;
         default: string;
     };
     showDots: {
@@ -216,7 +216,7 @@ declare const _default: import("vue").DefineComponent<{
         getSlideStyle: (slide: HTMLElement | number) => any;
         addSlide: (slide?: HTMLElement | undefined) => void;
         removeSlide: (slide?: HTMLElement | undefined) => void;
-        onCarouselItemClick: (index: number) => void;
+        onCarouselItemClick: (index: number, event: MouseEvent) => void;
         total: number;
         currentIndex: number;
     }>;
@@ -244,59 +244,73 @@ declare const _default: import("vue").DefineComponent<{
     handleTouchstart: (event: MouseEvent | TouchEvent) => void;
     handleTransitionEnd: () => void;
     handleMousewheel: (event: WheelEvent) => void;
-    handleClick: (event: MouseEvent) => void;
     handleResize: () => void;
     handleSlideResize: () => void;
     isActive: (index: number) => boolean;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    defaultIndex?: unknown;
-    currentIndex?: unknown;
-    showArrow?: unknown;
-    dotType?: unknown;
-    dotPlacement?: unknown;
-    slidesPerView?: unknown;
-    spaceBetween?: unknown;
-    centeredSlides?: unknown;
-    direction?: unknown;
-    autoplay?: unknown;
-    interval?: unknown;
-    loop?: unknown;
-    effect?: unknown;
-    showDots?: unknown;
-    trigger?: unknown;
-    transitionStyle?: unknown;
-    transitionProps?: unknown;
-    draggable?: unknown;
-    touchable?: unknown;
-    mousewheel?: unknown;
-    keyboard?: unknown;
-    'onUpdate:currentIndex'?: unknown;
-    onUpdateCurrentIndex?: unknown;
-    theme?: unknown;
-    themeOverrides?: unknown;
-    builtinThemeOverrides?: unknown;
-} & {
-    direction: "horizontal" | "vertical";
-    draggable: boolean;
-    autoplay: boolean;
-    loop: boolean;
-    trigger: "click" | "hover";
-    showArrow: boolean;
-    keyboard: boolean;
-    dotType: "dot" | "line";
-    defaultIndex: number;
-    dotPlacement: "left" | "right" | "bottom" | "top";
-    slidesPerView: number | "auto";
-    spaceBetween: number;
-    centeredSlides: boolean;
-    interval: number;
-    effect: "slide" | "fade" | "custom";
-    showDots: boolean;
-    transitionStyle: Partial<Pick<CSSProperties, "transitionDuration" | "transitionTimingFunction">>;
-    touchable: boolean;
-    mousewheel: boolean;
-} & {
-    theme?: import("../../_mixins").Theme<"Carousel", {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    defaultIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    currentIndex: NumberConstructor;
+    showArrow: BooleanConstructor;
+    dotType: {
+        type: PropType<"dot" | "line">;
+        default: string;
+    };
+    dotPlacement: {
+        type: PropType<"left" | "right" | "bottom" | "top">;
+        default: string;
+    };
+    slidesPerView: {
+        type: PropType<number | "auto">;
+        default: number;
+    };
+    spaceBetween: {
+        type: NumberConstructor;
+        default: number;
+    };
+    centeredSlides: BooleanConstructor;
+    direction: {
+        type: PropType<"horizontal" | "vertical">;
+        default: string;
+    };
+    autoplay: BooleanConstructor;
+    interval: {
+        type: NumberConstructor;
+        default: number;
+    };
+    loop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    effect: {
+        type: PropType<"card" | "slide" | "fade" | "custom">;
+        default: string;
+    };
+    showDots: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    trigger: {
+        type: PropType<"click" | "hover">;
+        default: string;
+    };
+    transitionStyle: {
+        type: PropType<Partial<Pick<CSSProperties, "transitionDuration" | "transitionTimingFunction">>>;
+        default: () => Partial<Pick<CSSProperties, "transitionDuration" | "transitionTimingFunction">>;
+    };
+    transitionProps: PropType<TransitionProps>;
+    draggable: BooleanConstructor;
+    touchable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    mousewheel: BooleanConstructor;
+    keyboard: BooleanConstructor;
+    'onUpdate:currentIndex': PropType<(currentIndex: number, lastIndex: number) => void>;
+    onUpdateCurrentIndex: PropType<(currentIndex: number, lastIndex: number) => void>;
+    theme: PropType<import("../../_mixins").Theme<"Carousel", {
         dotSize: string;
         dotColor: string;
         dotColorActive: string;
@@ -304,8 +318,8 @@ declare const _default: import("vue").DefineComponent<{
         dotLineWidth: string;
         dotLineWidthActive: string;
         arrowColor: string;
-    }, any> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Carousel", {
+    }, any>>;
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Carousel", {
         dotSize: string;
         dotColor: string;
         dotColorActive: string;
@@ -313,8 +327,8 @@ declare const _default: import("vue").DefineComponent<{
         dotLineWidth: string;
         dotLineWidthActive: string;
         arrowColor: string;
-    }, any>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Carousel", {
+    }, any>>>;
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Carousel", {
         dotSize: string;
         dotColor: string;
         dotColorActive: string;
@@ -322,12 +336,8 @@ declare const _default: import("vue").DefineComponent<{
         dotLineWidth: string;
         dotLineWidthActive: string;
         arrowColor: string;
-    }, any>> | undefined;
-    currentIndex?: number | undefined;
-    transitionProps?: TransitionProps | undefined;
-    "onUpdate:currentIndex"?: ((currentIndex: number, lastIndex: number) => void) | undefined;
-    onUpdateCurrentIndex?: ((currentIndex: number, lastIndex: number) => void) | undefined;
-}>, {
+    }, any>>>;
+}>>, {
     direction: "horizontal" | "vertical";
     draggable: boolean;
     autoplay: boolean;
@@ -342,7 +352,7 @@ declare const _default: import("vue").DefineComponent<{
     spaceBetween: number;
     centeredSlides: boolean;
     interval: number;
-    effect: "slide" | "fade" | "custom";
+    effect: "card" | "slide" | "fade" | "custom";
     showDots: boolean;
     transitionStyle: Partial<Pick<CSSProperties, "transitionDuration" | "transitionTimingFunction">>;
     touchable: boolean;

package/es/carousel/src/Carousel.js

@@ -160,9 +160,7 @@ export default defineComponent({
                     [axis]: `${size}px`,
                     [`margin-${spaceAxis}`]: `${spaceBetween}px`
                 };
-                // TODO: fix
-                // if (isMounted && (effect === 'fade' || effect === 'card')) {
-                if (isMounted && effect === 'fade') {
+                if (isMounted && (effect === 'fade' || effect === 'card')) {
                     Object.assign(style, transitionStyleRef.value);
                 }
                 slideStyles.push(style);
@@ -234,6 +232,9 @@ export default defineComponent({
                     translateTo(index, speed);
                 }
                 else {
+                    if (!userWantsControlRef.value && speed > 0) {
+                        inTransition = true;
+                    }
                     fixTranslate();
                 }
                 if (displayIndex !== lastDisplayIndex) {
@@ -375,16 +376,20 @@ export default defineComponent({
                 return slideStylesRef.value[index];
             }
         }
-        function onCarouselItemClick(index) {
-            // TODO fix
-            // if (
-            //   !dragTriggered &&
-            //   !userWantsControlRef.value &&
-            //   props.effect === 'card' &&
-            //   !isRealActive(index)
-            // ) {
-            //   to(index)
-            // }
+        function onCarouselItemClick(index, event) {
+            const isTryDrag = 4 /* PROGRESS */ | 8 /* SUCCESS */ | 16 /* FAIL */;
+            let allowClick = !inTransition && !(dragStatus & isTryDrag);
+            if (props.effect === 'card' &&
+                !userWantsControlRef.value &&
+                !(dragStatus & 8 /* SUCCESS */) &&
+                !isRealActive(index)) {
+                to(index);
+                allowClick = false;
+            }
+            if (!allowClick) {
+                event.preventDefault();
+                event.stopPropagation();
+            }
         }
         const carouselMethods = {
             to,
@@ -439,20 +444,14 @@ export default defineComponent({
         let dragStartY = 0;
         let dragOffset = 0;
         let dragStartTime = 0;
-        let dragging = false;
-        let allowClick = true;
-        // whether the last touch triggered the drag successfully
-        // const dragTriggered = false
+        let dragStatus = 1 /* NORMAL */;
         function handleTouchstart(event) {
-            allowClick = true;
             if (globalDragging)
                 return;
-            // pause autoplay
-            resetAutoplay(true);
-            dragging = true;
-            globalDragging = true;
             dragStartTime = Date.now();
-            // dragTriggered = false
+            dragStatus = 2 /* START */;
+            globalDragging = true;
+            resetAutoplay(true /** cleanOnly */);
             if (event.type !== 'touchstart' &&
                 !event.target.isContentEditable) {
                 event.preventDefault();
@@ -483,7 +482,7 @@ export default defineComponent({
                 ? touchEvent.clientY - dragStartY
                 : touchEvent.clientX - dragStartX;
             dragOffset = clampValue(offset, -perViewSize, perViewSize);
-            allowClick = false;
+            dragStatus = 4 /* PROGRESS */;
             if (translateableRef.value) {
                 updateTranslate(previousTranslate - dragOffset, 0);
             }
@@ -522,19 +521,27 @@ export default defineComponent({
                 }
             }
             if (currentIndex !== null && currentIndex !== realIndex) {
-                // dragTriggered = true
+                dragStatus = 8 /* SUCCESS */;
                 toRealIndex(currentIndex);
             }
             else {
+                if (dragStatus & 4 /* PROGRESS */) {
+                    dragStatus = 16 /* FAIL */;
+                }
+                else {
+                    dragStatus = 32 /* END */;
+                }
                 fixTranslate(speedRef.value);
             }
             mesureAutoplay();
             resetDragStatus();
         }
         function resetDragStatus() {
-            if (dragging) {
-                dragging = false;
+            if (!(dragStatus & 1 /* NORMAL */)) {
                 globalDragging = false;
+                if (dragStatus & (2 /* START */ | 4 /* PROGRESS */)) {
+                    dragStatus = 1 /* NORMAL */;
+                }
             }
             dragStartX = 0;
             dragStartY = 0;
@@ -569,34 +576,27 @@ export default defineComponent({
             if (event.shiftKey && !deltaX) {
                 deltaX = deltaY;
             }
-            const PREV_R = -1;
-            const NEXT_R = 1;
-            const r = (deltaX || deltaY) > 0 ? NEXT_R : PREV_R;
+            const P_MULTIPLIER = -1;
+            const N_MULTIPLIER = 1;
+            const MULTIPLIER = (deltaX || deltaY) > 0 ? N_MULTIPLIER : P_MULTIPLIER;
             let rx = 0;
             let ry = 0;
             if (vertical) {
-                ry = r;
+                ry = MULTIPLIER;
             }
             else {
-                rx = r;
+                rx = MULTIPLIER;
             }
             const RESPONSE_STEP = 10;
             if (ry * deltaY >= RESPONSE_STEP || rx * deltaX >= RESPONSE_STEP) {
-                if (r === NEXT_R && !isNextDisabled()) {
+                if (MULTIPLIER === N_MULTIPLIER && !isNextDisabled()) {
                     next();
                 }
-                else if (r === PREV_R && !isPrevDisabled()) {
+                else if (MULTIPLIER === P_MULTIPLIER && !isPrevDisabled()) {
                     prev();
                 }
             }
         }
-        function handleClick(event) {
-            if (!allowClick) {
-                event.preventDefault();
-                event.stopPropagation();
-                allowClick = true;
-            }
-        }
         function handleResize() {
             perViewSizeRef.value = calculateSize(selfElRef.value, true);
             resetAutoplay();
@@ -675,7 +675,6 @@ export default defineComponent({
         return Object.assign(Object.assign(Object.assign({ mergedClsPrefix: mergedClsPrefixRef, selfElRef, slideVNodes: slideVNodesRef, duplicatedable: duplicatedableRef, userWantsControl: userWantsControlRef, autoSlideSize: autoSlideSizeRef, displayIndex: displayIndexRef, realIndex: realIndexRef, slideStyles: slideStylesRef, translateStyle: translateStyleRef, handleTouchstart,
             handleTransitionEnd,
             handleMousewheel,
-            handleClick,
             handleResize,
             handleSlideResize, isActive: isDisplayActive }, caroulseSlotProps), caroulseExposedMethod), { cssVars: computed(() => {
                 const { common: { cubicBezierEaseInOut }, self: { dotSize, dotColor, dotColorActive, dotColorFocus, dotLineWidth, dotLineWidthActive, arrowColor } } = themeRef.value;
@@ -721,9 +720,7 @@ export default defineComponent({
                 userWantsControl && `${mergedClsPrefix}-carousel--usercontrol`
             ], style: this.cssVars },
             h(VResizeObserver, { onResize: this.handleResize }, {
-                default: () => (h("div", { class: `${mergedClsPrefix}-carousel__slides`, role: "listbox", style: this.translateStyle, onMousedown: draggable ? this.handleTouchstart : undefined, onTouchstart: touchable ? this.handleTouchstart : undefined, 
-                    // @ts-expect-error
-                    onClickCapture: this.handleClick, onWheel: this.mousewheel ? this.handleMousewheel : undefined, onTransitionend: this.handleTransitionEnd }, userWantsControl
+                default: () => (h("div", { class: `${mergedClsPrefix}-carousel__slides`, role: "listbox", style: this.translateStyle, onMousedown: draggable ? this.handleTouchstart : undefined, onTouchstart: touchable ? this.handleTouchstart : undefined, onWheel: this.mousewheel ? this.handleMousewheel : undefined, onTransitionend: this.handleTransitionEnd }, userWantsControl
                     ? slides.map((slide, i) => (h("div", { style: slideStyles[i], key: i }, withDirectives(h(Transition, Object.assign({}, transitionProps), {
                         default: () => slide
                     }), [[vShow, this.isActive(i)]]))))

package/es/carousel/src/CarouselArrow.d.ts

@@ -5,5 +5,5 @@ declare const _default: import("vue").DefineComponent<{}, {
     isNextDisabled: () => boolean;
     prev: () => void;
     next: () => void;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{} & {} & {}>, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/es/carousel/src/CarouselDots.d.ts

@@ -44,19 +44,25 @@ declare const _default: import("vue").DefineComponent<{
     handleKeydown: (e: KeyboardEvent, current: number) => void;
     handleMouseenter: (current: number) => void;
     handleClick: (current: number) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    total?: unknown;
-    currentIndex?: unknown;
-    dotType?: unknown;
-    trigger?: unknown;
-    keyboard?: unknown;
-} & {
-    trigger: "click" | "hover";
-    keyboard: boolean;
-    total: number;
-    currentIndex: number;
-    dotType: "never" | "dot" | "line";
-} & {}>, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    total: {
+        type: NumberConstructor;
+        default: number;
+    };
+    currentIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    dotType: {
+        type: PropType<"never" | "dot" | "line">;
+        default: string;
+    };
+    trigger: {
+        type: PropType<"click" | "hover">;
+        default: string;
+    };
+    keyboard: BooleanConstructor;
+}>>, {
     trigger: "click" | "hover";
     keyboard: boolean;
     total: number;

package/es/carousel/src/CarouselItem.d.ts

@@ -6,6 +6,6 @@ declare const _default: import("vue").DefineComponent<{}, {
     isActive: import("vue").ComputedRef<boolean>;
     index: import("vue").ComputedRef<number | undefined>;
     style: import("vue").ComputedRef<any>;
-    handleClick: (e: MouseEvent) => void;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{} & {} & {}>, {}>;
+    handleClick: (event: MouseEvent) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/es/carousel/src/CarouselItem.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, renderSlot, inject, computed, ref, onMounted, onBeforeUnmount } from 'vue';
+import { h, defineComponent, inject, computed, ref, onMounted, onBeforeUnmount } from 'vue';
 import { useConfig } from '../../_mixins';
 import { throwError } from '../../_utils';
 import { carouselMethodsInjectionKey } from './interface';
@@ -31,10 +31,10 @@ export default defineComponent({
             const { value: selfEl } = selfElRef;
             return selfEl && NCarousel.getSlideIndex(selfEl);
         });
-        function handleClick(e) {
+        function handleClick(event) {
             const { value: index } = indexRef;
             if (index !== undefined) {
-                NCarousel === null || NCarousel === void 0 ? void 0 : NCarousel.onCarouselItemClick(index);
+                NCarousel === null || NCarousel === void 0 ? void 0 : NCarousel.onCarouselItemClick(index, event);
             }
         }
         onMounted(() => NCarousel.addSlide(selfElRef.value));
@@ -53,6 +53,7 @@ export default defineComponent({
         };
     },
     render() {
+        var _a;
         const { $slots: slots, mergedClsPrefix, isPrev, isNext, isActive, index, style } = this;
         const className = [
             `${mergedClsPrefix}-carousel__slide`,
@@ -62,7 +63,9 @@ export default defineComponent({
                 [`${mergedClsPrefix}-carousel__slide--next`]: isNext
             }
         ];
-        return (h("div", { ref: 'selfElRef', class: className, role: 'option', tabindex: "-1", "data-index": index, "aria-hidden": !isActive, style: style, onClick: this.handleClick }, renderSlot(slots, 'default', {
+        return (h("div", { ref: "selfElRef", class: className, role: "option", tabindex: "-1", "data-index": index, "aria-hidden": !isActive, style: style, 
+            // @ts-expect-error
+            onClickCapture: this.handleClick }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots, {
             isPrev,
             isNext,
             isActive,

package/es/carousel/src/interface.d.ts

@@ -1,4 +1,3 @@
-import type { InjectionKey } from 'vue';
 export declare const tuple: <T extends string[]>(...args: T) => T;
 export declare type ElementOf<T> = T extends Array<infer E> ? E : T extends ReadonlyArray<infer F> ? F : never;
 export interface CarouselMethodsInjection {
@@ -17,12 +16,20 @@ export interface CarouselMethodsInjection {
     getSlideStyle: (slide: HTMLElement) => any;
     addSlide: (slide?: HTMLElement) => void;
     removeSlide: (slide?: HTMLElement) => void;
-    onCarouselItemClick: (index: number) => void;
+    onCarouselItemClick: (index: number, event: MouseEvent) => void;
 }
-export declare const carouselMethodsInjectionKey: InjectionKey<CarouselMethodsInjection>;
+export declare const carouselMethodsInjectionKey: import("vue").InjectionKey<CarouselMethodsInjection>;
 export interface CarouselInst {
     getCurrentIndex: () => number;
     to: (index: number) => void;
     prev: () => void;
     next: () => void;
 }
+export declare const enum DragFlags {
+    NORMAL = 1,
+    START = 2,
+    PROGRESS = 4,
+    SUCCESS = 8,
+    FAIL = 16,
+    END = 32
+}

package/es/carousel/src/interface.js

@@ -1,2 +1,3 @@
+import { createInjectionKey } from '../../_utils';
 export const tuple = (...args) => args;
-export const carouselMethodsInjectionKey = Symbol('carouselMethods');
+export const carouselMethodsInjectionKey = createInjectionKey('n-carousel-methods');

package/es/carousel/src/styles/index.cssr.js

@@ -131,12 +131,12 @@ export default cB('carousel', `
  transform: translateY(-100%) translateZ(-200px);
  `), cM('next', `
  transform: translateY(0%) translateZ(-200px);
- `)])])]), cM('usercontrol', [cE('slide', `
+ `)])])]), cM('usercontrol', [cE('slides', [c('>', [c('div', `
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
- `)]), cM('left', [cE('dots', `
+ `)])])]), cM('left', [cE('dots', `
  transform: translateY(-50%);
  top: 50%;
  left: 12px;

package/es/cascader/index.d.ts

@@ -1,3 +1,3 @@
 export { default as NCascader } from './src/Cascader';
 export type { CascaderProps } from './src/Cascader';
-export type { CascaderOption } from './src/interface';
+export type { CascaderOption, CascaderInst } from './src/interface';