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

Comparing version 4.0.0-alpha.9 to 4.0.0-alpha.10

dist/swipe-modal.cjs.js

@@ -1,1 +0,1 @@
-(function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode(".swipe-modal-takumaru-vue-swipe-modal{position:fixed;scrollbar-width:none;z-index:15}.swipe-modal-takumaru-vue-swipe-modal .modal-background{position:fixed;z-index:11;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%,-50%)}.swipe-modal-takumaru-vue-swipe-modal .modal-contents{position:fixed;z-index:12;max-height:100vh;left:50%;transform:translate(-50%) translateY(0);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0px 16px 40px rgba(0,37,80,.2))}.swipe-modal-takumaru-vue-swipe-modal .modal-contents::-webkit-scrollbar{width:0px}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip-wrapper{z-index:12;display:flex;justify-items:center;align-items:center;justify-content:center;align-content:center;position:relative;top:0px;height:4px;width:100%;padding-top:8px;padding-bottom:8px;cursor:s-resize}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip{--tip-color: #c8c8c8;width:40px;height:100%;border-radius:4px;background-color:var(--tip-color)}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("vue-demi"),_;const Y=typeof window!="undefined",U=e=>typeof e=="function",E=e=>typeof e=="number",W=(e,i,a)=>Math.min(a,Math.max(i,e)),O=()=>{};Y&&((_=window==null?void 0:window.navigator)==null?void 0:_.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function $(e){return e}function N(e){return o.getCurrentScope()?(o.onScopeDispose(e),!0):!1}function L(e,i,a={}){const{immediate:r=!0}=a,l=o.ref(!1);let u=null;function v(){u&&(clearTimeout(u),u=null)}function c(){l.value=!1,v()}function f(...p){v(),l.value=!0,u=setTimeout(()=>{l.value=!1,u=null,e(...p)},o.unref(i))}return r&&(l.value=!0,Y&&f()),N(c),{isPending:l,start:f,stop:c}}const G=Y?window:void 0,V=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},I="__vueuse_ssr_handlers__";V[I]=V[I]||{};V[I];function q(e,i={}){const{immediate:a=!0,window:r=G}=i,l=o.ref(!1);let u=null;function v(){!l.value||!r||(e(),u=r.requestAnimationFrame(v))}function c(){!l.value&&r&&(l.value=!0,v())}function f(){l.value=!1,u!=null&&r&&(r.cancelAnimationFrame(u),u=null)}return a&&c(),N(f),{isActive:l,pause:f,resume:c}}var B;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(B||(B={}));function j([e,i,a,r]){const l=(n,s)=>1-3*s+3*n,u=(n,s)=>3*s-6*n,v=n=>3*n,c=(n,s,t)=>((l(s,t)*n+u(s,t))*n+v(s))*n,f=(n,s,t)=>3*l(s,t)*n*n+2*u(s,t)*n+v(s),p=n=>{let s=n;for(let t=0;t<4;++t){const h=f(s,e,a);if(h===0)return s;s-=(c(s,e,a)-n)/h}return s};return n=>e===i&&a===r?n:c(p(n),i,r)}function H(e,i={}){const{delay:a=0,disabled:r=!1,duration:l=1e3,onFinished:u=O,onStarted:v=O,transition:c=$}=i,f=o.computed(()=>{const d=o.unref(c);return U(d)?d:j(d)}),p=o.computed(()=>{const d=o.unref(e);return E(d)?d:d.map(o.unref)}),n=o.computed(()=>E(p.value)?[p.value]:p.value),s=o.ref(n.value.slice(0));let t,h,T,D,S;const{resume:R,pause:M}=q(()=>{const d=Date.now(),w=W(1-(T-d)/t,0,1);s.value=S.map((m,b)=>{var C;return m+((C=h[b])!=null?C:0)*f.value(w)}),w>=1&&(M(),u())},{immediate:!1}),y=()=>{M(),t=o.unref(l),h=s.value.map((d,w)=>{var m,b;return((m=n.value[w])!=null?m:0)-((b=s.value[w])!=null?b:0)}),S=s.value.slice(0),D=Date.now(),T=D+t,R(),v()},x=L(y,a,{immediate:!1});return o.watch(n,()=>{o.unref(r)?s.value=n.value.slice(0):o.unref(a)<=0?y():x.start()},{deep:!0}),o.computed(()=>{const d=o.unref(r)?n:s;return E(p.value)?d.value[0]:d.value})}const z=()=>{const e=o.ref({isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0});return{touchPosition:e,initTouchPosition:()=>{e.value={isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0}},touchStart:u=>{e.value.isTouch=!0,e.value.touchStart=u.touches[0].pageY},touchMove:u=>{e.value.isTouch&&(e.value.touchY=u.touches[0].pageY,e.value.touchDistance=e.value.touchStart-e.value.touchY,e.value.touchDistance>0&&(e.value.touchDistance=0))},touchEnd:()=>{e.value.isTouch=!1}}};function K(){const e=o.ref({isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0});return{mousePosition:e,initMousePosition:()=>{e.value={isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0}},mouseDown:u=>{e.value.isMouseDown=!0,e.value.downStart=u.pageY},mouseMove:u=>{e.value.isMouseDown&&(e.value.mouseY=u.pageY,e.value.mouseDistance=e.value.downStart-e.value.mouseY,e.value.mouseDistance>0&&(e.value.mouseDistance=0))},mouseUp:()=>{e.value.isMouseDown=!1}}}const P=e=>{if(e.indexOf("px")>0)return Number(e.slice(0,e.indexOf("px")));if(e.indexOf("vh")>0){const i=Number(e.slice(0,e.indexOf("vh")));return window.innerHeight*(i/100)}else if(e.indexOf("vw")>0){const i=Number(e.slice(0,e.indexOf("vw")));return window.innerWidth*(i/100)}else return 0};o.install();var F=o.defineComponent({name:"swipeModal",model:{prop:"modelValue",event:"update:modelValue"},props:{modelValue:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},persistent:{type:Boolean,default:!1},backgroundColor:{type:String,default:"#80808080"},fullscreen:{type:Boolean,default:!1},noTip:{type:Boolean,default:!1},contentsWidth:{type:String,default:"100%"},contentsHeight:{type:String,default:"30vh"},borderTopRadius:{type:String,default:null},borderTopLeftRadius:{type:String,default:"0px"},borderTopRightRadius:{type:String,default:"0px"},contentsColor:{type:String,default:"white"},tipColor:{type:String,default:"#c8c8c8"},darkContentsColor:{type:String,default:"#1E1E1E"}},emits:["update:modelValue"],setup(e,i){const{mousePosition:a,initMousePosition:r,mouseDown:l,mouseMove:u,mouseUp:v}=K(),{touchPosition:c,initTouchPosition:f,touchStart:p,touchMove:n,touchEnd:s}=z(),t=o.toRefs(e),h=o.computed({get:()=>t.modelValue.value,set:g=>i.emit("update:modelValue",g)}),T=o.ref(250),D=o.ref([parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0]),S=H(D,{duration:250,transition:[.25,.8,.25,1]}),R=o.computed(()=>{const[g,k,A,X]=S.value;return`rgba(${g}, ${k}, ${A}, ${X})`}),M=o.ref(-1*P(t.contentsHeight.value)),y=H(M,{duration:T.value,transition:[.25,.8,.25,1]}),x=o.computed(()=>y.value+(Math.abs(c.value.touchDistance)>Math.abs(a.value.mouseDistance)?c.value.touchDistance:a.value.mouseDistance)),d=()=>{document.documentElement.style.overflowY="auto",h.value=!1},w=()=>{M.value=0,D.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),parseInt(t.backgroundColor.value.slice(7,9),16)/255]},m=()=>{M.value=-1*P(t.contentsHeight.value)-(Math.abs(c.value.touchDistance)>Math.abs(a.value.mouseDistance)?c.value.touchDistance:a.value.mouseDistance),D.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0],setTimeout(()=>{r(),f(),d()},T.value)},b=()=>{s(),-1*c.value.touchDistance>P(t.contentsHeight.value)/8?m():c.value.touchDistance=0},C=()=>{v(),-1*a.value.mouseDistance>P(t.contentsHeight.value)/8?m():a.value.mouseDistance=0};return o.watch(h,(g,k)=>{h.value&&w()}),()=>{var g,k;return o.h("div",{class:"swipe-modal-takumaru-vue-swipe-modal",on:{mousemove:u,mouseup:C},onMousemove:u,onMouseup:C},[t.modelValue.value?o.h("div",{class:"modal-background",style:{backgroundColor:R.value},on:{onMouseup:()=>t.persistent.value?()=>null:m(),click:()=>t.persistent.value?()=>null:m()},onMouseup:()=>{t.persistent.value||m()},onClick:()=>{t.persistent.value||m()}}):null,t.modelValue.value?o.h("div",{class:"modal-contents",style:{width:t.contentsWidth.value,minHeight:t.contentsHeight.value,borderTopLeftRadius:t.borderTopRadius.value?t.borderTopRadius.value:t.borderTopLeftRadius.value,borderTopRightRadius:t.borderTopRadius?t.borderTopRadius.value:t.borderTopRightRadius.value,backgroundColor:t.dark.value?t.darkContentsColor.value:t.contentsColor.value,color:t.dark.value?"white":"black",bottom:`${x.value}px`},on:{touchstart:p,touchmove:n,touchend:b},onTouchstart:p,onTouchmove:n,onTouchend:b},[t.noTip.value?null:o.h("div",{class:"modal-contents-chip-wrapper",on:{mousedown:l},onMousedown:l},o.h("div",{class:"modal-contents-chip",style:{"--tip-color":t.tipColor.value}})),(k=(g=i.slots).default)==null?void 0:k.call(g)]):null])}}});exports.default=F;exports.swipeModal=F;
+(function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode(".swipe-modal-takumaru-vue-swipe-modal{position:fixed;scrollbar-width:none;z-index:15}.swipe-modal-takumaru-vue-swipe-modal .modal-background{position:fixed;z-index:11;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%,-50%)}.swipe-modal-takumaru-vue-swipe-modal .modal-contents{position:fixed;z-index:12;max-height:100vh;left:50%;transform:translate(-50%) translateY(0);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0px 16px 40px rgba(0,37,80,.2))}.swipe-modal-takumaru-vue-swipe-modal .modal-contents::-webkit-scrollbar{width:0px}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip-wrapper{z-index:12;display:flex;justify-items:center;align-items:center;justify-content:center;align-content:center;position:relative;top:0px;height:4px;width:100%;padding-top:8px;padding-bottom:8px;cursor:s-resize}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip{--tip-color: #c8c8c8;width:40px;height:100%;border-radius:4px;background-color:var(--tip-color)}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("vue-demi"),B;const I=typeof window!="undefined",L=e=>typeof e=="function",V=e=>typeof e=="number",G=(e,l,n)=>Math.min(n,Math.max(l,e)),H=()=>{};I&&((B=window==null?void 0:window.navigator)==null?void 0:B.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function q(e){return e}function A(e){return o.getCurrentScope()?(o.onScopeDispose(e),!0):!1}function j(e,l,n={}){const{immediate:c=!0}=n,i=o.ref(!1);let u=null;function d(){u&&(clearTimeout(u),u=null)}function r(){i.value=!1,d()}function f(...m){d(),i.value=!0,u=setTimeout(()=>{i.value=!1,u=null,e(...m)},o.unref(l))}return c&&(i.value=!0,I&&f()),A(r),{isPending:i,start:f,stop:r}}function z(e){var l;const n=o.unref(e);return(l=n==null?void 0:n.$el)!=null?l:n}const X=I?window:void 0,_=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},x="__vueuse_ssr_handlers__";_[x]=_[x]||{};_[x];function K(e,l,{window:n=X,initialValue:c=""}={}){const i=o.ref(c),u=o.computed(()=>{var d;return z(l)||((d=n==null?void 0:n.document)==null?void 0:d.documentElement)});return o.watch([u,()=>o.unref(e)],([d,r])=>{var f;if(d&&n){const m=(f=n.getComputedStyle(d).getPropertyValue(r))==null?void 0:f.trim();i.value=m||c}},{immediate:!0}),o.watch(i,d=>{var r;(r=u.value)!=null&&r.style&&u.value.style.setProperty(o.unref(e),d)}),i}function J(e,l={}){const{immediate:n=!0,window:c=X}=l,i=o.ref(!1);let u=null;function d(){!i.value||!c||(e(),u=c.requestAnimationFrame(d))}function r(){!i.value&&c&&(i.value=!0,d())}function f(){i.value=!1,u!=null&&c&&(c.cancelAnimationFrame(u),u=null)}return n&&r(),A(f),{isActive:i,pause:f,resume:r}}var N;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(N||(N={}));function Q([e,l,n,c]){const i=(s,a)=>1-3*a+3*s,u=(s,a)=>3*a-6*s,d=s=>3*s,r=(s,a,t)=>((i(a,t)*s+u(a,t))*s+d(a))*s,f=(s,a,t)=>3*i(a,t)*s*s+2*u(a,t)*s+d(a),m=s=>{let a=s;for(let t=0;t<4;++t){const p=f(a,e,n);if(p===0)return a;a-=(r(a,e,n)-s)/p}return a};return s=>e===l&&n===c?s:r(m(s),l,c)}function F(e,l={}){const{delay:n=0,disabled:c=!1,duration:i=1e3,onFinished:u=H,onStarted:d=H,transition:r=q}=l,f=o.computed(()=>{const v=o.unref(r);return L(v)?v:Q(v)}),m=o.computed(()=>{const v=o.unref(e);return V(v)?v:v.map(o.unref)}),s=o.computed(()=>V(m.value)?[m.value]:m.value),a=o.ref(s.value.slice(0));let t,p,w,S,k;const{resume:M,pause:P}=J(()=>{const v=Date.now(),b=G(1-(w-v)/t,0,1);a.value=k.map((T,D)=>{var h;return T+((h=p[D])!=null?h:0)*f.value(b)}),b>=1&&(P(),u())},{immediate:!1}),R=()=>{P(),t=o.unref(i),p=a.value.map((v,b)=>{var T,D;return((T=s.value[b])!=null?T:0)-((D=a.value[b])!=null?D:0)}),k=a.value.slice(0),S=Date.now(),w=S+t,M(),d()},C=j(R,n,{immediate:!1});return o.watch(s,()=>{o.unref(c)?a.value=s.value.slice(0):o.unref(n)<=0?R():C.start()},{deep:!0}),o.computed(()=>{const v=o.unref(c)?s:a;return V(m.value)?v.value[0]:v.value})}const Z=()=>{const e=o.ref({isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0});return{touchPosition:e,initTouchPosition:()=>{e.value={isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0}},touchStart:u=>{e.value.isTouch=!0,e.value.touchStart=u.touches[0].pageY},touchMove:u=>{e.value.isTouch&&(e.value.touchY=u.touches[0].pageY,e.value.touchDistance=e.value.touchStart-e.value.touchY,e.value.touchDistance>0&&(e.value.touchDistance=0))},touchEnd:()=>{e.value.isTouch=!1}}};function ee(){const e=o.ref({isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0});return{mousePosition:e,initMousePosition:()=>{e.value={isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0}},mouseDown:u=>{e.value.isMouseDown=!0,e.value.downStart=u.pageY},mouseMove:u=>{e.value.isMouseDown&&(e.value.mouseY=u.pageY,e.value.mouseDistance=e.value.downStart-e.value.mouseY,e.value.mouseDistance>0&&(e.value.mouseDistance=0))},mouseUp:()=>{e.value.isMouseDown=!1}}}const E=e=>{if(e.indexOf("px")>0)return Number(e.slice(0,e.indexOf("px")));if(e.indexOf("vh")>0){const l=Number(e.slice(0,e.indexOf("vh")));return window.innerHeight*(l/100)}else if(e.indexOf("vw")>0){const l=Number(e.slice(0,e.indexOf("vw")));return window.innerWidth*(l/100)}else return 0};o.install();var $=o.defineComponent({name:"swipeModal",model:{prop:"modelValue",event:"update:modelValue"},props:{modelValue:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},persistent:{type:Boolean,default:!1},backgroundColor:{type:String,default:"#80808080"},fullscreen:{type:Boolean,default:!1},noTip:{type:Boolean,default:!1},contentsWidth:{type:String,default:"100%"},contentsHeight:{type:String,default:"30vh"},borderTopRadius:{type:String,default:null},borderTopLeftRadius:{type:String,default:"0px"},borderTopRightRadius:{type:String,default:"0px"},contentsColor:{type:String,default:"white"},tipColor:{type:String,default:"#c8c8c8"},darkContentsColor:{type:String,default:"#1E1E1E"}},emits:["update:modelValue"],setup(e,l){const{mousePosition:n,initMousePosition:c,mouseDown:i,mouseMove:u,mouseUp:d}=ee(),{touchPosition:r,initTouchPosition:f,touchStart:m,touchMove:s,touchEnd:a}=Z(),t=o.toRefs(e),p=o.computed({get:()=>t.modelValue.value,set:g=>l.emit("update:modelValue",g)}),w=o.ref(250),S=o.ref(null),k=K("--tip-color",S);k.value=t.tipColor.value;const M=o.ref([parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0]),P=F(M,{duration:250,transition:[.25,.8,.25,1]}),R=o.computed(()=>{const[g,y,U,W]=P.value;return`rgba(${g}, ${y}, ${U}, ${W})`}),C=o.ref(-1*E(t.contentsHeight.value)),v=F(C,{duration:w.value,transition:[.25,.8,.25,1]}),b=o.computed(()=>v.value+(Math.abs(r.value.touchDistance)>Math.abs(n.value.mouseDistance)?r.value.touchDistance:n.value.mouseDistance)),T=()=>{document.documentElement.style.overflowY="auto",p.value=!1},D=()=>{C.value=0,M.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),parseInt(t.backgroundColor.value.slice(7,9),16)/255]},h=()=>{C.value=-1*E(t.contentsHeight.value)-(Math.abs(r.value.touchDistance)>Math.abs(n.value.mouseDistance)?r.value.touchDistance:n.value.mouseDistance),M.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0],setTimeout(()=>{c(),f(),T()},w.value)},Y=()=>{a(),-1*r.value.touchDistance>E(t.contentsHeight.value)/8?h():r.value.touchDistance=0},O=()=>{d(),-1*n.value.mouseDistance>E(t.contentsHeight.value)/8?h():n.value.mouseDistance=0};return o.watch(p,(g,y)=>{p.value&&D()}),()=>{var g,y;return o.h("div",{class:"swipe-modal-takumaru-vue-swipe-modal",on:{mousemove:u,mouseup:O},onMousemove:u,onMouseup:O},[t.modelValue.value?o.h("div",{class:"modal-background",style:{backgroundColor:R.value},on:{onMouseup:()=>t.persistent.value?()=>null:h(),click:()=>t.persistent.value?()=>null:h()},onMouseup:()=>{t.persistent.value||h()},onClick:()=>{t.persistent.value||h()}}):null,t.modelValue.value?o.h("div",{class:"modal-contents",style:{width:t.contentsWidth.value,minHeight:t.contentsHeight.value,borderTopLeftRadius:t.borderTopRadius.value?t.borderTopRadius.value:t.borderTopLeftRadius.value,borderTopRightRadius:t.borderTopRadius?t.borderTopRadius.value:t.borderTopRightRadius.value,backgroundColor:t.dark.value?t.darkContentsColor.value:t.contentsColor.value,color:t.dark.value?"white":"black",bottom:`${b.value}px`},on:{touchstart:m,touchmove:s,touchend:Y},onTouchstart:m,onTouchmove:s,onTouchend:Y},[t.noTip.value?null:o.h("div",{class:"modal-contents-chip-wrapper",on:{mousedown:i},onMousedown:i},o.h("div",{class:"modal-contents-chip"})),(y=(g=l.slots).default)==null?void 0:y.call(g)]):null])}}});exports.default=$;exports.swipeModal=$;

dist/swipe-modal.es.js

@@ -57,2 +57,7 @@ (function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode(".swipe-modal-takumaru-vue-swipe-modal{position:fixed;scrollbar-width:none;z-index:15}.swipe-modal-takumaru-vue-swipe-modal .modal-background{position:fixed;z-index:11;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%,-50%)}.swipe-modal-takumaru-vue-swipe-modal .modal-contents{position:fixed;z-index:12;max-height:100vh;left:50%;transform:translate(-50%) translateY(0);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0px 16px 40px rgba(0,37,80,.2))}.swipe-modal-takumaru-vue-swipe-modal .modal-contents::-webkit-scrollbar{width:0px}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip-wrapper{z-index:12;display:flex;justify-items:center;align-items:center;justify-content:center;align-content:center;position:relative;top:0px;height:4px;width:100%;padding-top:8px;padding-bottom:8px;cursor:s-resize}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip{--tip-color: #c8c8c8;width:40px;height:100%;border-radius:4px;background-color:var(--tip-color)}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();import { ref, unref, getCurrentScope, onScopeDispose, computed, watch, install, defineComponent, toRefs, h } from "vue-demi";
 }
+function unrefElement(elRef) {
+  var _a2;
+  const plain = unref(elRef);
+  return (_a2 = plain == null ? void 0 : plain.$el) != null ? _a2 : plain;
+}
 const defaultWindow = isClient ? window : void 0;
@@ -63,2 +68,22 @@ const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 _global[globalKey];
+function useCssVar(prop, target, { window: window2 = defaultWindow, initialValue = "" } = {}) {
+  const variable = ref(initialValue);
+  const elRef = computed(() => {
+    var _a2;
+    return unrefElement(target) || ((_a2 = window2 == null ? void 0 : window2.document) == null ? void 0 : _a2.documentElement);
+  });
+  watch([elRef, () => unref(prop)], ([el, prop2]) => {
+    var _a2;
+    if (el && window2) {
+      const value = (_a2 = window2.getComputedStyle(el).getPropertyValue(prop2)) == null ? void 0 : _a2.trim();
+      variable.value = value || initialValue;
+    }
+  }, { immediate: true });
+  watch(variable, (val) => {
+    var _a2;
+    if ((_a2 = elRef.value) == null ? void 0 : _a2.style)
+      elRef.value.style.setProperty(unref(prop), val);
+  });
+  return variable;
+}
 function useRafFn(fn, options = {}) {
@@ -377,2 +402,5 @@ const {
     const contentsBottomPositionTransitionDuration = ref(250);
+    const el = ref(null);
+    const tipColor = useCssVar("--tip-color", el);
+    tipColor.value = propsRef.tipColor.value;
     const backgroundColor = ref([
@@ -503,6 +531,3 @@ parseInt(propsRef.backgroundColor.value.slice(1, 3), 16),
           }, h("div", {
-            class: "modal-contents-chip",
-            style: {
-              "--tip-color": propsRef.tipColor.value
-            }
+            class: "modal-contents-chip"
           })) : null,
@@ -509,0 +534,0 @@ (_b = (_a2 = context.slots).default) == null ? void 0 : _b.call(_a2)

dist/swipe-modal.umd.js

 (function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode(".swipe-modal-takumaru-vue-swipe-modal{position:fixed;scrollbar-width:none;z-index:15}.swipe-modal-takumaru-vue-swipe-modal .modal-background{position:fixed;z-index:11;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%,-50%)}.swipe-modal-takumaru-vue-swipe-modal .modal-contents{position:fixed;z-index:12;max-height:100vh;left:50%;transform:translate(-50%) translateY(0);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0px 16px 40px rgba(0,37,80,.2))}.swipe-modal-takumaru-vue-swipe-modal .modal-contents::-webkit-scrollbar{width:0px}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip-wrapper{z-index:12;display:flex;justify-items:center;align-items:center;justify-content:center;align-content:center;position:relative;top:0px;height:4px;width:100%;padding-top:8px;padding-bottom:8px;cursor:s-resize}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip{--tip-color: #c8c8c8;width:40px;height:100%;border-radius:4px;background-color:var(--tip-color)}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();var __vite_style__=document.createElement("style");__vite_style__.innerHTML=`.swipe-modal-takumaru-vue-swipe-modal{position:fixed;scrollbar-width:none;z-index:15}.swipe-modal-takumaru-vue-swipe-modal .modal-background{position:fixed;z-index:11;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%,-50%)}.swipe-modal-takumaru-vue-swipe-modal .modal-contents{position:fixed;z-index:12;max-height:100vh;left:50%;transform:translate(-50%) translateY(0);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0px 16px 40px rgba(0,37,80,.2))}.swipe-modal-takumaru-vue-swipe-modal .modal-contents::-webkit-scrollbar{width:0px}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip-wrapper{z-index:12;display:flex;justify-items:center;align-items:center;justify-content:center;align-content:center;position:relative;top:0px;height:4px;width:100%;padding-top:8px;padding-bottom:8px;cursor:s-resize}.swipe-modal-takumaru-vue-swipe-modal .modal-contents-chip{--tip-color: #c8c8c8;width:40px;height:100%;border-radius:4px;background-color:var(--tip-color)}
-(function(w,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue-demi")):typeof define=="function"&&define.amd?define(["exports","vue-demi"],o):(w=typeof globalThis!="undefined"?globalThis:w||self,o(w.swipeModal={},w.vueDemi))})(this,function(w,o){"use strict";`;document.head.appendChild(__vite_style__);var H;const _=typeof window!="undefined",z=e=>typeof e=="function",E=e=>typeof e=="number",L=(e,i,a)=>Math.min(a,Math.max(i,e)),B=()=>{};_&&((H=window==null?void 0:window.navigator)==null?void 0:H.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function U(e){return e}function N(e){return o.getCurrentScope()?(o.onScopeDispose(e),!0):!1}function W(e,i,a={}){const{immediate:r=!0}=a,l=o.ref(!1);let s=null;function p(){s&&(clearTimeout(s),s=null)}function c(){l.value=!1,p()}function f(...v){p(),l.value=!0,s=setTimeout(()=>{l.value=!1,s=null,e(...v)},o.unref(i))}return r&&(l.value=!0,_&&f()),N(c),{isPending:l,start:f,stop:c}}const $=_?window:void 0,V=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},Y="__vueuse_ssr_handlers__";V[Y]=V[Y]||{},V[Y];function j(e,i={}){const{immediate:a=!0,window:r=$}=i,l=o.ref(!1);let s=null;function p(){!l.value||!r||(e(),s=r.requestAnimationFrame(p))}function c(){!l.value&&r&&(l.value=!0,p())}function f(){l.value=!1,s!=null&&r&&(r.cancelAnimationFrame(s),s=null)}return a&&c(),N(f),{isActive:l,pause:f,resume:c}}var F;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(F||(F={}));function D([e,i,a,r]){const l=(n,u)=>1-3*u+3*n,s=(n,u)=>3*u-6*n,p=n=>3*n,c=(n,u,t)=>((l(u,t)*n+s(u,t))*n+p(u))*n,f=(n,u,t)=>3*l(u,t)*n*n+2*s(u,t)*n+p(u),v=n=>{let u=n;for(let t=0;t<4;++t){const m=f(u,e,a);if(m===0)return u;u-=(c(u,e,a)-n)/m}return u};return n=>e===i&&a===r?n:c(v(n),i,r)}function A(e,i={}){const{delay:a=0,disabled:r=!1,duration:l=1e3,onFinished:s=B,onStarted:p=B,transition:c=U}=i,f=o.computed(()=>{const d=o.unref(c);return z(d)?d:D(d)}),v=o.computed(()=>{const d=o.unref(e);return E(d)?d:d.map(o.unref)}),n=o.computed(()=>E(v.value)?[v.value]:v.value),u=o.ref(n.value.slice(0));let t,m,k,x,P;const{resume:I,pause:M}=j(()=>{const d=Date.now(),b=L(1-(k-d)/t,0,1);u.value=P.map((h,T)=>{var y;return h+((y=m[T])!=null?y:0)*f.value(b)}),b>=1&&(M(),s())},{immediate:!1}),R=()=>{M(),t=o.unref(l),m=u.value.map((d,b)=>{var h,T;return((h=n.value[b])!=null?h:0)-((T=u.value[b])!=null?T:0)}),P=u.value.slice(0),x=Date.now(),k=x+t,I(),p()},O=W(R,a,{immediate:!1});return o.watch(n,()=>{o.unref(r)?u.value=n.value.slice(0):o.unref(a)<=0?R():O.start()},{deep:!0}),o.computed(()=>{const d=o.unref(r)?n:u;return E(v.value)?d.value[0]:d.value})}const G=()=>{const e=o.ref({isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0});return{touchPosition:e,initTouchPosition:()=>{e.value={isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0}},touchStart:s=>{e.value.isTouch=!0,e.value.touchStart=s.touches[0].pageY},touchMove:s=>{e.value.isTouch&&(e.value.touchY=s.touches[0].pageY,e.value.touchDistance=e.value.touchStart-e.value.touchY,e.value.touchDistance>0&&(e.value.touchDistance=0))},touchEnd:()=>{e.value.isTouch=!1}}};function q(){const e=o.ref({isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0});return{mousePosition:e,initMousePosition:()=>{e.value={isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0}},mouseDown:s=>{e.value.isMouseDown=!0,e.value.downStart=s.pageY},mouseMove:s=>{e.value.isMouseDown&&(e.value.mouseY=s.pageY,e.value.mouseDistance=e.value.downStart-e.value.mouseY,e.value.mouseDistance>0&&(e.value.mouseDistance=0))},mouseUp:()=>{e.value.isMouseDown=!1}}}const S=e=>{if(e.indexOf("px")>0)return Number(e.slice(0,e.indexOf("px")));if(e.indexOf("vh")>0){const i=Number(e.slice(0,e.indexOf("vh")));return window.innerHeight*(i/100)}else if(e.indexOf("vw")>0){const i=Number(e.slice(0,e.indexOf("vw")));return window.innerWidth*(i/100)}else return 0};var Q="";o.install();var X=o.defineComponent({name:"swipeModal",model:{prop:"modelValue",event:"update:modelValue"},props:{modelValue:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},persistent:{type:Boolean,default:!1},backgroundColor:{type:String,default:"#80808080"},fullscreen:{type:Boolean,default:!1},noTip:{type:Boolean,default:!1},contentsWidth:{type:String,default:"100%"},contentsHeight:{type:String,default:"30vh"},borderTopRadius:{type:String,default:null},borderTopLeftRadius:{type:String,default:"0px"},borderTopRightRadius:{type:String,default:"0px"},contentsColor:{type:String,default:"white"},tipColor:{type:String,default:"#c8c8c8"},darkContentsColor:{type:String,default:"#1E1E1E"}},emits:["update:modelValue"],setup(e,i){const{mousePosition:a,initMousePosition:r,mouseDown:l,mouseMove:s,mouseUp:p}=q(),{touchPosition:c,initTouchPosition:f,touchStart:v,touchMove:n,touchEnd:u}=G(),t=o.toRefs(e),m=o.computed({get:()=>t.modelValue.value,set:g=>i.emit("update:modelValue",g)}),k=o.ref(250),x=o.ref([parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0]),P=A(x,{duration:250,transition:[.25,.8,.25,1]}),I=o.computed(()=>{const[g,C,K,J]=P.value;return`rgba(${g}, ${C}, ${K}, ${J})`}),M=o.ref(-1*S(t.contentsHeight.value)),R=A(M,{duration:k.value,transition:[.25,.8,.25,1]}),O=o.computed(()=>R.value+(Math.abs(c.value.touchDistance)>Math.abs(a.value.mouseDistance)?c.value.touchDistance:a.value.mouseDistance)),d=()=>{document.documentElement.style.overflowY="auto",m.value=!1},b=()=>{M.value=0,x.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),parseInt(t.backgroundColor.value.slice(7,9),16)/255]},h=()=>{M.value=-1*S(t.contentsHeight.value)-(Math.abs(c.value.touchDistance)>Math.abs(a.value.mouseDistance)?c.value.touchDistance:a.value.mouseDistance),x.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0],setTimeout(()=>{r(),f(),d()},k.value)},T=()=>{u(),-1*c.value.touchDistance>S(t.contentsHeight.value)/8?h():c.value.touchDistance=0},y=()=>{p(),-1*a.value.mouseDistance>S(t.contentsHeight.value)/8?h():a.value.mouseDistance=0};return o.watch(m,(g,C)=>{m.value&&b()}),()=>{var g,C;return o.h("div",{class:"swipe-modal-takumaru-vue-swipe-modal",on:{mousemove:s,mouseup:y},onMousemove:s,onMouseup:y},[t.modelValue.value?o.h("div",{class:"modal-background",style:{backgroundColor:I.value},on:{onMouseup:()=>t.persistent.value?()=>null:h(),click:()=>t.persistent.value?()=>null:h()},onMouseup:()=>{t.persistent.value||h()},onClick:()=>{t.persistent.value||h()}}):null,t.modelValue.value?o.h("div",{class:"modal-contents",style:{width:t.contentsWidth.value,minHeight:t.contentsHeight.value,borderTopLeftRadius:t.borderTopRadius.value?t.borderTopRadius.value:t.borderTopLeftRadius.value,borderTopRightRadius:t.borderTopRadius?t.borderTopRadius.value:t.borderTopRightRadius.value,backgroundColor:t.dark.value?t.darkContentsColor.value:t.contentsColor.value,color:t.dark.value?"white":"black",bottom:`${O.value}px`},on:{touchstart:v,touchmove:n,touchend:T},onTouchstart:v,onTouchmove:n,onTouchend:T},[t.noTip.value?null:o.h("div",{class:"modal-contents-chip-wrapper",on:{mousedown:l},onMousedown:l},o.h("div",{class:"modal-contents-chip",style:{"--tip-color":t.tipColor.value}})),(C=(g=i.slots).default)==null?void 0:C.call(g)]):null])}}});w.default=X,w.swipeModal=X,Object.defineProperties(w,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(g,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue-demi")):typeof define=="function"&&define.amd?define(["exports","vue-demi"],o):(g=typeof globalThis!="undefined"?globalThis:g||self,o(g.swipeModal={},g.vueDemi))})(this,function(g,o){"use strict";`;document.head.appendChild(__vite_style__);var H;const V=typeof window!="undefined",U=e=>typeof e=="function",Y=e=>typeof e=="number",W=(e,l,n)=>Math.min(n,Math.max(l,e)),B=()=>{};V&&((H=window==null?void 0:window.navigator)==null?void 0:H.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function j(e){return e}function N(e){return o.getCurrentScope()?(o.onScopeDispose(e),!0):!1}function G(e,l,n={}){const{immediate:c=!0}=n,r=o.ref(!1);let u=null;function d(){u&&(clearTimeout(u),u=null)}function i(){r.value=!1,d()}function p(...v){d(),r.value=!0,u=setTimeout(()=>{r.value=!1,u=null,e(...v)},o.unref(l))}return c&&(r.value=!0,V&&p()),N(i),{isPending:r,start:p,stop:i}}function q(e){var l;const n=o.unref(e);return(l=n==null?void 0:n.$el)!=null?l:n}const F=V?window:void 0,I=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},O="__vueuse_ssr_handlers__";I[O]=I[O]||{},I[O];function K(e,l,{window:n=F,initialValue:c=""}={}){const r=o.ref(c),u=o.computed(()=>{var d;return q(l)||((d=n==null?void 0:n.document)==null?void 0:d.documentElement)});return o.watch([u,()=>o.unref(e)],([d,i])=>{var p;if(d&&n){const v=(p=n.getComputedStyle(d).getPropertyValue(i))==null?void 0:p.trim();r.value=v||c}},{immediate:!0}),o.watch(r,d=>{var i;(i=u.value)!=null&&i.style&&u.value.style.setProperty(o.unref(e),d)}),r}function J(e,l={}){const{immediate:n=!0,window:c=F}=l,r=o.ref(!1);let u=null;function d(){!r.value||!c||(e(),u=c.requestAnimationFrame(d))}function i(){!r.value&&c&&(r.value=!0,d())}function p(){r.value=!1,u!=null&&c&&(c.cancelAnimationFrame(u),u=null)}return n&&i(),N(p),{isActive:r,pause:p,resume:i}}var A;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(A||(A={}));function Q([e,l,n,c]){const r=(s,a)=>1-3*a+3*s,u=(s,a)=>3*a-6*s,d=s=>3*s,i=(s,a,t)=>((r(a,t)*s+u(a,t))*s+d(a))*s,p=(s,a,t)=>3*r(a,t)*s*s+2*u(a,t)*s+d(a),v=s=>{let a=s;for(let t=0;t<4;++t){const h=p(a,e,n);if(h===0)return a;a-=(i(a,e,n)-s)/h}return a};return s=>e===l&&n===c?s:i(v(s),l,c)}function X(e,l={}){const{delay:n=0,disabled:c=!1,duration:r=1e3,onFinished:u=B,onStarted:d=B,transition:i=j}=l,p=o.computed(()=>{const f=o.unref(i);return U(f)?f:Q(f)}),v=o.computed(()=>{const f=o.unref(e);return Y(f)?f:f.map(o.unref)}),s=o.computed(()=>Y(v.value)?[v.value]:v.value),a=o.ref(s.value.slice(0));let t,h,T,_,P;const{resume:x,pause:R}=J(()=>{const f=Date.now(),b=W(1-(T-f)/t,0,1);a.value=P.map((k,y)=>{var m;return k+((m=h[y])!=null?m:0)*p.value(b)}),b>=1&&(R(),u())},{immediate:!1}),E=()=>{R(),t=o.unref(r),h=a.value.map((f,b)=>{var k,y;return((k=s.value[b])!=null?k:0)-((y=a.value[b])!=null?y:0)}),P=a.value.slice(0),_=Date.now(),T=_+t,x(),d()},M=G(E,n,{immediate:!1});return o.watch(s,()=>{o.unref(c)?a.value=s.value.slice(0):o.unref(n)<=0?E():M.start()},{deep:!0}),o.computed(()=>{const f=o.unref(c)?s:a;return Y(v.value)?f.value[0]:f.value})}const Z=()=>{const e=o.ref({isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0});return{touchPosition:e,initTouchPosition:()=>{e.value={isTouch:!1,touchStart:0,touchDistance:0,touchX:0,touchY:0}},touchStart:u=>{e.value.isTouch=!0,e.value.touchStart=u.touches[0].pageY},touchMove:u=>{e.value.isTouch&&(e.value.touchY=u.touches[0].pageY,e.value.touchDistance=e.value.touchStart-e.value.touchY,e.value.touchDistance>0&&(e.value.touchDistance=0))},touchEnd:()=>{e.value.isTouch=!1}}};function D(){const e=o.ref({isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0});return{mousePosition:e,initMousePosition:()=>{e.value={isMouseDown:!1,downStart:0,mouseDistance:0,mouseX:0,mouseY:0}},mouseDown:u=>{e.value.isMouseDown=!0,e.value.downStart=u.pageY},mouseMove:u=>{e.value.isMouseDown&&(e.value.mouseY=u.pageY,e.value.mouseDistance=e.value.downStart-e.value.mouseY,e.value.mouseDistance>0&&(e.value.mouseDistance=0))},mouseUp:()=>{e.value.isMouseDown=!1}}}const S=e=>{if(e.indexOf("px")>0)return Number(e.slice(0,e.indexOf("px")));if(e.indexOf("vh")>0){const l=Number(e.slice(0,e.indexOf("vh")));return window.innerHeight*(l/100)}else if(e.indexOf("vw")>0){const l=Number(e.slice(0,e.indexOf("vw")));return window.innerWidth*(l/100)}else return 0};var oe="";o.install();var $=o.defineComponent({name:"swipeModal",model:{prop:"modelValue",event:"update:modelValue"},props:{modelValue:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},persistent:{type:Boolean,default:!1},backgroundColor:{type:String,default:"#80808080"},fullscreen:{type:Boolean,default:!1},noTip:{type:Boolean,default:!1},contentsWidth:{type:String,default:"100%"},contentsHeight:{type:String,default:"30vh"},borderTopRadius:{type:String,default:null},borderTopLeftRadius:{type:String,default:"0px"},borderTopRightRadius:{type:String,default:"0px"},contentsColor:{type:String,default:"white"},tipColor:{type:String,default:"#c8c8c8"},darkContentsColor:{type:String,default:"#1E1E1E"}},emits:["update:modelValue"],setup(e,l){const{mousePosition:n,initMousePosition:c,mouseDown:r,mouseMove:u,mouseUp:d}=D(),{touchPosition:i,initTouchPosition:p,touchStart:v,touchMove:s,touchEnd:a}=Z(),t=o.toRefs(e),h=o.computed({get:()=>t.modelValue.value,set:w=>l.emit("update:modelValue",w)}),T=o.ref(250),_=o.ref(null),P=K("--tip-color",_);P.value=t.tipColor.value;const x=o.ref([parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0]),R=X(x,{duration:250,transition:[.25,.8,.25,1]}),E=o.computed(()=>{const[w,C,ee,te]=R.value;return`rgba(${w}, ${C}, ${ee}, ${te})`}),M=o.ref(-1*S(t.contentsHeight.value)),f=X(M,{duration:T.value,transition:[.25,.8,.25,1]}),b=o.computed(()=>f.value+(Math.abs(i.value.touchDistance)>Math.abs(n.value.mouseDistance)?i.value.touchDistance:n.value.mouseDistance)),k=()=>{document.documentElement.style.overflowY="auto",h.value=!1},y=()=>{M.value=0,x.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),parseInt(t.backgroundColor.value.slice(7,9),16)/255]},m=()=>{M.value=-1*S(t.contentsHeight.value)-(Math.abs(i.value.touchDistance)>Math.abs(n.value.mouseDistance)?i.value.touchDistance:n.value.mouseDistance),x.value=[parseInt(t.backgroundColor.value.slice(1,3),16),parseInt(t.backgroundColor.value.slice(3,5),16),parseInt(t.backgroundColor.value.slice(5,7),16),0],setTimeout(()=>{c(),p(),k()},T.value)},z=()=>{a(),-1*i.value.touchDistance>S(t.contentsHeight.value)/8?m():i.value.touchDistance=0},L=()=>{d(),-1*n.value.mouseDistance>S(t.contentsHeight.value)/8?m():n.value.mouseDistance=0};return o.watch(h,(w,C)=>{h.value&&y()}),()=>{var w,C;return o.h("div",{class:"swipe-modal-takumaru-vue-swipe-modal",on:{mousemove:u,mouseup:L},onMousemove:u,onMouseup:L},[t.modelValue.value?o.h("div",{class:"modal-background",style:{backgroundColor:E.value},on:{onMouseup:()=>t.persistent.value?()=>null:m(),click:()=>t.persistent.value?()=>null:m()},onMouseup:()=>{t.persistent.value||m()},onClick:()=>{t.persistent.value||m()}}):null,t.modelValue.value?o.h("div",{class:"modal-contents",style:{width:t.contentsWidth.value,minHeight:t.contentsHeight.value,borderTopLeftRadius:t.borderTopRadius.value?t.borderTopRadius.value:t.borderTopLeftRadius.value,borderTopRightRadius:t.borderTopRadius?t.borderTopRadius.value:t.borderTopRightRadius.value,backgroundColor:t.dark.value?t.darkContentsColor.value:t.contentsColor.value,color:t.dark.value?"white":"black",bottom:`${b.value}px`},on:{touchstart:v,touchmove:s,touchend:z},onTouchstart:v,onTouchmove:s,onTouchend:z},[t.noTip.value?null:o.h("div",{class:"modal-contents-chip-wrapper",on:{mousedown:r},onMousedown:r},o.h("div",{class:"modal-contents-chip"})),(C=(w=l.slots).default)==null?void 0:C.call(w)]):null])}}});g.default=$,g.swipeModal=$,Object.defineProperties(g,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package.json

 {
   "name": "@takuma-ru/vue-swipe-modal",
-  "version": "4.0.0-alpha.9",
+  "version": "4.0.0-alpha.10",
   "private": false,
@@ -5,0 +5,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

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

Improved metrics

Total package byte prevSize

42681

increased by5.02%

Lines of code

619

increased by4.92%

No dependency changes