framework7 6.3.15 → 7.0.0-beta.11

package/{esm/components → components}/sheet/sheet-class.js

@@ -1,34 +1,22 @@
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
 import { getWindow, getDocument } from 'ssr-window';
-import $ from '../../shared/dom7';
-import { extend, now, getTranslate } from '../../shared/utils';
-import { getSupport } from '../../shared/get-support';
-import { getDevice } from '../../shared/get-device';
-import Modal from '../modal/modal-class';
-
-var Sheet = /*#__PURE__*/function (_Modal) {
-  _inheritsLoose(Sheet, _Modal);
-
-  function Sheet(app, params) {
-    var _this;
-
-    var extendedParams = extend({
+import $ from '../../shared/dom7.js';
+import { extend, now, getTranslate } 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 Sheet extends Modal {
+  constructor(app, params) {
+    const extendedParams = extend({
       on: {}
     }, app.params.sheet, params); // Extends with open/close Modal methods;
 
-    _this = _Modal.call(this, app, extendedParams) || this;
-
-    var sheet = _assertThisInitialized(_this);
-
-    var window = getWindow();
-    var document = getDocument();
-    var support = getSupport();
-    var device = getDevice();
+    super(app, extendedParams);
+    const sheet = this;
+    const window = getWindow();
+    const document = getDocument();
+    const support = getSupport();
+    const device = getDevice();
     sheet.params = extendedParams;
 
     if (typeof sheet.params.backdrop === 'undefined') {
@@ -36,30 +24,33 @@ var Sheet = /*#__PURE__*/function (_Modal) {
     } // Find Element
 
 
-    var $el;
+    let $el;
 
     if (!sheet.params.el) {
-      $el = $(sheet.params.content).filter(function (node) {
-        return node.nodeType === 1;
-      }).eq(0);
+      $el = $(sheet.params.content).filter(node => node.nodeType === 1).eq(0);
     } else {
       $el = $(sheet.params.el).eq(0);
     }
 
     if ($el && $el.length > 0 && $el[0].f7Modal) {
-      return $el[0].f7Modal || _assertThisInitialized(_this);
+      return $el[0].f7Modal;
     }
 
     if ($el.length === 0) {
-      return sheet.destroy() || _assertThisInitialized(_this);
+      return sheet.destroy();
     }
 
-    var $backdropEl;
+    let $backdropEl;
 
     if (sheet.params.backdrop && sheet.params.backdropEl) {
       $backdropEl = $(sheet.params.backdropEl);
     } else if (sheet.params.backdrop) {
-      $backdropEl = sheet.$containerEl.children('.sheet-backdrop');
+      if (sheet.params.backdropUnique) {
+        $backdropEl = $('<div class="sheet-backdrop sheet-backdrop-unique"></div>');
+        sheet.$containerEl.append($backdropEl);
+      } else {
+        $backdropEl = sheet.$containerEl.children('.sheet-backdrop');
+      }
 
       if ($backdropEl.length === 0) {
         $backdropEl = $('<div class="sheet-backdrop"></div>');
@@ -68,11 +59,11 @@ var Sheet = /*#__PURE__*/function (_Modal) {
     }
 
     extend(sheet, {
-      app: app,
+      app,
       push: $el.hasClass('sheet-modal-push') || sheet.params.push,
-      $el: $el,
+      $el,
       el: $el[0],
-      $backdropEl: $backdropEl,
+      $backdropEl,
       backdropEl: $backdropEl && $backdropEl[0],
       type: 'sheet',
       $htmlEl: $('html')
@@ -82,23 +73,23 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       $el.addClass('sheet-modal-push');
     }
 
-    var $pageContentEl;
+    let $pageContentEl;
 
     function scrollToElementOnOpen() {
-      var $scrollEl = $(sheet.params.scrollToEl).eq(0);
+      const $scrollEl = $(sheet.params.scrollToEl).eq(0);
       if ($scrollEl.length === 0) return;
       $pageContentEl = $scrollEl.parents('.page-content');
       if ($pageContentEl.length === 0) return;
-      var paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
-      var paddingBottom = parseInt($pageContentEl.css('padding-bottom'), 10);
-      var pageHeight = $pageContentEl[0].offsetHeight - paddingTop - $el.height();
-      var pageScrollHeight = $pageContentEl[0].scrollHeight - paddingTop - $el.height();
-      var pageScroll = $pageContentEl.scrollTop();
-      var newPaddingBottom;
-      var scrollElTop = $scrollEl.offset().top - paddingTop + $scrollEl[0].offsetHeight;
+      const paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
+      const paddingBottom = parseInt($pageContentEl.css('padding-bottom'), 10);
+      const pageHeight = $pageContentEl[0].offsetHeight - paddingTop - $el.height();
+      const pageScrollHeight = $pageContentEl[0].scrollHeight - paddingTop - $el.height();
+      const pageScroll = $pageContentEl.scrollTop();
+      let newPaddingBottom;
+      const scrollElTop = $scrollEl.offset().top - paddingTop + $scrollEl[0].offsetHeight;
 
       if (scrollElTop > pageHeight) {
-        var scrollTop = pageScroll + scrollElTop - pageHeight;
+        const scrollTop = pageScroll + scrollElTop - pageHeight;
 
         if (scrollTop + pageHeight > pageScrollHeight) {
           newPaddingBottom = scrollTop + pageHeight - pageScrollHeight + paddingBottom;
@@ -108,7 +99,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
           }
 
           $pageContentEl.css({
-            'padding-bottom': newPaddingBottom + "px"
+            'padding-bottom': `${newPaddingBottom}px`
           });
         }
 
@@ -125,9 +116,9 @@ var Sheet = /*#__PURE__*/function (_Modal) {
     }
 
     function handleClick(e) {
-      var target = e.target;
-      var $target = $(target);
-      var keyboardOpened = !device.desktop && device.cordova && (window.Keyboard && window.Keyboard.isVisible || window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible);
+      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(sheet.el).length === 0) {
@@ -140,39 +131,39 @@ var Sheet = /*#__PURE__*/function (_Modal) {
     }
 
     function onKeyDown(e) {
-      var keyCode = e.keyCode;
+      const keyCode = e.keyCode;
 
       if (keyCode === 27 && sheet.params.closeOnEscape) {
         sheet.close();
       }
     }
 
-    var pushOffset;
+    let pushOffset;
 
     function pushViewScale(offset) {
       return (app.height - offset * 2) / app.height;
     }
 
-    var isTouched = false;
-    var startTouch;
-    var currentTouch;
-    var isScrolling;
-    var touchStartTime;
-    var touchesDiff;
-    var isMoved = false;
-    var isTopSheetModal;
-    var swipeStepTranslate;
-    var startTranslate;
-    var currentTranslate;
-    var sheetElOffsetHeight;
-    var minTranslate;
-    var maxTranslate;
-    var $pushViewEl;
-    var pushBorderRadius;
-    var sheetPageContentEl;
-    var sheetPageContentScrollTop;
-    var sheetPageContentScrollHeight;
-    var sheetPageContentOffsetHeight;
+    let isTouched = false;
+    let startTouch;
+    let currentTouch;
+    let isScrolling;
+    let touchStartTime;
+    let touchesDiff;
+    let isMoved = false;
+    let isTopSheetModal;
+    let swipeStepTranslate;
+    let startTranslate;
+    let currentTranslate;
+    let sheetElOffsetHeight;
+    let minTranslate;
+    let maxTranslate;
+    let $pushViewEl;
+    let pushBorderRadius;
+    let sheetPageContentEl;
+    let sheetPageContentScrollTop;
+    let sheetPageContentScrollHeight;
+    let sheetPageContentOffsetHeight;
 
     function handleTouchStart(e) {
       if (isTouched || !(sheet.params.swipeToClose || sheet.params.swipeToStep)) return;
@@ -214,7 +205,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       }
 
       touchesDiff = startTouch.y - currentTouch.y;
-      var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
+      const direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
 
       if (!isMoved) {
         if (sheetPageContentEl && !$el.hasClass('modal-in-swipe-step')) {
@@ -253,7 +244,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       e.preventDefault();
 
       if (sheet.push && pushOffset) {
-        var progress = (currentTranslate - startTranslate) / sheetElOffsetHeight;
+        let progress = (currentTranslate - startTranslate) / sheetElOffsetHeight;
 
         if (sheet.params.swipeToStep) {
           if (isTopSheetModal) {
@@ -265,31 +256,31 @@ var Sheet = /*#__PURE__*/function (_Modal) {
 
         progress = Math.abs(progress);
         progress = Math.min(Math.max(progress, 0), 1);
-        var pushProgress = 1 - progress;
-        var scale = 1 - (1 - pushViewScale(pushOffset)) * pushProgress;
-        $pushViewEl.transition(0).forEach(function (el) {
-          el.style.setProperty('transform', "translate3d(0,0,0) scale(" + scale + ")", 'important');
+        const pushProgress = 1 - progress;
+        const scale = 1 - (1 - pushViewScale(pushOffset)) * pushProgress;
+        $pushViewEl.transition(0).forEach(el => {
+          el.style.setProperty('transform', `translate3d(0,0,0) scale(${scale})`, 'important');
         });
 
         if (sheet.params.swipeToStep) {
-          $pushViewEl.css('border-radius', pushBorderRadius * pushProgress + "px");
+          $pushViewEl.css('border-radius', `${pushBorderRadius * pushProgress}px`);
         }
       }
 
-      $el.transition(0).transform("translate3d(0," + currentTranslate + "px,0)");
+      $el.transition(0).transform(`translate3d(0,${currentTranslate}px,0)`);
 
       if (sheet.params.swipeToStep) {
-        var _progress;
+        let progress;
 
         if (isTopSheetModal) {
-          _progress = 1 - currentTranslate / swipeStepTranslate;
+          progress = 1 - currentTranslate / swipeStepTranslate;
         } else {
-          _progress = (swipeStepTranslate - currentTranslate) / swipeStepTranslate;
+          progress = (swipeStepTranslate - currentTranslate) / swipeStepTranslate;
         }
 
-        _progress = Math.min(Math.max(_progress, 0), 1);
-        $el.trigger('sheet:stepprogress', _progress);
-        sheet.emit('local::stepProgress sheetStepProgress', sheet, _progress);
+        progress = Math.min(Math.max(progress, 0), 1);
+        $el.trigger('sheet:stepprogress', progress);
+        sheet.emit('local::stepProgress sheetStepProgress', sheet, progress);
       }
     }
 
@@ -308,10 +299,10 @@ var Sheet = /*#__PURE__*/function (_Modal) {
         $pushViewEl.css('border-radius', '');
       }
 
-      var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
-      var diff = Math.abs(touchesDiff);
+      const direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
+      const diff = Math.abs(touchesDiff);
       if (diff === 0 || currentTranslate === startTranslate) return;
-      var timeDiff = new Date().getTime() - touchStartTime;
+      const timeDiff = new Date().getTime() - touchStartTime;
 
       if (!sheet.params.swipeToStep) {
         if (direction !== (isTopSheetModal ? 'to-top' : 'to-bottom')) {
@@ -325,10 +316,10 @@ var Sheet = /*#__PURE__*/function (_Modal) {
         return;
       }
 
-      var openDirection = isTopSheetModal ? 'to-bottom' : 'to-top';
-      var closeDirection = isTopSheetModal ? 'to-top' : 'to-bottom';
-      var absCurrentTranslate = Math.abs(currentTranslate);
-      var absSwipeStepTranslate = Math.abs(swipeStepTranslate);
+      const openDirection = isTopSheetModal ? 'to-bottom' : 'to-top';
+      const closeDirection = isTopSheetModal ? 'to-top' : 'to-bottom';
+      const absCurrentTranslate = Math.abs(currentTranslate);
+      const absSwipeStepTranslate = Math.abs(swipeStepTranslate);
 
       if (timeDiff < 300 && diff > 10) {
         if (direction === openDirection && absCurrentTranslate < absSwipeStepTranslate) {
@@ -385,7 +376,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       }
 
       if (timeDiff >= 300) {
-        var stepOpened = !$el.hasClass('modal-in-swipe-step');
+        const stepOpened = !$el.hasClass('modal-in-swipe-step');
 
         if (!stepOpened) {
           if (absCurrentTranslate < absSwipeStepTranslate / 2) {
@@ -427,12 +418,8 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       }
     }
 
-    sheet.setSwipeStep = function setSwipeStep(byResize) {
-      if (byResize === void 0) {
-        byResize = true;
-      }
-
-      var $swipeStepEl = $el.find('.sheet-modal-swipe-step').eq(0);
+    sheet.setSwipeStep = function setSwipeStep(byResize = true) {
+      const $swipeStepEl = $el.find('.sheet-modal-swipe-step').eq(0);
       if (!$swipeStepEl.length) return;
 
       if ($el.hasClass('sheet-modal-top')) {
@@ -441,7 +428,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
         swipeStepTranslate = $el[0].offsetHeight - ($swipeStepEl.offset().top - $el.offset().top + $swipeStepEl[0].offsetHeight);
       }
 
-      $el[0].style.setProperty('--f7-sheet-swipe-step', swipeStepTranslate + "px");
+      $el[0].style.setProperty('--f7-sheet-swipe-step', `${swipeStepTranslate}px`);
 
       if (!byResize) {
         $el.addClass('modal-in-swipe-step');
@@ -453,7 +440,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       sheet.setSwipeStep(true);
     }
 
-    var passive = support.passiveListener ? {
+    const passive = support.passiveListener ? {
       passive: true
     } : false;
 
@@ -461,14 +448,14 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       $el.on(app.touchEvents.start, handleTouchStart, passive);
       app.on('touchmove', handleTouchMove);
       app.on('touchend:passive', handleTouchEnd);
-      sheet.once('sheetDestroy', function () {
+      sheet.once('sheetDestroy', () => {
         $el.off(app.touchEvents.start, handleTouchStart, passive);
         app.off('touchmove', handleTouchMove);
         app.off('touchend:passive', handleTouchEnd);
       });
     }
 
-    sheet.on('open', function () {
+    sheet.on('open', () => {
       if (sheet.params.closeOnEscape) {
         $(document).on('keydown', onKeyDown);
       }
@@ -496,18 +483,18 @@ var Sheet = /*#__PURE__*/function (_Modal) {
             sheet.$htmlEl[0].style.setProperty('--f7-sheet-push-scale', pushViewScale(pushOffset));
           } else {
             $pushViewEl = app.$el.children('.view, .views');
-            pushBorderRadius = parseFloat($el.css("border-" + (isTopSheetModal ? 'bottom' : 'top') + "-left-radius"));
+            pushBorderRadius = parseFloat($el.css(`border-${isTopSheetModal ? 'bottom' : 'top'}-left-radius`));
             $pushViewEl.css('border-radius', '0px');
           }
         }
       }
     });
-    sheet.on('opened', function () {
+    sheet.on('opened', () => {
       if (sheet.params.closeByOutsideClick || sheet.params.closeByBackdropClick) {
         app.on('click', handleClick);
       }
     });
-    sheet.on('close', function () {
+    sheet.on('close', () => {
       if (sheet.params.swipeToStep) {
         $el.removeClass('modal-in-swipe-step');
         sheet.emit('local::_swipeStep', false);
@@ -533,7 +520,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
         sheet.$htmlEl.addClass('with-modal-sheet-push-closing');
       }
     });
-    sheet.on('closed', function () {
+    sheet.on('closed', () => {
       if (sheet.push && pushOffset) {
         sheet.$htmlEl.removeClass('with-modal-sheet-push-closing');
         sheet.$htmlEl[0].style.removeProperty('--f7-sheet-push-scale');
@@ -571,10 +558,9 @@ var Sheet = /*#__PURE__*/function (_Modal) {
     };
 
     $el[0].f7Modal = sheet;
-    return sheet || _assertThisInitialized(_this);
+    return sheet;
   }
 
-  return Sheet;
-}(Modal);
+}
 
 export default Sheet;

package/components/sheet/sheet-rtl.css

@@ -1 +1 @@
-:root{--f7-sheet-height:260px;--f7-sheet-border-color:transparent;--f7-sheet-transition-duration:300ms;--f7-sheet-push-border-radius:10px;--f7-sheet-push-offset:var(--f7-safe-area-top);--f7-sheet-bg-color:#fff}:root .theme-dark,:root.theme-dark{--f7-sheet-bg-color:#202020}.ios{--f7-sheet-border-color:var(--f7-bars-border-color)}.sheet-backdrop{z-index:11000}.sheet-modal{position:absolute;left:0;bottom:0;width:100%;height:var(--f7-sheet-height);display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100%,0);background:var(--f7-sheet-bg-color);z-index:12500;will-change:transform,opacity}.sheet-modal.modal-in,.sheet-modal.modal-out{transition-duration:var(--f7-sheet-transition-duration)}.sheet-modal.not-animated{transition-duration:0s}.sheet-modal.modal-in{display:block;transform:translate3d(0,0,0)}.sheet-modal.modal-in-swipe-step{display:block;transform:translate3d(0,var(--f7-sheet-swipe-step,0),0)}.sheet-modal.modal-out{transform:translate3d(0,100%,0)}.sheet-modal .sheet-modal-inner{height:100%;position:relative;overflow:hidden}.sheet-modal .toolbar{--f7-safe-area-bottom:0px;position:relative;width:100%}.sheet-modal .toolbar:after,.sheet-modal .toolbar:before{display:none}.sheet-modal .toolbar+.sheet-modal-inner{height:calc(100% - var(--f7-toolbar-height))}.sheet-modal .toolbar+.sheet-modal-inner .page-content{--f7-page-toolbar-top-offset:0px;--f7-page-toolbar-bottom-offset:0px}.sheet-modal-top:after{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-top:after{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-bottom,.sheet-modal:not(.sheet-modal-top){--f7-safe-area-top:0px}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-top{--f7-safe-area-bottom:0px;bottom:auto;top:0;transform:translate3d(0,-100%,0)}.sheet-modal-top.modal-out{transform:translate3d(0,-100%,0)}.sheet-modal-top .toolbar-bottom{position:absolute}.sheet-modal-top .page-content{padding-top:var(--f7-safe-area-top)}html.with-modal-sheet-push .sheet-modal-push,html.with-modal-sheet-push-closing .sheet-modal-push{--f7-sheet-border-color:transparent;border-radius:var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;overflow:hidden}html.with-modal-sheet-push .sheet-modal-push .page,html.with-modal-sheet-push .sheet-modal-push .view,html.with-modal-sheet-push-closing .sheet-modal-push .page,html.with-modal-sheet-push-closing .sheet-modal-push .view{--f7-safe-area-top:0px}html.with-modal-sheet-push .sheet-modal-push.sheet-modal-top,html.with-modal-sheet-push-closing .sheet-modal-push.sheet-modal-top{border-radius:0 0 var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{background:#000}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views,html.with-modal-sheet-push-closing .framework7-root>.view,html.with-modal-sheet-push-closing .framework7-root>.views{transition-duration:var(--f7-sheet-transition-duration)}html.with-modal-sheet-push .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.views:after,html.with-modal-sheet-push.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push.theme-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-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;opacity:1;animation:sheet-dark-push-overlay-fade-in var(--f7-sheet-transition-duration) forwards}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views{border-radius:var(--f7-sheet-push-border-radius);transform:translate3d(0,0,0px) scale(var(--f7-sheet-push-scale,1))!important}html.with-modal-sheet-push-closing .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.views:after{animation:sheet-dark-push-overlay-fade-out var(--f7-sheet-transition-duration) forwards}@keyframes sheet-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes sheet-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}.md .sheet-modal .toolbar a.link:not(.tab-link){flex-shrink:0}
+:root{--f7-sheet-height:260px;--f7-sheet-border-color:transparent;--f7-sheet-transition-duration:300ms;--f7-sheet-push-border-radius:10px;--f7-sheet-push-offset:var(--f7-safe-area-top);--f7-sheet-bg-color:#fff}:root .dark,:root.dark{--f7-sheet-bg-color:#202020}.ios{--f7-sheet-border-color:var(--f7-bars-border-color)}.sheet-backdrop{z-index:11000}.sheet-backdrop-unique{z-index:12500}.sheet-modal{position:absolute;left:0;bottom:0;width:100%;height:var(--f7-sheet-height);display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100%,0);background:var(--f7-sheet-bg-color);z-index:12500;will-change:transform,opacity}.sheet-modal.modal-in,.sheet-modal.modal-out{transition-duration:var(--f7-sheet-transition-duration)}.sheet-modal.not-animated{transition-duration:0s}.sheet-modal.modal-in{display:block;transform:translate3d(0,0,0)}.sheet-modal.modal-in-swipe-step{display:block;transform:translate3d(0,var(--f7-sheet-swipe-step,0),0)}.sheet-modal.modal-out{transform:translate3d(0,100%,0)}.sheet-modal .sheet-modal-inner{height:100%;position:relative;overflow:hidden}.sheet-modal .toolbar{--f7-safe-area-bottom:0px;position:relative;width:100%}.sheet-modal .toolbar:after,.sheet-modal .toolbar:before{display:none}.sheet-modal .toolbar+.sheet-modal-inner{height:calc(100% - var(--f7-toolbar-height))}.sheet-modal .toolbar+.sheet-modal-inner .page-content{--f7-page-toolbar-top-offset:0px;--f7-page-toolbar-bottom-offset:0px}.sheet-modal-top:after{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-top:after{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-bottom,.sheet-modal:not(.sheet-modal-top){--f7-safe-area-top:0px}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-top{--f7-safe-area-bottom:0px;bottom:auto;top:0;transform:translate3d(0,-100%,0)}.sheet-modal-top.modal-out{transform:translate3d(0,-100%,0)}.sheet-modal-top .toolbar-bottom{position:absolute}.sheet-modal-top .page-content{padding-top:var(--f7-safe-area-top)}html.with-modal-sheet-push .sheet-modal-push,html.with-modal-sheet-push-closing .sheet-modal-push{--f7-sheet-border-color:transparent;border-radius:var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;overflow:hidden}html.with-modal-sheet-push .sheet-modal-push .page,html.with-modal-sheet-push .sheet-modal-push .view,html.with-modal-sheet-push-closing .sheet-modal-push .page,html.with-modal-sheet-push-closing .sheet-modal-push .view{--f7-safe-area-top:0px}html.with-modal-sheet-push .sheet-modal-push.sheet-modal-top,html.with-modal-sheet-push-closing .sheet-modal-push.sheet-modal-top{border-radius:0 0 var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{background:#000}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views,html.with-modal-sheet-push-closing .framework7-root>.view,html.with-modal-sheet-push-closing .framework7-root>.views{transition-duration:var(--f7-sheet-transition-duration)}html.with-modal-sheet-push .dark .framework7-root>.view:after,html.with-modal-sheet-push .dark .framework7-root>.views:after,html.with-modal-sheet-push .dark.framework7-root>.view:after,html.with-modal-sheet-push .dark.framework7-root>.views:after,html.with-modal-sheet-push .framework7-root>.view.dark:after,html.with-modal-sheet-push .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing .dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing.dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.dark .framework7-root>.views:after,html.with-modal-sheet-push.dark .framework7-root>.view:after,html.with-modal-sheet-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-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;opacity:1;animation:sheet-dark-push-overlay-fade-in var(--f7-sheet-transition-duration) forwards}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views{border-radius:var(--f7-sheet-push-border-radius);transform:translate3d(0,0,0px) scale(var(--f7-sheet-push-scale,1))!important}html.with-modal-sheet-push-closing .dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing.dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.dark .framework7-root>.views:after{animation:sheet-dark-push-overlay-fade-out var(--f7-sheet-transition-duration) forwards}@keyframes sheet-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes sheet-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}.md .sheet-modal .toolbar a.link:not(.tab-link){flex-shrink:0}

package/components/sheet/sheet.css

@@ -1 +1 @@
-:root{--f7-sheet-height:260px;--f7-sheet-border-color:transparent;--f7-sheet-transition-duration:300ms;--f7-sheet-push-border-radius:10px;--f7-sheet-push-offset:var(--f7-safe-area-top);--f7-sheet-bg-color:#fff}:root .theme-dark,:root.theme-dark{--f7-sheet-bg-color:#202020}.ios{--f7-sheet-border-color:var(--f7-bars-border-color)}.sheet-backdrop{z-index:11000}.sheet-modal{position:absolute;left:0;bottom:0;width:100%;height:var(--f7-sheet-height);display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100%,0);background:var(--f7-sheet-bg-color);z-index:12500;will-change:transform,opacity}.sheet-modal.modal-in,.sheet-modal.modal-out{transition-duration:var(--f7-sheet-transition-duration)}.sheet-modal.not-animated{transition-duration:0s}.sheet-modal.modal-in{display:block;transform:translate3d(0,0,0)}.sheet-modal.modal-in-swipe-step{display:block;transform:translate3d(0,var(--f7-sheet-swipe-step,0),0)}.sheet-modal.modal-out{transform:translate3d(0,100%,0)}.sheet-modal .sheet-modal-inner{height:100%;position:relative;overflow:hidden}.sheet-modal .toolbar{--f7-safe-area-bottom:0px;position:relative;width:100%}.sheet-modal .toolbar:after,.sheet-modal .toolbar:before{display:none}.sheet-modal .toolbar+.sheet-modal-inner{height:calc(100% - var(--f7-toolbar-height))}.sheet-modal .toolbar+.sheet-modal-inner .page-content{--f7-page-toolbar-top-offset:0px;--f7-page-toolbar-bottom-offset:0px}.sheet-modal-top:after{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-top:after{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-bottom,.sheet-modal:not(.sheet-modal-top){--f7-safe-area-top:0px}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-top{--f7-safe-area-bottom:0px;bottom:auto;top:0;transform:translate3d(0,-100%,0)}.sheet-modal-top.modal-out{transform:translate3d(0,-100%,0)}.sheet-modal-top .toolbar-bottom{position:absolute}.sheet-modal-top .page-content{padding-top:var(--f7-safe-area-top)}html.with-modal-sheet-push .sheet-modal-push,html.with-modal-sheet-push-closing .sheet-modal-push{--f7-sheet-border-color:transparent;border-radius:var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;overflow:hidden}html.with-modal-sheet-push .sheet-modal-push .page,html.with-modal-sheet-push .sheet-modal-push .view,html.with-modal-sheet-push-closing .sheet-modal-push .page,html.with-modal-sheet-push-closing .sheet-modal-push .view{--f7-safe-area-top:0px}html.with-modal-sheet-push .sheet-modal-push.sheet-modal-top,html.with-modal-sheet-push-closing .sheet-modal-push.sheet-modal-top{border-radius:0 0 var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{background:#000}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views,html.with-modal-sheet-push-closing .framework7-root>.view,html.with-modal-sheet-push-closing .framework7-root>.views{transition-duration:var(--f7-sheet-transition-duration)}html.with-modal-sheet-push .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.views:after,html.with-modal-sheet-push.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push.theme-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-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;opacity:1;animation:sheet-dark-push-overlay-fade-in var(--f7-sheet-transition-duration) forwards}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views{border-radius:var(--f7-sheet-push-border-radius);transform:translate3d(0,0,0px) scale(var(--f7-sheet-push-scale,1))!important}html.with-modal-sheet-push-closing .framework7-root>.view.theme-dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.theme-dark:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .theme-dark.framework7-root>.views:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.theme-dark .framework7-root>.views:after{animation:sheet-dark-push-overlay-fade-out var(--f7-sheet-transition-duration) forwards}@keyframes sheet-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes sheet-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}.md .sheet-modal .toolbar a.link:not(.tab-link){flex-shrink:0}
+:root{--f7-sheet-height:260px;--f7-sheet-border-color:transparent;--f7-sheet-transition-duration:300ms;--f7-sheet-push-border-radius:10px;--f7-sheet-push-offset:var(--f7-safe-area-top);--f7-sheet-bg-color:#fff}:root .dark,:root.dark{--f7-sheet-bg-color:#202020}.ios{--f7-sheet-border-color:var(--f7-bars-border-color)}.sheet-backdrop{z-index:11000}.sheet-backdrop-unique{z-index:12500}.sheet-modal{position:absolute;left:0;bottom:0;width:100%;height:var(--f7-sheet-height);display:none;box-sizing:border-box;transition-property:transform;transform:translate3d(0,100%,0);background:var(--f7-sheet-bg-color);z-index:12500;will-change:transform,opacity}.sheet-modal.modal-in,.sheet-modal.modal-out{transition-duration:var(--f7-sheet-transition-duration)}.sheet-modal.not-animated{transition-duration:0s}.sheet-modal.modal-in{display:block;transform:translate3d(0,0,0)}.sheet-modal.modal-in-swipe-step{display:block;transform:translate3d(0,var(--f7-sheet-swipe-step,0),0)}.sheet-modal.modal-out{transform:translate3d(0,100%,0)}.sheet-modal .sheet-modal-inner{height:100%;position:relative;overflow:hidden}.sheet-modal .toolbar{--f7-safe-area-bottom:0px;position:relative;width:100%}.sheet-modal .toolbar:after,.sheet-modal .toolbar:before{display:none}.sheet-modal .toolbar+.sheet-modal-inner{height:calc(100% - var(--f7-toolbar-height))}.sheet-modal .toolbar+.sheet-modal-inner .page-content{--f7-page-toolbar-top-offset:0px;--f7-page-toolbar-bottom-offset:0px}.sheet-modal-top:after{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-top:after{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-bottom,.sheet-modal:not(.sheet-modal-top){--f7-safe-area-top:0px}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{content:'';position:absolute;background-color:var(--f7-sheet-border-color);display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.sheet-modal-bottom:before,.sheet-modal:not(.sheet-modal-top):before{z-index:700;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d}.sheet-modal-top{--f7-safe-area-bottom:0px;bottom:auto;top:0;transform:translate3d(0,-100%,0)}.sheet-modal-top.modal-out{transform:translate3d(0,-100%,0)}.sheet-modal-top .toolbar-bottom{position:absolute}.sheet-modal-top .page-content{padding-top:var(--f7-safe-area-top)}html.with-modal-sheet-push .sheet-modal-push,html.with-modal-sheet-push-closing .sheet-modal-push{--f7-sheet-border-color:transparent;border-radius:var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;overflow:hidden}html.with-modal-sheet-push .sheet-modal-push .page,html.with-modal-sheet-push .sheet-modal-push .view,html.with-modal-sheet-push-closing .sheet-modal-push .page,html.with-modal-sheet-push-closing .sheet-modal-push .view{--f7-safe-area-top:0px}html.with-modal-sheet-push .sheet-modal-push.sheet-modal-top,html.with-modal-sheet-push-closing .sheet-modal-push.sheet-modal-top{border-radius:0 0 var(--f7-sheet-push-border-radius) var(--f7-sheet-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{background:#000}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views,html.with-modal-sheet-push-closing .framework7-root>.view,html.with-modal-sheet-push-closing .framework7-root>.views{transition-duration:var(--f7-sheet-transition-duration)}html.with-modal-sheet-push .dark .framework7-root>.view:after,html.with-modal-sheet-push .dark .framework7-root>.views:after,html.with-modal-sheet-push .dark.framework7-root>.view:after,html.with-modal-sheet-push .dark.framework7-root>.views:after,html.with-modal-sheet-push .framework7-root>.view.dark:after,html.with-modal-sheet-push .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing .dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing.dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.dark .framework7-root>.views:after,html.with-modal-sheet-push.dark .framework7-root>.view:after,html.with-modal-sheet-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-sheet-push-border-radius) var(--f7-sheet-push-border-radius) 0 0;opacity:1;animation:sheet-dark-push-overlay-fade-in var(--f7-sheet-transition-duration) forwards}html.with-modal-sheet-push .framework7-root>.view,html.with-modal-sheet-push .framework7-root>.views{border-radius:var(--f7-sheet-push-border-radius);transform:translate3d(0,0,0px) scale(var(--f7-sheet-push-scale,1))!important}html.with-modal-sheet-push-closing .dark .framework7-root>.view:after,html.with-modal-sheet-push-closing .dark .framework7-root>.views:after,html.with-modal-sheet-push-closing .dark.framework7-root>.view:after,html.with-modal-sheet-push-closing .dark.framework7-root>.views:after,html.with-modal-sheet-push-closing .framework7-root>.view.dark:after,html.with-modal-sheet-push-closing .framework7-root>.views.dark:after,html.with-modal-sheet-push-closing.dark .framework7-root>.view:after,html.with-modal-sheet-push-closing.dark .framework7-root>.views:after{animation:sheet-dark-push-overlay-fade-out var(--f7-sheet-transition-duration) forwards}@keyframes sheet-dark-push-overlay-fade-in{from{opacity:0}to{opacity:1}}@keyframes sheet-dark-push-overlay-fade-out{from{opacity:1}to{opacity:0}}.md .sheet-modal .toolbar a.link:not(.tab-link){flex-shrink:0}

package/components/sheet/sheet.d.ts

@@ -29,6 +29,8 @@ export namespace Sheet {
     backdrop?: boolean;
     /** Backdrop element to share across instances */
     backdropEl?: HTMLElement | CSSSelector;
+    /** If enabled it creates unique backdrop element exclusively for this modal (default false) */
+    backdropUnique?: boolean;
     /** HTML element or string (with CSS selector) of element. If specified, then sheet will try to scroll page content to this element on open */
     scrollToEl?: HTMLElement | CSSSelector;
     /** When enabled, Sheet Modal will be closed on backdrop click. (default true) */

package/components/sheet/sheet.js

@@ -1 +1,69 @@
-(function framework7ComponentLoader(e,t){void 0===t&&(t=!0);var s=e.$,o=e.utils,r=e.getDevice,a=e.getSupport,p=(e.Class,e.Modal),l=(e.ConstructorMethods,e.ModalMethods),i=o.extend,n=o.now,c=o.getTranslate;function h(e){this.wrapped=e}function d(e){var t,s;function o(t,s){try{var a=e[t](s),p=a.value,l=p instanceof h;Promise.resolve(l?p.wrapped:p).then((function(e){l?o("return"===t?"return":"next",e):r(a.done?"return":"normal",e)}),(function(e){o("throw",e)}))}catch(e){r("throw",e)}}function r(e,r){switch(e){case"return":t.resolve({value:r,done:!0});break;case"throw":t.reject(r);break;default:t.resolve({value:r,done:!1})}(t=t.next)?o(t.key,t.arg):s=null}this._invoke=function(e,r){return new Promise((function(a,p){var l={key:e,arg:r,resolve:a,reject:p,next:null};s?s=s.next=l:(t=s=l,o(e,r))}))},"function"!=typeof e.return&&(this.return=void 0)}function m(e,t){return(m=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function u(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}d.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},d.prototype.next=function(e){return this._invoke("next",e)},d.prototype.throw=function(e){return this._invoke("throw",e)},d.prototype.return=function(e){return this._invoke("return",e)};var f=function(e){var t,o;function p(t,o){var p,l,h,d,m,f=i({on:{}},t.params.sheet,o),g=u(p=e.call(this,t,f)||this),v=a(),w=r();if(g.params=f,void 0===g.params.backdrop&&(g.params.backdrop="ios"!==t.theme),(l=g.params.el?s(g.params.el).eq(0):s(g.params.content).filter((function(e){return 1===e.nodeType})).eq(0))&&l.length>0&&l[0].f7Modal)return l[0].f7Modal||u(p);if(0===l.length)return g.destroy()||u(p);function y(e){var t=e.target,o=s(t);!w.desktop&&w.cordova&&(window.Keyboard&&window.Keyboard.isVisible||window.cordova.plugins&&window.cordova.plugins.Keyboard&&window.cordova.plugins.Keyboard.isVisible)||0===o.closest(g.el).length&&(g.params.closeByBackdropClick&&g.params.backdrop&&g.backdropEl&&g.backdropEl===t||g.params.closeByOutsideClick)&&g.close()}function b(e){27===e.keyCode&&g.params.closeOnEscape&&g.close()}function C(e){return(t.height-2*e)/t.height}g.params.backdrop&&g.params.backdropEl?h=s(g.params.backdropEl):g.params.backdrop&&0===(h=g.$containerEl.children(".sheet-backdrop")).length&&(h=s('<div class="sheet-backdrop"></div>'),g.$containerEl.append(h)),i(g,{app:t,push:l.hasClass("sheet-modal-push")||g.params.push,$el:l,el:l[0],$backdropEl:h,backdropEl:h&&h[0],type:"sheet",$htmlEl:s("html")}),g.params.push&&l.addClass("sheet-modal-push");var k,S,E,T,P,x,M,$,O,_,H,B,I,N,q,j,D,K,X=!1,Y=!1;function z(e){X||!g.params.swipeToClose&&!g.params.swipeToStep||g.params.swipeHandler&&0===s(e.target).closest(g.params.swipeHandler).length||(X=!0,Y=!1,k={x:"touchstart"===e.type?e.targetTouches[0].pageX:e.pageX,y:"touchstart"===e.type?e.targetTouches[0].pageY:e.pageY},T=n(),E=void 0,x=l.hasClass("sheet-modal-top"),g.params.swipeHandler||"touchstart"!==e.type||(q=s(e.target).closest(".page-content")[0]))}function A(e){if(X){if(S={x:"touchmove"===e.type?e.targetTouches[0].pageX:e.pageX,y:"touchmove"===e.type?e.targetTouches[0].pageY:e.pageY},void 0===E&&(E=!!(E||Math.abs(S.x-k.x)>Math.abs(S.y-k.y))),E)return X=!1,void(Y=!1);var s,o=(P=k.y-S.y)<0?"to-bottom":"to-top";if(!Y){if(q&&!l.hasClass("modal-in-swipe-step")&&(j=q.scrollTop,D=q.scrollHeight,K=q.offsetHeight,!(D===K||"to-bottom"===o&&0===j||"to-top"===o&&j===D-K)))return l.transform(""),X=!1,void(Y=!1);g.push&&m&&(I=t.$el.children(".view, .views")),_=l[0].offsetHeight,$=c(l[0],"y"),x?(H=g.params.swipeToClose?-_:-M,B=0):(H=0,B=g.params.swipeToClose?_:M),Y=!0}if(O=$-P,O=Math.min(Math.max(O,H),B),e.preventDefault(),g.push&&m){var r=(O-$)/_;g.params.swipeToStep&&(r=x?O/M:1-(M-O)/M),r=Math.abs(r);var a=1-(r=Math.min(Math.max(r,0),1)),p=1-(1-C(m))*a;I.transition(0).forEach((function(e){e.style.setProperty("transform","translate3d(0,0,0) scale("+p+")","important")})),g.params.swipeToStep&&I.css("border-radius",N*a+"px")}if(l.transition(0).transform("translate3d(0,"+O+"px,0)"),g.params.swipeToStep)s=x?1-O/M:(M-O)/M,s=Math.min(Math.max(s,0),1),l.trigger("sheet:stepprogress",s),g.emit("local::stepProgress sheetStepProgress",g,s)}}function L(){if(X=!1,Y){Y=!1,l.transform("").transition(""),g.push&&m&&(I.transition("").transform(""),I.css("border-radius",""));var e=P<0?"to-bottom":"to-top",t=Math.abs(P);if(0!==t&&O!==$){var s=(new Date).getTime()-T;if(g.params.swipeToStep){var o=x?"to-bottom":"to-top",r=x?"to-top":"to-bottom",a=Math.abs(O),p=Math.abs(M);if(s<300&&t>10)return e===o&&a<p&&(l.removeClass("modal-in-swipe-step"),l.trigger("sheet:stepprogress",1),g.emit("local::stepProgress sheetStepProgress",g,1),g.emit("local::_swipeStep",!1),l.trigger("sheet:stepopen"),g.emit("local::stepOpen sheetStepOpen",g),g.push&&m&&(g.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(m)),I.css("border-radius",""))),e===r&&a>p&&(g.params.swipeToClose?g.close():(l.addClass("modal-in-swipe-step"),l.trigger("sheet:stepprogress",0),g.emit("local::stepProgress sheetStepProgress",g,0),g.emit("local::_swipeStep",!0),l.trigger("sheet:stepclose"),g.emit("local::stepClose sheetStepClose",g),g.push&&m&&(g.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),I.css("border-radius","0px")))),void(e===r&&a<=p&&(l.addClass("modal-in-swipe-step"),l.trigger("sheet:stepprogress",0),g.emit("local::stepProgress sheetStepProgress",g,0),g.emit("local::_swipeStep",!0),l.trigger("sheet:stepclose"),g.emit("local::stepClose sheetStepClose",g),g.push&&m&&(g.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),I.css("border-radius","0px"))));if(s>=300){var i=!l.hasClass("modal-in-swipe-step");i?i&&(a>p+(_-p)/2?g.params.swipeToClose&&g.close():a>p/2&&(l.addClass("modal-in-swipe-step"),l.trigger("sheet:stepprogress",0),g.emit("local::stepProgress sheetStepProgress",g,0),g.emit("local::_swipeStep",!0),l.trigger("sheet:stepclose"),g.emit("local::stepClose sheetStepClose",g),g.push&&m&&(g.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),I.css("border-radius","0px")))):a<p/2?(l.removeClass("modal-in-swipe-step"),l.trigger("sheet:stepprogress",1),g.emit("local::stepProgress sheetStepProgress",g,1),g.emit("local::_swipeStep",!1),l.trigger("sheet:stepopen"),g.emit("local::stepOpen sheetStepOpen",g),g.push&&m&&(g.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(m)),I.css("border-radius",""))):a-p>(_-p)/2&&g.params.swipeToClose&&g.close()}}else{if(e!==(x?"to-top":"to-bottom"))return;(s<300&&t>20||s>=300&&t>_/2)&&g.close()}}}}function V(){g.setSwipeStep(!0)}g.setSwipeStep=function(e){void 0===e&&(e=!0);var t=l.find(".sheet-modal-swipe-step").eq(0);t.length&&(M=l.hasClass("sheet-modal-top")?-(t.offset().top-l.offset().top+t[0].offsetHeight):l[0].offsetHeight-(t.offset().top-l.offset().top+t[0].offsetHeight),l[0].style.setProperty("--f7-sheet-swipe-step",M+"px"),e||(l.addClass("modal-in-swipe-step"),g.emit("local::_swipeStep",!0)))};var F=!!v.passiveListener&&{passive:!0};return(g.params.swipeToClose||g.params.swipeToStep)&&(l.on(t.touchEvents.start,z,F),t.on("touchmove",A),t.on("touchend:passive",L),g.once("sheetDestroy",(function(){l.off(t.touchEvents.start,z,F),t.off("touchmove",A),t.off("touchend:passive",L)}))),g.on("open",(function(){g.params.closeOnEscape&&s(document).on("keydown",b),l.prevAll(".popup.modal-in").addClass("popup-behind"),g.params.swipeToStep&&(g.setSwipeStep(!1),t.on("resize",V)),g.params.scrollToEl&&function(){var e=s(g.params.scrollToEl).eq(0);if(0!==e.length&&0!==(d=e.parents(".page-content")).length){var t,o=parseInt(d.css("padding-top"),10),r=parseInt(d.css("padding-bottom"),10),a=d[0].offsetHeight-o-l.height(),p=d[0].scrollHeight-o-l.height(),i=d.scrollTop(),n=e.offset().top-o+e[0].offsetHeight;if(n>a){var c=i+n-a;c+a>p&&(t=c+a-p+r,a===p&&(t=l.height()),d.css({"padding-bottom":t+"px"})),d.scrollTop(c,300)}}}(),g.push&&(m=parseInt(l.css("--f7-sheet-push-offset"),10),Number.isNaN(m)&&(m=0),m&&(l.addClass("sheet-modal-push"),g.$htmlEl.addClass("with-modal-sheet-push"),g.params.swipeToStep?(I=t.$el.children(".view, .views"),N=parseFloat(l.css("border-"+(x?"bottom":"top")+"-left-radius")),I.css("border-radius","0px")):g.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(m))))})),g.on("opened",(function(){(g.params.closeByOutsideClick||g.params.closeByBackdropClick)&&t.on("click",y)})),g.on("close",(function(){g.params.swipeToStep&&(l.removeClass("modal-in-swipe-step"),g.emit("local::_swipeStep",!1),t.off("resize",V)),g.params.closeOnEscape&&s(document).off("keydown",b),g.params.scrollToEl&&d&&d.length>0&&d.css({"padding-bottom":""}),(g.params.closeByOutsideClick||g.params.closeByBackdropClick)&&t.off("click",y),l.prevAll(".popup.modal-in").eq(0).removeClass("popup-behind"),g.push&&m&&(g.$htmlEl.removeClass("with-modal-sheet-push"),g.$htmlEl.addClass("with-modal-sheet-push-closing"))})),g.on("closed",(function(){g.push&&m&&(g.$htmlEl.removeClass("with-modal-sheet-push-closing"),g.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"))})),g.stepOpen=function(){l.removeClass("modal-in-swipe-step"),g.emit("local::_swipeStep",!1),g.push&&(m||(m=parseInt(l.css("--f7-sheet-push-offset"),10),Number.isNaN(m)&&(m=0)),m&&g.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(m)))},g.stepClose=function(){l.addClass("modal-in-swipe-step"),g.emit("local::_swipeStep",!0),g.push&&g.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale")},g.stepToggle=function(){l.toggleClass("modal-in-swipe-step"),g.emit("local::_swipeStep",l.hasClass("modal-in-swipe-step"))},l[0].f7Modal=g,g||u(p)}return o=e,(t=p).prototype=Object.create(o.prototype),t.prototype.constructor=t,m(t,o),p}(p),g={name:"sheet",params:{sheet:{push:!1,backdrop:void 0,backdropEl:void 0,closeByBackdropClick:!0,closeByOutsideClick:!1,closeOnEscape:!1,swipeToClose:!1,swipeToStep:!1,swipeHandler:null,containerEl:null}},static:{Sheet:f},create:function(){var e=this;e.sheet=i({},l({app:e,constructor:f,defaultSelector:".sheet-modal.modal-in"}),{stepOpen:function(t){var s=e.sheet.get(t);if(s&&s.stepOpen)return s.stepOpen()},stepClose:function(t){var s=e.sheet.get(t);if(s&&s.stepClose)return s.stepClose()},stepToggle:function(t){var s=e.sheet.get(t);if(s&&s.stepToggle)return s.stepToggle()}})},clicks:{".sheet-open":function(e,t){void 0===t&&(t={});s(".sheet-modal.modal-in").length>0&&t.sheet&&s(t.sheet)[0]!==s(".sheet-modal.modal-in")[0]&&this.sheet.close(".sheet-modal.modal-in"),this.sheet.open(t.sheet,t.animate,e)},".sheet-close":function(e,t){void 0===t&&(t={});this.sheet.close(t.sheet,t.animate,e)}}};if(t){if(e.prototype.modules&&e.prototype.modules[g.name])return;e.use(g),e.instance&&(e.instance.useModuleParams(g,e.instance.params),e.instance.useModule(g))}return g}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
+import $ from '../../shared/dom7.js';
+import { extend } from '../../shared/utils.js';
+import Sheet from './sheet-class.js';
+import ModalMethods from '../../shared/modal-methods.js';
+export default {
+  name: 'sheet',
+  params: {
+    sheet: {
+      push: false,
+      backdrop: undefined,
+      backdropEl: undefined,
+      backdropUnique: false,
+      closeByBackdropClick: true,
+      closeByOutsideClick: false,
+      closeOnEscape: false,
+      swipeToClose: false,
+      swipeToStep: false,
+      swipeHandler: null,
+      containerEl: null
+    }
+  },
+  static: {
+    Sheet
+  },
+
+  create() {
+    const app = this;
+    app.sheet = extend({}, ModalMethods({
+      app,
+      constructor: Sheet,
+      defaultSelector: '.sheet-modal.modal-in'
+    }), {
+      stepOpen(sheet) {
+        const sheetInstance = app.sheet.get(sheet);
+        if (sheetInstance && sheetInstance.stepOpen) return sheetInstance.stepOpen();
+        return undefined;
+      },
+
+      stepClose(sheet) {
+        const sheetInstance = app.sheet.get(sheet);
+        if (sheetInstance && sheetInstance.stepClose) return sheetInstance.stepClose();
+        return undefined;
+      },
+
+      stepToggle(sheet) {
+        const sheetInstance = app.sheet.get(sheet);
+        if (sheetInstance && sheetInstance.stepToggle) return sheetInstance.stepToggle();
+        return undefined;
+      }
+
+    });
+  },
+
+  clicks: {
+    '.sheet-open': function openSheet($clickedEl, data = {}) {
+      const app = this;
+
+      if ($('.sheet-modal.modal-in').length > 0 && data.sheet && $(data.sheet)[0] !== $('.sheet-modal.modal-in')[0]) {
+        app.sheet.close('.sheet-modal.modal-in');
+      }
+
+      app.sheet.open(data.sheet, data.animate, $clickedEl);
+    },
+    '.sheet-close': function closeSheet($clickedEl, data = {}) {
+      const app = this;
+      app.sheet.close(data.sheet, data.animate, $clickedEl);
+    }
+  }
+};

package/components/sheet/sheet.lazy.js

@@ -0,0 +1 @@
+(function framework7ComponentLoader(e,s){void 0===s&&(s=!0);var t=e.$,o=e.utils,p=e.getDevice,a=e.getSupport,r=(e.Class,e.Modal),l=(e.ConstructorMethods,e.ModalMethods),i=o.extend,n=o.now,c=o.getTranslate;class h extends r{constructor(e,s){const o=i({on:{}},e.params.sheet,s);super(e,o);const r=this,l=getWindow(),h=getDocument(),m=a(),d=p();let u,g,f,w;if(r.params=o,void 0===r.params.backdrop&&(r.params.backdrop="ios"!==e.theme),u=r.params.el?t(r.params.el).eq(0):t(r.params.content).filter((e=>1===e.nodeType)).eq(0),u&&u.length>0&&u[0].f7Modal)return u[0].f7Modal;if(0===u.length)return r.destroy();function y(e){const s=e.target,o=t(s);!d.desktop&&d.cordova&&(l.Keyboard&&l.Keyboard.isVisible||l.cordova.plugins&&l.cordova.plugins.Keyboard&&l.cordova.plugins.Keyboard.isVisible)||0===o.closest(r.el).length&&(r.params.closeByBackdropClick&&r.params.backdrop&&r.backdropEl&&r.backdropEl===s||r.params.closeByOutsideClick)&&r.close()}function b(e){27===e.keyCode&&r.params.closeOnEscape&&r.close()}function C(s){return(e.height-2*s)/e.height}r.params.backdrop&&r.params.backdropEl?g=t(r.params.backdropEl):r.params.backdrop&&(r.params.backdropUnique?(g=t('<div class="sheet-backdrop sheet-backdrop-unique"></div>'),r.$containerEl.append(g)):g=r.$containerEl.children(".sheet-backdrop"),0===g.length&&(g=t('<div class="sheet-backdrop"></div>'),r.$containerEl.append(g))),i(r,{app:e,push:u.hasClass("sheet-modal-push")||r.params.push,$el:u,el:u[0],$backdropEl:g,backdropEl:g&&g[0],type:"sheet",$htmlEl:t("html")}),r.params.push&&u.addClass("sheet-modal-push");let v,S,k,E,T,$,P,M,x,O,H,B,_,q,N,D,I,K,X=!1,Y=!1;function z(e){X||!r.params.swipeToClose&&!r.params.swipeToStep||r.params.swipeHandler&&0===t(e.target).closest(r.params.swipeHandler).length||(X=!0,Y=!1,v={x:"touchstart"===e.type?e.targetTouches[0].pageX:e.pageX,y:"touchstart"===e.type?e.targetTouches[0].pageY:e.pageY},E=n(),k=void 0,$=u.hasClass("sheet-modal-top"),r.params.swipeHandler||"touchstart"!==e.type||(N=t(e.target).closest(".page-content")[0]))}function A(s){if(!X)return;if(S={x:"touchmove"===s.type?s.targetTouches[0].pageX:s.pageX,y:"touchmove"===s.type?s.targetTouches[0].pageY:s.pageY},void 0===k&&(k=!!(k||Math.abs(S.x-v.x)>Math.abs(S.y-v.y))),k)return X=!1,void(Y=!1);T=v.y-S.y;const t=T<0?"to-bottom":"to-top";if(!Y){if(N&&!u.hasClass("modal-in-swipe-step")&&(D=N.scrollTop,I=N.scrollHeight,K=N.offsetHeight,!(I===K||"to-bottom"===t&&0===D||"to-top"===t&&D===I-K)))return u.transform(""),X=!1,void(Y=!1);r.push&&w&&(_=e.$el.children(".view, .views")),O=u[0].offsetHeight,M=c(u[0],"y"),$?(H=r.params.swipeToClose?-O:-P,B=0):(H=0,B=r.params.swipeToClose?O:P),Y=!0}if(x=M-T,x=Math.min(Math.max(x,H),B),s.preventDefault(),r.push&&w){let e=(x-M)/O;r.params.swipeToStep&&(e=$?x/P:1-(P-x)/P),e=Math.abs(e),e=Math.min(Math.max(e,0),1);const s=1-e,t=1-(1-C(w))*s;_.transition(0).forEach((e=>{e.style.setProperty("transform",`translate3d(0,0,0) scale(${t})`,"important")})),r.params.swipeToStep&&_.css("border-radius",q*s+"px")}if(u.transition(0).transform(`translate3d(0,${x}px,0)`),r.params.swipeToStep){let e;e=$?1-x/P:(P-x)/P,e=Math.min(Math.max(e,0),1),u.trigger("sheet:stepprogress",e),r.emit("local::stepProgress sheetStepProgress",r,e)}}function L(){if(X=!1,!Y)return;Y=!1,u.transform("").transition(""),r.push&&w&&(_.transition("").transform(""),_.css("border-radius",""));const e=T<0?"to-bottom":"to-top",s=Math.abs(T);if(0===s||x===M)return;const t=(new Date).getTime()-E;if(!r.params.swipeToStep){if(e!==($?"to-top":"to-bottom"))return;return void((t<300&&s>20||t>=300&&s>O/2)&&r.close())}const o=$?"to-bottom":"to-top",p=$?"to-top":"to-bottom",a=Math.abs(x),l=Math.abs(P);if(t<300&&s>10)return e===o&&a<l&&(u.removeClass("modal-in-swipe-step"),u.trigger("sheet:stepprogress",1),r.emit("local::stepProgress sheetStepProgress",r,1),r.emit("local::_swipeStep",!1),u.trigger("sheet:stepopen"),r.emit("local::stepOpen sheetStepOpen",r),r.push&&w&&(r.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(w)),_.css("border-radius",""))),e===p&&a>l&&(r.params.swipeToClose?r.close():(u.addClass("modal-in-swipe-step"),u.trigger("sheet:stepprogress",0),r.emit("local::stepProgress sheetStepProgress",r,0),r.emit("local::_swipeStep",!0),u.trigger("sheet:stepclose"),r.emit("local::stepClose sheetStepClose",r),r.push&&w&&(r.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),_.css("border-radius","0px")))),void(e===p&&a<=l&&(u.addClass("modal-in-swipe-step"),u.trigger("sheet:stepprogress",0),r.emit("local::stepProgress sheetStepProgress",r,0),r.emit("local::_swipeStep",!0),u.trigger("sheet:stepclose"),r.emit("local::stepClose sheetStepClose",r),r.push&&w&&(r.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),_.css("border-radius","0px"))));if(t>=300){const e=!u.hasClass("modal-in-swipe-step");e?e&&(a>l+(O-l)/2?r.params.swipeToClose&&r.close():a>l/2&&(u.addClass("modal-in-swipe-step"),u.trigger("sheet:stepprogress",0),r.emit("local::stepProgress sheetStepProgress",r,0),r.emit("local::_swipeStep",!0),u.trigger("sheet:stepclose"),r.emit("local::stepClose sheetStepClose",r),r.push&&w&&(r.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"),_.css("border-radius","0px")))):a<l/2?(u.removeClass("modal-in-swipe-step"),u.trigger("sheet:stepprogress",1),r.emit("local::stepProgress sheetStepProgress",r,1),r.emit("local::_swipeStep",!1),u.trigger("sheet:stepopen"),r.emit("local::stepOpen sheetStepOpen",r),r.push&&w&&(r.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(w)),_.css("border-radius",""))):a-l>(O-l)/2&&r.params.swipeToClose&&r.close()}}function U(){r.setSwipeStep(!0)}r.setSwipeStep=function(e=!0){const s=u.find(".sheet-modal-swipe-step").eq(0);s.length&&(P=u.hasClass("sheet-modal-top")?-(s.offset().top-u.offset().top+s[0].offsetHeight):u[0].offsetHeight-(s.offset().top-u.offset().top+s[0].offsetHeight),u[0].style.setProperty("--f7-sheet-swipe-step",`${P}px`),e||(u.addClass("modal-in-swipe-step"),r.emit("local::_swipeStep",!0)))};const V=!!m.passiveListener&&{passive:!0};return(r.params.swipeToClose||r.params.swipeToStep)&&(u.on(e.touchEvents.start,z,V),e.on("touchmove",A),e.on("touchend:passive",L),r.once("sheetDestroy",(()=>{u.off(e.touchEvents.start,z,V),e.off("touchmove",A),e.off("touchend:passive",L)}))),r.on("open",(()=>{r.params.closeOnEscape&&t(h).on("keydown",b),u.prevAll(".popup.modal-in").addClass("popup-behind"),r.params.swipeToStep&&(r.setSwipeStep(!1),e.on("resize",U)),r.params.scrollToEl&&function(){const e=t(r.params.scrollToEl).eq(0);if(0===e.length)return;if(f=e.parents(".page-content"),0===f.length)return;const s=parseInt(f.css("padding-top"),10),o=parseInt(f.css("padding-bottom"),10),p=f[0].offsetHeight-s-u.height(),a=f[0].scrollHeight-s-u.height(),l=f.scrollTop();let i;const n=e.offset().top-s+e[0].offsetHeight;if(n>p){const e=l+n-p;e+p>a&&(i=e+p-a+o,p===a&&(i=u.height()),f.css({"padding-bottom":`${i}px`})),f.scrollTop(e,300)}}(),r.push&&(w=parseInt(u.css("--f7-sheet-push-offset"),10),Number.isNaN(w)&&(w=0),w&&(u.addClass("sheet-modal-push"),r.$htmlEl.addClass("with-modal-sheet-push"),r.params.swipeToStep?(_=e.$el.children(".view, .views"),q=parseFloat(u.css(`border-${$?"bottom":"top"}-left-radius`)),_.css("border-radius","0px")):r.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(w))))})),r.on("opened",(()=>{(r.params.closeByOutsideClick||r.params.closeByBackdropClick)&&e.on("click",y)})),r.on("close",(()=>{r.params.swipeToStep&&(u.removeClass("modal-in-swipe-step"),r.emit("local::_swipeStep",!1),e.off("resize",U)),r.params.closeOnEscape&&t(h).off("keydown",b),r.params.scrollToEl&&f&&f.length>0&&f.css({"padding-bottom":""}),(r.params.closeByOutsideClick||r.params.closeByBackdropClick)&&e.off("click",y),u.prevAll(".popup.modal-in").eq(0).removeClass("popup-behind"),r.push&&w&&(r.$htmlEl.removeClass("with-modal-sheet-push"),r.$htmlEl.addClass("with-modal-sheet-push-closing"))})),r.on("closed",(()=>{r.push&&w&&(r.$htmlEl.removeClass("with-modal-sheet-push-closing"),r.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale"))})),r.stepOpen=function(){u.removeClass("modal-in-swipe-step"),r.emit("local::_swipeStep",!1),r.push&&(w||(w=parseInt(u.css("--f7-sheet-push-offset"),10),Number.isNaN(w)&&(w=0)),w&&r.$htmlEl[0].style.setProperty("--f7-sheet-push-scale",C(w)))},r.stepClose=function(){u.addClass("modal-in-swipe-step"),r.emit("local::_swipeStep",!0),r.push&&r.$htmlEl[0].style.removeProperty("--f7-sheet-push-scale")},r.stepToggle=function(){u.toggleClass("modal-in-swipe-step"),r.emit("local::_swipeStep",u.hasClass("modal-in-swipe-step"))},u[0].f7Modal=r,r}}var m={name:"sheet",params:{sheet:{push:!1,backdrop:void 0,backdropEl:void 0,backdropUnique:!1,closeByBackdropClick:!0,closeByOutsideClick:!1,closeOnEscape:!1,swipeToClose:!1,swipeToStep:!1,swipeHandler:null,containerEl:null}},static:{Sheet:h},create(){const e=this;e.sheet=i({},l({app:e,constructor:h,defaultSelector:".sheet-modal.modal-in"}),{stepOpen(s){const t=e.sheet.get(s);if(t&&t.stepOpen)return t.stepOpen()},stepClose(s){const t=e.sheet.get(s);if(t&&t.stepClose)return t.stepClose()},stepToggle(s){const t=e.sheet.get(s);if(t&&t.stepToggle)return t.stepToggle()}})},clicks:{".sheet-open":function(e,s={}){const o=this;t(".sheet-modal.modal-in").length>0&&s.sheet&&t(s.sheet)[0]!==t(".sheet-modal.modal-in")[0]&&o.sheet.close(".sheet-modal.modal-in"),o.sheet.open(s.sheet,s.animate,e)},".sheet-close":function(e,s={}){this.sheet.close(s.sheet,s.animate,e)}}};if(s){if(e.prototype.modules&&e.prototype.modules[m.name])return;e.use(m),e.instance&&(e.instance.useModuleParams(m,e.instance.params),e.instance.useModule(m))}return m}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))