svelte-zoom - npm Package Compare versions

Comparing version 1.0.8 to 1.0.9

dist/index.js

@@ -463,4 +463,4 @@ (function (global, factory) {
     	var style = element("style");
-    	style.id = "svelte-z6m8ik-style";
-    	style.textContent = ".c-svelteZoom.svelte-z6m8ik{width:100%;height:100%;position:absolute;transform-origin:0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none;will-change:transform;touch-action:none}.c-svelteZoom--contain.svelte-z6m8ik{object-fit:contain}.c-svelteZoom--no-contain.svelte-z6m8ik{object-fit:contain}.c-svelteZoom--transition.svelte-z6m8ik{transition:transform 0.2s}";
+    	style.id = "svelte-17i4z2s-style";
+    	style.textContent = ".c-svelteZoom.svelte-17i4z2s{width:100%;height:100%;position:absolute;transform-origin:0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none;will-change:transform;touch-action:none}.c-svelteZoom--contain.svelte-17i4z2s{object-fit:contain}.c-svelteZoom--no-contain.svelte-17i4z2s{object-fit:contain}.c-svelteZoom--transition.svelte-17i4z2s{transition:transform 0.2s}.c-svelteZoom--visible.svelte-17i4z2s{visibility:visible}.c-svelteZoom--hidden.svelte-17i4z2s{visibility:hidden}";
     	append(document.head, style);
@@ -484,6 +484,8 @@ }
     			set_attributes(img_1, img_1_data);
-    			toggle_class(img_1, "c-svelteZoom--contain", /*contain*/ ctx[2]);
-    			toggle_class(img_1, "c-svelteZoom--no-contain", !/*contain*/ ctx[2]);
+    			toggle_class(img_1, "c-svelteZoom--contain", /*contain*/ ctx[3]);
+    			toggle_class(img_1, "c-svelteZoom--no-contain", !/*contain*/ ctx[3]);
     			toggle_class(img_1, "c-svelteZoom--transition", /*smooth*/ ctx[1]);
-    			toggle_class(img_1, "svelte-z6m8ik", true);
+    			toggle_class(img_1, "c-svelteZoom--visible", /*contain*/ ctx[3]);
+    			toggle_class(img_1, "c-svelteZoom--hidden", /*contain*/ ctx[3] === null);
+    			toggle_class(img_1, "svelte-17i4z2s", true);
     		},
@@ -511,6 +513,8 @@ m(target, anchor) {
 
-    			toggle_class(img_1, "c-svelteZoom--contain", /*contain*/ ctx[2]);
-    			toggle_class(img_1, "c-svelteZoom--no-contain", !/*contain*/ ctx[2]);
+    			toggle_class(img_1, "c-svelteZoom--contain", /*contain*/ ctx[3]);
+    			toggle_class(img_1, "c-svelteZoom--no-contain", !/*contain*/ ctx[3]);
     			toggle_class(img_1, "c-svelteZoom--transition", /*smooth*/ ctx[1]);
-    			toggle_class(img_1, "svelte-z6m8ik", true);
+    			toggle_class(img_1, "c-svelteZoom--visible", /*contain*/ ctx[3]);
+    			toggle_class(img_1, "c-svelteZoom--hidden", /*contain*/ ctx[3] === null);
+    			toggle_class(img_1, "svelte-17i4z2s", true);
     		},
@@ -533,4 +537,5 @@ i: noop,
     	let xY = { initX: 0, initY: 0, newX: 0, newY: 0 };
-    	let ratio, contain, img;
+    	let ratio, img;
     	let matrix;
+    	let contain = null;
     	let velocity = new MultiTouchVelocity();
@@ -566,3 +571,3 @@ let lastTap = { time: 0, x: 0 };
     		const mat = matrix.move(in_x >= 0 ? 0 : xY.newX, in_y >= 0 ? 0 : xY.newY, in_x, in_y, ratio);
-    		$$invalidate(3, img.style.transform = `matrix(${mat.a},${mat.b},${mat.c},${mat.d},${mat.e}, ${mat.f})`, img);
+    		$$invalidate(2, img.style.transform = `matrix(${mat.a},${mat.b},${mat.c},${mat.d},${mat.e}, ${mat.f})`, img);
     	}
@@ -607,3 +612,3 @@
     		scale.value = mat.d;
-    		$$invalidate(3, img.style.transform = `translate(${mat.e}px, ${mat.f}px) scale(${mat.d})`, img);
+    		$$invalidate(2, img.style.transform = `translate(${mat.e}px, ${mat.f}px) scale(${mat.d})`, img);
     	}
@@ -627,3 +632,3 @@
     		const mat = matrix.scale(xFactor, yFactor, origin, in_x, in_y, ratio, scale.max, scale.value * xFactor, f);
-    		$$invalidate(3, img.style.transform = `translate(${mat.e}px, ${mat.f}px) scale(${mat.d})`, img);
+    		$$invalidate(2, img.style.transform = `translate(${mat.e}px, ${mat.f}px) scale(${mat.d})`, img);
     		scale.value = mat.d;
@@ -646,3 +651,3 @@ scale.lastHypo = hypo;
     		const mat = matrix.scale(xFactor, yFactor, origin, in_x, in_y, ratio, scale.max, scale.value * xFactor, dir);
-    		$$invalidate(3, img.style.transform = `translate(${mat.e}px,${mat.f}px) scale(${mat.d})`, img);
+    		$$invalidate(2, img.style.transform = `translate(${mat.e}px,${mat.f}px) scale(${mat.d})`, img);
     		scale.value = mat.d;
@@ -675,3 +680,3 @@ }
     		const mat = matrix.scale(xFactor, yFactor, origin, in_x, in_y, ratio, scale.max, scale.value * xFactor, dir);
-    		$$invalidate(3, img.style.transform = `translate(${mat.e}px,${mat.f}px) scale(${mat.d})`, img);
+    		$$invalidate(2, img.style.transform = `translate(${mat.e}px,${mat.f}px) scale(${mat.d})`, img);
     		scale.value = mat.d;
@@ -682,7 +687,4 @@ }
     		const { naturalWidth, naturalHeight } = img;
-
-    		if (naturalWidth > window.innerWidth || naturalHeight > window.innerHeight) {
-    			$$invalidate(2, contain = true);
-    		}
-
+    		$$invalidate(3, contain = naturalWidth > window.innerWidth || naturalHeight > window.innerHeight);
+    		visible = contain;
     		scale.max = Math.max(naturalWidth / window.innerWidth, 1);
@@ -766,3 +768,3 @@ ratio = calculateAspectRatioFit(naturalWidth, naturalHeight, window.innerWidth, window.innerHeight);
     			img = $$value;
-    			$$invalidate(3, img);
+    			$$invalidate(2, img);
     		});
@@ -781,4 +783,4 @@ }
     		smooth,
+    		img,
     		contain,
-    		img,
     		onLoad,
@@ -797,3 +799,3 @@ mousedown,
     		super();
-    		if (!document.getElementById("svelte-z6m8ik-style")) add_css();
+    		if (!document.getElementById("svelte-17i4z2s-style")) add_css();
     		init(this, options, instance, create_fragment, safe_not_equal, { alt: 0, zoomIn: 8, zoomOut: 9 }, [-1, -1]);
@@ -800,0 +802,0 @@ }

package.json

 {
   "name": "svelte-zoom",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "Nearly native image scaling in web (mobile/desktop), rich in functionality. This will make your mobile users happy",
@@ -5,0 +5,0 @@ "svelte": "src/index.svelte",

No alert changes

Improved metrics

Total package byte prevSize

67799

increased by1.61%

Lines of code

1549

increased by0.52%

No dependency changes