@takuma-ru/vue-swipe-modal - npm Package Compare versions

Comparing version 5.0.3 to 5.0.4

dist/vueSwipeModal.js

@@ -1,3 +0,3 @@
-(function(){"use strict";try{if(typeof document<"u"){var d=document.createElement("style");d.appendChild(document.createTextNode('.swipe-modal[data-v-9dc0d5c5]{position:fixed;top:auto;box-sizing:border-box;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;padding:0;margin:0;overflow:hidden;border:none}.swipe-modal[data-v-9dc0d5c5]::backdrop{background-color:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.swipe-modal-content[data-v-9dc0d5c5]{width:100%;height:100%}.swipe-modal-content>.panel[data-v-9dc0d5c5]{max-height:calc(100dvh - 36px);overflow-y:scroll}.modal-style[data-v-9dc0d5c5]{box-sizing:border-box;width:100%;color:#fff;background-color:#1d1b20;border-radius:1rem 1rem 0 0}@media (prefers-color-scheme: light){.modal-style[data-v-9dc0d5c5]{color:#000;background-color:#f7f2fa;box-shadow:0 1px 4px #0000005e}}.swipe-modal-drag-handle-wrapper[data-v-9dc0d5c5]{position:relative;top:0;flex-shrink:0;height:36px;cursor:grab}.swipe-modal-drag-handle-wrapper[data-v-9dc0d5c5]:active{cursor:grabbing}.swipe-modal-drag-handle[data-v-9dc0d5c5]{position:absolute;left:50%;width:32px;height:4px;margin:16px 0;content:"";background-color:#ccc;border-radius:2px;transform:translate(-50%)}')),document.head.appendChild(d)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-import { getCurrentInstance as F, ref as S, watch as M, nextTick as N, computed as D, defineComponent as I, onMounted as O, onUnmounted as _, openBlock as L, createElementBlock as U, createElementVNode as Y, unref as h, renderSlot as B, createCommentVNode as H, pushScopeId as G, popScopeId as J } from "vue";
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.swipe-modal[data-v-31c69cef]{position:fixed;top:auto;box-sizing:border-box;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;padding:0;margin:0;overflow:hidden;border:none}.swipe-modal[data-v-31c69cef]::backdrop{background-color:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.swipe-modal-content[data-v-31c69cef]{width:100%;height:100%}.swipe-modal-content>.panel[data-v-31c69cef]{max-height:calc(100dvh - 36px);overflow-y:scroll}.modal-style[data-v-31c69cef]{box-sizing:border-box;width:100%;color:#fff;background-color:#1d1b20;border-radius:1rem 1rem 0 0}@media (prefers-color-scheme: light){.modal-style[data-v-31c69cef]{color:#000;background-color:#f7f2fa;box-shadow:0 1px 4px #0000005e}}.swipe-modal-drag-handle-wrapper[data-v-31c69cef]{position:relative;top:0;flex-shrink:0;height:36px;cursor:grab}.swipe-modal-drag-handle-wrapper[data-v-31c69cef]:active{cursor:grabbing}.swipe-modal-drag-handle[data-v-31c69cef]{position:absolute;left:50%;width:32px;height:4px;margin:16px 0;content:"";background-color:#ccc;border-radius:2px;transform:translate(-50%)}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
+import { getCurrentInstance as F, ref as S, watch as M, nextTick as N, computed as D, defineComponent as I, onMounted as L, onUnmounted as O, openBlock as _, createElementBlock as U, createElementVNode as Y, unref as h, renderSlot as B, createCommentVNode as H, pushScopeId as G, popScopeId as J } from "vue";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
@@ -9,31 +9,31 @@ const W = (t) => typeof t < "u";
 function X(t, n, o, r = {}) {
-  var e, i, m;
+  var e, a, m;
   const {
-    clone: v = !1,
-    passive: l = !1,
+    clone: d = !1,
+    passive: s = !1,
     eventName: P,
     deep: f = !1,
     defaultValue: y,
-    shouldEmit: w
-  } = r, p = F(), V = o || (p == null ? void 0 : p.emit) || ((e = p == null ? void 0 : p.$emit) == null ? void 0 : e.bind(p)) || ((m = (i = p == null ? void 0 : p.proxy) == null ? void 0 : i.$emit) == null ? void 0 : m.bind(p == null ? void 0 : p.proxy));
-  let d = P;
-  d = d || `update:${n.toString()}`;
-  const g = (c) => v ? typeof v == "function" ? v(c) : z(c) : c, b = () => W(t[n]) ? g(t[n]) : y, A = (c) => {
-    w ? w(c) && V(d, c) : V(d, c);
+    shouldEmit: E
+  } = r, p = F(), V = o || (p == null ? void 0 : p.emit) || ((e = p == null ? void 0 : p.$emit) == null ? void 0 : e.bind(p)) || ((m = (a = p == null ? void 0 : p.proxy) == null ? void 0 : a.$emit) == null ? void 0 : m.bind(p == null ? void 0 : p.proxy));
+  let v = P;
+  v = v || `update:${n.toString()}`;
+  const g = (c) => d ? typeof d == "function" ? d(c) : z(c) : c, b = () => W(t[n]) ? g(t[n]) : y, A = (c) => {
+    E ? E(c) && V(v, c) : V(v, c);
   };
-  if (l) {
-    const c = b(), E = S(c);
-    let a = !1;
+  if (s) {
+    const c = b(), w = S(c);
+    let i = !1;
     return M(
       () => t[n],
-      (s) => {
-        a || (a = !0, E.value = g(s), N(() => a = !1));
+      (l) => {
+        i || (i = !0, w.value = g(l), N(() => i = !1));
       }
     ), M(
-      E,
-      (s) => {
-        !a && (s !== t[n] || f) && A(s);
+      w,
+      (l) => {
+        !i && (l !== t[n] || f) && A(l);
       },
       { deep: f }
-    ), E;
+    ), w;
   } else
@@ -52,4 +52,4 @@ return D({
   return {
-    setCssVar: ({ name: e, value: i, fallback: m }) => {
-      document.documentElement.style.setProperty(`--${t}-${e}`, i), m == null || m(
+    setCssVar: ({ name: e, value: a, fallback: m }) => {
+      document.documentElement.style.setProperty(`--${t}-${e}`, a), m == null || m(
         e,
@@ -74,3 +74,3 @@ n(e)
     getCssVar: e,
-    setCssVar: i
+    setCssVar: a
   } = $({ scopeName: t });
@@ -94,6 +94,6 @@ return {
       ).onfinish = () => {
-        i({
+        a({
           name: "movementAmountY",
           value: "0"
-        }), i({
+        }), a({
           name: "bottom",
@@ -117,6 +117,6 @@ value: P()
       ).onfinish = () => {
-        i({
+        a({
           name: "movementAmountY",
           value: "0"
-        }), i({
+        }), a({
           name: "bottom",
@@ -140,6 +140,6 @@ value: e("snapPointPosition")
       ).onfinish = () => {
-        i({
+        a({
           name: "movementAmountY",
           value: "0"
-        }), i({
+        }), a({
           name: "bottom",
@@ -159,7 +159,7 @@ value: "0%"
   const {
-    getCssVar: i,
+    getCssVar: a,
     setCssVar: m
   } = $({ scopeName: t }), {
-    cancelAnim: v,
-    moveToSnapPointAnim: l,
+    cancelAnim: d,
+    moveToSnapPointAnim: s,
     moveToFullScreenAnim: P
@@ -177,10 +177,10 @@ } = k({
     handlePointerDown: ({
-      mouseEvent: d,
+      mouseEvent: v,
       touchEvent: g,
       eventType: b
     }) => {
-      b === "mouse" ? y.value = d.y : y.value = g.touches[0].clientY, f.value = !0;
+      b === "mouse" ? y.value = v.y : y.value = g.touches[0].clientY, f.value = !0;
     },
     handlePointerMove: ({
-      mouseEvent: d,
+      mouseEvent: v,
       touchEvent: g,
@@ -192,11 +192,11 @@ eventType: b
         name: "movementAmountY",
-        value: (y.value - d.y).toString()
+        value: (y.value - v.y).toString()
       } : {
         name: "movementAmountY",
         value: (y.value - g.touches[0].clientY).toString()
-      }), !(Number(i("movementAmountY")) > 0 && n.value === "full" || (((A = r.value) == null ? void 0 : A.getBoundingClientRect().top) || 0) < 0) && !(!o.isFullScreen && Number(i("movementAmountY")) > 0))) {
+      }), !(Number(a("movementAmountY")) > 0 && n.value === "full" || (((A = r.value) == null ? void 0 : A.getBoundingClientRect().top) || 0) < 0) && !(!o.isFullScreen && Number(a("movementAmountY")) > 0))) {
         if ((c = r.value) == null || c.style.setProperty("user-select", "none"), n.value === "snap") {
           m({
             name: "bottom",
-            value: `calc(${i("snapPointPosition")} + ${i("movementAmountY")}px)`
+            value: `calc(${a("snapPointPosition")} + ${a("movementAmountY")}px)`
           });
@@ -207,3 +207,3 @@ return;
           name: "bottom",
-          value: `calc(0% + ${i("movementAmountY")}px)`
+          value: `calc(0% + ${a("movementAmountY")}px)`
         });
@@ -213,10 +213,10 @@ }
     handlePointerUp: () => {
-      var d;
-      if (f.value = !1, (d = r.value) == null || d.style.removeProperty("user-select"), Math.abs(Number(i("movementAmountY"))) > 36) {
-        if (Number(i("movementAmountY")) < 0)
+      var v;
+      if (f.value = !1, (v = r.value) == null || v.style.removeProperty("user-select"), Math.abs(Number(a("movementAmountY"))) > 36) {
+        if (Number(a("movementAmountY")) < 0)
           switch (n.value) {
             case "full":
-              return o.snapPoint ? l() : o.isPersistent ? v() : e.value = !1;
+              return o.snapPoint ? s() : o.isPersistent ? d() : e.value = !1;
             case "snap":
-              return o.isPersistent ? v() : e.value = !1;
+              return o.isPersistent ? d() : e.value = !1;
             default:
@@ -227,3 +227,3 @@ return;
           case "snap":
-            return o.isFullScreen ? P() : v();
+            return o.isFullScreen ? P() : d();
           default:
@@ -233,3 +233,3 @@ return;
       }
-      return v();
+      return d();
     }
@@ -244,3 +244,3 @@ };
   document.defaultView ? (n = document.defaultView, o = n.scrollX, r = n.scrollY) : (e = document.documentElement, o = e.scrollLeft, r = e.scrollTop), document.documentElement.style.overflow = t, document.documentElement.style.overscrollBehaviorY = t === "auto" ? "auto" : "none", n.scrollTo(o, r);
-}, q = (t) => (G("data-v-9dc0d5c5"), t = t(), J(), t), K = /* @__PURE__ */ q(() => /* @__PURE__ */ Y("div", { class: "swipe-modal-drag-handle" }, null, -1)), Q = /* @__PURE__ */ I({
+}, q = (t) => (G("data-v-31c69cef"), t = t(), J(), t), K = /* @__PURE__ */ q(() => /* @__PURE__ */ Y("div", { class: "swipe-modal-drag-handle" }, null, -1)), Q = /* @__PURE__ */ I({
   __name: "SwipeModal",
@@ -259,9 +259,9 @@ props: {
     const o = t, r = n, e = Math.random().toString(36).substring(2) + Math.random().toString(36).substring(2), {
-      getCssVar: i,
+      getCssVar: a,
       setCssVar: m,
-      removeCssVar: v
+      removeCssVar: d
     } = $({
       scopeName: e
-    }), l = S(null), P = S(null), f = X(o, "modelValue", r), y = S("close"), {
-      cancelAnim: w
+    }), s = S(null), P = S(null), f = X(o, "modelValue", r), y = S("close"), {
+      cancelAnim: E
     } = k({
@@ -272,3 +272,3 @@ scopeName: e,
       refs: {
-        modalRef: l
+        modalRef: s
       }
@@ -278,3 +278,3 @@ }), {
       handlePointerDown: V,
-      handlePointerMove: d,
+      handlePointerMove: v,
       handlePointerUp: g
@@ -287,18 +287,18 @@ } = j({
       refs: {
-        modalRef: l,
+        modalRef: s,
         panelRef: P
       }
-    }), b = (a) => {
-      if (o.isBackdrop && a.target === a.currentTarget) {
+    }), b = (i) => {
+      if (o.isBackdrop && i.target === i.currentTarget) {
         if (o.isPersistent)
-          return w();
+          return E();
         f.value = !1;
       }
-    }, A = (a) => {
-      a.stopPropagation();
+    }, A = (i) => {
+      i.stopPropagation();
     }, c = () => {
-      var s;
-      if (!l.value)
+      var l;
+      if (!s.value)
         return;
-      o.isBackdrop ? l.value.showModal() : l.value.show(), (s = l.value) == null || s.style.setProperty("visibility", "visible"), navigator.userAgent.toLowerCase().includes("firefox") || l.value.animate([
+      o.isBackdrop ? s.value.showModal() : s.value.show(), (l = s.value) == null || l.style.setProperty("visibility", "visible"), navigator.userAgent.toLowerCase().includes("firefox") || s.value.animate([
         { opacity: 0 },
@@ -310,3 +310,3 @@ { opacity: 1 }
         easing: C
-      }), l.value.animate(
+      }), s.value.animate(
         [
@@ -317,3 +317,3 @@ {
           {
-            bottom: i("snapPointPosition")
+            bottom: a("snapPointPosition")
           }
@@ -328,9 +328,9 @@ ],
           name: "bottom",
-          value: i("snapPointPosition")
+          value: a("snapPointPosition")
         }), o.isScrollLock && T("hidden");
       };
-    }, E = () => {
-      if (!l.value)
+    }, w = () => {
+      if (!s.value)
         return;
-      navigator.userAgent.toLowerCase().includes("firefox") || l.value.animate([
+      navigator.userAgent.toLowerCase().includes("firefox") || s.value.animate([
         { opacity: 1 },
@@ -342,6 +342,6 @@ { opacity: 0 }
         easing: C
-      }), l.value.animate(
+      }), s.value.animate(
         [
           {
-            bottom: i("bottom")
+            bottom: a("bottom")
           },
@@ -357,7 +357,7 @@ {
       ).onfinish = () => {
-        var s, u, x;
+        var l, u, x;
         m({
           name: "bottom",
           value: "-100%"
-        }), y.value = "close", p.value = !1, (s = l.value) == null || s.close(), (u = l.value) == null || u.style.setProperty("display", "initial"), (x = l.value) == null || x.style.setProperty("visibility", "hidden"), T("reset");
+        }), y.value = "close", p.value = !1, (l = s.value) == null || l.close(), (u = s.value) == null || u.style.setProperty("display", "initial"), (x = s.value) == null || x.style.setProperty("visibility", "hidden"), T("reset");
       };
@@ -367,13 +367,13 @@ };
       () => f.value,
-      (a) => {
-        a ? c() : E();
+      (i) => {
+        i ? c() : w();
       }
     ), M(
       () => o.isScrollLock,
-      (a) => {
-        T(a ? "hidden" : "auto");
+      (i) => {
+        T(i ? "hidden" : "auto");
       }
-    ), M([() => o.snapPoint, () => P.value], ([a, s]) => {
+    ), M([() => o.snapPoint, () => P.value], ([i, l]) => {
       let u;
-      a ? a === "auto" ? u = `calc(${(s == null ? void 0 : s.getBoundingClientRect().height) || 0}px + 36px - 100%)` : u = `calc(${a} - 100%)` : u = "0px", m({
+      i ? i === "auto" ? u = `calc(${(l == null ? void 0 : l.getBoundingClientRect().height) || 0}px + 36px - 100%)` : u = `calc(${i} - 100%)` : u = "0px", m({
         name: "snapPointPosition",
@@ -390,9 +390,12 @@ value: u
       value: "0"
+    }), L(() => {
+      s.value && (s.value.style.setProperty("bottom", `var(--${e}-bottom)`), s.value.addEventListener("cancel", () => {
+        f.value = !1;
+      }), f.value || (s.value.style.setProperty("display", "initial"), s.value.style.setProperty("visibility", "hidden")));
     }), O(() => {
-      l.value && (l.value.style.setProperty("bottom", `var(--${e}-bottom)`), f.value || (l.value.style.setProperty("display", "initial"), l.value.style.setProperty("visibility", "hidden")));
-    }), _(() => {
-      v("bottom"), v("movementAmountY"), v("snapPointPosition");
-    }), (a, s) => (L(), U("dialog", {
+      d("bottom"), d("movementAmountY"), d("snapPointPosition"), s.value && s.value.removeEventListener("cancel", () => {
+      });
+    }), (i, l) => (_(), U("dialog", {
       ref_key: "modalRef",
-      ref: l,
+      ref: s,
       class: "swipe-modal modal-style",
@@ -408,24 +411,24 @@ onClick: b
           class: "swipe-modal-drag-handle-wrapper",
-          onMousedown: s[0] || (s[0] = (u) => h(V)({
+          onMousedown: l[0] || (l[0] = (u) => h(V)({
             mouseEvent: u,
             eventType: "mouse"
           })),
-          onMousemove: s[1] || (s[1] = (u) => h(d)({
+          onMousemove: l[1] || (l[1] = (u) => h(v)({
             mouseEvent: u,
             eventType: "mouse"
           })),
-          onMouseup: s[2] || (s[2] = //@ts-ignore
+          onMouseup: l[2] || (l[2] = //@ts-ignore
           (...u) => h(g) && h(g)(...u)),
-          onTouchstart: s[3] || (s[3] = (u) => h(V)({
+          onTouchstart: l[3] || (l[3] = (u) => h(V)({
             touchEvent: u,
             eventType: "touch"
           })),
-          onTouchmove: s[4] || (s[4] = (u) => h(d)({
+          onTouchmove: l[4] || (l[4] = (u) => h(v)({
             touchEvent: u,
             eventType: "touch"
           })),
-          onTouchend: s[5] || (s[5] = //@ts-ignore
+          onTouchend: l[5] || (l[5] = //@ts-ignore
           (...u) => h(g) && h(g)(...u))
         }, [
-          a.isDragHandle ? B(a.$slots, "drag-handle", { key: 0 }, () => [
+          i.isDragHandle ? B(i.$slots, "drag-handle", { key: 0 }, () => [
             K
@@ -439,3 +442,3 @@ ], !0) : H("", !0)
         }, [
-          B(a.$slots, "default", {}, void 0, !0)
+          B(i.$slots, "default", {}, void 0, !0)
         ], 512)
@@ -450,3 +453,3 @@ ])
   return o;
-}, ee = /* @__PURE__ */ Z(Q, [["__scopeId", "data-v-9dc0d5c5"]]);
+}, ee = /* @__PURE__ */ Z(Q, [["__scopeId", "data-v-31c69cef"]]);
 export {
@@ -453,0 +456,0 @@ ee as SwipeModal,

package.json

 {
   "name": "@takuma-ru/vue-swipe-modal",
   "type": "module",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "private": false,
@@ -6,0 +6,0 @@ "description": "Swipeable Bottom Sheet library for vue2 and vue3",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

41902

increased by0.85%

Lines of code

628

increased by0.8%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes