@get-set/gs-zoom 0.0.3 → 0.0.5

package/{dist/components → components}/styles/GSZoom.scss

@@ -1,254 +1,252 @@
-html.gs-zoom-opened {
-  overflow: hidden !important;
-  touch-action: pan-x pan-y;
-  body {
-    touch-action: pan-x pan-y;
-  }
-}
-.gs-zoom-magnifier-instance {
-  &:hover {
-    cursor: none;
-  }
-}
-.gs-zoom-magnifier {
-  pointer-events: none;
-  position: fixed;
-  z-index: 9999;
-  border: 4px solid #fff;
-  aspect-ratio: 1;
-  overflow: hidden;
-  &[data-type="circle"] {
-    border-radius: 50%;
-  }
-  img {
-    position: absolute;
-    transform-origin: top left;
-    max-width: unset !important;
-  }
-}
-.gs-zoom-container {
-  position: fixed;
-  z-index: 9999999999;
-  width: 100vw;
-  height: 100dvh;
-  top: 0;
-  left: 0;
-  overflow: hidden;
-  backdrop-filter: blur(50px);
-
-  .gs-zoom-autoplayline {
-    position: fixed;
-    height: 4px;
-    top: 0;
-    left: 0;
-    z-index: 999;
-    background-color: red;
-  }
-  button {
-    cursor: pointer;
-    outline: none !important;
-  }
-  * {
-    -webkit-user-drag: none;
-    -moz-user-select: none;
-    -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  .gs-zoom-header {
-    position: fixed;
-    right: 10px;
-    top: 10px;
-    //width: 100%;
-    display: flex;
-    justify-content: flex-end;
-    align-items: center;
-    z-index: 99;
-
-    .gs-zoom-actions {
-      display: flex;
-      align-items: center;
-      .gs-zoom-action {
-        width: 40px;
-        height: 40px;
-        background-color: rgba(35, 35, 35, 0.65);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border: none;
-
-        svg {
-          fill: #fff;
-          width: 18px;
-        }
-      }
-    }
-  }
-  .gs-zoom-img-list {
-    position: relative;
-    z-index: 2;
-    display: flex;
-    width: max-content;
-    .gs-zoom-main-img {
-      width: 100vw;
-      height: 100dvh;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      position: relative;
-      overflow: hidden;
-
-      .gs-zoom-img-touch {
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        z-index: 2;
-      }
-
-      .gz-zoom-loading-container {
-        display: none;
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%, -50%);
-      }
-      .gs-zoom-img {
-        max-width: 100%;
-        max-height: 100%;
-        //transition: 0.15s;
-        &.gs-zoom-is-adjusting {
-          transition: 0.4s ease-in-out !important;
-        }
-      }
-      &.gz-zoom-is-loading {
-        .gz-zoom-loading-container {
-          display: block;
-        }
-        .gs-zoom-img {
-          visibility: hidden;
-        }
-      }
-      .gs-zoom-info-data {
-        position: absolute;
-        left: 0;
-        bottom: 0;
-        right: 0;
-        padding: 20px 20px 90px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        color: #fff;
-        background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
-      }
-    }
-  }
-  .gs-zoom-additionals {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    overflow-x: hidden;
-    padding: 5px 0;
-    display: flex;
-    justify-content: center;
-    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
-    transform-origin: bottom;
-    .gs-add-list-container {
-      overflow-x: hidden;
-      max-width: 100%;
-      .gs-add-list {
-        display: flex;
-        gap: 5px;
-        width: max-content;
-        justify-content: center;
-        flex-wrap: nowrap;
-
-        .gs-add-item {
-          width: 80px;
-          aspect-ratio: 1;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          border: 1px solid #000;
-          opacity: 0.5;
-          transition: 0.2s ease-out;
-          transform: scale(0.8);
-          cursor: pointer;
-          &:hover,
-          &.active {
-            transform: scale(1);
-            opacity: 1;
-          }
-          img {
-            max-width: 100%;
-            max-height: 100%;
-          }
-        }
-      }
-    }
-    &.gs-zoom-hidden {
-      z-index: 1;
-      opacity: 0;
-      .gs-add-list {
-        transform: scale(0.9);
-      }
-    }
-  }
-  &:not(.gs-additional-isdragging) {
-    .gs-zoom-additionals {
-      .gs-add-list-container {
-        .gs-add-list {
-          transition: 0.3s transform ease-in-out;
-        }
-      }
-    }
-  }
-  .gs-zoom-navigations {
-    button {
-      border: none;
-      position: fixed;
-      top: 50%;
-      width: 50px;
-      background-color: rgba(35, 35, 35, 0.65);
-      aspect-ratio: 1;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 28px;
-      color: #fff;
-      transform: translateY(-50%);
-
-      svg {
-        fill: #fff;
-        width: 18px;
-      }
-    }
-    .gs-zoom-next {
-      right: 10px;
-    }
-    .gs-zoom-prev {
-      left: 10px;
-    }
-  }
-  .gs-zoom-hide-inzoomed {
-    z-index: 3;
-    opacity: 1;
-    transform: scale(1);
-    transition: 0.3s ease-in-out;
-  }
-  &.gs-zoom-is-zoomed {
-    .gs-zoom-hide-inzoomed {
-      z-index: 1;
-      opacity: 0;
-      transform: scale(0.9);
-      &.gs-zoom-additionals {
-        transform: scale(1);
-        .gs-add-list {
-          transform: scale(0.9);
-        }
-      }
-    }
-  }
-}
+html.gs-zoom-opened {
+  overflow: hidden !important;
+  touch-action: pan-x pan-y;
+  body {
+    touch-action: pan-x pan-y;
+  }
+}
+.gs-zoom-magnifier-instance {
+  &:hover {
+    cursor: none;
+  }
+}
+.gs-zoom-magnifier {
+  pointer-events: none;
+  position: fixed;
+  z-index: 9999;
+  border: 4px solid #fff;
+  aspect-ratio: 1;
+  overflow: hidden;
+  &[data-type="circle"] {
+    border-radius: 50%;
+  }
+  img {
+    position: absolute;
+    transform-origin: top left;
+    max-width: unset !important;
+  }
+}
+.gs-zoom-container {
+  position: fixed;
+  z-index: 9999999999;
+  width: 100vw;
+  height: 100dvh;
+  top: 0;
+  left: 0;
+  overflow: hidden;
+  backdrop-filter: blur(50px);
+
+  .gs-zoom-autoplayline {
+    position: fixed;
+    height: 4px;
+    top: 0;
+    left: 0;
+    z-index: 999;
+    background-color: red;
+  }
+  button {
+    cursor: pointer;
+    outline: none !important;
+  }
+  * {
+    -webkit-user-drag: none;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+  .gs-zoom-header {
+    position: fixed;
+    right: 10px;
+    top: 10px;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    z-index: 99;
+
+    .gs-zoom-actions {
+      display: flex;
+      align-items: center;
+      .gs-zoom-action {
+        width: 40px;
+        height: 40px;
+        background-color: rgba(35, 35, 35, 0.65);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border: none;
+
+        svg {
+          fill: #fff;
+          width: 18px;
+        }
+      }
+    }
+  }
+  .gs-zoom-img-list {
+    position: relative;
+    z-index: 2;
+    display: flex;
+    width: max-content;
+    .gs-zoom-main-img {
+      width: 100vw;
+      height: 100dvh;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      overflow: hidden;
+
+      .gs-zoom-img-touch {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        z-index: 2;
+      }
+
+      .gz-zoom-loading-container {
+        display: none;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+      }
+      .gs-zoom-img {
+        max-width: 100%;
+        max-height: 100%;
+        &.gs-zoom-is-adjusting {
+          transition: 0.4s ease-in-out !important;
+        }
+      }
+      &.gz-zoom-is-loading {
+        .gz-zoom-loading-container {
+          display: block;
+        }
+        .gs-zoom-img {
+          visibility: hidden;
+        }
+      }
+      .gs-zoom-info-data {
+        position: absolute;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        padding: 20px 20px 90px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        color: #fff;
+        background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
+      }
+    }
+  }
+  .gs-zoom-additionals {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    overflow-x: hidden;
+    padding: 5px 0;
+    display: flex;
+    justify-content: center;
+    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
+    transform-origin: bottom;
+    .gs-add-list-container {
+      overflow-x: hidden;
+      max-width: 100%;
+      .gs-add-list {
+        display: flex;
+        gap: 5px;
+        width: max-content;
+        justify-content: center;
+        flex-wrap: nowrap;
+
+        .gs-add-item {
+          width: 80px;
+          aspect-ratio: 1;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          border: 1px solid #000;
+          opacity: 0.5;
+          transition: 0.2s ease-out;
+          transform: scale(0.8);
+          cursor: pointer;
+          &:hover,
+          &.active {
+            transform: scale(1);
+            opacity: 1;
+          }
+          img {
+            max-width: 100%;
+            max-height: 100%;
+          }
+        }
+      }
+    }
+    &.gs-zoom-hidden {
+      z-index: 1;
+      opacity: 0;
+      .gs-add-list {
+        transform: scale(0.9);
+      }
+    }
+  }
+  &:not(.gs-additional-isdragging) {
+    .gs-zoom-additionals {
+      .gs-add-list-container {
+        .gs-add-list {
+          transition: 0.3s transform ease-in-out;
+        }
+      }
+    }
+  }
+  .gs-zoom-navigations {
+    button {
+      border: none;
+      position: fixed;
+      top: 50%;
+      width: 50px;
+      background-color: rgba(35, 35, 35, 0.65);
+      aspect-ratio: 1;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 28px;
+      color: #fff;
+      transform: translateY(-50%);
+
+      svg {
+        fill: #fff;
+        width: 18px;
+      }
+    }
+    .gs-zoom-next {
+      right: 10px;
+    }
+    .gs-zoom-prev {
+      left: 10px;
+    }
+  }
+  .gs-zoom-hide-inzoomed {
+    z-index: 3;
+    opacity: 1;
+    transform: scale(1);
+    transition: 0.3s ease-in-out;
+  }
+  &.gs-zoom-is-zoomed {
+    .gs-zoom-hide-inzoomed {
+      z-index: 1;
+      opacity: 0;
+      transform: scale(0.9);
+      &.gs-zoom-additionals {
+        transform: scale(1);
+        .gs-add-list {
+          transform: scale(0.9);
+        }
+      }
+    }
+  }
+}

package/constants/defaultParams.ts

@@ -0,0 +1,20 @@
+import types from './types';
+import { Params } from '../types/params';
+
+const defaultParams: Params = {
+  reference: '',
+  arrows: true,
+  navigateWithKeys: true,
+  showAdditionals: true,
+  zoomOnWheel: true,
+  maxZoom: 5,
+  type: types.lightbox,
+  mainImageQueryParameters: '',
+  additionalImageQueryParameters: '',
+  disableFullScreen: false,
+  imgLoading: '',
+  autoplaySpeed: 5000,
+  responsive: [],
+};
+
+export default Object.freeze(defaultParams);

package/constants/icons.ts

@@ -0,0 +1,25 @@
+const icons = {
+  // zoomIn: '<svg width="20px" height="20px" viewBox="0 -0.5 21 21" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Dribbble-Light-Preview" class="btn-icon btn-icon-plus" transform="translate(-379.000000, -240.000000)" fill="none"><g id="icons" transform="translate(56.000000, 160.000000)"><polygon id="plus-[#1512]" points="344 89 344 91 334.55 91 334.55 100 332.45 100 332.45 91 323 91 323 89 332.45 89 332.45 80 334.55 80 334.55 89"></polygon></g></g></g></svg>',
+  loading:
+    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 150"><path fill="none" stroke="#000000" stroke-width="15" stroke-linecap="round" stroke-dasharray="300 385" stroke-dashoffset="0" d="M275 75c0 31-27 50-50 50-58 0-92-100-150-100-28 0-50 22-50 50s23 50 50 50c58 0 92-100 150-100 24 0 50 19 50 50Z"><animate attributeName="stroke-dashoffset" calcMode="spline" dur="2" values="685;-685" keySplines="0 0 1 1" repeatCount="indefinite"></animate></path></svg>',
+  zoomIn:
+    '<svg width="20px" height="20px" viewBox="0 0 30 30"><path class="fslightbox-svg-path" d="M 13 3 C 7.4889971 3 3 7.4889971 3 13 C 3 18.511003 7.4889971 23 13 23 C 15.396508 23 17.597385 22.148986 19.322266 20.736328 L 25.292969 26.707031 A 1.0001 1.0001 0 1 0 26.707031 25.292969 L 20.736328 19.322266 C 22.148986 17.597385 23 15.396508 23 13 C 23 7.4889971 18.511003 3 13 3 z M 13 5 C 17.430123 5 21 8.5698774 21 13 C 21 17.430123 17.430123 21 13 21 C 8.5698774 21 5 17.430123 5 13 C 5 8.5698774 8.5698774 5 13 5 z M 12.984375 7.9863281 A 1.0001 1.0001 0 0 0 12 9 L 12 12 L 9 12 A 1.0001 1.0001 0 1 0 9 14 L 12 14 L 12 17 A 1.0001 1.0001 0 1 0 14 17 L 14 14 L 17 14 A 1.0001 1.0001 0 1 0 17 12 L 14 12 L 14 9 A 1.0001 1.0001 0 0 0 12.984375 7.9863281 z"></path></svg>',
+  //zoomOut: '<svg width="20px" height="20px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path class="btn-icon btn-icon-minus" d="M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z" fill="none"></path></svg>',
+  zoomOut:
+    '<svg width="20px" height="20px" viewBox="0 0 30 30"><path class="fslightbox-svg-path" d="M 13 3 C 7.4889971 3 3 7.4889971 3 13 C 3 18.511003 7.4889971 23 13 23 C 15.396508 23 17.597385 22.148986 19.322266 20.736328 L 25.292969 26.707031 A 1.0001 1.0001 0 1 0 26.707031 25.292969 L 20.736328 19.322266 C 22.148986 17.597385 23 15.396508 23 13 C 23 7.4889971 18.511003 3 13 3 z M 13 5 C 17.430123 5 21 8.5698774 21 13 C 21 17.430123 17.430123 21 13 21 C 8.5698774 21 5 17.430123 5 13 C 5 8.5698774 8.5698774 5 13 5 z M 9 12 A 1.0001 1.0001 0 1 0 9 14 L 17 14 A 1.0001 1.0001 0 1 0 17 12 L 9 12 z"></path></svg>',
+  //close: '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="20px" viewBox="0 -0.5 21 21" version="1.1"><g fill="none" fill-rule="evenodd"><g transform="translate(-419.000000, -240.000000)" class="btn-icon btn-icon-close"><g transform="translate(56.000000, 160.000000)"><polygon points="375.0183 90 384 98.554 382.48065 100 373.5 91.446 364.5183 100 363 98.554 371.98065 90 363 81.446 364.5183 80 373.5 88.554 382.48065 80 384 81.446"></polygon></g></g></g></svg>',
+  close:
+    '<svg width="20px" height="20px" viewBox="0 0 24 24"><path class="fslightbox-svg-path" d="M 4.7070312 3.2929688 L 3.2929688 4.7070312 L 10.585938 12 L 3.2929688 19.292969 L 4.7070312 20.707031 L 12 13.414062 L 19.292969 20.707031 L 20.707031 19.292969 L 13.414062 12 L 20.707031 4.7070312 L 19.292969 3.2929688 L 12 10.585938 L 4.7070312 3.2929688 z"></path></svg>',
+  autoplay:
+    '<svg width="16px" height="16px" viewBox="0 0 30 30"><path class="fslightbox-svg-path" d="M 6 3 A 1 1 0 0 0 5 4 A 1 1 0 0 0 5 4.0039062 L 5 15 L 5 25.996094 A 1 1 0 0 0 5 26 A 1 1 0 0 0 6 27 A 1 1 0 0 0 6.5800781 26.8125 L 6.5820312 26.814453 L 26.416016 15.908203 A 1 1 0 0 0 27 15 A 1 1 0 0 0 26.388672 14.078125 L 6.5820312 3.1855469 L 6.5800781 3.1855469 A 1 1 0 0 0 6 3 z"></path></svg>',
+  autoplayPause:
+    '<svg width="14px" height="14px" viewBox="0 0 356.19 356.19"><path class="fslightbox-svg-path" d="M121,0c18,0,33,15,33,33v372c0,18-15,33-33,33s-32-15-32-33V33C89,15,103,0,121,0zM317,0c18,0,32,15,32,33v372c0,18-14,33-32,33s-33-15-33-33V33C284,15,299,0,317,0z"></path></svg>',
+  arrPrev:
+    '<svg width="20px" height="20px" viewBox="0 0 20 20"><path class="fslightbox-svg-path" d="M18.271,9.212H3.615l4.184-4.184c0.306-0.306,0.306-0.801,0-1.107c-0.306-0.306-0.801-0.306-1.107,0L1.21,9.403C1.194,9.417,1.174,9.421,1.158,9.437c-0.181,0.181-0.242,0.425-0.209,0.66c0.005,0.038,0.012,0.071,0.022,0.109c0.028,0.098,0.075,0.188,0.142,0.271c0.021,0.026,0.021,0.061,0.045,0.085c0.015,0.016,0.034,0.02,0.05,0.033l5.484,5.483c0.306,0.307,0.801,0.307,1.107,0c0.306-0.305,0.306-0.801,0-1.105l-4.184-4.185h14.656c0.436,0,0.788-0.353,0.788-0.788S18.707,9.212,18.271,9.212z"></path></svg>',
+  arrNext:
+    '<svg width="20px" height="20px" viewBox="0 0 20 20"><path class="fslightbox-svg-path" d="M1.729,9.212h14.656l-4.184-4.184c-0.307-0.306-0.307-0.801,0-1.107c0.305-0.306,0.801-0.306,1.106,0l5.481,5.482c0.018,0.014,0.037,0.019,0.053,0.034c0.181,0.181,0.242,0.425,0.209,0.66c-0.004,0.038-0.012,0.071-0.021,0.109c-0.028,0.098-0.075,0.188-0.143,0.271c-0.021,0.026-0.021,0.061-0.045,0.085c-0.015,0.016-0.034,0.02-0.051,0.033l-5.483,5.483c-0.306,0.307-0.802,0.307-1.106,0c-0.307-0.305-0.307-0.801,0-1.105l4.184-4.185H1.729c-0.436,0-0.788-0.353-0.788-0.788S1.293,9.212,1.729,9.212z"></path></svg>',
+  toggleadditionals:
+    '<svg width="17px" height="17px" viewBox="0 0 22 22"><path class="fslightbox-svg-path" d="M 3 2 C 2.448 2 2 2.448 2 3 L 2 6 C 2 6.552 2.448 7 3 7 L 6 7 C 6.552 7 7 6.552 7 6 L 7 3 C 7 2.448 6.552 2 6 2 L 3 2 z M 10 2 C 9.448 2 9 2.448 9 3 L 9 6 C 9 6.552 9.448 7 10 7 L 13 7 C 13.552 7 14 6.552 14 6 L 14 3 C 14 2.448 13.552 2 13 2 L 10 2 z M 17 2 C 16.448 2 16 2.448 16 3 L 16 6 C 16 6.552 16.448 7 17 7 L 20 7 C 20.552 7 21 6.552 21 6 L 21 3 C 21 2.448 20.552 2 20 2 L 17 2 z M 3 9 C 2.448 9 2 9.448 2 10 L 2 13 C 2 13.552 2.448 14 3 14 L 6 14 C 6.552 14 7 13.552 7 13 L 7 10 C 7 9.448 6.552 9 6 9 L 3 9 z M 10 9 C 9.448 9 9 9.448 9 10 L 9 13 C 9 13.552 9.448 14 10 14 L 13 14 C 13.552 14 14 13.552 14 13 L 14 10 C 14 9.448 13.552 9 13 9 L 10 9 z M 17 9 C 16.448 9 16 9.448 16 10 L 16 13 C 16 13.552 16.448 14 17 14 L 20 14 C 20.552 14 21 13.552 21 13 L 21 10 C 21 9.448 20.552 9 20 9 L 17 9 z M 3 16 C 2.448 16 2 16.448 2 17 L 2 20 C 2 20.552 2.448 21 3 21 L 6 21 C 6.552 21 7 20.552 7 20 L 7 17 C 7 16.448 6.552 16 6 16 L 3 16 z M 10 16 C 9.448 16 9 16.448 9 17 L 9 20 C 9 20.552 9.448 21 10 21 L 13 21 C 13.552 21 14 20.552 14 20 L 14 17 C 14 16.448 13.552 16 13 16 L 10 16 z M 17 16 C 16.448 16 16 16.448 16 17 L 16 20 C 16 20.552 16.448 21 17 21 L 20 21 C 20.552 21 21 20.552 21 20 L 21 17 C 21 16.448 20.552 16 20 16 L 17 16 z"></path></svg>',
+};
+
+export default Object.freeze(icons);

package/constants/magnifierDefaultProps.ts

@@ -0,0 +1,9 @@
+import { MagnifierParams } from '../types/params';
+
+const magnifierDefaultProps: MagnifierParams = {
+  zoom: 3,
+  form: 'circle',
+  size: 150,
+};
+
+export default Object.freeze(magnifierDefaultProps);

package/constants/types.ts

@@ -0,0 +1,6 @@
+const types = {
+  lightbox: 'lightbox' as const,
+  magnifier: 'magnifier' as const,
+};
+
+export default Object.freeze(types);

package/dist/GSZoom.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/actions/general.d.ts

@@ -0,0 +1,7 @@
+export declare const getScale: (element: HTMLElement) => number;
+export declare const getTranslateCoord: (element: HTMLElement) => {
+    x: number;
+    y: number;
+};
+export declare const fullscreenchange: () => void;
+//# sourceMappingURL=general.d.ts.map

package/dist/actions/general.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"general.d.ts","sourceRoot":"","sources":["../../actions/general.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,GAAI,SAAS,WAAW,KAAG,MAW/C,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,SAAS,WAAW,KAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAO9E,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAAO,IAInC,CAAC"}

package/dist/actions/general.js

@@ -1,30 +1,26 @@
-import initClose from "./initClose";
-
-export const getScale = (element) => {
-  // Get the computed style of the element
-  const style = window.getComputedStyle(element);
-  const transform = style.transform;
-
-  if (transform !== "none") {
-    const values = transform.match(/matrix.*\((.+)\)/)[1].split(", ");
-    return parseFloat(values[0]);
-  } else {
-    return 1;
-  }
-};
-
-export const getTranslateCoord = (element) => {
-  const style = window.getComputedStyle(element);
-  // eslint-disable-next-line no-undef
-  const matrix = new WebKitCSSMatrix(style.transform);
-  return {
-    x: matrix.e,
-    y: matrix.f,
-  };
-};
-
-export const fullscreenchange = () => {
-  if (!document.fullscreenElement) {
-    initClose();
-  }
-};
+import initClose from './initClose';
+export const getScale = (element) => {
+    const style = window.getComputedStyle(element);
+    const transform = style.transform;
+    if (transform !== 'none') {
+        const values = transform.match(/matrix.*\((.+)\)/)?.[1].split(', ');
+        if (values) {
+            return parseFloat(values[0]);
+        }
+    }
+    return 1;
+};
+export const getTranslateCoord = (element) => {
+    const style = window.getComputedStyle(element);
+    const matrix = new DOMMatrix(style.transform);
+    return {
+        x: matrix.e,
+        y: matrix.f,
+    };
+};
+export const fullscreenchange = () => {
+    if (!document.fullscreenElement) {
+        initClose();
+    }
+};
+//# sourceMappingURL=general.js.map