@ews-admin/global-design-system 1.18.0 → 1.19.0

package/dist/index.esm.js

@@ -32,7 +32,7 @@ function buildUrls(environment) {
     return {
         bffUrl: `https://${prefix}api.${domain}/bff/api/v1`,
         loginBffUrl: `https://${prefix}api.${domain}/login-bff/api/v1`,
-        appUrl: `https://${prefix}app.${domain}`,
+        appUrl: environment === "prod" ? `https://${prefix}${domain}` : `https://${prefix}app.${domain}`,
         loginUrl: `https://${prefix}login.${domain}`,
         dashboardUrl: `https://${prefix}dashboard.${domain}`,
         adminUrl: `https://${prefix}admin.${domain}`,
@@ -34144,6 +34144,7 @@ function classNames(...args) {
 var styles_default = ".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";
 //#endregion
 //#region src/Cropper.tsx
+const RESIZE_EMIT_DEBOUNCE_TIME = 250;
 const MIN_ZOOM = 1;
 const MAX_ZOOM = 3;
 const KEYBOARD_STEP = 1;
@@ -34182,6 +34183,7 @@ var Cropper$1 = class Cropper extends React.Component {
 		this.rafDragTimeout = null;
 		this.rafPinchTimeout = null;
 		this.wheelTimer = null;
+		this.resizeEmitTimer = null;
 		this.currentDoc = typeof document !== "undefined" ? document : null;
 		this.currentWindow = typeof window !== "undefined" ? window : null;
 		this.resizeObserver = null;
@@ -34200,10 +34202,13 @@ var Cropper$1 = class Cropper extends React.Component {
 					isFirstResize = false;
 					return;
 				}
-				this.computeSizes();
+				this.computeSizes({ isResizeTriggered: true });
 			});
 			this.resizeObserver.observe(this.containerRef);
 		};
+		this.onWindowResize = () => {
+			this.computeSizes({ isResizeTriggered: true });
+		};
 		this.preventZoomSafari = (e) => e.preventDefault();
 		this.cleanEvents = () => {
 			if (!this.currentDoc) return;
@@ -34240,7 +34245,7 @@ var Cropper$1 = class Cropper extends React.Component {
 				this.props.onZoomChange && this.props.onZoomChange(zoom);
 			}
 		};
-		this.computeSizes = () => {
+		this.computeSizes = ({ isResizeTriggered = false } = {}) => {
 			const mediaRef = this.imageRef.current || this.videoRef.current;
 			if (mediaRef && this.containerRef) {
 				var _this$imageRef$curren, _this$videoRef$curren, _this$imageRef$curren2, _this$videoRef$curren2, _this$state$cropSize, _this$state$cropSize2;
@@ -34287,7 +34292,7 @@ var Cropper$1 = class Cropper extends React.Component {
 				if (this.props.setMediaSize) this.props.setMediaSize(this.mediaSize);
 				const cropSize = this.props.cropSize ? this.props.cropSize : getCropSize(this.mediaSize.width, this.mediaSize.height, this.containerRect.width, this.containerRect.height, this.props.aspect, this.props.rotation);
 				if (((_this$state$cropSize = this.state.cropSize) === null || _this$state$cropSize === void 0 ? void 0 : _this$state$cropSize.height) !== cropSize.height || ((_this$state$cropSize2 = this.state.cropSize) === null || _this$state$cropSize2 === void 0 ? void 0 : _this$state$cropSize2.width) !== cropSize.width) this.props.onCropSizeChange && this.props.onCropSizeChange(cropSize);
-				this.setState({ cropSize }, this.recomputeCropPosition);
+				this.setState({ cropSize }, () => this.recomputeCropPosition({ isResizeTriggered }));
 				if (this.props.setCropSize) this.props.setCropSize(cropSize);
 				return cropSize;
 			}
@@ -34436,6 +34441,10 @@ var Cropper$1 = class Cropper extends React.Component {
 			return computeCroppedArea(this.props.restrictPosition ? restrictPosition(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);
 		};
 		this.emitCropData = () => {
+			if (this.resizeEmitTimer) {
+				clearTimeout(this.resizeEmitTimer);
+				this.resizeEmitTimer = null;
+			}
 			const cropData = this.getCropData();
 			if (!cropData) return;
 			const { croppedAreaPercentages, croppedAreaPixels } = cropData;
@@ -34448,7 +34457,7 @@ var Cropper$1 = class Cropper extends React.Component {
 			const { croppedAreaPercentages, croppedAreaPixels } = cropData;
 			if (this.props.onCropAreaChange) this.props.onCropAreaChange(croppedAreaPercentages, croppedAreaPixels);
 		};
-		this.recomputeCropPosition = () => {
+		this.recomputeCropPosition = ({ isResizeTriggered = false } = {}) => {
 			var _this$previousCropSiz, _this$previousCropSiz2;
 			if (!this.state.cropSize) return;
 			let adjustedCrop = this.props.crop;
@@ -34465,7 +34474,15 @@ var Cropper$1 = class Cropper extends React.Component {
 			const newPosition = this.props.restrictPosition ? restrictPosition(adjustedCrop, this.mediaSize, this.state.cropSize, this.props.zoom, this.props.rotation) : adjustedCrop;
 			this.previousCropSize = this.state.cropSize;
 			this.props.onCropChange(newPosition);
-			this.emitCropData();
+			if (isResizeTriggered) this.debouncedEmitCropData();
+			else this.emitCropData();
+		};
+		this.debouncedEmitCropData = () => {
+			if (!this.currentWindow) return;
+			if (this.resizeEmitTimer) clearTimeout(this.resizeEmitTimer);
+			this.resizeEmitTimer = this.currentWindow.setTimeout(() => {
+				this.emitCropData();
+			}, RESIZE_EMIT_DEBOUNCE_TIME);
 		};
 		this.onKeyDown = (event) => {
 			const { crop, onCropChange, keyboardStep, zoom, rotation } = this.props;
@@ -34520,7 +34537,7 @@ var Cropper$1 = class Cropper extends React.Component {
 			if (this.containerRef.ownerDocument) this.currentDoc = this.containerRef.ownerDocument;
 			if (this.currentDoc.defaultView) this.currentWindow = this.currentDoc.defaultView;
 			this.initResizeObserver();
-			if (typeof window.ResizeObserver === "undefined") this.currentWindow.addEventListener("resize", this.computeSizes);
+			if (typeof window.ResizeObserver === "undefined") this.currentWindow.addEventListener("resize", this.onWindowResize);
 			this.props.zoomWithScroll && this.containerRef.addEventListener("wheel", this.onWheel, { passive: false });
 			this.containerRef.addEventListener("gesturestart", this.onGestureStart);
 		}
@@ -34540,8 +34557,9 @@ var Cropper$1 = class Cropper extends React.Component {
 	componentWillUnmount() {
 		var _this$resizeObserver;
 		if (!this.currentDoc || !this.currentWindow) return;
-		if (typeof window.ResizeObserver === "undefined") this.currentWindow.removeEventListener("resize", this.computeSizes);
+		if (typeof window.ResizeObserver === "undefined") this.currentWindow.removeEventListener("resize", this.onWindowResize);
 		(_this$resizeObserver = this.resizeObserver) === null || _this$resizeObserver === void 0 || _this$resizeObserver.disconnect();
+		if (this.resizeEmitTimer) clearTimeout(this.resizeEmitTimer);
 		if (this.containerRef) this.containerRef.removeEventListener("gesturestart", this.preventZoomSafari);
 		if (this.styleRef) {
 			var _this$styleRef$parent;