@websolutespa/bom-mixer-ui 1.7.14 → 1.7.15

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @websolutespa/bom-mixer-ui
 
+## 1.7.15
+
+### Patch Changes
+
+- Fixing: MediaImage getMediaRatio
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.7.9
+
 ## 1.7.14
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -4439,7 +4439,7 @@ function getMediaSizes(mediaQuery, ratio, size, maxWidth, maxHeight) {
   if (maxHeight === void 0) {
     maxHeight = Number.POSITIVE_INFINITY;
   }
-  // console.log('getMediaSizes', size, ratio, maxWidth);
+  // console.log('getMediaSizes', mediaQuery, ratio, size, maxWidth, maxHeight);
   let sizes = [];
   if (size) {
     if (typeof size === 'number') {
@@ -4506,7 +4506,7 @@ function getImageProps(_a, mediaQuery) {
   } else if (typeof height === 'number') {
     useHeight = height;
   }
-  const ratio = getMediaRatio(props);
+  const ratio = getMediaRatio(useWidth, useHeight, props.aspectRatio, props.aspectRatioSm, props.aspectRatioMd, props.aspectRatioLg, props.aspectRatioXl);
   const sizes = getMediaSizes(mediaQuery, ratio, useSize, props.mediaWidth, props.mediaHeight);
   const imageSrc = getImageSrc(src, sizes[0][0], sizes[0][2]);
   const imageSrcSet = getImageSrcset(src, sizes);
@@ -4520,23 +4520,14 @@ function getImageProps(_a, mediaQuery) {
     height: useHeight ? `${useHeight}px` : undefined
   }, otherProps);
 }
-function getMediaRatio(props) {
-  let width = undefined;
-  let height = undefined;
-  if (props.width) {
-    width = parseInt(String(props.width));
-  }
-  props.width = width;
-  if (props.height) {
-    height = parseInt(String(props.height));
-  }
-  props.height = height;
+function getMediaRatio(width, height, aspectRatio, aspectRatioSm, aspectRatioMd, aspectRatioLg, aspectRatioXl) {
+  // console.log('getMediaRatio', width, height, aspectRatio);
   const defaultRatio = width && height ? width / height : 0;
-  const xs = getRatio(props.aspectRatio, defaultRatio);
-  const sm = getRatio(props.aspectRatioSm, xs);
-  const md = getRatio(props.aspectRatioMd, sm);
-  const lg = getRatio(props.aspectRatioLg, md);
-  const xl = getRatio(props.aspectRatioXl, lg);
+  const xs = getRatio(aspectRatio, defaultRatio);
+  const sm = getRatio(aspectRatioSm, xs);
+  const md = getRatio(aspectRatioMd, sm);
+  const lg = getRatio(aspectRatioLg, md);
+  const xl = getRatio(aspectRatioXl, lg);
   const ratio = {
     xs,
     sm,
@@ -4620,16 +4611,15 @@ const MediaVideo = _a => {
   };
   React.useEffect(() => {
     if (videoRef.current && canLoad) {
-      if (videoRef.current.readyState && videoRef.current.readyState >= 2) {
+      const video = videoRef.current;
+      if (video.readyState && video.readyState >= 2) {
         if (typeof onLoaded === 'function') {
           onLoaded(videoRef);
         }
       } else {
-        videoRef.current.addEventListener('loadeddata', onLoad);
+        video.addEventListener('loadeddata', onLoad);
         return () => {
-          if (videoRef.current) {
-            videoRef.current.removeEventListener('loadeddata', onLoad);
-          }
+          video.removeEventListener('loadeddata', onLoad);
         };
       }
     }