cupertino-pane - npm Package Compare versions

Comparing version 1.2.6 to 1.2.7

CHANGELOG.md

@@ -5,2 +5,17 @@
 
+## [1.2.7] - 2021-05-08
+
+### Extra 
+- [Rich notifications live](https://jsbin.com/neqoxef)
+
+### Features
+- Functions `.present()` and `.destroy()` enhanced to using Promise like functins. [#144](https://github.com/roman-rr/cupertino-pane/issues/144)
+```js
+    await myPane.present({animate: true});
+    myPane.destroy({animate: true}).then(...);
+```
+
+### Bug Fixes 
+- Fixed slow drag gesture with velocity when first `touchmove` not firing
+
 ## [1.2.6] - 2021-03-18
@@ -7,0 +22,0 @@

dist/breakpoints.d.ts

@@ -23,3 +23,3 @@ import { CupertinoPane, CupertinoSettings } from './cupertino-pane';
      */
-    buildBreakpoints(conf?: PaneBreaks, lock?: boolean): Promise<void>;
+    buildBreakpoints(conf?: PaneBreaks, bottomOffset?: number): Promise<void>;
     getCurrentBreakName(): (string | null);
@@ -26,0 +26,0 @@ /**

dist/cupertino-pane.d.ts

@@ -1,2 +0,2 @@
-import { PaneSettings, PaneBreaks } from './models';
+import { PaneSettings, PaneBreaks, ZStackSettings } from './models';
 export declare type CupertinoSettings = Partial<PaneSettings>;
@@ -26,2 +26,3 @@ export declare class CupertinoPane {
     private breakpoints;
+    private zStackDefaults;
     constructor(selector: (string | HTMLElement), conf?: CupertinoSettings);
@@ -31,3 +32,3 @@ private drawBaseElements;
         animate: boolean;
-    }): Promise<void>;
+    }): Promise<CupertinoPane>;
     getPaneHeight(): number;
@@ -55,2 +56,3 @@ updateScreenHeights(): void;
     private getPushMulitplicator;
+    setZstackConfig(zStack: ZStackSettings): void;
     /**
@@ -82,3 +84,3 @@ * Backdrop
      */
-    setBreakpoints(conf?: PaneBreaks): Promise<void>;
+    setBreakpoints(conf?: PaneBreaks, bottomOffset?: number): Promise<void>;
     calcFitHeight(): Promise<any>;
@@ -94,3 +96,3 @@ moveToBreak(val: string): any;
         destroyButton?: boolean;
-    }): any;
+    }): Promise<true>;
     private pushTransition;
@@ -100,3 +102,3 @@ /***********************************
      */
-    doTransition(params?: any): void;
+    doTransition(params?: any): Promise<true>;
 }

dist/cupertino-pane.min.js

 /**
- * Cupertino Pane 1.2.6
+ * Cupertino Pane 1.2.7
  * Multi-functional panes and boards for next generation progressive applications
@@ -10,3 +10,3 @@ * https://github.com/roman-rr/cupertino-pane/
  *
- * Released on: March 18, 2021
+ * Released on: May 8, 2021
  */
@@ -29,3 +29,3 @@
 ***************************************************************************** */
-function __awaiter(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{h(i.next(t))}catch(t){r(t)}}function a(t){try{h(i.throw(t))}catch(t){r(t)}}function h(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,a)}h((i=i.apply(t,e||[])).next())}))}Object.defineProperty(exports,"__esModule",{value:!0});class Support{static get touch(){return window.Modernizr&&!0===window.Modernizr.touch||!!(window.navigator.maxTouchPoints>0||"ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch)}static get observer(){return"MutationObserver"in window||"WebkitMutationObserver"in window}static get backdropFilter(){return CSS.supports("backdrop-filter","blur(0px)")||CSS.supports("-webkit-backdrop-filter","blur(0px)")}static get passiveListener(){let t=!1;try{const e=Object.defineProperty({},"passive",{get(){t=!0}});window.addEventListener("testPassiveListener",null,e)}catch(t){}return t}static get gestures(){return"ongesturestart"in window}static get pointerEvents(){return!!window.PointerEvent&&"maxTouchPoints"in window.navigator&&window.navigator.maxTouchPoints>0}}class Device{constructor(){this.ios=!1,this.android=!1,this.androidChrome=!1,this.desktop=!1,this.iphone=!1,this.ipod=!1,this.ipad=!1,this.edge=!1,this.ie=!1,this.firefox=!1,this.macos=!1,this.windows=!1,this.cordova=!(!window.cordova&&!window.phonegap),this.phonegap=!(!window.cordova&&!window.phonegap),this.electron=!1,this.ionic=!!document.querySelector("ion-app");const t=window.navigator.platform,e=window.navigator.userAgent,s=window.screen.width,i=window.screen.height;let n=e.match(/(Android);?[\s\/]+([\d.]+)?/),r=e.match(/(iPad).*OS\s([\d_]+)/),o=e.match(/(iPod)(.*OS\s([\d_]+))?/),a=!this.ipad&&e.match(/(iPhone\sOS|iOS)\s([\d_]+)/),h=e.indexOf("MSIE ")>=0||e.indexOf("Trident/")>=0,l=e.indexOf("Edge/")>=0,p=e.indexOf("Gecko/")>=0&&e.indexOf("Firefox/")>=0,c="Win32"===t,d=e.toLowerCase().indexOf("electron")>=0,u="MacIntel"===t;!r&&u&&Support.touch&&(1024===s&&1366===i||834===s&&1194===i||834===s&&1112===i||768===s&&1024===i)&&(r=e.match(/(Version)\/([\d.]+)/),u=!1),this.ie=h,this.edge=l,this.firefox=p,n&&!c&&(this.os="android",this.osVersion=n[2],this.android=!0,this.androidChrome=e.toLowerCase().indexOf("chrome")>=0),(r||a||o)&&(this.os="ios",this.ios=!0),a&&!o&&(this.osVersion=a[2].replace(/_/g,"."),this.iphone=!0),r&&(this.osVersion=r[2].replace(/_/g,"."),this.ipad=!0),o&&(this.osVersion=o[3]?o[3].replace(/_/g,"."):null,this.ipod=!0),this.ios&&this.osVersion&&e.indexOf("Version/")>=0&&"10"===this.osVersion.split(".")[0]&&(this.osVersion=e.toLowerCase().split("version/")[1].split(" ")[0]),this.webView=!(!(a||r||o)||!e.match(/.*AppleWebKit(?!.*Safari)/i)&&!window.navigator.standalone)||window.matchMedia&&window.matchMedia("(display-mode: standalone)").matches,this.webview=this.webView,this.standalone=this.webView,this.desktop=!(this.ios||this.android)||d,this.desktop&&(this.electron=d,this.macos=u,this.windows=c,this.macos&&(this.os="macos"),this.windows&&(this.os="windows")),this.pixelRatio=window.devicePixelRatio||1}}class Events{constructor(t,e,s,i){this.instance=t,this.settings=e,this.device=s,this.breakpoints=i,this.allowClick=!0,this.disableDragAngle=!1,this.pointerDown=!1,this.contentScrollTop=0,this.steps=[],this.inputBluredbyMove=!1,this.movedByKeyboard=!1,this.touchEvents=(()=>{const t=["touchstart","touchmove","touchend","touchcancel"];let e=["mousedown","mousemove","mouseup"];Support.pointerEvents&&(e=["pointerdown","pointermove","pointerup"]);const s={start:t[0],move:t[1],end:t[2],cancel:t[3]},i={start:e[0],move:e[1],end:e[2]};return Support.touch||!this.settings.simulateTouch?s:i})(),this.touchStartCb=t=>this.touchStart(t),this.touchMoveBackdropCb=t=>this.touchMoveBackdrop(t),this.touchMoveCb=t=>this.touchMove(t),this.touchEndCb=t=>this.touchEnd(t),this.onClickCb=t=>this.onClick(t),this.onKeyboardShowCb=t=>this.onKeyboardShow(t),this.onKeyboardHideCb=t=>this.onKeyboardHide(t),this.onWindowResizeCb=t=>this.onWindowResize(t)}attachAllEvents(){this.settings.dragBy?this.settings.dragBy.forEach(t=>{const e=document.querySelector(t);e&&this.eventListeners("addEventListener",e)}):this.eventListeners("addEventListener",this.instance.paneEl),this.settings.handleKeyboard&&this.device.cordova&&(window.addEventListener("keyboardWillShow",this.onKeyboardShowCb),window.addEventListener("keyboardWillHide",this.onKeyboardHideCb)),!this.settings.handleKeyboard&&this.device.cordova&&this.device.android&&window.addEventListener("keyboardWillHide",()=>{this.instance.parentEl.scrollTop=0,this.instance.parentEl.parentElement&&(this.instance.parentEl.parentElement.scrollTop=0,this.instance.parentEl.parentElement.parentElement&&(this.instance.parentEl.parentElement.parentElement.scrollTop=0))}),window.addEventListener("resize",this.onWindowResizeCb)}detachAllEvents(){this.settings.dragBy?this.settings.dragBy.forEach(t=>{const e=document.querySelector(t);e&&this.eventListeners("removeEventListener",e)}):this.eventListeners("removeEventListener",this.instance.paneEl),this.settings.handleKeyboard&&this.device.cordova&&(window.removeEventListener("keyboardWillShow",this.onKeyboardShowCb),window.removeEventListener("keyboardWillHide",this.onKeyboardHideCb)),window.removeEventListener("resize",this.onWindowResizeCb)}resetEvents(){this.detachAllEvents(),this.attachAllEvents()}eventListeners(t,e){var s,i,n;if(!Support.touch&&Support.pointerEvents)e[t](this.touchEvents.start,this.touchStartCb,!1),e[t](this.touchEvents.move,this.touchMoveCb,!1),e[t](this.touchEvents.end,this.touchEndCb,!1),null===(s=this.instance.backdropEl)||void 0===s||s[t](this.touchEvents.move,this.touchMoveBackdropCb,!1);else{if(Support.touch){const s=!("touchstart"!==this.touchEvents.start||!Support.passiveListener||!this.settings.passiveListeners)&&{passive:!0,capture:!1};e[t](this.touchEvents.start,this.touchStartCb,s),e[t](this.touchEvents.move,this.touchMoveCb,!!Support.passiveListener&&{passive:!1,capture:!1}),e[t](this.touchEvents.end,this.touchEndCb,s),null===(i=this.instance.backdropEl)||void 0===i||i[t](this.touchEvents.move,this.touchMoveBackdropCb,!!Support.passiveListener&&{passive:!1,capture:!1}),this.touchEvents.cancel&&e[t](this.touchEvents.cancel,this.touchEndCb,s)}(this.settings.simulateTouch&&!this.device.ios&&!this.device.android||this.settings.simulateTouch&&!Support.touch&&this.device.ios)&&(e[t]("mousedown",this.touchStartCb,!1),e[t]("mousemove",this.touchMoveCb,!1),e[t]("mouseup",this.touchEndCb,!1),null===(n=this.instance.backdropEl)||void 0===n||n[t]("mousemove",this.touchMoveBackdropCb,!1))}this.settings.preventClicks&&e[t]("click",this.onClickCb,!0)}touchStart(t){if(this.settings.onDragStart(t),this.allowClick=!0,this.instance.disableDragEvents)return;this.disableDragAngle=!1,this.instance.preventedDismiss=!1;const{clientY:e,clientX:s}=this.getEvetClientYX(t,"touchstart");this.startY=e,this.startX=s,"mousedown"===t.type&&(this.pointerDown=!0),this.contentScrollTop&&this.willScrolled(t)&&this.isDragScrollabe(t.path||t.composedPath())&&(this.startY+=this.contentScrollTop),this.steps.push(this.startY)}touchMoveBackdrop(t){this.settings.touchMoveStopPropagation&&t.stopPropagation()}touchMove(t){const{clientY:e,clientX:s}=this.getEvetClientYX(t,"touchmove");if(t.delta=this.steps[0]-e,this.settings.onDrag(t),this.instance.disableDragEvents)return void(this.steps=[]);if(this.disableDragAngle)return;if(this.instance.preventedDismiss)return;if(this.settings.touchMoveStopPropagation&&t.stopPropagation(),"mousemove"===t.type&&!this.pointerDown)return;const i=e-this.steps[this.steps.length-1];let n=this.instance.getPanelTransformY()+i;if(!this.isFormElement(t.target)||!this.isElementScrollable(t.target)){if(this.steps.length>2&&this.isFormElement(document.activeElement)&&!this.isFormElement(t.target)&&(document.activeElement.blur(),this.inputBluredbyMove=!0),this.settings.touchAngle){let t;const i=s-this.startX,n=e-this.startY;if(t=180*Math.atan2(Math.abs(n),Math.abs(i))/Math.PI,i*i+n*n>=25&&90-t>this.settings.touchAngle&&1===this.steps.length)return void(this.disableDragAngle=!0)}if(this.isDragScrollabe(t.path||t.composedPath())&&"auto"===this.instance.overflowEl.style.overflowY){if(this.instance.overflowEl.addEventListener("scroll",t=>{this.contentScrollTop=t.target.scrollTop}),this.settings.inverse&&this.willScrolled(t))return void(this.contentScrollTop=0);if(n>this.breakpoints.topper&&this.contentScrollTop>0||n<=this.breakpoints.topper)return}if(!this.settings.inverse&&!this.settings.upperThanTop&&n<=this.breakpoints.topper)this.instance.paneEl.style.transform=`translateY(${this.breakpoints.topper}px) translateZ(0px)`;else{if(n<=this.breakpoints.topper&&this.settings.upperThanTop){const t=(-this.breakpoints.topper+this.breakpoints.topper-this.instance.getPanelTransformY())/this.breakpoints.topper/-8;n=this.instance.getPanelTransformY()+i*t}if((!this.settings.lowerThanBottom||this.settings.inverse)&&n>=this.breakpoints.bottomer)return this.instance.paneEl.style.transform=`translateY(${this.breakpoints.bottomer}px) translateZ(0px)`,void this.instance.checkOpacityAttr(n);if(!this.instance.preventedDismiss&&this.instance.preventDismissEvent&&this.settings.bottomClose){let t=(-this.breakpoints.topper+this.breakpoints.topper-this.instance.getPanelTransformY())/this.breakpoints.topper/-8;if(n=this.instance.getPanelTransformY()+i*(.5-t),-1*(e-220-this.instance.screen_height)<=this.instance.screen_height-this.breakpoints.bottomer)return this.instance.preventedDismiss=!0,this.settings.onWillDismiss({prevented:!0}),void this.instance.moveToBreak(this.breakpoints.prevBreakpoint)}this.allowClick=!1,this.instance.checkOpacityAttr(n),this.instance.checkOverflowAttr(n),this.instance.doTransition({type:"move",translateY:n}),this.steps.push(e)}}}touchEnd(t){if(this.instance.disableDragEvents)return;"mouseup"===t.type&&(this.pointerDown=!1);let e=this.breakpoints.getClosestBreakY();const s=this.steps[this.steps.length-1]-this.steps[this.steps.length-2],i=window.hasOwnProperty("cordova")?this.settings.fastSwipeSensivity+1:this.settings.fastSwipeSensivity;if(Math.abs(s)>=i&&(e=this.instance.swipeNextPoint(s,i,e),this.settings.fastSwipeClose&&this.breakpoints.currentBreakpoint<e))return void this.instance.destroy({animate:!0});let n=!1;this.isFormElement(document.activeElement)&&!this.isFormElement(t.target)&&2===this.steps.length&&(n=!0),this.steps=[],this.breakpoints.currentBreakpoint=e,this.settings.onDragEnd(t),isNaN(s)||n||(this.instance.checkOpacityAttr(this.breakpoints.currentBreakpoint),this.instance.checkOverflowAttr(this.breakpoints.currentBreakpoint),this.settings.bottomClose&&e===this.breakpoints.breaks.bottom?this.instance.destroy({animate:!0}):(this.instance.getPanelTransformY()===e&&this.settings.onTransitionEnd({target:this.instance.paneEl}),this.instance.doTransition({type:"end",translateY:e})))}onClick(t){if(this.allowClick){if(this.settings.clickBottomOpen&&this.breakpoints.breaks.bottom===this.instance.getPanelTransformY()){let t;this.settings.breaks.top.enabled&&(t="top"),this.settings.breaks.middle.enabled&&(t="middle"),this.instance.moveToBreak(t)}}else this.settings.preventClicks&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}onKeyboardShow(t){if(!this.isPaneDescendant(document.activeElement))return;if(!this.isOnViewport())return;this.device.android&&setTimeout(()=>this.fixAndroidResize(),20),this.movedByKeyboard=!0,this.breakpoints.prevBreakpoint=Object.entries(this.breakpoints.breaks).find(t=>t[1]===this.instance.getPanelTransformY())[0];let e=this.settings.breaks[this.instance.currentBreak()].height+t.keyboardHeight;window.matchMedia("(orientation: landscape)").matches&&(e=this.instance.screen_height),e>this.instance.screen_height-80&&(e=this.instance.screen_height-80),e-50>=this.settings.breaks[this.instance.currentBreak()].height&&this.instance.moveToHeight(e),setTimeout(()=>{this.instance.setOverflowHeight(t.keyboardHeight-this.settings.topperOverflowOffset),this.instance.overflowEl.scrollTop=document.activeElement.offsetTop},300)}onKeyboardHide(t){this.movedByKeyboard&&this.isOnViewport()&&(this.device.android&&this.fixAndroidResize(),this.movedByKeyboard=!1,this.instance.setOverflowHeight(),this.inputBluredbyMove?this.inputBluredbyMove=!1:this.instance.isHidden()||this.instance.moveToBreak(this.breakpoints.prevBreakpoint))}onWindowResize(t){return __awaiter(this,void 0,void 0,(function*(){yield new Promise(t=>setTimeout(()=>t(!0),150)),this.instance.updateScreenHeights(),this.breakpoints.buildBreakpoints(JSON.parse(this.breakpoints.lockedBreakpoints),!1)}))}getEvetClientYX(t,e){const s=t.type===e&&t.targetTouches&&(t.targetTouches[0]||t.changedTouches[0]);return{clientY:t.type===e?s.clientY:t.clientY,clientX:t.type===e?s.clientX:t.clientX}}fixAndroidResize(){if(!this.instance.paneEl)return;document.querySelector("ion-app");window.requestAnimationFrame(()=>{this.instance.wrapperEl.style.width="100%",this.instance.paneEl.style.position="absolute",window.requestAnimationFrame(()=>{this.instance.wrapperEl.style.width="unset",this.instance.paneEl.style.position="fixed"})})}isDragScrollabe(t){return!!t.find(t=>t===this.instance.overflowEl)}willScrolled(t){return!(!this.isElementScrollable(this.instance.overflowEl)||"hidden"===this.instance.overflowEl.style.overflow||!this.isDragScrollabe(t.path||t.composedPath()))}isPaneDescendant(t){let e=t.parentNode;for(;null!=e;){if(e==this.instance.paneEl)return!0;e=e.parentNode}return!1}isFormElement(t){return!!(t&&t.tagName&&["input","select","option","textarea","button","label"].includes(t.tagName.toLowerCase()))}isElementScrollable(t){return t.scrollHeight>t.clientHeight}isOnViewport(){return!this.instance.paneEl||0!==this.instance.paneEl.offsetWidth||0!==this.instance.paneEl.offsetHeight}}class Settings{constructor(){this.instance={initialBreak:"middle",inverse:!1,parentElement:null,followerElement:null,cssClass:null,fitHeight:!1,maxFitHeight:null,fitScreenHeight:!0,backdrop:!1,backdropOpacity:.4,animationType:"ease",animationDuration:300,dragBy:null,bottomOffset:0,bottomClose:!1,fastSwipeClose:!1,fastSwipeSensivity:3,freeMode:!1,buttonDestroy:!0,buttonClose:!0,topperOverflow:!0,topperOverflowOffset:0,lowerThanBottom:!0,upperThanTop:!1,showDraggable:!0,draggableOver:!1,clickBottomOpen:!0,preventClicks:!0,handleKeyboard:!0,simulateTouch:!0,passiveListeners:!0,touchMoveStopPropagation:!1,touchAngle:null,breaks:{},zStack:null,onDidDismiss:()=>{},onWillDismiss:()=>{},onDidPresent:()=>{},onWillPresent:()=>{},onDragStart:()=>{},onDrag:()=>{},onDragEnd:()=>{},onBackdropTap:()=>{},onTransitionStart:()=>{},onTransitionEnd:()=>{}}}}class Breakpoints{constructor(t,e){this.instance=t,this.settings=e,this.breaks={},this.calcHeightInProcess=!1,this.brs=[],this.defaultBreaksConf={top:{enabled:!0,height:window.innerHeight-47.25},middle:{enabled:!0,height:300},bottom:{enabled:!0,height:100}}}buildBreakpoints(t,e=!0){var s,i;return __awaiter(this,void 0,void 0,(function*(){if(this.breaks={top:this.instance.screenHeightOffset,middle:this.instance.screenHeightOffset,bottom:this.instance.screenHeightOffset},this.settings.fitHeight){this.settings.fitScreenHeight=!1,this.settings.initialBreak="top",this.settings.topperOverflow=!1;let e=yield this.getPaneFitHeight();this.settings.maxFitHeight&&e>this.settings.maxFitHeight&&(e=this.settings.maxFitHeight,this.settings.topperOverflow=!0),t={top:{enabled:!0,height:e},middle:{enabled:!1},bottom:{enabled:!1}}}if(["top","middle","bottom"].forEach(e=>{var s;this.breaks[e]-=this.settings.bottomOffset,this.settings.breaks[e]||(this.settings.breaks[e]=this.defaultBreaksConf[e]),t&&t[e]&&(this.settings.breaks[e]=t[e]),this.settings.fitScreenHeight&&((null===(s=this.settings.breaks[e])||void 0===s?void 0:s.height)>this.instance.screen_height&&(this.settings.breaks[e].height=this.instance.screen_height-this.settings.bottomOffset),this.settings.breaks.top&&this.settings.breaks.middle&&this.settings.breaks.top.height-50<=this.settings.breaks.middle.height&&(this.settings.breaks.middle.enabled=!1,this.settings.initialBreak="top")),this.settings.fitHeight&&"top"===e&&(this.settings.breaks[e].height>this.instance.screen_height?(this.settings.breaks[e].height=this.instance.screen_height-2*this.settings.bottomOffset,this.settings.topperOverflow=!0):this.instance.overflowEl&&!this.settings.maxFitHeight&&(this.settings.topperOverflow=!1,this.instance.overflowEl.style.overflowY="hidden")),this.settings.breaks[e]&&this.settings.breaks[e].enabled&&this.settings.breaks[e].height&&(this.settings.inverse?this.breaks[e]=this.settings.breaks[e].height:this.breaks[e]-=this.settings.breaks[e].height)}),this.lockedBreakpoints||(this.lockedBreakpoints=JSON.stringify(this.settings.breaks)),this.instance.isPanePresented()||this.settings.breaks[this.settings.initialBreak].enabled||console.warn("Cupertino Pane: Please set initialBreak for enabled breakpoint"),this.settings.breaks.middle.height>=this.settings.breaks.top.height&&console.warn("Cupertino Pane: Please set middle height lower than top height"),this.settings.breaks.middle.height<=this.settings.breaks.bottom.height&&console.warn("Cupertino Pane: Please set bottom height lower than middle height"),this.brs=[],["top","middle","bottom"].forEach(t=>{this.settings.breaks[t].enabled&&this.brs.push(this.breaks[t])}),this.topper=this.brs.reduce((t,e)=>e<t?e:t),this.bottomer=this.brs.reduce((t,e)=>Math.abs(e)>Math.abs(t)?e:t),this.instance.isPanePresented()||(this.currentBreakpoint=this.breaks[this.settings.initialBreak],!this.settings.inverse||this.settings.breaks.bottom.enabled||this.settings.breaks.middle.enabled||(this.settings.topperOverflow=!1)),this.instance.isPanePresented()){if((null===(s=this.settings.breaks[this.prevBreakpoint])||void 0===s?void 0:s.enabled)&&this.instance.moveToBreak(this.prevBreakpoint),!(null===(i=this.settings.breaks[this.prevBreakpoint])||void 0===i?void 0:i.enabled)){let t=this.instance.swipeNextPoint(1,1,this.getClosestBreakY());const e=Object.entries(this.breaks).find(e=>e[1]===t);this.instance.moveToBreak(e[0])}this.instance.paneEl.style.top=this.settings.inverse?`-${this.bottomer}px`:"unset",this.instance.paneEl.style.height=this.instance.getPaneHeight()+"px",this.instance.scrollElementInit(),this.instance.checkOpacityAttr(this.currentBreakpoint),this.instance.checkOverflowAttr(this.currentBreakpoint)}}))}getCurrentBreakName(){return this.breaks.top===this.currentBreakpoint?"top":this.breaks.middle===this.currentBreakpoint?"middle":this.breaks.bottom===this.currentBreakpoint?"bottom":null}getPaneFitHeight(){return __awaiter(this,void 0,void 0,(function*(){this.calcHeightInProcess=!0;let t,e=this.instance.el.querySelectorAll("img");this.instance.el.style.height="unset",this.instance.rendered||(this.instance.el.style.visibility="hidden",this.instance.el.style.pointerEvents="none",this.instance.el.style.display="block",this.instance.wrapperEl.style.visibility="hidden",this.instance.wrapperEl.style.pointerEvents="none",this.instance.wrapperEl.style.display="block");let s=[];return e.length&&(s=Array.from(e).map(t=>new Promise(e=>{t.complete&&t.naturalHeight?e(!0):t.onload=()=>e(!0)}))),s.push(new Promise(t=>setTimeout(()=>t(!0),this.instance.rendered?0:150))),yield Promise.all(s),t=parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("height"))+(parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("margin-top"))+parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("margin-bottom"))),t+=this.instance.el.offsetTop,this.instance.rendered||(this.instance.el.style.visibility="unset",this.instance.el.style.pointerEvents="unset",this.instance.el.style.display="none",this.instance.wrapperEl.style.visibility="unset",this.instance.wrapperEl.style.pointerEvents="unset",this.instance.wrapperEl.style.display="none"),this.calcHeightInProcess=!1,t}))}getClosestBreakY(){return this.brs.reduce((t,e)=>Math.abs(e-this.instance.getPanelTransformY())<Math.abs(t-this.instance.getPanelTransformY())?e:t)}}class CupertinoPane{constructor(t,e={}){this.selector=t,this.disableDragEvents=!1,this.preventDismissEvent=!1,this.preventedDismiss=!1,this.rendered=!1,this.settings=(new Settings).instance,this.device=new Device,this.swipeNextPoint=(t,e,s)=>{let i={},n={};if(this.settings.inverse?(i.top=this.breakpoints.breaks.bottom,i.middle=this.breakpoints.breaks.middle,i.bottom=this.breakpoints.breaks.top,n.top=Object.assign({},this.settings.breaks.bottom),n.middle=Object.assign({},this.settings.breaks.middle),n.bottom=Object.assign({},this.settings.breaks.top)):(i=Object.assign({},this.breakpoints.breaks),n=Object.assign({},this.settings.breaks)),this.breakpoints.currentBreakpoint===i.top){if(t>e){if(n.middle.enabled)return i.middle;if(n.bottom.enabled)return i.middle<s?s:i.bottom}return i.top}if(this.breakpoints.currentBreakpoint===i.middle)return t<-e&&n.top.enabled?i.top:t>e&&n.bottom.enabled?i.bottom:i.middle;if(this.breakpoints.currentBreakpoint===i.bottom){if(t<-e){if(n.middle.enabled)return i.middle>s?s:i.middle;if(n.top.enabled)return i.top}return i.bottom}return s},t instanceof HTMLElement?this.selector=t:this.selector=document.querySelector(t),this.selector?this.isPanePresented()?console.error("Cupertino Pane: specified selector or DOM element already in use",this.selector):(this.el=this.selector,this.el.style.display="none",this.settings=Object.assign(Object.assign({},this.settings),e),this.settings.parentElement?this.settings.parentElement=document.querySelector(this.settings.parentElement):this.settings.parentElement=this.el.parentElement,this.breakpoints=new Breakpoints(this,this.settings),this.events=new Events(this,this.settings,this.device,this.breakpoints)):console.warn("Cupertino Pane: wrong selector or DOM element specified",this.selector)}drawBaseElements(){this.parentEl=this.settings.parentElement,this.wrapperEl=document.createElement("div"),this.wrapperEl.classList.add("cupertino-pane-wrapper"),this.settings.inverse&&this.wrapperEl.classList.add("inverse"),this.settings.cssClass&&(this.wrapperEl.className+=" "+this.settings.cssClass);let t="";t+="\n      .cupertino-pane-wrapper {\n        display: none;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n    ",this.paneEl=document.createElement("div"),this.paneEl.style.transform=`translateY(${this.screenHeightOffset}px) translateZ(0px)`,this.paneEl.classList.add("pane"),t+="\n      .cupertino-pane-wrapper .pane {\n        position: fixed;\n        z-index: 11;\n        width: 100%;\n        max-width: 500px;\n        left: 0px;\n        right: 0px;\n        margin-left: auto;\n        margin-right: auto;\n        background: var(--cupertino-pane-background, #ffffff);\n        color: var(--cupertino-pane-color, #333333);\n        box-shadow: var(--cupertino-pane-shadow, 0 4px 16px rgba(0,0,0,.12));\n        will-change: transform;\n        padding-top: 15px; \n        border-radius: var(--cupertino-pane-border-radius, 20px) \n                       var(--cupertino-pane-border-radius, 20px) \n                       0 0;\n      }\n      .cupertino-pane-wrapper.inverse .pane {\n        padding-bottom: 15px; \n        border-radius: 0 0 20px 20px;\n        border-radius: 0 0\n                       var(--cupertino-pane-border-radius, 20px) \n                       var(--cupertino-pane-border-radius, 20px);\n      }\n    ",this.draggableEl=document.createElement("div"),this.draggableEl.classList.add("draggable"),this.settings.draggableOver&&this.draggableEl.classList.add("over"),t+="\n      .cupertino-pane-wrapper .draggable {\n        padding: 5px;\n        position: absolute;\n        left: 0;\n        right: 0;\n        margin-left: auto;\n        margin-right: auto;\n        height: 30px;\n        z-index: 12;\n        top: 0;\n        bottom: initial;\n      }\n      .cupertino-pane-wrapper .draggable.over {\n        top: -30px;\n        padding: 15px;\n      }\n      .cupertino-pane-wrapper.inverse .draggable {\n        bottom: 0;\n        top: initial;\n      }\n      .cupertino-pane-wrapper.inverse .draggable.over {\n        bottom: -30px;\n        top: initial;\n      }\n    ",this.moveEl=document.createElement("div"),this.moveEl.classList.add("move"),t+=`\n      .cupertino-pane-wrapper .move {\n        margin: 0 auto;\n        height: 5px;\n        background: var(--cupertino-pane-move-background, #c0c0c0);\n        width: 36px;\n        border-radius: 4px;\n      }\n      .cupertino-pane-wrapper .draggable.over .move {\n        width: 70px; \n        background: var(--cupertino-pane-move-background, rgba(225, 225, 225, 0.6));\n        ${Support.backdropFilter?"\n          backdrop-filter: saturate(180%) blur(20px);\n          -webkit-backdrop-filter: saturate(180%) blur(20px);\n        ":""}\n      }\n      .cupertino-pane-wrapper.inverse .move {\n        margin-top: 15px;\n      }\n      .cupertino-pane-wrapper.inverse .draggable.over .move {\n        margin-top: -5px;\n      }\n    `,this.destroyButtonEl=document.createElement("div"),this.destroyButtonEl.classList.add("destroy-button"),t+="\n      .cupertino-pane-wrapper .destroy-button {\n        width: 26px;\n        height: 26px;\n        position: absolute;\n        background: var(--cupertino-pane-destroy-button-background, #ebebeb);\n        fill: var(--cupertino-pane-icon-close-color, #7a7a7e);\n        right: 20px;\n        z-index: 14;\n        border-radius: 100%;\n        top: 16px;\n      }\n    ",this.contentEl=this.el,this.contentEl.style.transition=`opacity ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.contentEl.style.overflowX="hidden",t+="\n      .cupertino-pane-wrapper .backdrop {\n        overflow: hidden;\n        position: fixed;\n        width: 100%;\n        bottom: 0;\n        right: 0;\n        left: 0;\n        top: 0;\n        display: none;\n        z-index: 10;\n      }\n    ",this.addStyle(t),this.parentEl.appendChild(this.wrapperEl),this.wrapperEl.appendChild(this.paneEl),this.paneEl.appendChild(this.contentEl),this.settings.showDraggable&&(this.paneEl.appendChild(this.draggableEl),this.draggableEl.appendChild(this.moveEl))}present(t={animate:!1}){var e;return __awaiter(this,void 0,void 0,(function*(){if(this.el)if(this.isPanePresented()&&this.rendered)this.moveToBreak(this.settings.initialBreak);else if(!this.isPanePresented()||this.rendered){if(this.settings.onWillPresent(),this.updateScreenHeights(),this.drawBaseElements(),yield this.setBreakpoints(),this.paneEl.style.height=this.getPaneHeight()+"px",this.settings.inverse&&(this.paneEl.style.top=`-${this.breakpoints.bottomer}px`),this.wrapperEl.style.display="block",this.contentEl.style.display="block",this.wrapperEl.classList.add("rendered"),this.rendered=!0,this.settings.followerElement){if(!document.querySelector(this.settings.followerElement))return void console.warn("Cupertino Pane: wrong follower element selector specified",this.settings.followerElement);this.followerEl=document.querySelector(this.settings.followerElement),this.followerEl.style.willChange="transform, border-radius",this.followerEl.style.transform="translateY(0px) translateZ(0px)",this.followerEl.style.transition=`all ${this.settings.animationDuration}ms ${this.getTimingFunction(null===(e=this.settings.breaks[this.currentBreak()])||void 0===e?void 0:e.bounce)} 0s`}if(this.settings.zStack){let t={pushElements:null,minPushHeight:null,cardYOffset:0,cardZScale:.93,cardContrast:.85,stackZAngle:160};this.settings.zStack=Object.assign(Object.assign({},t),this.settings.zStack),this.setPushMultiplicators()}this.settings.buttonClose&&this.settings.buttonDestroy&&!this.settings.inverse&&(this.paneEl.appendChild(this.destroyButtonEl),this.destroyButtonEl.addEventListener("click",t=>this.destroy({animate:!0,destroyButton:!0})),this.destroyButtonEl.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">\n          <path d="M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z"/>\n        </svg>'),this.settings.bottomClose&&(this.settings.breaks.bottom.enabled=!0),this.settings.freeMode&&(this.settings.lowerThanBottom=!1),this.settings.backdrop&&this.renderBackdrop(),this.device.android&&(document.body.style.overscrollBehaviorY="none"),this.events.attachAllEvents(),t.animate?this.doTransition({type:"present",translateY:this.breakpoints.breaks[this.settings.initialBreak]}):(this.breakpoints.prevBreakpoint=this.settings.initialBreak,this.paneEl.style.transform=`translateY(${this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`,this.settings.backdrop&&(this.backdropEl.style.display="block"),this.settings.zStack&&this.settings.zStack.pushElements.forEach(t=>this.pushTransition(document.querySelector(t),this.breakpoints.breaks[this.settings.initialBreak],"unset")),this.settings.onDidPresent()),this.checkOpacityAttr(this.breakpoints.currentBreakpoint),yield new Promise(t=>setTimeout(()=>t(!0),150)),this.scrollElementInit(),this.checkOverflowAttr(this.breakpoints.currentBreakpoint)}else console.warn("Cupertino Pane: specified selector or DOM element already in use",this.selector)}))}getPaneHeight(){return this.settings.inverse?this.breakpoints.bottomer+this.settings.bottomOffset:this.screen_height-this.breakpoints.topper-this.settings.bottomOffset}updateScreenHeights(){this.settings.inverse?(this.screen_height=window.innerHeight,this.screenHeightOffset=0):(this.screen_height=window.innerHeight,this.screenHeightOffset=window.innerHeight)}scrollElementInit(){let t=this.el.querySelectorAll("[overflow-y]");!t.length||t.length>1?this.overflowEl=this.contentEl:(this.overflowEl=t[0],this.overflowEl.style.overflowX="hidden"),this.settings.topperOverflow&&(this.settings.upperThanTop&&console.warn('Cupertino Pane: "upperThanTop" allowed for disabled "topperOverflow"'),this.setOverflowHeight())}setOverflowHeight(t=0){this.settings.inverse?this.overflowEl.style.height=this.getPaneHeight()-30-this.settings.topperOverflowOffset-this.overflowEl.offsetTop+"px":this.overflowEl.style.height=this.getPaneHeight()-this.settings.topperOverflowOffset-this.overflowEl.offsetTop-t+"px"}checkOpacityAttr(t){let e=this.el.querySelectorAll("[hide-on-bottom]");e.length&&(this.settings.inverse||e.forEach(e=>{e.style.transition=`opacity ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,e.style.opacity=t>=this.breakpoints.breaks.bottom?"0":"1"}))}checkOverflowAttr(t){this.settings.topperOverflow&&this.overflowEl&&(this.settings.inverse?this.overflowEl.style.overflowY=t>=this.breakpoints.bottomer?"auto":"hidden":this.overflowEl.style.overflowY=t<=this.breakpoints.topper?"auto":"hidden")}isPanePresented(){let t=Array.from(document.querySelectorAll(".cupertino-pane-wrapper.rendered"));return!!t.length&&!!t.find(t=>t.contains(this.selector))}getTimingFunction(t){return t?"cubic-bezier(0.175, 0.885, 0.370, 1.120)":this.settings.animationType}isBackdropPresented(){return!!document.querySelector(".cupertino-pane-wrapper .backdrop")}renderBackdrop(){this.backdropEl=document.createElement("div"),this.backdropEl.classList.add("backdrop"),this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`,this.wrapperEl.appendChild(this.backdropEl),this.backdropEl.addEventListener("click",t=>this.settings.onBackdropTap())}addStyle(t){if(document.querySelector("#cupertino-panes-internal"))return;const e=document.createElement("style");e.id="cupertino-panes-internal",t=t.replace(/\s\s+/g," "),e.textContent=t,document.head.prepend(e)}setPushMultiplicators(){this.settings.zStack.pushElements.forEach(t=>{let e=document.querySelector(t),s=this.getPushMulitplicator(e);s=s?s+1:1,e.style.setProperty("--push-multiplicator",""+s)})}clearPushMultiplicators(){for(let t=0;t<this.settings.zStack.pushElements.length;t++){let e=document.querySelector(this.settings.zStack.pushElements[t]),s=this.getPushMulitplicator(e);s-=1,s?e.style.setProperty("--push-multiplicator",""+s):e.style.removeProperty("--push-multiplicator")}}getPushMulitplicator(t){let e=t.style.getPropertyValue("--push-multiplicator");return parseInt(e)}backdrop(t={show:!0}){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call backdrop()"),null;this.isBackdropPresented()||(this.renderBackdrop(),this.events.resetEvents());const e=()=>{this.backdropEl.style.transition="initial",this.backdropEl.style.display="none",this.backdropEl.removeEventListener("transitionend",e)};if(this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.backdropEl.style.backgroundColor="rgba(0,0,0,.0)",t.show)this.backdropEl.style.display="block",setTimeout(()=>{this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`},50);else{if("none"===this.backdropEl.style.display)return;this.backdropEl.addEventListener("transitionend",e)}}getPanelTransformY(){return parseFloat(/\.*translateY\((.*)px\)/i.exec(this.paneEl.style.transform)[1])}preventDismiss(t=!1){this.preventDismissEvent=t}disableDrag(){this.disableDragEvents=!0}enableDrag(){this.disableDragEvents=!1}setBreakpoints(t){return __awaiter(this,void 0,void 0,(function*(){!this.isPanePresented()||t?yield this.breakpoints.buildBreakpoints(t):console.warn("Cupertino Pane: Provide any breaks configuration")}))}calcFitHeight(){return __awaiter(this,void 0,void 0,(function*(){return this.wrapperEl&&this.el?this.breakpoints.calcHeightInProcess?(console.warn("Cupertino Pane: calcFitHeight() already in process"),null):void(yield this.breakpoints.buildBreakpoints(this.breakpoints.lockedBreakpoints)):null}))}moveToBreak(t){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call moveToBreak()"),null;this.settings.breaks[t].enabled?(this.checkOpacityAttr(this.breakpoints.breaks[t]),this.checkOverflowAttr(this.breakpoints.breaks[t]),this.doTransition({type:"breakpoint",translateY:this.breakpoints.breaks[t]}),this.breakpoints.currentBreakpoint=this.breakpoints.breaks[t]):console.warn("Cupertino Pane: %s breakpoint disabled",t)}moveToHeight(t){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call moveToHeight()"),null;let e=this.screenHeightOffset?this.screen_height-t:t;this.checkOpacityAttr(e),this.doTransition({type:"breakpoint",translateY:e})}hide(){return this.isPanePresented()?this.isHidden()?(console.warn("Cupertino Pane: Pane already hidden"),null):void this.doTransition({type:"hide",translateY:this.screenHeightOffset}):(console.warn("Cupertino Pane: Present pane before call hide()"),null)}isHidden(){return this.isPanePresented()?this.paneEl.style.transform===`translateY(${this.screenHeightOffset}px) translateZ(0px)`:(console.warn("Cupertino Pane: Present pane before call isHidden()"),null)}currentBreak(){return this.isPanePresented()?this.breakpoints.getCurrentBreakName():(console.warn("Cupertino Pane: Present pane before call currentBreak()"),null)}destroyResets(){this.parentEl.appendChild(this.contentEl),this.wrapperEl.remove(),this.events.detachAllEvents(),this.settings.zStack,delete this.rendered,delete this.breakpoints.prevBreakpoint,this.contentEl.style.display="none"}destroy(t={animate:!1,destroyButton:!1}){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call destroy()"),null;this.preventDismissEvent?this.preventedDismiss||(this.settings.onWillDismiss({prevented:!0}),this.moveToBreak(this.breakpoints.prevBreakpoint)):(this.settings.onWillDismiss(),t.animate?this.doTransition({type:"destroy",translateY:this.screenHeightOffset,destroyButton:t.destroyButton}):(this.destroyResets(),this.settings.onDidDismiss({destroyButton:t.destroyButton})))}pushTransition(t,e,s){let i=this.settings.zStack.pushElements;t.style.transition=s,e=this.screenHeightOffset-e;const n=this.settings.zStack.minPushHeight?this.settings.zStack.minPushHeight:this.screenHeightOffset-this.breakpoints.bottomer,r=this.screenHeightOffset-this.breakpoints.topper;let o=this.getPushMulitplicator(t),a=Math.pow(this.settings.zStack.cardZScale,o),h=Math.pow(this.settings.zStack.cardZScale,o-1),l=6+this.settings.zStack.cardYOffset,p=l*o*-1,c=p+l,d=Math.pow(this.settings.zStack.cardContrast,o),u=Math.pow(this.settings.zStack.cardContrast,o-1);const g=(s,n,r,o)=>{let a=Math.pow(s,this.settings.zStack.stackZAngle/100);t.style.transform=`translateY(${n*(a/s)}px) scale(${s})`,t.style.borderRadius=o+"px",t.style.filter=`contrast(${r})`;let h=document.querySelector(i[i.length-1]);e||t.className!==h.className||this.clearPushMultiplicators()};if(e<=n)return void g(h,c,u,0);const b=(t,s)=>{let i=-1*(r*s-n*t);return i-=(t-s)*e,i/=n-r,i>s&&(i=s),i<t&&(i=t),i};g(b(a,h),b(p,c),b(d,u),-1*b(-10,0))}doTransition(t={}){var e;if("move"===t.type)return this.paneEl.style.transition="all 0ms linear 0ms",this.paneEl.style.transform=`translateY(${t.translateY}px) translateZ(0px)`,this.followerEl&&(this.followerEl.style.transition="all 0ms linear 0ms",this.followerEl.style.transform=`translateY(${t.translateY-this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`),void(this.settings.zStack&&this.settings.zStack.pushElements.forEach(t=>this.pushTransition(document.querySelector(t),this.getPanelTransformY(),"all 0ms linear 0ms")));const s=()=>{"destroy"===t.type&&this.destroyResets(),this.paneEl.style.transition="initial",this.followerEl&&(this.followerEl.style.transition="initial"),this.settings.backdrop&&("destroy"!==t.type&&"hide"!==t.type||(this.backdropEl.style.transition="initial",this.backdropEl.style.display="none")),"present"===t.type&&this.settings.onDidPresent(),"destroy"===t.type&&this.settings.onDidDismiss({destroyButton:t.destroyButton}),this.settings.onTransitionEnd({target:document.body.contains(this.paneEl)?this.paneEl:null}),this.paneEl.removeEventListener("transitionend",s)};if("breakpoint"===t.type||"end"===t.type||"present"===t.type||"hide"===t.type||"destroy"===t.type){if(this.settings.backdrop&&(this.isHidden()||"hide"===t.type||"destroy"===t.type||"present"===t.type)&&(this.backdropEl.style.backgroundColor="rgba(0,0,0,.0)",this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,"hide"!==t.type&&"destroy"!==t.type&&(this.backdropEl.style.display="block",setTimeout(()=>{this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`},50))),"end"===t.type&&this.settings.freeMode)return;const i=Object.entries(this.settings.breaks).find(e=>e[1].height===this.screenHeightOffset-t.translateY),n=this.getTimingFunction(!(!i||!(null===(e=i[1])||void 0===e?void 0:e.bounce)));this.paneEl.style.transition=`transform ${this.settings.animationDuration}ms ${n} 0s`,this.followerEl&&(this.followerEl.style.transition=`transform ${this.settings.animationDuration}ms ${n} 0s`),this.settings.zStack&&setTimeout(()=>{this.settings.zStack.pushElements.forEach(e=>this.pushTransition(document.querySelector(e),t.translateY,`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`))},this.settings.zStack.cardYOffset&&"present"===t.type?50:0),setTimeout(()=>{this.settings.onTransitionStart({translateY:{new:t.translateY}}),this.paneEl.style.transform=`translateY(${t.translateY}px) translateZ(0px)`,this.followerEl&&(this.followerEl.style.transform=`translateY(${t.translateY-this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`)},"present"===t.type?50:0);let r=Object.entries(this.breakpoints.breaks).find(e=>e[1]===t.translateY);return r&&(this.breakpoints.prevBreakpoint=r[0]),void this.paneEl.addEventListener("transitionend",s)}}}exports.CupertinoPane=CupertinoPane;
+function __awaiter(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{h(i.next(t))}catch(t){r(t)}}function a(t){try{h(i.throw(t))}catch(t){r(t)}}function h(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,a)}h((i=i.apply(t,e||[])).next())}))}Object.defineProperty(exports,"__esModule",{value:!0});class Support{static get touch(){return window.Modernizr&&!0===window.Modernizr.touch||!!(window.navigator.maxTouchPoints>0||"ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch)}static get observer(){return"MutationObserver"in window||"WebkitMutationObserver"in window}static get backdropFilter(){return CSS.supports("backdrop-filter","blur(0px)")||CSS.supports("-webkit-backdrop-filter","blur(0px)")}static get passiveListener(){let t=!1;try{const e=Object.defineProperty({},"passive",{get(){t=!0}});window.addEventListener("testPassiveListener",null,e)}catch(t){}return t}static get gestures(){return"ongesturestart"in window}static get pointerEvents(){return!!window.PointerEvent&&"maxTouchPoints"in window.navigator&&window.navigator.maxTouchPoints>0}}class Device{constructor(){this.ios=!1,this.android=!1,this.androidChrome=!1,this.desktop=!1,this.iphone=!1,this.ipod=!1,this.ipad=!1,this.edge=!1,this.ie=!1,this.firefox=!1,this.macos=!1,this.windows=!1,this.cordova=!(!window.cordova&&!window.phonegap),this.phonegap=!(!window.cordova&&!window.phonegap),this.electron=!1,this.ionic=!!document.querySelector("ion-app");const t=window.navigator.platform,e=window.navigator.userAgent,s=window.screen.width,i=window.screen.height;let n=e.match(/(Android);?[\s\/]+([\d.]+)?/),r=e.match(/(iPad).*OS\s([\d_]+)/),o=e.match(/(iPod)(.*OS\s([\d_]+))?/),a=!this.ipad&&e.match(/(iPhone\sOS|iOS)\s([\d_]+)/),h=e.indexOf("MSIE ")>=0||e.indexOf("Trident/")>=0,l=e.indexOf("Edge/")>=0,p=e.indexOf("Gecko/")>=0&&e.indexOf("Firefox/")>=0,c="Win32"===t,d=e.toLowerCase().indexOf("electron")>=0,u="MacIntel"===t;!r&&u&&Support.touch&&(1024===s&&1366===i||834===s&&1194===i||834===s&&1112===i||768===s&&1024===i)&&(r=e.match(/(Version)\/([\d.]+)/),u=!1),this.ie=h,this.edge=l,this.firefox=p,n&&!c&&(this.os="android",this.osVersion=n[2],this.android=!0,this.androidChrome=e.toLowerCase().indexOf("chrome")>=0),(r||a||o)&&(this.os="ios",this.ios=!0),a&&!o&&(this.osVersion=a[2].replace(/_/g,"."),this.iphone=!0),r&&(this.osVersion=r[2].replace(/_/g,"."),this.ipad=!0),o&&(this.osVersion=o[3]?o[3].replace(/_/g,"."):null,this.ipod=!0),this.ios&&this.osVersion&&e.indexOf("Version/")>=0&&"10"===this.osVersion.split(".")[0]&&(this.osVersion=e.toLowerCase().split("version/")[1].split(" ")[0]),this.webView=!(!(a||r||o)||!e.match(/.*AppleWebKit(?!.*Safari)/i)&&!window.navigator.standalone)||window.matchMedia&&window.matchMedia("(display-mode: standalone)").matches,this.webview=this.webView,this.standalone=this.webView,this.desktop=!(this.ios||this.android)||d,this.desktop&&(this.electron=d,this.macos=u,this.windows=c,this.macos&&(this.os="macos"),this.windows&&(this.os="windows")),this.pixelRatio=window.devicePixelRatio||1}}class Events{constructor(t,e,s,i){this.instance=t,this.settings=e,this.device=s,this.breakpoints=i,this.allowClick=!0,this.disableDragAngle=!1,this.pointerDown=!1,this.contentScrollTop=0,this.steps=[],this.inputBluredbyMove=!1,this.movedByKeyboard=!1,this.touchEvents=(()=>{const t=["touchstart","touchmove","touchend","touchcancel"];let e=["mousedown","mousemove","mouseup"];Support.pointerEvents&&(e=["pointerdown","pointermove","pointerup"]);const s={start:t[0],move:t[1],end:t[2],cancel:t[3]},i={start:e[0],move:e[1],end:e[2]};return Support.touch||!this.settings.simulateTouch?s:i})(),this.touchStartCb=t=>this.touchStart(t),this.touchMoveBackdropCb=t=>this.touchMoveBackdrop(t),this.touchMoveCb=t=>this.touchMove(t),this.touchEndCb=t=>this.touchEnd(t),this.onClickCb=t=>this.onClick(t),this.onKeyboardShowCb=t=>this.onKeyboardShow(t),this.onKeyboardHideCb=t=>this.onKeyboardHide(t),this.onWindowResizeCb=t=>this.onWindowResize(t)}attachAllEvents(){this.settings.dragBy?this.settings.dragBy.forEach(t=>{const e=document.querySelector(t);e&&this.eventListeners("addEventListener",e)}):this.eventListeners("addEventListener",this.instance.paneEl),this.settings.handleKeyboard&&this.device.cordova&&(window.addEventListener("keyboardWillShow",this.onKeyboardShowCb),window.addEventListener("keyboardWillHide",this.onKeyboardHideCb)),!this.settings.handleKeyboard&&this.device.cordova&&this.device.android&&window.addEventListener("keyboardWillHide",()=>{this.instance.parentEl.scrollTop=0,this.instance.parentEl.parentElement&&(this.instance.parentEl.parentElement.scrollTop=0,this.instance.parentEl.parentElement.parentElement&&(this.instance.parentEl.parentElement.parentElement.scrollTop=0))}),window.addEventListener("resize",this.onWindowResizeCb)}detachAllEvents(){this.settings.dragBy?this.settings.dragBy.forEach(t=>{const e=document.querySelector(t);e&&this.eventListeners("removeEventListener",e)}):this.eventListeners("removeEventListener",this.instance.paneEl),this.settings.handleKeyboard&&this.device.cordova&&(window.removeEventListener("keyboardWillShow",this.onKeyboardShowCb),window.removeEventListener("keyboardWillHide",this.onKeyboardHideCb)),window.removeEventListener("resize",this.onWindowResizeCb)}resetEvents(){this.detachAllEvents(),this.attachAllEvents()}eventListeners(t,e){var s,i,n;if(!Support.touch&&Support.pointerEvents)e[t](this.touchEvents.start,this.touchStartCb,!1),e[t](this.touchEvents.move,this.touchMoveCb,!1),e[t](this.touchEvents.end,this.touchEndCb,!1),null===(s=this.instance.backdropEl)||void 0===s||s[t](this.touchEvents.move,this.touchMoveBackdropCb,!1);else{if(Support.touch){const s=!("touchstart"!==this.touchEvents.start||!Support.passiveListener||!this.settings.passiveListeners)&&{passive:!0,capture:!1};e[t](this.touchEvents.start,this.touchStartCb,s),e[t](this.touchEvents.move,this.touchMoveCb,!!Support.passiveListener&&{passive:!1,capture:!1}),e[t](this.touchEvents.end,this.touchEndCb,s),null===(i=this.instance.backdropEl)||void 0===i||i[t](this.touchEvents.move,this.touchMoveBackdropCb,!!Support.passiveListener&&{passive:!1,capture:!1}),this.touchEvents.cancel&&e[t](this.touchEvents.cancel,this.touchEndCb,s)}(this.settings.simulateTouch&&!this.device.ios&&!this.device.android||this.settings.simulateTouch&&!Support.touch&&this.device.ios)&&(e[t]("mousedown",this.touchStartCb,!1),e[t]("mousemove",this.touchMoveCb,!1),e[t]("mouseup",this.touchEndCb,!1),null===(n=this.instance.backdropEl)||void 0===n||n[t]("mousemove",this.touchMoveBackdropCb,!1))}this.settings.preventClicks&&e[t]("click",this.onClickCb,!0)}touchStart(t){if(this.settings.onDragStart(t),this.allowClick=!0,this.instance.disableDragEvents)return;this.disableDragAngle=!1,this.instance.preventedDismiss=!1;const{clientY:e,clientX:s}=this.getEvetClientYX(t,"touchstart");this.startY=e,this.startX=s,"mousedown"===t.type&&(this.pointerDown=!0),this.contentScrollTop&&this.willScrolled(t)&&this.isDragScrollabe(t.path||t.composedPath())&&(this.startY+=this.contentScrollTop),this.steps.push({posY:this.startY,time:Date.now()})}touchMoveBackdrop(t){this.settings.touchMoveStopPropagation&&t.stopPropagation()}touchMove(t){var e;const{clientY:s,clientX:i,velocityY:n}=this.getEvetClientYX(t,"touchmove");if(t.delta=(null===(e=this.steps[0])||void 0===e?void 0:e.posY)-s,this.settings.onDrag(t),this.instance.disableDragEvents)return void(this.steps=[]);if(this.disableDragAngle)return;if(this.instance.preventedDismiss)return;if(this.settings.touchMoveStopPropagation&&t.stopPropagation(),"mousemove"===t.type&&!this.pointerDown)return;const r=s-this.steps[this.steps.length-1].posY;let o=this.instance.getPanelTransformY()+(this.steps.length<2?r*n:r);if(!this.isFormElement(t.target)||!this.isElementScrollable(t.target)){if(this.steps.length>2&&this.isFormElement(document.activeElement)&&!this.isFormElement(t.target)&&(document.activeElement.blur(),this.inputBluredbyMove=!0),this.settings.touchAngle){let t;const e=i-this.startX,n=s-this.startY;if(t=180*Math.atan2(Math.abs(n),Math.abs(e))/Math.PI,e*e+n*n>=25&&90-t>this.settings.touchAngle&&1===this.steps.length)return void(this.disableDragAngle=!0)}if(this.isDragScrollabe(t.path||t.composedPath())&&"auto"===this.instance.overflowEl.style.overflowY){if(this.instance.overflowEl.addEventListener("scroll",t=>{this.contentScrollTop=t.target.scrollTop}),this.settings.inverse&&this.willScrolled(t))return void(this.contentScrollTop=0);if(!this.settings.inverse&&(o>this.breakpoints.topper&&this.contentScrollTop>0||o<=this.breakpoints.topper))return}if(this.settings.inverse){if(o>=this.breakpoints.topper&&this.settings.upperThanTop){const t=this.instance.screen_height-this.instance.screenHeightOffset,e=(t-this.instance.getPanelTransformY())/(t-this.breakpoints.topper)/8;o=this.instance.getPanelTransformY()+r*e}if(!this.settings.upperThanTop&&o>=this.breakpoints.topper)return void(this.instance.paneEl.style.transform=`translateY(${this.breakpoints.topper}px) translateZ(0px)`)}else{if(!this.settings.upperThanTop&&o<=this.breakpoints.topper)return void(this.instance.paneEl.style.transform=`translateY(${this.breakpoints.topper}px) translateZ(0px)`);if(o<=this.breakpoints.topper&&this.settings.upperThanTop){const t=this.instance.screen_height-this.instance.screenHeightOffset,e=(t-this.instance.getPanelTransformY())/(t-this.breakpoints.topper)/8;o=this.instance.getPanelTransformY()+r*e}if(!this.settings.lowerThanBottom&&o>=this.breakpoints.bottomer)return this.instance.paneEl.style.transform=`translateY(${this.breakpoints.bottomer}px) translateZ(0px)`,void this.instance.checkOpacityAttr(o)}if(!this.instance.preventedDismiss&&this.instance.preventDismissEvent&&this.settings.bottomClose){let t=(-this.breakpoints.topper+this.breakpoints.topper-this.instance.getPanelTransformY())/this.breakpoints.topper/-8;if(o=this.instance.getPanelTransformY()+r*(.5-t),-1*(s-220-this.instance.screen_height)<=this.instance.screen_height-this.breakpoints.bottomer)return this.instance.preventedDismiss=!0,this.settings.onWillDismiss({prevented:!0}),void this.instance.moveToBreak(this.breakpoints.prevBreakpoint)}this.allowClick=!1,this.instance.checkOpacityAttr(o),this.instance.checkOverflowAttr(o),this.instance.doTransition({type:"move",translateY:o}),this.steps.push({posY:s,time:Date.now()})}}touchEnd(t){var e,s;if(this.instance.disableDragEvents)return;"mouseup"===t.type&&(this.pointerDown=!1);let i=this.breakpoints.getClosestBreakY();const n=(null===(e=this.steps[this.steps.length-1])||void 0===e?void 0:e.posY)-(null===(s=this.steps[this.steps.length-2])||void 0===s?void 0:s.posY),r=window.hasOwnProperty("cordova")?this.settings.fastSwipeSensivity+2:this.settings.fastSwipeSensivity;if(Math.abs(n)>=r&&(i=this.instance.swipeNextPoint(n,r,i),this.settings.fastSwipeClose&&this.breakpoints.currentBreakpoint<i))return void this.instance.destroy({animate:!0});let o=!1;this.isFormElement(document.activeElement)&&!this.isFormElement(t.target)&&2===this.steps.length&&(o=!0),this.steps=[],this.breakpoints.currentBreakpoint=i,this.settings.onDragEnd(t),isNaN(n)||o||(this.instance.checkOpacityAttr(this.breakpoints.currentBreakpoint),this.instance.checkOverflowAttr(this.breakpoints.currentBreakpoint),this.settings.bottomClose&&i===this.breakpoints.breaks.bottom?this.instance.destroy({animate:!0}):(this.instance.getPanelTransformY()===i&&this.settings.onTransitionEnd({target:this.instance.paneEl}),this.instance.doTransition({type:"end",translateY:i})))}onClick(t){if(this.allowClick){if(this.settings.clickBottomOpen&&this.breakpoints.breaks.bottom===this.instance.getPanelTransformY()){let t;this.settings.breaks.top.enabled&&(t="top"),this.settings.breaks.middle.enabled&&(t="middle"),this.instance.moveToBreak(t)}}else this.settings.preventClicks&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}onKeyboardShow(t){if(!this.isPaneDescendant(document.activeElement))return;if(!this.isOnViewport())return;this.device.android&&setTimeout(()=>this.fixAndroidResize(),20),this.movedByKeyboard=!0,this.breakpoints.prevBreakpoint=Object.entries(this.breakpoints.breaks).find(t=>t[1]===this.instance.getPanelTransformY())[0];let e=this.settings.breaks[this.instance.currentBreak()].height+t.keyboardHeight;window.matchMedia("(orientation: landscape)").matches&&(e=this.instance.screen_height),e>this.instance.screen_height-80&&(e=this.instance.screen_height-80),e-50>=this.settings.breaks[this.instance.currentBreak()].height&&this.instance.moveToHeight(e),setTimeout(()=>{this.instance.setOverflowHeight(t.keyboardHeight-this.settings.topperOverflowOffset),this.instance.overflowEl.scrollTop=document.activeElement.offsetTop},300)}onKeyboardHide(t){this.movedByKeyboard&&this.isOnViewport()&&(this.device.android&&this.fixAndroidResize(),this.movedByKeyboard=!1,this.instance.setOverflowHeight(),this.inputBluredbyMove?this.inputBluredbyMove=!1:this.instance.isHidden()||this.instance.moveToBreak(this.breakpoints.prevBreakpoint))}onWindowResize(t){return __awaiter(this,void 0,void 0,(function*(){yield new Promise(t=>setTimeout(()=>t(!0),150)),this.instance.updateScreenHeights(),this.breakpoints.buildBreakpoints(JSON.parse(this.breakpoints.lockedBreakpoints))}))}getEvetClientYX(t,e){var s,i;const n=t.type===e&&t.targetTouches&&(t.targetTouches[0]||t.changedTouches[0]),r=t.type===e?n.clientY:t.clientY,o=t.type===e?n.clientX:t.clientX,a=Date.now()-((null===(s=this.steps[this.steps.length-1])||void 0===s?void 0:s.time)||0);return{clientY:r,clientX:o,velocityY:Math.abs(r-((null===(i=this.steps[this.steps.length-1])||void 0===i?void 0:i.posY)||0))/a}}fixAndroidResize(){if(!this.instance.paneEl)return;document.querySelector("ion-app");window.requestAnimationFrame(()=>{this.instance.wrapperEl.style.width="100%",this.instance.paneEl.style.position="absolute",window.requestAnimationFrame(()=>{this.instance.wrapperEl.style.width="unset",this.instance.paneEl.style.position="fixed"})})}isDragScrollabe(t){return!!t.find(t=>t===this.instance.overflowEl)}willScrolled(t){return!(!this.isElementScrollable(this.instance.overflowEl)||"hidden"===this.instance.overflowEl.style.overflow||!this.isDragScrollabe(t.path||t.composedPath()))}isPaneDescendant(t){let e=t.parentNode;for(;null!=e;){if(e==this.instance.paneEl)return!0;e=e.parentNode}return!1}isFormElement(t){return!!(t&&t.tagName&&["input","select","option","textarea","button","label"].includes(t.tagName.toLowerCase()))}isElementScrollable(t){return t.scrollHeight>t.clientHeight}isOnViewport(){return!this.instance.paneEl||0!==this.instance.paneEl.offsetWidth||0!==this.instance.paneEl.offsetHeight}}class Settings{constructor(){this.instance={initialBreak:"middle",inverse:!1,parentElement:null,followerElement:null,cssClass:null,fitHeight:!1,maxFitHeight:null,fitScreenHeight:!0,backdrop:!1,backdropOpacity:.4,animationType:"ease",animationDuration:300,dragBy:null,bottomOffset:0,bottomClose:!1,fastSwipeClose:!1,fastSwipeSensivity:3,freeMode:!1,buttonDestroy:!0,buttonClose:!0,topperOverflow:!0,topperOverflowOffset:0,lowerThanBottom:!0,upperThanTop:!1,showDraggable:!0,draggableOver:!1,clickBottomOpen:!0,preventClicks:!0,handleKeyboard:!0,simulateTouch:!0,passiveListeners:!0,touchMoveStopPropagation:!1,touchAngle:null,breaks:{},zStack:null,onDidDismiss:()=>{},onWillDismiss:()=>{},onDidPresent:()=>{},onWillPresent:()=>{},onDragStart:()=>{},onDrag:()=>{},onDragEnd:()=>{},onBackdropTap:()=>{},onTransitionStart:()=>{},onTransitionEnd:()=>{}}}}class Breakpoints{constructor(t,e){this.instance=t,this.settings=e,this.breaks={},this.calcHeightInProcess=!1,this.brs=[],this.defaultBreaksConf={top:{enabled:!0,height:window.innerHeight-47.25},middle:{enabled:!0,height:300},bottom:{enabled:!0,height:100}}}buildBreakpoints(t,e=0){var s,i,n,r,o;return __awaiter(this,void 0,void 0,(function*(){if(this.settings.bottomOffset=e||this.settings.bottomOffset,this.breaks={top:this.instance.screenHeightOffset,middle:this.instance.screenHeightOffset,bottom:this.instance.screenHeightOffset},this.settings.fitHeight){this.settings.fitScreenHeight=!1,this.settings.initialBreak="top",this.settings.topperOverflow=!1;let e=yield this.getPaneFitHeight();this.settings.maxFitHeight&&e>this.settings.maxFitHeight&&(e=this.settings.maxFitHeight,this.settings.topperOverflow=!0),(t={top:{enabled:!0,height:e},middle:{enabled:!1}}).top.bounce=null===(i=null===(s=this.settings.breaks)||void 0===s?void 0:s.top)||void 0===i?void 0:i.bounce,t.bottom=(null===(n=this.settings.breaks)||void 0===n?void 0:n.bottom)||{enabled:!0,height:0}}if(["top","middle","bottom"].forEach(e=>{var s;this.breaks[e]-=this.settings.bottomOffset,this.settings.breaks[e]||(this.settings.breaks[e]=this.defaultBreaksConf[e]),t&&t[e]&&(this.settings.breaks[e]=t[e]),this.settings.fitScreenHeight&&((null===(s=this.settings.breaks[e])||void 0===s?void 0:s.height)>this.instance.screen_height&&(this.settings.breaks[e].height=this.instance.screen_height-this.settings.bottomOffset),this.settings.breaks.top&&this.settings.breaks.middle&&this.settings.breaks.top.height-50<=this.settings.breaks.middle.height&&(this.settings.breaks.middle.enabled=!1,this.settings.initialBreak="top")),this.settings.fitHeight&&"top"===e&&(this.settings.breaks[e].height>this.instance.screen_height?(this.settings.breaks[e].height=this.instance.screen_height-2*this.settings.bottomOffset,this.settings.topperOverflow=!0):this.instance.overflowEl&&!this.settings.maxFitHeight&&(this.settings.topperOverflow=!1,this.instance.overflowEl.style.overflowY="hidden")),this.settings.breaks[e]&&this.settings.breaks[e].enabled&&this.settings.breaks[e].height&&(this.settings.inverse?this.breaks[e]=this.settings.breaks[e].height+this.settings.bottomOffset:this.breaks[e]-=this.settings.breaks[e].height)}),this.lockedBreakpoints||(this.lockedBreakpoints=JSON.stringify(this.settings.breaks)),this.instance.isPanePresented()||this.settings.breaks[this.settings.initialBreak].enabled||console.warn("Cupertino Pane: Please set initialBreak for enabled breakpoint"),this.settings.breaks.middle.height>=this.settings.breaks.top.height&&console.warn("Cupertino Pane: Please set middle height lower than top height"),this.settings.breaks.middle.height<=this.settings.breaks.bottom.height&&console.warn("Cupertino Pane: Please set bottom height lower than middle height"),this.brs=[],["top","middle","bottom"].forEach(t=>{this.settings.breaks[t].enabled&&this.brs.push(this.breaks[t])}),this.topper=this.brs.reduce((t,e)=>e<t?e:t),this.bottomer=this.brs.reduce((t,e)=>Math.abs(e)>Math.abs(t)?e:t),this.settings.inverse&&(this.topper=this.bottomer),this.instance.isPanePresented()||(this.currentBreakpoint=this.breaks[this.settings.initialBreak],!this.settings.inverse||this.settings.breaks.bottom.enabled||this.settings.breaks.middle.enabled||(this.settings.topperOverflow=!1)),this.instance.isPanePresented()){if((null===(r=this.settings.breaks[this.prevBreakpoint])||void 0===r?void 0:r.enabled)&&this.instance.moveToBreak(this.prevBreakpoint),!(null===(o=this.settings.breaks[this.prevBreakpoint])||void 0===o?void 0:o.enabled)){let t=this.instance.swipeNextPoint(1,1,this.getClosestBreakY());const e=Object.entries(this.breaks).find(e=>e[1]===t);this.instance.moveToBreak(e[0])}this.instance.paneEl.style.top=this.settings.inverse?`-${this.bottomer-this.settings.bottomOffset}px`:"unset",this.instance.paneEl.style.height=this.instance.getPaneHeight()+"px",this.instance.scrollElementInit(),this.instance.checkOpacityAttr(this.currentBreakpoint),this.instance.checkOverflowAttr(this.currentBreakpoint)}}))}getCurrentBreakName(){return this.breaks.top===this.currentBreakpoint?"top":this.breaks.middle===this.currentBreakpoint?"middle":this.breaks.bottom===this.currentBreakpoint?"bottom":null}getPaneFitHeight(){return __awaiter(this,void 0,void 0,(function*(){this.calcHeightInProcess=!0;let t,e=this.instance.el.querySelectorAll("img");this.instance.el.style.height="unset",this.instance.rendered||(this.instance.el.style.visibility="hidden",this.instance.el.style.pointerEvents="none",this.instance.el.style.display="block",this.instance.wrapperEl.style.visibility="hidden",this.instance.wrapperEl.style.pointerEvents="none",this.instance.wrapperEl.style.display="block");let s=[];e.length&&(s=Array.from(e).map(t=>new Promise(e=>{t.complete&&t.naturalHeight?e(!0):t.onload=()=>e(!0)}))),s.push(new Promise(t=>setTimeout(()=>t(!0),this.instance.rendered?0:150))),yield Promise.all(s);let i=parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("height")),n=parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("margin-top"))+parseInt(document.defaultView.getComputedStyle(this.instance.el,"").getPropertyValue("margin-bottom")),r=parseInt(document.defaultView.getComputedStyle(this.instance.el.parentElement,"").getPropertyValue("padding-bottom"));return t=i+n,t+=this.instance.el.offsetTop,t+=r,this.instance.rendered||(this.instance.el.style.visibility="unset",this.instance.el.style.pointerEvents="unset",this.instance.el.style.display="none",this.instance.wrapperEl.style.visibility="unset",this.instance.wrapperEl.style.pointerEvents="unset",this.instance.wrapperEl.style.display="none"),this.calcHeightInProcess=!1,t}))}getClosestBreakY(){return this.brs.reduce((t,e)=>Math.abs(e-this.instance.getPanelTransformY())<Math.abs(t-this.instance.getPanelTransformY())?e:t)}}class CupertinoPane{constructor(t,e={}){this.selector=t,this.disableDragEvents=!1,this.preventDismissEvent=!1,this.preventedDismiss=!1,this.rendered=!1,this.settings=(new Settings).instance,this.device=new Device,this.zStackDefaults={pushElements:null,minPushHeight:null,cardYOffset:0,cardZScale:.93,cardContrast:.85,stackZAngle:160},this.swipeNextPoint=(t,e,s)=>{let i={},n={};if(this.settings.inverse?(i.top=this.breakpoints.breaks.bottom,i.middle=this.breakpoints.breaks.middle,i.bottom=this.breakpoints.breaks.top,n.top=Object.assign({},this.settings.breaks.bottom),n.middle=Object.assign({},this.settings.breaks.middle),n.bottom=Object.assign({},this.settings.breaks.top)):(i=Object.assign({},this.breakpoints.breaks),n=Object.assign({},this.settings.breaks)),this.breakpoints.currentBreakpoint===i.top){if(t>e){if(n.middle.enabled)return i.middle;if(n.bottom.enabled)return i.middle<s?s:i.bottom}return i.top}if(this.breakpoints.currentBreakpoint===i.middle)return t<-e&&n.top.enabled?i.top:t>e&&n.bottom.enabled?i.bottom:i.middle;if(this.breakpoints.currentBreakpoint===i.bottom){if(t<-e){if(n.middle.enabled)return i.middle>s?s:i.middle;if(n.top.enabled)return i.top}return i.bottom}return s},t instanceof HTMLElement?this.selector=t:this.selector=document.querySelector(t),this.selector?this.isPanePresented()?console.error("Cupertino Pane: specified selector or DOM element already in use",this.selector):(this.el=this.selector,this.el.style.display="none",this.settings=Object.assign(Object.assign({},this.settings),e),this.settings.parentElement?this.settings.parentElement=document.querySelector(this.settings.parentElement):this.settings.parentElement=this.el.parentElement,this.breakpoints=new Breakpoints(this,this.settings),this.events=new Events(this,this.settings,this.device,this.breakpoints)):console.warn("Cupertino Pane: wrong selector or DOM element specified",this.selector)}drawBaseElements(){this.parentEl=this.settings.parentElement,this.wrapperEl=document.createElement("div"),this.wrapperEl.classList.add("cupertino-pane-wrapper"),this.settings.inverse&&this.wrapperEl.classList.add("inverse"),this.settings.cssClass&&(this.wrapperEl.className+=" "+this.settings.cssClass);let t="";t+="\n      .cupertino-pane-wrapper {\n        display: none;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n    ",this.paneEl=document.createElement("div"),this.paneEl.style.transform=`translateY(${this.screenHeightOffset}px) translateZ(0px)`,this.paneEl.classList.add("pane"),t+="\n      .cupertino-pane-wrapper .pane {\n        position: fixed;\n        z-index: 11;\n        width: 100%;\n        max-width: 500px;\n        left: 0px;\n        right: 0px;\n        margin-left: auto;\n        margin-right: auto;\n        background: var(--cupertino-pane-background, #ffffff);\n        color: var(--cupertino-pane-color, #333333);\n        box-shadow: var(--cupertino-pane-shadow, 0 4px 16px rgba(0,0,0,.12));\n        will-change: transform;\n        padding-top: 15px; \n        border-radius: var(--cupertino-pane-border-radius, 20px) \n                       var(--cupertino-pane-border-radius, 20px) \n                       0 0;\n      }\n      .cupertino-pane-wrapper.inverse .pane {\n        padding-bottom: 15px; \n        border-radius: 0 0 20px 20px;\n        border-radius: 0 0\n                       var(--cupertino-pane-border-radius, 20px) \n                       var(--cupertino-pane-border-radius, 20px);\n      }\n    ",this.draggableEl=document.createElement("div"),this.draggableEl.classList.add("draggable"),this.settings.draggableOver&&this.draggableEl.classList.add("over"),t+="\n      .cupertino-pane-wrapper .draggable {\n        padding: 5px;\n        position: absolute;\n        left: 0;\n        right: 0;\n        margin-left: auto;\n        margin-right: auto;\n        height: 30px;\n        z-index: 12;\n        top: 0;\n        bottom: initial;\n      }\n      .cupertino-pane-wrapper .draggable.over {\n        top: -30px;\n        padding: 15px;\n      }\n      .cupertino-pane-wrapper.inverse .draggable {\n        bottom: 0;\n        top: initial;\n      }\n      .cupertino-pane-wrapper.inverse .draggable.over {\n        bottom: -30px;\n        top: initial;\n      }\n    ",this.moveEl=document.createElement("div"),this.moveEl.classList.add("move"),t+=`\n      .cupertino-pane-wrapper .move {\n        margin: 0 auto;\n        height: 5px;\n        background: var(--cupertino-pane-move-background, #c0c0c0);\n        width: 36px;\n        border-radius: 4px;\n      }\n      .cupertino-pane-wrapper .draggable.over .move {\n        width: 70px; \n        background: var(--cupertino-pane-move-background, rgba(225, 225, 225, 0.6));\n        ${Support.backdropFilter?"\n          backdrop-filter: saturate(180%) blur(20px);\n          -webkit-backdrop-filter: saturate(180%) blur(20px);\n        ":""}\n      }\n      .cupertino-pane-wrapper.inverse .move {\n        margin-top: 15px;\n      }\n      .cupertino-pane-wrapper.inverse .draggable.over .move {\n        margin-top: -5px;\n      }\n    `,this.destroyButtonEl=document.createElement("div"),this.destroyButtonEl.classList.add("destroy-button"),t+="\n      .cupertino-pane-wrapper .destroy-button {\n        width: 26px;\n        height: 26px;\n        position: absolute;\n        background: var(--cupertino-pane-destroy-button-background, #ebebeb);\n        fill: var(--cupertino-pane-icon-close-color, #7a7a7e);\n        right: 20px;\n        z-index: 14;\n        border-radius: 100%;\n        top: 16px;\n      }\n    ",this.contentEl=this.el,this.contentEl.style.transition=`opacity ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.contentEl.style.overflowX="hidden",t+="\n      .cupertino-pane-wrapper .backdrop {\n        overflow: hidden;\n        position: fixed;\n        width: 100%;\n        bottom: 0;\n        right: 0;\n        left: 0;\n        top: 0;\n        display: none;\n        z-index: 10;\n      }\n    ",this.addStyle(t),this.parentEl.appendChild(this.wrapperEl),this.wrapperEl.appendChild(this.paneEl),this.paneEl.appendChild(this.contentEl),this.settings.showDraggable&&(this.paneEl.appendChild(this.draggableEl),this.draggableEl.appendChild(this.moveEl))}present(t={animate:!1}){var e;return __awaiter(this,void 0,void 0,(function*(){if(this.el)if(this.isPanePresented()&&this.rendered)this.moveToBreak(this.settings.initialBreak);else{if(!this.isPanePresented()||this.rendered){if(this.settings.onWillPresent(),this.updateScreenHeights(),this.drawBaseElements(),yield this.setBreakpoints(),this.paneEl.style.height=this.getPaneHeight()+"px",this.settings.inverse&&(this.paneEl.style.top=`-${this.breakpoints.bottomer-this.settings.bottomOffset}px`),this.wrapperEl.style.display="block",this.contentEl.style.display="block",this.wrapperEl.classList.add("rendered"),this.rendered=!0,this.settings.followerElement){if(!document.querySelector(this.settings.followerElement))return void console.warn("Cupertino Pane: wrong follower element selector specified",this.settings.followerElement);this.followerEl=document.querySelector(this.settings.followerElement),this.followerEl.style.willChange="transform, border-radius",this.followerEl.style.transform="translateY(0px) translateZ(0px)",this.followerEl.style.transition=`all ${this.settings.animationDuration}ms ${this.getTimingFunction(null===(e=this.settings.breaks[this.currentBreak()])||void 0===e?void 0:e.bounce)} 0s`}return this.settings.zStack&&(this.setZstackConfig(this.settings.zStack),this.setPushMultiplicators()),this.settings.buttonClose&&this.settings.buttonDestroy&&!this.settings.inverse&&(this.paneEl.appendChild(this.destroyButtonEl),this.destroyButtonEl.addEventListener("click",t=>this.destroy({animate:!0,destroyButton:!0})),this.destroyButtonEl.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">\n          <path d="M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z"/>\n        </svg>'),this.settings.bottomClose&&(this.settings.breaks.bottom.enabled=!0),this.settings.freeMode&&(this.settings.lowerThanBottom=!1),this.settings.backdrop&&this.renderBackdrop(),this.checkOpacityAttr(this.breakpoints.currentBreakpoint),this.device.android&&(document.body.style.overscrollBehaviorY="none"),this.events.attachAllEvents(),t.animate?yield this.doTransition({type:"present",translateY:this.breakpoints.breaks[this.settings.initialBreak]}):(this.breakpoints.prevBreakpoint=this.settings.initialBreak,this.paneEl.style.transform=`translateY(${this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`,this.settings.backdrop&&(this.backdropEl.style.display="block"),this.settings.zStack&&this.settings.zStack.pushElements.forEach(t=>this.pushTransition(document.querySelector(t),this.breakpoints.breaks[this.settings.initialBreak],"unset")),this.settings.onDidPresent()),yield new Promise(t=>setTimeout(()=>t(!0),150)),this.scrollElementInit(),this.checkOverflowAttr(this.breakpoints.currentBreakpoint),this}console.warn("Cupertino Pane: specified selector or DOM element already in use",this.selector)}}))}getPaneHeight(){return this.settings.inverse?this.breakpoints.bottomer-this.settings.bottomOffset:this.screen_height-this.breakpoints.topper-this.settings.bottomOffset}updateScreenHeights(){this.settings.inverse?(this.screen_height=window.innerHeight,this.screenHeightOffset=0):(this.screen_height=window.innerHeight,this.screenHeightOffset=window.innerHeight)}scrollElementInit(){let t=this.el.querySelectorAll("[overflow-y]");!t.length||t.length>1?this.overflowEl=this.contentEl:(this.overflowEl=t[0],this.overflowEl.style.overflowX="hidden"),this.settings.topperOverflow&&(this.settings.upperThanTop&&console.warn('Cupertino Pane: "upperThanTop" allowed for disabled "topperOverflow"'),this.setOverflowHeight())}setOverflowHeight(t=0){this.settings.inverse?this.overflowEl.style.height=this.getPaneHeight()-30-this.settings.topperOverflowOffset-this.overflowEl.offsetTop+"px":this.overflowEl.style.height=this.getPaneHeight()-this.settings.topperOverflowOffset-this.overflowEl.offsetTop-t+"px"}checkOpacityAttr(t){let e=this.el.querySelectorAll("[hide-on-bottom]");e.length&&(this.settings.inverse||e.forEach(e=>{e.style.transition=`opacity ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,e.style.opacity=t>=this.breakpoints.breaks.bottom?"0":"1"}))}checkOverflowAttr(t){this.settings.topperOverflow&&this.overflowEl&&(this.settings.inverse?this.overflowEl.style.overflowY=t>=this.breakpoints.bottomer?"auto":"hidden":this.overflowEl.style.overflowY=t<=this.breakpoints.topper?"auto":"hidden")}isPanePresented(){let t=Array.from(document.querySelectorAll(".cupertino-pane-wrapper.rendered"));return!!t.length&&!!t.find(t=>t.contains(this.selector))}getTimingFunction(t){return t?"cubic-bezier(0.175, 0.885, 0.370, 1.120)":this.settings.animationType}isBackdropPresented(){return!!document.querySelector(".cupertino-pane-wrapper .backdrop")}renderBackdrop(){this.backdropEl=document.createElement("div"),this.backdropEl.classList.add("backdrop"),this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`,this.wrapperEl.appendChild(this.backdropEl),this.backdropEl.addEventListener("click",t=>this.settings.onBackdropTap())}addStyle(t){if(document.querySelector("#cupertino-panes-internal"))return;const e=document.createElement("style");e.id="cupertino-panes-internal",t=t.replace(/\s\s+/g," "),e.textContent=t,document.head.prepend(e)}setPushMultiplicators(){this.settings.zStack.pushElements.forEach(t=>{let e=document.querySelector(t),s=this.getPushMulitplicator(e);s=s?s+1:1,e.style.setProperty("--push-multiplicator",""+s)})}clearPushMultiplicators(){for(let t=0;t<this.settings.zStack.pushElements.length;t++){let e=document.querySelector(this.settings.zStack.pushElements[t]),s=this.getPushMulitplicator(e);s-=1,s?e.style.setProperty("--push-multiplicator",""+s):e.style.removeProperty("--push-multiplicator")}}getPushMulitplicator(t){let e=t.style.getPropertyValue("--push-multiplicator");return parseInt(e)}setZstackConfig(t){this.settings.zStack=t?Object.assign(Object.assign({},this.zStackDefaults),t):null}backdrop(t={show:!0}){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call backdrop()"),null;this.isBackdropPresented()||(this.renderBackdrop(),this.events.resetEvents());const e=()=>{this.backdropEl.style.transition="initial",this.backdropEl.style.display="none",this.backdropEl.removeEventListener("transitionend",e)};if(this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,this.backdropEl.style.backgroundColor="rgba(0,0,0,.0)",t.show)this.backdropEl.style.display="block",setTimeout(()=>{this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`},50);else{if("none"===this.backdropEl.style.display)return;this.backdropEl.addEventListener("transitionend",e)}}getPanelTransformY(){return parseFloat(/\.*translateY\((.*)px\)/i.exec(this.paneEl.style.transform)[1])}preventDismiss(t=!1){this.preventDismissEvent=t}disableDrag(){this.disableDragEvents=!0}enableDrag(){this.disableDragEvents=!1}setBreakpoints(t,e){return __awaiter(this,void 0,void 0,(function*(){!this.isPanePresented()||t?yield this.breakpoints.buildBreakpoints(t,e):console.warn("Cupertino Pane: Provide any breaks configuration")}))}calcFitHeight(){return __awaiter(this,void 0,void 0,(function*(){return this.wrapperEl&&this.el?this.breakpoints.calcHeightInProcess?(console.warn("Cupertino Pane: calcFitHeight() already in process"),null):void(yield this.breakpoints.buildBreakpoints(this.breakpoints.lockedBreakpoints)):null}))}moveToBreak(t){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call moveToBreak()"),null;this.settings.breaks[t].enabled?(this.checkOpacityAttr(this.breakpoints.breaks[t]),this.checkOverflowAttr(this.breakpoints.breaks[t]),this.doTransition({type:"breakpoint",translateY:this.breakpoints.breaks[t]}),this.breakpoints.currentBreakpoint=this.breakpoints.breaks[t]):console.warn("Cupertino Pane: %s breakpoint disabled",t)}moveToHeight(t){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call moveToHeight()"),null;let e=this.screenHeightOffset?this.screen_height-t:t;this.checkOpacityAttr(e),this.doTransition({type:"breakpoint",translateY:e})}hide(){return this.isPanePresented()?this.isHidden()?(console.warn("Cupertino Pane: Pane already hidden"),null):void this.doTransition({type:"hide",translateY:this.screenHeightOffset}):(console.warn("Cupertino Pane: Present pane before call hide()"),null)}isHidden(){return this.isPanePresented()?this.paneEl.style.transform===`translateY(${this.screenHeightOffset}px) translateZ(0px)`:(console.warn("Cupertino Pane: Present pane before call isHidden()"),null)}currentBreak(){return this.isPanePresented()?this.breakpoints.getCurrentBreakName():(console.warn("Cupertino Pane: Present pane before call currentBreak()"),null)}destroyResets(){this.parentEl.appendChild(this.contentEl),this.wrapperEl.remove(),this.events.detachAllEvents(),this.settings.zStack,delete this.rendered,delete this.breakpoints.prevBreakpoint,this.contentEl.style.display="none"}destroy(t={animate:!1,destroyButton:!1}){return __awaiter(this,void 0,void 0,(function*(){if(!this.isPanePresented())return console.warn("Cupertino Pane: Present pane before call destroy()"),null;this.preventDismissEvent?this.preventedDismiss||(this.settings.onWillDismiss({prevented:!0}),this.moveToBreak(this.breakpoints.prevBreakpoint)):(this.settings.onWillDismiss(),t.animate?yield this.doTransition({type:"destroy",translateY:this.screenHeightOffset,destroyButton:t.destroyButton}):(this.destroyResets(),this.settings.onDidDismiss({destroyButton:t.destroyButton})))}))}pushTransition(t,e,s){let i=this.settings.zStack.pushElements;t.style.transition=s,e=this.screenHeightOffset-e;const n=this.settings.zStack.minPushHeight?this.settings.zStack.minPushHeight:this.screenHeightOffset-this.breakpoints.bottomer,r=this.screenHeightOffset-this.breakpoints.topper;let o=this.getPushMulitplicator(t),a=Math.pow(this.settings.zStack.cardZScale,o),h=Math.pow(this.settings.zStack.cardZScale,o-1),l=6+this.settings.zStack.cardYOffset,p=l*o*-1,c=p+l,d=Math.pow(this.settings.zStack.cardContrast,o),u=Math.pow(this.settings.zStack.cardContrast,o-1);const g=(s,n,r,o)=>{let a=Math.pow(s,this.settings.zStack.stackZAngle/100);t.style.transform=`translateY(${n*(a/s)}px) scale(${s})`,t.style.borderRadius=o+"px",t.style.filter=`contrast(${r})`;let h=document.querySelector(i[i.length-1]);e||t.className!==h.className||this.clearPushMultiplicators()};if(e<=n)return void g(h,c,u,0);const b=(t,s)=>{let i=-1*(r*s-n*t);return i-=(t-s)*e,i/=n-r,i>s&&(i=s),i<t&&(i=t),i};g(b(a,h),b(p,c),b(d,u),-1*b(-10,0))}doTransition(t={}){return new Promise(e=>{var s;if("move"===t.type)return this.paneEl.style.transition="all 0ms linear 0ms",this.paneEl.style.transform=`translateY(${t.translateY}px) translateZ(0px)`,this.followerEl&&(this.followerEl.style.transition="all 0ms linear 0ms",this.followerEl.style.transform=`translateY(${t.translateY-this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`),this.settings.zStack&&this.settings.zStack.pushElements.forEach(t=>this.pushTransition(document.querySelector(t),this.getPanelTransformY(),"all 0ms linear 0ms")),e(!0);const i=()=>("destroy"===t.type&&this.destroyResets(),this.paneEl.style.transition="initial",this.followerEl&&(this.followerEl.style.transition="initial"),this.settings.backdrop&&("destroy"!==t.type&&"hide"!==t.type||(this.backdropEl.style.transition="initial",this.backdropEl.style.display="none")),"present"===t.type&&this.settings.onDidPresent(),"destroy"===t.type&&this.settings.onDidDismiss({destroyButton:t.destroyButton}),this.settings.onTransitionEnd({target:document.body.contains(this.paneEl)?this.paneEl:null}),this.paneEl.removeEventListener("transitionend",i),e(!0));if("breakpoint"===t.type||"end"===t.type||"present"===t.type||"hide"===t.type||"destroy"===t.type){if(this.settings.backdrop&&(this.isHidden()||"hide"===t.type||"destroy"===t.type||"present"===t.type)&&(this.backdropEl.style.backgroundColor="rgba(0,0,0,.0)",this.backdropEl.style.transition=`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`,"hide"!==t.type&&"destroy"!==t.type&&(this.backdropEl.style.display="block",setTimeout(()=>{this.backdropEl.style.backgroundColor=`rgba(0,0,0, ${this.settings.backdropOpacity})`},50))),"end"===t.type&&this.settings.freeMode)return e(!0);const n=Object.entries(this.breakpoints.breaks).find(e=>e[1]===t.translateY);let r=n&&(null===(s=this.settings.breaks[n[0]])||void 0===s?void 0:s.bounce);const o=this.getTimingFunction(r);this.paneEl.style.transition=`transform ${this.settings.animationDuration}ms ${o} 0s`,this.followerEl&&(this.followerEl.style.transition=`transform ${this.settings.animationDuration}ms ${o} 0s`),this.settings.zStack&&setTimeout(()=>{this.settings.zStack.pushElements.forEach(e=>this.pushTransition(document.querySelector(e),t.translateY,`all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`))},this.settings.zStack.cardYOffset&&"present"===t.type?50:0),setTimeout(()=>{this.settings.onTransitionStart({translateY:{new:t.translateY}}),this.paneEl.style.transform=`translateY(${t.translateY}px) translateZ(0px)`,this.followerEl&&(this.followerEl.style.transform=`translateY(${t.translateY-this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`)},"present"===t.type?50:0);let a=Object.entries(this.breakpoints.breaks).find(e=>e[1]===t.translateY);a&&(this.breakpoints.prevBreakpoint=a[0]),this.paneEl.addEventListener("transitionend",i)}})}}exports.CupertinoPane=CupertinoPane;
 //# sourceMappingURL=cupertino-pane.min.js.map

package.json

 {
   "name": "cupertino-pane",
   "description": "Multi-functional panes and boards for next generation progressive applications",
-  "version": "1.2.6",
+  "version": "1.2.7",
   "author": "Roman Antonov (roman-rr)",
@@ -6,0 +6,0 @@ "homepage": "https://github.com/roman-rr/cupertino-pane/",

README.md

@@ -58,14 +58,6 @@ <p align="center">
 
-<a href="https://opencollective.com/cupertino-pane/organization/0/website"><img src="https://opencollective.com/cupertino-pane/organization/0/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/1/website"><img src="https://opencollective.com/cupertino-pane/organization/1/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/2/website"><img src="https://opencollective.com/cupertino-pane/organization/2/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/3/website"><img src="https://opencollective.com/cupertino-pane/organization/3/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/4/website"><img src="https://opencollective.com/cupertino-pane/organization/4/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/5/website"><img src="https://opencollective.com/cupertino-pane/organization/5/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/6/website"><img src="https://opencollective.com/cupertino-pane/organization/6/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/7/website"><img src="https://opencollective.com/cupertino-pane/organization/7/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/8/website"><img src="https://opencollective.com/cupertino-pane/organization/8/avatar.svg"></a>
-<a href="https://opencollective.com/cupertino-pane/organization/9/website"><img src="https://opencollective.com/cupertino-pane/organization/9/avatar.svg"></a>
+<a href="https://opencollective.com/cupertino-pane"><img src="https://opencollective.com/cupertino-pane/organizations.svg?width=890"></a>
 
 ## Demonstration
+- [Rich notifications live](https://jsbin.com/neqoxef)
 - [Base live](https://output.jsbin.com/fuhisey)
@@ -155,3 +147,3 @@ - [Overflow top live](https://output.jsbin.com/baguroy)
     );
-    myPane.present({animate: true});
+    myPane.present({animate: true}).then(res => {...});
   };
@@ -166,3 +158,3 @@ </script>
   var myPane = new CupertinoPane('.cupertino-pane', { /* ... */ });
-  myPane.present({animate: true});
+  myPane.present({animate: true}).then(...);
 });
@@ -177,3 +169,3 @@ ```
 let myPane = new CupertinoPane('.cupertino-pane', settings);
-    myPane.present({animate: true});
+    await myPane.present({animate: true});
 ```
@@ -286,4 +278,4 @@
 ## Public Methods
-### present({animate: **boolean = false**})
-Will render pane DOM and show pane with setted params.
+### present({animate: **boolean = false**}): Promise<CupertinoPane>
+Will render pane DOM and show pane with setted params. 
 ```javascript
@@ -307,3 +299,3 @@ myPane.present();
 ```
-### destroy({animate: **boolean = false**})
+### destroy({animate: **boolean = false**}): Promise<CupertinoPane>
 Remove pane from DOM and clear styles
@@ -431,3 +423,3 @@ ```javascript
 Project under regularly maintanance and bug fixes. 
-All **new features** and **new investigations** moved to open collective (Goals)[https://opencollective.com/cupertino-pane/conversations/all-goals-and-featured-packages-o60ddaqg]
+All **new features** and **new investigations** moved to open collective [Goals](https://opencollective.com/cupertino-pane/conversations/all-goals-and-featured-packages-o60ddaqg)
 
@@ -434,0 +426,0 @@ ## Contributors

src/breakpoints.ts

@@ -32,3 +32,4 @@ import { CupertinoPane, CupertinoSettings } from './cupertino-pane';
    */  
-  public async buildBreakpoints(conf?: PaneBreaks, lock: boolean = true) {
+  public async buildBreakpoints(conf?: PaneBreaks, bottomOffset: number = 0) {
+    this.settings.bottomOffset = bottomOffset || this.settings.bottomOffset;
     this.breaks = {
@@ -56,5 +57,6 @@ top: this.instance.screenHeightOffset,
         top: { enabled: true, height },
-        middle: { enabled: false},
-        bottom: { enabled: false}
+        middle: { enabled: false }
       };
+      conf.top.bounce = this.settings.breaks?.top?.bounce;
+      conf.bottom = this.settings.breaks?.bottom || { enabled: true, height: 0 };
     }
@@ -90,3 +92,3 @@
 
-      // fitHeight (bullet-in styles fir screen)
+      // fitHeight (bullet-in styles for screen)
       if (this.settings.fitHeight && val === 'top') {
@@ -108,7 +110,7 @@ if (this.settings.breaks[val].height > this.instance.screen_height) {
           && this.settings.breaks[val].height) {
-            if (!this.settings.inverse) {
-              this.breaks[val] -= this.settings.breaks[val].height;
-            } else {
-              this.breaks[val] = this.settings.breaks[val].height;
-            }
+        if (!this.settings.inverse) {
+          this.breaks[val] -= this.settings.breaks[val].height;
+        } else {
+          this.breaks[val] = this.settings.breaks[val].height + this.settings.bottomOffset;
+        }
       }
@@ -151,7 +153,9 @@ });
     });
+    
+    if (this.settings.inverse) {
+      this.topper = this.bottomer;
+    }
 
     if (!this.instance.isPanePresented()) {
       this.currentBreakpoint = this.breaks[this.settings.initialBreak];
-
-            
       // Disable overflow for top bulletin
@@ -179,3 +183,4 @@ if (this.settings.inverse
       // Re-calc height and top
-      this.instance.paneEl.style.top = this.settings.inverse ? `-${this.bottomer}px` : `unset`;
+      this.instance.paneEl.style.top = this.settings.inverse 
+        ? `-${this.bottomer - this.settings.bottomOffset}px` : `unset`;
       this.instance.paneEl.style.height = `${this.instance.getPaneHeight()}px`;
@@ -243,4 +248,6 @@
     let elmMargin = parseInt(document.defaultView.getComputedStyle(this.instance.el, '').getPropertyValue('margin-top')) + parseInt(document.defaultView.getComputedStyle(this.instance.el, '').getPropertyValue('margin-bottom'));
+    let panePaddingBottom = parseInt(document.defaultView.getComputedStyle(this.instance.el.parentElement, '').getPropertyValue('padding-bottom'));
     height = elmHeight + elmMargin
-    height += this.instance.el.offsetTop;
+    height += this.instance.el.offsetTop; // From top to element
+    height += panePaddingBottom; // From element to bottom
 
@@ -247,0 +254,0 @@ // Hide elements back

src/cupertino-pane.ts

@@ -34,2 +34,11 @@ import { Support } from './support';
 
+  private zStackDefaults: ZStackSettings = {
+    pushElements: null,
+    minPushHeight: null,
+    cardYOffset: 0,
+    cardZScale: 0.93,
+    cardContrast: 0.85,
+    stackZAngle: 160,
+  };
+
   constructor(private selector: (string | HTMLElement), 
@@ -237,3 +246,3 @@ conf: CupertinoSettings = {}) {
 
-  async present(conf: {animate: boolean} = {animate: false}) {
+  async present(conf: {animate: boolean} = {animate: false}): Promise<CupertinoPane> {
       if (!this.el) return;
@@ -263,3 +272,3 @@
       if (this.settings.inverse) {
-        this.paneEl.style.top = `-${this.breakpoints.bottomer}px`;
+        this.paneEl.style.top = `-${this.breakpoints.bottomer - this.settings.bottomOffset}px`;
       }
@@ -289,12 +298,3 @@
       if (this.settings.zStack) {
-          // Default zStacks
-        let zStackDefaults: ZStackSettings = {
-          pushElements: null,
-          minPushHeight: null,
-          cardYOffset: 0,
-          cardZScale: 0.93,
-          cardContrast: 0.85,
-          stackZAngle: 160,
-        };
-        this.settings.zStack = {...zStackDefaults, ...this.settings.zStack};
+        this.setZstackConfig(this.settings.zStack);
         this.setPushMultiplicators();
@@ -322,3 +322,4 @@ }
       }
-
+      this.checkOpacityAttr(this.breakpoints.currentBreakpoint);
+      
       /****** Fix android issues *******/
@@ -335,3 +336,3 @@ if (this.device.android) {
       if (conf.animate) {
-        this.doTransition({type: 'present', translateY: this.breakpoints.breaks[this.settings.initialBreak]}); 
+        await this.doTransition({type: 'present', translateY: this.breakpoints.breaks[this.settings.initialBreak]}); 
       } else {
@@ -356,4 +357,2 @@ // No initial transitions
 
-      this.checkOpacityAttr(this.breakpoints.currentBreakpoint);
-
       // Some timeout to get offsetTop
@@ -363,2 +362,4 @@ await new Promise((resolve) => setTimeout(() => resolve(true), 150));
       this.checkOverflowAttr(this.breakpoints.currentBreakpoint);
+
+      return this;
   }
@@ -370,3 +371,4 @@
     } 
-    return this.breakpoints.bottomer + this.settings.bottomOffset;
+
+    return this.breakpoints.bottomer - this.settings.bottomOffset;
   }
@@ -564,2 +566,6 @@
   }
+
+  public setZstackConfig(zStack: ZStackSettings): void {
+    this.settings.zStack = zStack ? {...this.zStackDefaults, ...zStack} : null;;
+  }
   
@@ -638,3 +644,3 @@ /**
    */
-  public async setBreakpoints(conf?: PaneBreaks) {
+  public async setBreakpoints(conf?: PaneBreaks, bottomOffset?: number) {
     if (this.isPanePresented() && !conf) {
@@ -644,4 +650,3 @@ console.warn(`Cupertino Pane: Provide any breaks configuration`);
     }
-    
-    await this.breakpoints.buildBreakpoints(conf);
+    await this.breakpoints.buildBreakpoints(conf, bottomOffset);
   }
@@ -743,3 +748,3 @@
 
-  public destroy(conf: {
+  public async destroy(conf: {
       animate: boolean, 
@@ -750,3 +755,3 @@ destroyButton?: boolean
       destroyButton: false
-    }) {
+    }): Promise<true> {
 
@@ -773,3 +778,3 @@ if (!this.isPanePresented()) {
     if (conf.animate) {
-      this.doTransition({type: 'destroy', translateY: this.screenHeightOffset, destroyButton: conf.destroyButton}); 
+      await this.doTransition({type: 'destroy', translateY: this.screenHeightOffset, destroyButton: conf.destroyButton}); 
     } else {
@@ -847,138 +852,139 @@ this.destroyResets();
    */
-  public doTransition(params:any = {}): void {
-    // touchmove simple event
-    if (params.type === 'move') {
-      this.paneEl.style.transition = 'all 0ms linear 0ms';
-      this.paneEl.style.transform = `translateY(${params.translateY}px) translateZ(0px)`;
-      // Bind for follower same transitions
-      if (this.followerEl) {
-        this.followerEl.style.transition = 'all 0ms linear 0ms';
-        this.followerEl.style.transform = `translateY(${params.translateY - this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`;
-      }
+  public doTransition(params:any = {}): Promise<true> {
+    return new Promise((resolve) => {
+      // touchmove simple event
+      if (params.type === 'move') {
+        this.paneEl.style.transition = 'all 0ms linear 0ms';
+        this.paneEl.style.transform = `translateY(${params.translateY}px) translateZ(0px)`;
+        // Bind for follower same transitions
+        if (this.followerEl) {
+          this.followerEl.style.transition = 'all 0ms linear 0ms';
+          this.followerEl.style.transform = `translateY(${params.translateY - this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`;
+        }
 
-      // Push transition for each element
-      if (this.settings.zStack) {
-        this.settings.zStack.pushElements.forEach(item => 
-          this.pushTransition(
-            document.querySelector(item), 
-            this.getPanelTransformY(), 'all 0ms linear 0ms'
-          )
-        );
+        // Push transition for each element
+        if (this.settings.zStack) {
+          this.settings.zStack.pushElements.forEach(item => 
+            this.pushTransition(
+              document.querySelector(item), 
+              this.getPanelTransformY(), 'all 0ms linear 0ms'
+            )
+          );
+        }
+        
+        return resolve(true);
       }
-      
-      return;
-    }
 
-    // Transition end
-    const transitionEnd = () => {
-      if (params.type === 'destroy') {
-        this.destroyResets();
-      }
-      this.paneEl.style.transition = `initial`;
-      // Bind for follower same transitions
-      if (this.followerEl) {
-        this.followerEl.style.transition = `initial`;
-      }
+      // Transition end
+      const transitionEnd = () => {
+        if (params.type === 'destroy') {
+          this.destroyResets();
+        }
+        this.paneEl.style.transition = `initial`;
+        // Bind for follower same transitions
+        if (this.followerEl) {
+          this.followerEl.style.transition = `initial`;
+        }
 
-      // Backdrop 
-      if (this.settings.backdrop) {
-        if (params.type === 'destroy' || params.type === 'hide') {
-          this.backdropEl.style.transition = `initial`;
-          this.backdropEl.style.display = `none`;
+        // Backdrop 
+        if (this.settings.backdrop) {
+          if (params.type === 'destroy' || params.type === 'hide') {
+            this.backdropEl.style.transition = `initial`;
+            this.backdropEl.style.display = `none`;
+          }
         }
-      }
 
-      // Emit event
-      if (params.type === 'present') {
-        this.settings.onDidPresent();  
-      }
-      if (params.type === 'destroy') {
-        this.settings.onDidDismiss({destroyButton: params.destroyButton} as any);
-      }
-      this.settings.onTransitionEnd({target: document.body.contains(this.paneEl) ? this.paneEl : null});
+        // Emit event
+        if (params.type === 'present') {
+          this.settings.onDidPresent();  
+        }
+        if (params.type === 'destroy') {
+          this.settings.onDidDismiss({destroyButton: params.destroyButton} as any);
+        }
+        this.settings.onTransitionEnd({target: document.body.contains(this.paneEl) ? this.paneEl : null});
 
-      // Remove listener
-      this.paneEl.removeEventListener('transitionend', transitionEnd);
-    };
+        // Remove listener
+        this.paneEl.removeEventListener('transitionend', transitionEnd);
+        return resolve(true);
+      };
 
-    // MoveToBreak, Touchend, Present, Hide, Destroy events
-    if (params.type === 'breakpoint' 
-        || params.type === 'end' 
-        || params.type === 'present'
-        || params.type === 'hide'
-        || params.type === 'destroy') {
+      // MoveToBreak, Touchend, Present, Hide, Destroy events
+      if (params.type === 'breakpoint' 
+          || params.type === 'end' 
+          || params.type === 'present'
+          || params.type === 'hide'
+          || params.type === 'destroy') {
 
-      // backdrop 
-      if (this.settings.backdrop) {
-        if (this.isHidden()
-            || params.type === 'hide'
-            || params.type === 'destroy'
-            || params.type === 'present') {
-          this.backdropEl.style.backgroundColor = 'rgba(0,0,0,.0)';
-          this.backdropEl.style.transition = `all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`;
-          
-          if (params.type !== 'hide' && params.type !== 'destroy') {
-            this.backdropEl.style.display = 'block';
-            setTimeout(() => {
-              this.backdropEl.style.backgroundColor = `rgba(0,0,0, ${this.settings.backdropOpacity})`;
-            }, 50);
-          }
-        } 
-      }
-      
-      // freemode
-      if (params.type === 'end' && this.settings.freeMode) return; 
+        // backdrop 
+        if (this.settings.backdrop) {
+          if (this.isHidden()
+              || params.type === 'hide'
+              || params.type === 'destroy'
+              || params.type === 'present') {
+            this.backdropEl.style.backgroundColor = 'rgba(0,0,0,.0)';
+            this.backdropEl.style.transition = `all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`;
+            
+            if (params.type !== 'hide' && params.type !== 'destroy') {
+              this.backdropEl.style.display = 'block';
+              setTimeout(() => {
+                this.backdropEl.style.backgroundColor = `rgba(0,0,0, ${this.settings.backdropOpacity})`;
+              }, 50);
+            }
+          } 
+        }
+        
+        // freemode
+        if (params.type === 'end' && this.settings.freeMode) return resolve(true); 
 
-      // Get timing function && push for next 
-      // TODO: getBreakByHeight or by translateY()
-      const nextBreak = Object.entries(this.settings.breaks).find(
-        val => val[1].height === (this.screenHeightOffset - params.translateY)
-      );
-      const timingForNext = this.getTimingFunction(nextBreak && nextBreak[1]?.bounce ? true : false);
+        // Get timing function && push for next 
+        const nextBreak = Object.entries(this.breakpoints.breaks).find(
+          val => val[1] === params.translateY
+        );
+        let bounce = nextBreak && this.settings.breaks[nextBreak[0]]?.bounce;
+        const timingForNext = this.getTimingFunction(bounce);
 
-      // style
-      this.paneEl.style.transition = `transform ${this.settings.animationDuration}ms ${timingForNext} 0s`;
-      // Bind for follower same transitions
-      if (this.followerEl) {
-        this.followerEl.style.transition = `transform ${this.settings.animationDuration}ms ${timingForNext} 0s`;
-      }
-      
-      // Push transition
-      if (this.settings.zStack) {
-        // Reason of timeout is to hide empty space when present pane and push element
-        // we should start push after pushMinHeight but for present 
-        // transition we can't calculate where pane Y is.    
-        setTimeout(() => {
-          this.settings.zStack.pushElements.forEach(item => 
-            this.pushTransition(
-              document.querySelector(item), 
-              params.translateY, 
-              `all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`
-            )
-          );
-        }, (this.settings.zStack.cardYOffset && params.type === 'present') ? 50 : 0);
-      }
-
-      // Main transitions
-      setTimeout(() => {
-        // Emit event
-        this.settings.onTransitionStart({translateY: {new: params.translateY}});
-        this.paneEl.style.transform = `translateY(${params.translateY}px) translateZ(0px)`;
-        
+        // style
+        this.paneEl.style.transition = `transform ${this.settings.animationDuration}ms ${timingForNext} 0s`;
         // Bind for follower same transitions
         if (this.followerEl) {
-          this.followerEl.style.transform = `translateY(${params.translateY - this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`;
-        }        
-      }, params.type === 'present' ? 50 : 0); 
+          this.followerEl.style.transition = `transform ${this.settings.animationDuration}ms ${timingForNext} 0s`;
+        }
+        
+        // Push transition
+        if (this.settings.zStack) {
+          // Reason of timeout is to hide empty space when present pane and push element
+          // we should start push after pushMinHeight but for present 
+          // transition we can't calculate where pane Y is.    
+          setTimeout(() => {
+            this.settings.zStack.pushElements.forEach(item => 
+              this.pushTransition(
+                document.querySelector(item), 
+                params.translateY, 
+                `all ${this.settings.animationDuration}ms ${this.settings.animationType} 0s`
+              )
+            );
+          }, (this.settings.zStack.cardYOffset && params.type === 'present') ? 50 : 0);
+        }
 
+        // Main transitions
+        setTimeout(() => {
+          // Emit event
+          this.settings.onTransitionStart({translateY: {new: params.translateY}});
+          this.paneEl.style.transform = `translateY(${params.translateY}px) translateZ(0px)`;
+          
+          // Bind for follower same transitions
+          if (this.followerEl) {
+            this.followerEl.style.transform = `translateY(${params.translateY - this.breakpoints.breaks[this.settings.initialBreak]}px) translateZ(0px)`;
+          }        
+        }, params.type === 'present' ? 50 : 0); 
 
-      let getNextBreakpoint = Object.entries(this.breakpoints.breaks).find(val => val[1] === params.translateY);
-      if (getNextBreakpoint) {
-        this.breakpoints.prevBreakpoint = getNextBreakpoint[0];
+
+        let getNextBreakpoint = Object.entries(this.breakpoints.breaks).find(val => val[1] === params.translateY);
+        if (getNextBreakpoint) {
+          this.breakpoints.prevBreakpoint = getNextBreakpoint[0];
+        }
+        this.paneEl.addEventListener('transitionend', transitionEnd);
       }
-      this.paneEl.addEventListener('transitionend', transitionEnd);      
-      return;
-    }
+    });
   }
-
 }

src/events.ts

@@ -19,3 +19,3 @@ import { CupertinoPane, CupertinoSettings } from 'cupertino-pane';
   private startX: number;
-  private steps: any[] = [];  
+  private steps: {posY: number, time: number}[] = [];  
   private inputBluredbyMove: boolean = false;
@@ -186,3 +186,3 @@ private movedByKeyboard: boolean = false;
     
-    this.steps.push(this.startY);
+    this.steps.push({posY: this.startY, time: Date.now()});
   }
@@ -207,6 +207,6 @@
   private touchMove(t) {
-    const { clientY, clientX } = this.getEvetClientYX(t, 'touchmove');
-    
+    const { clientY, clientX, velocityY } = this.getEvetClientYX(t, 'touchmove');
+
     // Event emitter
-    t.delta = this.steps[0] - clientY;
+    t.delta = this.steps[0]?.posY - clientY;
     this.settings.onDrag(t);
@@ -229,4 +229,6 @@
     // Delta
-    const diffY = clientY - this.steps[this.steps.length - 1];
-    let newVal = this.instance.getPanelTransformY() + diffY;
+    const diffY = clientY - this.steps[this.steps.length - 1].posY;
+    // Patch for 'touchmove' first start slowly events with velocity
+    let newVal = this.instance.getPanelTransformY() 
+      + ((this.steps.length < 2) ? (diffY * velocityY) : diffY);  
 
@@ -277,29 +279,52 @@ // textarea scrollbar
       // Scrolled -> Disable drag
-      if ((newVal > this.breakpoints.topper && this.contentScrollTop > 0) 
+      if (!this.settings.inverse) {
+        if ((newVal > this.breakpoints.topper && this.contentScrollTop > 0) 
           || (newVal <= this.breakpoints.topper)) { 
+          return;
+        }
+      } 
+    }
+    
+    // Non-inverse (normal) gestures
+    if (!this.settings.inverse) {
+      // Disallow drag topper than top point
+      if (!this.settings.upperThanTop 
+          && (newVal <= this.breakpoints.topper)) {
+        this.instance.paneEl.style.transform = `translateY(${this.breakpoints.topper}px) translateZ(0px)`;
         return;
       }
-    }
 
-    // Disallow drag topper than top point
-    if (!this.settings.inverse 
-        && !this.settings.upperThanTop && (newVal <= this.breakpoints.topper)) {
-      this.instance.paneEl.style.transform = `translateY(${this.breakpoints.topper}px) translateZ(0px)`;
-      return;
-    }
+      // Allow drag topper than top point
+      if (newVal <= this.breakpoints.topper 
+          && this.settings.upperThanTop) {
+        const screenDelta = this.instance.screen_height - this.instance.screenHeightOffset;
+        const differKoef = (screenDelta - this.instance.getPanelTransformY()) / (screenDelta - this.breakpoints.topper) / 8;
+        newVal = this.instance.getPanelTransformY() + (diffY * differKoef);
+      }
 
-    // Allow drag topper than top point
-    if (newVal <= this.breakpoints.topper && this.settings.upperThanTop) {
-      const differKoef = ((-this.breakpoints.topper + this.breakpoints.topper - this.instance.getPanelTransformY()) / this.breakpoints.topper) / -8;
-      newVal = this.instance.getPanelTransformY() + (diffY * differKoef);
+      // Disallow drag lower then bottom 
+      if (!this.settings.lowerThanBottom
+          && newVal >= this.breakpoints.bottomer) {
+        this.instance.paneEl.style.transform = `translateY(${this.breakpoints.bottomer}px) translateZ(0px)`;
+        this.instance.checkOpacityAttr(newVal);
+        return;
+      }
+    } else {
+      // Inverse gestures
+      // Allow drag topper than top point
+      if (newVal >= this.breakpoints.topper 
+          && this.settings.upperThanTop) {
+        const screenDelta = this.instance.screen_height - this.instance.screenHeightOffset;
+        const differKoef = (screenDelta - this.instance.getPanelTransformY()) / (screenDelta - this.breakpoints.topper) / 8;
+        newVal = this.instance.getPanelTransformY() + (diffY * differKoef);
+      }
+      
+      // Disallow drag topper than top point
+      if (!this.settings.upperThanTop 
+          && (newVal >= this.breakpoints.topper)) {
+        this.instance.paneEl.style.transform = `translateY(${this.breakpoints.topper}px) translateZ(0px)`;
+        return;
+      }
     }
 
-    // Disallow drag lower then bottom 
-    if ((!this.settings.lowerThanBottom || this.settings.inverse) 
-        && (newVal >= this.breakpoints.bottomer)) {
-      this.instance.paneEl.style.transform = `translateY(${this.breakpoints.bottomer}px) translateZ(0px)`;
-      this.instance.checkOpacityAttr(newVal);
-      return;
-    }
-
     // Prevent Dismiss gesture
@@ -327,3 +352,3 @@ if (!this.instance.preventedDismiss
     this.instance.doTransition({type: 'move', translateY: newVal});
-    this.steps.push(clientY);
+    this.steps.push({posY: clientY, time: Date.now()});
   }
@@ -344,6 +369,6 @@
     // Swipe - next (if differ > 10)
-    const diff =  this.steps[this.steps.length - 1] - this.steps[this.steps.length - 2];
+    const diff =  this.steps[this.steps.length - 1]?.posY - this.steps[this.steps.length - 2]?.posY;
     // Set sensivity lower for web
     const swipeNextSensivity = window.hasOwnProperty('cordova') 
-      ? (this.settings.fastSwipeSensivity + 1) : this.settings.fastSwipeSensivity; 
+      ? (this.settings.fastSwipeSensivity + 2) : this.settings.fastSwipeSensivity; 
     const fastSwipeNext = (Math.abs(diff) >= swipeNextSensivity);
@@ -519,3 +544,3 @@ if (fastSwipeNext) {
     this.instance.updateScreenHeights();
-    this.breakpoints.buildBreakpoints(JSON.parse(this.breakpoints.lockedBreakpoints), false);
+    this.breakpoints.buildBreakpoints(JSON.parse(this.breakpoints.lockedBreakpoints));
   }
@@ -529,5 +554,8 @@
     const targetTouch = ev.type === name && ev.targetTouches && (ev.targetTouches[0] || ev.changedTouches[0]);
-    const clientY = ev.type === name ? targetTouch.clientY : ev.clientY;
-    const clientX = ev.type === name ? targetTouch.clientX : ev.clientX;
-    return {clientY, clientX};
+    const clientY: number = ev.type === name ? targetTouch.clientY : ev.clientY;
+    const clientX: number = ev.type === name ? targetTouch.clientX : ev.clientX;
+    const timeDiff: number = (Date.now()) - (this.steps[this.steps.length - 1]?.time || 0);
+    const distanceY: number = Math.abs(clientY - (this.steps[this.steps.length - 1]?.posY || 0));
+    const velocityY: number = distanceY / timeDiff;
+    return {clientY, clientX, velocityY};
   }
@@ -534,0 +562,0 @@

No alert changes

Improved metrics

Total package byte prevSize

14354515

increased by0.08%

Lines of code

6355

increased by2.25%

Worsened metrics

Number of lines in readme file

425

decreased by-1.85%

No dependency changes