@polyv/vue-components 1.1.1 → 1.2.0

package/vue2/src/hooks/animation/types/common.d.ts

@@ -0,0 +1,32 @@
+import { AnimationControllerOptions, PlayAnimationOptions } from './index';
+/**
+ * 动画实现器
+ */
+export interface AnimationImplement {
+    /**
+     * 自动播放前钩子
+     */
+    beforeAutoPlay?: () => Promise<void>;
+    /**
+     * 清空动画
+     */
+    clearAnimation: () => Promise<void>;
+    /**
+     * 播放一次动画
+     */
+    playSingleAnimation: () => Promise<void>;
+}
+export declare const useCommonAnimation: (hookOptions: AnimationControllerOptions, implement: AnimationImplement) => {
+    wrapRef: import('vue').Ref<HTMLDivElement | undefined>;
+    isPlayingAnimation: import('vue').Ref<boolean>;
+    currentUrl: import('vue').Ref<string | undefined>;
+    autoPlay: boolean;
+    loop: import('vue').Ref<boolean>;
+    loopTimeInterval: import('vue').Ref<number>;
+    beforePlayAnimation: (options: PlayAnimationOptions) => void;
+    beforePlayCallback: (options: PlayAnimationOptions) => void;
+    onFinishedCallback: (options: PlayAnimationOptions) => void;
+    onErrorCallback: (options: PlayAnimationOptions, error: Error) => void;
+    playAnimation: (options?: PlayAnimationOptions) => Promise<void>;
+    clearAnimation: () => Promise<void>;
+};

package/vue2/src/hooks/animation/types/index.d.ts

@@ -0,0 +1,71 @@
+import { Ref } from 'vue';
+export interface AnimationCallback {
+    /**
+     * 播放前回调
+     */
+    onBeforePlay?: () => void;
+    /**
+     * 播放完成回调
+     */
+    onFinished?: () => void;
+    /**
+     * 播放异常回调
+     */
+    onError?: (error: Error) => void;
+}
+export interface PlayAnimationOptions extends AnimationCallback {
+    /**
+     * 动画文件地址
+     */
+    url?: string;
+    /**
+     * 是否循环播放
+     */
+    loop?: boolean;
+    /**
+     * 循环间隔时间
+     */
+    loopTimeInterval?: number;
+}
+export interface AnimationControllerOptions extends AnimationCallback {
+    /**
+     * 容器节点
+     */
+    wrapRef?: Ref<HTMLDivElement | undefined>;
+    /**
+     * 动画文件地址
+     */
+    url?: string;
+    /**
+     * 是否循环播放
+     * @default false
+     */
+    loop?: boolean;
+    /**
+     * 循环间隔时间
+     */
+    loopTimeInterval?: number;
+    /**
+     * 自动播放
+     * @default true
+     */
+    autoPlay?: boolean;
+    /**
+     * 是否播放动画中
+     */
+    isPlayingAnimation?: Ref<boolean>;
+}
+export interface AnimationController {
+    /**
+     * 容器节点
+     */
+    wrapRef: Ref<HTMLDivElement | undefined>;
+    /**
+     * 播放动画
+     */
+    playAnimation: (options?: PlayAnimationOptions) => Promise<void>;
+    /**
+     * 清空动画
+     */
+    clearAnimation: () => Promise<void>;
+}

package/vue2/src/hooks/animation/use-image-animation/index.d.ts

@@ -0,0 +1,4 @@
+import { AnimationController, AnimationControllerOptions } from '../types';
+export interface UseImageAnimationOptions extends AnimationControllerOptions {
+}
+export declare const useImageAnimation: (hookOptions?: UseImageAnimationOptions) => AnimationController;

package/vue2/src/hooks/animation/use-special-effect/index.d.ts

@@ -0,0 +1,40 @@
+import { Ref } from 'vue';
+import { PlayAnimationOptions } from '../types';
+export interface UseSpecialEffectOptions {
+    /**
+     * 容器节点
+     */
+    wrapRef?: Ref<HTMLDivElement | undefined>;
+}
+export interface AnimationQueueItem {
+    url: string;
+}
+export interface PushAnimationQueueOptions {
+    /**
+     * 动画文件地址
+     */
+    url: string;
+    /**
+     * 是否从头部插入
+     * @default false
+     */
+    inHeader?: boolean;
+    /**
+     * 是否过滤重复的动画
+     * @default false
+     */
+    filterRepeat?: boolean;
+}
+export declare const useSpecialEffect: (options?: UseSpecialEffectOptions) => {
+    wrapRef: Ref<HTMLDivElement | undefined>;
+    animationQueue: Ref<{
+        url: string;
+    }[]>;
+    currentAnimationItem: Ref<AnimationQueueItem | undefined>;
+    pushAnimationQueue: (options: PushAnimationQueueOptions) => void;
+    pauseAnimationQueue: () => void;
+    startAnimationQueue: () => void;
+    clearAnimationQueue: () => void;
+    playAnimation: (options?: PlayAnimationOptions) => Promise<void>;
+    clearAnimation: () => Promise<void>;
+};

package/vue2/src/hooks/animation/use-svga-animation/index.d.ts

@@ -0,0 +1,16 @@
+import { AnimationController, AnimationControllerOptions } from '../types';
+import { SVGAVideoEntity } from './load-svga-player';
+export interface UseSvgaAnimationOptions extends AnimationControllerOptions {
+    /**
+     * 填充模式
+     * @default 'AspectFill'
+     */
+    contentMode?: 'Fill' | 'AspectFill' | 'AspectFit';
+}
+export interface UseSvgaAnimationReturn extends AnimationController {
+    /**
+     * 加载 svga 动画文件地址
+     */
+    loadSvgaFile: (url: string) => Promise<SVGAVideoEntity>;
+}
+export declare const useSvgaAnimation: (hookOptions?: UseSvgaAnimationOptions) => UseSvgaAnimationReturn;

package/{src → vue2/src}/hooks/business/use-app-element/index.d.ts

@@ -1,4 +1,5 @@
 export declare const useAppElement: () => {
+    getDocument: () => Document;
     getAppRootElement: () => HTMLElement;
     getAppBodyElement: () => HTMLElement;
 };

package/{src → vue2/src}/hooks/business/use-config-provider/index.d.ts

@@ -1,13 +1,13 @@
 import { PwcEventEmitter } from '../../tools/use-event-bus';
-import { InjectionKey } from 'vue';
-import { TrackEventData } from '../use-track-event';
 import { I18nLangs } from '../../../lang/types';
+import { InjectionKey } from 'vue';
 import { SkinColorConfig } from '../use-skin-color';
+import { TrackEventData } from '../use-track-event';
 export interface ConfigProviderInjectData {
     /** 当前语言 */
     globalLang?: I18nLangs | (() => I18nLangs);
     /** 是否网页 css 全屏 */
-    pageFullscreen?: boolean;
+    pageFullscreen?: boolean | (() => boolean);
     /** 全屏元素 */
     fullscreenElement?: string | Element;
     /** 获取事件订阅器 */
@@ -31,5 +31,4 @@ export declare const ConfigProviderInjectKey: InjectionKey<ConfigProviderInjectD
 export declare const useConfigProvider: (config?: ConfigProviderInjectData, options?: ConfigProviderOptions) => void;
 export declare const useConfigProviderInject: (defConfig?: ConfigProviderInjectData) => {
     configProviderData: ConfigProviderInjectData | undefined;
-    getEmitter: () => PwcEventEmitter;
 };

package/vue2/src/hooks/business/use-server/index.d.ts

@@ -0,0 +1,4 @@
+export declare function useServer<T extends (...args: any[]) => unknown>(fn: T, value: ReturnType<T>): ReturnType<T>;
+export declare function useServer<T extends (...args: any[]) => unknown>(fn: T): ReturnType<T> | undefined;
+export declare function useClient<T extends (...args: any[]) => unknown>(fn: T, value: ReturnType<T>): ReturnType<T>;
+export declare function useClient<T extends (...args: any[]) => unknown>(fn: T): ReturnType<T> | undefined;

package/{src → vue2/src}/hooks/components/use-auto-topmost/index.d.ts

@@ -1,3 +1,4 @@
+import { ResponsiveElement } from '../../../vue-utils';
 import { Ref } from 'vue';
 export interface UseAutoTopmostOptions {
     /** 置顶事件 */
@@ -8,6 +9,6 @@ export interface UseAutoTopmostOptions {
  * @param visibleRef 显隐响应式
  * @param elemRef 弹出层节点响应式
  */
-export declare const useAutoTopmost: (visibleRef: Ref<boolean>, elemRef: Ref | HTMLElement, options?: UseAutoTopmostOptions) => {
+export declare const useAutoTopmost: (visibleRef: Ref<boolean>, elemRef: ResponsiveElement, options?: UseAutoTopmostOptions) => {
     topmostElem: () => Promise<void>;
 };

package/vue2/src/hooks/components/use-popper/_hooks/use-popper-visible.d.ts

@@ -0,0 +1,2 @@
+import { PopperVisibleResult, UsePopperOptions } from '../_popper-type';
+export declare const usePopperVisible: (options?: UsePopperOptions) => PopperVisibleResult;

package/{src → vue2/src}/hooks/components/use-popper/_popper-type.d.ts

@@ -13,8 +13,14 @@ export interface PopperArrowOptions {
     /** 尺寸，默认：6 */
     size?: number;
 }
+export type BeforeShowPopper = () => boolean;
 export interface UsePopperOptions {
     popperVisible?: boolean | Ref<boolean>;
+    /**
+     * 显示弹层前回调
+     * @returns 是否显示弹层
+     */
+    beforeShowPopper?: BeforeShowPopper;
     /** 触发节点 ref */
     referenceRef?: HTMLElement | Ref<HTMLElement | undefined>;
     /** 弹层节点 ref */
@@ -25,9 +31,15 @@ export interface UsePopperOptions {
     popperDisabled?: boolean | ResponsiveRef<boolean>;
     /** 触发方式 */
     trigger?: PopperTrigger | Ref<PopperTrigger>;
-    /** 鼠标移入延迟显示时间 */
+    /**
+     * 鼠标移入延迟显示时间
+     * @default 100
+     */
     mouseEnterDelay?: number | Ref<number>;
-    /** 鼠标移出延迟隐藏时间 */
+    /**
+     * 鼠标移出延迟隐藏时间
+     * @default 100
+     */
     mouseLeaveDelay?: number | Ref<number>;
     /** 弹层位置 */
     placement?: PopperPlacement | Ref<PopperPlacement>;
@@ -63,15 +75,15 @@ export interface PopperVisibleResult {
     delayHidePopper: (delay?: number) => void;
 }
 export interface PopperElements {
-    referenceElem: HTMLElement | undefined;
-    popperElem: HTMLElement | undefined;
-    inputElem: HTMLElement | undefined;
+    referenceElem: Element | undefined;
+    popperElem: Element | undefined;
+    inputElem: Element | undefined;
 }
 export interface OnPopperEventParams {
     /** 触发节点是否已隐藏 */
     isReferenceHidden: boolean;
 }
-export interface PopperOptions extends Required<Omit<UsePopperOptions, 'popperVisible'>>, PopperVisibleResult {
+export interface PopperOptions extends Required<Omit<UsePopperOptions, 'popperVisible' | 'beforeShowPopper'>>, PopperVisibleResult {
     /** 获取相关 dom 节点 */
     getElement: () => PopperElements;
     /** 处理弹层事件 */

package/vue2/src/hooks/element/use-document-visible/index.d.ts

@@ -0,0 +1,3 @@
+export declare const useDocumentVisible: (callback?: (documentVisible: boolean) => unknown) => {
+    documentVisible: import('vue').Ref<boolean>;
+};

package/vue2/src/hooks/element/use-element-size/index.d.ts

@@ -0,0 +1,18 @@
+import { ResponsiveElement } from '../../../vue-utils';
+import { ComputedRef, Ref } from 'vue';
+export interface UseElementSizeReturn {
+    /** 宽度 */
+    width: Ref<number>;
+    /** 高度 */
+    height: Ref<number>;
+    /** 尺寸 */
+    size: ComputedRef<{
+        width: number;
+        height: number;
+    }>;
+}
+/**
+ * 获取元素尺寸
+ * @param target 响应式元素
+ */
+export declare function useElementSize(target: ResponsiveElement): UseElementSizeReturn;

package/vue2/src/hooks/element/use-text-ellipsis/index.d.ts

@@ -0,0 +1,4 @@
+import { MaybeElement } from '../../../vue-utils';
+export declare function useTextEllipsis(): {
+    isTextEllipsis: (elemRef: MaybeElement) => boolean;
+};

package/{src → vue2/src}/hooks/exports.d.ts

@@ -1,15 +1,18 @@
+export * from './animation/use-image-animation';
+export * from './animation/use-special-effect';
+export * from './animation/use-svga-animation';
 export * from './business/use-app-element';
 export * from './business/use-config-provider';
 export * from './business/use-request';
 export * from './business/use-resize-oss-image';
 export * from './business/use-skin-color';
 export * from './business/use-track-event';
-export * from './components/use-action-sheet';
 export * from './components/use-auto-topmost';
-export * from './components/use-image-preview';
-export * from './components/use-message-box';
 export * from './components/use-popper';
-export * from './components/use-toast';
+export * from './element/use-document-visible';
+export * from './element/use-element-size';
+export * from './element/use-text-ellipsis';
+export * from './interactive/use-double-click';
 export * from './interactive/use-fullscreen';
 export * from './interactive/use-hover';
 export * from './interactive/use-outside';
@@ -22,22 +25,22 @@ export * from './pagination/use-static-pagination';
 export * from './platform/weixin/use-weixin-mini-program';
 export * from './platform/weixin/use-weixin-sdk';
 export * from './plugin/use-resize-observer';
-export * from './plugin/use-svga-animation';
-export * from './plugin/use-svga-player';
 export * from './tools/use-append-to';
-export * from './tools/use-body-locked';
+export * from './tools/use-auto-listen';
 export * from './tools/use-browser';
-export * from './tools/use-copy-text';
+export * from './tools/use-clipboard';
 export * from './tools/use-count-down';
 export * from './tools/use-download';
 export * from './tools/use-event-bus';
 export * from './tools/use-event-listener';
 export * from './tools/use-link-open';
+export * from './tools/use-scroll-lock';
 export * from './tools/use-set-interval';
 export * from './tools/use-set-timeout';
 export * from './tools/use-simple-visible';
 export * from './tools/use-target-event-emitter';
 export * from './tools/use-window-resize-listener';
+export * from './tools/use-z-index';
 export * from './vue/use-model-value';
 export * from './vue/use-storage-ref';
 export * from './vue/use-vue';

package/vue2/src/hooks/interactive/use-bezier-momentum/index.d.ts

@@ -0,0 +1,17 @@
+import { ResponsiveElement } from '../../../vue-utils';
+export interface UseBezierMomentumOptions {
+    getPosition: () => {
+        x: number;
+        y: number;
+    };
+    updatePosition: (x: number, y: number) => void;
+}
+export declare function useBezierMomentum(transitionElem: ResponsiveElement, options: UseBezierMomentumOptions): {
+    canTransition: import('vue').Ref<boolean>;
+    momentumBezier: import('vue').Ref<string>;
+    momentumTransitionDuration: import('vue').Ref<number>;
+    onMomentumStart: () => void;
+    onMomentumMove: () => void;
+    onMomentumEnd: () => void;
+    stopMomentum: () => void;
+};

package/vue2/src/hooks/interactive/use-double-click/index.d.ts

@@ -0,0 +1,13 @@
+import { ResponsiveElement } from '../../../vue-utils';
+export interface UseDoubleClickOptions {
+    /**
+     * 两次点击时间间隔，单位：毫秒
+     * @default 200
+     */
+    doubleClickTime?: number;
+    /**
+     * 单击回调，该回调有 `doubleClickTime` + 100ms 的延迟
+     */
+    singleClickCallback?: (event: Event) => void;
+}
+export declare function useDoubleClick(target: ResponsiveElement, callback: (event: Event) => void, options?: UseDoubleClickOptions): void;

package/{src → vue2/src}/hooks/interactive/use-fullscreen/index.d.ts

@@ -1,3 +1,4 @@
+import { MaybeElement } from '../../../vue-utils';
 import { Ref } from 'vue';
 export interface FullscreenFieldData {
     /** 浏览器是否支持全屏模式的 api 字段 */
@@ -11,12 +12,11 @@ export interface FullscreenFieldData {
     /** 浏览器全屏状态改变事件 */
     fullscreenChangeEvent: 'fullscreenchange';
 }
-export type FullscreenElement = Element | Ref<Element>;
-export type GetFullscreenElement = () => FullscreenElement;
+export type GetFullscreenElement = () => MaybeElement;
 /**
  * 系统全屏
  */
-export declare const useFullscreen: (elementRef?: FullscreenElement | GetFullscreenElement, options?: {
+export declare const useFullscreen: (elementRef?: MaybeElement | GetFullscreenElement, options?: {
     /** 强制禁用全屏 */
     forceDisabled?: boolean;
     onFullscreenChange?: (isFullscreen: boolean) => void;

package/vue2/src/hooks/interactive/use-hover/index.d.ts

@@ -0,0 +1,8 @@
+import { ResponsiveElement } from '../../../vue-utils';
+/**
+ * 悬浮事件 hook
+ * @param target 响应式节点
+ */
+export declare const useHover: (target: ResponsiveElement) => {
+    isHover: import('vue').Ref<boolean>;
+};

package/{src → vue2/src}/hooks/interactive/use-hover-visible/index.d.ts

@@ -1,7 +1,18 @@
+import { ResponsiveElement } from '../../../vue-utils';
 export interface UseHoverVisibleOptions {
-    /** 自动展示，默认为 true */
+    /**
+     * 目标节点
+     */
+    target?: ResponsiveElement;
+    /**
+     * 自动展示
+     * @default true
+     */
     autoHover?: boolean;
-    /** 自动关闭时长，默认为 3000ms */
+    /**
+     * 自动关闭时长，单位：ms
+     * @default 3000
+     */
     timeout?: number;
 }
 /**

package/vue2/src/hooks/interactive/use-mouse-wheel/index.d.ts

@@ -0,0 +1,31 @@
+import { ResponsiveElement } from '../../../vue-utils';
+export interface WheelEventData {
+    /** 水平方向的旋转量 */
+    spinX: number;
+    /** 垂直方向的旋转量 */
+    spinY: number;
+    /** 水平方向的像素量 */
+    pixelX: number;
+    /** 垂直方向的像素量 */
+    pixelY: number;
+}
+export interface UseMouseWheelOptions {
+    /**
+     * 鼠标滚轮事件回调
+     */
+    onWheel?: (data: WheelEventData) => void;
+    /**
+     * 向上滚动回调
+     */
+    onUp?: () => void;
+    /**
+     * 向下滚动回调
+     */
+    onDown?: () => void;
+    /**
+     * 是否阻止默认行为
+     * @default true
+     */
+    preventDefault?: boolean;
+}
+export declare function useMouseWheel(target: ResponsiveElement, options?: UseMouseWheelOptions): void;

package/{src → vue2/src}/hooks/interactive/use-outside/index.d.ts

@@ -1,5 +1,5 @@
 import { Ref } from 'vue';
-export type OutsideTargetType = Ref | HTMLElement | string;
+export type OutsideTargetType = Ref | Element | string;
 export type OutsideTargets = OutsideTargetType | OutsideTargetType[];
 export type OutsideTargetsFunction = () => OutsideTargets;
 export type OutsideCallback = (options: {

package/vue2/src/hooks/interactive/use-press-hold/index.d.ts

@@ -0,0 +1,28 @@
+import { ResponsiveElement } from '../../../vue-utils';
+export interface UsePressHoldOptions {
+    /**
+     * 按住间隔时间，单位：毫秒
+     * @default 100
+     */
+    holdTime?: number;
+    /**
+     * 按住开始回调
+     */
+    onHoldStart?: () => void;
+    /**
+     * 按住回调
+     */
+    onHold?: () => void;
+    /**
+     * 按住结束回调
+     */
+    onHoldEnd?: () => void;
+    /**
+     * 点击回调
+     */
+    onClick?: () => void;
+}
+export declare function usePressHold(targetRef: ResponsiveElement, options?: UsePressHoldOptions): {
+    isPressDown: import('vue').Ref<boolean>;
+    isPressHold: import('vue').Ref<boolean>;
+};

package/vue2/src/hooks/interactive/use-vibrate/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 设备振动
+ */
+export declare function useVibrate(): {
+    vibrate: (pattern?: number | number[]) => void;
+    supportVibrate: boolean;
+};

package/{src → vue2/src}/hooks/pagination/types.d.ts

@@ -30,31 +30,60 @@ export type PaginationRequest<I = unknown> = (params: {
  * 分页 hook 选项
  */
 export interface PaginationHookOptions<I = unknown> {
-    /** 关键词 */
-    keyword?: Ref<string>;
-    /** 是否立即执行，默认：true */
+    /**
+     * 是否立即执行
+     * @default true
+     */
     immediate?: boolean;
-    /** 页数 */
+    /**
+     * 关键词
+     */
+    keyword?: Ref<string>;
+    /**
+     * 当前页数
+     * @default 1
+     */
     pageNumber?: Ref<number>;
-    /** 每页数量，默认：10 */
+    /**
+     * 每页数量
+     * @default 10
+     */
     pageSize?: Ref<number>;
-    /** 列表 */
+    /**
+     * 内容列表
+     */
     contents?: Ref<I[]>;
-    /** 总记录数 */
+    /**
+     * 总记录数
+     */
     totalItems?: Ref<number>;
-    /** 总页数 */
+    /**
+     * 总页数
+     */
     totalPages?: Ref<number>;
-    /** 获取过滤条件 */
+    /**
+     * 获取过滤条件
+     */
     getFilterParams?: () => Record<string, unknown>;
 }
 /**
  * 分页 hook 返回值
  */
 export interface PageinationHookReturn<I = unknown> {
+    /**
+     * 当前页数
+     */
     pageNumber: Ref<number>;
+    /**
+     * 每页数量
+     */
     pageSize: Ref<number>;
+    /**
+     * 内容列表
+     */
     contents: Ref<I[]>;
+    /**
+     * 关键词
+     */
     keyword: Ref<string>;
-    /** 刷新当前数据 */
-    refresh: () => Promise<void>;
 }

package/{src → vue2/src}/hooks/pagination/use-scroll-pagintaion/index.d.ts

@@ -1,14 +1,33 @@
-import { Ref } from 'vue';
+import { Ref, ComputedRef } from 'vue';
 import { PageinationHookReturn, PaginationHookOptions, PaginationRequest } from '../types';
 import { ScrollDirection } from '../../interactive/use-scroll';
 export interface ScrollPaginationHookOptions<I = unknown> extends PaginationHookOptions<I> {
+    /**
+     * 滚动容器
+     */
     scrollRef?: Ref<HTMLDivElement | undefined>;
-    /** 滚动方向 */
+    /**
+     * 滚动方向
+     * @default 'vertical'
+     */
     direction?: ScrollDirection;
 }
 export interface ScrollPaginationHookReturn<I = unknown> extends PageinationHookReturn<I> {
+    /**
+     * 滚动容器
+     */
     scrollRef: Ref<HTMLDivElement | undefined>;
-    isFirstFinish: Ref<boolean>;
+    /**
+     * 是否为空
+     */
+    isEmpty: ComputedRef<boolean>;
+    /**
+     * 刷新当前数据，重置到第一页
+     */
+    refresh: () => Promise<void>;
+    /**
+     * 根据当前获取的数据，刷新当前列表
+     */
     refreshList: () => Promise<void>;
 }
 /**

package/{src → vue2/src}/hooks/plugin/use-resize-observer/index.d.ts

@@ -1,4 +1,4 @@
-import { Ref } from 'vue';
+import { ResponsiveElement } from '../../../vue-utils';
 import { ResizeObserver } from '@juggle/resize-observer';
 /**
  * 监听元素 resize
@@ -6,8 +6,8 @@ import { ResizeObserver } from '@juggle/resize-observer';
  * @param callback 回调
  * @param options 选项
  */
-export declare const useResizeObserver: (refObj: Ref<Element | undefined>, callback: () => unknown, options?: {
+export declare const useResizeObserver: (refObj: ResponsiveElement, callback: () => unknown, options?: {
     autoLifeCycle?: boolean;
 }) => {
-    observer: ResizeObserver;
+    observer: ResizeObserver | undefined;
 };

package/vue2/src/hooks/tools/use-append-to/index.d.ts

@@ -0,0 +1,7 @@
+import { MaybeElement } from '../../../vue-utils';
+/**
+ * 将节点插入到某个容器中
+ * @param elemRef 对应的节点
+ * @param parentRef 父节点
+ */
+export declare function useAppendTo(elemRef: MaybeElement, parentRef?: MaybeElement): void;