framework7 6.3.4 → 7.0.0-beta.3

package/components/popover/popover-rtl.css

@@ -1 +1 @@
-:root{--f7-popover-width:260px}.ios{--f7-popover-border-radius:13px;--f7-popover-box-shadow:none;--f7-popover-actions-icon-size:28px;--f7-popover-bg-color:rgba(255, 255, 255, 0.95);--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.45)}.ios .theme-dark,.ios.theme-dark{--f7-popover-bg-color:rgba(30, 30, 30, 0.95);--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-popover-border-radius:4px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.54)}.md .theme-dark,.md.theme-dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-popover-border-radius:8px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.6)}.aurora .theme-dark,.aurora.theme-dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.6)}.popover{width:var(--f7-popover-width);z-index:13500;margin:0;top:0;opacity:0;left:0;position:absolute;display:none;transition-duration:.3s;background-color:var(--f7-popover-bg-color);border-radius:var(--f7-popover-border-radius);box-shadow:var(--f7-popover-box-shadow);will-change:transform,opacity}.popover .list{margin:0}.popover .list ul{background:0 0}.popover .list:first-child ul:before{display:none!important}.popover .list:last-child ul:after{display:none!important}.popover .list:first-child ul{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:first-child li:first-child,.popover .list:first-child li:first-child a,.popover .list:first-child li:first-child>label{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:last-child ul{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:last-child li:last-child,.popover .list:last-child li:last-child a,.popover .list:last-child li:last-child>label{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:first-child:last-child li:first-child:last-child,.popover .list:first-child:last-child li:first-child:last-child a,.popover .list:first-child:last-child li:first-child:last-child>label,.popover .list:first-child:last-child ul{border-radius:var(--f7-popover-border-radius)}.popover .list+.list{margin-top:var(--f7-list-margin-vertical)}.popover.modal-in{opacity:1}.popover.not-animated{transition-duration:0s}.popover-inner{overflow:auto;-webkit-overflow-scrolling:touch}.popover-from-actions .item-link i.icon{width:var(--f7-popover-actions-icon-size);height:var(--f7-popover-actions-icon-size);font-size:var(--f7-popover-actions-icon-size)}.popover-from-actions-bold{font-weight:600}.popover-from-actions-label{line-height:1.3;position:relative;display:flex;align-items:center;padding:var(--f7-actions-label-padding);color:var(--f7-popover-actions-label-text-color);font-size:var(--f7-actions-label-font-size);justify-content:var(--f7-actions-label-justify-content)}.popover-from-actions-label:after{content:'';position:absolute;background-color:var(--f7-list-item-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)))}.popover-from-actions-label:last-child:after{display:none!important}.ios .popover{transform:none;transition-property:opacity}.ios .popover-angle{width:26px;height:26px;position:absolute;left:-26px;top:0;z-index:100;overflow:hidden}.ios .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:26px;height:26px;position:absolute;left:0;top:0;border-radius:3px;transform:rotate(45deg)}.ios .popover-angle.on-left{left:-26px}.ios .popover-angle.on-left:after{left:19px;top:0}.ios .popover-angle.on-right{left:100%}.ios .popover-angle.on-right:after{left:-19px;top:0}.ios .popover-angle.on-top{left:0;top:-26px}.ios .popover-angle.on-top:after{left:0;top:19px}.ios .popover-angle.on-bottom{left:0;top:100%}.ios .popover-angle.on-bottom:after{left:0;top:-19px}.md .popover{transform:scale(.85,.6);transition-property:opacity,transform}.md .popover.modal-in{opacity:1;transform:scale(1)}.md .popover.modal-out{opacity:0;transform:scale(1)}.md .popover-on-top{transform-origin:center bottom}.md .popover-on-top.popover-on-right{transform-origin:left bottom}.md .popover-on-top.popover-on-left{transform-origin:right bottom}.md .popover-on-middle{transform-origin:center center}.md .popover-on-middle.popover-on-right{transform-origin:left center}.md .popover-on-middle.popover-on-left{transform-origin:right center}.md .popover-on-bottom{transform-origin:center top}.md .popover-on-bottom.popover-on-right{transform-origin:left top}.md .popover-on-bottom.popover-on-left{transform-origin:right top}.aurora .popover{transform:none;transition-property:opacity}.aurora .popover-angle{width:24px;height:24px;position:absolute;left:-24px;top:0;z-index:100;overflow:hidden}.aurora .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:24px;height:24px;position:absolute;left:0;top:0;border-radius:4px;transform:rotate(45deg)}.aurora .popover-angle.on-left{left:-24px}.aurora .popover-angle.on-left:after{left:17px;top:0}.aurora .popover-angle.on-right{left:100%}.aurora .popover-angle.on-right:after{left:-17px;top:0}.aurora .popover-angle.on-top{left:0;top:-24px}.aurora .popover-angle.on-top:after{left:0;top:17px}.aurora .popover-angle.on-bottom{left:0;top:100%}.aurora .popover-angle.on-bottom:after{left:0;top:-17px}
+:root{--f7-popover-width:260px}.ios{--f7-popover-border-radius:13px;--f7-popover-box-shadow:none;--f7-popover-actions-icon-size:28px;--f7-popover-bg-color:rgba(255, 255, 255, 0.95);--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-popover-bg-color:rgba(30, 30, 30, 0.95);--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-popover-border-radius:4px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.54)}.md .dark,.md.dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-popover-border-radius:8px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.6)}.aurora .dark,.aurora.dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.6)}.popover{width:var(--f7-popover-width);z-index:13500;margin:0;top:0;opacity:0;left:0;position:absolute;display:none;transition-duration:.3s;background-color:var(--f7-popover-bg-color);border-radius:var(--f7-popover-border-radius);box-shadow:var(--f7-popover-box-shadow);will-change:transform,opacity}.popover .list{margin:0}.popover .list ul{background:0 0}.popover .list:first-child ul:before{display:none!important}.popover .list:last-child ul:after{display:none!important}.popover .list:first-child ul{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:first-child li:first-child,.popover .list:first-child li:first-child a,.popover .list:first-child li:first-child>label{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:last-child ul{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:last-child li:last-child,.popover .list:last-child li:last-child a,.popover .list:last-child li:last-child>label{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:first-child:last-child li:first-child:last-child,.popover .list:first-child:last-child li:first-child:last-child a,.popover .list:first-child:last-child li:first-child:last-child>label,.popover .list:first-child:last-child ul{border-radius:var(--f7-popover-border-radius)}.popover .list+.list{margin-top:var(--f7-list-margin-vertical)}.popover.modal-in{opacity:1}.popover.not-animated{transition-duration:0s}.popover-inner{overflow:auto;-webkit-overflow-scrolling:touch}.popover-from-actions .item-link i.icon{width:var(--f7-popover-actions-icon-size);height:var(--f7-popover-actions-icon-size);font-size:var(--f7-popover-actions-icon-size)}.popover-from-actions-bold{font-weight:600}.popover-from-actions-label{line-height:1.3;position:relative;display:flex;align-items:center;padding:var(--f7-actions-label-padding);color:var(--f7-popover-actions-label-text-color);font-size:var(--f7-actions-label-font-size);justify-content:var(--f7-actions-label-justify-content)}.popover-from-actions-label:after{content:'';position:absolute;background-color:var(--f7-list-item-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)))}.popover-from-actions-label:last-child:after{display:none!important}.ios .popover{transform:none;transition-property:opacity}.ios .popover-angle{width:26px;height:26px;position:absolute;left:-26px;top:0;z-index:100;overflow:hidden}.ios .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:26px;height:26px;position:absolute;left:0;top:0;border-radius:3px;transform:rotate(45deg)}.ios .popover-angle.on-left{left:-26px}.ios .popover-angle.on-left:after{left:19px;top:0}.ios .popover-angle.on-right{left:100%}.ios .popover-angle.on-right:after{left:-19px;top:0}.ios .popover-angle.on-top{left:0;top:-26px}.ios .popover-angle.on-top:after{left:0;top:19px}.ios .popover-angle.on-bottom{left:0;top:100%}.ios .popover-angle.on-bottom:after{left:0;top:-19px}.md .popover{transform:scale(.85,.6);transition-property:opacity,transform}.md .popover.modal-in{opacity:1;transform:scale(1)}.md .popover.modal-out{opacity:0;transform:scale(1)}.md .popover-on-top{transform-origin:center bottom}.md .popover-on-top.popover-on-right{transform-origin:left bottom}.md .popover-on-top.popover-on-left{transform-origin:right bottom}.md .popover-on-middle{transform-origin:center center}.md .popover-on-middle.popover-on-right{transform-origin:left center}.md .popover-on-middle.popover-on-left{transform-origin:right center}.md .popover-on-bottom{transform-origin:center top}.md .popover-on-bottom.popover-on-right{transform-origin:left top}.md .popover-on-bottom.popover-on-left{transform-origin:right top}.aurora .popover{transform:none;transition-property:opacity}.aurora .popover-angle{width:24px;height:24px;position:absolute;left:-24px;top:0;z-index:100;overflow:hidden}.aurora .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:24px;height:24px;position:absolute;left:0;top:0;border-radius:4px;transform:rotate(45deg)}.aurora .popover-angle.on-left{left:-24px}.aurora .popover-angle.on-left:after{left:17px;top:0}.aurora .popover-angle.on-right{left:100%}.aurora .popover-angle.on-right:after{left:-17px;top:0}.aurora .popover-angle.on-top{left:0;top:-24px}.aurora .popover-angle.on-top:after{left:0;top:17px}.aurora .popover-angle.on-bottom{left:0;top:100%}.aurora .popover-angle.on-bottom:after{left:0;top:-17px}

package/components/popover/popover.css

@@ -1 +1 @@
-:root{--f7-popover-width:260px}.ios{--f7-popover-border-radius:13px;--f7-popover-box-shadow:none;--f7-popover-actions-icon-size:28px;--f7-popover-bg-color:rgba(255, 255, 255, 0.95);--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.45)}.ios .theme-dark,.ios.theme-dark{--f7-popover-bg-color:rgba(30, 30, 30, 0.95);--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-popover-border-radius:4px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.54)}.md .theme-dark,.md.theme-dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-popover-border-radius:8px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.6)}.aurora .theme-dark,.aurora.theme-dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.6)}.popover{width:var(--f7-popover-width);z-index:13500;margin:0;top:0;opacity:0;left:0;position:absolute;display:none;transition-duration:.3s;background-color:var(--f7-popover-bg-color);border-radius:var(--f7-popover-border-radius);box-shadow:var(--f7-popover-box-shadow);will-change:transform,opacity}.popover .list{margin:0}.popover .list ul{background:0 0}.popover .list:first-child ul:before{display:none!important}.popover .list:last-child ul:after{display:none!important}.popover .list:first-child ul{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:first-child li:first-child,.popover .list:first-child li:first-child a,.popover .list:first-child li:first-child>label{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:last-child ul{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:last-child li:last-child,.popover .list:last-child li:last-child a,.popover .list:last-child li:last-child>label{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:first-child:last-child li:first-child:last-child,.popover .list:first-child:last-child li:first-child:last-child a,.popover .list:first-child:last-child li:first-child:last-child>label,.popover .list:first-child:last-child ul{border-radius:var(--f7-popover-border-radius)}.popover .list+.list{margin-top:var(--f7-list-margin-vertical)}.popover.modal-in{opacity:1}.popover.not-animated{transition-duration:0s}.popover-inner{overflow:auto;-webkit-overflow-scrolling:touch}.popover-from-actions .item-link i.icon{width:var(--f7-popover-actions-icon-size);height:var(--f7-popover-actions-icon-size);font-size:var(--f7-popover-actions-icon-size)}.popover-from-actions-bold{font-weight:600}.popover-from-actions-label{line-height:1.3;position:relative;display:flex;align-items:center;padding:var(--f7-actions-label-padding);color:var(--f7-popover-actions-label-text-color);font-size:var(--f7-actions-label-font-size);justify-content:var(--f7-actions-label-justify-content)}.popover-from-actions-label:after{content:'';position:absolute;background-color:var(--f7-list-item-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)))}.popover-from-actions-label:last-child:after{display:none!important}.ios .popover{transform:none;transition-property:opacity}.ios .popover-angle{width:26px;height:26px;position:absolute;left:-26px;top:0;z-index:100;overflow:hidden}.ios .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:26px;height:26px;position:absolute;left:0;top:0;border-radius:3px;transform:rotate(45deg)}.ios .popover-angle.on-left{left:-26px}.ios .popover-angle.on-left:after{left:19px;top:0}.ios .popover-angle.on-right{left:100%}.ios .popover-angle.on-right:after{left:-19px;top:0}.ios .popover-angle.on-top{left:0;top:-26px}.ios .popover-angle.on-top:after{left:0;top:19px}.ios .popover-angle.on-bottom{left:0;top:100%}.ios .popover-angle.on-bottom:after{left:0;top:-19px}.md .popover{transform:scale(.85,.6);transition-property:opacity,transform}.md .popover.modal-in{opacity:1;transform:scale(1)}.md .popover.modal-out{opacity:0;transform:scale(1)}.md .popover-on-top{transform-origin:center bottom}.md .popover-on-top.popover-on-right{transform-origin:left bottom}.md .popover-on-top.popover-on-left{transform-origin:right bottom}.md .popover-on-middle{transform-origin:center center}.md .popover-on-middle.popover-on-right{transform-origin:left center}.md .popover-on-middle.popover-on-left{transform-origin:right center}.md .popover-on-bottom{transform-origin:center top}.md .popover-on-bottom.popover-on-right{transform-origin:left top}.md .popover-on-bottom.popover-on-left{transform-origin:right top}.aurora .popover{transform:none;transition-property:opacity}.aurora .popover-angle{width:24px;height:24px;position:absolute;left:-24px;top:0;z-index:100;overflow:hidden}.aurora .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:24px;height:24px;position:absolute;left:0;top:0;border-radius:4px;transform:rotate(45deg)}.aurora .popover-angle.on-left{left:-24px}.aurora .popover-angle.on-left:after{left:17px;top:0}.aurora .popover-angle.on-right{left:100%}.aurora .popover-angle.on-right:after{left:-17px;top:0}.aurora .popover-angle.on-top{left:0;top:-24px}.aurora .popover-angle.on-top:after{left:0;top:17px}.aurora .popover-angle.on-bottom{left:0;top:100%}.aurora .popover-angle.on-bottom:after{left:0;top:-17px}
+:root{--f7-popover-width:260px}.ios{--f7-popover-border-radius:13px;--f7-popover-box-shadow:none;--f7-popover-actions-icon-size:28px;--f7-popover-bg-color:rgba(255, 255, 255, 0.95);--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-popover-bg-color:rgba(30, 30, 30, 0.95);--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-popover-border-radius:4px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.54)}.md .dark,.md.dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-popover-border-radius:8px;--f7-popover-box-shadow:var(--f7-elevation-8);--f7-popover-actions-icon-size:24px;--f7-popover-bg-color:#fff;--f7-popover-actions-label-text-color:rgba(0, 0, 0, 0.6)}.aurora .dark,.aurora.dark{--f7-popover-bg-color:#1c1c1d;--f7-popover-actions-label-text-color:rgba(255, 255, 255, 0.6)}.popover{width:var(--f7-popover-width);z-index:13500;margin:0;top:0;opacity:0;left:0;position:absolute;display:none;transition-duration:.3s;background-color:var(--f7-popover-bg-color);border-radius:var(--f7-popover-border-radius);box-shadow:var(--f7-popover-box-shadow);will-change:transform,opacity}.popover .list{margin:0}.popover .list ul{background:0 0}.popover .list:first-child ul:before{display:none!important}.popover .list:last-child ul:after{display:none!important}.popover .list:first-child ul{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:first-child li:first-child,.popover .list:first-child li:first-child a,.popover .list:first-child li:first-child>label{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.popover .list:last-child ul{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:last-child li:last-child,.popover .list:last-child li:last-child a,.popover .list:last-child li:last-child>label{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.popover .list:first-child:last-child li:first-child:last-child,.popover .list:first-child:last-child li:first-child:last-child a,.popover .list:first-child:last-child li:first-child:last-child>label,.popover .list:first-child:last-child ul{border-radius:var(--f7-popover-border-radius)}.popover .list+.list{margin-top:var(--f7-list-margin-vertical)}.popover.modal-in{opacity:1}.popover.not-animated{transition-duration:0s}.popover-inner{overflow:auto;-webkit-overflow-scrolling:touch}.popover-from-actions .item-link i.icon{width:var(--f7-popover-actions-icon-size);height:var(--f7-popover-actions-icon-size);font-size:var(--f7-popover-actions-icon-size)}.popover-from-actions-bold{font-weight:600}.popover-from-actions-label{line-height:1.3;position:relative;display:flex;align-items:center;padding:var(--f7-actions-label-padding);color:var(--f7-popover-actions-label-text-color);font-size:var(--f7-actions-label-font-size);justify-content:var(--f7-actions-label-justify-content)}.popover-from-actions-label:after{content:'';position:absolute;background-color:var(--f7-list-item-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)))}.popover-from-actions-label:last-child:after{display:none!important}.ios .popover{transform:none;transition-property:opacity}.ios .popover-angle{width:26px;height:26px;position:absolute;left:-26px;top:0;z-index:100;overflow:hidden}.ios .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:26px;height:26px;position:absolute;left:0;top:0;border-radius:3px;transform:rotate(45deg)}.ios .popover-angle.on-left{left:-26px}.ios .popover-angle.on-left:after{left:19px;top:0}.ios .popover-angle.on-right{left:100%}.ios .popover-angle.on-right:after{left:-19px;top:0}.ios .popover-angle.on-top{left:0;top:-26px}.ios .popover-angle.on-top:after{left:0;top:19px}.ios .popover-angle.on-bottom{left:0;top:100%}.ios .popover-angle.on-bottom:after{left:0;top:-19px}.md .popover{transform:scale(.85,.6);transition-property:opacity,transform}.md .popover.modal-in{opacity:1;transform:scale(1)}.md .popover.modal-out{opacity:0;transform:scale(1)}.md .popover-on-top{transform-origin:center bottom}.md .popover-on-top.popover-on-right{transform-origin:left bottom}.md .popover-on-top.popover-on-left{transform-origin:right bottom}.md .popover-on-middle{transform-origin:center center}.md .popover-on-middle.popover-on-right{transform-origin:left center}.md .popover-on-middle.popover-on-left{transform-origin:right center}.md .popover-on-bottom{transform-origin:center top}.md .popover-on-bottom.popover-on-right{transform-origin:left top}.md .popover-on-bottom.popover-on-left{transform-origin:right top}.aurora .popover{transform:none;transition-property:opacity}.aurora .popover-angle{width:24px;height:24px;position:absolute;left:-24px;top:0;z-index:100;overflow:hidden}.aurora .popover-angle:after{content:'';background:var(--f7-popover-bg-color);width:24px;height:24px;position:absolute;left:0;top:0;border-radius:4px;transform:rotate(45deg)}.aurora .popover-angle.on-left{left:-24px}.aurora .popover-angle.on-left:after{left:17px;top:0}.aurora .popover-angle.on-right{left:100%}.aurora .popover-angle.on-right:after{left:-17px;top:0}.aurora .popover-angle.on-top{left:0;top:-24px}.aurora .popover-angle.on-top:after{left:0;top:17px}.aurora .popover-angle.on-bottom{left:0;top:100%}.aurora .popover-angle.on-bottom:after{left:0;top:-17px}

package/components/popover/popover.js

@@ -1 +1,76 @@
-(function framework7ComponentLoader(e,o){void 0===o&&(o=!0);var t=e.$,r=e.utils,n=e.getDevice,a=(e.getSupport,e.Class,e.Modal),p=(e.ConstructorMethods,e.ModalMethods),i=r.extend;function s(e){this.wrapped=e}function l(e){var o,t;function r(o,t){try{var a=e[o](t),p=a.value,i=p instanceof s;Promise.resolve(i?p.wrapped:p).then((function(e){i?r("return"===o?"return":"next",e):n(a.done?"return":"normal",e)}),(function(e){r("throw",e)}))}catch(e){n("throw",e)}}function n(e,n){switch(e){case"return":o.resolve({value:n,done:!0});break;case"throw":o.reject(n);break;default:o.resolve({value:n,done:!1})}(o=o.next)?r(o.key,o.arg):t=null}this._invoke=function(e,n){return new Promise((function(a,p){var i={key:e,arg:n,resolve:a,reject:p,next:null};t?t=t.next=i:(o=t=i,r(e,n))}))},"function"!=typeof e.return&&(this.return=void 0)}function c(e,o){return(c=Object.setPrototypeOf||function(e,o){return e.__proto__=o,e})(e,o)}function d(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}l.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},l.prototype.next=function(e){return this._invoke("next",e)},l.prototype.throw=function(e){return this._invoke("throw",e)},l.prototype.return=function(e){return this._invoke("return",e)};var u=function(e){var o,r;function a(o,r){var a,p,s=i({on:{}},o.params.popover,r),l=d(a=e.call(this,o,s)||this),c=n();if(l.params=s,(p=l.params.el?t(l.params.el).eq(0):t(l.params.content).filter((function(e){return 1===e.nodeType})).eq(0))&&p.length>0&&p[0].f7Modal)return p[0].f7Modal||d(a);var u,h,f=t(l.params.targetEl).eq(0);if(0===p.length)return l.destroy()||d(a);l.params.backdrop&&l.params.backdropEl?u=t(l.params.backdropEl):l.params.backdrop&&0===(u=l.$containerEl.children(".popover-backdrop")).length&&(u=t('<div class="popover-backdrop"></div>'),l.$containerEl.append(u)),0===p.find(".popover-angle").length?(h=t('<div class="popover-angle"></div>'),p.prepend(h)):h=p.find(".popover-angle");var v=l.open;function m(){l.resize()}i(l,{app:o,$el:p,el:p[0],$targetEl:f,targetEl:f[0],$angleEl:h,angleEl:h[0],$backdropEl:u,backdropEl:u&&u[0],type:"popover",open:function(){for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];var n=o[0],a=o[1];return"boolean"==typeof o[0]&&(a=o[0],n=o[1]),n&&(l.$targetEl=t(n),l.targetEl=l.$targetEl[0]),v.call(l,a)}}),l.on("popoverOpen",(function(){l.resize(),o.on("resize",m),t(window).on("keyboardDidShow keyboardDidHide",m),l.on("popoverClose popoverBeforeDestroy",(function(){o.off("resize",m),t(window).off("keyboardDidShow keyboardDidHide",m)}))}));var g=null;function k(e){g=e.target}function y(e){var o=e.target,r=t(o);!c.desktop&&c.cordova&&(window.Keyboard&&window.Keyboard.isVisible||window.cordova.plugins&&window.cordova.plugins.Keyboard&&window.cordova.plugins.Keyboard.isVisible)||0===r.closest(l.el).length&&(l.params.closeByBackdropClick&&l.params.backdrop&&l.backdropEl&&l.backdropEl===o&&g===o||l.params.closeByOutsideClick&&g===o)&&l.close()}function b(e){27===e.keyCode&&l.params.closeOnEscape&&l.close()}return l.params.closeOnEscape&&(l.on("popoverOpen",(function(){t(document).on("keydown",b)})),l.on("popoverClose",(function(){t(document).off("keydown",b)}))),l.on("popoverOpened",(function(){(l.params.closeByOutsideClick||l.params.closeByBackdropClick)&&(o.on("touchstart",k),o.on("click",y))})),l.on("popoverClose",(function(){(l.params.closeByOutsideClick||l.params.closeByBackdropClick)&&(o.off("touchstart",k),o.off("click",y))})),p[0].f7Modal=l,l||d(a)}return r=e,(o=a).prototype=Object.create(r.prototype),o.prototype.constructor=o,c(o,r),a.prototype.resize=function(){var e=this,o=e.app,r=e.$el,n=e.$targetEl,a=e.$angleEl,p=e.params,i=p.targetX,s=p.targetY;r.css({left:"",top:""});var l,c,d,u,h,f,v=[r.width(),r.height()],m=v[0],g=v[1],k=0;"ios"===o.theme||"aurora"===o.theme?(a.removeClass("on-left on-right on-top on-bottom").css({left:"",top:""}),k=a.width()/2):r.removeClass("popover-on-left popover-on-right popover-on-top popover-on-bottom popover-on-middle").css({left:"",top:""});var y=parseInt(t("html").css("--f7-safe-area-top"),10),b=parseInt(t("html").css("--f7-safe-area-left"),10),w=parseInt(t("html").css("--f7-safe-area-right"),10);if(Number.isNaN(y)&&(y=0),Number.isNaN(b)&&(b=0),Number.isNaN(w)&&(w=0),n&&n.length>0){d=n.outerWidth(),u=n.outerHeight();var E=n.offset();h=E.left-o.left,f=E.top-o.top;var C=n.parents(".page");C.length>0&&(f-=C[0].scrollTop)}else void 0!==i&&"undefined"!==s&&(h=i,f=s,d=e.params.targetWidth||0,u=e.params.targetHeight||0);var M,x=0,O=0,B=0,$="md"===o.theme?"bottom":"top";"md"===o.theme?(g<o.height-f-u?($="bottom",O=f+u):g<f-y?(O=f-g,$="top"):($="middle",O=u/2+f-g/2),O=Math.max(8,Math.min(O,o.height-g-8)),h<o.width/2?(M="right",x="middle"===$?h+d:h):(M="left",x="middle"===$?h-m:h+d-m),x=Math.max(8,Math.min(x,o.width-m-8-w),b),r.addClass("popover-on-"+$+" popover-on-"+M)):(g+k<f-y?O=f-g-k:g+k<o.height-f-u?($="bottom",O=f+u+k):($="middle",B=O=u/2+f-g/2,B-=O=Math.max(5,Math.min(O,o.height-g-5))),"top"===$||"bottom"===$?(B=x=d/2+h-m/2,x=Math.max(5,Math.min(x,o.width-m-5)),b&&(x=Math.max(x,b)),w&&x+m>o.width-5-w&&(x=o.width-5-w-m),"top"===$&&a.addClass("on-bottom"),"bottom"===$&&a.addClass("on-top"),l=m/2-k+(B-=x),l=Math.max(Math.min(l,m-2*k-13),13),a.css({left:l+"px"})):"middle"===$&&(x=h-m-k,a.addClass("on-right"),(x<5||x+m+w>o.width||x<b)&&(x<5&&(x=h+d+k),x+m+w>o.width&&(x=o.width-m-5-w),x<b&&(x=b),a.removeClass("on-right").addClass("on-left")),c=g/2-k+B,c=Math.max(Math.min(c,g-2*k-13),13),a.css({top:c+"px"})));r.css({top:O+"px",left:x+"px"})},a}(a),h={name:"popover",params:{popover:{backdrop:!0,backdropEl:void 0,closeByBackdropClick:!0,closeByOutsideClick:!0,closeOnEscape:!1,containerEl:null}},static:{Popover:u},create:function(){var e=this;e.popover=i(p({app:e,constructor:u,defaultSelector:".popover.modal-in"}),{open:function(o,r,n){var a=t(o);if(a.length>1){var p=t(r).parents(".page");p.length&&a.each((function(e){var o=t(e);o.parents(p)[0]===p[0]&&(a=o)}))}a.length>1&&(a=a.eq(a.length-1));var i=a[0].f7Modal,s=a.dataset();return i||(i=new u(e,Object.assign({el:a,targetEl:r},s))),i.open(r,n)}})},clicks:{".popover-open":function(e,o){void 0===o&&(o={});this.popover.open(o.popover,e,o.animate)},".popover-close":function(e,o){void 0===o&&(o={});this.popover.close(o.popover,o.animate,e)}}};if(o){if(e.prototype.modules&&e.prototype.modules[h.name])return;e.use(h),e.instance&&(e.instance.useModuleParams(h,e.instance.params),e.instance.useModule(h))}return h}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
+import $ from '../../shared/dom7';
+import { extend } from '../../shared/utils';
+import Popover from './popover-class';
+import ModalMethods from '../../shared/modal-methods';
+export default {
+  name: 'popover',
+  params: {
+    popover: {
+      backdrop: true,
+      backdropEl: undefined,
+      closeByBackdropClick: true,
+      closeByOutsideClick: true,
+      closeOnEscape: false,
+      containerEl: null
+    }
+  },
+  static: {
+    Popover
+  },
+
+  create() {
+    const app = this;
+    app.popover = extend(ModalMethods({
+      app,
+      constructor: Popover,
+      defaultSelector: '.popover.modal-in'
+    }), {
+      open(popoverEl, targetEl, animate) {
+        let $popoverEl = $(popoverEl);
+
+        if ($popoverEl.length > 1) {
+          // check if same popover in other page
+          const $targetPage = $(targetEl).parents('.page');
+
+          if ($targetPage.length) {
+            $popoverEl.each(el => {
+              const $el = $(el);
+
+              if ($el.parents($targetPage)[0] === $targetPage[0]) {
+                $popoverEl = $el;
+              }
+            });
+          }
+        }
+
+        if ($popoverEl.length > 1) {
+          $popoverEl = $popoverEl.eq($popoverEl.length - 1);
+        }
+
+        let popover = $popoverEl[0].f7Modal;
+        const data = $popoverEl.dataset();
+
+        if (!popover) {
+          popover = new Popover(app, Object.assign({
+            el: $popoverEl,
+            targetEl
+          }, data));
+        }
+
+        return popover.open(targetEl, animate);
+      }
+
+    });
+  },
+
+  clicks: {
+    '.popover-open': function openPopover($clickedEl, data = {}) {
+      const app = this;
+      app.popover.open(data.popover, $clickedEl, data.animate);
+    },
+    '.popover-close': function closePopover($clickedEl, data = {}) {
+      const app = this;
+      app.popover.close(data.popover, data.animate, $clickedEl);
+    }
+  }
+};

package/components/popover/popover.umd.js

@@ -0,0 +1 @@
+(function framework7ComponentLoader(e,o){void 0===o&&(o=!0);var t=e.$,a=e.utils,r=e.getDevice,p=(e.getSupport,e.Class,e.Modal),s=(e.ConstructorMethods,e.ModalMethods),n=a.extend;class l extends p{constructor(e,o){const a=n({on:{}},e.params.popover,o);super(e,a);const p=this,s=r(),l=getWindow(),i=getDocument();let d;if(p.params=a,d=p.params.el?t(p.params.el).eq(0):t(p.params.content).filter((e=>1===e.nodeType)).eq(0),d&&d.length>0&&d[0].f7Modal)return d[0].f7Modal;const c=t(p.params.targetEl).eq(0);if(0===d.length)return p.destroy();let m,h;p.params.backdrop&&p.params.backdropEl?m=t(p.params.backdropEl):p.params.backdrop&&(m=p.$containerEl.children(".popover-backdrop"),0===m.length&&(m=t('<div class="popover-backdrop"></div>'),p.$containerEl.append(m))),0===d.find(".popover-angle").length?(h=t('<div class="popover-angle"></div>'),d.prepend(h)):h=d.find(".popover-angle");const f=p.open;function g(){p.resize()}n(p,{app:e,$el:d,el:d[0],$targetEl:c,targetEl:c[0],$angleEl:h,angleEl:h[0],$backdropEl:m,backdropEl:m&&m[0],type:"popover",open(...e){let[o,a]=e;return"boolean"==typeof e[0]&&([a,o]=e),o&&(p.$targetEl=t(o),p.targetEl=p.$targetEl[0]),f.call(p,a)}}),p.on("popoverOpen",(()=>{p.resize(),e.on("resize",g),t(l).on("keyboardDidShow keyboardDidHide",g),p.on("popoverClose popoverBeforeDestroy",(()=>{e.off("resize",g),t(l).off("keyboardDidShow keyboardDidHide",g)}))}));let v=null;function u(e){v=e.target}function k(e){const o=e.target,a=t(o);!s.desktop&&s.cordova&&(l.Keyboard&&l.Keyboard.isVisible||l.cordova.plugins&&l.cordova.plugins.Keyboard&&l.cordova.plugins.Keyboard.isVisible)||0===a.closest(p.el).length&&(p.params.closeByBackdropClick&&p.params.backdrop&&p.backdropEl&&p.backdropEl===o&&v===o||p.params.closeByOutsideClick&&v===o)&&p.close()}function b(e){27===e.keyCode&&p.params.closeOnEscape&&p.close()}return p.params.closeOnEscape&&(p.on("popoverOpen",(()=>{t(i).on("keydown",b)})),p.on("popoverClose",(()=>{t(i).off("keydown",b)}))),p.on("popoverOpened",(()=>{(p.params.closeByOutsideClick||p.params.closeByBackdropClick)&&(e.on("touchstart",u),e.on("click",k))})),p.on("popoverClose",(()=>{(p.params.closeByOutsideClick||p.params.closeByBackdropClick)&&(e.off("touchstart",u),e.off("click",k))})),d[0].f7Modal=p,p}resize(){const e=this,{app:o,$el:a,$targetEl:r,$angleEl:p}=e,{targetX:s,targetY:n}=e.params;a.css({left:"",top:""});const[l,i]=[a.width(),a.height()];let d,c,m,h,f,g,v=0;"ios"===o.theme||"aurora"===o.theme?(p.removeClass("on-left on-right on-top on-bottom").css({left:"",top:""}),v=p.width()/2):a.removeClass("popover-on-left popover-on-right popover-on-top popover-on-bottom popover-on-middle").css({left:"",top:""});let u=parseInt(t("html").css("--f7-safe-area-top"),10),k=parseInt(t("html").css("--f7-safe-area-left"),10),b=parseInt(t("html").css("--f7-safe-area-right"),10);if(Number.isNaN(u)&&(u=0),Number.isNaN(k)&&(k=0),Number.isNaN(b)&&(b=0),r&&r.length>0){m=r.outerWidth(),h=r.outerHeight();const e=r.offset();f=e.left-o.left,g=e.top-o.top;const t=r.parents(".page");t.length>0&&(g-=t[0].scrollTop)}else void 0!==s&&"undefined"!==n&&(f=s,g=n,m=e.params.targetWidth||0,h=e.params.targetHeight||0);let[y,E,C]=[0,0,0],M="md"===o.theme?"bottom":"top";if("md"===o.theme){let e;i<o.height-g-h?(M="bottom",E=g+h):i<g-u?(E=g-i,M="top"):(M="middle",E=h/2+g-i/2),E=Math.max(8,Math.min(E,o.height-i-8)),f<o.width/2?(e="right",y="middle"===M?f+m:f):(e="left",y="middle"===M?f-l:f+m-l),y=Math.max(8,Math.min(y,o.width-l-8-b),k),a.addClass(`popover-on-${M} popover-on-${e}`)}else i+v<g-u?E=g-i-v:i+v<o.height-g-h?(M="bottom",E=g+h+v):(M="middle",E=h/2+g-i/2,C=E,E=Math.max(5,Math.min(E,o.height-i-5)),C-=E),"top"===M||"bottom"===M?(y=m/2+f-l/2,C=y,y=Math.max(5,Math.min(y,o.width-l-5)),k&&(y=Math.max(y,k)),b&&y+l>o.width-5-b&&(y=o.width-5-b-l),"top"===M&&p.addClass("on-bottom"),"bottom"===M&&p.addClass("on-top"),C-=y,d=l/2-v+C,d=Math.max(Math.min(d,l-2*v-13),13),p.css({left:`${d}px`})):"middle"===M&&(y=f-l-v,p.addClass("on-right"),(y<5||y+l+b>o.width||y<k)&&(y<5&&(y=f+m+v),y+l+b>o.width&&(y=o.width-l-5-b),y<k&&(y=k),p.removeClass("on-right").addClass("on-left")),c=i/2-v+C,c=Math.max(Math.min(c,i-2*v-13),13),p.css({top:`${c}px`}));a.css({top:`${E}px`,left:`${y}px`})}}var i={name:"popover",params:{popover:{backdrop:!0,backdropEl:void 0,closeByBackdropClick:!0,closeByOutsideClick:!0,closeOnEscape:!1,containerEl:null}},static:{Popover:l},create(){const e=this;e.popover=n(s({app:e,constructor:l,defaultSelector:".popover.modal-in"}),{open(o,a,r){let p=t(o);if(p.length>1){const e=t(a).parents(".page");e.length&&p.each((o=>{const a=t(o);a.parents(e)[0]===e[0]&&(p=a)}))}p.length>1&&(p=p.eq(p.length-1));let s=p[0].f7Modal;const n=p.dataset();return s||(s=new l(e,Object.assign({el:p,targetEl:a},n))),s.open(a,r)}})},clicks:{".popover-open":function(e,o={}){this.popover.open(o.popover,e,o.animate)},".popover-close":function(e,o={}){this.popover.close(o.popover,o.animate,e)}}};if(o){if(e.prototype.modules&&e.prototype.modules[i.name])return;e.use(i),e.instance&&(e.instance.useModuleParams(i,e.instance.params),e.instance.useModule(i))}return i}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))

package/{esm/components → components}/popup/popup-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, nextTick } from '../../shared/utils';
@@ -11,45 +5,37 @@ import { getSupport } from '../../shared/get-support';
 import { getDevice } from '../../shared/get-device';
 import Modal from '../modal/modal-class';
 
-var Popup = /*#__PURE__*/function (_Modal) {
-  _inheritsLoose(Popup, _Modal);
-
-  function Popup(app, params) {
-    var _this;
-
-    var extendedParams = extend({
+class Popup extends Modal {
+  constructor(app, params) {
+    const extendedParams = extend({
       on: {}
     }, app.params.popup, params); // Extends with open/close Modal methods;
 
-    _this = _Modal.call(this, app, extendedParams) || this;
-
-    var popup = _assertThisInitialized(_this);
-
-    var window = getWindow();
-    var document = getDocument();
-    var support = getSupport();
-    var device = getDevice();
+    super(app, extendedParams);
+    const popup = this;
+    const window = getWindow();
+    const document = getDocument();
+    const support = getSupport();
+    const device = getDevice();
     popup.params = extendedParams; // Find Element
 
-    var $el;
+    let $el;
 
     if (!popup.params.el) {
-      $el = $(popup.params.content).filter(function (node) {
-        return node.nodeType === 1;
-      }).eq(0);
+      $el = $(popup.params.content).filter(node => node.nodeType === 1).eq(0);
     } else {
       $el = $(popup.params.el).eq(0);
     }
 
     if ($el && $el.length > 0 && $el[0].f7Modal) {
-      return $el[0].f7Modal || _assertThisInitialized(_this);
+      return $el[0].f7Modal;
     }
 
     if ($el.length === 0) {
-      return popup.destroy() || _assertThisInitialized(_this);
+      return popup.destroy();
     }
 
-    var $backdropEl;
+    let $backdropEl;
 
     if (popup.params.backdrop && popup.params.backdropEl) {
       $backdropEl = $(popup.params.backdropEl);
@@ -63,11 +49,11 @@ var Popup = /*#__PURE__*/function (_Modal) {
     }
 
     extend(popup, {
-      app: app,
+      app,
       push: $el.hasClass('popup-push') || popup.params.push,
-      $el: $el,
+      $el,
       el: $el[0],
-      $backdropEl: $backdropEl,
+      $backdropEl,
       backdropEl: $backdropEl && $backdropEl[0],
       type: 'popup',
       $htmlEl: $('html')
@@ -78,16 +64,16 @@ var Popup = /*#__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(popup.el).length === 0) {
         if (popup.params && popup.params.closeByBackdropClick && popup.params.backdrop && popup.backdropEl && popup.backdropEl === target) {
-          var needToClose = true;
-          popup.$el.nextAll('.popup.modal-in').each(function (popupEl) {
-            var popupInstance = popupEl.f7Modal;
+          let needToClose = true;
+          popup.$el.nextAll('.popup.modal-in').each(popupEl => {
+            const popupInstance = popupEl.f7Modal;
             if (!popupInstance) return;
 
             if (popupInstance.params.closeByBackdropClick && popupInstance.params.backdrop && popupInstance.backdropEl === popup.backdropEl) {
@@ -103,34 +89,34 @@ var Popup = /*#__PURE__*/function (_Modal) {
     }
 
     function onKeyDown(e) {
-      var keyCode = e.keyCode;
+      const keyCode = e.keyCode;
 
       if (keyCode === 27 && popup.params.closeOnEscape) {
         popup.close();
       }
     }
 
-    var pushOffset;
-    var isPush;
+    let pushOffset;
+    let isPush;
 
     function pushViewScale(offset) {
       return (app.height - offset * 2) / app.height;
     }
 
-    var allowSwipeToClose = true;
-    var isTouched = false;
-    var startTouch;
-    var currentTouch;
-    var isScrolling;
-    var touchStartTime;
-    var touchesDiff;
-    var isMoved = false;
-    var pageContentEl;
-    var pageContentScrollTop;
-    var pageContentOffsetHeight;
-    var pageContentScrollHeight;
-    var popupHeight;
-    var $pushEl;
+    let allowSwipeToClose = true;
+    let isTouched = false;
+    let startTouch;
+    let currentTouch;
+    let isScrolling;
+    let touchStartTime;
+    let touchesDiff;
+    let isMoved = false;
+    let pageContentEl;
+    let pageContentScrollTop;
+    let pageContentOffsetHeight;
+    let pageContentScrollHeight;
+    let popupHeight;
+    let $pushEl;
 
     function handleTouchStart(e) {
       if (isTouched || !allowSwipeToClose || !popup.params.swipeToClose) return;
@@ -176,7 +162,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
         touchesDiff = 0;
       }
 
-      var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
+      const direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
       $el.transition(0);
 
       if (typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose) {
@@ -220,27 +206,27 @@ var Popup = /*#__PURE__*/function (_Modal) {
       e.preventDefault();
 
       if (isPush && pushOffset) {
-        var pushProgress = 1 - Math.abs(touchesDiff / popupHeight);
-        var scale = 1 - (1 - pushViewScale(pushOffset)) * pushProgress;
+        const pushProgress = 1 - Math.abs(touchesDiff / popupHeight);
+        const scale = 1 - (1 - pushViewScale(pushOffset)) * pushProgress;
 
         if ($pushEl.hasClass('popup')) {
           if ($pushEl.hasClass('popup-push')) {
-            $pushEl.transition(0).forEach(function (el) {
-              el.style.setProperty('transform', "translate3d(0, calc(-1 * " + pushProgress + " * (var(--f7-popup-push-offset) + 10px)) , 0px) scale(" + scale + ")", 'important');
+            $pushEl.transition(0).forEach(el => {
+              el.style.setProperty('transform', `translate3d(0, calc(-1 * ${pushProgress} * (var(--f7-popup-push-offset) + 10px)) , 0px) scale(${scale})`, 'important');
             });
           } else {
-            $pushEl.transition(0).forEach(function (el) {
-              el.style.setProperty('transform', "translate3d(0, 0px , 0px) scale(" + scale + ")", 'important');
+            $pushEl.transition(0).forEach(el => {
+              el.style.setProperty('transform', `translate3d(0, 0px , 0px) scale(${scale})`, 'important');
             });
           }
         } else {
-          $pushEl.transition(0).forEach(function (el) {
-            el.style.setProperty('transform', "translate3d(0,0,0) scale(" + scale + ")", 'important');
+          $pushEl.transition(0).forEach(el => {
+            el.style.setProperty('transform', `translate3d(0,0,0) scale(${scale})`, 'important');
           });
         }
       }
 
-      $el.transition(0).transform("translate3d(0," + -touchesDiff + "px,0)");
+      $el.transition(0).transform(`translate3d(0,${-touchesDiff}px,0)`);
     }
 
     function handleTouchEnd() {
@@ -260,7 +246,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
         $pushEl.transition('').transform('');
       }
 
-      var direction = touchesDiff <= 0 ? 'to-bottom' : 'to-top';
+      const direction = touchesDiff <= 0 ? 'to-bottom' : 'to-top';
 
       if (typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose) {
         $el.transform('');
@@ -268,11 +254,11 @@ var Popup = /*#__PURE__*/function (_Modal) {
         return;
       }
 
-      var diff = Math.abs(touchesDiff);
-      var timeDiff = new Date().getTime() - touchStartTime;
+      const diff = Math.abs(touchesDiff);
+      const timeDiff = new Date().getTime() - touchStartTime;
 
       if (timeDiff < 300 && diff > 20 || timeDiff >= 300 && diff > 100) {
-        nextTick(function () {
+        nextTick(() => {
           if (direction === 'to-bottom') {
             $el.addClass('swipe-close-to-bottom');
           } else {
@@ -292,7 +278,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
       $el.transform('');
     }
 
-    var passive = support.passiveListener ? {
+    const passive = support.passiveListener ? {
       passive: true
     } : false;
 
@@ -300,17 +286,17 @@ var Popup = /*#__PURE__*/function (_Modal) {
       $el.on(app.touchEvents.start, handleTouchStart, passive);
       app.on('touchmove', handleTouchMove);
       app.on('touchend:passive', handleTouchEnd);
-      popup.once('popupDestroy', function () {
+      popup.once('popupDestroy', () => {
         $el.off(app.touchEvents.start, handleTouchStart, passive);
         app.off('touchmove', handleTouchMove);
         app.off('touchend:passive', handleTouchEnd);
       });
     }
 
-    var hasPreviousPushPopup;
+    let hasPreviousPushPopup;
 
-    var updatePushOffset = function updatePushOffset() {
-      var wasPush = isPush;
+    const updatePushOffset = () => {
+      const wasPush = isPush;
 
       if (popup.push) {
         isPush = popup.push && (app.width < 630 || app.height < 630 || $el.hasClass('popup-tablet-fullscreen'));
@@ -327,7 +313,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
       }
     };
 
-    var setPushOffset = function setPushOffset() {
+    const setPushOffset = () => {
       app.off('resize', updatePushOffset);
 
       if (popup.push) {
@@ -348,7 +334,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
       app.on('resize', updatePushOffset);
     };
 
-    popup.on('open', function () {
+    popup.on('open', () => {
       hasPreviousPushPopup = false;
 
       if (popup.params.closeOnEscape) {
@@ -358,14 +344,14 @@ var Popup = /*#__PURE__*/function (_Modal) {
       $el.prevAll('.popup.modal-in').addClass('popup-behind');
       setPushOffset();
     });
-    popup.on('opened', function () {
+    popup.on('opened', () => {
       $el.removeClass('swipe-close-to-bottom swipe-close-to-top');
 
       if (popup.params.closeByBackdropClick) {
         app.on('click', handleClick);
       }
     });
-    popup.on('close', function () {
+    popup.on('close', () => {
       hasPreviousPushPopup = popup.$el.prevAll('.popup-push.modal-in').length > 0;
 
       if (popup.params.closeOnEscape) {
@@ -385,7 +371,7 @@ var Popup = /*#__PURE__*/function (_Modal) {
 
       app.off('resize', updatePushOffset);
     });
-    popup.on('closed', function () {
+    popup.on('closed', () => {
       $el.removeClass('popup-behind');
 
       if (isPush && pushOffset && !hasPreviousPushPopup) {
@@ -394,10 +380,9 @@ var Popup = /*#__PURE__*/function (_Modal) {
       }
     });
     $el[0].f7Modal = popup;
-    return popup || _assertThisInitialized(_this);
+    return popup;
   }
 
-  return Popup;
-}(Modal);
+}
 
 export default Popup;

package/components/popup/popup-rtl.css

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

package/components/popup/popup.css

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

package/components/popup/popup.js

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