maz-ui 4.7.6 → 4.7.9

package/dist/chunks/toast.UQ8RRuT9.js

@@ -1 +0,0 @@
-import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useMountComponent}from"../composables/useMountComponent.js";import{useTimer}from"../composables/useTimer.js";import{Fragment,Transition,computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineAsyncComponent,defineComponent,mergeProps,normalizeClass,normalizeStyle,onMounted,openBlock,ref,renderList,resolveDynamicComponent,toDisplayString,unref,vShow,watch,withCtx,withDirectives,withModifiers}from"vue";import{MazArrowTopRightOnSquare,MazCheckCircle,MazExclamationCircle,MazExclamationTriangle,MazInformationCircle,MazLinkIcon,MazXMark}from"@maz-ui/icons/lazy";import '../assets/toast.DG6Qv7r7.css';var _hoisted_1=[`textContent`,`innerHTML`];var _hoisted_2={key:1,class:`m-toast__progress-bar`};var MazToast_default=_plugin_vue_export_helper_default(defineComponent({__name:`MazToast`,props:{message:{},type:{default:`info`},destroy:{type:Function},html:{type:Boolean,default:!1},maxToasts:{type:[Number,Boolean],default:!1},queue:{type:Boolean},position:{default:`bottom-right`},pauseOnHover:{type:Boolean,default:!0},timeout:{type:[Number,Boolean],default:1e4},persistent:{type:Boolean},icon:{type:[Boolean,Function,Object],default:!0},button:{},buttons:{}},emits:[`close`,`click`,`open`],setup(__props,{expose:__expose,emit:__emit}){let emits=__emit;let MazBtn=defineAsyncComponent(()=>import(`../components/MazBtn.js`));let Toast=ref();let internalButtons=computed(()=>{let buttonArray=[];return __props.button&&buttonArray.push(__props.button),__props.buttons&&buttonArray.push(...__props.buttons),buttonArray});let iconComponent=computed(()=>{if(__props.icon)switch(__props.type){case`destructive`:return MazExclamationTriangle;case`info`:return MazInformationCircle;case`success`:return MazCheckCircle;case`warning`:return MazExclamationCircle;default:return}});let positionY=computed(()=>__props.position.includes(`top`)?`top`:`bottom`);let positionX=computed(()=>__props.position.includes(`left`)?`left`:__props.position.includes(`right`)?`right`:`center`);let transitionName=computed(()=>positionX.value===`center`?positionY.value===`top`?`m-slide-top`:`m-slide-bottom`:positionX.value===`right`?`m-slide-right`:`m-slide-left`);let isActive=ref(!1);let queueTimer=ref();let containerClassName=`m-toast-container m-reset-css --${positionY.value} --${positionX.value}`;let selectorContainerClass=`.${containerClassName.replaceAll(` `,`.`)}`;let timer=useTimer({callback:closeToast,timeout:typeof __props.timeout==`number`?__props.timeout:0,callbackOffsetTime:200});function createParents(){let container=document.querySelector(selectorContainerClass);if(!container&&!container){let body=document.body;let toCreate=document.createElement(`div`);toCreate.className=containerClassName,body.append(toCreate)}}function shouldQueue(){let container=document.querySelector(selectorContainerClass);return!__props.queue&&__props.maxToasts===!1?!1:typeof __props.maxToasts==`number`&&container?__props.maxToasts<=container.childElementCount:container&&container.childElementCount>0}function showNotice(){if(shouldQueue()){queueTimer.value=setTimeout(showNotice,250);return}let container=document.querySelector(selectorContainerClass);Toast.value&&container&&container.prepend(Toast.value),isActive.value=!0,typeof __props.timeout==`number`&&__props.timeout>0&&!__props.persistent&&timer.start()}let progressBarWidth=ref(`100%`);function getProgressBarColor(){switch(__props.type){case`destructive`:return`maz-bg-destructive-800`;case`info`:return`maz-bg-info-800`;case`success`:return`maz-bg-success-800`;case`warning`:return`maz-bg-warning-800`;default:return`maz-bg-contrast-foreground`}}watch(timer.remainingTime,remainingTime=>{typeof __props.timeout==`number`&&(progressBarWidth.value=`${100*remainingTime/__props.timeout}%`)});function click(event,shouldClose=!0){emits(`click`,event),shouldClose&&closeToast()}let isActionLoading=ref(!1);async function onButtonClick(button,event){button.onClick&&(isActionLoading.value=!0,timer.pause(),await button.onClick(),timer.resume(),isActionLoading.value=!1),click(event,button.closeToast??!1)}function toggleTimer(shouldPause){!__props.pauseOnHover||__props.persistent||isActionLoading.value||(shouldPause?timer.pause():timer.resume())}function stopTimer(){timer.stop(),queueTimer.value&&clearTimeout(queueTimer.value)}function closeToast(){stopTimer(),isActive.value=!1}function onAnimationEnter(){emits(`open`)}function onAnimationLeave(){emits(`close`),Toast.value?.remove(),__props.destroy?.();let container=document.querySelector(selectorContainerClass);container&&!container?.hasChildNodes()&&container.remove()}function getButtonRightIcon(button){return!button.to&&!button.href?button.rightIcon:button.target===`_blank`?MazArrowTopRightOnSquare:MazLinkIcon}return __expose({closeToast}),onMounted(()=>{createParents(),showNotice()}),(_ctx,_cache)=>(openBlock(),createBlock(Transition,{name:transitionName.value,appear:``,onAfterLeave:onAnimationLeave,onAfterEnter:onAnimationEnter},{default:withCtx(()=>[withDirectives(createElementVNode(`div`,{ref_key:`Toast`,ref:Toast,class:normalizeClass([`m-toast m-reset-css`,[`--${__props.type}`,`--${positionY.value}`,`--${positionX.value}`,{"--persistent":__props.persistent}]])},[createElementVNode(`button`,{role:`alert`,class:`m-toast__button`,onMouseover:_cache[0]||=$event=>toggleTimer(!0),onMouseleave:_cache[1]||=$event=>toggleTimer(!1),onTouchstartPassive:_cache[2]||=$event=>toggleTimer(!0),onTouchendPassive:_cache[3]||=$event=>toggleTimer(!1),onClick:_cache[4]||=withModifiers($event=>click($event),[`stop`])},[iconComponent.value?(openBlock(),createBlock(resolveDynamicComponent(iconComponent.value),{key:0,class:`maz-text-2xl`})):createCommentVNode(``,!0),createElementVNode(`div`,{class:`m-toast__message`,textContent:toDisplayString(__props.html?void 0:__props.message),innerHTML:__props.html?__props.message:void 0},null,8,_hoisted_1),(openBlock(!0),createElementBlock(Fragment,null,renderList(internalButtons.value,(toastButton,index)=>(openBlock(),createBlock(unref(MazBtn),mergeProps({key:index},{ref_for:!0},{...toastButton,onClick:void 0},{loading:isActionLoading.value||toastButton.loading,"right-icon":getButtonRightIcon(toastButton),onClick:withModifiers($event=>onButtonClick(toastButton,$event),[`stop`])}),null,16,[`loading`,`right-icon`,`onClick`]))),128)),typeof __props.timeout==`number`&&__props.timeout>0&&!__props.persistent?(openBlock(),createElementBlock(`div`,_hoisted_2,[createElementVNode(`div`,{style:normalizeStyle({width:progressBarWidth.value}),class:normalizeClass([`m-toast__progress-bar-inner`,getProgressBarColor()])},null,6)])):createCommentVNode(``,!0)],32),createElementVNode(`button`,{class:`m-toast__close`,onClick:_cache[5]||=withModifiers($event=>click($event),[`stop`])},[createVNode(unref(MazXMark),{class:`m-toast__close-icon`})])],2),[[vShow,isActive.value]])]),_:1},8,[`name`]))}}),[[`__scopeId`,`data-v-2a4224e0`]]);var DEFAULT_OPTIONS={position:`bottom-right`,timeout:1e4,persistent:!1};var ToastHandler=class{constructor(app,globalOptions){this.app=app,this.globalOptions=globalOptions}show(message,options){let{destroy,vNode}=useMountComponent(MazToast_default,{props:{...DEFAULT_OPTIONS,...this.globalOptions,...options,message},app:this.app});return{destroy,close:()=>vNode.component?.exposed?.closeToast()}}getLocalOptions(options){let DEFAULT_BUTTON_OPTIONS={size:`xs`,color:options?.type??`contrast`,closeToast:!1};let button=options?.button?{...DEFAULT_BUTTON_OPTIONS,...options.button}:void 0;let buttons=options?.buttons?.map(button=>({...DEFAULT_BUTTON_OPTIONS,...button}));return{type:options?.type??`contrast`,...options,buttons,button}}message(message,options){return this.show(message,this.getLocalOptions(options))}success(message,options){return this.show(message,this.getLocalOptions({...options,type:`success`}))}error(message,options){return this.show(message,this.getLocalOptions({...options,type:`destructive`}))}info(message,options){return this.show(message,this.getLocalOptions({...options,type:`info`}))}warning(message,options){return this.show(message,this.getLocalOptions({...options,type:`warning`}))}};var ToastPlugin={install(app,options){let toastHandler=new ToastHandler(app,options);app.provide(`mazToast`,toastHandler),app.config.globalProperties.$mazToast=toastHandler}};export{ToastHandler as n,ToastPlugin as t};

package/dist/chunks/vFullscreenImg.CZeRh3mw.js

@@ -1 +0,0 @@
-import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazSpinner_default}from"./MazSpinner.D3NN2pow.js";import{useMountComponent}from"../composables/useMountComponent.js";import{computed,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineComponent,normalizeClass,onBeforeUnmount,onMounted,openBlock,reactive,ref,unref,vShow,watch,withDirectives,withKeys,withModifiers}from"vue";import{MazChevronLeft,MazXMark}from"@maz-ui/icons/lazy";import{checkAvailability}from"@maz-ui/utils/helpers/checkAvailability";import '../assets/vFullscreenImg.DFp1SMPU.css';var _hoisted_1=[`onKeypress`];var _hoisted_2={class:`m-fullscreen-img-scroller`};var _hoisted_3=[`src`,`alt`];var MazFullscreenImg_default=_plugin_vue_export_helper_default(defineComponent({__name:`MazFullscreenImg`,props:{src:{},clickedElementBounds:{default:void 0},offset:{default:void 0},animation:{default:()=>({duration:300,easing:`ease-in-out`})},openInstanceClass:{default:`m-fullscreen-img-instance`},clickedElement:{},destroy:{type:Function,default:void 0},alt:{default:void 0},zoom:{type:Boolean,default:!0}},emits:[`close`,`previous`,`next`,`before-close`],setup(__props,{emit:__emit}){let props=__props;let emits=__emit;let imageLoaded=ref(!1);let showLoader=ref(!1);let loadedOnce=ref(!1);let hasMultipleInstances=ref(!1);let isZoomed=ref(!1);let animationState=reactive({running:!1,ended:!1});let currentClickedElement=ref(props.clickedElement);let currentClickedElementBounds=computed(()=>props.clickedElement.getBoundingClientRect());let isLandscapeImage=ref();let currentSrc=ref(props.src);let currentAlt=ref(props.alt);let FullscreenImgElement=ref();let ImgElement=ref();let hideImage=ref(!0);let imageZoomClasses=computed(()=>({"--is-zoomed":isZoomed.value,"--invisible":hideImage.value,"--absolute":!isZoomed.value}));function onImageLoaded(){ImgElement.value&&(isLandscapeImage.value=ImgElement.value?.naturalWidth>ImgElement.value?.naturalHeight),imageLoaded.value=!0,showLoader.value=!1,loadedOnce.value=!0}watch(loadedOnce,value=>{value&&openFullscreen()},{immediate:!0});function close(){emits(`before-close`),closeFullscreen()}function keydownLister(e){e.key===`Escape`&&(e.preventDefault(),close()),(e.key===`ArrowLeft`||e.key===`ArrowRight`)&&(e.preventDefault(),nextPreviousImage(e.key===`ArrowRight`?`next`:`previous`))}function addClassToDocument(){document.documentElement.classList.add(`--m-fullscreen-open`)}function removeClassFromDocument(){document.documentElement.classList.remove(`--m-fullscreen-open`)}function getAllInstances(){return[...document.querySelectorAll(`.m-fullscreen-img-instance`)]}function getNewInstanceIndex(allInstances,newInstanceIndex){return newInstanceIndex<0?allInstances.length-1:newInstanceIndex>=allInstances.length?0:newInstanceIndex}function useNextInstance(currentInstance,nextInstance){currentInstance.classList.remove(props.openInstanceClass),nextInstance.classList.add(props.openInstanceClass);let src=nextInstance.getAttribute(`data-src`);currentAlt.value=nextInstance.getAttribute(`data-alt`),currentSrc.value=src??currentSrc.value}function nextPreviousImage(which){hideImage.value=!0;let currentInstance=document.querySelector(`.m-fullscreen-img-instance.${props.openInstanceClass}`);if(currentInstance){let allInstances=getAllInstances();let currentInstanceIndex=allInstances.indexOf(currentInstance);let nextInstance=allInstances[getNewInstanceIndex(allInstances,which===`next`?currentInstanceIndex+1:currentInstanceIndex-1)];currentClickedElement.value=nextInstance,nextInstance&&useNextInstance(currentInstance,nextInstance),emits(which),imageLoaded.value=!1,showLoader.value=!0,checkAvailability(()=>imageLoaded.value===!0,()=>{hideImage.value=!1,isZoomed.value?setZoomStyles():setEndAnimationStyles()},{expectedValue:!0,interval:100,maxAttempts:50})}}function setZoomStyles(){let imgElement=ImgElement.value;if(!imgElement){console.error(`[maz-ui](vFullscreenImg) ImgElement is not defined`);return}imgElement.style.removeProperty(`max-width`),imgElement.style.removeProperty(`max-height`),imgElement?.style.removeProperty(`top`),imgElement?.style.removeProperty(`left`),isLandscapeImage.value?(imgElement.style.height=`100vh`,imgElement.style.removeProperty(`width`)):(imgElement.style.width=`100vw`,imgElement.style.removeProperty(`height`))}function toggleZoom(){isZoomed.value?(isZoomed.value=!isZoomed.value,setEndAnimationStyles()):(isZoomed.value=!isZoomed.value,setZoomStyles())}function runAnimation(frames){animationState.running=!0,hideImage.value=!1;let animation=ImgElement.value?.animate(frames,{duration:props.animation.duration,easing:props.animation.easing});if(!animation){console.error(`[maz-ui](vFullscreenImg) animation is not defined`),animationState.running=!1,animationState.ended=!0;return}return animation}function getPositionsOfClikedElement(offset=props.offset??0){let width=currentClickedElement.value.clientWidth||1;let height=currentClickedElement.value.clientHeight||1;let windowWidth=window.innerWidth;let windowHeight=window.innerHeight;let scale=Math.min((windowWidth-2*offset)/width,(windowHeight-2*offset)/height);return{centerX:(windowWidth-width*scale)/2,centerY:(windowHeight-height*scale)/2,width,height,scale}}function getAnimationFrames({trigger}){let{width,height,scale,centerX,centerY}=getPositionsOfClikedElement();let{top,left,width:clickedElementWidth,height:clickedElementHeight}=currentClickedElementBounds.value;let frames=[{top:`${top}px`,left:`${left}px`,width:`${clickedElementWidth}px`,height:`${clickedElementHeight}px`,opacity:0},{top:`${centerY}px`,left:`${centerX}px`,width:`${width*scale}px`,height:`${height*scale}px`,opacity:1}];return{frames:trigger===`open`?frames:frames.reverse()}}function setEndAnimationStyles(){let{height,width,scale}=getPositionsOfClikedElement();let finalStyles=isLandscapeImage.value?{width:`${width*scale}px`,maxHeight:`${height*scale}px`}:{height:`${height*scale}px`,maxWidth:`${width*scale}px`};if(!ImgElement.value){console.error(`[maz-ui](vFullscreenImg) ImgElement is not defined`);return}isLandscapeImage.value?(ImgElement.value.style.removeProperty(`height`),ImgElement.value.style.removeProperty(`maxHeight`)):(ImgElement.value.style.removeProperty(`width`),ImgElement.value.style.removeProperty(`maxWidth`)),Object.assign(ImgElement.value.style,finalStyles)}function openFullscreen(){let{frames}=getAnimationFrames({trigger:`open`});let openAnimation=runAnimation(frames);if(!openAnimation){console.error(`[maz-ui](vFullscreenImg) open animation is not defined`),setEndAnimationStyles();return}openAnimation.onfinish=()=>{setEndAnimationStyles(),animationState.running=!1,animationState.ended=!0}}function closeFullscreen(){let{frames}=getAnimationFrames({trigger:`close`});let closeAnimation=runAnimation(frames);function onFinish(){emits(`close`),FullscreenImgElement.value?.remove(),props.destroy?.(),animationState.running=!1,animationState.ended=!0}if(!closeAnimation){console.error(`[maz-ui](vFullscreenImg) close animation is not defined`),onFinish();return}closeAnimation.onfinish=onFinish}function onResizeWindow(){isZoomed.value||setEndAnimationStyles()}return onMounted(()=>{showLoader.value=!0,document.addEventListener(`keydown`,keydownLister),window.addEventListener(`resize`,onResizeWindow),addClassToDocument(),hasMultipleInstances.value=getAllInstances().length>1}),onBeforeUnmount(()=>{document.removeEventListener(`keydown`,keydownLister),window.removeEventListener(`resize`,onResizeWindow),removeClassFromDocument()}),(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{ref_key:`FullscreenImgElement`,ref:FullscreenImgElement,role:`button`,class:`m-fullscreen-img m-reset-css`,tabindex:`0`,onClick:withModifiers(close,[`stop`]),onKeypress:withKeys(withModifiers(close,[`prevent`]),[`esc`])},[loadedOnce.value&&hasMultipleInstances.value?(openBlock(),createElementBlock(`button`,{key:0,type:`button`,class:`m-fullscreen-btn --next`,onClick:_cache[0]||=withModifiers($event=>nextPreviousImage(`next`),[`stop`])},[createVNode(unref(MazChevronLeft),{class:`maz-rotate-180`})])):createCommentVNode(``,!0),loadedOnce.value&&hasMultipleInstances.value?(openBlock(),createElementBlock(`button`,{key:1,type:`button`,class:`m-fullscreen-btn --previous`,onClick:_cache[1]||=withModifiers($event=>nextPreviousImage(`previous`),[`stop`])},[createVNode(unref(MazChevronLeft))])):createCommentVNode(``,!0),createElementVNode(`button`,{type:`button`,class:`m-fullscreen-btn --close`,onClick:close},[createVNode(unref(MazXMark))]),createElementVNode(`div`,_hoisted_2,[createElementVNode(`img`,{ref_key:`ImgElement`,ref:ImgElement,src:currentSrc.value,alt:currentAlt.value??void 0,tabindex:`0`,class:normalizeClass([imageZoomClasses.value]),onLoad:onImageLoaded,onClick:_cache[2]||=withModifiers($event=>__props.zoom&&toggleZoom(),[`stop`])},null,42,_hoisted_3),withDirectives(createVNode(MazSpinner_default,{class:`m-fullscreen-img-loader`},null,512),[[vShow,showLoader.value]])])],40,_hoisted_1))}}),[[`__scopeId`,`data-v-92a410ce`]]);var STATE_OPEN_CLASS=`m-fullscreen-is-open`;var FullscreenImgHandler=class{options=void 0;defaultOptions={scaleOnHover:!1,blurOnHover:!1,disabled:!1,zoom:!0,offset:80,animation:{duration:300,easing:`ease-in-out`}};mouseEnterListener=void 0;mouseLeaveListener=void 0;renderPreviewListener=void 0;buildOptions(el,binding){let options=typeof binding.value==`object`?binding.value:{src:binding.value,alt:void 0};let src=options?.src??this.getImgSrc(el);let alt=options?.alt??this.getImgAlt(el);return{...this.defaultOptions,...options,src,alt}}get allInstances(){return[...document.querySelectorAll(`.m-fullscreen-img-instance`)]}getImgSrc(el){let imgSrc=this.options?.src||el.getAttribute(`src`)||el.getAttribute(`data-src`);if(!imgSrc)throw Error('[maz-ui](fullscreen-img) src of image must be provided by `v-fullscreen=""`, `v-fullscreen="{ src: "" }"`, `src=""` or `data-src=""` atributes');return imgSrc}getImgAlt(el){return this.options?.alt||el.getAttribute(`alt`)||el.getAttribute(`data-alt`)}create(el,binding){if(this.options=this.buildOptions(el,binding),this.options.disabled)return;el.style.cursor=`move`,(this.options.scaleOnHover||this.options.blurOnHover)&&(el.style.transition=`all 200ms ease-in-out`),el.classList.add(`m-fullscreen-img-instance`),el.setAttribute(`data-src`,this.getImgSrc(el));let alt=this.getImgAlt(el);alt&&el.setAttribute(`data-alt`,alt),this.mouseEnterListener=()=>this.mouseEnter(el),this.mouseLeaveListener=()=>this.mouseLeave(el),this.renderPreviewListener=()=>this.renderPreview(el),el.addEventListener(`mouseenter`,this.mouseEnterListener),el.addEventListener(`mouseleave`,this.mouseLeaveListener),el.addEventListener(`click`,this.renderPreviewListener)}update(el,binding){this.options=this.buildOptions(el,binding)}remove(el){this.mouseEnterListener&&el.removeEventListener(`mouseenter`,this.mouseEnterListener),this.mouseLeaveListener&&el.removeEventListener(`mouseleave`,this.mouseLeaveListener),this.renderPreviewListener&&el.removeEventListener(`click`,this.renderPreviewListener),el.classList.remove(`m-fullscreen-img-instance`),el.style.cursor=``}renderPreview(el){return el.classList.add(STATE_OPEN_CLASS),useMountComponent(MazFullscreenImg_default,{props:{...this.options,src:this.options?.src||this.getImgSrc(el),alt:this.options?.alt||this.getImgAlt(el),openInstanceClass:STATE_OPEN_CLASS,clickedElement:el,clickedElementBounds:el.getBoundingClientRect()},element:document.body})}mouseLeave(el){this.options?.scaleOnHover&&(el.style.transform=``),this.options?.blurOnHover&&(el.style.filter=``),el.style.zIndex=``}mouseEnter(el){el.style.zIndex=`1`,this.options?.scaleOnHover&&(el.style.transform=`scale(1.04)`),this.options?.blurOnHover&&(el.style.filter=`blur(3px)`)}};var instance;var directive={mounted(el,binding){return instance=new FullscreenImgHandler,instance.create(el,binding)},updated(el,binding){return instance.update(el,binding)},unmounted(el){return instance.remove(el)}};var plugin={install(app){app.directive(`fullscreen-img`,directive)}};export{directive as n,plugin as t};