@polyv/vue-components 1.1.1 → 1.2.0

package/vue3/src/components/popper/hooks.d.ts

@@ -0,0 +1,7 @@
+import { InjectionKey, Ref } from 'vue';
+export interface PopperInject {
+    referenceRef: Ref<any>;
+    popperRef: Ref<any>;
+    popperVisible: Ref<boolean>;
+}
+export declare const popperInjectKey: InjectionKey<PopperInject>;

package/vue3/src/components/popper/index.d.ts

@@ -0,0 +1,4 @@
+export { default as PwcPopper } from './popper.vue';
+export { default as PwcPopperReference } from './popper-reference.vue';
+export { default as PwcPopperContent } from './popper-content.vue';
+export * from './props-define';

package/vue3/src/components/popper/popper-content.vue.d.ts

@@ -0,0 +1,19 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        popperRef: HTMLDivElement;
+    };
+    rootEl: Element;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, Readonly<import('vue').ExtractPropTypes<{}>>, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $scopedSlots: S;
+    };
+};

package/vue3/src/components/popper/popper-reference.vue.d.ts

@@ -0,0 +1,19 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        referenceRef: (import('vue/types/v3-component-public-instance').Vue3Instance<{}, Readonly<import('vue').ExtractPropTypes<{}>>, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}, true, import('vue').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, any>> & Readonly<Readonly<import('vue').ExtractPropTypes<{}>>> & import('vue').ShallowUnwrapRef<() => import('vue').VNode[] | undefined> & import('vue/types/v3-component-options').ExtractComputedReturns<{}> & import('vue').ComponentCustomProperties & Readonly<import('vue').ExtractPropTypes<{}>>) | null;
+    };
+    rootEl: Element;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, Readonly<import('vue').ExtractPropTypes<{}>>, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $scopedSlots: S;
+    };
+};

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

@@ -0,0 +1,58 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        popperWrapRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{
+    trigger: import('vue-types').VueTypeDef<"click" | "hover" | "focus" | "long-press" | "custom"> & {
+        default: "click" | "hover" | "focus" | "long-press" | "custom";
+    };
+    placement: import('vue-types').VueTypeDef<"bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end"> & {
+        default: "bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end";
+    };
+    arrow: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    offset: import('vue-types').VueTypeDef<import('../../hooks/components/use-popper').PopperOffset>;
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    beforeShowPopper: import('vue-types').VueTypeValidableDef<import('../../hooks/components/use-popper').BeforeShowPopper, import('vue-types/dist/types').ValidatorFunction<import('../../hooks/components/use-popper').BeforeShowPopper>>;
+}, {
+    referenceRef: import('vue').Ref<any>;
+    popperRef: import('vue').Ref<any>;
+    popperVisible: import('vue').Ref<boolean>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, Readonly<import('vue').ExtractPropTypes<{
+    trigger: import('vue-types').VueTypeDef<"click" | "hover" | "focus" | "long-press" | "custom"> & {
+        default: "click" | "hover" | "focus" | "long-press" | "custom";
+    };
+    placement: import('vue-types').VueTypeDef<"bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end"> & {
+        default: "bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end";
+    };
+    arrow: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    offset: import('vue-types').VueTypeDef<import('../../hooks/components/use-popper').PopperOffset>;
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    beforeShowPopper: import('vue-types').VueTypeValidableDef<import('../../hooks/components/use-popper').BeforeShowPopper, import('vue-types/dist/types').ValidatorFunction<import('../../hooks/components/use-popper').BeforeShowPopper>>;
+}>>, {
+    trigger: "click" | "hover" | "focus" | "long-press" | "custom";
+    placement: "bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end";
+    arrow: boolean;
+    disabled: boolean;
+}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $scopedSlots: S;
+    };
+};

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

@@ -0,0 +1,39 @@
+import { BeforeShowPopper, PopperOffset } from '../../hooks/components/use-popper';
+export declare const popperProps: () => {
+    /**
+     * 触发方式
+     * @default click
+     */
+    trigger: import('vue-types').VueTypeDef<"click" | "hover" | "focus" | "long-press" | "custom"> & {
+        default: "click" | "hover" | "focus" | "long-press" | "custom";
+    };
+    /**
+     * 弹层位置
+     * @default bottom
+     */
+    placement: import('vue-types').VueTypeDef<"bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end"> & {
+        default: "bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end";
+    };
+    /**
+     * 是否显示箭头
+     * @default false
+     */
+    arrow: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 偏移量
+     */
+    offset: import('vue-types').VueTypeDef<PopperOffset>;
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 显示弹层前回调
+     */
+    beforeShowPopper: import('vue-types').VueTypeValidableDef<BeforeShowPopper, import('vue-types/dist/types').ValidatorFunction<BeforeShowPopper>>;
+};

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

@@ -0,0 +1,233 @@
+import { PopupConfig, CustomClosePopup } from '../types';
+export declare const popupProps: () => {
+    /**
+     * 是否显示，支持 v-model
+     */
+    "v-model-key": import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 标题
+     * @default ''
+     */
+    title: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>> & {
+        default: string;
+    };
+    /**
+     * 标题样式
+     */
+    titleStyle: import('vue-types').VueTypeValidableDef<import('vue').CSSProperties, import('vue-types/dist/types').ValidatorFunction<import('vue').CSSProperties>> & {
+        default: () => import('vue').CSSProperties;
+    };
+    /**
+     * 背景模式
+     * @internal
+     */
+    backgroundMode: import('vue-types').VueTypeDef<"bg1">;
+    /**
+     * 背景
+     */
+    background: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>> & {
+        default: string;
+    };
+    /**
+     * 是否可以关闭
+     * @default true
+     */
+    closeable: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 是否显示返回按钮
+     */
+    backable: import('vue-types').VueTypeValidableDef<boolean | undefined, import('vue-types/dist/types').ValidatorFunction<boolean | undefined>>;
+    /**
+     * 是否显示头部
+     * @default true
+     */
+    showHeader: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 头部样式
+     */
+    headerStyle: import('vue-types').VueTypeValidableDef<import('vue').CSSProperties, import('vue-types/dist/types').ValidatorFunction<import('vue').CSSProperties>> & {
+        default: () => import('vue').CSSProperties;
+    };
+    /**
+     * 头部 className
+     */
+    headerClass: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>> & {
+        default: string;
+    };
+    /**
+     * 打开事件
+     */
+    openEvent: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>>;
+    /**
+     * 弹层位置，会根据设备类型自动选择位置
+     * @propType PopupPosition
+     */
+    position: import('vue-types').VueTypeDef<"center" | "bottom" | "left" | "right">;
+    /**
+     * 在屏幕横屏时，强制使用的位置
+     * @propType PopupPosition
+     * @default 'right'
+     */
+    horizontalScreenPosition: import('vue-types').VueTypeDef<"center" | "bottom" | "left" | "right"> & {
+        default: "center" | "bottom" | "left" | "right";
+    };
+    /**
+     * 在屏幕横屏时，弹层 className
+     */
+    horizontalScreenClassName: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>> & {
+        default: string;
+    };
+    /**
+     * 宽度
+     */
+    width: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>>;
+    /**
+     * 高度
+     */
+    height: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>>;
+    /**
+     * 主体最大高度
+     * @default 0.85
+     */
+    bodyMaxHeight: import('vue-types').VueTypeDef<string | number> & {
+        default: string | number;
+    };
+    /**
+     * 主体高度百分比
+     */
+    bodyHeightPercent: import('vue-types').VueTypeValidableDef<number, import('vue-types/dist/types').ValidatorFunction<number>>;
+    /**
+     * 是否使用滚动条动态高度，需要传入 bodyHeightPercent 后才生效，需要传入 bodyMaxHeight 且为 0～1 的数字后才生效
+     * @default false
+     */
+    dynamicHeight: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 是否填充主体
+     * @default false
+     */
+    fillBody: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 主体样式
+     */
+    bodyStyle: import('vue-types').VueTypeValidableDef<import('vue').CSSProperties, import('vue-types/dist/types').ValidatorFunction<import('vue').CSSProperties>> & {
+        default: () => import('vue').CSSProperties;
+    };
+    /**
+     * 插入到的节点
+     */
+    appendTo: import('vue-types').VueTypeDef<HTMLElement | undefined> & {
+        default: (() => HTMLElement) | undefined;
+    };
+    /**
+     * 是否显示遮罩层，开启 draggable 时，强制关闭
+     */
+    showModal: import('vue-types').VueTypeValidableDef<boolean | undefined, import('vue-types/dist/types').ValidatorFunction<boolean | undefined>>;
+    /**
+     * 点击遮罩是否关闭
+     * @default true
+     */
+    closeOnMask: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 弹层配置
+     */
+    popupConfig: import('vue-types').VueTypeValidableDef<PopupConfig, import('vue-types/dist/types').ValidatorFunction<PopupConfig>>;
+    /**
+     * 是否显示滚动条
+     * @default true
+     */
+    showScrollbar: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 自定义关闭弹层
+     */
+    customClose: import('vue-types').VueTypeValidableDef<CustomClosePopup, import('vue-types/dist/types').ValidatorFunction<CustomClosePopup>>;
+    /**
+     * 窗口是否可以拖拽
+     * @description 仅 PC 端在 position 为 center 时有效
+     * @default false
+     */
+    draggable: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 用于计算定位的元素
+     * @default ''
+     */
+    positionComputedElem: import('vue-types').VueTypeValidableDef<string, import('vue-types/dist/types').ValidatorFunction<string>> & {
+        default: string;
+    };
+    /**
+     * 打开后禁止 body 滚动
+     * @default false
+     */
+    bodyLocked: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 隐藏弹层阴影
+     * @default false
+     */
+    hiddenShadow: import('vue-types').VueTypeValidableDef<boolean, import('vue-types/dist/types').ValidatorFunction<boolean>> & {
+        default: boolean;
+    };
+    /**
+     * 弹层动画
+     * @default true
+     */
+    popupTransition: import('vue-types').VueTypeDef<string | boolean> & {
+        default: string | boolean;
+    };
+};
+export declare const popupEmits: () => {
+    /**
+     * 弹层动画离开之后
+     */
+    'after-leave': import('../../../vue-utils').EmitFuncType<void>;
+    /**
+     * 弹层动画进入之后
+     */
+    'after-enter': import('../../../vue-utils').EmitFuncType<void>;
+    /**
+     * 点击返回
+     */
+    'click-back': import('../../../vue-utils').EmitFuncType<void>;
+};
+export interface PopupSlots {
+    /**
+     * 头部插槽
+     */
+    header: void;
+    /**
+     * 头部右侧插槽
+     */
+    'header-right': void;
+    /**
+     * 标题插槽
+     */
+    title: void;
+    /**
+     * 内容前缀插槽
+     */
+    'content-suffix': void;
+    /**
+     * 内容插槽
+     */
+    '-': void;
+    /**
+     * 脚步插槽
+     */
+    footer: void;
+}

package/vue3/src/components/popup/hooks/use-popup-append.d.ts

@@ -0,0 +1,13 @@
+import { VueProps } from '../../../vue-utils';
+import { Ref } from 'vue';
+import { popupProps } from './popup-props';
+/**
+ * 弹层渲染节点 hook
+ */
+export declare const usePopupAppend: (options: {
+    props: VueProps<typeof popupProps>;
+    wrapRef: Ref<HTMLDivElement | undefined>;
+}) => {
+    popupAppendTo: import('vue').ComputedRef<HTMLElement | undefined>;
+    appendStyle: import('vue').ComputedRef<Record<string, string>>;
+};

package/vue3/src/components/popup/hooks/use-popup-back.d.ts

@@ -0,0 +1,13 @@
+import { VueEmit, VueProps } from '../../../vue-utils';
+import { popupEmits, popupProps } from './popup-props';
+import { PopupBackActionData } from '../types';
+export declare const usePopupBack: (options: {
+    props: VueProps<typeof popupProps>;
+    emit: VueEmit<typeof popupEmits>;
+    /** 调用关闭弹层 */
+    callbackCloseBody: () => void;
+}) => {
+    onClickBack: () => void;
+    showBack: import('vue').ComputedRef<boolean | undefined>;
+    setupBackAction: (data?: PopupBackActionData) => void;
+};

package/vue3/src/components/popup/hooks/use-popup-config.d.ts

@@ -0,0 +1,16 @@
+import { VueProps } from '../../../vue-utils';
+import { ComputedRef } from 'vue';
+import { PopupConfig } from '../types';
+export declare const popupConfigProps: () => {
+    /**
+     * 弹层配置
+     */
+    popupConfig: import('vue-types').VueTypeValidableDef<PopupConfig, import('vue-types/dist/types').ValidatorFunction<PopupConfig>>;
+};
+export interface PopupConfigInjectData {
+    popupConfig?: ComputedRef<PopupConfig | undefined>;
+}
+export declare const usePopupConfigProvide: (options: {
+    props: VueProps<typeof popupConfigProps>;
+}) => void;
+export declare const usePopupConfigInject: () => PopupConfigInjectData;

package/vue3/src/components/popup/hooks/use-popup-draggable.d.ts

@@ -0,0 +1,15 @@
+import { VueProps } from '../../../vue-utils';
+import { ComputedRef, Ref } from 'vue';
+import { popupProps } from './popup-props';
+import { PopupPosition } from '../types';
+export declare const usePopupDraggable: (options: {
+    props: VueProps<typeof popupProps>;
+    bodyRef: Ref<HTMLDivElement | undefined>;
+    headerRef: Ref<HTMLDivElement | undefined>;
+    bodyVisible: Ref<boolean>;
+    popupPosition: ComputedRef<PopupPosition>;
+}) => {
+    canDraggable: ComputedRef<boolean>;
+    draggableStyle: ComputedRef<Record<string, string>>;
+    resetPosition: () => void;
+};

package/vue3/src/components/popup/hooks/use-popup-height.d.ts

@@ -0,0 +1,25 @@
+import { VueProps } from '../../../vue-utils';
+import { ComputedRef, Ref } from 'vue';
+import { PopupPosition } from '../types';
+import { popupProps } from './popup-props';
+export declare const usePopupDynamicHeight: (options: {
+    props: VueProps<typeof popupProps>;
+    scrollRef: Ref<HTMLDivElement | undefined>;
+    popupPosition: ComputedRef<PopupPosition>;
+    wrapVisible: Ref<boolean>;
+}) => {
+    canDynamicHeight: ComputedRef<boolean | 0 | undefined>;
+    dynamicBodyHeightPercent: ComputedRef<number>;
+    reset: () => void;
+};
+/**
+ * 弹层高度 hook
+ */
+export declare const usePopupHeight: (options: {
+    props: VueProps<typeof popupProps>;
+    scrollRef: Ref<HTMLDivElement | undefined>;
+    popupPosition: ComputedRef<PopupPosition>;
+    wrapVisible: Ref<boolean>;
+}) => {
+    bodyHeightStyle: ComputedRef<Record<string, string>>;
+};

package/vue3/src/components/popup/hooks/use-popup-position.d.ts

@@ -0,0 +1,11 @@
+import { VueProps } from '../../../vue-utils';
+import { popupProps } from './popup-props';
+/**
+ * 弹层位置 hook
+ */
+export declare const usePopupPosition: (options: {
+    props: VueProps<typeof popupProps>;
+}) => {
+    popupPosition: import('vue').ComputedRef<"center" | "bottom" | "left" | "right">;
+    positionClass: import('vue').ComputedRef<string>;
+};

package/vue3/src/components/popup/hooks/use-popup-scroll.d.ts

@@ -0,0 +1,9 @@
+import { VueProps } from '../../../vue-utils';
+import { popupProps } from './popup-props';
+export declare const usePopupScroll: (options: {
+    props: VueProps<typeof popupProps>;
+}) => {
+    scrollRef: import('vue').Ref<HTMLDivElement | undefined>;
+    currentScrollTop: import('vue').Ref<number>;
+    resetScroll: () => Promise<void>;
+};

package/vue3/src/components/popup/hooks/use-popup-visible.d.ts

@@ -0,0 +1,15 @@
+import { VueEmit, VueProps } from '../../../vue-utils';
+import { popupEmits, popupProps } from './popup-props';
+export declare const usePopupVisible: (options: {
+    props: VueProps<typeof popupProps>;
+    emit: VueEmit<typeof popupEmits>;
+}) => {
+    wrapVisible: import('vue').Ref<boolean>;
+    bodyVisible: import('vue').Ref<boolean>;
+    onAfterLeave: () => void;
+    onAfterEnter: () => void;
+    openPopup: () => void;
+    closePopup: () => void;
+    closeBody: () => void;
+    onClickMask: () => void;
+};

package/vue3/src/components/popup/hooks/use-popup-width.d.ts

@@ -0,0 +1,10 @@
+import { VueProps } from '../../../vue-utils';
+import { popupProps } from './popup-props';
+import { PopupPosition } from '../types';
+import { ComputedRef } from 'vue';
+export declare const usePopupWidth: (options: {
+    props: VueProps<typeof popupProps>;
+    popupPosition: ComputedRef<PopupPosition>;
+}) => {
+    bodyWidthStyle: ComputedRef<Record<string, string>>;
+};

package/vue3/src/components/popup/index.d.ts

@@ -0,0 +1,4 @@
+export { default as PwcPopup } from './popup.vue';
+export * from './types';
+export * from './hooks/use-popup-config';
+export * from './hooks/popup-props';