vue-select-avatar
Version:
67 lines (66 loc) • 2.59 kB
TypeScript
import { ComputedRef, CSSProperties, Reactive, Ref } from 'vue';
import { ImageInfo, ImageSelectResult, PointPosition, Position, SimplePosition, ViewportProps } from './types';
export interface HookOptions {
props: ViewportProps;
pos: Reactive<Position>;
info: Ref<ImageInfo | undefined>;
imageMoving: Ref<boolean, boolean>;
viewMoving: Ref<boolean, boolean>;
viewResizing: Ref<boolean, boolean>;
viewportRef: Ref<HTMLElement | undefined>;
minImageScale: Ref<number>;
step: Ref<number>;
ctrlStep: Ref<number>;
shiftStep: Ref<number>;
pressCtrl: Ref<boolean>;
pressShift: Ref<boolean>;
isClipPathSupported: Ref<boolean>;
pointPosition: Ref<PointPosition | undefined>;
backing: Ref<boolean>;
elEmitter: HTMLElement;
showViewLayer: ComputedRef<boolean>;
}
export declare const useStyles: (options: HookOptions) => {
viewportStyle: CSSProperties;
maskStyle: CSSProperties;
viewStyle: CSSProperties;
imageStyle: CSSProperties;
innerImageStyle: CSSProperties;
consolesStyle: CSSProperties;
};
interface BackingOptions {
imageMoving: Ref<boolean>;
}
export declare const useBacking: (options: BackingOptions) => {
backing: Ref<boolean, boolean>;
handleTransitionEnd: () => void;
};
export declare const usePressKey: (key: string) => Ref<boolean, boolean>;
export declare const useCheckImageBack: (options: HookOptions) => {
checkImageBack: (transition?: boolean) => void;
};
export declare const useCheckViewPosition: (options: HookOptions) => {
checkViewPosition: () => void;
};
export declare const useResizeView: (options: HookOptions) => {
resizeView: (newPos: SimplePosition) => void;
};
export declare const useMouseHandles: (options: HookOptions) => {
handleMouseDown: (e: MouseEvent) => void;
handlePointMouseDown: (e: MouseEvent, position: PointPosition) => void;
handleViewMouseDown: (e: MouseEvent) => void;
};
export declare const useWheelHandles: (options: HookOptions) => {
handleWheel: (e: WheelEvent) => void;
};
export declare const useTouchHandles: (options: HookOptions) => {
handleTouchStart: (e: TouchEvent) => void;
handlePointTouchStart: (e: TouchEvent, position: PointPosition) => void;
handleViewTouchStart: (e: TouchEvent) => void;
};
export declare const useImageInfo: () => Ref<ImageInfo | undefined, ImageInfo | undefined>;
export declare const useInitPosition: (options: HookOptions) => {
initPosition: (res: ImageSelectResult) => void;
};
export declare const useKeyMove: (options: HookOptions) => void;
export {};