@fit-screen/vue
Version:
Scale-based large-screen adaptive solution for Vue Everything is based on the design draft's px size, and the adaptation is done by scale, everything is so simple
136 lines (135 loc) • 4.05 kB
TypeScript
import type { PropType } from 'vue-demi';
import type { Scale } from '@fit-screen/shared';
declare const _default: import("vue-demi").DefineComponent<{
/**
* The design draft width
* @default 1920
*/
width: {
type: NumberConstructor;
default: number;
};
/**
* The design draft height
* @default 1080
*/
height: {
type: NumberConstructor;
default: number;
};
/**
* Calculation mode
*/
mode: {
type: PropType<"fit" | "scrollX" | "scrollY" | "full">;
default: string;
};
/**
* Represents the execution mode for calculating scaling ratio.
* - throttle: Uses a throttling mechanism to limit the execution frequency.
* - debounce: Uses a debouncing mechanism to delay execution until a certain period of inactivity.
* - none: Executes the function without any throttling or debouncing.
* @default 'throttle'
*/
executeMode: {
type: PropType<"none" | "throttle" | "debounce">;
default: string;
};
/**
* Represents the execution rate for debounce and throttle (unit: ms).
* @default 200
*/
waitTime: {
type: NumberConstructor;
default: number;
};
/**
* Adaptive container class
*/
scaleClass: {
type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
default: () => never[];
};
/**
* Adaptive container style
*/
scaleStyle: {
type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
default: () => never[];
};
}, {
showEntity: import("vue-demi").ComputedRef<boolean>;
previewRef: import("vue-demi").Ref<HTMLElement | undefined>;
entityRef: import("vue-demi").Ref<HTMLElement | undefined>;
previewRefStyle: import("vue-demi").ComputedRef<any[]>;
}, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {
scaleChange(payload: Scale): boolean;
}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
/**
* The design draft width
* @default 1920
*/
width: {
type: NumberConstructor;
default: number;
};
/**
* The design draft height
* @default 1080
*/
height: {
type: NumberConstructor;
default: number;
};
/**
* Calculation mode
*/
mode: {
type: PropType<"fit" | "scrollX" | "scrollY" | "full">;
default: string;
};
/**
* Represents the execution mode for calculating scaling ratio.
* - throttle: Uses a throttling mechanism to limit the execution frequency.
* - debounce: Uses a debouncing mechanism to delay execution until a certain period of inactivity.
* - none: Executes the function without any throttling or debouncing.
* @default 'throttle'
*/
executeMode: {
type: PropType<"none" | "throttle" | "debounce">;
default: string;
};
/**
* Represents the execution rate for debounce and throttle (unit: ms).
* @default 200
*/
waitTime: {
type: NumberConstructor;
default: number;
};
/**
* Adaptive container class
*/
scaleClass: {
type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
default: () => never[];
};
/**
* Adaptive container style
*/
scaleStyle: {
type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
default: () => never[];
};
}>> & {
onScaleChange?: ((payload: Scale) => any) | undefined;
}, {
width: number;
height: number;
mode: "fit" | "scrollX" | "scrollY" | "full";
executeMode: "none" | "throttle" | "debounce";
waitTime: number;
scaleClass: string | unknown[] | Record<string, any>;
scaleStyle: string | unknown[] | Record<string, any>;
}>;
export default _default;