@polyv/vue-components 1.3.0 → 1.5.0

package/vue3/src/components/slider/src/props-define.d.ts

@@ -0,0 +1,110 @@
+import { VueEmit, VueProps } from '../../../vue-utils';
+export type SliderValue = number | [number, number];
+export type SliderMarks = Record<number, string | {
+    label: string;
+    style?: Record<string, any>;
+}>;
+export declare const sliderProps: () => {
+    /**
+     * 绑定值，支持 v-model
+     * @default 0
+     */
+    "v-model-key": import('vue-types').VueTypeDef<SliderValue> & {
+        default: number | (() => [number, number]);
+    };
+    /**
+     * 最小值
+     * @default 0
+     */
+    min: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    /**
+     * 最大值
+     * @default 100
+     */
+    max: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 是否显示 tooltip
+     * @default false
+     */
+    showTooltip: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 是否为范围选择
+     * @default false
+     */
+    range: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 步长
+     * @default 1
+     */
+    step: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    /**
+     * 是否显示间断点
+     * @default false
+     */
+    showStops: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 是否显示滑块按钮
+     * @default true
+     */
+    showSliderButton: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 标记，key 为数值，value 为显示的文本或对象
+     */
+    marks: import('vue-types').VueTypeValidableDef<SliderMarks, import('vue-types/dist/types').ValidatorFunction<SliderMarks>>;
+    /**
+     * 容器 css 旋转角度，0、90、180、270
+     * @default 0
+     */
+    cssRotateAngle: import('vue-types').VueTypeDef<0 | 180 | 90 | 270> & {
+        default: 0 | 180 | 90 | 270;
+    };
+    /**
+     * 是否显示进度条
+     * @default true
+     */
+    progressBarVisible: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 点击热区高度
+     * @default 4
+     */
+    hotAreaHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    /**
+     * 滑块条高度
+     */
+    sliderBarHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>>;
+};
+export declare const sliderEmits: () => {
+    /**
+     * 值改变时触发
+     * @cbName 当前值
+     * @cbType SliderValue
+     */
+    change: import('../../../vue-utils').EmitFuncType<SliderValue>;
+};
+export type SliderProps = VueProps<typeof sliderProps>;
+export type SliderEmits = VueEmit<typeof sliderEmits>;

package/vue3/src/components/slider/src/slider-button.vue.d.ts

@@ -0,0 +1,16 @@
+declare const _default: import('vue').DefineComponent<{
+    value: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+}, {
+    setPosition: (percent: number) => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (arg: number) => void;
+}, string, Readonly<import('vue').ExtractPropTypes<{
+    value: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+}>>, {
+    value: number;
+}>;
+export default _default;

package/vue3/src/components/slider/src/slider.vue.d.ts

@@ -0,0 +1,95 @@
+declare const _default: import('vue').DefineComponent<{
+    "v-model-key": import('vue-types').VueTypeDef<import('./props-define').SliderValue> & {
+        default: number | (() => [number, number]);
+    };
+    min: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    max: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    showTooltip: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    range: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    step: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    showStops: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    showSliderButton: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    marks: import('vue-types').VueTypeValidableDef<import('./props-define').SliderMarks, import('vue-types/dist/types').ValidatorFunction<import('./props-define').SliderMarks>>;
+    cssRotateAngle: import('vue-types').VueTypeDef<0 | 180 | 90 | 270> & {
+        default: 0 | 180 | 90 | 270;
+    };
+    progressBarVisible: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    hotAreaHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    sliderBarHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>>;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (arg: import('./props-define').SliderValue) => void;
+}, string, Readonly<import('vue').ExtractPropTypes<{
+    "v-model-key": import('vue-types').VueTypeDef<import('./props-define').SliderValue> & {
+        default: number | (() => [number, number]);
+    };
+    min: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    max: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    showTooltip: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    range: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    step: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    showStops: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    showSliderButton: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    marks: import('vue-types').VueTypeValidableDef<import('./props-define').SliderMarks, import('vue-types/dist/types').ValidatorFunction<import('./props-define').SliderMarks>>;
+    cssRotateAngle: import('vue-types').VueTypeDef<0 | 180 | 90 | 270> & {
+        default: 0 | 180 | 90 | 270;
+    };
+    progressBarVisible: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    hotAreaHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+    sliderBarHeight: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>>;
+}>>, {
+    "v-model-key": import('./props-define').SliderValue;
+    range: boolean;
+    disabled: boolean;
+    min: number;
+    max: number;
+    showTooltip: boolean;
+    step: number;
+    showStops: boolean;
+    showSliderButton: boolean;
+    cssRotateAngle: 0 | 180 | 90 | 270;
+    progressBarVisible: boolean;
+    hotAreaHeight: number;
+}>;
+export default _default;

package/vue3/src/components/slider/src/use-slider-button.d.ts

@@ -0,0 +1,26 @@
+import { VueEmit, VueProps } from '../../../vue-utils';
+export declare const sliderButtonProps: () => {
+    value: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
+        default: number;
+    };
+};
+export declare const sliderButtonEmits: () => {
+    change: import('../../../vue-utils').EmitFuncType<number>;
+};
+export interface SliderButtonInstance {
+    setPosition(percent: number): void;
+}
+export declare const useSliderButton: (options: {
+    props: VueProps<typeof sliderButtonProps>;
+    emit: VueEmit<typeof sliderButtonEmits>;
+}) => {
+    hovering: import('vue').Ref<boolean>;
+    dragging: import('vue').Ref<boolean>;
+    btnStyle: import('vue').ComputedRef<{
+        left: string;
+    }>;
+    handleMouseEnter: () => void;
+    handleMouseLeave: () => void;
+    onButtonDown: (event: MouseEvent | TouchEvent) => void;
+    setPosition: (percent: number) => void;
+};

package/vue3/src/components/slider/src/use-slider.d.ts

@@ -0,0 +1,40 @@
+import { Ref } from 'vue';
+import { SliderEmits, SliderProps, SliderValue } from './props-define';
+import { SliderButtonInstance } from './use-slider-button';
+export interface SliderInjectData {
+    sliderProps: SliderProps;
+    sliderWidth: Ref<number>;
+    dragging: Ref<boolean>;
+    emitChange: () => void;
+}
+export declare const useSlider: (options: {
+    props: SliderProps;
+    emit: SliderEmits;
+}) => {
+    modelValue: import('vue').ComputedRef<SliderValue>;
+    firstValue: Ref<number>;
+    secondValue: Ref<number>;
+    dragging: Ref<boolean>;
+    sliderRef: Ref<HTMLElement | undefined>;
+    sliderClickRef: Ref<HTMLElement | undefined>;
+    button1Ref: Ref<SliderButtonInstance | undefined>;
+    button2Ref: Ref<SliderButtonInstance | undefined>;
+    barStyle: import('vue').ComputedRef<{
+        width: string;
+        left: string;
+    }>;
+    runwayStyle: import('vue').ComputedRef<Record<string, string>>;
+    stops: import('vue').ComputedRef<number[]>;
+    markList: import('vue').ComputedRef<{
+        label: string;
+        style: Record<string, any>;
+        left: number;
+        value: number;
+    }[]>;
+    onSliderClick: (event: MouseEvent) => void;
+    onClickMark: (item: {
+        left: number;
+    }) => void;
+    emitInnerInput: () => void;
+};
+export declare const useSliderInject: () => SliderInjectData;

package/vue3/src/components/swiper/effects/carousel-effect/use-carousel-effect.d.ts

@@ -0,0 +1,34 @@
+import { default as Swiper } from 'swiper';
+import { UseSwiperOptionsReturn } from '../../hooks/use-swiper-options';
+export declare const carouselEffectProps: () => {
+    /**
+     * 轮播效果配置
+     * @default false
+     */
+    carouselEffect: import('vue-types').VueTypeDef<boolean | SwiperCarouselEffectOptions> & {
+        default: boolean | (() => SwiperCarouselEffectOptions);
+    };
+};
+export interface SwiperCarouselEffectOptions {
+    /**
+     * 缩放步长
+     * @default 0.2
+     */
+    scaleStep?: number;
+    /**
+     * 侧边幻灯片数量
+     * @default 2
+     */
+    sideSlides?: number;
+    /**
+     * 是否使用滤镜样式
+     * @default false
+     */
+    useFilter?: boolean;
+}
+/**
+ * 轮播切换效果
+ */
+export declare const useCarouselEffect: (swiperOptionsHook: UseSwiperOptionsReturn) => {
+    installEffect: (swiper: Swiper) => void;
+};

package/vue3/src/components/swiper/hooks/swiper-props.d.ts

@@ -1,16 +1,22 @@
 import { default as Swiper } from 'swiper';
-import { NavigationOptions } from 'swiper/types/modules/navigation';
-import { PaginationOptions } from 'swiper/types/modules/pagination';
 import { SwiperOptions } from 'swiper/types/swiper-options';
+export declare const swiperEffects: readonly ["3d"];
+export type SwiperEffect = typeof swiperEffects[number];
 export declare const swiperProps: () => {
-    pagination: import('vue-types').VueTypeDef<boolean | PaginationOptions> & {
-        default: boolean | (() => PaginationOptions);
+    autoplay: import('vue-types').VueTypeDef<boolean | import('swiper/types').AutoplayOptions> & {
+        default: boolean | (() => import('swiper/types').AutoplayOptions);
+    };
+    pagination: import('vue-types').VueTypeDef<boolean | import('swiper/types').PaginationOptions> & {
+        default: boolean | (() => import('swiper/types').PaginationOptions);
     };
     showNavigationArrow: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
         default: boolean;
     };
-    navigation: import('vue-types').VueTypeDef<boolean | NavigationOptions> & {
-        default: boolean | (() => NavigationOptions);
+    navigation: import('vue-types').VueTypeDef<boolean | import('swiper/types').NavigationOptions> & {
+        default: boolean | (() => import('swiper/types').NavigationOptions);
+    };
+    carouselEffect: import('vue-types').VueTypeDef<boolean | import('../effects/carousel-effect/use-carousel-effect').SwiperCarouselEffectOptions> & {
+        default: boolean | (() => import('../effects/carousel-effect/use-carousel-effect').SwiperCarouselEffectOptions);
     };
     /**
      * 初始幻灯片索引
@@ -23,16 +29,19 @@ export declare const swiperProps: () => {
      * 滚动方向
      * @default 'horizontal'
      */
-    direction: import('vue-types').VueTypeDef<"horizontal" | "vertical"> & {
-        default: "horizontal" | "vertical";
+    direction: import('vue-types').VueTypeDef<"horizontal" | "vertical">;
+    /**
+     * 是否循环
+     * @default false
+     */
+    loop: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
     };
     /**
      * swiper 配置，详细可见 [官方文档](https://swiperjs.com/swiper-api#parameters)
      * @default {}
      */
-    swiperOptions: import('vue-types').VueTypeValidableDef<SwiperOptions, import('vue-types/dist/types').ValidatorFunction<SwiperOptions>> & {
-        default: () => SwiperOptions;
-    };
+    swiperOptions: import('vue-types').VueTypeValidableDef<SwiperOptions, import('vue-types/dist/types').ValidatorFunction<SwiperOptions>>;
 };
 export declare const swiperEmits: () => {
     /**
@@ -40,6 +49,16 @@ export declare const swiperEmits: () => {
      * @cbName swiper 实例
      */
     init: import('../../../vue-utils').EmitFuncType<Swiper>;
+    /**
+     * 当前激活的幻灯片名
+     * @cbName 幻灯片名
+     */
+    'active-name': import('../../../vue-utils').EmitFuncType<string | undefined>;
+    /**
+     * 幻灯片数量更新
+     * @cbName 幻灯片数量
+     */
+    'slide-total': import('../../../vue-utils').EmitFuncType<number>;
     /**
      * 幻灯片切换
      * @cbName swiper 实例
@@ -55,6 +74,14 @@ export declare const swiperEmits: () => {
      * @cbName swiper 实例
      */
     'slide-change-transition-end': import('../../../vue-utils').EmitFuncType<Swiper>;
+    /**
+     * 滑到最后一个继续滑
+     */
+    'slide-reach-end': import('../../../vue-utils').EmitFuncType<void>;
+    /**
+     * 滑到第一个继续滑
+     */
+    'slide-reach-beginning': import('../../../vue-utils').EmitFuncType<void>;
 };
 export interface SwiperSlots {
     /**
@@ -70,3 +97,13 @@ export interface SwiperSlots {
      */
     'pagination': void;
 }
+export interface SwiperExpose {
+    /**
+     * 跳转至指定幻灯片
+     * @param name 幻灯片名
+     */
+    slideToName: (name: string) => void;
+}
+export declare const swiperSlideProps: () => {
+    name: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>>;
+};

package/vue3/src/components/swiper/hooks/use-swiper-options.d.ts

@@ -1,11 +1,14 @@
 import { VueProps } from '../../../vue-utils/props-utils';
-import { swiperProps } from './swiper-props';
-import { SwiperOptions } from 'swiper/types/swiper-options';
 import { SwiperModule } from 'swiper/types';
+import { SwiperOptions } from 'swiper/types/swiper-options';
+import { swiperProps } from './swiper-props';
 export declare const useSwiperOptions: (options: {
     props: VueProps<typeof swiperProps>;
 }) => {
     props: Readonly<import('vue').ExtractPropTypes<{
+        autoplay: import('vue-types').VueTypeDef<boolean | import('swiper/types').AutoplayOptions> & {
+            default: boolean | (() => import('swiper/types').AutoplayOptions);
+        };
         pagination: import('vue-types').VueTypeDef<boolean | import('swiper/types').PaginationOptions> & {
             default: boolean | (() => import('swiper/types').PaginationOptions);
         };
@@ -15,15 +18,17 @@ export declare const useSwiperOptions: (options: {
         navigation: import('vue-types').VueTypeDef<boolean | import('swiper/types').NavigationOptions> & {
             default: boolean | (() => import('swiper/types').NavigationOptions);
         };
+        carouselEffect: import('vue-types').VueTypeDef<boolean | import('..').SwiperCarouselEffectOptions> & {
+            default: boolean | (() => import('..').SwiperCarouselEffectOptions);
+        };
         initialSlide: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>> & {
             default: number;
         };
-        direction: import('vue-types').VueTypeDef<"horizontal" | "vertical"> & {
-            default: "horizontal" | "vertical";
-        };
-        swiperOptions: import('vue-types').VueTypeValidableDef<SwiperOptions, import('vue-types/dist/types').ValidatorFunction<SwiperOptions>> & {
-            default: () => SwiperOptions;
+        direction: import('vue-types').VueTypeDef<"horizontal" | "vertical">;
+        loop: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+            default: boolean;
         };
+        swiperOptions: import('vue-types').VueTypeValidableDef<SwiperOptions, import('vue-types/dist/types').ValidatorFunction<SwiperOptions>>;
     }>>;
     swiperOptions: import('vue').Ref<{
         modules?: SwiperModule[] | undefined;
@@ -1569,9 +1574,10 @@ export declare const useSwiperOptions: (options: {
         } | undefined;
         _emitClasses?: boolean | undefined;
     }>;
+    extendClass: import('vue').Ref<string[]>;
     modules: import('vue').Ref<SwiperModule[]>;
     initOptions: () => {
-        modules: SwiperModule[];
+        modules?: SwiperModule[] | undefined;
         injectStyles?: string[] | undefined;
         injectStylesUrls?: string[] | undefined;
         init?: boolean | undefined;

package/vue3/src/components/swiper/hooks/use-swiper-slide.d.ts

@@ -1 +1,8 @@
-export declare const useSwiperSlide: () => void;
+import { VueProps } from '../../../vue-utils';
+import { swiperSlideProps } from './swiper-props';
+export declare const SWIPER_SLIDE_NAME_KEY = "data-swiper-slide-name";
+export declare const useSwiperSlide: (options: {
+    props: VueProps<typeof swiperSlideProps>;
+}) => {
+    slideAttributes: import('vue').ComputedRef<Record<string, string>>;
+};