mosha-vue-toastify - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

dist/components/createToast.d.ts

@@ -1,2 +0,2 @@
-import { ToastOptions, ToastContent } from '../types';
+import { Position, ToastOptions, ToastContent } from '../types';
 export declare const initializeOptions: (options: ToastOptions) => ToastOptions;
@@ -7,2 +7,28 @@ export declare const initializeContent: (content: ToastContent) => {
 };
+export declare const moveToastsOnAdd: (options: ToastOptions) => number;
+export declare const setupVNodeProps: (options: ToastOptions, content: {
+    text: string;
+    description: string | undefined;
+}, id: number, offset: number) => {
+    id: number;
+    offset: number;
+    visible: boolean;
+    onCloseHandler: () => void;
+    text: string;
+    description: string | undefined;
+    type?: import("../types").ToastType | undefined;
+    timeout?: number | undefined;
+    showCloseButton?: boolean | undefined;
+    position?: Position | undefined;
+    showIcon?: boolean | undefined;
+    transition?: import("../types").TransitionType | undefined;
+    hideProgressBar?: boolean | undefined;
+    toastBackgroundColor?: string | undefined;
+    swipeClose?: boolean | undefined;
+    onClose?: (() => void) | undefined;
+};
+export declare const setupVNode: (options: ToastOptions, content: {
+    text: string;
+    description: string | undefined;
+}) => void;
 export declare const createToast: (content: ToastContent, options?: ToastOptions | undefined) => void;

dist/config.d.ts

 import { ToastOptions } from './types';
-export declare const SWIPE_ACTIVE_DIFF: number;
-export declare const TOAST_GAP: number;
+export declare const SWIPE_ACTIVE_DIFF = 200;
+export declare const TOAST_GAP = 12;
 export declare const DEFAULT_OPTIONS: ToastOptions;

dist/hooks/useCustomStyle.d.ts

@@ -1,46 +0,6 @@
-declare const useCustomStyle: (position: any, offset: any, bgColor: string | undefined) => {
-    customStyle: import("vue").ComputedRef<{
-        left: string;
-        top: string;
-        bottom?: undefined;
-        right?: undefined;
-        marginRight?: undefined;
-        marginLeft?: undefined;
-    } | {
-        left: string;
-        bottom: string;
-        top?: undefined;
-        right?: undefined;
-        marginRight?: undefined;
-        marginLeft?: undefined;
-    } | {
-        right: string;
-        bottom: string;
-        left?: undefined;
-        top?: undefined;
-        marginRight?: undefined;
-        marginLeft?: undefined;
-    } | {
-        top: string;
-        left: string;
-        right: string;
-        marginRight: string;
-        marginLeft: string;
-        bottom?: undefined;
-    } | {
-        bottom: string;
-        left: string;
-        right: string;
-        marginRight: string;
-        marginLeft: string;
-        top?: undefined;
-    } | {
-        right: string;
-        top: string;
-        left?: undefined;
-        bottom?: undefined;
-        marginRight?: undefined;
-        marginLeft?: undefined;
-    }>;
+import { ComputedRef, CSSProperties } from 'vue';
+import { Position } from '../types';
+declare const useCustomStyle: (position: Position, offset: string, bgColor: string) => {
+    customStyle: ComputedRef<CSSProperties>;
 };
 export default useCustomStyle;

dist/hooks/useSwipe.d.ts

@@ -1,7 +0,7 @@
-import { CSSProperties } from 'vue';
+import { CSSProperties, Ref } from 'vue';
 import { Position } from '../types';
 declare const useSwipe: (position: Position, onCloseHandler: () => void, swipeClose: boolean) => {
-    swipedDiff: import("vue").Ref<number | undefined>;
-    swipeStart: import("vue").Ref<MouseEvent | TouchEvent | undefined>;
-    swipeStyle: import("vue").Ref<CSSProperties | undefined>;
+    swipedDiff: Ref<number | undefined>;
+    swipeStart: Ref<MouseEvent | TouchEvent | undefined>;
+    swipeStyle: Ref<CSSProperties | undefined>;
     swipeHandler: (event: MouseEvent | TouchEvent) => void;
@@ -8,0 +8,0 @@ startSwipeHandler: (event: MouseEvent | TouchEvent) => void;

dist/hooks/useTimer.d.ts

@@ -1,7 +0,8 @@
-declare const useTimer: (callback: Function | string, delay: number) => {
+import { Ref } from 'vue';
+declare const useTimer: (callback: () => void | string, delay: number) => {
     start: () => void;
     stop: () => void;
     clear: () => void;
-    progress: import("vue").Ref<number>;
+    progress: Ref<number>;
 };
 export default useTimer;

dist/hooks/useTransitionType.d.ts

 import { Position, TransitionType } from '../types';
-import { Ref } from 'vue';
+import { ComputedRef, Ref } from 'vue';
 declare const useTransitionType: (position: Position, transition: TransitionType, swiped: Ref<number>) => {
-    transitionType: import("vue").ComputedRef<string>;
+    transitionType: ComputedRef<string>;
 };
 export default useTransitionType;

dist/main.d.ts

@@ -5,4 +5,4 @@ import { App } from '@vue/runtime-core';
 declare const _default: {
-    install: (app: App, options: any) => void;
+    install: (app: App) => void;
 };
 export default _default;

dist/mosha-vue-toastify.es.js

@@ -1,1 +0,1 @@
-var e=Object.defineProperty,t=Object.prototype.hasOwnProperty,o=Object.getOwnPropertySymbols,n=Object.prototype.propertyIsEnumerable,s=(t,o,n)=>o in t?e(t,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[o]=n,i=(e,i)=>{for(var a in i||(i={}))t.call(i,a)&&s(e,a,i[a]);if(o)for(var a of o(i))n.call(i,a)&&s(e,a,i[a]);return e};import{ref as a,onMounted as l,onUnmounted as r,computed as u,defineComponent as p,openBlock as c,createBlock as h,createVNode as v,watchEffect as m,resolveComponent as d,Transition as f,withCtx as g,createCommentVNode as _,toDisplayString as w,render as y}from"vue";const b={type:"default",timeout:5e3,showCloseButton:!0,position:"top-right",transition:"bounce",hideProgressBar:!1,swipeClose:!0},x={"top-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"},"top-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"top-center":{bounce:"mosha__bounceInDown",zoom:"mosha__zoomIn",slide:"mosha__slideInDown"},"bottom-center":{bounce:"mosha__bounceInUp",zoom:"mosha__zoomIn",slide:"mosha__slideInUp"},"bottom-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"bottom-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"}},I=(e,t,o)=>{const n=a(),s=a(void 0),l=a(),u=e=>e instanceof MouseEvent,p=a=>{!1!==o&&n.value&&(u(a)?s.value=n.value.clientX-a.clientX:s.value=n.value.touches[0].clientX-a.touches[0].clientX,l.value=i(i({},l.value),{transition:"none"}),e.endsWith("left")?l.value.left=-s.value+"px !important":e.endsWith("right")?l.value.right=`${s.value}px !important`:s.value>0?l.value.left=-s.value+"px !important":l.value.right=`${s.value}px !important`,Math.abs(s.value)>200&&t())},c=e=>{!1!==o&&(n.value&&(n.value=void 0),s.value&&(s.value=void 0),removeEventListener(e,p))};return r((()=>{!1!==o&&(c("mousemove"),c("touchmove"))})),{swipedDiff:s,swipeStart:n,swipeStyle:l,swipeHandler:p,startSwipeHandler:t=>{if(!1===o)return;n.value=t;const a=u(t)?"mousemove":"touchmove",r=u(t)?"mouseup":"touchend";addEventListener(a,p),addEventListener(r,(()=>(t=>{const o={transition:"left .3s ease-out",left:0},a={transition:"right .3s ease-out",right:0};e.endsWith("left")?l.value=i(i({},l.value),o):e.endsWith("right")?l.value=i(i({},l.value),a):s.value>0?l.value=i(i({},l.value),o):s.value&&s.value<0&&(l.value=i(i({},l.value),a)),n.value=void 0,s.value=void 0,removeEventListener(t,p)})(a)))},cleanUpMove:c}};var z=p({props:{type:{type:String,default:"default"}}});const C={class:"mosha__icon"},M={key:0,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},B=v("path",{d:"M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),S={key:1,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},T=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 11c-.55 0-1-.45-1-1V8c0-.55.45-1 1-1s1 .45 1 1v4c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),L={key:2,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},k=v("path",{d:"M0 0h24v24H0V0z",fill:"none"},null,-1),H=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM9.29 16.29L5.7 12.7c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0L10 14.17l6.88-6.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-7.59 7.59c-.38.39-1.02.39-1.41 0z"},null,-1),P={key:3,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#616161"},$=v("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),D=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1),V={key:4,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},E=v("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),N=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1);z.render=function(e,t,o,n,s,i){return c(),h("span",C,["warning"===e.type?(c(),h("svg",M,[B])):"danger"===e.type?(c(),h("svg",S,[T])):"success"===e.type?(c(),h("svg",L,[k,H])):"default"===e.type?(c(),h("svg",P,[$,D])):(c(),h("svg",V,[E,N]))])};var O=p({name:"MToast",components:{MIcon:z},props:{visible:Boolean,text:String,description:String,toastBackgroundColor:String,type:{type:String,default:"default"},onCloseHandler:{type:Function,required:!0},offset:Number,id:{type:Number,required:!0},timeout:{type:Number,default:5e3},position:{type:String,required:!0},showCloseButton:{type:Boolean,default:!0},swipeClose:{type:Boolean,default:!0},hideProgressBar:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!1},transition:{type:String,default:"bounce"}},setup(e){const t=a(),{swipedDiff:o,startSwipeHandler:n,swipeStyle:s,cleanUpMove:i}=I(e.position,e.onCloseHandler,e.swipeClose),{transitionType:p}=(c=e.position,h=e.transition,v=o,{transitionType:u((()=>v.value>200?"mosha__fadeOutLeft":v.value<-200?"mosha__fadeOutRight":x[c][h]))});var c,h,v;const{start:d,stop:f,progress:g}=((e,t)=>{const o=a(),n=a(0),s=a(t),i=a(),u=a(100),p=()=>{clearInterval(i.value),clearTimeout(o.value)};return l((()=>{})),r((()=>{p()})),{start:()=>{n.value=Date.now(),clearTimeout(o.value),i.value=setInterval((()=>{u.value--}),t/100-2),o.value=setTimeout(e,s.value)},stop:()=>{clearInterval(i.value),clearTimeout(o.value),s.value-=Date.now()-n.value},clear:p,progress:u}})((()=>{e.onCloseHandler()}),e.timeout),_=()=>{e.timeout>0&&d()};return m((()=>{const{customStyle:o}=((e,t,o)=>{const n=u((()=>{switch(e){case"top-left":return{left:"0",top:`${t}px`};case"bottom-left":return{left:"0",bottom:`${t}px`};case"bottom-right":return{right:"0",bottom:`${t}px`};case"top-center":return{top:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};case"bottom-center":return{bottom:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};default:return{right:"0",top:`${t}px`}}}));return o&&(n.value.backgroundColor=o),{customStyle:n}})(e.position,e.offset,e.toastBackgroundColor);t.value=o.value})),l((()=>{_()})),{style:t,transitionType:p,startTimer:_,stopTimer:()=>{e.timeout>0&&f()},progress:g,onTouchStart:e=>{n(e)},onMouseLeave:()=>{i("mousemove"),_()},onMouseDown:e=>{n(e)},swipeStyle:s}}});const R={class:"mosha__toast__content-wrapper"},j={class:"mosha__toast__content"},U={class:"mosha__toast__content__text"},W={key:0,class:"mosha__toast__content__description"};O.render=function(e,t,o,n,s,i){const a=d("MIcon");return c(),h(f,{name:e.transitionType,type:"animation"},{default:g((()=>[e.visible?(c(),h("div",{key:0,class:["mosha__toast",e.toastBackgroundColor?null:e.type],style:[e.style,e.swipeStyle],onMouseenter:t[2]||(t[2]=(...t)=>e.stopTimer&&e.stopTimer(...t)),onMouseleave:t[3]||(t[3]=(...t)=>e.onMouseLeave&&e.onMouseLeave(...t)),onTouchstart:t[4]||(t[4]=(...t)=>e.onTouchStart&&e.onTouchStart(...t)),onMousedown:t[5]||(t[5]=(...t)=>e.onMouseDown&&e.onMouseDown(...t))},[v("div",R,[e.showIcon?(c(),h(a,{key:0,type:e.type},null,8,["type"])):_("",!0),v("div",j,[v("div",U,w(e.text),1),e.description?(c(),h("div",W,w(e.description),1)):_("",!0)])]),e.showCloseButton?(c(),h("div",{key:0,class:"mosha__toast__close-icon",onClick:t[1]||(t[1]=(...t)=>e.onCloseHandler&&e.onCloseHandler(...t))})):_("",!0),e.hideProgressBar?_("",!0):(c(),h("div",{key:1,class:"mosha__toast__progress",style:{width:`${e.progress}%`}},null,4))],38)):_("",!0)])),_:1},8,["name"])};const X={"top-left":[],"top-right":[],"bottom-left":[],"bottom-right":[],"top-center":[],"bottom-center":[]};let q=0;const F=e=>{const t=i(i({},e),{type:e.type||b.type,timeout:e.timeout||b.timeout,showCloseButton:e.showCloseButton,position:e.position||b.position,showIcon:e.showIcon,swipeClose:e.swipeClose,transition:e.transition||b.transition});return t.hideProgressBar=void 0!==t.timeout&&t.timeout<=0,void 0!==e.hideProgressBar&&(t.hideProgressBar=e.hideProgressBar),t},A=e=>({text:"string"==typeof e?e:e.title,description:"string"==typeof e?void 0:e.description}),G=(e,t)=>{if(!e)return;const o=t?F(t):b,n=q++;let s=12;if(!o.position)return;X[o.position].forEach((({toastVNode:e})=>{const t=e.el.offsetHeight+12;s+=t||0}));const a=document.createElement("div");document.body.appendChild(a);let l=null;l=v(O,i(i(i({},o),A(e)),{id:n,offset:s,visible:!1,onCloseHandler:()=>{J(n,o.position?o.position:"top-right")}})),y(l,a),o.position&&(X[o.position].push({toastVNode:l,container:a}),l.component&&(l.component.props.visible=!0))},J=(e,t)=>{const o=X[t],n=o.findIndex((({toastVNode:t})=>e===t.props.id));if(-1===n)return;const{container:s,toastVNode:i}=o[n],a=i.el.offsetHeight;X[t].splice(n,1),i.component.props.visible=!1,i.component.props.onClose&&i.component.props.onClose();for(let l=n;l<o.length;l++){const{toastVNode:e}=o[l];if(!e.el)return;const n=t.split("-")[0]||"top",s=parseInt(e.el.style[n],10)-a-12;if(!e.component)return;e.component.props.offset=s}setTimeout((()=>{y(null,s),document.body.removeChild(s)}),1e3)};var K={install:(e,t)=>{e.config.globalProperties.$moshaToast=G,e.provide("moshaToast",G)}};export default K;export{G as createToast,A as initializeContent,F as initializeOptions};
+var e=Object.defineProperty,t=Object.prototype.hasOwnProperty,o=Object.getOwnPropertySymbols,n=Object.prototype.propertyIsEnumerable,s=(t,o,n)=>o in t?e(t,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[o]=n,i=(e,i)=>{for(var a in i||(i={}))t.call(i,a)&&s(e,a,i[a]);if(o)for(var a of o(i))n.call(i,a)&&s(e,a,i[a]);return e};import{ref as a,onMounted as l,onUnmounted as r,computed as u,defineComponent as p,openBlock as c,createBlock as h,createVNode as v,watchEffect as m,resolveComponent as d,Transition as f,withCtx as g,createCommentVNode as _,toDisplayString as w,render as y}from"vue";const b={type:"default",timeout:5e3,showCloseButton:!0,position:"top-right",transition:"bounce",hideProgressBar:!1,swipeClose:!0},x={"top-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"},"top-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"top-center":{bounce:"mosha__bounceInDown",zoom:"mosha__zoomIn",slide:"mosha__slideInDown"},"bottom-center":{bounce:"mosha__bounceInUp",zoom:"mosha__zoomIn",slide:"mosha__slideInUp"},"bottom-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"bottom-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"}},I=(e,t,o)=>{const n=a(),s=a(void 0),l=a(),u=e=>e instanceof MouseEvent,p=a=>{!1!==o&&n.value&&(u(a)?s.value=n.value.clientX-a.clientX:s.value=n.value.touches[0].clientX-a.touches[0].clientX,l.value=i(i({},l.value),{transition:"none"}),e.endsWith("left")?l.value.left=-s.value+"px !important":e.endsWith("right")?l.value.right=`${s.value}px !important`:s.value>0?l.value.left=-s.value+"px !important":l.value.right=`${s.value}px !important`,Math.abs(s.value)>200&&t())},c=e=>{!1!==o&&(n.value&&(n.value=void 0),s.value&&(s.value=void 0),removeEventListener(e,p))};return r((()=>{!1!==o&&(c("mousemove"),c("touchmove"))})),{swipedDiff:s,swipeStart:n,swipeStyle:l,swipeHandler:p,startSwipeHandler:t=>{if(!1===o)return;n.value=t;const a=u(t)?"mousemove":"touchmove",r=u(t)?"mouseup":"touchend";addEventListener(a,p),addEventListener(r,(()=>(t=>{const o={transition:"left .3s ease-out",left:0},a={transition:"right .3s ease-out",right:0};e.endsWith("left")?l.value=i(i({},l.value),o):e.endsWith("right")?l.value=i(i({},l.value),a):s.value>0?l.value=i(i({},l.value),o):s.value&&s.value<0&&(l.value=i(i({},l.value),a)),n.value=void 0,s.value=void 0,removeEventListener(t,p)})(a)))},cleanUpMove:c}};var z=p({props:{type:{type:String,default:"default"}}});const C={class:"mosha__icon"},M={key:0,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},B=v("path",{d:"M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),S={key:1,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},T=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 11c-.55 0-1-.45-1-1V8c0-.55.45-1 1-1s1 .45 1 1v4c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),L={key:2,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},k=v("path",{d:"M0 0h24v24H0V0z",fill:"none"},null,-1),H=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM9.29 16.29L5.7 12.7c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0L10 14.17l6.88-6.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-7.59 7.59c-.38.39-1.02.39-1.41 0z"},null,-1),P={key:3,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#616161"},$=v("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),D=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1),E={key:4,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},V=v("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),N=v("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1);z.render=function(e,t,o,n,s,i){return c(),h("span",C,["warning"===e.type?(c(),h("svg",M,[B])):"danger"===e.type?(c(),h("svg",S,[T])):"success"===e.type?(c(),h("svg",L,[k,H])):"default"===e.type?(c(),h("svg",P,[$,D])):(c(),h("svg",E,[V,N]))])};var O=p({name:"MToast",components:{MIcon:z},props:{visible:Boolean,text:{type:String,default:""},description:{type:String,default:""},toastBackgroundColor:{type:String,default:""},type:{type:String,default:"default"},onCloseHandler:{type:Function,required:!0},offset:Number,id:{type:Number,required:!0},timeout:{type:Number,default:5e3},position:{type:String,required:!0},showCloseButton:{type:Boolean,default:!0},swipeClose:{type:Boolean,default:!0},hideProgressBar:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!1},transition:{type:String,default:"bounce"}},setup(e){const t=a(),{swipedDiff:o,startSwipeHandler:n,swipeStyle:s,cleanUpMove:i}=I(e.position,e.onCloseHandler,e.swipeClose),{transitionType:p}=(c=e.position,h=e.transition,v=o,{transitionType:u((()=>v.value>200?"mosha__fadeOutLeft":v.value<-200?"mosha__fadeOutRight":x[c][h]))});var c,h,v;const{start:d,stop:f,progress:g}=((e,t)=>{const o=a(),n=a(0),s=a(t),i=a(),u=a(100),p=()=>{clearInterval(i.value),clearTimeout(o.value)};return l((()=>{})),r((()=>{p()})),{start:()=>{n.value=Date.now(),clearTimeout(o.value),i.value=setInterval((()=>{u.value--}),t/100-2),o.value=setTimeout(e,s.value)},stop:()=>{clearInterval(i.value),clearTimeout(o.value),s.value-=Date.now()-n.value},clear:p,progress:u}})((()=>{e.onCloseHandler()}),e.timeout),_=()=>{e.timeout>0&&d()};return m((()=>{const{customStyle:o}=((e,t,o)=>{const n=u((()=>{switch(e){case"top-left":return{left:"0",top:`${t}px`};case"bottom-left":return{left:"0",bottom:`${t}px`};case"bottom-right":return{right:"0",bottom:`${t}px`};case"top-center":return{top:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};case"bottom-center":return{bottom:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};default:return{right:"0",top:`${t}px`}}}));return o.length>0&&(n.value.backgroundColor=o),{customStyle:n}})(e.position,e.offset,e.toastBackgroundColor);t.value=o.value})),l((()=>{_()})),{style:t,transitionType:p,startTimer:_,stopTimer:()=>{e.timeout>0&&f()},progress:g,onTouchStart:e=>{n(e)},onMouseLeave:()=>{i("mousemove"),_()},onMouseDown:e=>{n(e)},swipeStyle:s}}});const R={class:"mosha__toast__content-wrapper"},j={class:"mosha__toast__content"},U={class:"mosha__toast__content__text"},W={key:0,class:"mosha__toast__content__description"};O.render=function(e,t,o,n,s,i){const a=d("MIcon");return c(),h(f,{name:e.transitionType,type:"animation"},{default:g((()=>[e.visible?(c(),h("div",{key:0,class:["mosha__toast",e.toastBackgroundColor?null:e.type],style:[e.style,e.swipeStyle],onMouseenter:t[2]||(t[2]=(...t)=>e.stopTimer&&e.stopTimer(...t)),onMouseleave:t[3]||(t[3]=(...t)=>e.onMouseLeave&&e.onMouseLeave(...t)),onTouchstart:t[4]||(t[4]=(...t)=>e.onTouchStart&&e.onTouchStart(...t)),onMousedown:t[5]||(t[5]=(...t)=>e.onMouseDown&&e.onMouseDown(...t))},[v("div",R,[e.showIcon?(c(),h(a,{key:0,type:e.type},null,8,["type"])):_("",!0),v("div",j,[v("div",U,w(e.text),1),e.description.length>0?(c(),h("div",W,w(e.description),1)):_("",!0)])]),e.showCloseButton?(c(),h("div",{key:0,class:"mosha__toast__close-icon",onClick:t[1]||(t[1]=(...t)=>e.onCloseHandler&&e.onCloseHandler(...t))})):_("",!0),e.hideProgressBar?_("",!0):(c(),h("div",{key:1,class:"mosha__toast__progress",style:{width:`${e.progress}%`}},null,4))],38)):_("",!0)])),_:1},8,["name"])};const X={"top-left":[],"top-right":[],"bottom-left":[],"bottom-right":[],"top-center":[],"bottom-center":[]};let q=0;const F=e=>{const t=i(i({},e),{type:e.type||b.type,timeout:e.timeout||b.timeout,showCloseButton:e.showCloseButton,position:e.position||b.position,showIcon:e.showIcon,swipeClose:e.swipeClose,transition:e.transition||b.transition});return t.hideProgressBar=void 0!==t.timeout&&t.timeout<=0,void 0!==e.hideProgressBar&&(t.hideProgressBar=e.hideProgressBar),t},A=e=>({text:"string"==typeof e?e:e.title,description:"string"==typeof e?void 0:e.description}),G=e=>{let t=12;if(!e.position)throw new Error("no position");return X[e.position].forEach((({toastVNode:e})=>{const o=e.el.offsetHeight+12;t+=o||0})),t},J=(e,t,o,n)=>i(i(i({},e),t),{id:o,offset:n,visible:!1,onCloseHandler:()=>{Y(o,e.position?e.position:"top-right")}}),K=(e,t)=>{const o=G(e),n=q++,s=document.createElement("div");document.body.appendChild(s);const i=v(O,J(e,t,n,o));y(i,s),e.position&&(X[e.position].push({toastVNode:i,container:s}),i.component&&(i.component.props.visible=!0))},Q=(e,t)=>{if(!e)return;const o=A(e),n=t?F(t):b;K(n,o)},Y=(e,t)=>{const o=X[t],n=o.findIndex((({toastVNode:t})=>t.props&&e===t.props.id));if(-1===n)return;const{container:s,toastVNode:i}=o[n];if(!i.el)return;const a=i.el.offsetHeight;X[t].splice(n,1),((e,t,o,n)=>{for(let s=e;s<t.length;s++){const{toastVNode:e}=t[s];if(!e.el)return;const i=o.split("-")[0]||"top",a=parseInt(e.el.style[i],10)-n-12;if(!e.component)return;e.component.props.offset=a}})(n,o,t,a),i.component&&(i.component.props.visible=!1,i.component.props.onClose&&i.component.props.onClose(),setTimeout((()=>{y(null,s),document.body.removeChild(s)}),1e3))};var Z={install:e=>{e.config.globalProperties.$moshaToast=Q,e.provide("moshaToast",Q)}};export default Z;export{Q as createToast,A as initializeContent,F as initializeOptions,G as moveToastsOnAdd,K as setupVNode,J as setupVNodeProps};

dist/mosha-vue-toastify.umd.js

@@ -1,1 +0,1 @@
-var __defProp=Object.defineProperty,__hasOwnProp=Object.prototype.hasOwnProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(e,o,t)=>o in e?__defProp(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,__assign=(e,o)=>{for(var t in o||(o={}))__hasOwnProp.call(o,t)&&__defNormalProp(e,t,o[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(o))__propIsEnum.call(o,t)&&__defNormalProp(e,t,o[t]);return e};!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self)["mosha-vue-toastify"]={},e.Vue)}(this,(function(e,o){"use strict";const t={type:"default",timeout:5e3,showCloseButton:!0,position:"top-right",transition:"bounce",hideProgressBar:!1,swipeClose:!0},n={"top-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"},"top-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"top-center":{bounce:"mosha__bounceInDown",zoom:"mosha__zoomIn",slide:"mosha__slideInDown"},"bottom-center":{bounce:"mosha__bounceInUp",zoom:"mosha__zoomIn",slide:"mosha__slideInUp"},"bottom-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"bottom-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"}},s=(e,t,n)=>{const s=o.ref(),a=o.ref(void 0),i=o.ref(),r=e=>e instanceof MouseEvent,l=o=>{!1!==n&&s.value&&(r(o)?a.value=s.value.clientX-o.clientX:a.value=s.value.touches[0].clientX-o.touches[0].clientX,i.value=__assign(__assign({},i.value),{transition:"none"}),e.endsWith("left")?i.value.left=-a.value+"px !important":e.endsWith("right")?i.value.right=`${a.value}px !important`:a.value>0?i.value.left=-a.value+"px !important":i.value.right=`${a.value}px !important`,Math.abs(a.value)>200&&t())},p=e=>{!1!==n&&(s.value&&(s.value=void 0),a.value&&(a.value=void 0),removeEventListener(e,l))};return o.onUnmounted((()=>{!1!==n&&(p("mousemove"),p("touchmove"))})),{swipedDiff:a,swipeStart:s,swipeStyle:i,swipeHandler:l,startSwipeHandler:o=>{if(!1===n)return;s.value=o;const t=r(o)?"mousemove":"touchmove",p=r(o)?"mouseup":"touchend";addEventListener(t,l),addEventListener(p,(()=>(o=>{const t={transition:"left .3s ease-out",left:0},n={transition:"right .3s ease-out",right:0};e.endsWith("left")?i.value=__assign(__assign({},i.value),t):e.endsWith("right")?i.value=__assign(__assign({},i.value),n):a.value>0?i.value=__assign(__assign({},i.value),t):a.value&&a.value<0&&(i.value=__assign(__assign({},i.value),n)),s.value=void 0,a.value=void 0,removeEventListener(o,l)})(t)))},cleanUpMove:p}};var a=o.defineComponent({props:{type:{type:String,default:"default"}}});const i={class:"mosha__icon"},r={key:0,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},l=o.createVNode("path",{d:"M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),p={key:1,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},u=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 11c-.55 0-1-.45-1-1V8c0-.55.45-1 1-1s1 .45 1 1v4c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),c={key:2,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},d=o.createVNode("path",{d:"M0 0h24v24H0V0z",fill:"none"},null,-1),m=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM9.29 16.29L5.7 12.7c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0L10 14.17l6.88-6.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-7.59 7.59c-.38.39-1.02.39-1.41 0z"},null,-1),h={key:3,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#616161"},f=o.createVNode("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),v=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1),_={key:4,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},g=o.createVNode("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),w=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1);a.render=function(e,t,n,s,a,y){return o.openBlock(),o.createBlock("span",i,["warning"===e.type?(o.openBlock(),o.createBlock("svg",r,[l])):"danger"===e.type?(o.openBlock(),o.createBlock("svg",p,[u])):"success"===e.type?(o.openBlock(),o.createBlock("svg",c,[d,m])):"default"===e.type?(o.openBlock(),o.createBlock("svg",h,[f,v])):(o.openBlock(),o.createBlock("svg",_,[g,w]))])};var y=o.defineComponent({name:"MToast",components:{MIcon:a},props:{visible:Boolean,text:String,description:String,toastBackgroundColor:String,type:{type:String,default:"default"},onCloseHandler:{type:Function,required:!0},offset:Number,id:{type:Number,required:!0},timeout:{type:Number,default:5e3},position:{type:String,required:!0},showCloseButton:{type:Boolean,default:!0},swipeClose:{type:Boolean,default:!0},hideProgressBar:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!1},transition:{type:String,default:"bounce"}},setup(e){const t=o.ref(),{swipedDiff:a,startSwipeHandler:i,swipeStyle:r,cleanUpMove:l}=s(e.position,e.onCloseHandler,e.swipeClose),{transitionType:p}=(u=e.position,c=e.transition,d=a,{transitionType:o.computed((()=>d.value>200?"mosha__fadeOutLeft":d.value<-200?"mosha__fadeOutRight":n[u][c]))});var u,c,d;const{start:m,stop:h,progress:f}=((e,t)=>{const n=o.ref(),s=o.ref(0),a=o.ref(t),i=o.ref(),r=o.ref(100),l=()=>{clearInterval(i.value),clearTimeout(n.value)};return o.onMounted((()=>{})),o.onUnmounted((()=>{l()})),{start:()=>{s.value=Date.now(),clearTimeout(n.value),i.value=setInterval((()=>{r.value--}),t/100-2),n.value=setTimeout(e,a.value)},stop:()=>{clearInterval(i.value),clearTimeout(n.value),a.value-=Date.now()-s.value},clear:l,progress:r}})((()=>{e.onCloseHandler()}),e.timeout),v=()=>{e.timeout>0&&m()};return o.watchEffect((()=>{const{customStyle:n}=((e,t,n)=>{const s=o.computed((()=>{switch(e){case"top-left":return{left:"0",top:`${t}px`};case"bottom-left":return{left:"0",bottom:`${t}px`};case"bottom-right":return{right:"0",bottom:`${t}px`};case"top-center":return{top:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};case"bottom-center":return{bottom:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};default:return{right:"0",top:`${t}px`}}}));return n&&(s.value.backgroundColor=n),{customStyle:s}})(e.position,e.offset,e.toastBackgroundColor);t.value=n.value})),o.onMounted((()=>{v()})),{style:t,transitionType:p,startTimer:v,stopTimer:()=>{e.timeout>0&&h()},progress:f,onTouchStart:e=>{i(e)},onMouseLeave:()=>{l("mousemove"),v()},onMouseDown:e=>{i(e)},swipeStyle:r}}});const b={class:"mosha__toast__content-wrapper"},B={class:"mosha__toast__content"},k={class:"mosha__toast__content__text"},x={key:0,class:"mosha__toast__content__description"};y.render=function(e,t,n,s,a,i){const r=o.resolveComponent("MIcon");return o.openBlock(),o.createBlock(o.Transition,{name:e.transitionType,type:"animation"},{default:o.withCtx((()=>[e.visible?(o.openBlock(),o.createBlock("div",{key:0,class:["mosha__toast",e.toastBackgroundColor?null:e.type],style:[e.style,e.swipeStyle],onMouseenter:t[2]||(t[2]=(...o)=>e.stopTimer&&e.stopTimer(...o)),onMouseleave:t[3]||(t[3]=(...o)=>e.onMouseLeave&&e.onMouseLeave(...o)),onTouchstart:t[4]||(t[4]=(...o)=>e.onTouchStart&&e.onTouchStart(...o)),onMousedown:t[5]||(t[5]=(...o)=>e.onMouseDown&&e.onMouseDown(...o))},[o.createVNode("div",b,[e.showIcon?(o.openBlock(),o.createBlock(r,{key:0,type:e.type},null,8,["type"])):o.createCommentVNode("",!0),o.createVNode("div",B,[o.createVNode("div",k,o.toDisplayString(e.text),1),e.description?(o.openBlock(),o.createBlock("div",x,o.toDisplayString(e.description),1)):o.createCommentVNode("",!0)])]),e.showCloseButton?(o.openBlock(),o.createBlock("div",{key:0,class:"mosha__toast__close-icon",onClick:t[1]||(t[1]=(...o)=>e.onCloseHandler&&e.onCloseHandler(...o))})):o.createCommentVNode("",!0),e.hideProgressBar?o.createCommentVNode("",!0):(o.openBlock(),o.createBlock("div",{key:1,class:"mosha__toast__progress",style:{width:`${e.progress}%`}},null,4))],38)):o.createCommentVNode("",!0)])),_:1},8,["name"])};const C={"top-left":[],"top-right":[],"bottom-left":[],"bottom-right":[],"top-center":[],"bottom-center":[]};let I=0;const z=e=>{const o=__assign(__assign({},e),{type:e.type||t.type,timeout:e.timeout||t.timeout,showCloseButton:e.showCloseButton,position:e.position||t.position,showIcon:e.showIcon,swipeClose:e.swipeClose,transition:e.transition||t.transition});return o.hideProgressBar=void 0!==o.timeout&&o.timeout<=0,void 0!==e.hideProgressBar&&(o.hideProgressBar=e.hideProgressBar),o},S=e=>({text:"string"==typeof e?e:e.title,description:"string"==typeof e?void 0:e.description}),M=(e,n)=>{if(!e)return;const s=n?z(n):t,a=I++;let i=12;if(!s.position)return;C[s.position].forEach((({toastVNode:e})=>{const o=e.el.offsetHeight+12;i+=o||0}));const r=document.createElement("div");document.body.appendChild(r);let l=null;l=o.createVNode(y,__assign(__assign(__assign({},s),S(e)),{id:a,offset:i,visible:!1,onCloseHandler:()=>{N(a,s.position?s.position:"top-right")}})),o.render(l,r),s.position&&(C[s.position].push({toastVNode:l,container:r}),l.component&&(l.component.props.visible=!0))},N=(e,t)=>{const n=C[t],s=n.findIndex((({toastVNode:o})=>e===o.props.id));if(-1===s)return;const{container:a,toastVNode:i}=n[s],r=i.el.offsetHeight;C[t].splice(s,1),i.component.props.visible=!1,i.component.props.onClose&&i.component.props.onClose();for(let o=s;o<n.length;o++){const{toastVNode:e}=n[o];if(!e.el)return;const s=t.split("-")[0]||"top",a=parseInt(e.el.style[s],10)-r-12;if(!e.component)return;e.component.props.offset=a}setTimeout((()=>{o.render(null,a),document.body.removeChild(a)}),1e3)};var V={install:(e,o)=>{e.config.globalProperties.$moshaToast=M,e.provide("moshaToast",M)}};e.createToast=M,e.default=V,e.initializeContent=S,e.initializeOptions=z,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"}));
+var __defProp=Object.defineProperty,__hasOwnProp=Object.prototype.hasOwnProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(e,o,t)=>o in e?__defProp(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,__assign=(e,o)=>{for(var t in o||(o={}))__hasOwnProp.call(o,t)&&__defNormalProp(e,t,o[t]);if(__getOwnPropSymbols)for(var t of __getOwnPropSymbols(o))__propIsEnum.call(o,t)&&__defNormalProp(e,t,o[t]);return e};!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self)["mosha-vue-toastify"]={},e.Vue)}(this,(function(e,o){"use strict";const t={type:"default",timeout:5e3,showCloseButton:!0,position:"top-right",transition:"bounce",hideProgressBar:!1,swipeClose:!0},n={"top-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"},"top-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"top-center":{bounce:"mosha__bounceInDown",zoom:"mosha__zoomIn",slide:"mosha__slideInDown"},"bottom-center":{bounce:"mosha__bounceInUp",zoom:"mosha__zoomIn",slide:"mosha__slideInUp"},"bottom-right":{bounce:"mosha__bounceInRight",zoom:"mosha__zoomIn",slide:"mosha__slideInRight"},"bottom-left":{bounce:"mosha__bounceInLeft",zoom:"mosha__zoomIn",slide:"mosha__slideInLeft"}},s=(e,t,n)=>{const s=o.ref(),a=o.ref(void 0),i=o.ref(),r=e=>e instanceof MouseEvent,l=o=>{!1!==n&&s.value&&(r(o)?a.value=s.value.clientX-o.clientX:a.value=s.value.touches[0].clientX-o.touches[0].clientX,i.value=__assign(__assign({},i.value),{transition:"none"}),e.endsWith("left")?i.value.left=-a.value+"px !important":e.endsWith("right")?i.value.right=`${a.value}px !important`:a.value>0?i.value.left=-a.value+"px !important":i.value.right=`${a.value}px !important`,Math.abs(a.value)>200&&t())},p=e=>{!1!==n&&(s.value&&(s.value=void 0),a.value&&(a.value=void 0),removeEventListener(e,l))};return o.onUnmounted((()=>{!1!==n&&(p("mousemove"),p("touchmove"))})),{swipedDiff:a,swipeStart:s,swipeStyle:i,swipeHandler:l,startSwipeHandler:o=>{if(!1===n)return;s.value=o;const t=r(o)?"mousemove":"touchmove",p=r(o)?"mouseup":"touchend";addEventListener(t,l),addEventListener(p,(()=>(o=>{const t={transition:"left .3s ease-out",left:0},n={transition:"right .3s ease-out",right:0};e.endsWith("left")?i.value=__assign(__assign({},i.value),t):e.endsWith("right")?i.value=__assign(__assign({},i.value),n):a.value>0?i.value=__assign(__assign({},i.value),t):a.value&&a.value<0&&(i.value=__assign(__assign({},i.value),n)),s.value=void 0,a.value=void 0,removeEventListener(o,l)})(t)))},cleanUpMove:p}};var a=o.defineComponent({props:{type:{type:String,default:"default"}}});const i={class:"mosha__icon"},r={key:0,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},l=o.createVNode("path",{d:"M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),p={key:1,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},u=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 11c-.55 0-1-.45-1-1V8c0-.55.45-1 1-1s1 .45 1 1v4c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"},null,-1),c={key:2,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},d=o.createVNode("path",{d:"M0 0h24v24H0V0z",fill:"none"},null,-1),m=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM9.29 16.29L5.7 12.7c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0L10 14.17l6.88-6.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-7.59 7.59c-.38.39-1.02.39-1.41 0z"},null,-1),h={key:3,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#616161"},f=o.createVNode("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),v=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1),_={key:4,xmlns:"http://www.w3.org/2000/svg",height:"32px",viewBox:"0 0 24 24",width:"32px",fill:"#ffffff"},g=o.createVNode("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),w=o.createVNode("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"},null,-1);a.render=function(e,t,n,s,a,y){return o.openBlock(),o.createBlock("span",i,["warning"===e.type?(o.openBlock(),o.createBlock("svg",r,[l])):"danger"===e.type?(o.openBlock(),o.createBlock("svg",p,[u])):"success"===e.type?(o.openBlock(),o.createBlock("svg",c,[d,m])):"default"===e.type?(o.openBlock(),o.createBlock("svg",h,[f,v])):(o.openBlock(),o.createBlock("svg",_,[g,w]))])};var y=o.defineComponent({name:"MToast",components:{MIcon:a},props:{visible:Boolean,text:{type:String,default:""},description:{type:String,default:""},toastBackgroundColor:{type:String,default:""},type:{type:String,default:"default"},onCloseHandler:{type:Function,required:!0},offset:Number,id:{type:Number,required:!0},timeout:{type:Number,default:5e3},position:{type:String,required:!0},showCloseButton:{type:Boolean,default:!0},swipeClose:{type:Boolean,default:!0},hideProgressBar:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!1},transition:{type:String,default:"bounce"}},setup(e){const t=o.ref(),{swipedDiff:a,startSwipeHandler:i,swipeStyle:r,cleanUpMove:l}=s(e.position,e.onCloseHandler,e.swipeClose),{transitionType:p}=(u=e.position,c=e.transition,d=a,{transitionType:o.computed((()=>d.value>200?"mosha__fadeOutLeft":d.value<-200?"mosha__fadeOutRight":n[u][c]))});var u,c,d;const{start:m,stop:h,progress:f}=((e,t)=>{const n=o.ref(),s=o.ref(0),a=o.ref(t),i=o.ref(),r=o.ref(100),l=()=>{clearInterval(i.value),clearTimeout(n.value)};return o.onMounted((()=>{})),o.onUnmounted((()=>{l()})),{start:()=>{s.value=Date.now(),clearTimeout(n.value),i.value=setInterval((()=>{r.value--}),t/100-2),n.value=setTimeout(e,a.value)},stop:()=>{clearInterval(i.value),clearTimeout(n.value),a.value-=Date.now()-s.value},clear:l,progress:r}})((()=>{e.onCloseHandler()}),e.timeout),v=()=>{e.timeout>0&&m()};return o.watchEffect((()=>{const{customStyle:n}=((e,t,n)=>{const s=o.computed((()=>{switch(e){case"top-left":return{left:"0",top:`${t}px`};case"bottom-left":return{left:"0",bottom:`${t}px`};case"bottom-right":return{right:"0",bottom:`${t}px`};case"top-center":return{top:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};case"bottom-center":return{bottom:`${t}px`,left:"0",right:"0",marginRight:"auto",marginLeft:"auto"};default:return{right:"0",top:`${t}px`}}}));return n.length>0&&(s.value.backgroundColor=n),{customStyle:s}})(e.position,e.offset,e.toastBackgroundColor);t.value=n.value})),o.onMounted((()=>{v()})),{style:t,transitionType:p,startTimer:v,stopTimer:()=>{e.timeout>0&&h()},progress:f,onTouchStart:e=>{i(e)},onMouseLeave:()=>{l("mousemove"),v()},onMouseDown:e=>{i(e)},swipeStyle:r}}});const b={class:"mosha__toast__content-wrapper"},B={class:"mosha__toast__content"},k={class:"mosha__toast__content__text"},x={key:0,class:"mosha__toast__content__description"};y.render=function(e,t,n,s,a,i){const r=o.resolveComponent("MIcon");return o.openBlock(),o.createBlock(o.Transition,{name:e.transitionType,type:"animation"},{default:o.withCtx((()=>[e.visible?(o.openBlock(),o.createBlock("div",{key:0,class:["mosha__toast",e.toastBackgroundColor?null:e.type],style:[e.style,e.swipeStyle],onMouseenter:t[2]||(t[2]=(...o)=>e.stopTimer&&e.stopTimer(...o)),onMouseleave:t[3]||(t[3]=(...o)=>e.onMouseLeave&&e.onMouseLeave(...o)),onTouchstart:t[4]||(t[4]=(...o)=>e.onTouchStart&&e.onTouchStart(...o)),onMousedown:t[5]||(t[5]=(...o)=>e.onMouseDown&&e.onMouseDown(...o))},[o.createVNode("div",b,[e.showIcon?(o.openBlock(),o.createBlock(r,{key:0,type:e.type},null,8,["type"])):o.createCommentVNode("",!0),o.createVNode("div",B,[o.createVNode("div",k,o.toDisplayString(e.text),1),e.description.length>0?(o.openBlock(),o.createBlock("div",x,o.toDisplayString(e.description),1)):o.createCommentVNode("",!0)])]),e.showCloseButton?(o.openBlock(),o.createBlock("div",{key:0,class:"mosha__toast__close-icon",onClick:t[1]||(t[1]=(...o)=>e.onCloseHandler&&e.onCloseHandler(...o))})):o.createCommentVNode("",!0),e.hideProgressBar?o.createCommentVNode("",!0):(o.openBlock(),o.createBlock("div",{key:1,class:"mosha__toast__progress",style:{width:`${e.progress}%`}},null,4))],38)):o.createCommentVNode("",!0)])),_:1},8,["name"])};const C={"top-left":[],"top-right":[],"bottom-left":[],"bottom-right":[],"top-center":[],"bottom-center":[]};let I=0;const z=e=>{const o=__assign(__assign({},e),{type:e.type||t.type,timeout:e.timeout||t.timeout,showCloseButton:e.showCloseButton,position:e.position||t.position,showIcon:e.showIcon,swipeClose:e.swipeClose,transition:e.transition||t.transition});return o.hideProgressBar=void 0!==o.timeout&&o.timeout<=0,void 0!==e.hideProgressBar&&(o.hideProgressBar=e.hideProgressBar),o},S=e=>({text:"string"==typeof e?e:e.title,description:"string"==typeof e?void 0:e.description}),M=e=>{let o=12;if(!e.position)throw new Error("no position");return C[e.position].forEach((({toastVNode:e})=>{const t=e.el.offsetHeight+12;o+=t||0})),o},N=(e,o,t,n)=>__assign(__assign(__assign({},e),o),{id:t,offset:n,visible:!1,onCloseHandler:()=>{P(t,e.position?e.position:"top-right")}}),V=(e,t)=>{const n=M(e),s=I++,a=document.createElement("div");document.body.appendChild(a);const i=o.createVNode(y,N(e,t,s,n));o.render(i,a),e.position&&(C[e.position].push({toastVNode:i,container:a}),i.component&&(i.component.props.visible=!0))},T=(e,o)=>{if(!e)return;const n=S(e),s=o?z(o):t;V(s,n)},P=(e,t)=>{const n=C[t],s=n.findIndex((({toastVNode:o})=>o.props&&e===o.props.id));if(-1===s)return;const{container:a,toastVNode:i}=n[s];if(!i.el)return;const r=i.el.offsetHeight;C[t].splice(s,1),((e,o,t,n)=>{for(let s=e;s<o.length;s++){const{toastVNode:e}=o[s];if(!e.el)return;const a=t.split("-")[0]||"top",i=parseInt(e.el.style[a],10)-n-12;if(!e.component)return;e.component.props.offset=i}})(s,n,t,r),i.component&&(i.component.props.visible=!1,i.component.props.onClose&&i.component.props.onClose(),setTimeout((()=>{o.render(null,a),document.body.removeChild(a)}),1e3))};var L={install:e=>{e.config.globalProperties.$moshaToast=T,e.provide("moshaToast",T)}};e.createToast=T,e.default=L,e.initializeContent=S,e.initializeOptions=z,e.moveToastsOnAdd=M,e.setupVNode=V,e.setupVNodeProps=N,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"}));

dist/types.d.ts

@@ -0,1 +1,2 @@
+import { VNode } from '@vue/runtime-core';
 export declare type ToastType = 'info' | 'danger' | 'warning' | 'success' | 'default';
@@ -9,3 +10,3 @@ export declare type Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-center' | 'bottom-center';
 export interface ToastObject {
-    toastVNode: any;
+    toastVNode: VNode;
     container: HTMLDivElement;
@@ -12,0 +13,0 @@ }

package.json

 {
   "name": "mosha-vue-toastify",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "license": "MIT",
@@ -15,3 +15,6 @@ "description": "A light weight and fun Vue 3 toast or notification or snack bar or however you wanna call it library.",
     "test": "jest",
+    "test:watch": "jest --watch",
     "dev": "vite",
+    "lint": "eslint 'lib/**/*.{ts,vue}'",
+    "format": "prettier --config .prettierrc 'lib/**/*.{ts,vue}' --write",
     "build": "vite build && tsc -P tsconfig.json",
@@ -29,2 +32,4 @@ "serve": "vite preview",
     "@types/node": "^14.14.32",
+    "@typescript-eslint/eslint-plugin": "^4.20.0",
+    "@typescript-eslint/parser": "^4.20.0",
     "@vitejs/plugin-vue": "^1.1.5",
@@ -34,5 +39,10 @@ "@vue/compiler-sfc": "^3.0.5",
     "autoprefixer": "^10.2.5",
+    "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-vue": "^7.8.0",
     "jest": "^26.6.3",
     "path": "^0.12.7",
     "postcss": "^8.2.8",
+    "prettier": "^2.2.1",
     "sass": "^1.32.8",
@@ -45,2 +55,3 @@ "tailwindcss": "^2.0.4",
     "vue": "^3.0.5",
+    "vue-eslint-parser": "^7.6.0",
     "vue-jest": "^5.0.0-alpha.7"
@@ -47,0 +58,0 @@ },

README.md

@@ -5,3 +5,3 @@ # Mosha Vue Toastify
 
-A light weight and fun Vue 3 toast or notification or snack bar or however you wanna call it library.
+A lightweight and fun Vue 3 toast or notification or snack bar or however you wanna call it library.
 
@@ -11,4 +11,15 @@ ![alt text](./gif/demo.gif "Logo Title Text 1")
 ## Talk is cheap, show me the demo
-Try it out in the [playground](https://szboynono.github.io/mosha-vue-toastify/)
 
+Try it out in the [playground](https://szboynono.github.io/mosha-vue-toastify/) in the documentation
+
+## Features
+- Super easy to setup! try follow [this](#the-gist)
+- Swipe to close
+- Support for Composition API
+- Written in typescript, full typescript support
+- Super light weight
+- Define behavior per toast
+- Fun progress bar to display remaining time
+- A lot more coming!
+
 ## Installation
@@ -61,11 +72,15 @@
 | ------------- |:-------------:| -----:| -----:|
-| type      | "info", "danger", "warning", "success", "default" | "default" | Give the toast different styles and icons. |
+| type      | 'info', 'danger', 'warning', 'success', 'default' | 'default' | Give the toast different styles and icons. |
 | timeout      | number      |   5000 | How many ms you want the toggle to close itself?
-| position      | "top-left", "top-right", "bottom-left", "bottom-right", "top-center", "bottom-center" |   "top-right" | Where do you want the toast to appear? |
+| position      | 'top-left', 'top-right', 'bottom-left', 'bottom-right', 'top-center', 'bottom-center' |   'top-right' | Where do you want the toast to appear? |
 | showCloseButton | boolean      |    true | Do you wanna show the close button ? |
 | showIcon | boolean      |    false | Do you wanna show the icon ? |
-| transition | "bounce", "zoom", "slide" | "bounce" | Which animation do you want? |
+| transition | 'bounce', 'zoom', 'slide' | 'bounce' | Which animation do you want? |
 | hideProgressBar | boolean      |    false | Do we wanna hide the fancy progress bar? |
 | swipeClose | boolean      |    true | Allows the user swipe close the toast |
 | toastBackgroundColor | string      | default color | Customize the background color of the toast. |
-| onClose | function      | N/A | This function will be called at the end of the toast's lifecycle|
+| onClose | function      | N/A | This function will be called at the end of the toast's lifecycle|
+
+## Support
+
+Give this [project](https://github.com/szboynono/mosha-vue-toastify) a ⭐ if you like it. Any suggestions are welcome!

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

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

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

39303

increased by3.92%

Number of lines in readme file

83

increased by22.06%

Worsened metrics

Dev dependency count

25

increased by47.06%

Lines of code

178

decreased by-4.81%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes