@hirely/ui 0.1.7 → 0.1.9

package/dist/node_modules/.bun/react-easy-crop@6.2.2_7492c01c6988791b/node_modules/react-easy-crop/index.module.js

@@ -0,0 +1,512 @@
+import { __toESM as e } from "../../../../../_virtual/_rolldown/runtime.js";
+import { require_normalize_wheel as t } from "../../../normalize-wheel@1.0.1/node_modules/normalize-wheel/index.js";
+import * as n from "react";
+//#region ../../node_modules/.bun/react-easy-crop@6.2.2+7492c01c6988791b/node_modules/react-easy-crop/index.module.mjs
+var r = /* @__PURE__ */ e(t(), 1);
+function i(e) {
+	"@babel/helpers - typeof";
+	return i = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
+		return typeof e;
+	} : function(e) {
+		return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
+	}, i(e);
+}
+function a(e, t) {
+	if (i(e) != "object" || !e) return e;
+	var n = e[Symbol.toPrimitive];
+	if (n !== void 0) {
+		var r = n.call(e, t || "default");
+		if (i(r) != "object") return r;
+		throw TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return (t === "string" ? String : Number)(e);
+}
+function o(e) {
+	var t = a(e, "string");
+	return i(t) == "symbol" ? t : t + "";
+}
+function s(e, t, n) {
+	return (t = o(t)) in e ? Object.defineProperty(e, t, {
+		value: n,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[t] = n, e;
+}
+function c(e, t) {
+	var n = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var r = Object.getOwnPropertySymbols(e);
+		t && (r = r.filter(function(t) {
+			return Object.getOwnPropertyDescriptor(e, t).enumerable;
+		})), n.push.apply(n, r);
+	}
+	return n;
+}
+function l(e) {
+	for (var t = 1; t < arguments.length; t++) {
+		var n = arguments[t] == null ? {} : arguments[t];
+		t % 2 ? c(Object(n), !0).forEach(function(t) {
+			s(e, t, n[t]);
+		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : c(Object(n)).forEach(function(t) {
+			Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
+		});
+	}
+	return e;
+}
+function u(e, t, n, r, i, a = 0) {
+	let { width: o, height: s } = w(e, t, a), c = Math.min(o, n), l = Math.min(s, r);
+	return c > l * i ? {
+		width: l * i,
+		height: l
+	} : {
+		width: c,
+		height: c / i
+	};
+}
+function d(e) {
+	return e.width > e.height ? e.width / e.naturalWidth : e.height / e.naturalHeight;
+}
+function f(e, t, n, r, i = 0) {
+	let { width: a, height: o } = w(t.width, t.height, i);
+	return {
+		x: p(e.x, a, n.width, r),
+		y: p(e.y, o, n.height, r)
+	};
+}
+function p(e, t, n, r) {
+	let i = Math.abs(t * r / 2 - n / 2);
+	return T(e, -i, i);
+}
+function m(e, t) {
+	return Math.sqrt((e.y - t.y) ** 2 + (e.x - t.x) ** 2);
+}
+function h(e, t) {
+	return Math.atan2(t.y - e.y, t.x - e.x) * 180 / Math.PI;
+}
+function g(e, t, n, r, i, a = 0, o = !0) {
+	let s = o ? _ : v, c = w(t.width, t.height, a), u = w(t.naturalWidth, t.naturalHeight, a), d = {
+		x: s(100, ((c.width - n.width / i) / 2 - e.x / i) / c.width * 100),
+		y: s(100, ((c.height - n.height / i) / 2 - e.y / i) / c.height * 100),
+		width: s(100, n.width / c.width * 100 / i),
+		height: s(100, n.height / c.height * 100 / i)
+	}, f = Math.round(s(u.width, d.width * u.width / 100)), p = Math.round(s(u.height, d.height * u.height / 100)), m = u.width >= u.height * r ? {
+		width: Math.round(p * r),
+		height: p
+	} : {
+		width: f,
+		height: Math.round(f / r)
+	};
+	return {
+		croppedAreaPercentages: d,
+		croppedAreaPixels: l(l({}, m), {}, {
+			x: Math.round(s(u.width - m.width, d.x * u.width / 100)),
+			y: Math.round(s(u.height - m.height, d.y * u.height / 100))
+		})
+	};
+}
+function _(e, t) {
+	return Math.min(e, Math.max(0, t));
+}
+function v(e, t) {
+	return t;
+}
+function y(e, t, n, r, i, a) {
+	let o = w(t.width, t.height, n), s = T(r.width / o.width * (100 / e.width), i, a);
+	return {
+		crop: {
+			x: s * o.width / 2 - r.width / 2 - o.width * s * (e.x / 100),
+			y: s * o.height / 2 - r.height / 2 - o.height * s * (e.y / 100)
+		},
+		zoom: s
+	};
+}
+function b(e, t, n) {
+	let r = d(t);
+	return n.height > n.width ? n.height / (e.height * r) : n.width / (e.width * r);
+}
+function x(e, t, n = 0, r, i, a) {
+	let o = w(t.naturalWidth, t.naturalHeight, n), s = T(b(e, t, r), i, a), c = r.height > r.width ? r.height / e.height : r.width / e.width;
+	return {
+		crop: {
+			x: ((o.width - e.width) / 2 - e.x) * c,
+			y: ((o.height - e.height) / 2 - e.y) * c
+		},
+		zoom: s
+	};
+}
+function S(e, t) {
+	return {
+		x: (t.x + e.x) / 2,
+		y: (t.y + e.y) / 2
+	};
+}
+function C(e) {
+	return e * Math.PI / 180;
+}
+function w(e, t, n) {
+	let r = C(n);
+	return {
+		width: Math.abs(Math.cos(r) * e) + Math.abs(Math.sin(r) * t),
+		height: Math.abs(Math.sin(r) * e) + Math.abs(Math.cos(r) * t)
+	};
+}
+function T(e, t, n) {
+	return Math.min(Math.max(e, t), n);
+}
+function E(...e) {
+	return e.filter((e) => typeof e == "string" && e.length > 0).join(" ").trim();
+}
+var D = ".reactEasyCrop_Container {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  overflow: hidden;\n  user-select: none;\n  touch-action: none;\n  cursor: move;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.reactEasyCrop_Image,\n.reactEasyCrop_Video {\n  will-change: transform; /* this improves performances and prevent painting issues on iOS Chrome */\n  max-width: unset; /* prevent global img/video reset rules from constraining the cropper media */\n}\n\n.reactEasyCrop_Contain {\n  max-width: 100%;\n  max-height: 100%;\n  margin: auto;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n}\n.reactEasyCrop_Cover_Horizontal {\n  width: 100%;\n  height: auto;\n}\n.reactEasyCrop_Cover_Vertical {\n  width: auto;\n  height: 100%;\n}\n\n.reactEasyCrop_CropArea {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  border: 1px solid rgba(255, 255, 255, 0.5);\n  box-sizing: border-box;\n  box-shadow: 0 0 0 9999em;\n  color: rgba(0, 0, 0, 0.5);\n  overflow: hidden;\n}\n\n.reactEasyCrop_CropAreaRound {\n  border-radius: 50%;\n}\n\n.reactEasyCrop_CropAreaGrid::before {\n  content: ' ';\n  box-sizing: border-box;\n  position: absolute;\n  border: 1px solid rgba(255, 255, 255, 0.5);\n  top: 0;\n  bottom: 0;\n  left: 33.33%;\n  right: 33.33%;\n  border-top: 0;\n  border-bottom: 0;\n}\n\n.reactEasyCrop_CropAreaGrid::after {\n  content: ' ';\n  box-sizing: border-box;\n  position: absolute;\n  border: 1px solid rgba(255, 255, 255, 0.5);\n  top: 33.33%;\n  bottom: 33.33%;\n  left: 0;\n  right: 0;\n  border-left: 0;\n  border-right: 0;\n}\n", O = 250, k = 1, A = 3, j = 1, M = class e extends n.Component {
+	constructor(...t) {
+		super(...t), this.cropperRef = n.createRef(), this.imageRef = n.createRef(), this.videoRef = n.createRef(), this.containerPosition = {
+			x: 0,
+			y: 0
+		}, this.containerRef = null, this.styleRef = null, this.containerRect = null, this.mediaSize = {
+			width: 0,
+			height: 0,
+			naturalWidth: 0,
+			naturalHeight: 0
+		}, this.dragStartPosition = {
+			x: 0,
+			y: 0
+		}, this.dragStartCrop = {
+			x: 0,
+			y: 0
+		}, this.gestureZoomStart = 0, this.gestureRotationStart = 0, this.isTouching = !1, this.lastPinchDistance = 0, this.lastPinchRotation = 0, this.rafDragTimeout = null, this.rafPinchTimeout = null, this.wheelTimer = null, this.resizeEmitTimer = null, this.currentDoc = typeof document < "u" ? document : null, this.currentWindow = typeof window < "u" ? window : null, this.resizeObserver = null, this.previousCropSize = null, this.isInitialized = !1, this.dragInteractionSource = null, this.state = {
+			cropSize: null,
+			hasWheelJustStarted: !1,
+			mediaObjectFit: void 0
+		}, this.initResizeObserver = () => {
+			if (window.ResizeObserver === void 0 || !this.containerRef) return;
+			let e = !0;
+			this.resizeObserver = new window.ResizeObserver((t) => {
+				if (e) {
+					e = !1;
+					return;
+				}
+				this.computeSizes({ isResizeTriggered: !0 });
+			}), this.resizeObserver.observe(this.containerRef);
+		}, this.onWindowResize = () => {
+			this.computeSizes({ isResizeTriggered: !0 });
+		}, this.preventZoomSafari = (e) => e.preventDefault(), this.cleanEvents = () => {
+			this.currentDoc && (this.currentDoc.removeEventListener("mousemove", this.onMouseMove), this.currentDoc.removeEventListener("mouseup", this.onDragStopped), this.currentDoc.removeEventListener("touchmove", this.onTouchMove), this.currentDoc.removeEventListener("touchend", this.onDragStopped), this.currentDoc.removeEventListener("gesturechange", this.onGestureChange), this.currentDoc.removeEventListener("gestureend", this.onGestureEnd), this.currentDoc.removeEventListener("scroll", this.onScroll));
+		}, this.clearScrollEvent = () => {
+			this.containerRef && this.containerRef.removeEventListener("wheel", this.onWheel), this.wheelTimer && clearTimeout(this.wheelTimer);
+		}, this.onMediaLoad = () => {
+			let e = this.computeSizes();
+			e && (this.previousCropSize = e, this.emitCropData(), this.setInitialCrop(e), this.isInitialized = !0), this.props.onMediaLoaded && this.props.onMediaLoaded(this.mediaSize);
+		}, this.setInitialCrop = (e) => {
+			if (this.props.initialCroppedAreaPercentages) {
+				let { crop: t, zoom: n } = y(this.props.initialCroppedAreaPercentages, this.mediaSize, this.props.rotation, e, this.props.minZoom, this.props.maxZoom);
+				this.props.onCropChange(t), this.props.onZoomChange && this.props.onZoomChange(n);
+			} else if (this.props.initialCroppedAreaPixels) {
+				let { crop: t, zoom: n } = x(this.props.initialCroppedAreaPixels, this.mediaSize, this.props.rotation, e, this.props.minZoom, this.props.maxZoom);
+				this.props.onCropChange(t), this.props.onZoomChange && this.props.onZoomChange(n);
+			}
+		}, this.computeSizes = ({ isResizeTriggered: e = !1 } = {}) => {
+			let t = this.imageRef.current || this.videoRef.current;
+			if (t && this.containerRef) {
+				this.containerRect = this.containerRef.getBoundingClientRect(), this.saveContainerPosition();
+				let n = this.containerRect.width / this.containerRect.height, r = this.imageRef.current?.naturalWidth || this.videoRef.current?.videoWidth || 0, i = this.imageRef.current?.naturalHeight || this.videoRef.current?.videoHeight || 0, a = t.offsetWidth < r || t.offsetHeight < i, o = r / i, s;
+				if (a) switch (this.state.mediaObjectFit) {
+					default:
+					case "contain":
+						s = n > o ? {
+							width: this.containerRect.height * o,
+							height: this.containerRect.height
+						} : {
+							width: this.containerRect.width,
+							height: this.containerRect.width / o
+						};
+						break;
+					case "horizontal-cover":
+						s = {
+							width: this.containerRect.width,
+							height: this.containerRect.width / o
+						};
+						break;
+					case "vertical-cover":
+						s = {
+							width: this.containerRect.height * o,
+							height: this.containerRect.height
+						};
+						break;
+				}
+				else s = {
+					width: t.offsetWidth,
+					height: t.offsetHeight
+				};
+				this.mediaSize = l(l({}, s), {}, {
+					naturalWidth: r,
+					naturalHeight: i
+				}), this.props.setMediaSize && this.props.setMediaSize(this.mediaSize);
+				let c = this.props.cropSize ? this.props.cropSize : u(this.mediaSize.width, this.mediaSize.height, this.containerRect.width, this.containerRect.height, this.props.aspect, this.props.rotation);
+				return (this.state.cropSize?.height !== c.height || this.state.cropSize?.width !== c.width) && this.props.onCropSizeChange && this.props.onCropSizeChange(c), this.setState({ cropSize: c }, () => this.recomputeCropPosition({ isResizeTriggered: e })), this.props.setCropSize && this.props.setCropSize(c), c;
+			}
+		}, this.saveContainerPosition = () => {
+			if (this.containerRef) {
+				let e = this.containerRef.getBoundingClientRect();
+				this.containerPosition = {
+					x: e.left,
+					y: e.top
+				};
+			}
+		}, this.onMouseDown = (t) => {
+			this.currentDoc && (t.preventDefault(), this.currentDoc.addEventListener("mousemove", this.onMouseMove), this.currentDoc.addEventListener("mouseup", this.onDragStopped), this.saveContainerPosition(), this.onDragStart(e.getMousePoint(t), "mouse"));
+		}, this.onMouseMove = (t) => this.onDrag(e.getMousePoint(t)), this.onScroll = (e) => {
+			this.currentDoc && (e.preventDefault(), this.saveContainerPosition());
+		}, this.onTouchStart = (t) => {
+			this.currentDoc && (this.isTouching = !0, !(this.props.onTouchRequest && !this.props.onTouchRequest(t)) && (this.currentDoc.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), this.currentDoc.addEventListener("touchend", this.onDragStopped), this.saveContainerPosition(), t.touches.length === 2 ? this.onPinchStart(t) : t.touches.length === 1 && this.onDragStart(e.getTouchPoint(t.touches[0]), "touch")));
+		}, this.onTouchMove = (t) => {
+			t.preventDefault(), t.touches.length === 2 ? this.onPinchMove(t) : t.touches.length === 1 && this.onDrag(e.getTouchPoint(t.touches[0]));
+		}, this.onGestureStart = (e) => {
+			this.currentDoc && (e.preventDefault(), this.currentDoc.addEventListener("gesturechange", this.onGestureChange), this.currentDoc.addEventListener("gestureend", this.onGestureEnd), this.gestureZoomStart = this.props.zoom, this.gestureRotationStart = this.props.rotation);
+		}, this.onGestureChange = (t) => {
+			if (t.preventDefault(), this.isTouching) return;
+			let n = e.getMousePoint(t), r = this.gestureZoomStart - 1 + t.scale;
+			if (this.setNewZoom(r, n, { shouldUpdatePosition: !0 }), this.props.onRotationChange) {
+				let e = this.gestureRotationStart + t.rotation;
+				this.props.onRotationChange(e);
+			}
+		}, this.onGestureEnd = (e) => {
+			this.cleanEvents();
+		}, this.onDragStart = ({ x: e, y: t }, n) => {
+			var r, i;
+			this.dragStartPosition = {
+				x: e,
+				y: t
+			}, this.dragStartCrop = l({}, this.props.crop), this.dragInteractionSource = n, (r = (i = this.props).onInteractionStart) == null || r.call(i, { source: n });
+		}, this.onDrag = ({ x: e, y: t }) => {
+			this.currentWindow && (this.rafDragTimeout && this.currentWindow.cancelAnimationFrame(this.rafDragTimeout), this.rafDragTimeout = this.currentWindow.requestAnimationFrame(() => {
+				if (!this.state.cropSize || e === void 0 || t === void 0) return;
+				let n = e - this.dragStartPosition.x, r = t - this.dragStartPosition.y, i = {
+					x: this.dragStartCrop.x + n,
+					y: this.dragStartCrop.y + r
+				}, a = this.props.restrictPosition ? f(i, this.mediaSize, this.state.cropSize, this.props.zoom, this.props.rotation) : i;
+				this.props.onCropChange(a);
+			}));
+		}, this.onDragStopped = () => {
+			var e, t;
+			this.isTouching = !1, this.cleanEvents(), this.emitCropData(), (e = (t = this.props).onInteractionEnd) == null || e.call(t, { source: this.dragInteractionSource ?? "mouse" }), this.dragInteractionSource = null;
+		}, this.onWheel = (t) => {
+			if (!this.currentWindow || this.props.onWheelRequest && !this.props.onWheelRequest(t)) return;
+			t.preventDefault();
+			let n = e.getMousePoint(t), { pixelY: i } = (0, r.default)(t), a = this.props.zoom - i * this.props.zoomSpeed / 200;
+			this.setNewZoom(a, n, { shouldUpdatePosition: !0 }), this.state.hasWheelJustStarted || this.setState({ hasWheelJustStarted: !0 }, () => {
+				var e;
+				return (e = this.props).onInteractionStart?.call(e, { source: "wheel" });
+			}), this.wheelTimer && clearTimeout(this.wheelTimer), this.wheelTimer = this.currentWindow.setTimeout(() => this.setState({ hasWheelJustStarted: !1 }, () => {
+				var e;
+				return (e = this.props).onInteractionEnd?.call(e, { source: "wheel" });
+			}), 250);
+		}, this.getPointOnContainer = ({ x: e, y: t }, n) => {
+			if (!this.containerRect) throw Error("The Cropper is not mounted");
+			return {
+				x: this.containerRect.width / 2 - (e - n.x),
+				y: this.containerRect.height / 2 - (t - n.y)
+			};
+		}, this.getPointOnMedia = ({ x: e, y: t }) => {
+			let { crop: n, zoom: r } = this.props;
+			return {
+				x: (e + n.x) / r,
+				y: (t + n.y) / r
+			};
+		}, this.setNewZoom = (e, t, { shouldUpdatePosition: n = !0 } = {}) => {
+			if (!this.state.cropSize || !this.props.onZoomChange) return;
+			let r = T(e, this.props.minZoom, this.props.maxZoom);
+			if (n) {
+				let e = this.getPointOnContainer(t, this.containerPosition), n = this.getPointOnMedia(e), i = {
+					x: n.x * r - e.x,
+					y: n.y * r - e.y
+				}, a = this.props.restrictPosition ? f(i, this.mediaSize, this.state.cropSize, r, this.props.rotation) : i;
+				this.props.onCropChange(a);
+			}
+			this.props.onZoomChange(r);
+		}, this.getCropData = () => this.state.cropSize ? g(this.props.restrictPosition ? f(this.props.crop, this.mediaSize, this.state.cropSize, this.props.zoom, this.props.rotation) : this.props.crop, this.mediaSize, this.state.cropSize, this.getAspect(), this.props.zoom, this.props.rotation, this.props.restrictPosition) : null, this.emitCropData = () => {
+			this.resizeEmitTimer &&= (clearTimeout(this.resizeEmitTimer), null);
+			let e = this.getCropData();
+			if (!e) return;
+			let { croppedAreaPercentages: t, croppedAreaPixels: n } = e;
+			this.props.onCropComplete && this.props.onCropComplete(t, n), this.props.onCropAreaChange && this.props.onCropAreaChange(t, n);
+		}, this.emitCropAreaChange = () => {
+			let e = this.getCropData();
+			if (!e) return;
+			let { croppedAreaPercentages: t, croppedAreaPixels: n } = e;
+			this.props.onCropAreaChange && this.props.onCropAreaChange(t, n);
+		}, this.recomputeCropPosition = ({ isResizeTriggered: e = !1 } = {}) => {
+			if (!this.state.cropSize) return;
+			let t = this.props.crop;
+			if (this.isInitialized && this.previousCropSize?.width && this.previousCropSize?.height && (Math.abs(this.previousCropSize.width - this.state.cropSize.width) > 1e-6 || Math.abs(this.previousCropSize.height - this.state.cropSize.height) > 1e-6)) {
+				let e = this.state.cropSize.width / this.previousCropSize.width, n = this.state.cropSize.height / this.previousCropSize.height;
+				t = {
+					x: this.props.crop.x * e,
+					y: this.props.crop.y * n
+				};
+			}
+			let n = this.props.restrictPosition ? f(t, this.mediaSize, this.state.cropSize, this.props.zoom, this.props.rotation) : t;
+			this.previousCropSize = this.state.cropSize, this.props.onCropChange(n), e ? this.debouncedEmitCropData() : this.emitCropData();
+		}, this.debouncedEmitCropData = () => {
+			this.currentWindow && (this.resizeEmitTimer && clearTimeout(this.resizeEmitTimer), this.resizeEmitTimer = this.currentWindow.setTimeout(() => {
+				this.emitCropData();
+			}, O));
+		}, this.onKeyDown = (e) => {
+			let { crop: t, onCropChange: n, keyboardStep: r, zoom: i, rotation: a } = this.props, o = r;
+			if (!this.state.cropSize) return;
+			e.shiftKey && (o *= .2);
+			let s = l({}, t);
+			switch (e.key) {
+				case "ArrowUp":
+					s.y -= o, e.preventDefault();
+					break;
+				case "ArrowDown":
+					s.y += o, e.preventDefault();
+					break;
+				case "ArrowLeft":
+					s.x -= o, e.preventDefault();
+					break;
+				case "ArrowRight":
+					s.x += o, e.preventDefault();
+					break;
+				default: return;
+			}
+			if (this.props.restrictPosition && (s = f(s, this.mediaSize, this.state.cropSize, i, a)), !e.repeat) {
+				var c, u;
+				(c = (u = this.props).onInteractionStart) == null || c.call(u, { source: "keyboard" });
+			}
+			n(s);
+		}, this.onKeyUp = (e) => {
+			var t, n;
+			switch (e.key) {
+				case "ArrowUp":
+				case "ArrowDown":
+				case "ArrowLeft":
+				case "ArrowRight":
+					e.preventDefault();
+					break;
+				default: return;
+			}
+			this.emitCropData(), (t = (n = this.props).onInteractionEnd) == null || t.call(n, { source: "keyboard" });
+		};
+	}
+	componentDidMount() {
+		!this.currentDoc || !this.currentWindow || (this.containerRef && (this.containerRef.ownerDocument && (this.currentDoc = this.containerRef.ownerDocument), this.currentDoc.defaultView && (this.currentWindow = this.currentDoc.defaultView), this.initResizeObserver(), window.ResizeObserver === void 0 && this.currentWindow.addEventListener("resize", this.onWindowResize), this.props.zoomWithScroll && this.containerRef.addEventListener("wheel", this.onWheel, { passive: !1 }), this.containerRef.addEventListener("gesturestart", this.onGestureStart)), this.currentDoc.addEventListener("scroll", this.onScroll), this.props.disableAutomaticStylesInjection || (this.styleRef = this.currentDoc.createElement("style"), this.styleRef.setAttribute("type", "text/css"), this.props.nonce && this.styleRef.setAttribute("nonce", this.props.nonce), this.styleRef.innerHTML = D, this.currentDoc.head.appendChild(this.styleRef)), this.imageRef.current && this.imageRef.current.complete && this.onMediaLoad(), this.props.setImageRef && this.props.setImageRef(this.imageRef), this.props.setVideoRef && this.props.setVideoRef(this.videoRef), this.props.setCropperRef && this.props.setCropperRef(this.cropperRef));
+	}
+	componentWillUnmount() {
+		var e;
+		if (!(!this.currentDoc || !this.currentWindow)) {
+			if (window.ResizeObserver === void 0 && this.currentWindow.removeEventListener("resize", this.onWindowResize), (e = this.resizeObserver) == null || e.disconnect(), this.resizeEmitTimer && clearTimeout(this.resizeEmitTimer), this.containerRef && this.containerRef.removeEventListener("gesturestart", this.preventZoomSafari), this.styleRef) {
+				var t;
+				(t = this.styleRef.parentNode) == null || t.removeChild(this.styleRef);
+			}
+			this.cleanEvents(), this.props.zoomWithScroll && this.clearScrollEvent();
+		}
+	}
+	componentDidUpdate(e) {
+		if (e.rotation === this.props.rotation ? e.aspect === this.props.aspect && e.objectFit === this.props.objectFit ? e.zoom === this.props.zoom ? e.cropSize?.height !== this.props.cropSize?.height || e.cropSize?.width !== this.props.cropSize?.width ? this.computeSizes() : (e.crop?.x !== this.props.crop?.x || e.crop?.y !== this.props.crop?.y) && this.emitCropAreaChange() : this.recomputeCropPosition() : this.computeSizes() : (this.computeSizes(), this.recomputeCropPosition()), e.zoomWithScroll !== this.props.zoomWithScroll && this.containerRef && (this.props.zoomWithScroll ? this.containerRef.addEventListener("wheel", this.onWheel, { passive: !1 }) : this.clearScrollEvent()), e.video !== this.props.video) {
+			var t;
+			(t = this.videoRef.current) == null || t.load();
+		}
+		let n = this.getObjectFit();
+		n !== this.state.mediaObjectFit && this.setState({ mediaObjectFit: n }, this.computeSizes);
+	}
+	getAspect() {
+		let { cropSize: e, aspect: t } = this.props;
+		return e ? e.width / e.height : t;
+	}
+	getObjectFit() {
+		if (this.props.objectFit === "cover") {
+			if ((this.imageRef.current || this.videoRef.current) && this.containerRef) {
+				this.containerRect = this.containerRef.getBoundingClientRect();
+				let e = this.containerRect.width / this.containerRect.height;
+				return (this.imageRef.current?.naturalWidth || this.videoRef.current?.videoWidth || 0) / (this.imageRef.current?.naturalHeight || this.videoRef.current?.videoHeight || 0) < e ? "horizontal-cover" : "vertical-cover";
+			}
+			return "horizontal-cover";
+		}
+		return this.props.objectFit;
+	}
+	onPinchStart(t) {
+		let n = e.getTouchPoint(t.touches[0]), r = e.getTouchPoint(t.touches[1]);
+		this.lastPinchDistance = m(n, r), this.lastPinchRotation = h(n, r), this.onDragStart(S(n, r), "touch");
+	}
+	onPinchMove(t) {
+		if (!this.currentDoc || !this.currentWindow) return;
+		let n = e.getTouchPoint(t.touches[0]), r = e.getTouchPoint(t.touches[1]), i = S(n, r);
+		this.onDrag(i), this.rafPinchTimeout && this.currentWindow.cancelAnimationFrame(this.rafPinchTimeout), this.rafPinchTimeout = this.currentWindow.requestAnimationFrame(() => {
+			let e = m(n, r), t = this.props.zoom * (e / this.lastPinchDistance);
+			this.setNewZoom(t, i, { shouldUpdatePosition: !1 }), this.lastPinchDistance = e;
+			let a = h(n, r), o = this.props.rotation + (a - this.lastPinchRotation);
+			this.props.onRotationChange && this.props.onRotationChange(o), this.lastPinchRotation = a;
+		});
+	}
+	render() {
+		let { image: e, video: t, mediaProps: r, cropperProps: i, transform: a, crop: { x: o, y: s }, rotation: c, zoom: u, cropShape: d, showGrid: f, roundCropAreaPixels: p, style: { containerStyle: m, cropAreaStyle: h, mediaStyle: g }, classes: { containerClassName: _, cropAreaClassName: v, mediaClassName: y } } = this.props, b = this.state.mediaObjectFit ?? this.getObjectFit();
+		return /* @__PURE__ */ n.createElement("div", {
+			onMouseDown: this.onMouseDown,
+			onTouchStart: this.onTouchStart,
+			ref: (e) => this.containerRef = e,
+			"data-testid": "container",
+			style: m,
+			className: E("reactEasyCrop_Container", _)
+		}, e ? /* @__PURE__ */ n.createElement("img", l(l({
+			alt: "",
+			className: E("reactEasyCrop_Image", b === "contain" && "reactEasyCrop_Contain", b === "horizontal-cover" && "reactEasyCrop_Cover_Horizontal", b === "vertical-cover" && "reactEasyCrop_Cover_Vertical", y)
+		}, r), {}, {
+			src: e,
+			ref: this.imageRef,
+			style: l(l({}, g), {}, { transform: a || `translate(${o}px, ${s}px) rotate(${c}deg) scale(${u})` }),
+			onLoad: this.onMediaLoad
+		})) : t && /* @__PURE__ */ n.createElement("video", l(l({
+			autoPlay: !0,
+			playsInline: !0,
+			loop: !0,
+			muted: !0,
+			className: E("reactEasyCrop_Video", b === "contain" && "reactEasyCrop_Contain", b === "horizontal-cover" && "reactEasyCrop_Cover_Horizontal", b === "vertical-cover" && "reactEasyCrop_Cover_Vertical", y)
+		}, r), {}, {
+			ref: this.videoRef,
+			onLoadedMetadata: this.onMediaLoad,
+			style: l(l({}, g), {}, { transform: a || `translate(${o}px, ${s}px) rotate(${c}deg) scale(${u})` }),
+			controls: !1
+		}), (Array.isArray(t) ? t : [{ src: t }]).map((e) => /* @__PURE__ */ n.createElement("source", l({ key: e.src }, e)))), this.state.cropSize && /* @__PURE__ */ n.createElement("div", l({
+			ref: this.cropperRef,
+			style: l(l({}, h), {}, {
+				width: p ? Math.round(this.state.cropSize.width) : this.state.cropSize.width,
+				height: p ? Math.round(this.state.cropSize.height) : this.state.cropSize.height
+			}),
+			tabIndex: 0,
+			onKeyDown: this.onKeyDown,
+			onKeyUp: this.onKeyUp,
+			"data-testid": "cropper",
+			className: E("reactEasyCrop_CropArea", d === "round" && "reactEasyCrop_CropAreaRound", f && "reactEasyCrop_CropAreaGrid", v)
+		}, i)));
+	}
+};
+M.defaultProps = {
+	zoom: 1,
+	rotation: 0,
+	aspect: 4 / 3,
+	maxZoom: A,
+	minZoom: k,
+	cropShape: "rect",
+	objectFit: "contain",
+	showGrid: !0,
+	style: {},
+	classes: {},
+	mediaProps: {},
+	cropperProps: {},
+	zoomSpeed: 1,
+	restrictPosition: !0,
+	zoomWithScroll: !0,
+	keyboardStep: j
+}, M.getMousePoint = (e) => ({
+	x: Number(e.clientX),
+	y: Number(e.clientY)
+}), M.getTouchPoint = (e) => ({
+	x: Number(e.clientX),
+	y: Number(e.clientY)
+});
+var N = M;
+//#endregion
+export { N as default, y as getInitialCropFromCroppedAreaPercentages, x as getInitialCropFromCroppedAreaPixels };
+
+//# sourceMappingURL=index.module.js.map