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

package/dist/image.esm.js

@@ -0,0 +1,2374 @@
+import { Fragment, Teleport, Transition, cloneVNode, computed, createVNode, defineComponent, getCurrentInstance, getCurrentScope, hasInjectionContext, inject, isRef, isVNode, mergeProps, nextTick, onMounted, onUnmounted, reactive, ref, shallowRef, toRef, toValue, unref, vShow, watch, watchEffect, withDirectives } from "vue";
+import { CloseOutlined, EyeOutlined, LeftOutlined, RightOutlined, RotateLeftOutlined, RotateRightOutlined, SwapOutlined, ZoomInOutlined, ZoomOutOutlined } from "@ant-design/icons-vue";
+import { FastColor, Keyframe, getTransitionProps, mergeToken, unit, useProStyle, useStyle } from "@gx-design-vue/pro-provider";
+typeof process < "u" && process.versions != null && process.versions.node;
+function is(e, t) {
+	return Object.prototype.toString.call(e) === `[object ${t}]`;
+}
+function isBoolean(e) {
+	return typeof e == "boolean";
+}
+function isNumber(e) {
+	return typeof e == "number";
+}
+function isArray(e) {
+	return Array.isArray === void 0 ? Object.prototype.toString.call(e) === "[object Array]" : Array.isArray(e);
+}
+function isObject$1(e) {
+	return e !== null && is(e, "Object");
+}
+function isString(e) {
+	return typeof e == "string";
+}
+var isServer = typeof window > "u";
+function getPrefixCls({ suffixCls: e, customizePrefixCls: t, isPor: n, className: r }) {
+	let i = r || (n ? "gx-pro" : "gx");
+	return t || (e ? `${i}-${e}` : i);
+}
+var raf = (e) => setTimeout(e, 16), caf = (e) => clearTimeout(e);
+typeof window < "u" && "requestAnimationFrame" in window && (raf = (e) => window.requestAnimationFrame(e), caf = (e) => window.cancelAnimationFrame(e));
+var rafUUID = 0, rafIds = /* @__PURE__ */ new Map();
+function cleanup(e) {
+	rafIds.delete(e);
+}
+function wrapperRaf(e, t = 1) {
+	rafUUID += 1;
+	let n = rafUUID;
+	function r(t) {
+		if (t === 0) cleanup(n), e();
+		else {
+			let e = raf(() => {
+				r(t - 1);
+			});
+			rafIds.set(n, e);
+		}
+	}
+	return r(t), n;
+}
+wrapperRaf.cancel = (e) => {
+	let t = rafIds.get(e);
+	return cleanup(t), caf(t);
+};
+function camelize$1(e) {
+	return e.replace(/[-_](.)/g, (e, t) => t.toUpperCase());
+}
+function getStyle(e, t) {
+	if (isServer || !e || !t) return "";
+	t = camelize$1(t), t === "float" && (t = "cssFloat");
+	try {
+		let n = e.style[t];
+		if (n) return n;
+		let r = document?.defaultView?.getComputedStyle(e, "");
+		return r ? r[t] : "";
+	} catch {
+		return e.style[t];
+	}
+}
+function isScroll(e, t) {
+	if (!isServer) return (t == null ? getStyle(e, "overflow") : t ? getStyle(e, "overflow-y") : getStyle(e, "overflow-x")).match(/(scroll|auto|overlay)/);
+}
+function getScrollContainer(e, t) {
+	if (isServer) return;
+	let n = e;
+	for (; n;) {
+		if ([
+			window,
+			document,
+			document.documentElement
+		].includes(n)) return window;
+		if (isScroll(n, t)) return n;
+		n = n.parentNode;
+	}
+	return n;
+}
+function isInContainer(e, t) {
+	if (isServer || !e || !t) return !1;
+	let n = e.getBoundingClientRect(), r;
+	return r = [
+		window,
+		document,
+		document.documentElement,
+		null,
+		void 0
+	].includes(t) ? {
+		top: 0,
+		right: window.innerWidth,
+		bottom: window.innerHeight,
+		left: 0
+	} : t.getBoundingClientRect(), n.top < r.bottom && n.bottom > r.top && n.right > r.left && n.left < r.right;
+}
+function classNames(...e) {
+	let t = [];
+	for (let n = 0; n < e.length; n++) {
+		let r = e[n];
+		if (r) {
+			if (isString(r)) t.push(r);
+			else if (isArray(r)) for (let e = 0; e < r.length; e++) {
+				let n = classNames(r[e]);
+				n && t.push(n);
+			}
+			else if (isObject$1(r)) for (let e in r) r[e] && t.push(e);
+		}
+	}
+	return t.filter((e) => e).join(" ");
+}
+var classNames_default = classNames;
+function slotRender({ vnode: e, defaultVNode: t }, ...n) {
+	return e === !1 ? null : typeof e == "function" ? e?.(...n) : e || t;
+}
+function getSlot(e, ...t) {
+	let { slots: n, key: r = "default", render: i, props: a, defaultChildren: o } = e, s, c = a[r], l = n?.[r], u = typeof o == "function" ? o?.() : o;
+	return s = c === !1 ? !1 : c === !0 ? l ?? u : isObject$1(c) && i ? isVNode(c) ? c : l : c || l, s === !1 ? !1 : i ? slotRender({
+		vnode: s,
+		defaultVNode: u
+	}, ...t) : s;
+}
+function getSlotVNode(e, ...t) {
+	let { slots: n, key: r = "default", props: i, defaultChildren: a } = e, o, s = i[r], c = n?.[r]?.(...t), l = typeof a == "function" ? a?.() : a;
+	return o = s === !1 ? !1 : s === !0 ? c ?? l : isObject$1(s) ? isVNode(s) ? s : c : s || c, o === !1 ? !1 : slotRender({
+		vnode: o,
+		defaultVNode: l
+	}, ...t);
+}
+function getSlotsProps(e, ...t) {
+	let { slots: n, props: r, keys: i, render: a, defaultVNodes: o } = e, s = {};
+	return i.forEach((e, i) => {
+		let c = o ? o[i] : null, l = a ? getSlotVNode({
+			slots: n,
+			props: r,
+			key: e,
+			defaultChildren: c
+		}, ...t) : getSlot({
+			slots: n,
+			props: r,
+			key: e,
+			render: !1,
+			defaultChildren: c
+		}, ...t);
+		(isBoolean(l) || l) && (s[e] = l);
+	}), s;
+}
+var localProvidedStateMap = /* @__PURE__ */ new WeakMap(), injectLocal = (...e) => {
+	let t = e[0], n = getCurrentInstance()?.proxy ?? getCurrentScope();
+	if (n == null && !hasInjectionContext()) throw Error("injectLocal must be called in setup");
+	return n && localProvidedStateMap.has(n) && t in localProvidedStateMap.get(n) ? localProvidedStateMap.get(n)[t] : inject(...e);
+}, isClient = typeof window < "u" && typeof document < "u";
+typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
+var toString = Object.prototype.toString, isObject = (e) => toString.call(e) === "[object Object]", noop$1 = () => {};
+function createFilterWrapper(e, t) {
+	function n(...n) {
+		return new Promise((r, i) => {
+			Promise.resolve(e(() => t.apply(this, n), {
+				fn: t,
+				thisArg: this,
+				args: n
+			})).then(r).catch(i);
+		});
+	}
+	return n;
+}
+function throttleFilter(...e) {
+	let t = 0, n, r = !0, i = noop$1, a, o, s, c, l;
+	!isRef(e[0]) && typeof e[0] == "object" ? {delay: o, trailing: s = !0, leading: c = !0, rejectOnCancel: l = !1} = e[0] : [o, s = !0, c = !0, l = !1] = e;
+	let u = () => {
+		n && (clearTimeout(n), n = void 0, i(), i = noop$1);
+	};
+	return (e) => {
+		let d = toValue(o), f = Date.now() - t, p = () => a = e();
+		return u(), d <= 0 ? (t = Date.now(), p()) : (f > d ? (t = Date.now(), (c || !r) && p()) : s && (a = new Promise((e, a) => {
+			i = l ? a : e, n = setTimeout(() => {
+				t = Date.now(), r = !0, e(p()), u();
+			}, Math.max(0, d - f));
+		})), !c && !n && (n = setTimeout(() => r = !0, d)), r = !1, a);
+	};
+}
+function pxValue(e) {
+	return e.endsWith("rem") ? Number.parseFloat(e) * 16 : Number.parseFloat(e);
+}
+function toArray(e) {
+	return Array.isArray(e) ? e : [e];
+}
+function getLifeCycleTarget(e) {
+	return e || getCurrentInstance();
+}
+function useThrottleFn(e, t = 200, n = !1, r = !0, i = !1) {
+	return createFilterWrapper(throttleFilter(t, n, r, i), e);
+}
+function tryOnMounted(e, t = !0, n) {
+	getLifeCycleTarget(n) ? onMounted(e, n) : t ? e() : nextTick(e);
+}
+function watchImmediate(e, t, n) {
+	return watch(e, t, {
+		...n,
+		immediate: !0
+	});
+}
+var defaultWindow = isClient ? window : void 0;
+isClient && window.document, isClient && window.navigator, isClient && window.location;
+function unrefElement(e) {
+	let t = toValue(e);
+	return t?.$el ?? t;
+}
+function useEventListener(...e) {
+	let t = (e, t, n, r) => (e.addEventListener(t, n, r), () => e.removeEventListener(t, n, r)), n = computed(() => {
+		let t = toArray(toValue(e[0])).filter((e) => e != null);
+		return t.every((e) => typeof e != "string") ? t : void 0;
+	});
+	return watchImmediate(() => [
+		n.value?.map((e) => unrefElement(e)) ?? [defaultWindow].filter((e) => e != null),
+		toArray(toValue(n.value ? e[1] : e[0])),
+		toArray(unref(n.value ? e[2] : e[1])),
+		toValue(n.value ? e[3] : e[2])
+	], ([e, n, r, i], a, o) => {
+		if (!e?.length || !n?.length || !r?.length) return;
+		let s = isObject(i) ? { ...i } : i, c = e.flatMap((e) => n.flatMap((n) => r.map((r) => t(e, n, r, s))));
+		o(() => {
+			c.forEach((e) => e());
+		});
+	}, { flush: "post" });
+}
+function useMounted() {
+	let e = shallowRef(!1), t = getCurrentInstance();
+	return t && onMounted(() => {
+		e.value = !0;
+	}, t), e;
+}
+/* @__NO_SIDE_EFFECTS__ */
+function useSupported(e) {
+	let t = useMounted();
+	return computed(() => (t.value, !!e()));
+}
+var ssrWidthSymbol = Symbol("vueuse-ssr-width");
+/* @__NO_SIDE_EFFECTS__ */
+function useSSRWidth() {
+	let e = hasInjectionContext() ? injectLocal(ssrWidthSymbol, null) : null;
+	return typeof e == "number" ? e : void 0;
+}
+function useMediaQuery(e, t = {}) {
+	let { window: n = defaultWindow, ssrWidth: r = /* @__PURE__ */ useSSRWidth() } = t, a = /* @__PURE__ */ useSupported(() => n && "matchMedia" in n && typeof n.matchMedia == "function"), o = shallowRef(typeof r == "number"), s = shallowRef(), c = shallowRef(!1);
+	return watchEffect(() => {
+		if (o.value) {
+			o.value = !a.value, c.value = toValue(e).split(",").some((e) => {
+				let t = e.includes("not all"), n = e.match(/\(\s*min-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/), i = e.match(/\(\s*max-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/), a = !!(n || i);
+				return n && a && (a = r >= pxValue(n[1])), i && a && (a = r <= pxValue(i[1])), t ? !a : a;
+			});
+			return;
+		}
+		a.value && (s.value = n.matchMedia(toValue(e)), c.value = s.value.matches);
+	}), useEventListener(s, "change", (e) => {
+		c.value = e.matches;
+	}, { passive: !0 }), computed(() => c.value);
+}
+function useWindowSize(e = {}) {
+	let { window: t = defaultWindow, initialWidth: n = Infinity, initialHeight: r = Infinity, listenOrientation: i = !0, includeScrollbar: a = !0, type: o = "inner" } = e, s = shallowRef(n), c = shallowRef(r), l = () => {
+		if (t) if (o === "outer") s.value = t.outerWidth, c.value = t.outerHeight;
+		else if (o === "visual" && t.visualViewport) {
+			let { width: e, height: n, scale: r } = t.visualViewport;
+			s.value = Math.round(e * r), c.value = Math.round(n * r);
+		} else a ? (s.value = t.innerWidth, c.value = t.innerHeight) : (s.value = t.document.documentElement.clientWidth, c.value = t.document.documentElement.clientHeight);
+	};
+	l(), tryOnMounted(l);
+	let u = { passive: !0 };
+	return useEventListener("resize", l, u), t && o === "visual" && t.visualViewport && useEventListener(t.visualViewport, "resize", l, u), i && watch(useMediaQuery("(orientation: portrait)"), () => l()), {
+		width: s,
+		height: c
+	};
+}
+function noop() {}
+function isPrimitive(e) {
+	return e == null || typeof e != "object" && typeof e != "function";
+}
+function isTypedArray(e) {
+	return ArrayBuffer.isView(e) && !(e instanceof DataView);
+}
+function getSymbols(e) {
+	return Object.getOwnPropertySymbols(e).filter((t) => Object.prototype.propertyIsEnumerable.call(e, t));
+}
+function getTag(e) {
+	return e == null ? e === void 0 ? "[object Undefined]" : "[object Null]" : Object.prototype.toString.call(e);
+}
+var regexpTag = "[object RegExp]", stringTag = "[object String]", numberTag = "[object Number]", booleanTag = "[object Boolean]", argumentsTag = "[object Arguments]", symbolTag = "[object Symbol]", dateTag = "[object Date]", mapTag = "[object Map]", setTag = "[object Set]", arrayTag = "[object Array]", functionTag = "[object Function]", arrayBufferTag = "[object ArrayBuffer]", objectTag = "[object Object]", errorTag = "[object Error]", dataViewTag = "[object DataView]", uint8ArrayTag = "[object Uint8Array]", uint8ClampedArrayTag = "[object Uint8ClampedArray]", uint16ArrayTag = "[object Uint16Array]", uint32ArrayTag = "[object Uint32Array]", bigUint64ArrayTag = "[object BigUint64Array]", int8ArrayTag = "[object Int8Array]", int16ArrayTag = "[object Int16Array]", int32ArrayTag = "[object Int32Array]", bigInt64ArrayTag = "[object BigInt64Array]", float32ArrayTag = "[object Float32Array]", float64ArrayTag = "[object Float64Array]";
+function cloneDeepWithImpl(e, t, n, r = /* @__PURE__ */ new Map(), i = void 0) {
+	let a = i?.(e, t, n, r);
+	if (a !== void 0) return a;
+	if (isPrimitive(e)) return e;
+	if (r.has(e)) return r.get(e);
+	if (Array.isArray(e)) {
+		let t = Array(e.length);
+		r.set(e, t);
+		for (let a = 0; a < e.length; a++) t[a] = cloneDeepWithImpl(e[a], a, n, r, i);
+		return Object.hasOwn(e, "index") && (t.index = e.index), Object.hasOwn(e, "input") && (t.input = e.input), t;
+	}
+	if (e instanceof Date) return new Date(e.getTime());
+	if (e instanceof RegExp) {
+		let t = new RegExp(e.source, e.flags);
+		return t.lastIndex = e.lastIndex, t;
+	}
+	if (e instanceof Map) {
+		let t = /* @__PURE__ */ new Map();
+		r.set(e, t);
+		for (let [a, o] of e) t.set(a, cloneDeepWithImpl(o, a, n, r, i));
+		return t;
+	}
+	if (e instanceof Set) {
+		let t = /* @__PURE__ */ new Set();
+		r.set(e, t);
+		for (let a of e) t.add(cloneDeepWithImpl(a, void 0, n, r, i));
+		return t;
+	}
+	if (typeof Buffer < "u" && Buffer.isBuffer(e)) return e.subarray();
+	if (isTypedArray(e)) {
+		let t = new (Object.getPrototypeOf(e)).constructor(e.length);
+		r.set(e, t);
+		for (let a = 0; a < e.length; a++) t[a] = cloneDeepWithImpl(e[a], a, n, r, i);
+		return t;
+	}
+	if (e instanceof ArrayBuffer || typeof SharedArrayBuffer < "u" && e instanceof SharedArrayBuffer) return e.slice(0);
+	if (e instanceof DataView) {
+		let t = new DataView(e.buffer.slice(0), e.byteOffset, e.byteLength);
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (typeof File < "u" && e instanceof File) {
+		let t = new File([e], e.name, { type: e.type });
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (typeof Blob < "u" && e instanceof Blob) {
+		let t = new Blob([e], { type: e.type });
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (e instanceof Error) {
+		let t = new e.constructor();
+		return r.set(e, t), t.message = e.message, t.name = e.name, t.stack = e.stack, t.cause = e.cause, copyProperties(t, e, n, r, i), t;
+	}
+	if (e instanceof Boolean) {
+		let t = new Boolean(e.valueOf());
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (e instanceof Number) {
+		let t = new Number(e.valueOf());
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (e instanceof String) {
+		let t = new String(e.valueOf());
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	if (typeof e == "object" && isCloneableObject(e)) {
+		let t = Object.create(Object.getPrototypeOf(e));
+		return r.set(e, t), copyProperties(t, e, n, r, i), t;
+	}
+	return e;
+}
+function copyProperties(e, t, n = e, r, i) {
+	let a = [...Object.keys(t), ...getSymbols(t)];
+	for (let o = 0; o < a.length; o++) {
+		let s = a[o], c = Object.getOwnPropertyDescriptor(e, s);
+		(c == null || c.writable) && (e[s] = cloneDeepWithImpl(t[s], s, n, r, i));
+	}
+}
+function isCloneableObject(e) {
+	switch (getTag(e)) {
+		case argumentsTag:
+		case arrayTag:
+		case arrayBufferTag:
+		case dataViewTag:
+		case booleanTag:
+		case dateTag:
+		case float32ArrayTag:
+		case float64ArrayTag:
+		case int8ArrayTag:
+		case int16ArrayTag:
+		case int32ArrayTag:
+		case mapTag:
+		case numberTag:
+		case objectTag:
+		case regexpTag:
+		case setTag:
+		case stringTag:
+		case symbolTag:
+		case uint8ArrayTag:
+		case uint8ClampedArrayTag:
+		case uint16ArrayTag:
+		case uint32ArrayTag: return !0;
+		default: return !1;
+	}
+}
+function cloneDeep(e) {
+	return cloneDeepWithImpl(e, void 0, e, /* @__PURE__ */ new Map(), void 0);
+}
+function isPlainObject(e) {
+	if (!e || typeof e != "object") return !1;
+	let t = Object.getPrototypeOf(e);
+	return t === null || t === Object.prototype || Object.getPrototypeOf(t) === null ? Object.prototype.toString.call(e) === "[object Object]" : !1;
+}
+function omit(e, t) {
+	let n = { ...e };
+	for (let e = 0; e < t.length; e++) {
+		let r = t[e];
+		delete n[r];
+	}
+	return n;
+}
+function eq(e, t) {
+	return e === t || Number.isNaN(e) && Number.isNaN(t);
+}
+function isEqualWith(e, t, n) {
+	return isEqualWithImpl(e, t, void 0, void 0, void 0, void 0, n);
+}
+function isEqualWithImpl(e, t, n, r, i, a, o) {
+	let s = o(e, t, n, r, i, a);
+	if (s !== void 0) return s;
+	if (typeof e == typeof t) switch (typeof e) {
+		case "bigint":
+		case "string":
+		case "boolean":
+		case "symbol":
+		case "undefined": return e === t;
+		case "number": return e === t || Object.is(e, t);
+		case "function": return e === t;
+		case "object": return areObjectsEqual(e, t, a, o);
+	}
+	return areObjectsEqual(e, t, a, o);
+}
+function areObjectsEqual(e, t, n, r) {
+	if (Object.is(e, t)) return !0;
+	let i = getTag(e), a = getTag(t);
+	if (i === "[object Arguments]" && (i = objectTag), a === "[object Arguments]" && (a = objectTag), i !== a) return !1;
+	switch (i) {
+		case stringTag: return e.toString() === t.toString();
+		case numberTag: return eq(e.valueOf(), t.valueOf());
+		case booleanTag:
+		case dateTag:
+		case symbolTag: return Object.is(e.valueOf(), t.valueOf());
+		case regexpTag: return e.source === t.source && e.flags === t.flags;
+		case functionTag: return e === t;
+	}
+	n ??= /* @__PURE__ */ new Map();
+	let o = n.get(e), s = n.get(t);
+	if (o != null && s != null) return o === t;
+	n.set(e, t), n.set(t, e);
+	try {
+		switch (i) {
+			case mapTag:
+				if (e.size !== t.size) return !1;
+				for (let [i, a] of e.entries()) if (!t.has(i) || !isEqualWithImpl(a, t.get(i), i, e, t, n, r)) return !1;
+				return !0;
+			case setTag: {
+				if (e.size !== t.size) return !1;
+				let i = Array.from(e.values()), a = Array.from(t.values());
+				for (let o = 0; o < i.length; o++) {
+					let s = i[o], c = a.findIndex((i) => isEqualWithImpl(s, i, void 0, e, t, n, r));
+					if (c === -1) return !1;
+					a.splice(c, 1);
+				}
+				return !0;
+			}
+			case arrayTag:
+			case uint8ArrayTag:
+			case uint8ClampedArrayTag:
+			case uint16ArrayTag:
+			case uint32ArrayTag:
+			case bigUint64ArrayTag:
+			case int8ArrayTag:
+			case int16ArrayTag:
+			case int32ArrayTag:
+			case bigInt64ArrayTag:
+			case float32ArrayTag:
+			case float64ArrayTag:
+				if (typeof Buffer < "u" && Buffer.isBuffer(e) !== Buffer.isBuffer(t) || e.length !== t.length) return !1;
+				for (let i = 0; i < e.length; i++) if (!isEqualWithImpl(e[i], t[i], i, e, t, n, r)) return !1;
+				return !0;
+			case arrayBufferTag: return e.byteLength === t.byteLength ? areObjectsEqual(new Uint8Array(e), new Uint8Array(t), n, r) : !1;
+			case dataViewTag: return e.byteLength !== t.byteLength || e.byteOffset !== t.byteOffset ? !1 : areObjectsEqual(new Uint8Array(e), new Uint8Array(t), n, r);
+			case errorTag: return e.name === t.name && e.message === t.message;
+			case objectTag: {
+				if (!(areObjectsEqual(e.constructor, t.constructor, n, r) || isPlainObject(e) && isPlainObject(t))) return !1;
+				let i = [...Object.keys(e), ...getSymbols(e)], a = [...Object.keys(t), ...getSymbols(t)];
+				if (i.length !== a.length) return !1;
+				for (let a = 0; a < i.length; a++) {
+					let o = i[a], s = e[o];
+					if (!Object.hasOwn(t, o)) return !1;
+					let c = t[o];
+					if (!isEqualWithImpl(s, c, o, e, t, n, r)) return !1;
+				}
+				return !0;
+			}
+			default: return !1;
+		}
+	} finally {
+		n.delete(e), n.delete(t);
+	}
+}
+function isEqual(e, t) {
+	return isEqualWith(e, t, noop);
+}
+function useEffect(e, t, n) {
+	watch(t, (t, r) => {
+		n ? n(t, r) && e() : e();
+	}), onMounted(() => {
+		e();
+	});
+}
+var isIos = (typeof window > "u" ? !1 : /iPad|iPhone|iPod/.test(navigator.platform) || navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1) && !window.MSStream;
+typeof window > "u" || isIos || window.safari;
+function useState(e) {
+	let t = ref(typeof e == "function" ? e() : e);
+	function n(e) {
+		t.value = e;
+	}
+	return [t, n];
+}
+function useMergedState(e, t) {
+	let { defaultValue: n, value: r = ref() } = t || {}, i = typeof e == "function" ? e() : e;
+	r.value !== void 0 && (i = unref(r)), n !== void 0 && (i = typeof n == "function" ? n() : n);
+	let a = ref(i), o = ref(i), [s, c] = useState([o.value]);
+	watchEffect(() => {
+		let e = r.value === void 0 ? a.value : r.value;
+		t?.postState && (e = t.postState(e, a.value)), o.value = e;
+	}), watch(s, () => {
+		let e = s.value[0];
+		a.value !== e && t?.onChange?.(a.value, e);
+	}, { deep: !0 });
+	function l(e) {
+		a.value = e;
+	}
+	function u(e) {
+		l(e), c([o.value]);
+	}
+	return watch(r, () => {
+		a.value = r.value;
+	}), [
+		o,
+		u,
+		a
+	];
+}
+var initialTransform = {
+	x: 0,
+	y: 0,
+	rotate: 0,
+	scale: 1,
+	flipX: !1,
+	flipY: !1
+};
+function useImageTransform(e, t, n, r) {
+	let i = ref(null), a = ref([]), [o, s] = useState(initialTransform), c = (e) => {
+		s(initialTransform), isEqual(initialTransform, o.value) || r?.({
+			transform: initialTransform,
+			action: e
+		});
+	}, l = (e, t) => {
+		i.value === null && (a.value = [], i.value = wrapperRaf(() => {
+			let e = cloneDeep(o.value);
+			a.value.forEach((t) => {
+				e = {
+					...e,
+					...t
+				};
+			}), i.value = null, r?.({
+				transform: e,
+				action: t
+			}), s(e);
+		})), a.value.push({
+			...o.value,
+			...e
+		});
+	};
+	return {
+		transform: o,
+		resetTransform: c,
+		updateTransform: l,
+		dispatchZoomChange: (r, i, a, s, c) => {
+			let { width: u, height: d, offsetWidth: f, offsetHeight: p, offsetLeft: m, offsetTop: h } = e.value, g = r, _ = o.value.scale * r;
+			_ > n.value ? (_ = n.value, g = n.value / o.value.scale) : _ < t.value && (_ = c ? _ : t.value, g = _ / o.value.scale);
+			let v = a ?? innerWidth / 2, y = s ?? innerHeight / 2, b = g - 1, x = b * u * .5, S = b * d * .5, C = b * (v - o.value.x - m), ee = b * (y - o.value.y - h), w = o.value.x - (C - x), T = o.value.y - (ee - S);
+			if (r < 1 && _ === 1) {
+				let e = f * _, t = p * _, { width: n, height: r } = useWindowSize();
+				e <= n.value && t <= r.value && (w = 0, T = 0);
+			}
+			l({
+				x: w,
+				y: T,
+				scale: _
+			}, i);
+		}
+	};
+}
+var supportsPassive = !1;
+try {
+	let e = Object.defineProperty({}, "passive", { get() {
+		supportsPassive = !0;
+	} });
+	window.addEventListener("testPassive", null, e), window.removeEventListener("testPassive", null, e);
+} catch {}
+function addEventListenerWrap(e, t, n, r) {
+	if (e && e.addEventListener) {
+		let i = r;
+		i === void 0 && supportsPassive && (t === "touchstart" || t === "touchmove" || t === "wheel") && (i = { passive: !1 }), e.addEventListener(t, n, i);
+	}
+	return { remove: () => {
+		e && e.removeEventListener && e.removeEventListener(t, n);
+	} };
+}
+function fixPoint(e, t, n, r) {
+	let i = t + n, a = (n - r) / 2;
+	if (n > r) {
+		if (t > 0) return { [e]: a };
+		if (t < 0 && i < r) return { [e]: -a };
+	} else if (t < 0 || i > r) return { [e]: t < 0 ? a : -a };
+	return {};
+}
+function getFixScaleEleTransPosition(e, t, n, r) {
+	let { width: i, height: a } = useWindowSize(), o = null;
+	return e <= i.value && t <= a.value ? o = {
+		x: 0,
+		y: 0
+	} : (e > i.value || t > a.value) && (o = {
+		...fixPoint("x", n, e, i.value),
+		...fixPoint("y", r, t, a.value)
+	}), o;
+}
+function useMouseEvent(e, t, n, r, i, a, o) {
+	let [s, c] = useState(!1), l = ref({
+		diffX: 0,
+		diffY: 0,
+		transformX: 0,
+		transformY: 0
+	}), u = (e) => {
+		!t || e.button !== 0 || (e.preventDefault(), e.stopPropagation(), l.value = {
+			diffX: e.pageX - i.value.x,
+			diffY: e.pageY - i.value.y,
+			transformX: i.value.x,
+			transformY: i.value.y
+		}, c(!0));
+	}, d = (e) => {
+		n && s.value && a({
+			x: e.pageX - l.value.diffX,
+			y: e.pageY - l.value.diffY
+		}, "move");
+	}, f = () => {
+		if (n && s.value) {
+			c(!1);
+			let { transformX: t, transformY: n } = l.value;
+			if (!(i.value.x !== t && i.value.y !== n)) return;
+			let r = e.value.offsetWidth * i.value.scale, o = e.value.offsetHeight * i.value.scale, { left: s, top: u } = e.value.getBoundingClientRect(), d = i.value.rotate % 180 != 0, f = getFixScaleEleTransPosition(d ? o : r, d ? r : o, s, u);
+			f && a({ ...f }, "dragRebound");
+		}
+	};
+	return useEffect(() => {
+		let e, n, r, i;
+		if (t) {
+			r = addEventListenerWrap(window, "mouseup", f, !1), i = addEventListenerWrap(window, "mousemove", d, !1);
+			try {
+				/* istanbul ignore next */
+				window.top !== window.self && (e = addEventListenerWrap(window.top, "mouseup", f, !1), n = addEventListenerWrap(window.top, "mousemove", d, !1));
+			} catch (e) {
+				/* istanbul ignore next */
+				console.warn(`[rc-image] ${e}`);
+			}
+		}
+		return () => {
+			/* istanbul ignore next */
+			r?.remove(), i?.remove(), e?.remove(), n?.remove();
+		};
+	}, [
+		n,
+		s,
+		() => i.value.x,
+		() => i.value.y,
+		() => i.value.rotate,
+		t
+	]), {
+		isMoving: s,
+		onMouseDown: u,
+		onMouseMove: d,
+		onMouseUp: f,
+		onWheel: (e) => {
+			if (!n || e.deltaY === 0) return;
+			let t = Math.abs(e.deltaY / 100), i = 1 + Math.min(t, 1) * r.value;
+			e.deltaY > 0 && (i = 1 / i), o(i, "wheel", e.clientX, e.clientY);
+		}
+	};
+}
+function getDistance(e, t) {
+	let n = e.x - t.x, r = e.y - t.y;
+	return Math.hypot(n, r);
+}
+function getCenter(e, t, n, r) {
+	let i = getDistance(e, n), a = getDistance(t, r);
+	if (i === 0 && a === 0) return [e.x, e.y];
+	let o = i / (i + a);
+	return [e.x + o * (t.x - e.x), e.y + o * (t.y - e.y)];
+}
+function useTouchEvent(e, t, n, r, i, a, o) {
+	let [s, c] = useState(!1), l = ref({
+		point1: {
+			x: 0,
+			y: 0
+		},
+		point2: {
+			x: 0,
+			y: 0
+		},
+		eventType: "none"
+	}), u = (e) => {
+		l.value = {
+			...l.value,
+			...e
+		};
+	};
+	return useEffect(() => {
+		let e;
+		return n.value && t.value && (e = addEventListenerWrap(window, "touchmove", (e) => e.preventDefault(), { passive: !1 })), () => {
+			e?.remove();
+		};
+	}, [n, t]), {
+		isTouching: s,
+		onTouchStart: (e) => {
+			if (!t.value) return;
+			e.stopPropagation(), c(!0);
+			let { touches: n = [] } = e;
+			n.length > 1 ? u({
+				point1: {
+					x: n[0].clientX,
+					y: n[0].clientY
+				},
+				point2: {
+					x: n[1].clientX,
+					y: n[1].clientY
+				},
+				eventType: "touchZoom"
+			}) : u({
+				point1: {
+					x: n[0].clientX - i.value.x,
+					y: n[0].clientY - i.value.y
+				},
+				eventType: "move"
+			});
+		},
+		onTouchMove: (e) => {
+			let { touches: t = [] } = e, { point1: n, point2: r, eventType: i } = l.value;
+			if (t.length > 1 && i === "touchZoom") {
+				let e = {
+					x: t[0].clientX,
+					y: t[0].clientY
+				}, i = {
+					x: t[1].clientX,
+					y: t[1].clientY
+				}, [a, s] = getCenter(n, r, e, i);
+				o(getDistance(e, i) / getDistance(n, r), "touchZoom", a, s, !0), u({
+					point1: e,
+					point2: i,
+					eventType: "touchZoom"
+				});
+			} else i === "move" && (a({
+				x: t[0].clientX - n.x,
+				y: t[0].clientY - n.y
+			}, "move"), u({ eventType: "move" }));
+		},
+		onTouchEnd: () => {
+			if (!n.value) return;
+			if (s && c(!1), u({ eventType: "none" }), r.value > i.value.scale) return a({
+				x: 0,
+				y: 0,
+				scale: r.value
+			}, "touchZoom");
+			let t = e.value.offsetWidth * i.value.scale, o = e.value.offsetHeight * i.value.scale, { left: l, top: d } = e.value.getBoundingClientRect(), f = i.value.rotate % 180 != 0, p = getFixScaleEleTransPosition(f ? o : t, f ? t : o, l, d);
+			p && a({ ...p }, "dragRebound");
+		}
+	};
+}
+const baseProps = {
+	infinite: {
+		type: Boolean,
+		default: !0
+	},
+	zIndex: {
+		type: Number,
+		default: 2e3
+	},
+	current: {
+		type: Number,
+		default: 0
+	},
+	getContainer: { type: String }
+}, imageProps = {
+	preview: {
+		type: [Object, Boolean],
+		default: !0
+	},
+	src: {
+		type: String,
+		default: ""
+	},
+	alt: {
+		type: String,
+		default: ""
+	},
+	loading: { type: String },
+	fit: {
+		type: String,
+		default: "contain"
+	},
+	crossOrigin: { type: String },
+	lazy: Boolean,
+	scrollContainer: { type: [String, Object] },
+	placeholder: {
+		type: [
+			Function,
+			Object,
+			Boolean
+		],
+		default: () => void 0
+	},
+	fallback: {
+		type: [Function, Object],
+		default: () => void 0
+	},
+	onLoad: { type: Function },
+	onError: { type: Function },
+	onClick: { type: Function },
+	imageStyle: {
+		type: Object,
+		default: () => ({})
+	},
+	imageClass: String,
+	size: Number,
+	width: Number,
+	height: Number,
+	zIndex: baseProps.zIndex,
+	getContainer: baseProps.getContainer
+};
+var props_default = {
+	urls: {
+		type: Array,
+		default: () => []
+	},
+	open: {
+		type: Boolean,
+		default: !1
+	},
+	scaleStep: {
+		type: Number,
+		default: .5
+	},
+	minScale: {
+		type: Number,
+		default: .32
+	},
+	maxScale: {
+		type: Number,
+		default: 32
+	},
+	movable: {
+		type: Boolean,
+		default: !0
+	},
+	disabled: Boolean,
+	zIndex: baseProps.zIndex,
+	current: baseProps.current,
+	infinite: baseProps.infinite,
+	getContainer: baseProps.getContainer,
+	onHideOnClickModal: {
+		type: Boolean,
+		default: !0
+	},
+	countRender: [
+		Function,
+		Array,
+		Object
+	],
+	icons: {
+		type: Object,
+		default: () => ({})
+	},
+	onTransform: Function,
+	onOpenChange: Function,
+	"onUpdate:open": Function
+}, Operations_default = /* @__PURE__ */ defineComponent({
+	name: "Operations",
+	inheritAttrs: !1,
+	props: {
+		open: Boolean,
+		count: {
+			type: Number,
+			default: 0
+		},
+		current: {
+			type: Number,
+			default: 0
+		},
+		showSwitch: Boolean,
+		showProgress: Boolean,
+		prefixCls: String,
+		hashId: String,
+		zIndex: props_default.zIndex,
+		icons: props_default.icons,
+		infinite: props_default.infinite,
+		getContainer: props_default.getContainer,
+		countRender: props_default.countRender,
+		tools: Array,
+		onClose: Function,
+		onActive: Function
+	},
+	setup(i) {
+		let o = (e, t) => {
+			e.preventDefault(), e.stopPropagation(), i.onActive?.(t);
+		};
+		return () => {
+			let { prefixCls: s, hashId: c, tools: l } = i, u = getTransitionProps(`${i.prefixCls}-fade`), d = `${s}-operations-operation`, f = `${s}-operations-icon`;
+			return createVNode(Teleport, { to: i.getContainer || "body" }, { default: () => [createVNode(Transition, u, { default: () => [withDirectives(createVNode("div", {
+				class: classNames_default(`${s}-operations-wrapper`, c),
+				style: { zIndex: i.zIndex }
+			}, [
+				i.icons?.close === null ? null : createVNode("button", {
+					class: `${s}-close ${c}`,
+					onClick: i.onClose
+				}, [i.icons?.close || createVNode(CloseOutlined, null, null)]),
+				i.showSwitch && createVNode(Fragment, null, [createVNode("div", {
+					class: classNames_default(`${s}-switch-left ${c}`, { [`${s}-switch-left-disabled`]: i.infinite ? !1 : i.current === 0 }),
+					onClick: (e) => o(e, -1)
+				}, [i.icons?.left || createVNode(LeftOutlined, null, null)]), createVNode("div", {
+					class: classNames_default(`${s}-switch-right ${c}`, { [`${s}-switch-right-disabled`]: i.infinite ? !1 : i.current === i.count - 1 }),
+					onClick: (e) => o(e, 1)
+				}, [i.icons?.right || createVNode(RightOutlined, null, null)])]),
+				createVNode("div", { class: `${s}-footer ${c}` }, [i.showProgress && createVNode("div", { class: `${s}-progress` }, [i.countRender ? i.countRender(i.current + 1, i.count) : `${i.current + 1} / ${i.count}`]), createVNode("div", { class: `${i.prefixCls}-operations` }, [l?.map(({ icon: e, onClick: t, type: n, disabled: o }) => createVNode("div", {
+					class: classNames_default(d, { [`${i.prefixCls}-operations-operation-disabled`]: o && o?.value }),
+					onClick: t,
+					key: n
+				}, [cloneVNode(e, { class: f })]))])])
+			]), [[vShow, i.open]])] })] });
+		};
+	}
+});
+function bound01(e, t) {
+	isOnePointZero(e) && (e = "100%");
+	var n = isPercentage(e);
+	return e = t === 360 ? e : Math.min(t, Math.max(0, parseFloat(e))), n && (e = parseInt(String(e * t), 10) / 100), Math.abs(e - t) < 1e-6 ? 1 : (e = t === 360 ? (e < 0 ? e % t + t : e % t) / parseFloat(String(t)) : e % t / parseFloat(String(t)), e);
+}
+function clamp01(e) {
+	return Math.min(1, Math.max(0, e));
+}
+function isOnePointZero(e) {
+	return typeof e == "string" && e.indexOf(".") !== -1 && parseFloat(e) === 1;
+}
+function isPercentage(e) {
+	return typeof e == "string" && e.indexOf("%") !== -1;
+}
+function boundAlpha(e) {
+	return e = parseFloat(e), (isNaN(e) || e < 0 || e > 1) && (e = 1), e;
+}
+function convertToPercentage(e) {
+	return e <= 1 ? `${Number(e) * 100}%` : e;
+}
+function pad2(e) {
+	return e.length === 1 ? "0" + e : String(e);
+}
+function rgbToRgb(e, t, n) {
+	return {
+		r: bound01(e, 255) * 255,
+		g: bound01(t, 255) * 255,
+		b: bound01(n, 255) * 255
+	};
+}
+function rgbToHsl(e, t, n) {
+	e = bound01(e, 255), t = bound01(t, 255), n = bound01(n, 255);
+	var r = Math.max(e, t, n), i = Math.min(e, t, n), a = 0, o = 0, s = (r + i) / 2;
+	if (r === i) o = 0, a = 0;
+	else {
+		var c = r - i;
+		switch (o = s > .5 ? c / (2 - r - i) : c / (r + i), r) {
+			case e:
+				a = (t - n) / c + (t < n ? 6 : 0);
+				break;
+			case t:
+				a = (n - e) / c + 2;
+				break;
+			case n:
+				a = (e - t) / c + 4;
+				break;
+			default: break;
+		}
+		a /= 6;
+	}
+	return {
+		h: a,
+		s: o,
+		l: s
+	};
+}
+function hue2rgb(e, t, n) {
+	return n < 0 && (n += 1), n > 1 && --n, n < 1 / 6 ? e + (t - e) * (6 * n) : n < 1 / 2 ? t : n < 2 / 3 ? e + (t - e) * (2 / 3 - n) * 6 : e;
+}
+function hslToRgb(e, t, n) {
+	var r, i, a;
+	if (e = bound01(e, 360), t = bound01(t, 100), n = bound01(n, 100), t === 0) i = n, a = n, r = n;
+	else {
+		var o = n < .5 ? n * (1 + t) : n + t - n * t, s = 2 * n - o;
+		r = hue2rgb(s, o, e + 1 / 3), i = hue2rgb(s, o, e), a = hue2rgb(s, o, e - 1 / 3);
+	}
+	return {
+		r: r * 255,
+		g: i * 255,
+		b: a * 255
+	};
+}
+function rgbToHsv(e, t, n) {
+	e = bound01(e, 255), t = bound01(t, 255), n = bound01(n, 255);
+	var r = Math.max(e, t, n), i = Math.min(e, t, n), a = 0, o = r, s = r - i, c = r === 0 ? 0 : s / r;
+	if (r === i) a = 0;
+	else {
+		switch (r) {
+			case e:
+				a = (t - n) / s + (t < n ? 6 : 0);
+				break;
+			case t:
+				a = (n - e) / s + 2;
+				break;
+			case n:
+				a = (e - t) / s + 4;
+				break;
+			default: break;
+		}
+		a /= 6;
+	}
+	return {
+		h: a,
+		s: c,
+		v: o
+	};
+}
+function hsvToRgb(e, t, n) {
+	e = bound01(e, 360) * 6, t = bound01(t, 100), n = bound01(n, 100);
+	var r = Math.floor(e), i = e - r, a = n * (1 - t), o = n * (1 - i * t), s = n * (1 - (1 - i) * t), c = r % 6, l = [
+		n,
+		o,
+		a,
+		a,
+		s,
+		n
+	][c], u = [
+		s,
+		n,
+		n,
+		o,
+		a,
+		a
+	][c], d = [
+		a,
+		a,
+		s,
+		n,
+		n,
+		o
+	][c];
+	return {
+		r: l * 255,
+		g: u * 255,
+		b: d * 255
+	};
+}
+function rgbToHex(e, t, n, r) {
+	var i = [
+		pad2(Math.round(e).toString(16)),
+		pad2(Math.round(t).toString(16)),
+		pad2(Math.round(n).toString(16))
+	];
+	return r && i[0].startsWith(i[0].charAt(1)) && i[1].startsWith(i[1].charAt(1)) && i[2].startsWith(i[2].charAt(1)) ? i[0].charAt(0) + i[1].charAt(0) + i[2].charAt(0) : i.join("");
+}
+function rgbaToHex(e, t, n, r, i) {
+	var a = [
+		pad2(Math.round(e).toString(16)),
+		pad2(Math.round(t).toString(16)),
+		pad2(Math.round(n).toString(16)),
+		pad2(convertDecimalToHex(r))
+	];
+	return i && a[0].startsWith(a[0].charAt(1)) && a[1].startsWith(a[1].charAt(1)) && a[2].startsWith(a[2].charAt(1)) && a[3].startsWith(a[3].charAt(1)) ? a[0].charAt(0) + a[1].charAt(0) + a[2].charAt(0) + a[3].charAt(0) : a.join("");
+}
+function convertDecimalToHex(e) {
+	return Math.round(parseFloat(e) * 255).toString(16);
+}
+function convertHexToDecimal(e) {
+	return parseIntFromHex(e) / 255;
+}
+function parseIntFromHex(e) {
+	return parseInt(e, 16);
+}
+function numberInputToObject(e) {
+	return {
+		r: e >> 16,
+		g: (e & 65280) >> 8,
+		b: e & 255
+	};
+}
+var names = {
+	aliceblue: "#f0f8ff",
+	antiquewhite: "#faebd7",
+	aqua: "#00ffff",
+	aquamarine: "#7fffd4",
+	azure: "#f0ffff",
+	beige: "#f5f5dc",
+	bisque: "#ffe4c4",
+	black: "#000000",
+	blanchedalmond: "#ffebcd",
+	blue: "#0000ff",
+	blueviolet: "#8a2be2",
+	brown: "#a52a2a",
+	burlywood: "#deb887",
+	cadetblue: "#5f9ea0",
+	chartreuse: "#7fff00",
+	chocolate: "#d2691e",
+	coral: "#ff7f50",
+	cornflowerblue: "#6495ed",
+	cornsilk: "#fff8dc",
+	crimson: "#dc143c",
+	cyan: "#00ffff",
+	darkblue: "#00008b",
+	darkcyan: "#008b8b",
+	darkgoldenrod: "#b8860b",
+	darkgray: "#a9a9a9",
+	darkgreen: "#006400",
+	darkgrey: "#a9a9a9",
+	darkkhaki: "#bdb76b",
+	darkmagenta: "#8b008b",
+	darkolivegreen: "#556b2f",
+	darkorange: "#ff8c00",
+	darkorchid: "#9932cc",
+	darkred: "#8b0000",
+	darksalmon: "#e9967a",
+	darkseagreen: "#8fbc8f",
+	darkslateblue: "#483d8b",
+	darkslategray: "#2f4f4f",
+	darkslategrey: "#2f4f4f",
+	darkturquoise: "#00ced1",
+	darkviolet: "#9400d3",
+	deeppink: "#ff1493",
+	deepskyblue: "#00bfff",
+	dimgray: "#696969",
+	dimgrey: "#696969",
+	dodgerblue: "#1e90ff",
+	firebrick: "#b22222",
+	floralwhite: "#fffaf0",
+	forestgreen: "#228b22",
+	fuchsia: "#ff00ff",
+	gainsboro: "#dcdcdc",
+	ghostwhite: "#f8f8ff",
+	goldenrod: "#daa520",
+	gold: "#ffd700",
+	gray: "#808080",
+	green: "#008000",
+	greenyellow: "#adff2f",
+	grey: "#808080",
+	honeydew: "#f0fff0",
+	hotpink: "#ff69b4",
+	indianred: "#cd5c5c",
+	indigo: "#4b0082",
+	ivory: "#fffff0",
+	khaki: "#f0e68c",
+	lavenderblush: "#fff0f5",
+	lavender: "#e6e6fa",
+	lawngreen: "#7cfc00",
+	lemonchiffon: "#fffacd",
+	lightblue: "#add8e6",
+	lightcoral: "#f08080",
+	lightcyan: "#e0ffff",
+	lightgoldenrodyellow: "#fafad2",
+	lightgray: "#d3d3d3",
+	lightgreen: "#90ee90",
+	lightgrey: "#d3d3d3",
+	lightpink: "#ffb6c1",
+	lightsalmon: "#ffa07a",
+	lightseagreen: "#20b2aa",
+	lightskyblue: "#87cefa",
+	lightslategray: "#778899",
+	lightslategrey: "#778899",
+	lightsteelblue: "#b0c4de",
+	lightyellow: "#ffffe0",
+	lime: "#00ff00",
+	limegreen: "#32cd32",
+	linen: "#faf0e6",
+	magenta: "#ff00ff",
+	maroon: "#800000",
+	mediumaquamarine: "#66cdaa",
+	mediumblue: "#0000cd",
+	mediumorchid: "#ba55d3",
+	mediumpurple: "#9370db",
+	mediumseagreen: "#3cb371",
+	mediumslateblue: "#7b68ee",
+	mediumspringgreen: "#00fa9a",
+	mediumturquoise: "#48d1cc",
+	mediumvioletred: "#c71585",
+	midnightblue: "#191970",
+	mintcream: "#f5fffa",
+	mistyrose: "#ffe4e1",
+	moccasin: "#ffe4b5",
+	navajowhite: "#ffdead",
+	navy: "#000080",
+	oldlace: "#fdf5e6",
+	olive: "#808000",
+	olivedrab: "#6b8e23",
+	orange: "#ffa500",
+	orangered: "#ff4500",
+	orchid: "#da70d6",
+	palegoldenrod: "#eee8aa",
+	palegreen: "#98fb98",
+	paleturquoise: "#afeeee",
+	palevioletred: "#db7093",
+	papayawhip: "#ffefd5",
+	peachpuff: "#ffdab9",
+	peru: "#cd853f",
+	pink: "#ffc0cb",
+	plum: "#dda0dd",
+	powderblue: "#b0e0e6",
+	purple: "#800080",
+	rebeccapurple: "#663399",
+	red: "#ff0000",
+	rosybrown: "#bc8f8f",
+	royalblue: "#4169e1",
+	saddlebrown: "#8b4513",
+	salmon: "#fa8072",
+	sandybrown: "#f4a460",
+	seagreen: "#2e8b57",
+	seashell: "#fff5ee",
+	sienna: "#a0522d",
+	silver: "#c0c0c0",
+	skyblue: "#87ceeb",
+	slateblue: "#6a5acd",
+	slategray: "#708090",
+	slategrey: "#708090",
+	snow: "#fffafa",
+	springgreen: "#00ff7f",
+	steelblue: "#4682b4",
+	tan: "#d2b48c",
+	teal: "#008080",
+	thistle: "#d8bfd8",
+	tomato: "#ff6347",
+	turquoise: "#40e0d0",
+	violet: "#ee82ee",
+	wheat: "#f5deb3",
+	white: "#ffffff",
+	whitesmoke: "#f5f5f5",
+	yellow: "#ffff00",
+	yellowgreen: "#9acd32"
+};
+function inputToRGB(e) {
+	var t = {
+		r: 0,
+		g: 0,
+		b: 0
+	}, n = 1, r = null, i = null, a = null, o = !1, s = !1;
+	return typeof e == "string" && (e = stringInputToObject(e)), typeof e == "object" && (isValidCSSUnit(e.r) && isValidCSSUnit(e.g) && isValidCSSUnit(e.b) ? (t = rgbToRgb(e.r, e.g, e.b), o = !0, s = String(e.r).substr(-1) === "%" ? "prgb" : "rgb") : isValidCSSUnit(e.h) && isValidCSSUnit(e.s) && isValidCSSUnit(e.v) ? (r = convertToPercentage(e.s), i = convertToPercentage(e.v), t = hsvToRgb(e.h, r, i), o = !0, s = "hsv") : isValidCSSUnit(e.h) && isValidCSSUnit(e.s) && isValidCSSUnit(e.l) && (r = convertToPercentage(e.s), a = convertToPercentage(e.l), t = hslToRgb(e.h, r, a), o = !0, s = "hsl"), Object.prototype.hasOwnProperty.call(e, "a") && (n = e.a)), n = boundAlpha(n), {
+		ok: o,
+		format: e.format || s,
+		r: Math.min(255, Math.max(t.r, 0)),
+		g: Math.min(255, Math.max(t.g, 0)),
+		b: Math.min(255, Math.max(t.b, 0)),
+		a: n
+	};
+}
+var CSS_UNIT = "(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)", PERMISSIVE_MATCH3 = `[\\s|\\(]+(${CSS_UNIT})[,|\\s]+(${CSS_UNIT})[,|\\s]+(${CSS_UNIT})\\s*\\)?`, PERMISSIVE_MATCH4 = `[\\s|\\(]+(${CSS_UNIT})[,|\\s]+(${CSS_UNIT})[,|\\s]+(${CSS_UNIT})[,|\\s]+(${CSS_UNIT})\\s*\\)?`, matchers = {
+	CSS_UNIT: new RegExp(CSS_UNIT),
+	rgb: RegExp("rgb" + PERMISSIVE_MATCH3),
+	rgba: RegExp("rgba" + PERMISSIVE_MATCH4),
+	hsl: RegExp("hsl" + PERMISSIVE_MATCH3),
+	hsla: RegExp("hsla" + PERMISSIVE_MATCH4),
+	hsv: RegExp("hsv" + PERMISSIVE_MATCH3),
+	hsva: RegExp("hsva" + PERMISSIVE_MATCH4),
+	hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
+	hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
+	hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
+	hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
+};
+function stringInputToObject(e) {
+	if (e = e.trim().toLowerCase(), e.length === 0) return !1;
+	var t = !1;
+	if (names[e]) e = names[e], t = !0;
+	else if (e === "transparent") return {
+		r: 0,
+		g: 0,
+		b: 0,
+		a: 0,
+		format: "name"
+	};
+	var n = matchers.rgb.exec(e);
+	return n ? {
+		r: n[1],
+		g: n[2],
+		b: n[3]
+	} : (n = matchers.rgba.exec(e), n ? {
+		r: n[1],
+		g: n[2],
+		b: n[3],
+		a: n[4]
+	} : (n = matchers.hsl.exec(e), n ? {
+		h: n[1],
+		s: n[2],
+		l: n[3]
+	} : (n = matchers.hsla.exec(e), n ? {
+		h: n[1],
+		s: n[2],
+		l: n[3],
+		a: n[4]
+	} : (n = matchers.hsv.exec(e), n ? {
+		h: n[1],
+		s: n[2],
+		v: n[3]
+	} : (n = matchers.hsva.exec(e), n ? {
+		h: n[1],
+		s: n[2],
+		v: n[3],
+		a: n[4]
+	} : (n = matchers.hex8.exec(e), n ? {
+		r: parseIntFromHex(n[1]),
+		g: parseIntFromHex(n[2]),
+		b: parseIntFromHex(n[3]),
+		a: convertHexToDecimal(n[4]),
+		format: t ? "name" : "hex8"
+	} : (n = matchers.hex6.exec(e), n ? {
+		r: parseIntFromHex(n[1]),
+		g: parseIntFromHex(n[2]),
+		b: parseIntFromHex(n[3]),
+		format: t ? "name" : "hex"
+	} : (n = matchers.hex4.exec(e), n ? {
+		r: parseIntFromHex(n[1] + n[1]),
+		g: parseIntFromHex(n[2] + n[2]),
+		b: parseIntFromHex(n[3] + n[3]),
+		a: convertHexToDecimal(n[4] + n[4]),
+		format: t ? "name" : "hex8"
+	} : (n = matchers.hex3.exec(e), n ? {
+		r: parseIntFromHex(n[1] + n[1]),
+		g: parseIntFromHex(n[2] + n[2]),
+		b: parseIntFromHex(n[3] + n[3]),
+		format: t ? "name" : "hex"
+	} : !1)))))))));
+}
+function isValidCSSUnit(e) {
+	return !!matchers.CSS_UNIT.exec(String(e));
+}
+var TinyColor = function() {
+	function e(t, n) {
+		if (t === void 0 && (t = ""), n === void 0 && (n = {}), t instanceof e) return t;
+		typeof t == "number" && (t = numberInputToObject(t)), this.originalInput = t;
+		var r = inputToRGB(t);
+		this.originalInput = t, this.r = r.r, this.g = r.g, this.b = r.b, this.a = r.a, this.roundA = Math.round(100 * this.a) / 100, this.format = n.format ?? r.format, this.gradientType = n.gradientType, this.r < 1 && (this.r = Math.round(this.r)), this.g < 1 && (this.g = Math.round(this.g)), this.b < 1 && (this.b = Math.round(this.b)), this.isValid = r.ok;
+	}
+	return e.prototype.isDark = function() {
+		return this.getBrightness() < 128;
+	}, e.prototype.isLight = function() {
+		return !this.isDark();
+	}, e.prototype.getBrightness = function() {
+		var e = this.toRgb();
+		return (e.r * 299 + e.g * 587 + e.b * 114) / 1e3;
+	}, e.prototype.getLuminance = function() {
+		var e = this.toRgb(), t, n, r, i = e.r / 255, a = e.g / 255, o = e.b / 255;
+		return t = i <= .03928 ? i / 12.92 : ((i + .055) / 1.055) ** 2.4, n = a <= .03928 ? a / 12.92 : ((a + .055) / 1.055) ** 2.4, r = o <= .03928 ? o / 12.92 : ((o + .055) / 1.055) ** 2.4, .2126 * t + .7152 * n + .0722 * r;
+	}, e.prototype.getAlpha = function() {
+		return this.a;
+	}, e.prototype.setAlpha = function(e) {
+		return this.a = boundAlpha(e), this.roundA = Math.round(100 * this.a) / 100, this;
+	}, e.prototype.isMonochrome = function() {
+		return this.toHsl().s === 0;
+	}, e.prototype.toHsv = function() {
+		var e = rgbToHsv(this.r, this.g, this.b);
+		return {
+			h: e.h * 360,
+			s: e.s,
+			v: e.v,
+			a: this.a
+		};
+	}, e.prototype.toHsvString = function() {
+		var e = rgbToHsv(this.r, this.g, this.b), t = Math.round(e.h * 360), n = Math.round(e.s * 100), r = Math.round(e.v * 100);
+		return this.a === 1 ? `hsv(${t}, ${n}%, ${r}%)` : `hsva(${t}, ${n}%, ${r}%, ${this.roundA})`;
+	}, e.prototype.toHsl = function() {
+		var e = rgbToHsl(this.r, this.g, this.b);
+		return {
+			h: e.h * 360,
+			s: e.s,
+			l: e.l,
+			a: this.a
+		};
+	}, e.prototype.toHslString = function() {
+		var e = rgbToHsl(this.r, this.g, this.b), t = Math.round(e.h * 360), n = Math.round(e.s * 100), r = Math.round(e.l * 100);
+		return this.a === 1 ? `hsl(${t}, ${n}%, ${r}%)` : `hsla(${t}, ${n}%, ${r}%, ${this.roundA})`;
+	}, e.prototype.toHex = function(e) {
+		return e === void 0 && (e = !1), rgbToHex(this.r, this.g, this.b, e);
+	}, e.prototype.toHexString = function(e) {
+		return e === void 0 && (e = !1), "#" + this.toHex(e);
+	}, e.prototype.toHex8 = function(e) {
+		return e === void 0 && (e = !1), rgbaToHex(this.r, this.g, this.b, this.a, e);
+	}, e.prototype.toHex8String = function(e) {
+		return e === void 0 && (e = !1), "#" + this.toHex8(e);
+	}, e.prototype.toHexShortString = function(e) {
+		return e === void 0 && (e = !1), this.a === 1 ? this.toHexString(e) : this.toHex8String(e);
+	}, e.prototype.toRgb = function() {
+		return {
+			r: Math.round(this.r),
+			g: Math.round(this.g),
+			b: Math.round(this.b),
+			a: this.a
+		};
+	}, e.prototype.toRgbString = function() {
+		var e = Math.round(this.r), t = Math.round(this.g), n = Math.round(this.b);
+		return this.a === 1 ? `rgb(${e}, ${t}, ${n})` : `rgba(${e}, ${t}, ${n}, ${this.roundA})`;
+	}, e.prototype.toPercentageRgb = function() {
+		var e = function(e) {
+			return `${Math.round(bound01(e, 255) * 100)}%`;
+		};
+		return {
+			r: e(this.r),
+			g: e(this.g),
+			b: e(this.b),
+			a: this.a
+		};
+	}, e.prototype.toPercentageRgbString = function() {
+		var e = function(e) {
+			return Math.round(bound01(e, 255) * 100);
+		};
+		return this.a === 1 ? `rgb(${e(this.r)}%, ${e(this.g)}%, ${e(this.b)}%)` : `rgba(${e(this.r)}%, ${e(this.g)}%, ${e(this.b)}%, ${this.roundA})`;
+	}, e.prototype.toName = function() {
+		if (this.a === 0) return "transparent";
+		if (this.a < 1) return !1;
+		for (var e = "#" + rgbToHex(this.r, this.g, this.b, !1), t = 0, n = Object.entries(names); t < n.length; t++) {
+			var r = n[t], i = r[0];
+			if (e === r[1]) return i;
+		}
+		return !1;
+	}, e.prototype.toString = function(e) {
+		var t = !!e;
+		e ??= this.format;
+		var n = !1, r = this.a < 1 && this.a >= 0;
+		return !t && r && (e.startsWith("hex") || e === "name") ? e === "name" && this.a === 0 ? this.toName() : this.toRgbString() : (e === "rgb" && (n = this.toRgbString()), e === "prgb" && (n = this.toPercentageRgbString()), (e === "hex" || e === "hex6") && (n = this.toHexString()), e === "hex3" && (n = this.toHexString(!0)), e === "hex4" && (n = this.toHex8String(!0)), e === "hex8" && (n = this.toHex8String()), e === "name" && (n = this.toName()), e === "hsl" && (n = this.toHslString()), e === "hsv" && (n = this.toHsvString()), n || this.toHexString());
+	}, e.prototype.toNumber = function() {
+		return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b);
+	}, e.prototype.clone = function() {
+		return new e(this.toString());
+	}, e.prototype.lighten = function(t) {
+		t === void 0 && (t = 10);
+		var n = this.toHsl();
+		return n.l += t / 100, n.l = clamp01(n.l), new e(n);
+	}, e.prototype.brighten = function(t) {
+		t === void 0 && (t = 10);
+		var n = this.toRgb();
+		return n.r = Math.max(0, Math.min(255, n.r - Math.round(255 * -(t / 100)))), n.g = Math.max(0, Math.min(255, n.g - Math.round(255 * -(t / 100)))), n.b = Math.max(0, Math.min(255, n.b - Math.round(255 * -(t / 100)))), new e(n);
+	}, e.prototype.darken = function(t) {
+		t === void 0 && (t = 10);
+		var n = this.toHsl();
+		return n.l -= t / 100, n.l = clamp01(n.l), new e(n);
+	}, e.prototype.tint = function(e) {
+		return e === void 0 && (e = 10), this.mix("white", e);
+	}, e.prototype.shade = function(e) {
+		return e === void 0 && (e = 10), this.mix("black", e);
+	}, e.prototype.desaturate = function(t) {
+		t === void 0 && (t = 10);
+		var n = this.toHsl();
+		return n.s -= t / 100, n.s = clamp01(n.s), new e(n);
+	}, e.prototype.saturate = function(t) {
+		t === void 0 && (t = 10);
+		var n = this.toHsl();
+		return n.s += t / 100, n.s = clamp01(n.s), new e(n);
+	}, e.prototype.greyscale = function() {
+		return this.desaturate(100);
+	}, e.prototype.spin = function(t) {
+		var n = this.toHsl(), r = (n.h + t) % 360;
+		return n.h = r < 0 ? 360 + r : r, new e(n);
+	}, e.prototype.mix = function(t, n) {
+		n === void 0 && (n = 50);
+		var r = this.toRgb(), i = new e(t).toRgb(), a = n / 100;
+		return new e({
+			r: (i.r - r.r) * a + r.r,
+			g: (i.g - r.g) * a + r.g,
+			b: (i.b - r.b) * a + r.b,
+			a: (i.a - r.a) * a + r.a
+		});
+	}, e.prototype.analogous = function(t, n) {
+		t === void 0 && (t = 6), n === void 0 && (n = 30);
+		var r = this.toHsl(), i = 360 / n, a = [this];
+		for (r.h = (r.h - (i * t >> 1) + 720) % 360; --t;) r.h = (r.h + i) % 360, a.push(new e(r));
+		return a;
+	}, e.prototype.complement = function() {
+		var t = this.toHsl();
+		return t.h = (t.h + 180) % 360, new e(t);
+	}, e.prototype.monochromatic = function(t) {
+		t === void 0 && (t = 6);
+		for (var n = this.toHsv(), r = n.h, i = n.s, a = n.v, o = [], s = 1 / t; t--;) o.push(new e({
+			h: r,
+			s: i,
+			v: a
+		})), a = (a + s) % 1;
+		return o;
+	}, e.prototype.splitcomplement = function() {
+		var t = this.toHsl(), n = t.h;
+		return [
+			this,
+			new e({
+				h: (n + 72) % 360,
+				s: t.s,
+				l: t.l
+			}),
+			new e({
+				h: (n + 216) % 360,
+				s: t.s,
+				l: t.l
+			})
+		];
+	}, e.prototype.onBackground = function(t) {
+		var n = this.toRgb(), r = new e(t).toRgb(), i = n.a + r.a * (1 - n.a);
+		return new e({
+			r: (n.r * n.a + r.r * r.a * (1 - n.a)) / i,
+			g: (n.g * n.a + r.g * r.a * (1 - n.a)) / i,
+			b: (n.b * n.a + r.b * r.a * (1 - n.a)) / i,
+			a: i
+		});
+	}, e.prototype.triad = function() {
+		return this.polyad(3);
+	}, e.prototype.tetrad = function() {
+		return this.polyad(4);
+	}, e.prototype.polyad = function(t) {
+		for (var n = this.toHsl(), r = n.h, i = [this], a = 360 / t, o = 1; o < t; o++) i.push(new e({
+			h: (r + o * a) % 360,
+			s: n.s,
+			l: n.l
+		}));
+		return i;
+	}, e.prototype.equals = function(t) {
+		return this.toRgbString() === new e(t).toRgbString();
+	}, e;
+}();
+const viewFadeIn = new Keyframe("viewFadeIn", {
+	"0%": { opacity: 0 },
+	"100%": { opacity: 1 }
+}), viewFadeOut = new Keyframe("viewFadeOut", {
+	"0%": { opacity: 1 },
+	"100%": { opacity: 0 }
+});
+var viewZoomBadgeIn = new Keyframe("viewZoomBadgeIn", {
+	"0%": {
+		transform: "scale(0)",
+		opacity: 0
+	},
+	"100%": {
+		transform: "scale(1)",
+		opacity: 1
+	}
+}), viewZoomBadgeOut = new Keyframe("viewZoomBadgeOut", {
+	"0%": { transform: "scale(1)" },
+	"100%": {
+		transform: "scale(0)",
+		opacity: 0
+	}
+});
+function genBoxStyle$1(e) {
+	return {
+		position: e || "absolute",
+		inset: 0
+	};
+}
+function box(e) {
+	return {
+		position: e,
+		top: 0,
+		insetInlineEnd: 0,
+		bottom: 0,
+		insetInlineStart: 0
+	};
+}
+function genPreviewOperationsStyle(e) {
+	let { previewCls: t, modalMaskBg: n, marginXL: r, margin: i, colorTextLightSolid: a, previewOperationColorDisabled: o, previewOperationHoverColor: s, motionDurationSlow: c, iconCls: l } = e, u = new TinyColor(n).setAlpha(.1), d = u.clone().setAlpha(.2), f = new TinyColor(n).setAlpha(.5), p = new TinyColor(n).setAlpha(.03);
+	return {
+		[`${t}-footer`]: {
+			position: "fixed",
+			bottom: r,
+			left: {
+				_skip_check_: !0,
+				value: "50%"
+			},
+			display: "flex",
+			flexDirection: "column",
+			alignItems: "center",
+			color: e.previewOperationColor,
+			transform: "translateX(-50%)"
+		},
+		[`${t}-progress`]: { marginBottom: i },
+		[`${t}-close`]: {
+			position: "fixed",
+			top: r,
+			right: {
+				_skip_check_: !0,
+				value: r
+			},
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			color: a,
+			backgroundColor: u.toRgbString(),
+			borderRadius: e.borderRadiusLG,
+			backdropFilter: "saturate(180%) blur(10px)",
+			width: e.sizeXL,
+			height: e.sizeXL,
+			outline: 0,
+			border: 0,
+			cursor: "pointer",
+			transition: `all ${c}`,
+			"&:hover": { backgroundColor: d.toRgbString() },
+			[`& > ${l}`]: { fontSize: e.previewOperationSize }
+		},
+		[`${t}-operations`]: {
+			display: "flex",
+			alignItems: "center",
+			gap: e.sizeXXS,
+			padding: e.paddingXXS,
+			border: `1px solid ${e.colorBorderSecondary}`,
+			backgroundColor: f.toRgbString(),
+			borderRadius: e.borderRadiusLG,
+			backdropFilter: "saturate(150%) blur(10px)",
+			"&-operation": {
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "center",
+				width: e.sizeXL + 4,
+				height: e.sizeXL + 4,
+				cursor: "pointer",
+				color: a,
+				borderRadius: e.borderRadiusSM,
+				transition: `all ${c}`,
+				userSelect: "none",
+				[`&:not(${t}-operations-operation-disabled):hover > ${l}`]: { color: s },
+				"&:hover": { backgroundColor: p.toRgbString() },
+				"&-disabled": {
+					color: o,
+					cursor: "not-allowed"
+				},
+				"&:first-of-type": { marginInlineStart: 0 },
+				[`& > ${l}`]: { fontSize: e.previewOperationSize }
+			}
+		}
+	};
+}
+function genPreviewSwitchStyle(e) {
+	let { modalMaskBg: t, iconCls: n, previewOperationColorDisabled: r, previewCls: i, zIndexPopup: a, motionDurationSlow: o, colorTextLightSolid: s } = e, c = new TinyColor(t).setAlpha(.1), l = c.clone().setAlpha(.2);
+	return {
+		[`${i}-switch-left, ${i}-switch-right`]: {
+			position: "fixed",
+			insetBlockStart: "50%",
+			zIndex: e.calc(a).add(1).equal(),
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			borderRadius: e.borderRadius,
+			backdropFilter: "saturate(180%) blur(10px)",
+			width: e.imagePreviewSwitchSize,
+			height: e.imagePreviewSwitchSize,
+			marginTop: e.calc(e.imagePreviewSwitchSize).mul(-1).div(2).equal(),
+			color: s,
+			background: c.toRgbString(),
+			transform: "translateY(-50%)",
+			cursor: "pointer",
+			transition: `all ${o}`,
+			userSelect: "none",
+			"&:hover": { background: l.toRgbString() },
+			"&-disabled": { "&, &:hover": {
+				color: r,
+				background: "transparent",
+				cursor: "not-allowed",
+				[`> ${n}`]: { cursor: "not-allowed" }
+			} },
+			[`> ${n}`]: { fontSize: e.previewOperationSize }
+		},
+		[`${i}-switch-left`]: { insetInlineStart: e.marginSM },
+		[`${i}-switch-right`]: { insetInlineEnd: e.marginSM }
+	};
+}
+var genImagePreviewStyle = (e) => {
+	let { motionEaseOut: t, motionDurationSlow: n } = e;
+	return {
+		[e.componentCls]: {
+			height: "100%",
+			textAlign: "center",
+			pointerEvents: "none",
+			"&-root": {
+				...box("fixed"),
+				zIndex: e.zIndexPopup,
+				overflow: "auto",
+				outline: 0,
+				WebkitOverflowScrolling: "touch"
+			},
+			"&-wrap": {
+				...box("fixed"),
+				zIndex: e.zIndexPopup,
+				overflow: "auto",
+				outline: 0,
+				WebkitOverflowScrolling: "touch"
+			},
+			"&-mask": {
+				...box("fixed"),
+				zIndex: e.zIndexPopupBase,
+				height: "100%",
+				backgroundColor: e.colorBgMask,
+				backdropFilter: "blur(8px)"
+			},
+			"&-body": {
+				...genBoxStyle$1(),
+				overflow: "hidden"
+			},
+			"&-img": {
+				maxWidth: "100%",
+				maxHeight: "70%",
+				verticalAlign: "middle",
+				transform: "scale3d(1, 1, 1)",
+				cursor: "grab",
+				transition: `transform ${n} ${t} 0s`,
+				userSelect: "none",
+				"&-wrapper": {
+					...genBoxStyle$1(),
+					transition: `transform ${n} ${t} 0s`,
+					display: "flex",
+					justifyContent: "center",
+					alignItems: "center",
+					"& > *": { pointerEvents: "auto" },
+					"&::before": {
+						display: "inline-block",
+						width: 1,
+						height: "50%",
+						marginInlineEnd: -1,
+						content: "\"\""
+					}
+				}
+			},
+			"&-moving": { [`${e.componentCls}-view-img`]: {
+				cursor: "grabbing",
+				"&-wrapper": { transitionDuration: "0s" }
+			} },
+			"&-mask-zoom-appear, &-mask-zoom-enter": {
+				animationName: viewFadeIn,
+				animationDuration: e.motionDurationSlow,
+				animationTimingFunction: "linear",
+				userSelect: "none"
+			},
+			"&-mask-zoom-leave": {
+				animationName: viewFadeOut,
+				animationDuration: e.motionDurationSlow,
+				animationTimingFunction: "linear",
+				pointerEvents: "none"
+			},
+			"&-zoom-appear, &-zoom-enter": {
+				animationName: viewZoomBadgeIn,
+				opacity: 0,
+				animationTimingFunction: e.motionEaseOutCirc,
+				animationFillMode: "both",
+				transform: "none",
+				animationDuration: e.motionDurationMid,
+				userSelect: "none"
+			},
+			"&-zoom-enter-active": { animationPlayState: "running" },
+			"&-zoom-leave": {
+				animationName: viewZoomBadgeOut,
+				animationDuration: e.motionDurationSlow,
+				animationTimingFunction: e.motionEaseInOutCirc,
+				animationFillMode: "both"
+			}
+		},
+		[`${e.componentCls}-root`]: { [`${e.componentCls}-wrapper`]: { zIndex: e.zIndexPopup } },
+		[`${e.componentCls}-operations-wrapper`]: {
+			position: "fixed",
+			insetBlockStart: 0,
+			insetInlineEnd: 0,
+			zIndex: e.calc(e.zIndexPopup).add(1).equal(),
+			width: "100%"
+		},
+		"&": [genPreviewOperationsStyle(e), genPreviewSwitchStyle(e)]
+	};
+};
+function useStyle$1(e) {
+	return useStyle("ImageViewer", (e) => [genImagePreviewStyle(mergeToken(e, {
+		zIndexPopup: e.zIndexPopupBase + 80,
+		previewOperationColor: new TinyColor(e.colorTextLightSolid).setAlpha(.65).toRgbString(),
+		previewOperationHoverColor: new TinyColor(e.colorTextLightSolid).setAlpha(.85).toRgbString(),
+		previewOperationColorDisabled: new TinyColor(e.colorTextLightSolid).setAlpha(.25).toRgbString(),
+		imagePreviewSwitchSize: e.sizeXL,
+		modalMaskBg: new TinyColor("#000").setAlpha(.45).toRgbString(),
+		previewOperationSize: e.fontSizeIcon * 1.5,
+		iconCls: ".anticon",
+		previewCls: e.componentCls
+	}))], e);
+}
+var 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(e) {
+		let { keyCode: t } = e;
+		if (e.altKey && !e.ctrlKey || e.metaKey || t >= KeyCode.F1 && t <= KeyCode.F12) return !1;
+		switch (t) {
+			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 !1;
+			default: return !0;
+		}
+	},
+	isCharacterKey: function(e) {
+		if (e >= KeyCode.ZERO && e <= KeyCode.NINE || e >= KeyCode.NUM_ZERO && e <= KeyCode.NUM_MULTIPLY || e >= KeyCode.A && e <= KeyCode.Z || window.navigator.userAgent.includes("WebKit") && e === 0) return !0;
+		switch (e) {
+			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 !0;
+			default: return !1;
+		}
+	}
+}, defaultIcons = {
+	rotateLeft: createVNode(RotateLeftOutlined, null, null),
+	rotateRight: createVNode(RotateRightOutlined, null, null),
+	zoomIn: createVNode(ZoomInOutlined, null, null),
+	zoomOut: createVNode(ZoomOutOutlined, null, null),
+	flipX: createVNode(SwapOutlined, null, null),
+	flipY: createVNode(SwapOutlined, { rotate: 90 }, null)
+}, GImagePreview = /* @__PURE__ */ defineComponent({
+	name: "GImagePreview",
+	props: props_default,
+	inheritAttrs: !1,
+	slots: Object,
+	emits: {
+		close: () => !0,
+		transform: (e) => !0,
+		"update:open": (e) => !0
+	},
+	setup: (r, { emit: o, expose: s, slots: c }) => {
+		let l = getPrefixCls({ suffixCls: "image-view" }), { wrapSSR: u, hashId: d } = useStyle$1(l), [f, m, y] = useMergedState(r.open, {
+			value: toRef(r, "open"),
+			onChange: (e) => {
+				r.onOpenChange?.(e), o("update:open", e);
+			}
+		}), [x, S] = useState(!1), [w, E] = useState(!0), D = ref(), { transform: O, resetTransform: k, updateTransform: A, dispatchZoomChange: j } = useImageTransform(D, toRef(r, "minScale"), toRef(r, "maxScale"), r.onTransform), { isMoving: M, onMouseDown: N, onWheel: P } = useMouseEvent(D, toRef(r, "movable"), y, toRef(r, "scaleStep"), O, A, j), { isTouching: F, onTouchStart: I, onTouchMove: R, onTouchEnd: z } = useTouchEvent(D, toRef(r, "movable"), y, toRef(r, "minScale"), O, A, j);
+		useEffect(() => {
+			w.value || E(!0);
+		}, [w]);
+		let B = ref(null), V = ref(r.current), H = reactive(/* @__PURE__ */ new Map()), U = computed(() => new Map(Array.from(H).map(([e, { url: t }]) => [e, t]))), ne = computed(() => U.value.get(V.value)), W = computed(() => U.value.size), G = computed(() => Array.from(U.value.keys())), K = computed(() => G.value.indexOf(V.value)), q = computed(() => W.value > 1), re = computed(() => W.value >= 1);
+		watch(y, (e) => {
+			e && (x.value = !0);
+		});
+		let J = (e) => {
+			V.value = e;
+		};
+		watch(() => r.current, (e) => {
+			isNumber(e) && J(e);
+		});
+		function ie(e, t) {
+			H.set(e, {
+				url: t,
+				loading: !0,
+				canPreview: !1
+			});
+		}
+		let Y = () => {
+			S(!1);
+		}, ae = () => {
+			k("close"), o("close");
+		}, oe = (e) => {
+			M.value || B.value === e?.target && Y();
+		}, se = () => {
+			let e = H.get(V.value);
+			e && (e.loading = !1, e.canPreview = !0);
+		}, ce = (e) => {
+			let t = H.get(V.value);
+			t && (t.loading = !1, t.canPreview = !1), e.target.alt = "加载失败";
+		}, X = () => {
+			if (K.value > 0 || r.infinite) {
+				let e = K.value - 1 < 0 ? r.urls.length - 1 : K.value - 1;
+				J(G.value[e]), k("prev");
+			}
+		}, Z = () => {
+			if (K.value < W.value - 1 || r.infinite) {
+				let e = K.value + 1 > r.urls.length - 1 ? 0 : K.value + 1;
+				J(G.value[e]), k("next");
+			}
+		}, le = () => {
+			j(1 + r.scaleStep, "zoomIn");
+		}, ue = () => {
+			j(1 / (1 + r.scaleStep), "zoomOut");
+		}, de = () => {
+			A({ rotate: O.value.rotate + 90 }, "rotateRight");
+		}, fe = () => {
+			A({ rotate: O.value.rotate - 90 }, "rotateLeft");
+		}, pe = () => {
+			A({ flipX: !O.value.flipX }, "flipX");
+		}, me = () => {
+			A({ flipY: !O.value.flipY }, "flipY");
+		}, Q = () => {
+			let e = getSlotsProps({
+				slots: c,
+				props: r.icons,
+				keys: [
+					"flipY",
+					"flipX",
+					"rotateLeft",
+					"rotateRight",
+					"zoomOut",
+					"zoomIn"
+				],
+				render: !0,
+				defaultVNodes: [
+					defaultIcons.flipY,
+					defaultIcons.flipX,
+					defaultIcons.rotateLeft,
+					defaultIcons.rotateRight,
+					defaultIcons.zoomOut,
+					defaultIcons.zoomIn
+				]
+			});
+			return [
+				{
+					icon: e.flipY,
+					onClick: me,
+					type: "flipY"
+				},
+				{
+					icon: e.flipX,
+					onClick: pe,
+					type: "flipX"
+				},
+				{
+					icon: e.rotateLeft,
+					onClick: fe,
+					type: "rotateLeft"
+				},
+				{
+					icon: e.rotateRight,
+					onClick: de,
+					type: "rotateRight"
+				},
+				{
+					icon: e.zoomOut,
+					onClick: () => ue(),
+					type: "zoomOut",
+					disabled: computed(() => O.value.scale <= r.minScale)
+				},
+				{
+					icon: e.zoomIn,
+					onClick: () => le(),
+					type: "zoomIn",
+					disabled: computed(() => O.value.scale === r.maxScale)
+				}
+			];
+		}, he = (e) => {
+			y.value && (O.value.scale === 1 ? j(1 + r.scaleStep, "doubleClick", e.clientX, e.clientY) : A({
+				x: 0,
+				y: 0,
+				scale: 1
+			}, "doubleClick"));
+		}, ge = (e) => {
+			e.keyCode === KeyCode.ESC && Y(), !(!y.value || !q.value) && (e.keyCode === KeyCode.LEFT ? X() : e.keyCode === KeyCode.RIGHT && Z());
+		}, $ = () => {};
+		return onMounted(() => {
+			watch(() => r.urls, (e) => {
+				isArray(e) && e.forEach((e, t) => {
+					ie(t, e);
+				});
+			}, {
+				flush: "post",
+				immediate: !0
+			}), watch([() => y.value, () => M.value], () => {
+				$();
+				let e = addEventListenerWrap(window, "keydown", ge, !1);
+				$ = () => {
+					e.remove();
+				};
+			}, {
+				flush: "post",
+				immediate: !0
+			});
+		}), onUnmounted(() => {
+			$();
+		}), s({ setOpen: (e) => {
+			m(e), V.value = r.current;
+		} }), () => {
+			let i = getTransitionProps(`${l}-mask-zoom`), o = getTransitionProps(`${l}-zoom`), s = {};
+			for (let e in r.icons) s[e] = getSlotVNode({
+				slots: c,
+				props: r.icons,
+				key: e
+			});
+			return u(createVNode(Fragment, null, [createVNode(Teleport, { to: r.getContainer || "body" }, { default: () => [y.value && createVNode(Fragment, null, [createVNode("div", { class: `${l}-root ${d.value}` }, [createVNode(Transition, i, { default: () => [withDirectives(createVNode("div", { class: `${l}-mask ${d.value}` }, null), [[vShow, y.value && x.value]])] }), createVNode("div", {
+				ref: B,
+				tabindex: -1,
+				class: [
+					`${l}-wrap`,
+					`${d.value}`,
+					M.value && `${l}-moving`
+				],
+				onClick: (e) => r.onHideOnClickModal && oe(e)
+			}, [createVNode(Transition, mergeProps(o, { onAfterLeave: () => ae() }), { default: () => [withDirectives(createVNode("div", {
+				role: "dialog",
+				class: `${l} ${d.value}`
+			}, [createVNode("div", { class: `${l}-content ${d.value}` }, [createVNode("div", { class: `${l}-body ${d.value}` }, [createVNode("div", { class: `${l}-img-wrapper ${d.value}` }, [createVNode("img", {
+				ref: D,
+				class: `${l}-img ${d.value}`,
+				src: ne.value,
+				onLoad: () => se(),
+				onError: (e) => ce(e),
+				style: {
+					transform: `translate3d(${O.value.x}px, ${O.value.y}px, 0) scale3d(${O.value.flipX ? "-" : ""}${O.value.scale}, ${O.value.flipY ? "-" : ""}${O.value.scale}, 1) rotate(${O.value.rotate}deg)`,
+					transitionDuration: !w.value || F.value ? "0s" : void 0
+				},
+				onWheel: P,
+				onMousedown: N,
+				onDblclick: he,
+				onTouchstart: I,
+				onTouchmove: R,
+				onTouchend: z,
+				onTouchcancel: z
+			}, null)])])])]), [[vShow, y.value && x.value]])] })])])])] }), y.value && x.value && createVNode(Operations_default, {
+				open: y.value && x.value,
+				hashId: d.value,
+				count: r.urls.length,
+				current: V.value,
+				zIndex: r.zIndex + 1,
+				getContainer: r.getContainer,
+				prefixCls: l,
+				icons: omit(s, Q().map(({ type: e }) => e)),
+				tools: Q(),
+				infinite: r.infinite,
+				countRender: getSlot({
+					slots: c,
+					props: r,
+					key: "countRender"
+				}),
+				showSwitch: q.value,
+				showProgress: re.value,
+				onClose: Y,
+				onActive: (e) => e > 0 ? Z() : X()
+			}, null)]));
+		};
+	}
+}), fullSize = {
+	width: "100%",
+	height: "100%"
+}, textEllipsis = {
+	overflow: "hidden",
+	whiteSpace: "nowrap",
+	textOverflow: "ellipsis"
+};
+function genImageMaskStyle(e) {
+	let { motionDurationSlow: t, paddingXXS: n, marginXXS: r, colorTextLightSolid: i } = e;
+	return {
+		position: "absolute",
+		inset: 0,
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		color: i,
+		background: new FastColor("#000").setA(.5).toRgbString(),
+		cursor: "pointer",
+		opacity: 0,
+		transition: `opacity ${t}`,
+		[`.${e.componentCls}-mask-info`]: {
+			...textEllipsis,
+			padding: `0 ${unit(n)}`,
+			".anticon": {
+				marginInlineEnd: r,
+				svg: { verticalAlign: "baseline" }
+			}
+		}
+	};
+}
+function genBoxStyle(e) {
+	return {
+		position: e || "absolute",
+		inset: 0
+	};
+}
+const genImageStyle = (e) => ({ [e.componentCls]: {
+	display: "inline-block",
+	position: "relative",
+	overflow: "hidden",
+	[`${e.componentCls}-img`]: {
+		...fullSize,
+		verticalAlign: "top",
+		opacity: 1,
+		[`&${e.componentCls}-img-preview`]: {
+			userSelect: "none",
+			cursor: "pointer"
+		},
+		"&-placeholder": {
+			...fullSize,
+			backgroundColor: e.colorBgContainerDisabled,
+			backgroundImage: "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTQuNSAyLjVoLTEzQS41LjUgMCAwIDAgMSAzdjEwYS41LjUgMCAwIDAgLjUuNWgxM2EuNS41IDAgMCAwIC41LS41VjNhLjUuNSAwIDAgMC0uNS0uNXpNNS4yODEgNC43NWExIDEgMCAwIDEgMCAyIDEgMSAwIDAgMSAwLTJ6bTguMDMgNi44M2EuMTI3LjEyNyAwIDAgMS0uMDgxLjAzSDIuNzY5YS4xMjUuMTI1IDAgMCAxLS4wOTYtLjIwN2wyLjY2MS0zLjE1NmEuMTI2LjEyNiAwIDAgMSAuMTc3LS4wMTZsLjAxNi4wMTZMNy4wOCAxMC4wOWwyLjQ3LTIuOTNhLjEyNi4xMjYgMCAwIDEgLjE3Ny0uMDE2bC4wMTUuMDE2IDMuNTg4IDQuMjQ0YS4xMjcuMTI3IDAgMCAxLS4wMi4xNzV6IiBmaWxsPSIjOEM4QzhDIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48L3N2Zz4=')",
+			backgroundRepeat: "no-repeat",
+			backgroundPosition: "center center",
+			backgroundSize: "30%"
+		}
+	},
+	[`${e.componentCls}-error`]: {
+		...fullSize,
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center"
+	},
+	[`${e.componentCls}-placeholder`]: { ...genBoxStyle() },
+	[`${e.componentCls}-mask`]: { ...genImageMaskStyle(e) },
+	[`${e.componentCls}-mask:hover`]: { opacity: 1 }
+} });
+function isElement(e) {
+	return typeof Element > "u" ? !1 : e instanceof Element;
+}
+var prevOverflow = "";
+function fromPairs(e) {
+	let t = {};
+	for (let n = 0; n < e.length; n++) {
+		let r = e[n];
+		t[r[0]] = r[1];
+	}
+	return t;
+}
+var GImage = /* @__PURE__ */ defineComponent({
+	props: imageProps,
+	name: "GImage",
+	inheritAttrs: !1,
+	emits: {
+		click: (e) => !0,
+		load: (e) => !0,
+		error: (e) => !0
+	},
+	slots: Object,
+	setup(t, { slots: n, emit: r, attrs: o }) {
+		let s = isClient && "loading" in HTMLImageElement.prototype, c = getPrefixCls({ suffixCls: "image" }), { wrapSSR: l, hashId: u } = useProStyle("Image", [genImageStyle], c), d = ref(), f = ref(), g = ref(!1), _ = ref(!0), y = ref(!1), b = ref(), x = ref(), S, C, T = computed(() => t.loading === "eager" ? !1 : !s && t.loading === "lazy" || t.lazy), E = computed(() => isClient && t.fit ? {
+			...t.imageStyle,
+			objectFit: t.fit
+		} : t.imageStyle), O = computed(() => typeof t.preview == "object" ? t.preview : {}), k = computed(() => !!t.preview), A = computed(() => {
+			let { urls: e = [], current: n = 0 } = O.value;
+			if (isNumber(n)) return e.length >= n ? n : 0;
+			let r = e.indexOf(t.src);
+			return r >= 0 ? r : 0;
+		}), j = computed(() => unit(t.width)), M = computed(() => unit(t.height)), N = () => {
+			isClient && (_.value = !0, g.value = !1, f.value = t.src);
+		};
+		function P(e) {
+			g.value || (_.value = !1, g.value = !1, r("load", e));
+		}
+		function F(e) {
+			_.value = !1, g.value = !0, r("error", e);
+		}
+		function I() {
+			isInContainer(b.value, x.value) && (N(), V());
+		}
+		let L = useThrottleFn(I, 200, !0);
+		async function R() {
+			if (!isClient) return;
+			await nextTick();
+			let { scrollContainer: e } = t;
+			isElement(e) ? x.value = e : isString(e) && e !== "" ? x.value = document.querySelector(e) ?? void 0 : b.value && (x.value = getScrollContainer(b.value)), x.value && (S = useEventListener(x, "scroll", L), setTimeout(() => I(), 100));
+		}
+		function V() {
+			!isClient || !x.value || !L || (S?.(), x.value = void 0);
+		}
+		function H(e) {
+			if (e.ctrlKey && (e.deltaY < 0 || e.deltaY > 0)) return e.preventDefault(), !1;
+		}
+		let U = () => {
+			r("click", _.value ? "loaded" : g.value ? "error" : "success"), !(_.value || g.value) && k.value && (C = useEventListener("wheel", H, { passive: !1 }), prevOverflow = document.body.style.overflow, document.body.style.overflow = "hidden", y.value = !0);
+		}, te = () => {
+			C?.(), document.body.style.overflow = prevOverflow, y.value = !1;
+		};
+		return watch(() => t.src, () => {
+			T.value ? (_.value = !0, g.value = !1, V(), R()) : N();
+		}), watchEffect(() => {
+			k.value && y.value ? d.value?.setOpen(!0) : d.value?.setOpen(!1);
+		}), onMounted(() => {
+			T.value ? R() : N();
+		}), () => {
+			let r = fromPairs(Object.entries(o).filter(([e]) => /^(?:data-|on[A-Z])/i.test(e) || [
+				"id",
+				"style",
+				"class"
+			].includes(e))), i = omit(o, Object.keys(r)), s = getSlotsProps({
+				slots: n,
+				props: t,
+				keys: [
+					"fallback",
+					"mask",
+					"placeholder"
+				],
+				render: !0
+			});
+			return l(createVNode("div", mergeProps({
+				class: {
+					[`${u.value}`]: !0,
+					[`${c}`]: !0
+				},
+				ref: b
+			}, r, {
+				style: {
+					width: unit(t.size) || j.value,
+					height: unit(t.size) || M.value,
+					...r.style || {}
+				},
+				onClick: () => {
+					g.value && U();
+				}
+			}), [
+				g.value ? createVNode("div", { class: classNames_default(u.value, `${c}-error`) }, [s.fallback]) : createVNode(Fragment, null, [createVNode("img", mergeProps(i, {
+					src: f.value,
+					loading: t.loading,
+					style: E.value,
+					class: classNames_default(u.value, t.imageClass, `${c}-img`, {
+						[`${c}-img-placeholder`]: t.placeholder === !0,
+						[`${c}-img-preview`]: k.value
+					}),
+					crossorigin: t.crossOrigin,
+					width: j.value,
+					height: M.value,
+					onClick: U,
+					onLoad: P,
+					onError: F
+				}), null), _.value && createVNode("div", {
+					class: classNames_default(`${c}-placeholder`, u.value),
+					onClick: U
+				}, [s.placeholder])]),
+				O.value.mask && k.value && createVNode("div", {
+					class: classNames_default(`${c}-mask`, O.value.maskClass, u.value),
+					style: { display: r.style?.display === "none" ? "none" : void 0 }
+				}, [s.mask || createVNode("div", { class: classNames_default(`${c}-mask-info`, u.value) }, [createVNode(EyeOutlined, null, null)])]),
+				k.value && createVNode(GImagePreview, mergeProps({ ref: d }, O.value, {
+					urls: O.value.urls || [t.src],
+					current: A.value,
+					onClose: () => te()
+				}), n)
+			]));
+		};
+	}
+});
+GImage.isGImage = !0, GImage.install = (e) => (e.component(GImage.name, GImage), e);
+export { GImage, GImagePreview, baseProps, imageProps };