framework7 7.0.0-beta.2 → 7.0.0-beta.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/accordion/accordion.js +2 -2
- package/components/accordion/{accordion.umd.js → accordion.lazy.js} +1 -1
- package/components/actions/actions-class.js +11 -6
- package/components/actions/actions-rtl.css +1 -1
- package/components/actions/actions.css +1 -1
- package/components/actions/actions.d.ts +2 -0
- package/components/actions/actions.js +13 -4
- package/components/actions/actions.lazy.js +1 -0
- package/components/actions/actions.less +3 -0
- package/components/app/app-class.d.ts +10 -10
- package/components/app/app-class.js +43 -37
- package/components/app/app.less +3 -3
- package/components/app/load-module.js +4 -4
- package/components/appbar/{appbar.umd.js → appbar.lazy.js} +0 -0
- package/components/area-chart/area-chart-class.js +38 -22
- package/components/area-chart/area-chart-rtl.css +1 -1
- package/components/area-chart/area-chart.css +1 -1
- package/components/area-chart/area-chart.js +3 -3
- package/components/area-chart/area-chart.lazy.js +1 -0
- package/components/autocomplete/autocomplete-class.js +10 -6
- package/components/autocomplete/autocomplete-rtl.css +1 -1
- package/components/autocomplete/autocomplete.css +1 -1
- package/components/autocomplete/autocomplete.js +3 -3
- package/components/autocomplete/autocomplete.lazy.js +1 -0
- package/components/breadcrumbs/breadcrumbs-aurora.less +2 -0
- package/components/breadcrumbs/breadcrumbs-ios.less +2 -0
- package/components/breadcrumbs/breadcrumbs-md.less +2 -0
- package/components/breadcrumbs/breadcrumbs-rtl.css +1 -0
- package/components/breadcrumbs/breadcrumbs-vars.less +36 -0
- package/components/breadcrumbs/breadcrumbs.css +1 -0
- package/components/breadcrumbs/breadcrumbs.d.ts +15 -0
- package/components/breadcrumbs/breadcrumbs.js +13 -0
- package/components/breadcrumbs/breadcrumbs.lazy.js +1 -0
- package/components/breadcrumbs/breadcrumbs.less +100 -0
- package/components/calendar/calendar-class.js +222 -130
- package/components/calendar/calendar-rtl.css +1 -1
- package/components/calendar/calendar-vars.less +6 -10
- package/components/calendar/calendar.css +1 -1
- package/components/calendar/calendar.d.ts +2 -0
- package/components/calendar/calendar.js +9 -4
- package/components/calendar/calendar.lazy.js +1 -0
- package/components/calendar/calendar.less +20 -16
- package/components/card/card-rtl.css +1 -1
- package/components/card/card.css +1 -1
- package/components/card/card.js +27 -7
- package/components/card/card.lazy.js +1 -0
- package/components/checkbox/checkbox-rtl.css +1 -1
- package/components/checkbox/checkbox.css +1 -1
- package/components/checkbox/{checkbox.umd.js → checkbox.lazy.js} +0 -0
- package/components/chip/chip-rtl.css +1 -1
- package/components/chip/chip.css +1 -1
- package/components/chip/{chip.umd.js → chip.lazy.js} +0 -0
- package/components/color-picker/color-picker-class.js +37 -21
- package/components/color-picker/color-picker-rtl.css +1 -1
- package/components/color-picker/color-picker.css +1 -1
- package/components/color-picker/color-picker.js +8 -4
- package/components/color-picker/{color-picker.umd.js → color-picker.lazy.js} +1 -1
- package/components/color-picker/modules/alpha-slider.js +1 -1
- package/components/color-picker/modules/brightness-slider.js +2 -2
- package/components/color-picker/modules/current-color.js +1 -1
- package/components/color-picker/modules/hex.js +1 -1
- package/components/color-picker/modules/hs-spectrum.js +4 -4
- package/components/color-picker/modules/hsb-sliders.js +3 -3
- package/components/color-picker/modules/hue-slider.js +1 -1
- package/components/color-picker/modules/initial-current-colors.js +1 -1
- package/components/color-picker/modules/palette.js +2 -2
- package/components/color-picker/modules/rgb-bars.js +2 -2
- package/components/color-picker/modules/rgb-sliders.js +2 -2
- package/components/color-picker/modules/sb-spectrum.js +3 -3
- package/components/color-picker/modules/wheel.js +3 -3
- package/components/contacts-list/contacts-list-rtl.css +1 -1
- package/components/contacts-list/contacts-list.css +1 -1
- package/components/contacts-list/{contacts-list.umd.js → contacts-list.lazy.js} +0 -0
- package/components/data-table/data-table-class.js +8 -4
- package/components/data-table/data-table-rtl.css +1 -1
- package/components/data-table/data-table.css +1 -1
- package/components/data-table/data-table.js +3 -3
- package/components/data-table/data-table.lazy.js +1 -0
- package/components/dialog/dialog-class.js +5 -5
- package/components/dialog/dialog-rtl.css +1 -1
- package/components/dialog/dialog.css +1 -1
- package/components/dialog/dialog.js +33 -9
- package/components/dialog/dialog.lazy.js +1 -0
- package/components/elevation/{elevation.umd.js → elevation.lazy.js} +0 -0
- package/components/fab/fab-rtl.css +1 -1
- package/components/fab/fab.css +1 -1
- package/components/fab/fab.js +17 -5
- package/components/fab/fab.lazy.js +1 -0
- package/components/form/form.js +2 -2
- package/components/form/{form.umd.js → form.lazy.js} +1 -1
- package/components/gauge/gauge-class.js +14 -6
- package/components/gauge/gauge.d.ts +2 -2
- package/components/gauge/gauge.js +4 -4
- package/components/gauge/gauge.lazy.js +1 -0
- package/components/grid/grid-rtl.css +1 -1
- package/components/grid/grid.css +1 -1
- package/components/grid/grid.js +2 -2
- package/components/grid/{grid.umd.js → grid.lazy.js} +0 -0
- package/components/infinite-scroll/infinite-scroll.js +2 -2
- package/components/infinite-scroll/{infinite-scroll.umd.js → infinite-scroll.lazy.js} +0 -0
- package/components/input/input-rtl.css +1 -1
- package/components/input/input.css +1 -1
- package/components/input/input.js +8 -4
- package/components/input/input.lazy.js +1 -0
- package/components/input/input.less +1 -1
- package/components/lazy/lazy.js +3 -3
- package/components/lazy/{lazy.umd.js → lazy.lazy.js} +0 -0
- package/components/list-index/list-index-class.js +9 -5
- package/components/list-index/list-index.d.ts +1 -1
- package/components/list-index/list-index.js +4 -4
- package/components/list-index/list-index.lazy.js +1 -0
- package/components/login-screen/login-screen-class.js +3 -3
- package/components/login-screen/login-screen-rtl.css +1 -1
- package/components/login-screen/login-screen.css +1 -1
- package/components/login-screen/login-screen.js +12 -4
- package/components/login-screen/login-screen.lazy.js +1 -0
- package/components/login-screen/login-screen.less +1 -1
- package/components/menu/menu.js +12 -4
- package/components/menu/menu.lazy.js +1 -0
- package/components/messagebar/messagebar-class.js +28 -8
- package/components/messagebar/messagebar-rtl.css +1 -1
- package/components/messagebar/messagebar.css +1 -1
- package/components/messagebar/messagebar.js +4 -4
- package/components/messagebar/messagebar.lazy.js +1 -0
- package/components/messages/messages-class.js +64 -28
- package/components/messages/messages-rtl.css +1 -1
- package/components/messages/messages.css +1 -1
- package/components/messages/messages.js +3 -3
- package/components/messages/messages.lazy.js +1 -0
- package/components/modal/custom-modal-class.js +3 -3
- package/components/modal/modal-class.js +13 -3
- package/components/modal/modal.js +2 -2
- package/components/navbar/navbar.js +29 -5
- package/components/notification/notification-aurora.less +1 -1
- package/components/notification/notification-class.js +4 -4
- package/components/notification/notification-ios.less +1 -1
- package/components/notification/notification-rtl.css +1 -1
- package/components/notification/notification.css +1 -1
- package/components/notification/notification.d.ts +4 -4
- package/components/notification/notification.js +3 -3
- package/components/notification/{notification.umd.js → notification.lazy.js} +0 -0
- package/components/page/page-vars.less +1 -1
- package/components/panel/panel-class.js +40 -12
- package/components/panel/panel.js +43 -11
- package/components/panel/panel.lazy.js +1 -0
- package/components/panel/resizable-panel.js +3 -3
- package/components/panel/swipe-panel.js +2 -2
- package/components/photo-browser/photo-browser-class.js +46 -12
- package/components/photo-browser/photo-browser.js +2 -2
- package/components/photo-browser/photo-browser.lazy.js +1 -0
- package/components/picker/picker-class.js +17 -13
- package/components/picker/picker-column.js +35 -271
- package/components/picker/picker-rtl.css +1 -1
- package/components/picker/picker.css +1 -1
- package/components/picker/picker.d.ts +2 -13
- package/components/picker/picker.js +8 -9
- package/components/picker/picker.lazy.js +1 -0
- package/components/picker/picker.less +28 -10
- package/components/pie-chart/pie-chart-class.js +20 -11
- package/components/pie-chart/pie-chart.js +3 -3
- package/components/pie-chart/pie-chart.lazy.js +1 -0
- package/components/popover/popover-class.js +24 -7
- package/components/popover/popover-rtl.css +1 -1
- package/components/popover/popover.css +1 -1
- package/components/popover/popover.d.ts +2 -0
- package/components/popover/popover.js +15 -6
- package/components/popover/popover.lazy.js +1 -0
- package/components/popover/popover.less +3 -0
- package/components/popup/popup-class.js +11 -6
- package/components/popup/popup-rtl.css +1 -1
- package/components/popup/popup.css +1 -1
- package/components/popup/popup.d.ts +4 -0
- package/components/popup/popup.js +13 -4
- package/components/popup/popup.lazy.js +1 -0
- package/components/popup/popup.less +25 -21
- package/components/preloader/preloader-ios.less +3 -0
- package/components/preloader/preloader-rtl.css +1 -1
- package/components/preloader/preloader.css +1 -1
- package/components/preloader/preloader.d.ts +4 -0
- package/components/preloader/preloader.js +12 -4
- package/components/preloader/preloader.lazy.js +1 -0
- package/components/progressbar/progressbar-aurora.less +32 -13
- package/components/progressbar/progressbar-ios.less +19 -7
- package/components/progressbar/progressbar-md.less +64 -28
- package/components/progressbar/progressbar-rtl.css +1 -1
- package/components/progressbar/progressbar.css +1 -1
- package/components/progressbar/progressbar.js +19 -6
- package/components/progressbar/progressbar.lazy.js +1 -0
- package/components/progressbar/progressbar.less +16 -4
- package/components/pull-to-refresh/pull-to-refresh-class.js +10 -6
- package/components/pull-to-refresh/pull-to-refresh.js +4 -4
- package/components/pull-to-refresh/pull-to-refresh.lazy.js +1 -0
- package/components/radio/radio-rtl.css +1 -1
- package/components/radio/radio.css +1 -1
- package/components/radio/{radio.umd.js → radio.lazy.js} +0 -0
- package/components/range/range-class.js +4 -4
- package/components/range/range.d.ts +23 -5
- package/components/range/range.js +14 -6
- package/components/range/{range.umd.js → range.lazy.js} +1 -1
- package/components/searchbar/searchbar-class.js +11 -7
- package/components/searchbar/searchbar-rtl.css +1 -1
- package/components/searchbar/searchbar.css +1 -1
- package/components/searchbar/searchbar.js +24 -8
- package/components/searchbar/searchbar.lazy.js +1 -0
- package/components/searchbar/searchbar.less +1 -1
- package/components/sheet/sheet-class.js +26 -7
- package/components/sheet/sheet-rtl.css +1 -1
- package/components/sheet/sheet.css +1 -1
- package/components/sheet/sheet.d.ts +2 -0
- package/components/sheet/sheet.js +15 -6
- package/components/sheet/sheet.lazy.js +1 -0
- package/components/sheet/sheet.less +19 -16
- package/components/skeleton/skeleton-rtl.css +1 -1
- package/components/skeleton/skeleton-vars.less +1 -1
- package/components/skeleton/skeleton.css +1 -1
- package/components/skeleton/{skeleton.umd.js → skeleton.lazy.js} +0 -0
- package/components/smart-select/smart-select-class.js +19 -7
- package/components/smart-select/smart-select.js +4 -4
- package/components/smart-select/smart-select.lazy.js +1 -0
- package/components/sortable/sortable-rtl.css +1 -1
- package/components/sortable/sortable.css +1 -1
- package/components/sortable/sortable.d.ts +5 -1
- package/components/sortable/sortable.js +48 -11
- package/components/sortable/sortable.lazy.js +1 -0
- package/components/statusbar/statusbar.d.ts +9 -9
- package/components/statusbar/statusbar.js +8 -4
- package/components/stepper/stepper-class.js +3 -3
- package/components/stepper/stepper.js +14 -6
- package/components/stepper/{stepper.umd.js → stepper.lazy.js} +1 -1
- package/components/subnavbar/subnavbar.js +1 -1
- package/components/swipeout/swipeout-rtl.css +1 -1
- package/components/swipeout/swipeout.css +1 -1
- package/components/swipeout/swipeout.js +19 -6
- package/components/swipeout/{swipeout.umd.js → swipeout.lazy.js} +1 -1
- package/components/swiper/swiper-rtl.css +1 -1
- package/components/swiper/swiper.css +1 -1
- package/components/swiper/swiper.js +2 -2
- package/components/swiper/swiper.lazy.js +1 -0
- package/components/tabs/tabs.js +16 -9
- package/components/tabs/tabs.lazy.js +1 -0
- package/components/text-editor/text-editor-class.js +5 -5
- package/components/text-editor/text-editor-rtl.css +1 -1
- package/components/text-editor/text-editor.css +1 -1
- package/components/text-editor/text-editor.js +4 -4
- package/components/text-editor/{text-editor.umd.js → text-editor.lazy.js} +1 -1
- package/components/timeline/timeline-rtl.css +1 -1
- package/components/timeline/timeline.css +1 -1
- package/components/timeline/{timeline.umd.js → timeline.lazy.js} +0 -0
- package/components/toast/toast-class.js +4 -4
- package/components/toast/toast.d.ts +2 -2
- package/components/toast/toast.js +3 -3
- package/components/toast/{toast.umd.js → toast.lazy.js} +0 -0
- package/components/toggle/toggle-class.js +9 -5
- package/components/toggle/toggle-rtl.css +1 -1
- package/components/toggle/toggle.css +1 -1
- package/components/toggle/toggle.js +3 -3
- package/components/toggle/toggle.lazy.js +1 -0
- package/components/toolbar/toolbar-aurora.less +0 -13
- package/components/toolbar/toolbar-md.less +0 -13
- package/components/toolbar/toolbar.js +13 -5
- package/components/toolbar/toolbar.less +13 -0
- package/components/tooltip/tooltip-class.js +9 -5
- package/components/tooltip/tooltip.js +3 -3
- package/components/tooltip/tooltip.lazy.js +1 -0
- package/components/touch-ripple/touch-ripple-class.js +1 -1
- package/components/touch-ripple/touch-ripple-vars.less +1 -1
- package/components/touch-ripple/touch-ripple.js +6 -2
- package/components/treeview/treeview-rtl.css +1 -1
- package/components/treeview/treeview.css +1 -1
- package/components/treeview/treeview.js +2 -2
- package/components/treeview/{treeview.umd.js → treeview.lazy.js} +1 -1
- package/components/typography/{typography.umd.js → typography.lazy.js} +0 -0
- package/components/view/resizable-view.js +3 -3
- package/components/view/view-class.js +18 -7
- package/components/view/view.d.ts +5 -1
- package/components/view/view.js +5 -3
- package/components/virtual-list/virtual-list-class.js +58 -13
- package/components/virtual-list/virtual-list.d.ts +2 -2
- package/components/virtual-list/virtual-list.js +2 -2
- package/components/virtual-list/virtual-list.lazy.js +1 -0
- package/framework7-bundle-rtl.css +513 -411
- package/framework7-bundle-rtl.min.css +4 -4
- package/framework7-bundle.css +498 -395
- package/framework7-bundle.esm.js +87 -86
- package/framework7-bundle.js +2728 -1257
- package/framework7-bundle.js.map +1 -1
- package/framework7-bundle.less +4 -3
- package/framework7-bundle.min.css +4 -4
- package/framework7-bundle.min.js +4 -4
- package/framework7-bundle.min.js.map +1 -1
- package/framework7-lite-bundle.esm.js +81 -80
- package/framework7-lite.esm.js +27 -27
- package/framework7-rtl.css +61 -70
- package/framework7-rtl.min.css +4 -4
- package/framework7-types.d.ts +5 -1
- package/framework7.css +60 -68
- package/framework7.d.ts +4 -0
- package/framework7.esm.js +30 -30
- package/framework7.js +675 -255
- package/framework7.js.map +1 -1
- package/framework7.less +3 -3
- package/framework7.min.css +4 -4
- package/framework7.min.js +4 -4
- package/framework7.min.js.map +1 -1
- package/less/mixins.less +2 -2
- package/modules/clicks/clicks.js +2 -2
- package/modules/component/$h.js +6 -2
- package/modules/component/$jsx.js +6 -2
- package/modules/component/component-class.js +40 -27
- package/modules/component/component.d.ts +2 -2
- package/modules/component/component.js +11 -10
- package/modules/component/eventslisteners.js +6 -2
- package/modules/component/parse-component.js +2 -2
- package/modules/component/patch.js +5 -5
- package/modules/component/snabbdom/h.js +2 -2
- package/modules/component/snabbdom/snabbdom.bundle.js +7 -7
- package/modules/component/snabbdom/snabbdom.js +3 -3
- package/modules/component/snabbdom/thunk.js +1 -1
- package/modules/component/snabbdom/tovnode.js +2 -2
- package/modules/component/vdom.js +35 -20
- package/modules/device/device.js +2 -2
- package/modules/history/history.js +1 -1
- package/modules/request/request.js +1 -1
- package/modules/resize/resize.js +1 -1
- package/modules/router/back.js +24 -14
- package/modules/router/clear-previous-history.js +2 -2
- package/modules/router/component-loader.js +81 -24
- package/modules/router/modal.js +8 -4
- package/modules/router/navigate.js +25 -55
- package/modules/router/redirect.js +6 -2
- package/modules/router/router-class.js +50 -21
- package/modules/router/router.js +1 -1
- package/modules/router/swipe-back.js +12 -11
- package/modules/router/tab.js +10 -6
- package/modules/service-worker/service-worker.js +1 -1
- package/modules/store/create-store.js +11 -3
- package/modules/store/store.js +1 -1
- package/modules/support/support.js +1 -1
- package/modules/touch/touch.js +4 -4
- package/modules/utils/utils.js +1 -1
- package/package.json +12 -6
- package/shared/$jsx.js +6 -1
- package/shared/class.js +35 -7
- package/shared/constructor-methods.js +26 -5
- package/shared/events-class.js +15 -3
- package/shared/get-device.d.ts +0 -2
- package/shared/get-device.js +11 -7
- package/shared/history.js +2 -2
- package/shared/modal-methods.js +13 -5
- package/shared/request.js +46 -8
- package/shared/utils.js +47 -10
- package/components/actions/actions.umd.js +0 -1
- package/components/area-chart/area-chart.umd.js +0 -1
- package/components/autocomplete/autocomplete.umd.js +0 -1
- package/components/calendar/calendar.umd.js +0 -1
- package/components/card/card.umd.js +0 -1
- package/components/data-table/data-table.umd.js +0 -1
- package/components/dialog/dialog.umd.js +0 -1
- package/components/fab/fab.umd.js +0 -1
- package/components/gauge/gauge.umd.js +0 -1
- package/components/input/input.umd.js +0 -1
- package/components/list-index/list-index.umd.js +0 -1
- package/components/login-screen/login-screen.umd.js +0 -1
- package/components/menu/menu.umd.js +0 -1
- package/components/messagebar/messagebar.umd.js +0 -1
- package/components/messages/messages.umd.js +0 -1
- package/components/panel/panel.umd.js +0 -1
- package/components/photo-browser/photo-browser.umd.js +0 -1
- package/components/picker/picker.umd.js +0 -1
- package/components/pie-chart/pie-chart.umd.js +0 -1
- package/components/popover/popover.umd.js +0 -1
- package/components/popup/popup.umd.js +0 -1
- package/components/preloader/preloader.umd.js +0 -1
- package/components/progressbar/progressbar.umd.js +0 -1
- package/components/pull-to-refresh/pull-to-refresh.umd.js +0 -1
- package/components/searchbar/searchbar.umd.js +0 -1
- package/components/sheet/sheet.umd.js +0 -1
- package/components/smart-select/smart-select.umd.js +0 -1
- package/components/sortable/sortable.umd.js +0 -1
- package/components/swiper/swiper.umd.js +0 -1
- package/components/tabs/tabs.umd.js +0 -1
- package/components/toggle/toggle.umd.js +0 -1
- package/components/tooltip/tooltip.umd.js +0 -1
- package/components/virtual-list/virtual-list.umd.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}:root .theme-dark,:root.theme-dark{--f7-notification-subtitle-color:#fff}.ios{--f7-notification-margin:8px;--f7-notification-padding:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .theme-dark,.ios.theme-dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:0px;--f7-notification-padding:16px;--f7-notification-border-radius:0px;--f7-notification-box-shadow:0 2px 4px rgba(0, 0, 0, 0.22),0 1px 2px rgba(0, 0, 0, 0.24);--f7-notification-icon-size:16px;--f7-notification-title-color:var(--f7-theme-color);--f7-notification-title-font-size:12px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1;--f7-notification-title-font-weight:400;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35;--f7-notification-bg-color:#fff;--f7-notification-title-right-color:rgba(0, 0, 0, 0.54);--f7-notification-subtitle-color:#212121;--f7-notification-text-color:rgba(0, 0, 0, 0.54)}.md .theme-dark,.md.theme-dark{--f7-notification-bg-color:#242424;--f7-notification-title-right-color:rgba(255, 255, 255, 0.54);--f7-notification-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-notification-margin:16px;--f7-notification-padding:16px;--f7-notification-border-radius:8px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:600;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:14px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35;--f7-notification-bg-color:#fff;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.6);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.aurora .theme-dark,.aurora.theme-dark{--f7-notification-bg-color:#242424;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.54)}.notification{--f7-link-highlight-color:var(--f7-link-highlight-black);--f7-touch-ripple-color:var(--f7-touch-ripple-black);position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .theme-dark .notification-close-button:after,.ios.theme-dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:0s;animation:notification-md-in .4s ease-out;transform:translate3d(0,0%,0)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:2px}.md .notification-header+.notification-content{margin-top:6px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:before{content:'';width:152%;height:152%;left:-26%;top:-26%;position:absolute;background-image:radial-gradient(circle at center,var(--f7-link-highlight-color) 66%,rgba(255,255,255,0) 66%);background-repeat:no-repeat;background-position:center;background-size:100% 100%;opacity:0;pointer-events:none;transition-duration:.3s;transition-property:opacity}.md .notification-close-button.icon-only:before,.md .notification-close-button.input-clear-button:before,.md .notification-close-button.notification-close-button:before,.md .notification-close-button.ripple-inset:before,.md .notification-close-button.searchbar-disable-button:before{width:100%;height:100%;left:0;top:0;background-image:radial-gradient(circle at center,var(--f7-link-highlight-color) 71%,rgba(255,255,255,0) 71%)}.md .notification-close-button.active-state:before{opacity:1;transition-duration:150ms}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:#737373;content:'delete_md';line-height:48px;font-size:14px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}.aurora .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.aurora .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.aurora .notification.modal-out{transform:translate3d(0%,-200%,0)}.aurora .notification-icon{margin-right:8px}.aurora .notification-header+.notification-content{margin-top:8px}.aurora .notification-title-right-text{margin-right:0px;margin-left:auto}.aurora .notification-title-right-text+.notification-close-button{margin-left:8px}.aurora .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.4;transition-duration:.3s}.aurora .notification-close-button:hover{transition-duration:0s;opacity:.5}.aurora .notification-close-button.active-state{transition-duration:0s;opacity:.6}.aurora .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.aurora .theme-dark .notification-close-button:after,.aurora.theme-dark .notification-close-button:after{color:#fff}
|
|
1
|
+
:root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}:root .dark,:root.dark{--f7-notification-subtitle-color:#fff}.ios{--f7-notification-margin:8px;--f7-notification-padding:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .dark,.ios.dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:0px;--f7-notification-padding:16px;--f7-notification-border-radius:0px;--f7-notification-box-shadow:0 2px 4px rgba(0, 0, 0, 0.22),0 1px 2px rgba(0, 0, 0, 0.24);--f7-notification-icon-size:16px;--f7-notification-title-color:var(--f7-theme-color);--f7-notification-title-font-size:12px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1;--f7-notification-title-font-weight:400;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35;--f7-notification-bg-color:#fff;--f7-notification-title-right-color:rgba(0, 0, 0, 0.54);--f7-notification-subtitle-color:#212121;--f7-notification-text-color:rgba(0, 0, 0, 0.54)}.md .dark,.md.dark{--f7-notification-bg-color:#242424;--f7-notification-title-right-color:rgba(255, 255, 255, 0.54);--f7-notification-text-color:rgba(255, 255, 255, 0.54)}.aurora{--f7-notification-margin:16px;--f7-notification-padding:16px;--f7-notification-border-radius:8px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:600;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:14px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35;--f7-notification-bg-color:#fff;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.6);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.aurora .dark,.aurora.dark{--f7-notification-bg-color:#242424;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.54)}.notification{--f7-link-highlight-color:var(--f7-link-highlight-black);--f7-touch-ripple-color:var(--f7-touch-ripple-black);position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .dark .notification-close-button:after,.ios.dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:0s;animation:notification-md-in .4s ease-out;transform:translate3d(0,0%,0)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:2px}.md .notification-header+.notification-content{margin-top:6px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:before{content:'';width:152%;height:152%;left:-26%;top:-26%;position:absolute;background-image:radial-gradient(circle at center,var(--f7-link-highlight-color) 66%,rgba(255,255,255,0) 66%);background-repeat:no-repeat;background-position:center;background-size:100% 100%;opacity:0;pointer-events:none;transition-duration:.3s;transition-property:opacity}.md .notification-close-button.icon-only:before,.md .notification-close-button.input-clear-button:before,.md .notification-close-button.notification-close-button:before,.md .notification-close-button.ripple-inset:before,.md .notification-close-button.searchbar-disable-button:before{width:100%;height:100%;left:0;top:0;background-image:radial-gradient(circle at center,var(--f7-link-highlight-color) 71%,rgba(255,255,255,0) 71%)}.md .notification-close-button.active-state:before{opacity:1;transition-duration:150ms}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:#737373;content:'delete_md';line-height:48px;font-size:14px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}.aurora .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.aurora .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.aurora .notification.modal-out{transform:translate3d(0%,-200%,0)}.aurora .notification-icon{margin-right:8px}.aurora .notification-header+.notification-content{margin-top:8px}.aurora .notification-title-right-text{margin-right:0px;margin-left:auto}.aurora .notification-title-right-text+.notification-close-button{margin-left:8px}.aurora .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.4;transition-duration:.3s}.aurora .notification-close-button:hover{transition-duration:0s;opacity:.5}.aurora .notification-close-button.active-state{transition-duration:0s;opacity:.6}.aurora .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.aurora .dark .notification-close-button:after,.aurora.dark .notification-close-button:after{color:#fff}
|
|
@@ -13,9 +13,9 @@ export namespace Notification {
|
|
|
13
13
|
params: Parameters;
|
|
14
14
|
|
|
15
15
|
/** Open notification */
|
|
16
|
-
open(): Notification;
|
|
16
|
+
open(animate?: boolean): Notification;
|
|
17
17
|
/** Close notification */
|
|
18
|
-
close(): Notification;
|
|
18
|
+
close(animate?: boolean): Notification;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
interface Parameters {
|
|
@@ -88,10 +88,10 @@ export namespace Notification {
|
|
|
88
88
|
get(el: HTMLElement | CSSSelector): Notification;
|
|
89
89
|
|
|
90
90
|
/** open Notification */
|
|
91
|
-
open(el: HTMLElement | CSSSelector): Notification;
|
|
91
|
+
open(el: HTMLElement | CSSSelector, animate?: boolean): Notification;
|
|
92
92
|
|
|
93
93
|
/** closes Notification */
|
|
94
|
-
close(el: HTMLElement | CSSSelector): Notification;
|
|
94
|
+
close(el: HTMLElement | CSSSelector, animate?: boolean): Notification;
|
|
95
95
|
};
|
|
96
96
|
}
|
|
97
97
|
interface AppParams {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { extend } from '../../shared/utils';
|
|
2
|
-
import Notification from './notification-class';
|
|
3
|
-
import ModalMethods from '../../shared/modal-methods';
|
|
1
|
+
import { extend } from '../../shared/utils.js';
|
|
2
|
+
import Notification from './notification-class.js';
|
|
3
|
+
import ModalMethods from '../../shared/modal-methods.js';
|
|
4
4
|
export default {
|
|
5
5
|
name: 'notification',
|
|
6
6
|
static: {
|
|
File without changes
|
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
import { getDocument } from 'ssr-window';
|
|
2
|
-
import $ from '../../shared/dom7';
|
|
3
|
-
import { extend, deleteProps } from '../../shared/utils';
|
|
4
|
-
import Framework7Class from '../../shared/class';
|
|
5
|
-
import swipePanel from './swipe-panel';
|
|
6
|
-
import resizablePanel from './resizable-panel';
|
|
2
|
+
import $ from '../../shared/dom7.js';
|
|
3
|
+
import { extend, deleteProps } from '../../shared/utils.js';
|
|
4
|
+
import Framework7Class from '../../shared/class.js';
|
|
5
|
+
import swipePanel from './swipe-panel.js';
|
|
6
|
+
import resizablePanel from './resizable-panel.js';
|
|
7
7
|
|
|
8
8
|
class Panel extends Framework7Class {
|
|
9
|
-
constructor(app, params
|
|
9
|
+
constructor(app, params) {
|
|
10
|
+
if (params === void 0) {
|
|
11
|
+
params = {};
|
|
12
|
+
}
|
|
13
|
+
|
|
10
14
|
const extendedParams = extend({
|
|
11
15
|
on: {}
|
|
12
16
|
}, app.params.panel, params);
|
|
@@ -138,7 +142,11 @@ class Panel extends Framework7Class {
|
|
|
138
142
|
return panel;
|
|
139
143
|
}
|
|
140
144
|
|
|
141
|
-
setVisibleBreakpoint(emitEvents
|
|
145
|
+
setVisibleBreakpoint(emitEvents) {
|
|
146
|
+
if (emitEvents === void 0) {
|
|
147
|
+
emitEvents = true;
|
|
148
|
+
}
|
|
149
|
+
|
|
142
150
|
const panel = this;
|
|
143
151
|
const app = panel.app;
|
|
144
152
|
|
|
@@ -221,7 +229,11 @@ class Panel extends Framework7Class {
|
|
|
221
229
|
return panel;
|
|
222
230
|
}
|
|
223
231
|
|
|
224
|
-
setCollapsedBreakpoint(emitEvents
|
|
232
|
+
setCollapsedBreakpoint(emitEvents) {
|
|
233
|
+
if (emitEvents === void 0) {
|
|
234
|
+
emitEvents = true;
|
|
235
|
+
}
|
|
236
|
+
|
|
225
237
|
const panel = this;
|
|
226
238
|
const app = panel.app;
|
|
227
239
|
|
|
@@ -303,7 +315,11 @@ class Panel extends Framework7Class {
|
|
|
303
315
|
return panel;
|
|
304
316
|
}
|
|
305
317
|
|
|
306
|
-
onOpen(modifyHtmlClasses
|
|
318
|
+
onOpen(modifyHtmlClasses) {
|
|
319
|
+
if (modifyHtmlClasses === void 0) {
|
|
320
|
+
modifyHtmlClasses = true;
|
|
321
|
+
}
|
|
322
|
+
|
|
307
323
|
const panel = this;
|
|
308
324
|
const app = panel.app;
|
|
309
325
|
panel.opened = true;
|
|
@@ -359,7 +375,11 @@ class Panel extends Framework7Class {
|
|
|
359
375
|
panel.emit('local::closed panelClosed', panel);
|
|
360
376
|
}
|
|
361
377
|
|
|
362
|
-
toggle(animate
|
|
378
|
+
toggle(animate) {
|
|
379
|
+
if (animate === void 0) {
|
|
380
|
+
animate = true;
|
|
381
|
+
}
|
|
382
|
+
|
|
363
383
|
const panel = this;
|
|
364
384
|
const breakpoint = panel.params.visibleBreakpoint;
|
|
365
385
|
const app = panel.app;
|
|
@@ -409,7 +429,11 @@ class Panel extends Framework7Class {
|
|
|
409
429
|
}
|
|
410
430
|
}
|
|
411
431
|
|
|
412
|
-
open(animate
|
|
432
|
+
open(animate) {
|
|
433
|
+
if (animate === void 0) {
|
|
434
|
+
animate = true;
|
|
435
|
+
}
|
|
436
|
+
|
|
413
437
|
const panel = this;
|
|
414
438
|
const app = panel.app;
|
|
415
439
|
if (!app.panel.allowOpen) return false;
|
|
@@ -490,7 +514,11 @@ class Panel extends Framework7Class {
|
|
|
490
514
|
return true;
|
|
491
515
|
}
|
|
492
516
|
|
|
493
|
-
close(animate
|
|
517
|
+
close(animate) {
|
|
518
|
+
if (animate === void 0) {
|
|
519
|
+
animate = true;
|
|
520
|
+
}
|
|
521
|
+
|
|
494
522
|
const panel = this;
|
|
495
523
|
const {
|
|
496
524
|
effect,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import $ from '../../shared/dom7';
|
|
2
|
-
import { extend } from '../../shared/utils';
|
|
3
|
-
import Panel from './panel-class';
|
|
1
|
+
import $ from '../../shared/dom7.js';
|
|
2
|
+
import { extend } from '../../shared/utils.js';
|
|
3
|
+
import Panel from './panel-class.js';
|
|
4
4
|
export default {
|
|
5
5
|
name: 'panel',
|
|
6
6
|
params: {
|
|
@@ -42,7 +42,11 @@ export default {
|
|
|
42
42
|
return new Panel(app, params);
|
|
43
43
|
},
|
|
44
44
|
|
|
45
|
-
get(el
|
|
45
|
+
get(el) {
|
|
46
|
+
if (el === void 0) {
|
|
47
|
+
el = '.panel';
|
|
48
|
+
}
|
|
49
|
+
|
|
46
50
|
if (el instanceof Panel) return el;
|
|
47
51
|
if (el === 'left' || el === 'right') el = `.panel-${el}`; // eslint-disable-line
|
|
48
52
|
|
|
@@ -51,13 +55,21 @@ export default {
|
|
|
51
55
|
return $el[0].f7Panel;
|
|
52
56
|
},
|
|
53
57
|
|
|
54
|
-
destroy(el
|
|
58
|
+
destroy(el) {
|
|
59
|
+
if (el === void 0) {
|
|
60
|
+
el = '.panel';
|
|
61
|
+
}
|
|
62
|
+
|
|
55
63
|
const panel = app.panel.get(el);
|
|
56
64
|
if (panel && panel.destroy) return panel.destroy();
|
|
57
65
|
return undefined;
|
|
58
66
|
},
|
|
59
67
|
|
|
60
|
-
open(el
|
|
68
|
+
open(el, animate) {
|
|
69
|
+
if (el === void 0) {
|
|
70
|
+
el = '.panel';
|
|
71
|
+
}
|
|
72
|
+
|
|
61
73
|
if (el === 'left' || el === 'right') el = `.panel-${el}`; // eslint-disable-line
|
|
62
74
|
|
|
63
75
|
let panel = app.panel.get(el);
|
|
@@ -73,7 +85,11 @@ export default {
|
|
|
73
85
|
return undefined;
|
|
74
86
|
},
|
|
75
87
|
|
|
76
|
-
close(el
|
|
88
|
+
close(el, animate) {
|
|
89
|
+
if (el === void 0) {
|
|
90
|
+
el = '.panel-in';
|
|
91
|
+
}
|
|
92
|
+
|
|
77
93
|
if (el === 'left' || el === 'right') el = `.panel-${el}`; // eslint-disable-line
|
|
78
94
|
|
|
79
95
|
let panel = app.panel.get(el);
|
|
@@ -89,7 +105,11 @@ export default {
|
|
|
89
105
|
return undefined;
|
|
90
106
|
},
|
|
91
107
|
|
|
92
|
-
toggle(el
|
|
108
|
+
toggle(el, animate) {
|
|
109
|
+
if (el === void 0) {
|
|
110
|
+
el = '.panel';
|
|
111
|
+
}
|
|
112
|
+
|
|
93
113
|
if (el === 'left' || el === 'right') el = `.panel-${el}`; // eslint-disable-line
|
|
94
114
|
|
|
95
115
|
let panel = app.panel.get(el);
|
|
@@ -160,15 +180,27 @@ export default {
|
|
|
160
180
|
}
|
|
161
181
|
},
|
|
162
182
|
clicks: {
|
|
163
|
-
'.panel-open': function open(clickedEl, data
|
|
183
|
+
'.panel-open': function open(clickedEl, data) {
|
|
184
|
+
if (data === void 0) {
|
|
185
|
+
data = {};
|
|
186
|
+
}
|
|
187
|
+
|
|
164
188
|
const app = this;
|
|
165
189
|
app.panel.open(data.panel, data.animate);
|
|
166
190
|
},
|
|
167
|
-
'.panel-close': function close(clickedEl, data
|
|
191
|
+
'.panel-close': function close(clickedEl, data) {
|
|
192
|
+
if (data === void 0) {
|
|
193
|
+
data = {};
|
|
194
|
+
}
|
|
195
|
+
|
|
168
196
|
const app = this;
|
|
169
197
|
app.panel.close(data.panel, data.animate);
|
|
170
198
|
},
|
|
171
|
-
'.panel-toggle': function close(clickedEl, data
|
|
199
|
+
'.panel-toggle': function close(clickedEl, data) {
|
|
200
|
+
if (data === void 0) {
|
|
201
|
+
data = {};
|
|
202
|
+
}
|
|
203
|
+
|
|
172
204
|
const app = this;
|
|
173
205
|
app.panel.toggle(data.panel, data.animate);
|
|
174
206
|
},
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(function framework7ComponentLoader(e,a){void 0===a&&(a=!0);var n=e.$,t=e.utils,s=(e.getDevice,e.getSupport),l=e.Class,i=(e.Modal,e.ConstructorMethods,e.ModalMethods,t.extend),o=t.now,r=t.nextFrame,p=t.deleteProps;function d(e){const a=e.app,t=s();if(e.resizableInitialized)return;i(e,{resizable:!0,resizableWidth:null,resizableInitialized:!0});const l=n("html"),{$el:o,$backdropEl:p,side:d,effect:c}=e;if(!o)return;let h,f;const b={};let g,v,u,m,w,C;function k(e){if(!e)return null;if(e.indexOf("%")>=0||e.indexOf("vw")>=0)return parseInt(e,10)/100*a.width;const n=parseInt(e,10);return Number.isNaN(n)?null:n}function $(a){e.resizable&&o.hasClass("panel-resizable")&&(b.x="touchstart"===a.type?a.targetTouches[0].pageX:a.pageX,b.y="touchstart"===a.type?a.targetTouches[0].pageY:a.pageY,f=!1,h=!0,m=k(o.css("min-width")),w=k(o.css("max-width")),C=o.hasClass("panel-in-breakpoint"))}function z(t){if(!h)return;const s="touchmove"===t.type?t.targetTouches[0].pageX:t.pageX;f||(v=o[0].offsetWidth,o.transition(0),o.addClass("panel-resizing"),l.css("cursor","col-resize"),("cover"!==c||C)&&(u=n(e.getViewEl()),e.$containerEl&&e.$containerEl.hasClass("page")&&u.add(e.$containerEl.children(".page-content, .tabs, .fab"))),"cover"===c||C||(p.transition(0),u.transition(0))),f=!0,t.preventDefault(),g=s-b.x;let i="left"===d?v+g:v-g;m&&!Number.isNaN(m)&&(i=Math.max(i,m)),w&&!Number.isNaN(w)&&(i=Math.min(i,w)),i=Math.min(Math.max(i,0),a.width),e.resizableWidth=i,o[0].style.width=`${i}px`,"cover"===c||C?C&&u&&u.css(`margin-${d}`,`${i}px`):(u&&u.transform(`translate3d(${"left"===d?i:-i}px, 0, 0)`),p&&p.transform(`translate3d(${"left"===d?i:-i}px, 0, 0)`)),o.trigger("panel:resize",i),e.emit("local::resize panelResize",e,i)}function B(){if(n("html").css("cursor",""),!h||!f)return h=!1,void(f=!1);h=!1,f=!1,l[0].style.setProperty(`--f7-panel-${d}-width`,`${e.resizableWidth}px`),o[0].style.width="","cover"===c||C||(u.transform(""),p.transform("")),o.removeClass("panel-resizing"),r((()=>{o.transition(""),"cover"!==c&&(p.transition(""),u&&u.transition(""))}))}function E(){e.opened&&e.resizableWidth&&(m=k(o.css("min-width")),w=k(o.css("max-width")),m&&!Number.isNaN(m)&&e.resizableWidth<m&&(e.resizableWidth=Math.max(e.resizableWidth,m)),w&&!Number.isNaN(w)&&e.resizableWidth>w&&(e.resizableWidth=Math.min(e.resizableWidth,w)),e.resizableWidth=Math.min(Math.max(e.resizableWidth,0),a.width),l[0].style.setProperty(`--f7-panel-${d}-width`,`${e.resizableWidth}px`))}0===e.$el.find(".panel-resize-handler").length&&e.$el.append('<div class="panel-resize-handler"></div>'),e.$resizeHandlerEl=e.$el.children(".panel-resize-handler"),o.addClass("panel-resizable");const y=!!t.passiveListener&&{passive:!0};e.$el.on(a.touchEvents.start,".panel-resize-handler",$,y),a.on("touchmove:active",z),a.on("touchend:passive",B),a.on("resize",E),e.on("beforeOpen",E),e.once("panelDestroy",(()=>{o.removeClass("panel-resizable"),e.$resizeHandlerEl.remove(),e.$el.off(a.touchEvents.start,".panel-resize-handler",$,y),a.off("touchmove:active",z),a.off("touchend:passive",B),a.off("resize",E),e.off("beforeOpen",E)}))}class c extends l{constructor(e,a){void 0===a&&(a={});const t=i({on:{}},e.params.panel,a);super(t,[e]);const s=this;let l;if(s.params=t,s.$containerEl=s.params.containerEl?n(s.params.containerEl).eq(0):e.$el,s.containerEl=s.$containerEl[0],s.containerEl||(s.$containerEl=e.$el,s.containerEl=e.$el[0]),s.params.el?l=n(s.params.el).eq(0):s.params.content&&(l=n(s.params.content).filter((e=>1===e.nodeType)).eq(0)),0===l.length)return s;if(l[0].f7Panel)return l[0].f7Panel;l[0].f7Panel=s;let o,{side:r,effect:p,resizable:d}=s.params;return void 0===r&&(r=l.hasClass("panel-left")?"left":"right"),void 0===p&&(p=l.hasClass("panel-cover")?"cover":l.hasClass("panel-push")?"push":"reveal"),void 0===d&&(d=l.hasClass("panel-resizable")),s.params.backdrop&&s.params.backdropEl?o=n(s.params.backdropEl):s.params.backdrop&&(o=s.$containerEl.children(".panel-backdrop"),0===o.length&&(o=n('<div class="panel-backdrop"></div>'),s.$containerEl.prepend(o))),i(s,{app:e,side:r,effect:p,resizable:d,$el:l,el:l[0],opened:!1,$backdropEl:o,backdropEl:o&&o[0]}),s.useModules(),s.init(),s}getViewEl(){const e=this;let a;return a=e.$containerEl.children(".views").length>0?e.$containerEl.children(".views")[0]:e.$containerEl.children(".view")[0],a}setStateClasses(e){const a=this,{side:t,el:s}=a,l=a.getViewEl(),i=l&&l.contains(s),o=!l||i?a.$containerEl:n("html");"open"===e&&o.addClass(`with-panel with-panel-${a.side}-${a.effect}`),"before-closing"===e&&o.addClass("with-panel-closing"),"closing"===e&&(o.addClass("with-panel-closing"),o.removeClass(`with-panel with-panel-${a.side}-${a.effect}`)),"after-closing"===e&&o.removeClass("with-panel-closing"),"closed"===e&&o.removeClass(`with-panel-${t}-reveal with-panel-${t}-cover with-panel-${t}-push with-panel`)}enableVisibleBreakpoint(){const e=this;return e.visibleBreakpointDisabled=!1,e.setVisibleBreakpoint(),e}disableVisibleBreakpoint(){const e=this;return e.visibleBreakpointDisabled=!0,e.setVisibleBreakpoint(),e}toggleVisibleBreakpoint(){const e=this;return e.visibleBreakpointDisabled=!e.visibleBreakpointDisabled,e.setVisibleBreakpoint(),e}setVisibleBreakpoint(e){void 0===e&&(e=!0);const a=this,t=a.app;a.visibleBreakpointResizeHandler||(a.visibleBreakpointResizeHandler=function(){a.setVisibleBreakpoint()},t.on("resize",a.visibleBreakpointResizeHandler));const{side:s,$el:l,$containerEl:i,params:o,visibleBreakpointDisabled:r}=a,p=o.visibleBreakpoint,d=n(a.getViewEl()),c=l.hasClass("panel-in-breakpoint");i&&i.hasClass("page")&&d.add(i.children(".page-content, .tabs, .fab")),t.width>=p&&null!=p&&!r?c?d.css({[`margin-${s}`]:`${l.width()}px`}):(a.setStateClasses("closed"),l.addClass("panel-in-breakpoint").removeClass("panel-in panel-in-collapsed"),a.onOpen(!1),a.onOpened(),d.css({[`margin-${s}`]:`${l.width()}px`}),t.allowPanelOpen=!0,e&&(a.emit("local::breakpoint panelBreakpoint",a),a.$el.trigger("panel:breakpoint"))):c&&(l.removeClass("panel-in-breakpoint panel-in"),a.onClose(),a.onClosed(),d.css({[`margin-${s}`]:""}),e&&(a.emit("local::breakpoint panelBreakpoint",a),a.$el.trigger("panel:breakpoint")))}enableCollapsedBreakpoint(){const e=this;return e.collapsedBreakpointDisabled=!1,e.setCollapsedBreakpoint(),e}disableCollapsedBreakpoint(){const e=this;return e.collapsedBreakpointDisabled=!0,e.setCollapsedBreakpoint(),e}toggleCollapsedBreakpoint(){const e=this;return e.collapsedBreakpointDisabled=!e.collapsedBreakpointDisabled,e.setCollapsedBreakpoint(),e}setCollapsedBreakpoint(e){void 0===e&&(e=!0);const a=this,n=a.app;a.collapsedBreakpointResizeHandler||(a.collapsedBreakpointResizeHandler=function(){a.setCollapsedBreakpoint()},n.on("resize",a.collapsedBreakpointResizeHandler));const{$el:t,params:s,collapsedBreakpointDisabled:l}=a;if(t.hasClass("panel-in-breakpoint"))return;const i=s.collapsedBreakpoint,o=t.hasClass("panel-in-collapsed");n.width>=i&&null!=i&&!l?o||(a.setStateClasses("closed"),t.addClass("panel-in-collapsed").removeClass("panel-in"),a.collapsed=!0,n.allowPanelOpen=!0,e&&(a.emit("local::collapsedBreakpoint panelCollapsedBreakpoint",a),a.$el.trigger("panel:collapsedbreakpoint"))):o&&(t.removeClass("panel-in-collapsed panel-in"),a.collapsed=!1,e&&(a.emit("local::collapsedBreakpoint panelCollapsedBreakpoint",a),a.$el.trigger("panel:collapsedbreakpoint")))}enableResizable(){const e=this;return e.resizableInitialized?(e.resizable=!0,e.$el.addClass("panel-resizable")):d(e),e}disableResizable(){const e=this;return e.resizable=!1,e.$el.removeClass("panel-resizable"),e}enableSwipe(){const e=this;return e.swipeInitialized?e.swipeable=!0:function(e){const a=e.app;if(e.swipeInitialized)return;i(e,{swipeable:!0,swipeInitialized:!0});const t=e.params,{$el:s,$backdropEl:l,side:p,effect:d}=e;let c,h,f,b,g,v;const u={};let m,w,C,k,$,z,B,E=0;function y(s){if(!e.swipeable||f)return;if(!a.panel.allowOpen||!t.swipe&&!t.swipeOnlyClose||h)return;if(n(".modal-in:not(.toast):not(.notification), .photo-browser-in").length>0)return;c=a.panel.get("left"===p?"right":"left")||{};const l=c.opened&&c.$el&&!c.$el.hasClass("panel-in-breakpoint");if((e.opened||!l)&&(t.swipeOnlyClose||!l)&&(!s.target||"input"!==s.target.nodeName.toLowerCase()||"range"!==s.target.type)&&!(n(s.target).closest(".range-slider, .tabs-swipeable-wrap, .calendar-months, .no-swipe-panel, .card-opened").length>0)&&(u.x="touchstart"===s.type?s.targetTouches[0].pageX:s.pageX,u.y="touchstart"===s.type?s.targetTouches[0].pageY:s.pageY,!t.swipeOnlyClose||e.opened)){if(t.swipeActiveArea&&!e.opened){if("left"===p&&u.x>t.swipeActiveArea)return;if("right"===p&&u.x<a.width-t.swipeActiveArea)return}E=0,B=n(e.getViewEl()),b=!1,h=!0,g=void 0,v=!1,m=o(),z=void 0}}function x(n){if(!h||f||v)return;if(E+=1,E<2)return;if(n.f7PreventSwipePanel||a.preventSwipePanelBySwipeBack||a.preventSwipePanel)return void(h=!1);const i="touchmove"===n.type?n.targetTouches[0].pageX:n.pageX,o="touchmove"===n.type?n.targetTouches[0].pageY:n.pageY;if(void 0===g&&(g=!!(g||Math.abs(o-u.y)>Math.abs(i-u.x))),g)return void(h=!1);if(!z){if(z=i>u.x?"to-right":"to-left",t.swipeActiveArea>0&&!e.opened){if("left"===p&&u.x>t.swipeActiveArea)return void(h=!1);if("right"===p&&u.x<a.width-t.swipeActiveArea)return void(h=!1)}if(s.hasClass("panel-in-breakpoint"))return void(h=!1);if("left"===p&&"to-left"===z&&!s.hasClass("panel-in")||"right"===p&&"to-right"===z&&!s.hasClass("panel-in"))return void(h=!1)}let r=e.opened?0:-t.swipeThreshold;"right"===p&&(r=-r),b||(e.opened||(e.insertToRoot(),s.addClass("panel-in-swipe"),l.css("visibility","visible"),s.trigger("panel:swipeopen"),e.emit("local::swipeOpen panelSwipeOpen",e)),$=s[0].offsetWidth,"reveal"===d&&s.hasClass("panel-in-collapsed")&&($-=parseFloat(B.css(`margin-${p}`))),s.transition(0)),b=!0,n.cancelable&&n.preventDefault(),w=i-u.x+r,"right"===p?"cover"===d||"push"===d?(C=w+(e.opened?0:$),C<0&&(C=0),C>$&&(C=$)):(C=w-(e.opened?$:0),C>0&&(C=0),C<-$&&(C=-$)):(C=w+(e.opened?$:0),C<0&&(C=0),C>$&&(C=$));const c=Math.abs(C/$);if("reveal"===d)t.swipeNoFollow||(B.transform(`translate3d(${C}px,0,0)`).transition(0),l.transform(`translate3d(${C}px,0,0)`).transition(0)),s.trigger("panel:swipe",Math.abs(C/$)),e.emit("local::swipe panelSwipe",e,Math.abs(C/$));else{if("left"===p&&(C-=$),!t.swipeNoFollow&&(l.transition(0),k=1-Math.abs(C/$),l.css({opacity:k}),s.transform(`translate3d(${C}px,0,0)`).transition(0),"push"===d)){const e="left"===p?C+$:C-$;B.transform(`translate3d(${e}px,0,0)`).transition(0),l.transform(`translate3d(${e}px,0,0)`).transition(0)}s.trigger("panel:swipe",Math.abs(C/$)),e.emit("local::swipe panelSwipe",e,Math.abs(C/$))}t.swipeNoFollow&&(e.opened&&0===c||!e.opened&&1===c)&&(v=!0,O(n))}function O(a){if(!h||!b)return h=!1,void(b=!1);const n="gesturestart"===a.type||f;h=!1,b=!1;const i=(new Date).getTime()-m;let o;const c=(0===C||Math.abs(C)===$)&&!t.swipeNoFollow,g=t.swipeThreshold||0;o=n?"reset":e.opened?"cover"===d||"push"===d?0===C?"reset":i<300&&Math.abs(C)>0?"swap":i>=300&&Math.abs(C)<$/2?"reset":"swap":C===-$?"reset":i<300&&Math.abs(C)>=0||i>=300&&Math.abs(C)<=$/2?"left"===p&&C===$?"reset":"swap":"reset":Math.abs(w)<g?"reset":"cover"===d||"push"===d?0===C||i<300&&Math.abs(C)>0||i>=300&&Math.abs(C)<$/2?"swap":"reset":0===C?"reset":i<300&&Math.abs(C)>0||i>=300&&Math.abs(C)>=$/2?"swap":"reset","swap"===o&&(e.opened?e.close(!c):e.open(!c));let v=!0;if("reset"===o&&!e.opened)if(c)s.removeClass("panel-in-swipe");else{v=!1;const a="reveal"===d?B:s;e.setStateClasses("before-closing"),a.transitionEnd((()=>{s.hasClass("panel-in")||(s.removeClass("panel-in-swipe"),e.setStateClasses("after-closing"))}))}"reveal"!==d&&"push"!==d||r((()=>{B.transition(""),B.transform("")})),v&&s.removeClass("panel-in-swipe"),s.transition("").transform(""),l.transform("").transition("").css({opacity:"",visibility:""})}function M(e){f=!0,O(e)}function N(){f=!1}a.on("touchstart:passive",y),a.on("touchmove:active",x),a.on("touchend:passive",O),a.on("gesturestart",M),a.on("gestureend",N),e.on("panelDestroy",(()=>{a.off("touchstart:passive",y),a.off("touchmove:active",x),a.off("touchend:passive",O),a.off("gesturestart",M),a.off("gestureend",N)}))}(e),e}disableSwipe(){return this.swipeable=!1,this}onOpen(e){void 0===e&&(e=!0);const a=this,n=a.app;a.opened=!0,n.panel.allowOpen=!1,a.$el.trigger("panel:beforeopen"),a.emit("local::beforeOpen panelBeforeOpen",a),e&&a.setStateClasses("open"),a.$el.trigger("panel:open"),a.emit("local::open panelOpen",a)}onOpened(){const e=this;e.app.panel.allowOpen=!0,e.$el.trigger("panel:opened"),e.emit("local::opened panelOpened",e)}onClose(){const e=this,a=e.app;e.opened=!1,a.panel.allowOpen=!1,e.$el.trigger("panel:beforeclose"),e.emit("local::beforeClose panelBeforeClose",e),e.setStateClasses("closing"),e.$el.trigger("panel:close"),e.emit("local::close panelClose",e)}onClosed(){const e=this,a=e.app;if(a.panel.allowOpen=!0,e.setStateClasses("after-closing"),e.$el.removeClass("panel-out"),e.$backdropEl){const n=a.panel.get(".panel-in");(!n||n&&!n.$backdropEl)&&e.$backdropEl.removeClass("panel-backdrop-in")}e.$el.trigger("panel:closed"),e.emit("local::closed panelClosed",e)}toggle(e){void 0===e&&(e=!0);const a=this,n=a.params.visibleBreakpoint;return a.app.width>=n&&null!=n?a.toggleVisibleBreakpoint():(a.opened?a.close(e):a.open(e),a)}insertToRoot(){const e=this,a=getDocument(),{$el:n,$backdropEl:t,$containerEl:s}=e,l=n.parent(),i=n.parents(a).length>0;if(!l.is(s)||n.prevAll(".views, .view").length){const a=s.children(".panel, .views, .view").eq(0),o=s.children(".panel-backdrop").eq(0);a.length?n.insertBefore(a):o?n.insertBefore(o):s.prepend(n),t&&t.length&&(!t.parent().is(s)&&0===t.nextAll(".panel").length||t.parent().is(s)&&0===t.nextAll(".panel").length)&&t.insertBefore(n),e.once("panelClosed",(()=>{i?l.append(n):n.remove()}))}}open(e){void 0===e&&(e=!0);const a=this,t=a.app;if(!t.panel.allowOpen)return!1;const{effect:s,$el:l,$backdropEl:i,opened:o,$containerEl:r}=a;if(!l||l.hasClass("panel-in"))return a;if(a.insertToRoot(),o||l.hasClass("panel-in-breakpoint")||l.hasClass("panel-in"))return!1;const p=t.panel.get(".panel-in");p&&p!==a&&p.close(e),l[e?"removeClass":"addClass"]("not-animated"),l.addClass("panel-in"),i&&(i.addClass("panel-backdrop-in"),i[e?"removeClass":"addClass"]("not-animated")),"cover"!==a.effect&&"push"!==a.effect||(a._clientLeft=l[0].clientLeft);const d=n(a.getViewEl());r&&r.hasClass("page")&&d.add(r.children(".page-content, .tabs"));const c="reveal"===s?d:l;return e?(i&&i.removeClass("not-animated"),function e(){c.transitionEnd((t=>{n(t.target).is(c)?l.hasClass("panel-out")?a.onClosed():a.onOpened():e()}))}(),l.removeClass("panel-out not-animated").addClass("panel-in"),a.onOpen()):(i&&i.addClass("not-animated"),l.removeClass("panel-out").addClass("panel-in not-animated"),a.onOpen(),a.onOpened()),!0}close(e){void 0===e&&(e=!0);const a=this,{effect:t,$el:s,$backdropEl:l,opened:i,$containerEl:o}=a;if(!i||s.hasClass("panel-in-breakpoint")||!s.hasClass("panel-in"))return a;s[e?"removeClass":"addClass"]("not-animated"),l&&l[e?"removeClass":"addClass"]("not-animated");const r=n(a.getViewEl());o&&o.hasClass("page")&&r.add(o.children(".page-content, .tabs"));return e?(("reveal"===t?r:s).transitionEnd((()=>{s.hasClass("panel-out")?a.onClosed():s.hasClass("panel-in")&&a.onOpened(),a.setStateClasses("after-closing")})),s.removeClass("panel-in").addClass("panel-out"),a.onClose()):(s.addClass("not-animated").removeClass("panel-in").addClass("panel-out"),a.onClose(),a.onClosed()),a}init(){const e=this;void 0!==e.params.visibleBreakpoint&&e.setVisibleBreakpoint(),void 0!==e.params.collapsedBreakpoint&&e.setCollapsedBreakpoint(),e.params.swipe&&e.enableSwipe(),e.resizable&&e.enableResizable()}destroy(){let e=this;const a=e.app,{$containerEl:t}=e;if(e.$el){if(e.emit("local::beforeDestroy panelBeforeDestroy",e),e.$el.trigger("panel:beforedestroy"),e.visibleBreakpointResizeHandler&&a.off("resize",e.visibleBreakpointResizeHandler),e.collapsedBreakpointResizeHandler&&a.off("resize",e.collapsedBreakpointResizeHandler),e.$el.hasClass("panel-in-breakpoint")||e.$el.hasClass("panel-in-collapsed")){const a=n(e.getViewEl());t&&t.hasClass("page")&&a.add(t.children(".page-content, .tabs")),e.$el.removeClass("panel-in-breakpoint panel-in-collapsed panel-in"),a.css({[`margin-${e.side}`]:""}),e.emit("local::breakpoint panelBreakpoint",e),e.$el.trigger("panel:breakpoint")}e.$el.trigger("panel:destroy"),e.emit("local::destroy panelDestroy",e),e.el&&(e.el.f7Panel=null,delete e.el.f7Panel),p(e),e=null}}}var h={name:"panel",params:{panel:{opened:void 0,side:void 0,effect:void 0,resizable:void 0,backdrop:!0,backdropEl:void 0,visibleBreakpoint:void 0,collapsedBreakpoint:void 0,swipe:!1,swipeNoFollow:!1,swipeOnlyClose:!1,swipeActiveArea:0,swipeThreshold:0,closeByBackdropClick:!0,containerEl:void 0}},static:{Panel:c},create(){const e=this;i(e,{panel:{allowOpen:!0,create:a=>new c(e,a),get(e){if(void 0===e&&(e=".panel"),e instanceof c)return e;"left"!==e&&"right"!==e||(e=`.panel-${e}`);const a=n(e);return 0===a.length||a.length>1?void 0:a[0].f7Panel},destroy(a){void 0===a&&(a=".panel");const n=e.panel.get(a);if(n&&n.destroy)return n.destroy()},open(a,n){void 0===a&&(a=".panel"),"left"!==a&&"right"!==a||(a=`.panel-${a}`);let t=e.panel.get(a);return t&&t.open?t.open(n):t?void 0:(t=e.panel.create({el:a}),t.open(n))},close(a,n){void 0===a&&(a=".panel-in"),"left"!==a&&"right"!==a||(a=`.panel-${a}`);let t=e.panel.get(a);return t&&t.open?t.close(n):t?void 0:(t=e.panel.create({el:a}),t.close(n))},toggle(a,n){void 0===a&&(a=".panel"),"left"!==a&&"right"!==a||(a=`.panel-${a}`);let t=e.panel.get(a);return t&&t.toggle?t.toggle(n):t?void 0:(t=e.panel.create({el:a}),t.toggle(n))}}})},on:{init(){const e=this;n(".panel-init").each((a=>{const t=Object.assign({el:a},n(a).dataset()||{});e.panel.create(t)}))},pageInit(e){const a=this;e.$el.find(".panel-init").each((e=>{const t=Object.assign({el:e},n(e).dataset()||{});a.panel.create(t)}))},pageBeforeRemove(e){const a=this;e.$el.find(".panel-init").each((e=>{const n=a.panel.get(e);n&&n.destroy&&n.destroy()}))}},vnode:{"panel-init":{insert(e){const a=e.elm,t=Object.assign({el:a},n(a).dataset()||{});this.panel.create(t)},destroy(e){const a=e.elm,n=this.panel.get(a);n&&n.destroy&&n.destroy()}}},clicks:{".panel-open":function(e,a){void 0===a&&(a={});this.panel.open(a.panel,a.animate)},".panel-close":function(e,a){void 0===a&&(a={});this.panel.close(a.panel,a.animate)},".panel-toggle":function(e,a){void 0===a&&(a={});this.panel.toggle(a.panel,a.animate)},".panel-backdrop":function(){const e=this,a=n(".panel-in:not(.panel-out)");if(!a.length)return;const t=a[0]&&a[0].f7Panel;a.trigger("panel:backdrop-click"),t&&t.emit("backdropClick",t),e.emit("panelBackdropClick",t||a[0]),e.params.panel.closeByBackdropClick&&e.panel.close()}}};if(a){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))
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import $ from '../../shared/dom7';
|
|
2
|
-
import { extend, nextFrame } from '../../shared/utils';
|
|
3
|
-
import { getSupport } from '../../shared/get-support';
|
|
1
|
+
import $ from '../../shared/dom7.js';
|
|
2
|
+
import { extend, nextFrame } from '../../shared/utils.js';
|
|
3
|
+
import { getSupport } from '../../shared/get-support.js';
|
|
4
4
|
|
|
5
5
|
function resizablePanel(panel) {
|
|
6
6
|
const app = panel.app;
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
/* eslint indent: ["off"] */
|
|
2
2
|
import { getWindow } from 'ssr-window';
|
|
3
|
-
import $ from '../../shared/dom7';
|
|
4
|
-
import { extend, now, nextTick, deleteProps } from '../../shared/utils';
|
|
5
|
-
import Framework7Class from '../../shared/class';
|
|
3
|
+
import $ from '../../shared/dom7.js';
|
|
4
|
+
import { extend, now, nextTick, deleteProps } from '../../shared/utils.js';
|
|
5
|
+
import Framework7Class from '../../shared/class.js';
|
|
6
6
|
/** @jsx $jsx */
|
|
7
7
|
|
|
8
|
-
import $jsx from '../../shared/$jsx';
|
|
8
|
+
import $jsx from '../../shared/$jsx.js';
|
|
9
9
|
|
|
10
10
|
class PhotoBrowser extends Framework7Class {
|
|
11
|
-
constructor(app, params
|
|
11
|
+
constructor(app, params) {
|
|
12
|
+
if (params === void 0) {
|
|
13
|
+
params = {};
|
|
14
|
+
}
|
|
15
|
+
|
|
12
16
|
super(params, [app]);
|
|
13
17
|
const pb = this;
|
|
14
18
|
pb.app = app;
|
|
@@ -372,35 +376,65 @@ class PhotoBrowser extends Framework7Class {
|
|
|
372
376
|
pb.emit('local::doubleClick', e);
|
|
373
377
|
},
|
|
374
378
|
|
|
375
|
-
slideChange(
|
|
379
|
+
slideChange() {
|
|
376
380
|
const swiper = this;
|
|
377
381
|
pb.onSlideChange(swiper);
|
|
382
|
+
|
|
383
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
384
|
+
args[_key] = arguments[_key];
|
|
385
|
+
}
|
|
386
|
+
|
|
378
387
|
pb.emit('local::slideChange', ...args);
|
|
379
388
|
},
|
|
380
389
|
|
|
381
|
-
transitionStart(
|
|
390
|
+
transitionStart() {
|
|
391
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
392
|
+
args[_key2] = arguments[_key2];
|
|
393
|
+
}
|
|
394
|
+
|
|
382
395
|
pb.emit('local::transitionStart', ...args);
|
|
383
396
|
},
|
|
384
397
|
|
|
385
|
-
transitionEnd(
|
|
398
|
+
transitionEnd() {
|
|
399
|
+
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
400
|
+
args[_key3] = arguments[_key3];
|
|
401
|
+
}
|
|
402
|
+
|
|
386
403
|
pb.emit('local::transitionEnd', ...args);
|
|
387
404
|
},
|
|
388
405
|
|
|
389
|
-
slideChangeTransitionStart(
|
|
406
|
+
slideChangeTransitionStart() {
|
|
390
407
|
const swiper = this;
|
|
391
408
|
pb.onSlideChange(swiper);
|
|
409
|
+
|
|
410
|
+
for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
|
|
411
|
+
args[_key4] = arguments[_key4];
|
|
412
|
+
}
|
|
413
|
+
|
|
392
414
|
pb.emit('local::slideChangeTransitionStart', ...args);
|
|
393
415
|
},
|
|
394
416
|
|
|
395
|
-
slideChangeTransitionEnd(
|
|
417
|
+
slideChangeTransitionEnd() {
|
|
418
|
+
for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
|
|
419
|
+
args[_key5] = arguments[_key5];
|
|
420
|
+
}
|
|
421
|
+
|
|
396
422
|
pb.emit('local::slideChangeTransitionEnd', ...args);
|
|
397
423
|
},
|
|
398
424
|
|
|
399
|
-
lazyImageLoad(
|
|
425
|
+
lazyImageLoad() {
|
|
426
|
+
for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
|
|
427
|
+
args[_key6] = arguments[_key6];
|
|
428
|
+
}
|
|
429
|
+
|
|
400
430
|
pb.emit('local::lazyImageLoad', ...args);
|
|
401
431
|
},
|
|
402
432
|
|
|
403
|
-
lazyImageReady(
|
|
433
|
+
lazyImageReady() {
|
|
434
|
+
for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
|
|
435
|
+
args[_key7] = arguments[_key7];
|
|
436
|
+
}
|
|
437
|
+
|
|
404
438
|
const slideEl = args[0];
|
|
405
439
|
$(slideEl).removeClass('photo-browser-slide-lazy');
|
|
406
440
|
pb.emit('local::lazyImageReady', ...args);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import PhotoBrowser from './photo-browser-class';
|
|
2
|
-
import ConstructorMethods from '../../shared/constructor-methods';
|
|
1
|
+
import PhotoBrowser from './photo-browser-class.js';
|
|
2
|
+
import ConstructorMethods from '../../shared/constructor-methods.js';
|
|
3
3
|
export default {
|
|
4
4
|
name: 'photoBrowser',
|
|
5
5
|
params: {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(function framework7ComponentLoader(e,o){void 0===o&&(o=!0);var r=e.$,a=e.utils,s=(e.getDevice,e.getSupport,e.Class),t=(e.Modal,e.ConstructorMethods),p=(e.ModalMethods,a.extend),n=a.now,i=a.nextTick,l=a.deleteProps;class d extends s{constructor(e,o){void 0===o&&(o={}),super(o,[e]);const r=this;r.app=e;const a=p({on:{}},e.params.photoBrowser);r.useModulesParams(a),r.params=p(a,o),p(r,{exposed:!1,opened:!1,activeIndex:r.params.swiper.initialSlide,url:r.params.url,swipeToClose:{allow:!0,isTouched:!1,diff:void 0,start:void 0,current:void 0,started:!1,activeSlide:void 0,timeStart:void 0}}),r.useModules(),r.init()}get view(){const{params:e,app:o}=this;return e.view||o.views.main}onSlideChange(e){const o=this;o.activeIndex=e.activeIndex;let a=e.activeIndex+1,s=o.params.virtualSlides?o.params.photos.length:e.slides.length;e.params.loop&&(s-=2,a-=e.loopedSlides,a<1&&(a=s+a),a>s&&(a-=s));const t=o.params.virtualSlides?e.$wrapperEl.find(`.swiper-slide[data-swiper-slide-index="${e.activeIndex}"]`):e.slides.eq(e.activeIndex),p=o.params.virtualSlides?e.$wrapperEl.find(`.swiper-slide[data-swiper-slide-index="${e.previousIndex}"]`):e.slides.eq(e.previousIndex);let n,i=o.$el.find(".photo-browser-current"),l=o.$el.find(".photo-browser-total");if("page"===o.params.type&&o.params.navbar&&0===i.length&&"ios"===o.app.theme&&(n=o.app.navbar.getElByPage(o.$el),n&&(i=r(n).find(".photo-browser-current"),l=r(n).find(".photo-browser-total"))),i.length&&l.length&&(i.text(a),l.text(s),n||(n=i.parents(".navbar")[0]),n&&o.app.navbar.size(n)),o.captions.length>0){const r=e.params.loop?t.attr("data-swiper-slide-index"):o.activeIndex;o.$captionsContainerEl.find(".photo-browser-caption-active").removeClass("photo-browser-caption-active"),o.$captionsContainerEl.find(`[data-caption-index="${r}"]`).addClass("photo-browser-caption-active")}const d=p.find("video");d.length>0&&"pause"in d[0]&&d[0].pause()}onTouchStart(){const e=this.swipeToClose;e.allow&&(e.isTouched=!0)}onTouchMove(e){const o=this,r=o.swipeToClose;r.isTouched&&(r.started||(r.started=!0,r.start="touchmove"===e.type?e.targetTouches[0].pageY:e.pageY,o.params.virtualSlides?r.activeSlide=o.swiper.$wrapperEl.children(".swiper-slide-active"):r.activeSlide=o.swiper.slides.eq(o.swiper.activeIndex),r.timeStart=n()),e.preventDefault(),r.current="touchmove"===e.type?e.targetTouches[0].pageY:e.pageY,r.diff=r.start-r.current,o.$el.transition(0).transform(`translate3d(0,${-r.diff}px,0)`))}onTouchEnd(){const e=this,o=e.swipeToClose;if(o.isTouched=!1,!o.started)return void(o.started=!1);o.started=!1,o.allow=!1;const r=Math.abs(o.diff),a=(new Date).getTime()-o.timeStart;a<300&&r>20||a>=300&&r>100?i((()=>{e.$el&&(o.diff<0?e.$el.addClass("swipe-close-to-bottom"):e.$el.addClass("swipe-close-to-top")),e.emit("local::swipeToClose",e),e.$el.transform("").transition(""),e.close(),o.allow=!0})):(0!==r?e.$el.addClass("photo-browser-transitioning").transitionEnd((()=>{o.allow=!0,e.$el.removeClass("photo-browser-transitioning")})):o.allow=!0,i((()=>{e.$el.transform("").transition("")})))}renderNavbar(){const e=this;if(e.params.renderNavbar)return e.params.renderNavbar.call(e);let o=e.params.iconsColor;e.params.iconsColor||"dark"!==e.params.theme||(o="white");const r="ios"!==e.app.theme&&"aurora"!==e.app.theme||!e.params.pageBackLinkText?"":e.params.pageBackLinkText,a=void 0===e.params.navbarShowCount?e.params.photos.length>1:e.params.navbarShowCount,s="page"!==e.params.type;return $jsx("div",{class:"navbar navbar-photo-browser "+("dark"===e.params.theme?"navbar-photo-browser-dark":"")},$jsx("div",{class:"navbar-bg"}),$jsx("div",{class:"navbar-inner navbar-inner-centered-title sliding"},!s&&$jsx("div",{class:"left"},$jsx("a",{class:`link ${r?"":"icon-only"} back`},$jsx("i",{class:"icon icon-back "+(o?`color-${o}`:"")}),r&&$jsx("span",null,r))),a&&$jsx("div",{class:"title"},$jsx("span",{class:"photo-browser-current"}),$jsx("span",{class:"photo-browser-of"},e.params.navbarOfText),$jsx("span",{class:"photo-browser-total"})),s&&$jsx("div",{class:"right"},$jsx("a",{class:"link popup-close","data-popup":".photo-browser-popup"},$jsx("span",null,e.params.popupCloseLinkText)))))}renderToolbar(){const e=this;if(e.params.renderToolbar)return e.params.renderToolbar.call(e);let o=e.params.iconsColor;return e.params.iconsColor||"dark"!==e.params.theme||(o="white"),$jsx("div",{class:"toolbar toolbar-bottom tabbar"},$jsx("div",{class:"toolbar-inner"},$jsx("a",{class:"link photo-browser-prev"},$jsx("i",{class:"icon icon-back "+(o?`color-${o}`:"")})),$jsx("a",{class:"link photo-browser-next"},$jsx("i",{class:"icon icon-forward "+(o?`color-${o}`:"")}))))}renderCaption(e,o){const r=this;return r.params.renderCaption?r.params.renderCaption.call(r,e,o):$jsx("div",{class:"photo-browser-caption","data-caption-index":o},e)}renderObject(e,o){const r=this;return r.params.renderObject?r.params.renderObject.call(r,e,o):$jsx("div",{class:"photo-browser-slide photo-browser-object-slide swiper-slide","data-swiper-slide-index":o},e.html?e.html:e)}renderLazyPhoto(e,o){const r=this;return r.params.renderLazyPhoto?r.params.renderLazyPhoto.call(r,e,o):$jsx("div",{class:"photo-browser-slide photo-browser-slide-lazy swiper-slide","data-swiper-slide-index":o},$jsx("div",{class:"swiper-lazy-preloader"}),$jsx("span",{class:"swiper-zoom-container"},$jsx("img",{"data-src":e.url?e.url:e,class:"swiper-lazy"})))}renderPhoto(e,o){const r=this;return r.params.renderPhoto?r.params.renderPhoto.call(r,e,o):$jsx("div",{class:"photo-browser-slide swiper-slide","data-swiper-slide-index":o},$jsx("span",{class:"swiper-zoom-container"},$jsx("img",{src:e.url?e.url:e})))}render(){const e=this;return e.params.render?e.params.render.call(e,e.params):$jsx("div",{class:`photo-browser photo-browser-${e.params.theme}`},$jsx("div",{class:"view"},$jsx("div",{class:`page photo-browser-page photo-browser-page-${e.params.theme} no-toolbar ${e.params.navbar?"":"no-navbar"}`,"data-name":"photo-browser-page"},e.params.navbar&&e.renderNavbar(),e.params.toolbar&&e.renderToolbar(),$jsx("div",{class:`photo-browser-captions photo-browser-captions-${e.params.captionsTheme||e.params.theme}`},e.params.photos.map(((o,r)=>o.caption?e.renderCaption(o.caption,r):""))),$jsx("div",{class:"photo-browser-swiper-container swiper"},$jsx("div",{class:"photo-browser-swiper-wrapper swiper-wrapper"},!e.params.virtualSlides&&e.params.photos.map(((o,r)=>o.html||("string"==typeof o||o instanceof String)&&o.indexOf("<")>=0&&o.indexOf(">")>=0?e.renderObject(o,r):!0===e.params.swiper.lazy||e.params.swiper.lazy&&e.params.swiper.lazy.enabled?e.renderLazyPhoto(o,r):e.renderPhoto(o,r))))))))}renderStandalone(){const e=this;if(e.params.renderStandalone)return e.params.renderStandalone.call(e);return`<div class="popup photo-browser-popup photo-browser-standalone popup-tablet-fullscreen">${e.render()}</div>`}renderPage(){const e=this;if(e.params.renderPage)return e.params.renderPage.call(e);return e.render()}renderPopup(){const e=this;if(e.params.renderPopup)return e.params.renderPopup.call(e);return`<div class="popup photo-browser-popup">${e.render()}</div>`}onOpen(e,o){const a=this,s=a.app,t=r(o);let n;t[0].f7PhotoBrowser=a,a.$el=t,a.el=t[0],a.openedIn=e,a.opened=!0,a.$swiperContainerEl=a.$el.find(".photo-browser-swiper-container"),a.$swiperWrapperEl=a.$el.find(".photo-browser-swiper-wrapper"),a.slides=a.$el.find(".photo-browser-slide"),a.$captionsContainerEl=a.$el.find(".photo-browser-captions"),a.captions=a.$el.find(".photo-browser-caption");const i=p({},a.params.swiper,{initialSlide:a.activeIndex,cssMode:!(void 0!==a.params.swiper.cssMode||!s.device.ios&&!s.device.android)||a.params.swiper.cssMode,on:{click(e){clearTimeout(n),a.params.exposition&&(n=setTimeout((()=>{a.expositionToggle()}),350)),a.emit("local::tap",e),a.emit("local::click",e)},doubleClick(e){clearTimeout(n),a.emit("local::doubleTap",e),a.emit("local::doubleClick",e)},slideChange(){a.onSlideChange(this);for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::slideChange",...o)},transitionStart(){for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::transitionStart",...o)},transitionEnd(){for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::transitionEnd",...o)},slideChangeTransitionStart(){a.onSlideChange(this);for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::slideChangeTransitionStart",...o)},slideChangeTransitionEnd(){for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::slideChangeTransitionEnd",...o)},lazyImageLoad(){for(var e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];a.emit("local::lazyImageLoad",...o)},lazyImageReady(){for(var e=arguments.length,o=new Array(e),s=0;s<e;s++)o[s]=arguments[s];const t=o[0];r(t).removeClass("photo-browser-slide-lazy"),a.emit("local::lazyImageReady",...o)}}});a.params.swipeToClose&&"page"!==a.params.type&&p(i.on,{touchStart(e,o){a.onTouchStart(o),a.emit("local::touchStart",o)},touchMoveOpposite(e,o){a.onTouchMove(o),a.emit("local::touchMoveOpposite",o)},touchEnd(e,o){a.onTouchEnd(o),a.emit("local::touchEnd",o)}}),a.params.virtualSlides&&p(i,{virtual:{slides:a.params.photos,renderSlide:(e,o)=>e.html||("string"==typeof e||e instanceof String)&&e.indexOf("<")>=0&&e.indexOf(">")>=0?a.renderObject(e,o):!0===a.params.swiper.lazy||a.params.swiper.lazy&&a.params.swiper.lazy.enabled?a.renderLazyPhoto(e,o):a.renderPhoto(e,o)}});const l=getWindow();a.swiper=s.swiper?s.swiper.create(a.$swiperContainerEl,i):new l.Swiper(a.$swiperContainerEl,i),0===a.activeIndex&&a.onSlideChange(a.swiper),a.$el&&a.$el.trigger("photobrowser:open"),a.emit("local::open photoBrowserOpen",a)}onOpened(){const e=this;e.$el&&"standalone"===e.params.type&&e.$el.css("animation","none"),e.$el&&e.$el.trigger("photobrowser:opened"),e.emit("local::opened photoBrowserOpened",e)}onClose(){const e=this;e.destroyed||(e.swiper&&e.swiper.destroy&&(e.swiper.destroy(!0,!1),e.swiper=null,delete e.swiper),e.$el&&e.$el.trigger("photobrowser:close"),e.emit("local::close photoBrowserClose",e))}onClosed(){const e=this;e.destroyed||(e.opened=!1,e.$el=null,e.el=null,delete e.$el,delete e.el,e.$el&&e.$el.trigger("photobrowser:closed"),e.emit("local::closed photoBrowserClosed",e))}openPage(){const e=this;if(e.opened)return e;const o=e.renderPage();return e.view.router.navigate({url:e.url,route:{content:o,path:e.url,on:{pageBeforeIn(o,r){e.view.$el.addClass(`with-photo-browser-page with-photo-browser-page-${e.params.theme}`),e.onOpen("page",r.el)},pageAfterIn(o,r){e.onOpened("page",r.el)},pageBeforeOut(o,r){e.view.$el.removeClass(`with-photo-browser-page with-photo-browser-page-exposed with-photo-browser-page-${e.params.theme}`),e.onClose("page",r.el)},pageAfterOut(o,r){e.onClosed("page",r.el)}}}}),e}openStandalone(){const e=this;if(e.opened)return e;const o={backdrop:!1,content:e.renderStandalone(),on:{popupOpen(o){e.onOpen("popup",o.el)},popupOpened(o){e.onOpened("popup",o.el)},popupClose(o){e.onClose("popup",o.el)},popupClosed(o){e.onClosed("popup",o.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popup:o}}):e.modal=e.app.popup.create(o).open(),e}openPopup(){const e=this;if(e.opened)return e;const o={content:e.renderPopup(),push:e.params.popupPush,on:{popupOpen(o){e.onOpen("popup",o.el)},popupOpened(o){e.onOpened("popup",o.el)},popupClose(o){e.onClose("popup",o.el)},popupClosed(o){e.onClosed("popup",o.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popup:o}}):e.modal=e.app.popup.create(o).open(),e}expositionEnable(){const e=this;return"page"===e.params.type&&e.view.$el.addClass("with-photo-browser-page-exposed"),e.$el&&e.$el.addClass("photo-browser-exposed"),e.params.expositionHideCaptions&&e.$captionsContainerEl.addClass("photo-browser-captions-exposed"),e.exposed=!0,e}expositionDisable(){const e=this;return"page"===e.params.type&&e.view.$el.removeClass("with-photo-browser-page-exposed"),e.$el&&e.$el.removeClass("photo-browser-exposed"),e.params.expositionHideCaptions&&e.$captionsContainerEl.removeClass("photo-browser-captions-exposed"),e.exposed=!1,e}expositionToggle(){const e=this;return"page"===e.params.type&&e.view.$el.toggleClass("with-photo-browser-page-exposed"),e.$el&&e.$el.toggleClass("photo-browser-exposed"),e.params.expositionHideCaptions&&e.$captionsContainerEl.toggleClass("photo-browser-captions-exposed"),e.exposed=!e.exposed,e}open(e){const o=this,r=o.params.type;return o.opened?(o.swiper&&void 0!==e&&o.swiper.slideTo(parseInt(e,10)),o):(void 0!==e&&(o.activeIndex=e),"standalone"===r&&o.openStandalone(),"page"===r&&o.openPage(),"popup"===r&&o.openPopup(),o)}close(){const e=this;return e.opened?(e.params.routableModals&&e.view||"page"===e.openedIn?e.view.router.back():(e.modal.once("modalClosed",(()=>{i((()=>{e.destroyed||(e.modal.destroy(),delete e.modal)}))})),e.modal.close()),e):e}init(){}destroy(){let e=this;e.emit("local::beforeDestroy photoBrowserBeforeDestroy",e),e.$el&&(e.$el.trigger("photobrowser:beforedestroy"),e.$el[0].f7PhotoBrowser=null,delete e.$el[0].f7PhotoBrowser),l(e),e.destroyed=!0,e=null}}var c={name:"photoBrowser",params:{photoBrowser:{photos:[],exposition:!0,expositionHideCaptions:!1,type:"standalone",navbar:!0,toolbar:!0,theme:"light",captionsTheme:void 0,iconsColor:void 0,popupPush:!1,swipeToClose:!0,pageBackLinkText:"Back",popupCloseLinkText:"Close",navbarOfText:"of",navbarShowCount:void 0,view:void 0,url:"photos/",routableModals:!1,virtualSlides:!0,renderNavbar:void 0,renderToolbar:void 0,renderCaption:void 0,renderObject:void 0,renderLazyPhoto:void 0,renderPhoto:void 0,renderPage:void 0,renderPopup:void 0,renderStandalone:void 0,swiper:{initialSlide:0,spaceBetween:20,speed:300,loop:!1,preloadImages:!0,keyboard:{enabled:!0},navigation:{nextEl:".photo-browser-next",prevEl:".photo-browser-prev"},zoom:{enabled:!0,maxRatio:3,minRatio:1},lazy:{enabled:!0}}}},create(){this.photoBrowser=t({defaultSelector:".photo-browser-popup, .photo-browser-page",constructor:d,app:this,domProp:"f7PhotoBrowser"})},static:{PhotoBrowser:d}};if(o){if(e.prototype.modules&&e.prototype.modules[c.name])return;e.use(c),e.instance&&(e.instance.useModuleParams(c,e.instance.params),e.instance.useModule(c))}return c}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
|
|
@@ -1,15 +1,19 @@
|
|
|
1
1
|
import { getWindow } from 'ssr-window';
|
|
2
|
-
import $ from '../../shared/dom7';
|
|
3
|
-
import { extend, nextTick, deleteProps } from '../../shared/utils';
|
|
4
|
-
import Framework7Class from '../../shared/class';
|
|
5
|
-
import { getDevice } from '../../shared/get-device';
|
|
6
|
-
import pickerColumn from './picker-column';
|
|
2
|
+
import $ from '../../shared/dom7.js';
|
|
3
|
+
import { extend, nextTick, deleteProps } from '../../shared/utils.js';
|
|
4
|
+
import Framework7Class from '../../shared/class.js';
|
|
5
|
+
import { getDevice } from '../../shared/get-device.js';
|
|
6
|
+
import pickerColumn from './picker-column.js';
|
|
7
7
|
/** @jsx $jsx */
|
|
8
8
|
|
|
9
|
-
import $jsx from '../../shared/$jsx';
|
|
9
|
+
import $jsx from '../../shared/$jsx.js';
|
|
10
10
|
|
|
11
11
|
class Picker extends Framework7Class {
|
|
12
|
-
constructor(app, params
|
|
12
|
+
constructor(app, params) {
|
|
13
|
+
if (params === void 0) {
|
|
14
|
+
params = {};
|
|
15
|
+
}
|
|
16
|
+
|
|
13
17
|
super(params, [app]);
|
|
14
18
|
const picker = this;
|
|
15
19
|
const device = getDevice();
|
|
@@ -167,7 +171,7 @@ class Picker extends Framework7Class {
|
|
|
167
171
|
for (let i = 0; i < picker.cols.length; i += 1) {
|
|
168
172
|
if (!picker.cols[i].divider) {
|
|
169
173
|
picker.cols[i].calcSize();
|
|
170
|
-
picker.cols[i].setValue(picker.cols[i].value,
|
|
174
|
+
picker.cols[i].setValue(picker.cols[i].value, false);
|
|
171
175
|
}
|
|
172
176
|
}
|
|
173
177
|
}
|
|
@@ -216,7 +220,7 @@ class Picker extends Framework7Class {
|
|
|
216
220
|
return value.join(' ');
|
|
217
221
|
}
|
|
218
222
|
|
|
219
|
-
setValue(values
|
|
223
|
+
setValue(values) {
|
|
220
224
|
const picker = this;
|
|
221
225
|
let valueIndex = 0;
|
|
222
226
|
|
|
@@ -228,7 +232,7 @@ class Picker extends Framework7Class {
|
|
|
228
232
|
|
|
229
233
|
for (let i = 0; i < picker.cols.length; i += 1) {
|
|
230
234
|
if (picker.cols[i] && !picker.cols[i].divider) {
|
|
231
|
-
picker.cols[i].setValue(values[valueIndex]
|
|
235
|
+
picker.cols[i].setValue(values[valueIndex]);
|
|
232
236
|
valueIndex += 1;
|
|
233
237
|
}
|
|
234
238
|
}
|
|
@@ -436,11 +440,11 @@ class Picker extends Framework7Class {
|
|
|
436
440
|
}); // Set value
|
|
437
441
|
|
|
438
442
|
if (!initialized) {
|
|
439
|
-
if (value) picker.setValue(value
|
|
440
|
-
picker.setValue(params.value
|
|
443
|
+
if (value) picker.setValue(value);else if (params.value) {
|
|
444
|
+
picker.setValue(params.value);
|
|
441
445
|
}
|
|
442
446
|
} else if (value) {
|
|
443
|
-
picker.setValue(value
|
|
447
|
+
picker.setValue(value);
|
|
444
448
|
} // Extra focus
|
|
445
449
|
|
|
446
450
|
|