@gx-design-vue/image 0.1.1 → 0.2.0-alpha.0

package/dist/ImagePreview/utils/KeyCode.d.ts

@@ -0,0 +1,438 @@
+//#region src/ImagePreview/utils/KeyCode.d.ts
+/**
+ * @ignore
+ * some key-codes definition and utils from closure-library
+ * @author yiminghe@gmail.com
+ */
+declare const KeyCode: {
+  /**
+   * MAC_ENTER
+   */
+  MAC_ENTER: number;
+  /**
+   * BACKSPACE
+   */
+  BACKSPACE: number;
+  /**
+   * TAB
+   */
+  TAB: number;
+  /**
+   * NUMLOCK on FF/Safari Mac
+   */
+  NUM_CENTER: number;
+  /**
+   * ENTER
+   */
+  ENTER: number;
+  /**
+   * SHIFT
+   */
+  SHIFT: number;
+  /**
+   * CTRL
+   */
+  CTRL: number;
+  /**
+   * ALT
+   */
+  ALT: number;
+  /**
+   * PAUSE
+   */
+  PAUSE: number;
+  /**
+   * CAPS_LOCK
+   */
+  CAPS_LOCK: number;
+  /**
+   * ESC
+   */
+  ESC: number;
+  /**
+   * SPACE
+   */
+  SPACE: number;
+  /**
+   * PAGE_UP
+   */
+  PAGE_UP: number;
+  /**
+   * PAGE_DOWN
+   */
+  PAGE_DOWN: number;
+  /**
+   * END
+   */
+  END: number;
+  /**
+   * HOME
+   */
+  HOME: number;
+  /**
+   * LEFT
+   */
+  LEFT: number;
+  /**
+   * UP
+   */
+  UP: number;
+  /**
+   * RIGHT
+   */
+  RIGHT: number;
+  /**
+   * DOWN
+   */
+  DOWN: number;
+  /**
+   * PRINT_SCREEN
+   */
+  PRINT_SCREEN: number;
+  /**
+   * INSERT
+   */
+  INSERT: number;
+  /**
+   * DELETE
+   */
+  DELETE: number;
+  /**
+   * ZERO
+   */
+  ZERO: number;
+  /**
+   * ONE
+   */
+  ONE: number;
+  /**
+   * TWO
+   */
+  TWO: number;
+  /**
+   * THREE
+   */
+  THREE: number;
+  /**
+   * FOUR
+   */
+  FOUR: number;
+  /**
+   * FIVE
+   */
+  FIVE: number;
+  /**
+   * SIX
+   */
+  SIX: number;
+  /**
+   * SEVEN
+   */
+  SEVEN: number;
+  /**
+   * EIGHT
+   */
+  EIGHT: number;
+  /**
+   * NINE
+   */
+  NINE: number;
+  /**
+   * QUESTION_MARK
+   */
+  QUESTION_MARK: number;
+  /**
+   * A
+   */
+  A: number;
+  /**
+   * B
+   */
+  B: number;
+  /**
+   * C
+   */
+  C: number;
+  /**
+   * D
+   */
+  D: number;
+  /**
+   * E
+   */
+  E: number;
+  /**
+   * F
+   */
+  F: number;
+  /**
+   * G
+   */
+  G: number;
+  /**
+   * H
+   */
+  H: number;
+  /**
+   * I
+   */
+  I: number;
+  /**
+   * J
+   */
+  J: number;
+  /**
+   * K
+   */
+  K: number;
+  /**
+   * L
+   */
+  L: number;
+  /**
+   * M
+   */
+  M: number;
+  /**
+   * N
+   */
+  N: number;
+  /**
+   * O
+   */
+  O: number;
+  /**
+   * P
+   */
+  P: number;
+  /**
+   * Q
+   */
+  Q: number;
+  /**
+   * R
+   */
+  R: number;
+  /**
+   * S
+   */
+  S: number;
+  /**
+   * T
+   */
+  T: number;
+  /**
+   * U
+   */
+  U: number;
+  /**
+   * V
+   */
+  V: number;
+  /**
+   * W
+   */
+  W: number;
+  /**
+   * X
+   */
+  X: number;
+  /**
+   * Y
+   */
+  Y: number;
+  /**
+   * Z
+   */
+  Z: number;
+  /**
+   * META
+   */
+  META: number;
+  /**
+   * WIN_KEY_RIGHT
+   */
+  WIN_KEY_RIGHT: number;
+  /**
+   * CONTEXT_MENU
+   */
+  CONTEXT_MENU: number;
+  /**
+   * NUM_ZERO
+   */
+  NUM_ZERO: number;
+  /**
+   * NUM_ONE
+   */
+  NUM_ONE: number;
+  /**
+   * NUM_TWO
+   */
+  NUM_TWO: number;
+  /**
+   * NUM_THREE
+   */
+  NUM_THREE: number;
+  /**
+   * NUM_FOUR
+   */
+  NUM_FOUR: number;
+  /**
+   * NUM_FIVE
+   */
+  NUM_FIVE: number;
+  /**
+   * NUM_SIX
+   */
+  NUM_SIX: number;
+  /**
+   * NUM_SEVEN
+   */
+  NUM_SEVEN: number;
+  /**
+   * NUM_EIGHT
+   */
+  NUM_EIGHT: number;
+  /**
+   * NUM_NINE
+   */
+  NUM_NINE: number;
+  /**
+   * NUM_MULTIPLY
+   */
+  NUM_MULTIPLY: number;
+  /**
+   * NUM_PLUS
+   */
+  NUM_PLUS: number;
+  /**
+   * NUM_MINUS
+   */
+  NUM_MINUS: number;
+  /**
+   * NUM_PERIOD
+   */
+  NUM_PERIOD: number;
+  /**
+   * NUM_DIVISION
+   */
+  NUM_DIVISION: number;
+  /**
+   * F1
+   */
+  F1: number;
+  /**
+   * F2
+   */
+  F2: number;
+  /**
+   * F3
+   */
+  F3: number;
+  /**
+   * F4
+   */
+  F4: number;
+  /**
+   * F5
+   */
+  F5: number;
+  /**
+   * F6
+   */
+  F6: number;
+  /**
+   * F7
+   */
+  F7: number;
+  /**
+   * F8
+   */
+  F8: number;
+  /**
+   * F9
+   */
+  F9: number;
+  /**
+   * F10
+   */
+  F10: number;
+  /**
+   * F11
+   */
+  F11: number;
+  /**
+   * F12
+   */
+  F12: number;
+  /**
+   * NUMLOCK
+   */
+  NUMLOCK: number;
+  /**
+   * SEMICOLON
+   */
+  SEMICOLON: number;
+  /**
+   * DASH
+   */
+  DASH: number;
+  /**
+   * EQUALS
+   */
+  EQUALS: number;
+  /**
+   * COMMA
+   */
+  COMMA: number;
+  /**
+   * PERIOD
+   */
+  PERIOD: number;
+  /**
+   * SLASH
+   */
+  SLASH: number;
+  /**
+   * APOSTROPHE
+   */
+  APOSTROPHE: number;
+  /**
+   * SINGLE_QUOTE
+   */
+  SINGLE_QUOTE: number;
+  /**
+   * OPEN_SQUARE_BRACKET
+   */
+  OPEN_SQUARE_BRACKET: number;
+  /**
+   * BACKSLASH
+   */
+  BACKSLASH: number;
+  /**
+   * CLOSE_SQUARE_BRACKET
+   */
+  CLOSE_SQUARE_BRACKET: number;
+  /**
+   * WIN_KEY
+   */
+  WIN_KEY: number;
+  /**
+   * MAC_FF_META
+   */
+  MAC_FF_META: number;
+  /**
+   * WIN_IME
+   */
+  WIN_IME: number;
+  /**
+   * whether text and modified key is entered at the same time.
+   */
+  isTextModifyingKeyEvent: (e: KeyboardEvent) => boolean;
+  /**
+   * whether character is entered.
+   */
+  isCharacterKey: (keyCode: number) => boolean;
+};
+//#endregion
+export { KeyCode as default };

package/dist/ImagePreview/utils/KeyCode.js

@@ -0,0 +1,173 @@
+//#region src/ImagePreview/utils/KeyCode.ts
+/**
+* @ignore
+* some key-codes definition and utils from closure-library
+* @author yiminghe@gmail.com
+*/
+const KeyCode = {
+	MAC_ENTER: 3,
+	BACKSPACE: 8,
+	TAB: 9,
+	NUM_CENTER: 12,
+	ENTER: 13,
+	SHIFT: 16,
+	CTRL: 17,
+	ALT: 18,
+	PAUSE: 19,
+	CAPS_LOCK: 20,
+	ESC: 27,
+	SPACE: 32,
+	PAGE_UP: 33,
+	PAGE_DOWN: 34,
+	END: 35,
+	HOME: 36,
+	LEFT: 37,
+	UP: 38,
+	RIGHT: 39,
+	DOWN: 40,
+	PRINT_SCREEN: 44,
+	INSERT: 45,
+	DELETE: 46,
+	ZERO: 48,
+	ONE: 49,
+	TWO: 50,
+	THREE: 51,
+	FOUR: 52,
+	FIVE: 53,
+	SIX: 54,
+	SEVEN: 55,
+	EIGHT: 56,
+	NINE: 57,
+	QUESTION_MARK: 63,
+	A: 65,
+	B: 66,
+	C: 67,
+	D: 68,
+	E: 69,
+	F: 70,
+	G: 71,
+	H: 72,
+	I: 73,
+	J: 74,
+	K: 75,
+	L: 76,
+	M: 77,
+	N: 78,
+	O: 79,
+	P: 80,
+	Q: 81,
+	R: 82,
+	S: 83,
+	T: 84,
+	U: 85,
+	V: 86,
+	W: 87,
+	X: 88,
+	Y: 89,
+	Z: 90,
+	META: 91,
+	WIN_KEY_RIGHT: 92,
+	CONTEXT_MENU: 93,
+	NUM_ZERO: 96,
+	NUM_ONE: 97,
+	NUM_TWO: 98,
+	NUM_THREE: 99,
+	NUM_FOUR: 100,
+	NUM_FIVE: 101,
+	NUM_SIX: 102,
+	NUM_SEVEN: 103,
+	NUM_EIGHT: 104,
+	NUM_NINE: 105,
+	NUM_MULTIPLY: 106,
+	NUM_PLUS: 107,
+	NUM_MINUS: 109,
+	NUM_PERIOD: 110,
+	NUM_DIVISION: 111,
+	F1: 112,
+	F2: 113,
+	F3: 114,
+	F4: 115,
+	F5: 116,
+	F6: 117,
+	F7: 118,
+	F8: 119,
+	F9: 120,
+	F10: 121,
+	F11: 122,
+	F12: 123,
+	NUMLOCK: 144,
+	SEMICOLON: 186,
+	DASH: 189,
+	EQUALS: 187,
+	COMMA: 188,
+	PERIOD: 190,
+	SLASH: 191,
+	APOSTROPHE: 192,
+	SINGLE_QUOTE: 222,
+	OPEN_SQUARE_BRACKET: 219,
+	BACKSLASH: 220,
+	CLOSE_SQUARE_BRACKET: 221,
+	WIN_KEY: 224,
+	MAC_FF_META: 224,
+	WIN_IME: 229,
+	isTextModifyingKeyEvent: function isTextModifyingKeyEvent(e) {
+		const { keyCode } = e;
+		if (e.altKey && !e.ctrlKey || e.metaKey || keyCode >= KeyCode.F1 && keyCode <= KeyCode.F12) return false;
+		switch (keyCode) {
+			case KeyCode.ALT:
+			case KeyCode.CAPS_LOCK:
+			case KeyCode.CONTEXT_MENU:
+			case KeyCode.CTRL:
+			case KeyCode.DOWN:
+			case KeyCode.END:
+			case KeyCode.ESC:
+			case KeyCode.HOME:
+			case KeyCode.INSERT:
+			case KeyCode.LEFT:
+			case KeyCode.MAC_FF_META:
+			case KeyCode.META:
+			case KeyCode.NUMLOCK:
+			case KeyCode.NUM_CENTER:
+			case KeyCode.PAGE_DOWN:
+			case KeyCode.PAGE_UP:
+			case KeyCode.PAUSE:
+			case KeyCode.PRINT_SCREEN:
+			case KeyCode.RIGHT:
+			case KeyCode.SHIFT:
+			case KeyCode.UP:
+			case KeyCode.WIN_KEY:
+			case KeyCode.WIN_KEY_RIGHT: return false;
+			default: return true;
+		}
+	},
+	isCharacterKey: function isCharacterKey(keyCode) {
+		if (keyCode >= KeyCode.ZERO && keyCode <= KeyCode.NINE) return true;
+		if (keyCode >= KeyCode.NUM_ZERO && keyCode <= KeyCode.NUM_MULTIPLY) return true;
+		if (keyCode >= KeyCode.A && keyCode <= KeyCode.Z) return true;
+		if (window.navigator.userAgent.includes("WebKit") && keyCode === 0) return true;
+		switch (keyCode) {
+			case KeyCode.SPACE:
+			case KeyCode.QUESTION_MARK:
+			case KeyCode.NUM_PLUS:
+			case KeyCode.NUM_MINUS:
+			case KeyCode.NUM_PERIOD:
+			case KeyCode.NUM_DIVISION:
+			case KeyCode.SEMICOLON:
+			case KeyCode.DASH:
+			case KeyCode.EQUALS:
+			case KeyCode.COMMA:
+			case KeyCode.PERIOD:
+			case KeyCode.SLASH:
+			case KeyCode.APOSTROPHE:
+			case KeyCode.SINGLE_QUOTE:
+			case KeyCode.OPEN_SQUARE_BRACKET:
+			case KeyCode.BACKSLASH:
+			case KeyCode.CLOSE_SQUARE_BRACKET: return true;
+			default: return false;
+		}
+	}
+};
+var KeyCode_default = KeyCode;
+
+//#endregion
+export { KeyCode_default as default };

package/dist/ImagePreview/utils/addEventListener.d.ts

@@ -0,0 +1,6 @@
+//#region src/ImagePreview/utils/addEventListener.d.ts
+declare function addEventListenerWrap(target: any, eventType: any, cb: any, option: any): {
+  remove: () => void;
+};
+//#endregion
+export { addEventListenerWrap as default };

package/dist/ImagePreview/utils/addEventListener.js

@@ -0,0 +1,22 @@
+//#region src/ImagePreview/utils/addEventListener.ts
+let supportsPassive = false;
+try {
+	const opts = Object.defineProperty({}, "passive", { get() {
+		supportsPassive = true;
+	} });
+	window.addEventListener("testPassive", null, opts);
+	window.removeEventListener("testPassive", null, opts);
+} catch (e) {}
+function addEventListenerWrap(target, eventType, cb, option) {
+	if (target && target.addEventListener) {
+		let opt = option;
+		if (opt === void 0 && supportsPassive && (eventType === "touchstart" || eventType === "touchmove" || eventType === "wheel")) opt = { passive: false };
+		target.addEventListener(eventType, cb, opt);
+	}
+	return { remove: () => {
+		if (target && target.removeEventListener) target.removeEventListener(eventType, cb);
+	} };
+}
+
+//#endregion
+export { addEventListenerWrap as default };

package/dist/ImagePreview/utils/util.d.ts

@@ -0,0 +1,7 @@
+//#region src/ImagePreview/utils/util.d.ts
+/** Scale the ratio base */
+declare const BASE_SCALE_RATIO = 1;
+/** The maximum zoom ratio when the mouse zooms in, adjustable */
+declare const WHEEL_MAX_SCALE_RATIO = 1;
+//#endregion
+export { BASE_SCALE_RATIO, WHEEL_MAX_SCALE_RATIO };

package/dist/ImagePreview/utils/util.js

@@ -0,0 +1,8 @@
+//#region src/ImagePreview/utils/util.ts
+/** Scale the ratio base */
+const BASE_SCALE_RATIO = 1;
+/** The maximum zoom ratio when the mouse zooms in, adjustable */
+const WHEEL_MAX_SCALE_RATIO = 1;
+
+//#endregion
+export { BASE_SCALE_RATIO, WHEEL_MAX_SCALE_RATIO };

package/dist/hooks/useFrameSetState.d.ts

@@ -0,0 +1,5 @@
+//#region src/hooks/useFrameSetState.d.ts
+type SetActionType<T> = Partial<T> | ((state: T) => Partial<T>);
+declare function useFrameSetState<T extends object>(initial: T): [Record<string, any>, (newState: SetActionType<T>) => void];
+//#endregion
+export { useFrameSetState as default };

package/dist/hooks/useFrameSetState.js

@@ -0,0 +1,33 @@
+import { onMounted, reactive, ref } from "vue";
+import { raf } from "@gx-design-vue/pro-utils";
+
+//#region src/hooks/useFrameSetState.ts
+function useFrameSetState(initial) {
+	const frame = ref(null);
+	const state = reactive({ ...initial });
+	const queue = ref([]);
+	const setFrameState = (newState) => {
+		if (frame.value === null) {
+			queue.value = [];
+			frame.value = raf(() => {
+				let memoState;
+				queue.value.forEach((queueState) => {
+					memoState = {
+						...memoState,
+						...queueState
+					};
+				});
+				Object.assign(state, memoState);
+				frame.value = null;
+			});
+		}
+		queue.value.push(newState);
+	};
+	onMounted(() => {
+		frame.value && raf.cancel(frame.value);
+	});
+	return [state, setFrameState];
+}
+
+//#endregion
+export { useFrameSetState as default };