framework7 7.0.8 → 8.0.0-beta.1

package/components/popover/popover.less

@@ -5,6 +5,7 @@
     z-index: 13500;
   }
 }
+
 .popover {
   width: var(--f7-popover-width);
   z-index: 13500;
@@ -17,7 +18,6 @@
   transition-duration: 300ms;
   background-color: var(--f7-popover-bg-color);
   border-radius: var(--f7-popover-border-radius);
-  box-shadow: var(--f7-popover-box-shadow);
   will-change: transform, opacity;
   .list {
     margin: 0;
@@ -69,6 +69,10 @@
     transition-duration: 0ms;
   }
 }
+.popover,
+.popover-backdrop {
+  transition-timing-function: var(--f7-popover-transition-timing-function);
+}
 .popover-inner {
   .scrollable();
 }
@@ -79,9 +83,12 @@
     font-size: var(--f7-popover-actions-icon-size);
   }
 }
-.popover-from-actions-bold {
+.ios .popover-from-actions-strong {
   font-weight: 600;
 }
+.md .popover-from-actions-strong {
+  font-weight: 500;
+}
 .popover-from-actions-label {
   line-height: 1.3;
   position: relative;
@@ -95,6 +102,59 @@
   &:last-child {
     .hairline-remove(bottom);
   }
+  .md & {
+    justify-content: center;
+  }
+}
+.popover-angle {
+  width: 26px;
+  height: 26px;
+  position: absolute;
+  left: -26px;
+  top: 0;
+  z-index: 100;
+  overflow: hidden;
+  &:after {
+    content: '';
+    background: var(--f7-popover-bg-color);
+    width: 26px;
+    height: 26px;
+    position: absolute;
+    left: 0;
+    top: 0;
+    border-radius: 3px;
+    transform: rotate(45deg);
+  }
+  &.on-left {
+    left: -26px;
+    &:after {
+      left: 19px;
+      top: 0;
+    }
+  }
+  &.on-right {
+    left: 100%;
+    &:after {
+      left: -19px;
+      top: 0;
+    }
+  }
+  &.on-top {
+    left: 0;
+    top: -26px;
+    &:after {
+      left: 0;
+      top: 19px;
+    }
+  }
+  &.on-bottom {
+    left: 0;
+    top: 100%;
+    &:after {
+      left: 0;
+      top: -19px;
+    }
+  }
 }
 .if-ios-theme({
   @import './popover-ios.less';
@@ -102,6 +162,3 @@
 .if-md-theme({
   @import './popover-md.less';
 });
-.if-aurora-theme({
-  @import './popover-aurora.less';
-});

package/components/popup/popup-class.js

@@ -4,39 +4,35 @@ import { extend, now, nextTick } from '../../shared/utils.js';
 import { getSupport } from '../../shared/get-support.js';
 import { getDevice } from '../../shared/get-device.js';
 import Modal from '../modal/modal-class.js';
-
 class Popup extends Modal {
   constructor(app, params) {
     const extendedParams = extend({
       on: {}
-    }, app.params.popup, params); // Extends with open/close Modal methods;
+    }, app.params.popup, params);
 
+    // Extends with open/close Modal methods;
     super(app, extendedParams);
     const popup = this;
     const window = getWindow();
     const document = getDocument();
     const support = getSupport();
     const device = getDevice();
-    popup.params = extendedParams; // Find Element
+    popup.params = extendedParams;
 
+    // Find Element
     let $el;
-
     if (!popup.params.el) {
       $el = $(popup.params.content).filter(node => node.nodeType === 1).eq(0);
     } else {
       $el = $(popup.params.el).eq(0);
     }
-
     if ($el && $el.length > 0 && $el[0].f7Modal) {
       return $el[0].f7Modal;
     }
-
     if ($el.length === 0) {
       return popup.destroy();
     }
-
     let $backdropEl;
-
     if (popup.params.backdrop && popup.params.backdropEl) {
       $backdropEl = $(popup.params.backdropEl);
     } else if (popup.params.backdrop) {
@@ -46,13 +42,11 @@ class Popup extends Modal {
       } else {
         $backdropEl = popup.$containerEl.children('.popup-backdrop');
       }
-
       if ($backdropEl.length === 0) {
         $backdropEl = $('<div class="popup-backdrop"></div>');
         popup.$containerEl.append($backdropEl);
       }
     }
-
     extend(popup, {
       app,
       push: $el.hasClass('popup-push') || popup.params.push,
@@ -63,51 +57,41 @@ class Popup extends Modal {
       type: 'popup',
       $htmlEl: $('html')
     });
-
     if (popup.params.push) {
       $el.addClass('popup-push');
     }
-
     function handleClick(e) {
       const target = e.target;
       const $target = $(target);
       const keyboardOpened = !device.desktop && device.cordova && (window.Keyboard && window.Keyboard.isVisible || window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible);
       if (keyboardOpened) return;
-
       if ($target.closest(popup.el).length === 0) {
         if (popup.params && popup.params.closeByBackdropClick && popup.params.backdrop && popup.backdropEl && popup.backdropEl === target) {
           let needToClose = true;
           popup.$el.nextAll('.popup.modal-in').each(popupEl => {
             const popupInstance = popupEl.f7Modal;
             if (!popupInstance) return;
-
             if (popupInstance.params.closeByBackdropClick && popupInstance.params.backdrop && popupInstance.backdropEl === popup.backdropEl) {
               needToClose = false;
             }
           });
-
           if (needToClose) {
             popup.close();
           }
         }
       }
     }
-
     function onKeyDown(e) {
       const keyCode = e.keyCode;
-
       if (keyCode === 27 && popup.params.closeOnEscape) {
         popup.close();
       }
     }
-
     let pushOffset;
     let isPush;
-
     function pushViewScale(offset) {
       return (app.height - offset * 2) / app.height;
     }
-
     let allowSwipeToClose = true;
     let isTouched = false;
     let startTouch;
@@ -122,14 +106,11 @@ class Popup extends Modal {
     let pageContentScrollHeight;
     let popupHeight;
     let $pushEl;
-
     function handleTouchStart(e) {
       if (isTouched || !allowSwipeToClose || !popup.params.swipeToClose) return;
-
       if (popup.params.swipeHandler && $(e.target).closest(popup.params.swipeHandler).length === 0) {
         return;
       }
-
       isTouched = true;
       isMoved = false;
       startTouch = {
@@ -138,59 +119,47 @@ class Popup extends Modal {
       };
       touchStartTime = now();
       isScrolling = undefined;
-
       if (!popup.params.swipeHandler && e.type === 'touchstart') {
         pageContentEl = $(e.target).closest('.page-content')[0];
       }
     }
-
     function handleTouchMove(e) {
       if (!isTouched) return;
       currentTouch = {
         x: e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX,
         y: e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY
       };
-
       if (typeof isScrolling === 'undefined') {
         isScrolling = !!(isScrolling || Math.abs(currentTouch.x - startTouch.x) > Math.abs(currentTouch.y - startTouch.y));
       }
-
       if (isScrolling) {
         isTouched = false;
         isMoved = false;
         return;
       }
-
       touchesDiff = startTouch.y - currentTouch.y;
-
       if (isPush && pushOffset && touchesDiff > 0) {
         touchesDiff = 0;
       }
-
       const direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
       $el.transition(0);
-
       if (typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose) {
         $el.transform('');
         $el.transition('');
         return;
       }
-
       if (!isMoved) {
         if (isPush && pushOffset) {
           popupHeight = $el[0].offsetHeight;
           $pushEl = $el.prevAll('.popup.modal-in').eq(0);
-
           if ($pushEl.length === 0) {
             $pushEl = app.$el.children('.view, .views');
           }
         }
-
         if (pageContentEl) {
           pageContentScrollTop = pageContentEl.scrollTop;
           pageContentScrollHeight = pageContentEl.scrollHeight;
           pageContentOffsetHeight = pageContentEl.offsetHeight;
-
           if (!(pageContentScrollHeight === pageContentOffsetHeight) && !(direction === 'to-bottom' && pageContentScrollTop === 0) && !(direction === 'to-top' && pageContentScrollTop === pageContentScrollHeight - pageContentOffsetHeight)) {
             $el.transform('');
             $el.transition('');
@@ -199,7 +168,6 @@ class Popup extends Modal {
             return;
           }
         }
-
         isMoved = true;
         popup.emit('local::swipeStart popupSwipeStart', popup);
         popup.$el.trigger('popup:swipestart');
@@ -207,13 +175,10 @@ class Popup extends Modal {
         popup.emit('local::swipeMove popupSwipeMove', popup);
         popup.$el.trigger('popup:swipemove');
       }
-
       e.preventDefault();
-
       if (isPush && pushOffset) {
         const pushProgress = 1 - Math.abs(touchesDiff / popupHeight);
         const scale = 1 - (1 - pushViewScale(pushOffset)) * pushProgress;
-
         if ($pushEl.hasClass('popup')) {
           if ($pushEl.hasClass('popup-push')) {
             $pushEl.transition(0).forEach(el => {
@@ -230,38 +195,29 @@ class Popup extends Modal {
           });
         }
       }
-
       $el.transition(0).transform(`translate3d(0,${-touchesDiff}px,0)`);
     }
-
     function handleTouchEnd() {
       isTouched = false;
-
       if (!isMoved) {
         return;
       }
-
       popup.emit('local::swipeEnd popupSwipeEnd', popup);
       popup.$el.trigger('popup:swipeend');
       isMoved = false;
       allowSwipeToClose = false;
       $el.transition('');
-
       if (isPush && pushOffset) {
         $pushEl.transition('').transform('');
       }
-
       const direction = touchesDiff <= 0 ? 'to-bottom' : 'to-top';
-
       if (typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose) {
         $el.transform('');
         allowSwipeToClose = true;
         return;
       }
-
       const diff = Math.abs(touchesDiff);
       const timeDiff = new Date().getTime() - touchStartTime;
-
       if (timeDiff < 300 && diff > 20 || timeDiff >= 300 && diff > 100) {
         nextTick(() => {
           if (direction === 'to-bottom') {
@@ -269,7 +225,6 @@ class Popup extends Modal {
           } else {
             $el.addClass('swipe-close-to-top');
           }
-
           $el.transform('');
           popup.emit('local::swipeclose popupSwipeClose', popup);
           popup.$el.trigger('popup:swipeclose');
@@ -278,15 +233,12 @@ class Popup extends Modal {
         });
         return;
       }
-
       allowSwipeToClose = true;
       $el.transform('');
     }
-
     const passive = support.passiveListener ? {
       passive: true
     } : false;
-
     if (popup.params.swipeToClose) {
       $el.on(app.touchEvents.start, handleTouchStart, passive);
       app.on('touchmove', handleTouchMove);
@@ -297,16 +249,12 @@ class Popup extends Modal {
         app.off('touchend:passive', handleTouchEnd);
       });
     }
-
     let hasPreviousPushPopup;
-
     const updatePushOffset = () => {
       const wasPush = isPush;
-
       if (popup.push) {
         isPush = popup.push && (app.width < 630 || app.height < 630 || $el.hasClass('popup-tablet-fullscreen'));
       }
-
       if (isPush && !wasPush) {
         // eslint-disable-next-line
         setPushOffset();
@@ -317,77 +265,63 @@ class Popup extends Modal {
         popup.$htmlEl[0].style.removeProperty('--f7-popup-push-scale');
       }
     };
-
     const setPushOffset = () => {
       app.off('resize', updatePushOffset);
-
       if (popup.push) {
         isPush = popup.push && (app.width < 630 || app.height < 630 || $el.hasClass('popup-tablet-fullscreen'));
       }
-
       if (isPush) {
         pushOffset = parseInt($el.css('--f7-popup-push-offset'), 10);
-        if (Number.isNaN(pushOffset)) pushOffset = 0;
-
-        if (pushOffset) {
-          $el.addClass('popup-push');
-          popup.$htmlEl.addClass('with-modal-popup-push');
-          popup.$htmlEl[0].style.setProperty('--f7-popup-push-scale', pushViewScale(pushOffset));
+        if (Number.isNaN(pushOffset)) {
+          pushOffset = 0;
         }
+        if (!pushOffset) pushOffset = app.theme === 'ios' ? 44 : 48;
+        popup.$htmlEl[0].style.setProperty('--f7-popup-push-offset', `${pushOffset}px`);
+        $el.addClass('popup-push');
+        popup.$htmlEl.addClass('with-modal-popup-push');
+        popup.$htmlEl[0].style.setProperty('--f7-popup-push-scale', pushViewScale(pushOffset));
       }
-
       app.on('resize', updatePushOffset);
     };
-
     popup.on('open', () => {
       hasPreviousPushPopup = false;
-
       if (popup.params.closeOnEscape) {
         $(document).on('keydown', onKeyDown);
       }
-
       $el.prevAll('.popup.modal-in').addClass('popup-behind');
       setPushOffset();
     });
     popup.on('opened', () => {
       $el.removeClass('swipe-close-to-bottom swipe-close-to-top');
-
       if (popup.params.closeByBackdropClick) {
         app.on('click', handleClick);
       }
     });
     popup.on('close', () => {
       hasPreviousPushPopup = popup.$el.prevAll('.popup-push.modal-in').length > 0;
-
       if (popup.params.closeOnEscape) {
         $(document).off('keydown', onKeyDown);
       }
-
       if (popup.params.closeByBackdropClick) {
         app.off('click', handleClick);
       }
-
       $el.prevAll('.popup.modal-in').eq(0).removeClass('popup-behind');
-
       if (isPush && pushOffset && !hasPreviousPushPopup) {
         popup.$htmlEl.removeClass('with-modal-popup-push');
         popup.$htmlEl.addClass('with-modal-popup-push-closing');
       }
-
       app.off('resize', updatePushOffset);
     });
     popup.on('closed', () => {
       $el.removeClass('popup-behind');
-
       if (isPush && pushOffset && !hasPreviousPushPopup) {
         popup.$htmlEl.removeClass('with-modal-popup-push-closing');
         popup.$htmlEl[0].style.removeProperty('--f7-popup-push-scale');
+        popup.$htmlEl[0].style.removeProperty('--f7-popup-push-offset');
       }
     });
     $el[0].f7Modal = popup;
     return popup;
   }
-
 }
-
 export default Popup;

package/components/popup/popup-rtl.css

@@ -1 +1 @@
-:root{--f7-popup-border-radius:0px;--f7-popup-tablet-width:630px;--f7-popup-tablet-height:630px;--f7-popup-transition-duration:400ms;--f7-popup-push-border-radius:10px;--f7-popup-push-offset:var(--f7-safe-area-top)}.ios{--f7-popup-tablet-border-radius:5px;--f7-popup-box-shadow:none}.md{--f7-popup-tablet-border-radius:4px;--f7-popup-box-shadow:0px 20px 44px rgba(0, 0, 0, 0.5)}.aurora{--f7-popup-tablet-border-radius:8px;--f7-popup-box-shadow:0px 20px 44px rgba(0, 0, 0, 0.5)}.popup-backdrop{z-index:10500}.popup-backdrop-unique{z-index:11000}.popup{position:absolute;left:0;top:0px;width:100%;height:100%;display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100vh,0);background:#fff;z-index:11000;overflow:hidden;border-radius:var(--f7-popup-border-radius)}.dark .popup,.popup.dark{background:#000}.popup.modal-in,.popup.modal-out{transition-duration:var(--f7-popup-transition-duration)}.popup.not-animated{transition-duration:0s}.popup.modal-in{display:block;transform:translate3d(0,0,0)}.popup.modal-out{transform:translate3d(0,100vh,0)}.popup.swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}@media (min-width:630px) and (min-height:630px){.popup:not(.popup-tablet-fullscreen){--f7-safe-area-top:0px;--f7-safe-area-bottom:0px;width:var(--f7-popup-tablet-width);height:var(--f7-popup-tablet-height);left:50%;top:50%;margin-left:calc(-1 * var(--f7-popup-tablet-width)/ 2);margin-top:calc(-1 * var(--f7-popup-tablet-height)/ 2);transform:translate3d(0,100vh,0);box-shadow:var(--f7-popup-box-shadow);border-radius:var(--f7-popup-tablet-border-radius,var(--f7-popup-border-radius))}.popup:not(.popup-tablet-fullscreen).modal-in{transform:translate3d(0,0,0)}.popup:not(.popup-tablet-fullscreen).modal-out{transform:translate3d(0,100vh,0)}.popup:not(.popup-tablet-fullscreen).swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}.popup:not(.popup-tablet-fullscreen).popup-behind{transform:translate3d(0,0,0) scale(.9);pointer-events:none}.popup:not(.popup-tablet-fullscreen).popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(.9)}}html.with-modal-popup .framework7-root>.panel .page-content,html.with-modal-popup .framework7-root>.view .page-content,html.with-modal-popup .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-modal-popup-push .popup-push,html.with-modal-popup-push-closing .popup-push{top:calc(var(--f7-popup-push-offset) + 10px);height:calc(100% - var(--f7-popup-push-offset) - 10px);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;--f7-safe-area-top:0px}html.with-modal-popup-push .popup-push .page,html.with-modal-popup-push .popup-push .view,html.with-modal-popup-push-closing .popup-push .page,html.with-modal-popup-push-closing .popup-push .view{--f7-safe-area-top:0px}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{background:#000}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views,html.with-modal-popup-push-closing .framework7-root>.view,html.with-modal-popup-push-closing .framework7-root>.views{transition-duration:var(--f7-popup-transition-duration)}html.with-modal-popup-push .dark .framework7-root>.view:after,html.with-modal-popup-push .dark .framework7-root>.views:after,html.with-modal-popup-push .dark.framework7-root>.view:after,html.with-modal-popup-push .dark.framework7-root>.views:after,html.with-modal-popup-push .framework7-root>.view.dark:after,html.with-modal-popup-push .framework7-root>.views.dark:after,html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after,html.with-modal-popup-push.dark .framework7-root>.view:after,html.with-modal-popup-push.dark .framework7-root>.views:after{content:'';position:absolute;pointer-events:none;left:0;top:0;width:100%;height:100%;background:rgba(255,255,255,.1);z-index:13000;border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:1;animation:popup-dark-push-overlay-fade-in var(--f7-popup-transition-duration) forwards}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views{border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;transform:translate3d(0,0,0px) scale(var(--f7-popup-push-scale,1))!important}html.with-modal-popup-push .popup:after{content:'';pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:13000;transition-duration:var(--f7-popup-transition-duration);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:0}html.with-modal-popup-push .dark .popup:after,html.with-modal-popup-push .dark.popup:after,html.with-modal-popup-push.dark .popup:after{background:rgba(255,255,255,.05)}html.with-modal-popup-push .popup-behind{transform:translate3d(0,0px,0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:not(.popup-push){border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0}html.with-modal-popup-push .popup-behind.popup-push{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.popup-push.modal-out{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px + 100vh),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:after{opacity:1;pointer-events:auto}html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after{animation:popup-dark-push-overlay-fade-out var(--f7-popup-transition-duration) forwards}@keyframes popup-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes popup-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}
+:root{--f7-popup-border-radius:0px;--f7-popup-tablet-width:630px;--f7-popup-tablet-height:630px;--f7-popup-push-offset:var(--f7-safe-area-top)}.ios{--f7-popup-tablet-border-radius:5px;--f7-popup-transition-duration:400ms;--f7-popup-transition-timing-function:initial;--f7-popup-push-border-radius:10px}.md{--f7-popup-tablet-border-radius:28px;--f7-popup-transition-duration:600ms;--f7-popup-transition-timing-function:cubic-bezier(0, 1, 0.2, 1);--f7-popup-push-border-radius:28px}.popup-backdrop{z-index:10500}.popup-backdrop-unique{z-index:11000}.popup{position:absolute;left:0;top:0px;width:100%;height:100%;display:none;box-sizing:border-box;transition-property:transform;transition-timing-function:var(--f7-popup-transition-timing-function);transform:translate3d(0,100vh,0);background:#fff;z-index:11000;overflow:hidden;border-radius:var(--f7-popup-border-radius)}.dark .popup,.popup.dark{background:#000}.popup.modal-in,.popup.modal-out{transition-duration:var(--f7-popup-transition-duration)}.popup.not-animated{transition-duration:0s}.popup.modal-in{display:block;transform:translate3d(0,0,0)}.popup.modal-out{transform:translate3d(0,100vh,0)}.popup.swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}@media (min-width:630px) and (min-height:630px){.popup:not(.popup-tablet-fullscreen){--f7-safe-area-top:0px;--f7-safe-area-bottom:0px;width:var(--f7-popup-tablet-width);height:var(--f7-popup-tablet-height);left:50%;top:50%;margin-left:calc(-1 * var(--f7-popup-tablet-width)/ 2);margin-top:calc(-1 * var(--f7-popup-tablet-height)/ 2);transform:translate3d(0,100vh,0);border-radius:var(--f7-popup-tablet-border-radius,var(--f7-popup-border-radius))}.popup:not(.popup-tablet-fullscreen).modal-in{transform:translate3d(0,0,0)}.popup:not(.popup-tablet-fullscreen).modal-out{transform:translate3d(0,100vh,0)}.popup:not(.popup-tablet-fullscreen).swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}.popup:not(.popup-tablet-fullscreen).popup-behind{transform:translate3d(0,0,0) scale(.9);pointer-events:none}.popup:not(.popup-tablet-fullscreen).popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(.9)}}html.with-modal-popup .framework7-root>.panel .page-content,html.with-modal-popup .framework7-root>.view .page-content,html.with-modal-popup .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-modal-popup-push .popup-push,html.with-modal-popup-push-closing .popup-push{top:calc(var(--f7-popup-push-offset) + 10px);height:calc(100% - var(--f7-popup-push-offset) - 10px);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;--f7-safe-area-top:0px}html.with-modal-popup-push .popup-push .page,html.with-modal-popup-push .popup-push .view,html.with-modal-popup-push-closing .popup-push .page,html.with-modal-popup-push-closing .popup-push .view{--f7-safe-area-top:0px}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{background:#000}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views,html.with-modal-popup-push-closing .framework7-root>.view,html.with-modal-popup-push-closing .framework7-root>.views{transition-duration:var(--f7-popup-transition-duration);transition-timing-function:var(--f7-popup-transition-timing-function)}html.with-modal-popup-push .dark .framework7-root>.view:after,html.with-modal-popup-push .dark .framework7-root>.views:after,html.with-modal-popup-push .dark.framework7-root>.view:after,html.with-modal-popup-push .dark.framework7-root>.views:after,html.with-modal-popup-push .framework7-root>.view.dark:after,html.with-modal-popup-push .framework7-root>.views.dark:after,html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after,html.with-modal-popup-push.dark .framework7-root>.view:after,html.with-modal-popup-push.dark .framework7-root>.views:after{content:'';position:absolute;pointer-events:none;left:0;top:0;width:100%;height:100%;background:rgba(255,255,255,.1);z-index:13000;border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:1;animation:popup-dark-push-overlay-fade-in var(--f7-popup-transition-duration) forwards}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views{border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;transform:translate3d(0,0,0px) scale(var(--f7-popup-push-scale,1))!important}html.with-modal-popup-push .popup:after{content:'';pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:13000;transition-duration:var(--f7-popup-transition-duration);transition-timing-function:var(--f7-popup-transition-timing-function);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:0}html.with-modal-popup-push .dark .popup:after,html.with-modal-popup-push .dark.popup:after,html.with-modal-popup-push.dark .popup:after{background:rgba(255,255,255,.05)}html.with-modal-popup-push .popup-behind{transform:translate3d(0,0px,0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:not(.popup-push){border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0}html.with-modal-popup-push .popup-behind.popup-push{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.popup-push.modal-out{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px + 100vh),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:after{opacity:1;pointer-events:auto}html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after{animation:popup-dark-push-overlay-fade-out var(--f7-popup-transition-duration) forwards;animation-timing-function:var(--f7-popup-transition-timing-function)}@keyframes popup-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes popup-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}

package/components/popup/popup-vars.less

@@ -2,8 +2,6 @@
   --f7-popup-border-radius: 0px;
   --f7-popup-tablet-width: 630px;
   --f7-popup-tablet-height: 630px;
-  --f7-popup-transition-duration: 400ms;
-  --f7-popup-push-border-radius: 10px;
   --f7-popup-push-offset: var(--f7-safe-area-top);
   /*
   --f7-popup-tablet-border-radius: var(--f7-popup-border-radius);
@@ -11,13 +9,13 @@
 }
 .ios-vars({
   --f7-popup-tablet-border-radius: 5px;
-  --f7-popup-box-shadow: none;
+  --f7-popup-transition-duration: 400ms;
+  --f7-popup-transition-timing-function: initial;
+  --f7-popup-push-border-radius: 10px;
 });
 .md-vars({
-  --f7-popup-tablet-border-radius: 4px;
-  --f7-popup-box-shadow: 0px 20px 44px rgba(0,0,0,0.5);
-});
-.aurora-vars({
-  --f7-popup-tablet-border-radius: 8px;
-  --f7-popup-box-shadow: 0px 20px 44px rgba(0,0,0,0.5);
+  --f7-popup-tablet-border-radius: 28px;
+  --f7-popup-transition-duration: 600ms;
+  --f7-popup-transition-timing-function: cubic-bezier(0, 1, 0.2, 1);
+  --f7-popup-push-border-radius: 28px;
 });

package/components/popup/popup.css

@@ -1 +1 @@
-:root{--f7-popup-border-radius:0px;--f7-popup-tablet-width:630px;--f7-popup-tablet-height:630px;--f7-popup-transition-duration:400ms;--f7-popup-push-border-radius:10px;--f7-popup-push-offset:var(--f7-safe-area-top)}.ios{--f7-popup-tablet-border-radius:5px;--f7-popup-box-shadow:none}.md{--f7-popup-tablet-border-radius:4px;--f7-popup-box-shadow:0px 20px 44px rgba(0, 0, 0, 0.5)}.aurora{--f7-popup-tablet-border-radius:8px;--f7-popup-box-shadow:0px 20px 44px rgba(0, 0, 0, 0.5)}.popup-backdrop{z-index:10500}.popup-backdrop-unique{z-index:11000}.popup{position:absolute;left:0;top:0px;width:100%;height:100%;display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100vh,0);background:#fff;z-index:11000;overflow:hidden;border-radius:var(--f7-popup-border-radius)}.dark .popup,.popup.dark{background:#000}.popup.modal-in,.popup.modal-out{transition-duration:var(--f7-popup-transition-duration)}.popup.not-animated{transition-duration:0s}.popup.modal-in{display:block;transform:translate3d(0,0,0)}.popup.modal-out{transform:translate3d(0,100vh,0)}.popup.swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}@media (min-width:630px) and (min-height:630px){.popup:not(.popup-tablet-fullscreen){--f7-safe-area-top:0px;--f7-safe-area-bottom:0px;width:var(--f7-popup-tablet-width);height:var(--f7-popup-tablet-height);left:50%;top:50%;margin-left:calc(-1 * var(--f7-popup-tablet-width)/ 2);margin-top:calc(-1 * var(--f7-popup-tablet-height)/ 2);transform:translate3d(0,100vh,0);box-shadow:var(--f7-popup-box-shadow);border-radius:var(--f7-popup-tablet-border-radius,var(--f7-popup-border-radius))}.popup:not(.popup-tablet-fullscreen).modal-in{transform:translate3d(0,0,0)}.popup:not(.popup-tablet-fullscreen).modal-out{transform:translate3d(0,100vh,0)}.popup:not(.popup-tablet-fullscreen).swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}.popup:not(.popup-tablet-fullscreen).popup-behind{transform:translate3d(0,0,0) scale(.9);pointer-events:none}.popup:not(.popup-tablet-fullscreen).popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(.9)}}html.with-modal-popup .framework7-root>.panel .page-content,html.with-modal-popup .framework7-root>.view .page-content,html.with-modal-popup .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-modal-popup-push .popup-push,html.with-modal-popup-push-closing .popup-push{top:calc(var(--f7-popup-push-offset) + 10px);height:calc(100% - var(--f7-popup-push-offset) - 10px);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;--f7-safe-area-top:0px}html.with-modal-popup-push .popup-push .page,html.with-modal-popup-push .popup-push .view,html.with-modal-popup-push-closing .popup-push .page,html.with-modal-popup-push-closing .popup-push .view{--f7-safe-area-top:0px}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{background:#000}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views,html.with-modal-popup-push-closing .framework7-root>.view,html.with-modal-popup-push-closing .framework7-root>.views{transition-duration:var(--f7-popup-transition-duration)}html.with-modal-popup-push .dark .framework7-root>.view:after,html.with-modal-popup-push .dark .framework7-root>.views:after,html.with-modal-popup-push .dark.framework7-root>.view:after,html.with-modal-popup-push .dark.framework7-root>.views:after,html.with-modal-popup-push .framework7-root>.view.dark:after,html.with-modal-popup-push .framework7-root>.views.dark:after,html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after,html.with-modal-popup-push.dark .framework7-root>.view:after,html.with-modal-popup-push.dark .framework7-root>.views:after{content:'';position:absolute;pointer-events:none;left:0;top:0;width:100%;height:100%;background:rgba(255,255,255,.1);z-index:13000;border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:1;animation:popup-dark-push-overlay-fade-in var(--f7-popup-transition-duration) forwards}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views{border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;transform:translate3d(0,0,0px) scale(var(--f7-popup-push-scale,1))!important}html.with-modal-popup-push .popup:after{content:'';pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:13000;transition-duration:var(--f7-popup-transition-duration);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:0}html.with-modal-popup-push .dark .popup:after,html.with-modal-popup-push .dark.popup:after,html.with-modal-popup-push.dark .popup:after{background:rgba(255,255,255,.05)}html.with-modal-popup-push .popup-behind{transform:translate3d(0,0px,0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:not(.popup-push){border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0}html.with-modal-popup-push .popup-behind.popup-push{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.popup-push.modal-out{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px + 100vh),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:after{opacity:1;pointer-events:auto}html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after{animation:popup-dark-push-overlay-fade-out var(--f7-popup-transition-duration) forwards}@keyframes popup-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes popup-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}
+:root{--f7-popup-border-radius:0px;--f7-popup-tablet-width:630px;--f7-popup-tablet-height:630px;--f7-popup-push-offset:var(--f7-safe-area-top)}.ios{--f7-popup-tablet-border-radius:5px;--f7-popup-transition-duration:400ms;--f7-popup-transition-timing-function:initial;--f7-popup-push-border-radius:10px}.md{--f7-popup-tablet-border-radius:28px;--f7-popup-transition-duration:600ms;--f7-popup-transition-timing-function:cubic-bezier(0, 1, 0.2, 1);--f7-popup-push-border-radius:28px}.popup-backdrop{z-index:10500}.popup-backdrop-unique{z-index:11000}.popup{position:absolute;left:0;top:0px;width:100%;height:100%;display:none;box-sizing:border-box;transition-property:transform;transition-timing-function:var(--f7-popup-transition-timing-function);transform:translate3d(0,100vh,0);background:#fff;z-index:11000;overflow:hidden;border-radius:var(--f7-popup-border-radius)}.dark .popup,.popup.dark{background:#000}.popup.modal-in,.popup.modal-out{transition-duration:var(--f7-popup-transition-duration)}.popup.not-animated{transition-duration:0s}.popup.modal-in{display:block;transform:translate3d(0,0,0)}.popup.modal-out{transform:translate3d(0,100vh,0)}.popup.swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}@media (min-width:630px) and (min-height:630px){.popup:not(.popup-tablet-fullscreen){--f7-safe-area-top:0px;--f7-safe-area-bottom:0px;width:var(--f7-popup-tablet-width);height:var(--f7-popup-tablet-height);left:50%;top:50%;margin-left:calc(-1 * var(--f7-popup-tablet-width)/ 2);margin-top:calc(-1 * var(--f7-popup-tablet-height)/ 2);transform:translate3d(0,100vh,0);border-radius:var(--f7-popup-tablet-border-radius,var(--f7-popup-border-radius))}.popup:not(.popup-tablet-fullscreen).modal-in{transform:translate3d(0,0,0)}.popup:not(.popup-tablet-fullscreen).modal-out{transform:translate3d(0,100vh,0)}.popup:not(.popup-tablet-fullscreen).swipe-close-to-top.modal-out{transform:translate3d(0,-100vh,0)}.popup:not(.popup-tablet-fullscreen).popup-behind{transform:translate3d(0,0,0) scale(.9);pointer-events:none}.popup:not(.popup-tablet-fullscreen).popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(.9)}}html.with-modal-popup .framework7-root>.panel .page-content,html.with-modal-popup .framework7-root>.view .page-content,html.with-modal-popup .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-modal-popup-push .popup-push,html.with-modal-popup-push-closing .popup-push{top:calc(var(--f7-popup-push-offset) + 10px);height:calc(100% - var(--f7-popup-push-offset) - 10px);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;--f7-safe-area-top:0px}html.with-modal-popup-push .popup-push .page,html.with-modal-popup-push .popup-push .view,html.with-modal-popup-push-closing .popup-push .page,html.with-modal-popup-push-closing .popup-push .view{--f7-safe-area-top:0px}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{background:#000}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views,html.with-modal-popup-push-closing .framework7-root>.view,html.with-modal-popup-push-closing .framework7-root>.views{transition-duration:var(--f7-popup-transition-duration);transition-timing-function:var(--f7-popup-transition-timing-function)}html.with-modal-popup-push .dark .framework7-root>.view:after,html.with-modal-popup-push .dark .framework7-root>.views:after,html.with-modal-popup-push .dark.framework7-root>.view:after,html.with-modal-popup-push .dark.framework7-root>.views:after,html.with-modal-popup-push .framework7-root>.view.dark:after,html.with-modal-popup-push .framework7-root>.views.dark:after,html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after,html.with-modal-popup-push.dark .framework7-root>.view:after,html.with-modal-popup-push.dark .framework7-root>.views:after{content:'';position:absolute;pointer-events:none;left:0;top:0;width:100%;height:100%;background:rgba(255,255,255,.1);z-index:13000;border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:1;animation:popup-dark-push-overlay-fade-in var(--f7-popup-transition-duration) forwards}html.with-modal-popup-push .framework7-root>.view,html.with-modal-popup-push .framework7-root>.views{border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;transform:translate3d(0,0,0px) scale(var(--f7-popup-push-scale,1))!important}html.with-modal-popup-push .popup:after{content:'';pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:13000;transition-duration:var(--f7-popup-transition-duration);transition-timing-function:var(--f7-popup-transition-timing-function);border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0;opacity:0}html.with-modal-popup-push .dark .popup:after,html.with-modal-popup-push .dark.popup:after,html.with-modal-popup-push.dark .popup:after{background:rgba(255,255,255,.05)}html.with-modal-popup-push .popup-behind{transform:translate3d(0,0px,0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.modal-out{transform:translate3d(0,100vh,0) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:not(.popup-push){border-radius:var(--f7-popup-push-border-radius) var(--f7-popup-push-border-radius) 0 0}html.with-modal-popup-push .popup-behind.popup-push{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind.popup-push.modal-out{transform:translate3d(0,calc(0px - var(--f7-popup-push-offset) - 10px + 100vh),0px) scale(var(--f7-popup-push-scale,1))}html.with-modal-popup-push .popup-behind:after{opacity:1;pointer-events:auto}html.with-modal-popup-push-closing .dark .framework7-root>.view:after,html.with-modal-popup-push-closing .dark .framework7-root>.views:after,html.with-modal-popup-push-closing .dark.framework7-root>.view:after,html.with-modal-popup-push-closing .dark.framework7-root>.views:after,html.with-modal-popup-push-closing .framework7-root>.view.dark:after,html.with-modal-popup-push-closing .framework7-root>.views.dark:after,html.with-modal-popup-push-closing.dark .framework7-root>.view:after,html.with-modal-popup-push-closing.dark .framework7-root>.views:after{animation:popup-dark-push-overlay-fade-out var(--f7-popup-transition-duration) forwards;animation-timing-function:var(--f7-popup-transition-timing-function)}@keyframes popup-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes popup-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}

package/components/popup/popup.js

@@ -18,7 +18,6 @@ export default {
   static: {
     Popup
   },
-
   create() {
     const app = this;
     app.popup = ModalMethods({
@@ -28,13 +27,11 @@ export default {
       parentSelector: '.popup'
     });
   },
-
   clicks: {
     '.popup-open': function openPopup($clickedEl, data) {
       if (data === void 0) {
         data = {};
       }
-
       const app = this;
       app.popup.open(data.popup, data.animate, $clickedEl);
     },
@@ -42,7 +39,6 @@ export default {
       if (data === void 0) {
         data = {};
       }
-
       const app = this;
       app.popup.close(data.popup, data.animate, $clickedEl);
     }

package/components/popup/popup.lazy.js

@@ -1 +1 @@
-(function framework7ComponentLoader(o,p){void 0===p&&(p=!0);var e=o.$,s=o.utils,t=o.getDevice,a=o.getSupport,r=(o.Class,o.Modal),l=(o.ConstructorMethods,o.ModalMethods),n=(o.$jsx,s.extend),i=s.now,c=s.nextTick;class u extends r{constructor(o,p){const s=n({on:{}},o.params.popup,p);super(o,s);const r=this,l=a(),u=t();let d,m,h,f;if(r.params=s,d=r.params.el?e(r.params.el).eq(0):e(r.params.content).filter((o=>1===o.nodeType)).eq(0),d&&d.length>0&&d[0].f7Modal)return d[0].f7Modal;if(0===d.length)return r.destroy();function w(o){const p=o.target,s=e(p);if(!(!u.desktop&&u.cordova&&(window.Keyboard&&window.Keyboard.isVisible||window.cordova.plugins&&window.cordova.plugins.Keyboard&&window.cordova.plugins.Keyboard.isVisible))&&0===s.closest(r.el).length&&r.params&&r.params.closeByBackdropClick&&r.params.backdrop&&r.backdropEl&&r.backdropEl===p){let o=!0;r.$el.nextAll(".popup.modal-in").each((p=>{const e=p.f7Modal;e&&e.params.closeByBackdropClick&&e.params.backdrop&&e.backdropEl===r.backdropEl&&(o=!1)})),o&&r.close()}}function v(o){27===o.keyCode&&r.params.closeOnEscape&&r.close()}function g(p){return(o.height-2*p)/o.height}r.params.backdrop&&r.params.backdropEl?m=e(r.params.backdropEl):r.params.backdrop&&(r.params.backdropUnique?(m=e('<div class="popup-backdrop popup-backdrop-unique"></div>'),r.$containerEl.append(m)):m=r.$containerEl.children(".popup-backdrop"),0===m.length&&(m=e('<div class="popup-backdrop"></div>'),r.$containerEl.append(m))),n(r,{app:o,push:d.hasClass("popup-push")||r.params.push,$el:d,el:d[0],$backdropEl:m,backdropEl:m&&m[0],type:"popup",$htmlEl:e("html")}),r.params.push&&d.addClass("popup-push");let y,b,k,C,E,$,M,T,x,B,P,S=!0,q=!1,H=!1;function A(o){!q&&S&&r.params.swipeToClose&&(r.params.swipeHandler&&0===e(o.target).closest(r.params.swipeHandler).length||(q=!0,H=!1,y={x:"touchstart"===o.type?o.targetTouches[0].pageX:o.pageX,y:"touchstart"===o.type?o.targetTouches[0].pageY:o.pageY},C=i(),k=void 0,r.params.swipeHandler||"touchstart"!==o.type||($=e(o.target).closest(".page-content")[0])))}function D(p){if(!q)return;if(b={x:"touchmove"===p.type?p.targetTouches[0].pageX:p.pageX,y:"touchmove"===p.type?p.targetTouches[0].pageY:p.pageY},void 0===k&&(k=!!(k||Math.abs(b.x-y.x)>Math.abs(b.y-y.y))),k)return q=!1,void(H=!1);E=y.y-b.y,f&&h&&E>0&&(E=0);const e=E<0?"to-bottom":"to-top";if(d.transition(0),"string"==typeof r.params.swipeToClose&&e!==r.params.swipeToClose)return d.transform(""),void d.transition("");if(H)r.emit("local::swipeMove popupSwipeMove",r),r.$el.trigger("popup:swipemove");else{if(f&&h&&(B=d[0].offsetHeight,P=d.prevAll(".popup.modal-in").eq(0),0===P.length&&(P=o.$el.children(".view, .views"))),$&&(M=$.scrollTop,x=$.scrollHeight,T=$.offsetHeight,!(x===T||"to-bottom"===e&&0===M||"to-top"===e&&M===x-T)))return d.transform(""),d.transition(""),q=!1,void(H=!1);H=!0,r.emit("local::swipeStart popupSwipeStart",r),r.$el.trigger("popup:swipestart")}if(p.preventDefault(),f&&h){const o=1-Math.abs(E/B),p=1-(1-g(h))*o;P.hasClass("popup")?P.hasClass("popup-push")?P.transition(0).forEach((e=>{e.style.setProperty("transform",`translate3d(0, calc(-1 * ${o} * (var(--f7-popup-push-offset) + 10px)) , 0px) scale(${p})`,"important")})):P.transition(0).forEach((o=>{o.style.setProperty("transform",`translate3d(0, 0px , 0px) scale(${p})`,"important")})):P.transition(0).forEach((o=>{o.style.setProperty("transform",`translate3d(0,0,0) scale(${p})`,"important")}))}d.transition(0).transform(`translate3d(0,${-E}px,0)`)}function K(){if(q=!1,!H)return;r.emit("local::swipeEnd popupSwipeEnd",r),r.$el.trigger("popup:swipeend"),H=!1,S=!1,d.transition(""),f&&h&&P.transition("").transform("");const o=E<=0?"to-bottom":"to-top";if("string"==typeof r.params.swipeToClose&&o!==r.params.swipeToClose)return d.transform(""),void(S=!0);const p=Math.abs(E),e=(new Date).getTime()-C;e<300&&p>20||e>=300&&p>100?c((()=>{"to-bottom"===o?d.addClass("swipe-close-to-bottom"):d.addClass("swipe-close-to-top"),d.transform(""),r.emit("local::swipeclose popupSwipeClose",r),r.$el.trigger("popup:swipeclose"),r.close(),S=!0})):(S=!0,d.transform(""))}const O=!!l.passiveListener&&{passive:!0};let X;r.params.swipeToClose&&(d.on(o.touchEvents.start,A,O),o.on("touchmove",D),o.on("touchend:passive",K),r.once("popupDestroy",(()=>{d.off(o.touchEvents.start,A,O),o.off("touchmove",D),o.off("touchend:passive",K)})));const Y=()=>{const p=f;r.push&&(f=r.push&&(o.width<630||o.height<630||d.hasClass("popup-tablet-fullscreen"))),f&&!p?z():f&&p?r.$htmlEl[0].style.setProperty("--f7-popup-push-scale",g(h)):!f&&p&&(r.$htmlEl.removeClass("with-modal-popup-push"),r.$htmlEl[0].style.removeProperty("--f7-popup-push-scale"))},z=()=>{o.off("resize",Y),r.push&&(f=r.push&&(o.width<630||o.height<630||d.hasClass("popup-tablet-fullscreen"))),f&&(h=parseInt(d.css("--f7-popup-push-offset"),10),Number.isNaN(h)&&(h=0),h&&(d.addClass("popup-push"),r.$htmlEl.addClass("with-modal-popup-push"),r.$htmlEl[0].style.setProperty("--f7-popup-push-scale",g(h)))),o.on("resize",Y)};return r.on("open",(()=>{X=!1,r.params.closeOnEscape&&e(document).on("keydown",v),d.prevAll(".popup.modal-in").addClass("popup-behind"),z()})),r.on("opened",(()=>{d.removeClass("swipe-close-to-bottom swipe-close-to-top"),r.params.closeByBackdropClick&&o.on("click",w)})),r.on("close",(()=>{X=r.$el.prevAll(".popup-push.modal-in").length>0,r.params.closeOnEscape&&e(document).off("keydown",v),r.params.closeByBackdropClick&&o.off("click",w),d.prevAll(".popup.modal-in").eq(0).removeClass("popup-behind"),f&&h&&!X&&(r.$htmlEl.removeClass("with-modal-popup-push"),r.$htmlEl.addClass("with-modal-popup-push-closing")),o.off("resize",Y)})),r.on("closed",(()=>{d.removeClass("popup-behind"),f&&h&&!X&&(r.$htmlEl.removeClass("with-modal-popup-push-closing"),r.$htmlEl[0].style.removeProperty("--f7-popup-push-scale"))})),d[0].f7Modal=r,r}}var d={name:"popup",params:{popup:{backdrop:!0,backdropEl:void 0,backdropUnique:!1,closeByBackdropClick:!0,closeOnEscape:!1,swipeToClose:!1,swipeHandler:null,push:!1,containerEl:null}},static:{Popup:u},create(){this.popup=l({app:this,constructor:u,defaultSelector:".popup.modal-in",parentSelector:".popup"})},clicks:{".popup-open":function(o,p){void 0===p&&(p={});this.popup.open(p.popup,p.animate,o)},".popup-close":function(o,p){void 0===p&&(p={});this.popup.close(p.popup,p.animate,o)}}};if(p){if(o.prototype.modules&&o.prototype.modules[d.name])return;o.use(d),o.instance&&(o.instance.useModuleParams(d,o.instance.params),o.instance.useModule(d))}return d}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
+(function framework7ComponentLoader(o,p){void 0===p&&(p=!0);var e=o.$,s=o.utils,t=o.getDevice,a=o.getSupport,r=(o.Class,o.Modal),l=(o.ConstructorMethods,o.ModalMethods),n=(o.$jsx,s.extend),i=s.now,c=s.nextTick;class u extends r{constructor(o,p){const s=n({on:{}},o.params.popup,p);super(o,s);const r=this,l=a(),u=t();let d,m,h,f;if(r.params=s,d=r.params.el?e(r.params.el).eq(0):e(r.params.content).filter((o=>1===o.nodeType)).eq(0),d&&d.length>0&&d[0].f7Modal)return d[0].f7Modal;if(0===d.length)return r.destroy();function v(o){const p=o.target,s=e(p);if(!(!u.desktop&&u.cordova&&(window.Keyboard&&window.Keyboard.isVisible||window.cordova.plugins&&window.cordova.plugins.Keyboard&&window.cordova.plugins.Keyboard.isVisible))&&0===s.closest(r.el).length&&r.params&&r.params.closeByBackdropClick&&r.params.backdrop&&r.backdropEl&&r.backdropEl===p){let o=!0;r.$el.nextAll(".popup.modal-in").each((p=>{const e=p.f7Modal;e&&e.params.closeByBackdropClick&&e.params.backdrop&&e.backdropEl===r.backdropEl&&(o=!1)})),o&&r.close()}}function w(o){27===o.keyCode&&r.params.closeOnEscape&&r.close()}function y(p){return(o.height-2*p)/o.height}r.params.backdrop&&r.params.backdropEl?m=e(r.params.backdropEl):r.params.backdrop&&(r.params.backdropUnique?(m=e('<div class="popup-backdrop popup-backdrop-unique"></div>'),r.$containerEl.append(m)):m=r.$containerEl.children(".popup-backdrop"),0===m.length&&(m=e('<div class="popup-backdrop"></div>'),r.$containerEl.append(m))),n(r,{app:o,push:d.hasClass("popup-push")||r.params.push,$el:d,el:d[0],$backdropEl:m,backdropEl:m&&m[0],type:"popup",$htmlEl:e("html")}),r.params.push&&d.addClass("popup-push");let g,b,k,E,C,$,M,x,T,P,B,S=!0,q=!1,H=!1;function A(o){!q&&S&&r.params.swipeToClose&&(r.params.swipeHandler&&0===e(o.target).closest(r.params.swipeHandler).length||(q=!0,H=!1,g={x:"touchstart"===o.type?o.targetTouches[0].pageX:o.pageX,y:"touchstart"===o.type?o.targetTouches[0].pageY:o.pageY},E=i(),k=void 0,r.params.swipeHandler||"touchstart"!==o.type||($=e(o.target).closest(".page-content")[0])))}function D(p){if(!q)return;if(b={x:"touchmove"===p.type?p.targetTouches[0].pageX:p.pageX,y:"touchmove"===p.type?p.targetTouches[0].pageY:p.pageY},void 0===k&&(k=!!(k||Math.abs(b.x-g.x)>Math.abs(b.y-g.y))),k)return q=!1,void(H=!1);C=g.y-b.y,f&&h&&C>0&&(C=0);const e=C<0?"to-bottom":"to-top";if(d.transition(0),"string"==typeof r.params.swipeToClose&&e!==r.params.swipeToClose)return d.transform(""),void d.transition("");if(H)r.emit("local::swipeMove popupSwipeMove",r),r.$el.trigger("popup:swipemove");else{if(f&&h&&(P=d[0].offsetHeight,B=d.prevAll(".popup.modal-in").eq(0),0===B.length&&(B=o.$el.children(".view, .views"))),$&&(M=$.scrollTop,T=$.scrollHeight,x=$.offsetHeight,!(T===x||"to-bottom"===e&&0===M||"to-top"===e&&M===T-x)))return d.transform(""),d.transition(""),q=!1,void(H=!1);H=!0,r.emit("local::swipeStart popupSwipeStart",r),r.$el.trigger("popup:swipestart")}if(p.preventDefault(),f&&h){const o=1-Math.abs(C/P),p=1-(1-y(h))*o;B.hasClass("popup")?B.hasClass("popup-push")?B.transition(0).forEach((e=>{e.style.setProperty("transform",`translate3d(0, calc(-1 * ${o} * (var(--f7-popup-push-offset) + 10px)) , 0px) scale(${p})`,"important")})):B.transition(0).forEach((o=>{o.style.setProperty("transform",`translate3d(0, 0px , 0px) scale(${p})`,"important")})):B.transition(0).forEach((o=>{o.style.setProperty("transform",`translate3d(0,0,0) scale(${p})`,"important")}))}d.transition(0).transform(`translate3d(0,${-C}px,0)`)}function K(){if(q=!1,!H)return;r.emit("local::swipeEnd popupSwipeEnd",r),r.$el.trigger("popup:swipeend"),H=!1,S=!1,d.transition(""),f&&h&&B.transition("").transform("");const o=C<=0?"to-bottom":"to-top";if("string"==typeof r.params.swipeToClose&&o!==r.params.swipeToClose)return d.transform(""),void(S=!0);const p=Math.abs(C),e=(new Date).getTime()-E;e<300&&p>20||e>=300&&p>100?c((()=>{"to-bottom"===o?d.addClass("swipe-close-to-bottom"):d.addClass("swipe-close-to-top"),d.transform(""),r.emit("local::swipeclose popupSwipeClose",r),r.$el.trigger("popup:swipeclose"),r.close(),S=!0})):(S=!0,d.transform(""))}const O=!!l.passiveListener&&{passive:!0};let X;r.params.swipeToClose&&(d.on(o.touchEvents.start,A,O),o.on("touchmove",D),o.on("touchend:passive",K),r.once("popupDestroy",(()=>{d.off(o.touchEvents.start,A,O),o.off("touchmove",D),o.off("touchend:passive",K)})));const Y=()=>{const p=f;r.push&&(f=r.push&&(o.width<630||o.height<630||d.hasClass("popup-tablet-fullscreen"))),f&&!p?z():f&&p?r.$htmlEl[0].style.setProperty("--f7-popup-push-scale",y(h)):!f&&p&&(r.$htmlEl.removeClass("with-modal-popup-push"),r.$htmlEl[0].style.removeProperty("--f7-popup-push-scale"))},z=()=>{o.off("resize",Y),r.push&&(f=r.push&&(o.width<630||o.height<630||d.hasClass("popup-tablet-fullscreen"))),f&&(h=parseInt(d.css("--f7-popup-push-offset"),10),Number.isNaN(h)&&(h=0),h||(h="ios"===o.theme?44:48),r.$htmlEl[0].style.setProperty("--f7-popup-push-offset",`${h}px`),d.addClass("popup-push"),r.$htmlEl.addClass("with-modal-popup-push"),r.$htmlEl[0].style.setProperty("--f7-popup-push-scale",y(h))),o.on("resize",Y)};return r.on("open",(()=>{X=!1,r.params.closeOnEscape&&e(document).on("keydown",w),d.prevAll(".popup.modal-in").addClass("popup-behind"),z()})),r.on("opened",(()=>{d.removeClass("swipe-close-to-bottom swipe-close-to-top"),r.params.closeByBackdropClick&&o.on("click",v)})),r.on("close",(()=>{X=r.$el.prevAll(".popup-push.modal-in").length>0,r.params.closeOnEscape&&e(document).off("keydown",w),r.params.closeByBackdropClick&&o.off("click",v),d.prevAll(".popup.modal-in").eq(0).removeClass("popup-behind"),f&&h&&!X&&(r.$htmlEl.removeClass("with-modal-popup-push"),r.$htmlEl.addClass("with-modal-popup-push-closing")),o.off("resize",Y)})),r.on("closed",(()=>{d.removeClass("popup-behind"),f&&h&&!X&&(r.$htmlEl.removeClass("with-modal-popup-push-closing"),r.$htmlEl[0].style.removeProperty("--f7-popup-push-scale"),r.$htmlEl[0].style.removeProperty("--f7-popup-push-offset"))})),d[0].f7Modal=r,r}}var d={name:"popup",params:{popup:{backdrop:!0,backdropEl:void 0,backdropUnique:!1,closeByBackdropClick:!0,closeOnEscape:!1,swipeToClose:!1,swipeHandler:null,push:!1,containerEl:null}},static:{Popup:u},create(){this.popup=l({app:this,constructor:u,defaultSelector:".popup.modal-in",parentSelector:".popup"})},clicks:{".popup-open":function(o,p){void 0===p&&(p={});this.popup.open(p.popup,p.animate,o)},".popup-close":function(o,p){void 0===p&&(p={});this.popup.close(p.popup,p.animate,o)}}};if(p){if(o.prototype.modules&&o.prototype.modules[d.name])return;o.use(d),o.instance&&(o.instance.useModuleParams(d,o.instance.params),o.instance.useModule(d))}return d}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))