framework7 6.3.4 → 7.0.0-beta.3

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

@@ -1,9 +1,3 @@
-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';
@@ -11,24 +5,18 @@ 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({
+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,25 +24,23 @@ 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);
@@ -68,11 +54,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 +68,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 +94,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
           }
 
           $pageContentEl.css({
-            'padding-bottom': newPaddingBottom + "px"
+            'padding-bottom': `${newPaddingBottom}px`
           });
         }
 
@@ -125,9 +111,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 +126,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 +200,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 +239,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 +251,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 +294,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 +311,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) {
@@ -382,7 +368,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) {
@@ -422,12 +408,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')) {
@@ -436,7 +418,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');
@@ -447,7 +429,7 @@ var Sheet = /*#__PURE__*/function (_Modal) {
       sheet.setSwipeStep(true);
     }
 
-    var passive = support.passiveListener ? {
+    const passive = support.passiveListener ? {
       passive: true
     } : false;
 
@@ -455,14 +437,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);
       }
@@ -490,18 +472,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');
         app.off('resize', onResize);
@@ -526,7 +508,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');
@@ -561,10 +543,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-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-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.js

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

@@ -112,14 +112,14 @@ html.with-modal-sheet-push-closing {
     }
   }
   .if-dark-theme({
-    &.theme-dark .framework7-root > .views,
-    &.theme-dark .framework7-root > .view,
-    .theme-dark .framework7-root > .views,
-    .theme-dark .framework7-root > .view,
-    .theme-dark.framework7-root > .views,
-    .theme-dark.framework7-root > .view,
-    .framework7-root > .views.theme-dark,
-    .framework7-root > .view.theme-dark {
+    &.dark .framework7-root > .views,
+    &.dark .framework7-root > .view,
+    .dark .framework7-root > .views,
+    .dark .framework7-root > .view,
+    .dark.framework7-root > .views,
+    .dark.framework7-root > .view,
+    .framework7-root > .views.dark,
+    .framework7-root > .view.dark {
       &:after {
         content: '';
         position: absolute;
@@ -149,14 +149,14 @@ html.with-modal-sheet-push {
 
 .if-dark-theme({
   html.with-modal-sheet-push-closing {
-    &.theme-dark .framework7-root > .views,
-    &.theme-dark .framework7-root > .view,
-    .theme-dark .framework7-root > .views,
-    .theme-dark .framework7-root > .view,
-    .theme-dark.framework7-root > .views,
-    .theme-dark.framework7-root > .view,
-    .framework7-root > .views.theme-dark,
-    .framework7-root > .view.theme-dark {
+    &.dark .framework7-root > .views,
+    &.dark .framework7-root > .view,
+    .dark .framework7-root > .views,
+    .dark .framework7-root > .view,
+    .dark.framework7-root > .views,
+    .dark.framework7-root > .view,
+    .framework7-root > .views.dark,
+    .framework7-root > .view.dark {
       &:after {
         animation: sheet-dark-push-overlay-fade-out var(--f7-sheet-transition-duration) forwards;
       }

package/components/sheet/sheet.umd.js

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