UNPKG

react-klasha

Version:

This is an reactJS library for implementing klasha payment gateway

1 lines 10.8 kB
import{c as createAnimation}from"./animation-096c6391.js";import{g as getIonPageElement}from"./index-931440b1.js";import"./helpers-dd7e4b7b.js";import"./index-7a8b7a1c.js";var DURATION=540;var getClonedElement=function(e){return document.querySelector(e+".ion-cloned-element")};var shadow=function(e){return e.shadowRoot||e};var getLargeTitle=function(e){var t=e.tagName==="ION-TABS"?e:e.querySelector("ion-tabs");var a="ion-content ion-header:not(.header-collapse-condense-inactive) ion-title.title-large";if(t!=null){var r=t.querySelector("ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)");return r!=null?r.querySelector(a):null}return e.querySelector(a)};var getBackButton=function(e,t){var a=e.tagName==="ION-TABS"?e:e.querySelector("ion-tabs");var r=[];if(a!=null){var o=a.querySelector("ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)");if(o!=null){r=o.querySelectorAll("ion-buttons")}}else{r=e.querySelectorAll("ion-buttons")}for(var n=0,i=r;n<i.length;n++){var l=i[n];var s=l.closest("ion-header");var c=s&&!s.classList.contains("header-collapse-condense-inactive");var f=l.querySelector("ion-back-button");var d=l.classList.contains("buttons-collapse");var m=l.slot==="start"||l.slot==="";if(f!==null&&m&&(d&&c&&t||!d)){return f}}return null};var createLargeTitleTransition=function(e,t,a,r,o){var n=getBackButton(r,a);var i=getLargeTitle(o);var l=getLargeTitle(r);var s=getBackButton(o,a);var c=n!==null&&i!==null&&!a;var f=l!==null&&s!==null&&a;if(c){var d=i.getBoundingClientRect();var m=n.getBoundingClientRect();animateLargeTitle(e,t,a,i,d,m);animateBackButton(e,t,a,n,d,m)}else if(f){var v=l.getBoundingClientRect();var p=s.getBoundingClientRect();animateLargeTitle(e,t,a,l,v,p);animateBackButton(e,t,a,s,v,p)}return{forward:c,backward:f}};var animateBackButton=function(e,t,a,r,o,n){var i=t?"calc(100% - "+(n.right+4)+"px)":n.left-4+"px";var l=t?"7px":"-7px";var s=t?"-4px":"4px";var c=t?"-4px":"4px";var f=t?"right":"left";var d=t?"left":"right";var m=[{offset:0,opacity:0,transform:"translate3d("+l+", "+(o.top-40)+"px, 0) scale(2.1)"},{offset:1,opacity:1,transform:"translate3d("+s+", "+(n.top-46)+"px, 0) scale(1)"}];var v=[{offset:0,opacity:1,transform:"translate3d("+s+", "+(n.top-46)+"px, 0) scale(1)"},{offset:.6,opacity:0},{offset:1,opacity:0,transform:"translate3d("+l+", "+(o.top-40)+"px, 0) scale(2.1)"}];var p=a?v:m;var y=[{offset:0,opacity:0,transform:"translate3d("+c+", "+(n.top-41)+"px, 0) scale(0.6)"},{offset:1,opacity:1,transform:"translate3d("+c+", "+(n.top-46)+"px, 0) scale(1)"}];var u=[{offset:0,opacity:1,transform:"translate3d("+c+", "+(n.top-46)+"px, 0) scale(1)"},{offset:.2,opacity:0,transform:"translate3d("+c+", "+(n.top-41)+"px, 0) scale(0.6)"},{offset:1,opacity:0,transform:"translate3d("+c+", "+(n.top-41)+"px, 0) scale(0.6)"}];var b=a?u:y;var g=createAnimation();var A=createAnimation();var S=getClonedElement("ion-back-button");var T=shadow(S).querySelector(".button-text");var h=shadow(S).querySelector("ion-icon");S.text=r.text;S.mode=r.mode;S.icon=r.icon;S.color=r.color;S.disabled=r.disabled;S.style.setProperty("display","block");S.style.setProperty("position","fixed");A.addElement(h);g.addElement(T);g.beforeStyles({"transform-origin":f+" center"}).beforeAddWrite((function(){r.style.setProperty("display","none");S.style.setProperty(f,i)})).afterAddWrite((function(){r.style.setProperty("display","");S.style.setProperty("display","none");S.style.removeProperty(f)})).keyframes(p);A.beforeStyles({"transform-origin":d+" center"}).keyframes(b);e.addAnimation([g,A])};var animateLargeTitle=function(e,t,a,r,o,n){var i;var l=t?"calc(100% - "+o.right+"px)":o.left+"px";var s=t?"-18px":"18px";var c=t?"right":"left";var f=[{offset:0,opacity:0,transform:"translate3d("+s+", "+(n.top-4)+"px, 0) scale(0.49)"},{offset:.1,opacity:0},{offset:1,opacity:1,transform:"translate3d(0, "+(o.top-2)+"px, 0) scale(1)"}];var d=[{offset:0,opacity:.99,transform:"translate3d(0, "+(o.top-2)+"px, 0) scale(1)"},{offset:.6,opacity:0},{offset:1,opacity:0,transform:"translate3d("+s+", "+(n.top-4)+"px, 0) scale(0.5)"}];var m=a?f:d;var v=getClonedElement("ion-title");var p=createAnimation();v.innerText=r.innerText;v.size=r.size;v.color=r.color;p.addElement(v);p.beforeStyles((i={"transform-origin":c+" center",height:"46px",display:"",position:"relative"},i[c]=l,i)).beforeAddWrite((function(){r.style.setProperty("display","none")})).afterAddWrite((function(){r.style.setProperty("display","");v.style.setProperty("display","none")})).keyframes(m);e.addAnimation(p)};var iosTransitionAnimation=function(e,t){try{var a="cubic-bezier(0.32,0.72,0,1)";var r="opacity";var o="transform";var n="0%";var i=.8;var l=e.ownerDocument.dir==="rtl";var s=l?"-99.5%":"99.5%";var c=l?"33%":"-33%";var f=t.enteringEl;var d=t.leavingEl;var m=t.direction==="back";var v=f.querySelector(":scope > ion-content");var p=f.querySelectorAll(":scope > ion-header > *:not(ion-toolbar), :scope > ion-footer > *");var y=f.querySelectorAll(":scope > ion-header > ion-toolbar");var u=createAnimation();var b=createAnimation();u.addElement(f).duration(t.duration||DURATION).easing(t.easing||a).fill("both").beforeRemoveClass("ion-page-invisible");if(d&&e){var g=createAnimation();g.addElement(e);u.addAnimation(g)}if(!v&&y.length===0&&p.length===0){b.addElement(f.querySelector(":scope > .ion-page, :scope > ion-nav, :scope > ion-tabs"))}else{b.addElement(v);b.addElement(p)}u.addAnimation(b);if(m){b.beforeClearStyles([r]).fromTo("transform","translateX("+c+")","translateX("+n+")").fromTo(r,i,1)}else{b.beforeClearStyles([r]).fromTo("transform","translateX("+s+")","translateX("+n+")")}if(v){var A=shadow(v).querySelector(".transition-effect");if(A){var S=A.querySelector(".transition-cover");var T=A.querySelector(".transition-shadow");var h=createAnimation();var x=createAnimation();var E=createAnimation();h.addElement(A).beforeStyles({opacity:"1",display:"block"}).afterStyles({opacity:"",display:""});x.addElement(S).beforeClearStyles([r]).fromTo(r,0,.1);E.addElement(T).beforeClearStyles([r]).fromTo(r,.03,.7);h.addAnimation([x,E]);b.addAnimation([h])}}var q=f.querySelector("ion-header.header-collapse-condense");var X=createLargeTitleTransition(u,l,m,f,d),C=X.forward,k=X.backward;y.forEach((function(e){var t=createAnimation();t.addElement(e);u.addAnimation(t);var a=createAnimation();a.addElement(e.querySelector("ion-title"));var o=createAnimation();var i=Array.from(e.querySelectorAll("ion-buttons,[menuToggle]"));var f=e.closest("ion-header");var d=f&&f.classList.contains("header-collapse-condense-inactive");var v;if(m){v=i.filter((function(e){var t=e.classList.contains("buttons-collapse");return t&&!d||!t}))}else{v=i.filter((function(e){return!e.classList.contains("buttons-collapse")}))}o.addElement(v);var p=createAnimation();p.addElement(e.querySelectorAll(":scope > *:not(ion-title):not(ion-buttons):not([menuToggle])"));var y=createAnimation();y.addElement(shadow(e).querySelector(".toolbar-background"));var b=createAnimation();var g=e.querySelector("ion-back-button");if(g){b.addElement(g)}t.addAnimation([a,o,p,y,b]);o.fromTo(r,.01,1);p.fromTo(r,.01,1);if(m){if(!d){a.fromTo("transform","translateX("+c+")","translateX("+n+")").fromTo(r,.01,1)}p.fromTo("transform","translateX("+c+")","translateX("+n+")");b.fromTo(r,.01,1)}else{if(!q){a.fromTo("transform","translateX("+s+")","translateX("+n+")").fromTo(r,.01,1)}p.fromTo("transform","translateX("+s+")","translateX("+n+")");y.beforeClearStyles([r,"transform"]);var A=f===null||f===void 0?void 0:f.translucent;if(!A){y.fromTo(r,.01,"var(--opacity)")}else{y.fromTo("transform",l?"translateX(-100%)":"translateX(100%)","translateX(0px)")}if(!C){b.fromTo(r,.01,1)}if(g&&!C){var S=createAnimation();S.addElement(shadow(g).querySelector(".button-text")).fromTo("transform",l?"translateX(-100px)":"translateX(100px)","translateX(0px)");t.addAnimation(S)}}}));if(d){var w=createAnimation();var B=d.querySelector(":scope > ion-content");var L=d.querySelectorAll(":scope > ion-header > ion-toolbar");var P=d.querySelectorAll(":scope > ion-header > *:not(ion-toolbar), :scope > ion-footer > *");if(!B&&L.length===0&&P.length===0){w.addElement(d.querySelector(":scope > .ion-page, :scope > ion-nav, :scope > ion-tabs"))}else{w.addElement(B);w.addElement(P)}u.addAnimation(w);if(m){w.beforeClearStyles([r]).fromTo("transform","translateX("+n+")",l?"translateX(-100%)":"translateX(100%)");var R=getIonPageElement(d);u.afterAddWrite((function(){if(u.getDirection()==="normal"){R.style.setProperty("display","none")}}))}else{w.fromTo("transform","translateX("+n+")","translateX("+c+")").fromTo(r,1,i)}if(B){var I=shadow(B).querySelector(".transition-effect");if(I){var N=I.querySelector(".transition-cover");var W=I.querySelector(".transition-shadow");var j=createAnimation();var D=createAnimation();var O=createAnimation();j.addElement(I).beforeStyles({opacity:"1",display:"block"}).afterStyles({opacity:"",display:""});D.addElement(N).beforeClearStyles([r]).fromTo(r,.1,0);O.addElement(W).beforeClearStyles([r]).fromTo(r,.7,.03);j.addAnimation([D,O]);w.addAnimation([j])}}L.forEach((function(e){var t=createAnimation();t.addElement(e);var a=createAnimation();a.addElement(e.querySelector("ion-title"));var i=createAnimation();var s=e.querySelectorAll("ion-buttons,[menuToggle]");var f=e.closest("ion-header");var d=f&&f.classList.contains("header-collapse-condense-inactive");var v=Array.from(s).filter((function(e){var t=e.classList.contains("buttons-collapse");return t&&!d||!t}));i.addElement(v);var p=createAnimation();var y=e.querySelectorAll(":scope > *:not(ion-title):not(ion-buttons):not([menuToggle])");if(y.length>0){p.addElement(y)}var b=createAnimation();b.addElement(shadow(e).querySelector(".toolbar-background"));var g=createAnimation();var A=e.querySelector("ion-back-button");if(A){g.addElement(A)}t.addAnimation([a,i,p,g,b]);u.addAnimation(t);g.fromTo(r,.99,0);i.fromTo(r,.99,0);p.fromTo(r,.99,0);if(m){if(!d){a.fromTo("transform","translateX("+n+")",l?"translateX(-100%)":"translateX(100%)").fromTo(r,.99,0)}p.fromTo("transform","translateX("+n+")",l?"translateX(-100%)":"translateX(100%)");b.beforeClearStyles([r,"transform"]);var S=f===null||f===void 0?void 0:f.translucent;if(!S){b.fromTo(r,"var(--opacity)",0)}else{b.fromTo("transform","translateX(0px)",l?"translateX(-100%)":"translateX(100%)")}if(A&&!k){var T=createAnimation();T.addElement(shadow(A).querySelector(".button-text")).fromTo("transform","translateX("+n+")","translateX("+((l?-124:124)+"px")+")");t.addAnimation(T)}}else{if(!d){a.fromTo("transform","translateX("+n+")","translateX("+c+")").fromTo(r,.99,0).afterClearStyles([o,r])}p.fromTo("transform","translateX("+n+")","translateX("+c+")").afterClearStyles([o,r]);g.afterClearStyles([r]);a.afterClearStyles([r]);i.afterClearStyles([r])}}))}return u}catch(z){throw z}};export{iosTransitionAnimation,shadow};