@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
661 lines • 70.9 kB
TypeScript
import { ImageViewerSlots } from './symbol';
declare function __VLS_template(): {
attrs: Partial<{}>;
slots: Readonly<ImageViewerSlots> & ImageViewerSlots;
refs: {
viewer: ({
$: import('vue').ComponentInternalInstance;
$data: {};
$props: Partial<{}> & Omit<{
readonly locale?: Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}> | undefined;
readonly inherit?: boolean | undefined;
readonly onReset?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onWheel?: ((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly width?: string | number | undefined;
readonly onMove?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly height?: string | number | undefined;
readonly noTransition?: boolean | undefined;
readonly actions?: import('../viewer').ViewerToolbarAction[] | undefined;
readonly moveDisabled?: boolean | undefined;
readonly zoomDisabled?: boolean | undefined;
readonly zoomDelta?: number | undefined;
readonly zoomMin?: number | undefined;
readonly zoomMax?: number | undefined;
readonly flipDisabled?: boolean | undefined;
readonly rotateDisabled?: boolean | undefined;
readonly rotateDelta?: number | undefined;
readonly fullDisabled?: boolean | undefined;
readonly toolbarFade?: number | boolean | undefined;
readonly centerScale?: boolean | undefined;
readonly onMoveStart?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onMoveEnd?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onRotate?: ((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipX?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipY?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onZoom?: ((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFull?: ((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly toolbarPlacement?: "bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
readonly actionLayout?: import('../viewer').ViewerActionLayout | undefined;
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>;
$attrs: {
[x: string]: unknown;
};
$refs: {
[x: string]: unknown;
} & {
viewer: HTMLDivElement;
container: HTMLDivElement;
transition: HTMLDivElement;
};
$slots: Readonly<{
[name: string]: import('vue').Slot<any> | undefined;
}>;
$root: import('vue').ComponentPublicInstance | null;
$parent: import('vue').ComponentPublicInstance | null;
$host: Element | null;
$emit: (event: string, ...args: any[]) => void;
$el: HTMLDivElement;
$options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, {
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
handleRotate: (deg: number, emit?: boolean) => void;
toggleFlipHorizontal: (target?: boolean, emit?: boolean) => void;
toggleFlipVertical: (target?: boolean, emit?: boolean) => void;
handleZoom: (ratio: number, emit?: boolean) => void;
toggleFull: (isFull?: boolean, emit?: boolean) => Promise<void>;
handleReset: (emit?: boolean) => void;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
beforeCreate?: (() => void) | (() => void)[];
created?: (() => void) | (() => void)[];
beforeMount?: (() => void) | (() => void)[];
mounted?: (() => void) | (() => void)[];
beforeUpdate?: (() => void) | (() => void)[];
updated?: (() => void) | (() => void)[];
activated?: (() => void) | (() => void)[];
deactivated?: (() => void) | (() => void)[];
beforeDestroy?: (() => void) | (() => void)[];
beforeUnmount?: (() => void) | (() => void)[];
destroyed?: (() => void) | (() => void)[];
unmounted?: (() => void) | (() => void)[];
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
};
$forceUpdate: () => void;
$nextTick: typeof import('vue').nextTick;
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
} & Readonly<{}> & Omit<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, "viewer" | "transition" | "container" | "state" | "moving" | "handleReset" | "fullSupported" | "handleRotate" | "toggleFlipHorizontal" | "toggleFlipVertical" | "handleZoom" | "toggleFull"> & import('vue').ShallowUnwrapRef<{
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
handleRotate: (deg: number, emit?: boolean) => void;
toggleFlipHorizontal: (target?: boolean, emit?: boolean) => void;
toggleFlipVertical: (target?: boolean, emit?: boolean) => void;
handleZoom: (ratio: number, emit?: boolean) => void;
toggleFull: (isFull?: boolean, emit?: boolean) => Promise<void>;
handleReset: (emit?: boolean) => void;
}> & {} & import('vue').ComponentCustomProperties & {} & {
$slots: Readonly<{
[action: `action-${string}`]: (params: {
state: import('../viewer').ViewerState;
}) => any;
default: (params: {
state: import('../viewer').ViewerState;
}) => any;
}> & {
[action: `action-${string}`]: (params: {
state: import('../viewer').ViewerState;
}) => any;
default: (params: {
state: import('../viewer').ViewerState;
}) => any;
};
}) | null;
};
rootEl: any;
};
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
active: import('vue').PropType<boolean>;
index: import('vue').PropType<number>;
srcList: import('vue').PropType<string | string[]>;
transfer: import('vue').PropType<string | boolean>;
viewerProps: import('vue').PropType<{} & {
locale?: Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}> | undefined;
inherit?: boolean | undefined;
onReset?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
onWheel?: ((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[] | undefined;
width?: string | number | undefined;
onMove?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
height?: string | number | undefined;
noTransition?: boolean | undefined;
actions?: import('../viewer').ViewerToolbarAction[] | undefined;
moveDisabled?: boolean | undefined;
zoomDisabled?: boolean | undefined;
zoomDelta?: number | undefined;
zoomMin?: number | undefined;
zoomMax?: number | undefined;
flipDisabled?: boolean | undefined;
rotateDisabled?: boolean | undefined;
rotateDelta?: number | undefined;
fullDisabled?: boolean | undefined;
toolbarFade?: number | boolean | undefined;
centerScale?: boolean | undefined;
onMoveStart?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
onMoveEnd?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
onRotate?: ((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[] | undefined;
onFlipX?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
onFlipY?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
onZoom?: ((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[] | undefined;
onFull?: ((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
toolbarPlacement?: "bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
actionLayout?: import('../viewer').ViewerActionLayout | undefined;
}>;
slots: import('vue').PropType<ImageViewerSlots>;
onToggle: import('vue').PropType<((active: boolean) => void) | ((active: boolean) => void)[]>;
onChange: import('vue').PropType<((index: number, src: string) => void) | ((index: number, src: string) => void)[]>;
onPrev: import('vue').PropType<((index: number, src: string) => void) | ((index: number, src: string) => void)[]>;
onNext: import('vue').PropType<((index: number, src: string) => void) | ((index: number, src: string) => void)[]>;
onClose: import('vue').PropType<import('@vexip-ui/config').AnyFunction | import('@vexip-ui/config').AnyFunction[]>;
onShow: import('vue').PropType<import('@vexip-ui/config').AnyFunction | import('@vexip-ui/config').AnyFunction[]>;
onHide: import('vue').PropType<import('@vexip-ui/config').AnyFunction | import('@vexip-ui/config').AnyFunction[]>;
}>, {
currentActive: import('vue').Ref<boolean, boolean>;
currentIndex: import('vue').Ref<number, number>;
prevDisabled: import('vue').ComputedRef<boolean>;
nextDisabled: import('vue').ComputedRef<boolean>;
viewer: import('vue').Ref<({
$: import('vue').ComponentInternalInstance;
$data: {};
$props: Partial<{}> & Omit<{
readonly locale?: Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}> | undefined;
readonly inherit?: boolean | undefined;
readonly onReset?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onWheel?: ((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly width?: string | number | undefined;
readonly onMove?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly height?: string | number | undefined;
readonly noTransition?: boolean | undefined;
readonly actions?: import('../viewer').ViewerToolbarAction[] | undefined;
readonly moveDisabled?: boolean | undefined;
readonly zoomDisabled?: boolean | undefined;
readonly zoomDelta?: number | undefined;
readonly zoomMin?: number | undefined;
readonly zoomMax?: number | undefined;
readonly flipDisabled?: boolean | undefined;
readonly rotateDisabled?: boolean | undefined;
readonly rotateDelta?: number | undefined;
readonly fullDisabled?: boolean | undefined;
readonly toolbarFade?: number | boolean | undefined;
readonly centerScale?: boolean | undefined;
readonly onMoveStart?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onMoveEnd?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onRotate?: ((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipX?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipY?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onZoom?: ((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFull?: ((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly toolbarPlacement?: "bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
readonly actionLayout?: import('../viewer').ViewerActionLayout | undefined;
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>;
$attrs: {
[x: string]: unknown;
};
$refs: {
[x: string]: unknown;
} & {
viewer: HTMLDivElement;
container: HTMLDivElement;
transition: HTMLDivElement;
};
$slots: Readonly<{
[name: string]: import('vue').Slot<any> | undefined;
}>;
$root: import('vue').ComponentPublicInstance | null;
$parent: import('vue').ComponentPublicInstance | null;
$host: Element | null;
$emit: (event: string, ...args: any[]) => void;
$el: HTMLDivElement;
$options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, {
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
handleRotate: (deg: number, emit?: boolean) => void;
toggleFlipHorizontal: (target?: boolean, emit?: boolean) => void;
toggleFlipVertical: (target?: boolean, emit?: boolean) => void;
handleZoom: (ratio: number, emit?: boolean) => void;
toggleFull: (isFull?: boolean, emit?: boolean) => Promise<void>;
handleReset: (emit?: boolean) => void;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
beforeCreate?: (() => void) | (() => void)[];
created?: (() => void) | (() => void)[];
beforeMount?: (() => void) | (() => void)[];
mounted?: (() => void) | (() => void)[];
beforeUpdate?: (() => void) | (() => void)[];
updated?: (() => void) | (() => void)[];
activated?: (() => void) | (() => void)[];
deactivated?: (() => void) | (() => void)[];
beforeDestroy?: (() => void) | (() => void)[];
beforeUnmount?: (() => void) | (() => void)[];
destroyed?: (() => void) | (() => void)[];
unmounted?: (() => void) | (() => void)[];
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
};
$forceUpdate: () => void;
$nextTick: typeof import('vue').nextTick;
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
} & Readonly<{}> & Omit<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, "viewer" | "transition" | "container" | "state" | "moving" | "handleReset" | "fullSupported" | "handleRotate" | "toggleFlipHorizontal" | "toggleFlipVertical" | "handleZoom" | "toggleFull"> & import('vue').ShallowUnwrapRef<{
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
handleRotate: (deg: number, emit?: boolean) => void;
toggleFlipHorizontal: (target?: boolean, emit?: boolean) => void;
toggleFlipVertical: (target?: boolean, emit?: boolean) => void;
handleZoom: (ratio: number, emit?: boolean) => void;
toggleFull: (isFull?: boolean, emit?: boolean) => Promise<void>;
handleReset: (emit?: boolean) => void;
}> & {} & import('vue').ComponentCustomProperties & {} & {
$slots: Readonly<{
[action: `action-${string}`]: (params: {
state: import('../viewer').ViewerState;
}) => any;
default: (params: {
state: import('../viewer').ViewerState;
}) => any;
}> & {
[action: `action-${string}`]: (params: {
state: import('../viewer').ViewerState;
}) => any;
default: (params: {
state: import('../viewer').ViewerState;
}) => any;
};
}) | undefined, ({
$: import('vue').ComponentInternalInstance;
$data: {};
$props: Partial<{}> & Omit<{
readonly locale?: Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}> | undefined;
readonly inherit?: boolean | undefined;
readonly onReset?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onWheel?: ((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly width?: string | number | undefined;
readonly onMove?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly height?: string | number | undefined;
readonly noTransition?: boolean | undefined;
readonly actions?: import('../viewer').ViewerToolbarAction[] | undefined;
readonly moveDisabled?: boolean | undefined;
readonly zoomDisabled?: boolean | undefined;
readonly zoomDelta?: number | undefined;
readonly zoomMin?: number | undefined;
readonly zoomMax?: number | undefined;
readonly flipDisabled?: boolean | undefined;
readonly rotateDisabled?: boolean | undefined;
readonly rotateDelta?: number | undefined;
readonly fullDisabled?: boolean | undefined;
readonly toolbarFade?: number | boolean | undefined;
readonly centerScale?: boolean | undefined;
readonly onMoveStart?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onMoveEnd?: ((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onRotate?: ((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipX?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFlipY?: ((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onZoom?: ((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly onFull?: ((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[] | undefined;
readonly toolbarPlacement?: "bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
readonly actionLayout?: import('../viewer').ViewerActionLayout | undefined;
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>;
$attrs: {
[x: string]: unknown;
};
$refs: {
[x: string]: unknown;
} & {
viewer: HTMLDivElement;
container: HTMLDivElement;
transition: HTMLDivElement;
};
$slots: Readonly<{
[name: string]: import('vue').Slot<any> | undefined;
}>;
$root: import('vue').ComponentPublicInstance | null;
$parent: import('vue').ComponentPublicInstance | null;
$host: Element | null;
$emit: (event: string, ...args: any[]) => void;
$el: HTMLDivElement;
$options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, {
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
handleRotate: (deg: number, emit?: boolean) => void;
toggleFlipHorizontal: (target?: boolean, emit?: boolean) => void;
toggleFlipVertical: (target?: boolean, emit?: boolean) => void;
handleZoom: (ratio: number, emit?: boolean) => void;
toggleFull: (isFull?: boolean, emit?: boolean) => Promise<void>;
handleReset: (emit?: boolean) => void;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
beforeCreate?: (() => void) | (() => void)[];
created?: (() => void) | (() => void)[];
beforeMount?: (() => void) | (() => void)[];
mounted?: (() => void) | (() => void)[];
beforeUpdate?: (() => void) | (() => void)[];
updated?: (() => void) | (() => void)[];
activated?: (() => void) | (() => void)[];
deactivated?: (() => void) | (() => void)[];
beforeDestroy?: (() => void) | (() => void)[];
beforeUnmount?: (() => void) | (() => void)[];
destroyed?: (() => void) | (() => void)[];
unmounted?: (() => void) | (() => void)[];
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
};
$forceUpdate: () => void;
$nextTick: typeof import('vue').nextTick;
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
} & Readonly<{}> & Omit<Readonly<import('vue').ExtractPropTypes<{
inherit: import('vue').PropType<boolean>;
locale: import('vue').PropType<Partial<{
rotateRight: string;
rotateLeft: string;
flipHorizontal: string;
flipVertical: string;
zoomIn: string;
zoomOut: string;
fullScreen: string;
fullScreenExit: string;
reset: string;
}>>;
width: import('vue').PropType<string | number>;
height: import('vue').PropType<string | number>;
moveDisabled: import('vue').PropType<boolean>;
zoomDisabled: import('vue').PropType<boolean>;
zoomDelta: import('vue').PropType<number>;
zoomMin: import('vue').PropType<number>;
zoomMax: import('vue').PropType<number>;
flipDisabled: import('vue').PropType<boolean>;
rotateDisabled: import('vue').PropType<boolean>;
rotateDelta: import('vue').PropType<number>;
fullDisabled: import('vue').PropType<boolean>;
toolbarPlacement: import('vue').PropType<"bottom" | "top" | "right" | "left" | "bottom-start" | "bottom-end" | "top-start" | "top-end" | "right-start" | "right-end" | "left-start" | "left-end">;
actions: import('vue').PropType<import('../viewer').ViewerToolbarAction[]>;
toolbarFade: import('vue').PropType<number | boolean>;
noTransition: import('vue').PropType<boolean>;
centerScale: import('vue').PropType<boolean>;
actionLayout: import('vue').PropType<import('../viewer').ViewerActionLayout>;
onMoveStart: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMove: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onMoveEnd: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
onWheel: import('vue').PropType<((sign: 1 | -1, state: import('../viewer').ViewerState) => void) | ((sign: 1 | -1, state: import('../viewer').ViewerState) => void)[]>;
onRotate: import('vue').PropType<((deg: number, state: import('../viewer').ViewerState) => void) | ((deg: number, state: import('../viewer').ViewerState) => void)[]>;
onFlipX: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onFlipY: import('vue').PropType<((flip: boolean, state: import('../viewer').ViewerState) => void) | ((flip: boolean, state: import('../viewer').ViewerState) => void)[]>;
onZoom: import('vue').PropType<((zoom: number, state: import('../viewer').ViewerState) => void) | ((zoom: number, state: import('../viewer').ViewerState) => void)[]>;
onFull: import('vue').PropType<((full: boolean, state: import('../viewer').ViewerState) => void) | ((full: boolean, state: import('../viewer').ViewerState) => void)[]>;
onReset: import('vue').PropType<((state: import('../viewer').ViewerState) => void) | ((state: import('../viewer').ViewerState) => void)[]>;
}>> & Readonly<{}>, "viewer" | "transition" | "container" | "state" | "moving" | "handleReset" | "fullSupported" | "handleRotate" | "toggleFlipHorizontal" | "toggleFlipVertical" | "handleZoom" | "toggleFull"> & import('vue').ShallowUnwrapRef<{
moving: import('vue').ComputedRef<boolean>;
fullSupported: boolean;
state: import('../viewer').ViewerState;
viewer: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
container: import('vue').Ref<HTMLElement | null | undefined, HTMLElement | null | undefined>;
transition: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
han