framework7 7.0.0-beta.1 → 7.0.0-beta.5

package/framework7-lite-bundle.esm.js

@@ -1,5 +1,5 @@
 /**
- * Framework7 7.0.0-beta.1
+ * Framework7 7.0.0-beta.5
  * Full featured mobile HTML framework for building iOS & Android apps
  * https://framework7.io/
  *
@@ -7,85 +7,85 @@
  *
  * Released under the MIT License
  *
- * Released on: October 4, 2021
+ * Released on: October 13, 2021
  */
 
-import $ from './shared/dom7';
-import Framework7 from './components/app/app-class';
-import request from './shared/request';
-import * as utils from './shared/utils';
-import { getSupport } from './shared/get-support';
-import { getDevice } from './shared/get-device';
-import DeviceModule from './modules/device/device';
-import SupportModule from './modules/support/support';
-import UtilsModule from './modules/utils/utils';
-import ResizeModule from './modules/resize/resize';
-import RequestModule from './modules/request/request';
-import TouchModule from './modules/touch/touch';
-import ClicksModule from './modules/clicks/clicks';
-import RouterModule from './modules/router/router';
-import HistoryModule from './modules/history/history';
-import ServiceWorkerModule from './modules/service-worker/service-worker';
-import StoreModule, { createStore } from './modules/store/store';
-import Statusbar from './components/statusbar/statusbar';
-import View from './components/view/view';
-import Navbar from './components/navbar/navbar';
-import Toolbar from './components/toolbar/toolbar';
-import Subnavbar from './components/subnavbar/subnavbar';
-import TouchRipple from './components/touch-ripple/touch-ripple';
-import Modal from './components/modal/modal';
-import Appbar from './components/appbar/appbar';
-import Dialog from './components/dialog/dialog';
-import Popup from './components/popup/popup';
-import LoginScreen from './components/login-screen/login-screen';
-import Popover from './components/popover/popover';
-import Actions from './components/actions/actions';
-import Sheet from './components/sheet/sheet';
-import Toast from './components/toast/toast';
-import Preloader from './components/preloader/preloader';
-import Progressbar from './components/progressbar/progressbar';
-import Sortable from './components/sortable/sortable';
-import Swipeout from './components/swipeout/swipeout';
-import Accordion from './components/accordion/accordion';
-import ContactsList from './components/contacts-list/contacts-list';
-import VirtualList from './components/virtual-list/virtual-list';
-import ListIndex from './components/list-index/list-index';
-import Timeline from './components/timeline/timeline';
-import Tabs from './components/tabs/tabs';
-import Panel from './components/panel/panel';
-import Card from './components/card/card';
-import Chip from './components/chip/chip';
-import Form from './components/form/form';
-import Input from './components/input/input';
-import Checkbox from './components/checkbox/checkbox';
-import Radio from './components/radio/radio';
-import Toggle from './components/toggle/toggle';
-import Range from './components/range/range';
-import Stepper from './components/stepper/stepper';
-import SmartSelect from './components/smart-select/smart-select';
-import Grid from './components/grid/grid';
-import Calendar from './components/calendar/calendar';
-import Picker from './components/picker/picker';
-import InfiniteScroll from './components/infinite-scroll/infinite-scroll';
-import PullToRefresh from './components/pull-to-refresh/pull-to-refresh';
-import Lazy from './components/lazy/lazy';
-import DataTable from './components/data-table/data-table';
-import Fab from './components/fab/fab';
-import Searchbar from './components/searchbar/searchbar';
-import Messages from './components/messages/messages';
-import Messagebar from './components/messagebar/messagebar';
-import Swiper from './components/swiper/swiper';
-import PhotoBrowser from './components/photo-browser/photo-browser';
-import Notification from './components/notification/notification';
-import Autocomplete from './components/autocomplete/autocomplete';
-import Tooltip from './components/tooltip/tooltip';
-import Skeleton from './components/skeleton/skeleton';
-import Menu from './components/menu/menu';
-import ColorPicker from './components/color-picker/color-picker';
-import Treeview from './components/treeview/treeview';
-import TextEditor from './components/text-editor/text-editor';
-import Elevation from './components/elevation/elevation';
-import Typography from './components/typography/typography';
+import $ from './shared/dom7.js';
+import Framework7 from './components/app/app-class.js';
+import request from './shared/request.js';
+import * as utils from './shared/utils.js';
+import { getSupport } from './shared/get-support.js';
+import { getDevice } from './shared/get-device.js';
+import DeviceModule from './modules/device/device.js';
+import SupportModule from './modules/support/support.js';
+import UtilsModule from './modules/utils/utils.js';
+import ResizeModule from './modules/resize/resize.js';
+import RequestModule from './modules/request/request.js';
+import TouchModule from './modules/touch/touch.js';
+import ClicksModule from './modules/clicks/clicks.js';
+import RouterModule from './modules/router/router.js';
+import HistoryModule from './modules/history/history.js';
+import ServiceWorkerModule from './modules/service-worker/service-worker.js';
+import StoreModule, { createStore } from './modules/store/store.js';
+import Statusbar from './components/statusbar/statusbar.js';
+import View from './components/view/view.js';
+import Navbar from './components/navbar/navbar.js';
+import Toolbar from './components/toolbar/toolbar.js';
+import Subnavbar from './components/subnavbar/subnavbar.js';
+import TouchRipple from './components/touch-ripple/touch-ripple.js';
+import Modal from './components/modal/modal.js';
+import Appbar from './components/appbar/appbar.js';
+import Dialog from './components/dialog/dialog.js';
+import Popup from './components/popup/popup.js';
+import LoginScreen from './components/login-screen/login-screen.js';
+import Popover from './components/popover/popover.js';
+import Actions from './components/actions/actions.js';
+import Sheet from './components/sheet/sheet.js';
+import Toast from './components/toast/toast.js';
+import Preloader from './components/preloader/preloader.js';
+import Progressbar from './components/progressbar/progressbar.js';
+import Sortable from './components/sortable/sortable.js';
+import Swipeout from './components/swipeout/swipeout.js';
+import Accordion from './components/accordion/accordion.js';
+import ContactsList from './components/contacts-list/contacts-list.js';
+import VirtualList from './components/virtual-list/virtual-list.js';
+import ListIndex from './components/list-index/list-index.js';
+import Timeline from './components/timeline/timeline.js';
+import Tabs from './components/tabs/tabs.js';
+import Panel from './components/panel/panel.js';
+import Card from './components/card/card.js';
+import Chip from './components/chip/chip.js';
+import Form from './components/form/form.js';
+import Input from './components/input/input.js';
+import Checkbox from './components/checkbox/checkbox.js';
+import Radio from './components/radio/radio.js';
+import Toggle from './components/toggle/toggle.js';
+import Range from './components/range/range.js';
+import Stepper from './components/stepper/stepper.js';
+import SmartSelect from './components/smart-select/smart-select.js';
+import Grid from './components/grid/grid.js';
+import Calendar from './components/calendar/calendar.js';
+import Picker from './components/picker/picker.js';
+import InfiniteScroll from './components/infinite-scroll/infinite-scroll.js';
+import PullToRefresh from './components/pull-to-refresh/pull-to-refresh.js';
+import Lazy from './components/lazy/lazy.js';
+import DataTable from './components/data-table/data-table.js';
+import Fab from './components/fab/fab.js';
+import Searchbar from './components/searchbar/searchbar.js';
+import Messages from './components/messages/messages.js';
+import Messagebar from './components/messagebar/messagebar.js';
+import Swiper from './components/swiper/swiper.js';
+import PhotoBrowser from './components/photo-browser/photo-browser.js';
+import Notification from './components/notification/notification.js';
+import Autocomplete from './components/autocomplete/autocomplete.js';
+import Tooltip from './components/tooltip/tooltip.js';
+import Skeleton from './components/skeleton/skeleton.js';
+import Menu from './components/menu/menu.js';
+import ColorPicker from './components/color-picker/color-picker.js';
+import Treeview from './components/treeview/treeview.js';
+import TextEditor from './components/text-editor/text-editor.js';
+import Elevation from './components/elevation/elevation.js';
+import Typography from './components/typography/typography.js';
 Framework7.use([DeviceModule, SupportModule, UtilsModule, ResizeModule, RequestModule, TouchModule, ClicksModule, RouterModule, HistoryModule, ServiceWorkerModule, StoreModule, Statusbar, View, Navbar, Toolbar, Subnavbar, TouchRipple, Modal, Appbar, Dialog, Popup, LoginScreen, Popover, Actions, Sheet, Toast, Preloader, Progressbar, Sortable, Swipeout, Accordion, ContactsList, VirtualList, ListIndex, Timeline, Tabs, Panel, Card, Chip, Form, Input, Checkbox, Radio, Toggle, Range, Stepper, SmartSelect, Grid, Calendar, Picker, InfiniteScroll, PullToRefresh, Lazy, DataTable, Fab, Searchbar, Messages, Messagebar, Swiper, PhotoBrowser, Notification, Autocomplete, Tooltip, Skeleton, Menu, ColorPicker, Treeview, TextEditor, Elevation, Typography]);
 export { $ as Dom7, request, utils, getDevice, getSupport, createStore };
 export default Framework7;

package/framework7-lite.esm.js

@@ -1,5 +1,5 @@
 /**
- * Framework7 7.0.0-beta.1
+ * Framework7 7.0.0-beta.5
  * Full featured mobile HTML framework for building iOS & Android apps
  * https://framework7.io/
  *
@@ -7,33 +7,33 @@
  *
  * Released under the MIT License
  *
- * Released on: October 4, 2021
+ * Released on: October 13, 2021
  */
 
-import $ from './shared/dom7';
-import Framework7 from './components/app/app-class';
-import request from './shared/request';
-import * as utils from './shared/utils';
-import { getSupport } from './shared/get-support';
-import { getDevice } from './shared/get-device';
-import DeviceModule from './modules/device/device';
-import SupportModule from './modules/support/support';
-import UtilsModule from './modules/utils/utils';
-import ResizeModule from './modules/resize/resize';
-import RequestModule from './modules/request/request';
-import TouchModule from './modules/touch/touch';
-import ClicksModule from './modules/clicks/clicks';
-import RouterModule from './modules/router/router';
-import HistoryModule from './modules/history/history';
-import ServiceWorkerModule from './modules/service-worker/service-worker';
-import StoreModule, { createStore } from './modules/store/store';
-import Statusbar from './components/statusbar/statusbar';
-import View from './components/view/view';
-import Navbar from './components/navbar/navbar';
-import Toolbar from './components/toolbar/toolbar';
-import Subnavbar from './components/subnavbar/subnavbar';
-import TouchRipple from './components/touch-ripple/touch-ripple';
-import Modal from './components/modal/modal';
+import $ from './shared/dom7.js';
+import Framework7 from './components/app/app-class.js';
+import request from './shared/request.js';
+import * as utils from './shared/utils.js';
+import { getSupport } from './shared/get-support.js';
+import { getDevice } from './shared/get-device.js';
+import DeviceModule from './modules/device/device.js';
+import SupportModule from './modules/support/support.js';
+import UtilsModule from './modules/utils/utils.js';
+import ResizeModule from './modules/resize/resize.js';
+import RequestModule from './modules/request/request.js';
+import TouchModule from './modules/touch/touch.js';
+import ClicksModule from './modules/clicks/clicks.js';
+import RouterModule from './modules/router/router.js';
+import HistoryModule from './modules/history/history.js';
+import ServiceWorkerModule from './modules/service-worker/service-worker.js';
+import StoreModule, { createStore } from './modules/store/store.js';
+import Statusbar from './components/statusbar/statusbar.js';
+import View from './components/view/view.js';
+import Navbar from './components/navbar/navbar.js';
+import Toolbar from './components/toolbar/toolbar.js';
+import Subnavbar from './components/subnavbar/subnavbar.js';
+import TouchRipple from './components/touch-ripple/touch-ripple.js';
+import Modal from './components/modal/modal.js';
 Framework7.use([DeviceModule, SupportModule, UtilsModule, ResizeModule, RequestModule, TouchModule, ClicksModule, RouterModule, HistoryModule, ServiceWorkerModule, StoreModule, Statusbar, View, Navbar, Toolbar, Subnavbar, TouchRipple, Modal]);
 export { $ as Dom7, request, utils, getDevice, getSupport, createStore };
 export default Framework7;

package/framework7-rtl.css

@@ -1,5 +1,5 @@
 /**
- * Framework7 7.0.0-beta.1
+ * Framework7 7.0.0-beta.5
  * Full featured mobile HTML framework for building iOS & Android apps
  * https://framework7.io/
  *
@@ -7,7 +7,7 @@
  *
  * Released under the MIT License
  *
- * Released on: October 4, 2021
+ * Released on: October 13, 2021
  */
 
 /*====================
@@ -93,8 +93,8 @@
   --f7-bars-bg-color: #f7f7f8;
   --f7-bars-bg-color-rgb: 247, 247, 248;
 }
-:root .theme-dark,
-:root.theme-dark {
+:root .dark,
+:root.dark {
   --f7-bars-text-color: #fff;
 }
 .ios {
@@ -103,8 +103,8 @@
   --f7-text-color: #000;
   --f7-bars-border-color: rgba(0, 0, 0, 0.25);
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-text-color: #fff;
   --f7-bars-bg-color: #121212;
   --f7-bars-bg-color-rgb: 22, 22, 22;
@@ -116,8 +116,8 @@
   --f7-bars-border-color: transparent;
   --f7-text-color: #212121;
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-text-color: rgba(255, 255, 255, 0.87);
   --f7-bars-bg-color: #202020;
 }
@@ -127,8 +127,8 @@
   --f7-text-color: #000;
   --f7-bars-border-color: rgba(0, 0, 0, 0.2);
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-text-color: #fff;
   --f7-bars-bg-color: #202020;
   --f7-bars-border-color: rgba(255, 255, 255, 0.1);
@@ -615,11 +615,11 @@ body {
   line-height: var(--f7-line-height);
   color: var(--f7-text-color);
 }
-.theme-dark body,
-body.theme-dark {
+.dark body,
+body.dark {
   background: #000;
 }
-.theme-dark {
+.dark {
   color: var(--f7-text-color);
 }
 .framework7-root {
@@ -777,8 +777,8 @@ html.device-full-viewport body {
   --f7-page-title-padding-vertical: 6px;
   --f7-page-bg-color: #efeff4;
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-page-bg-color: #000;
 }
 .md {
@@ -789,8 +789,8 @@ html.device-full-viewport body {
   --f7-page-title-padding-vertical: 8px;
   --f7-page-bg-color: #fff;
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-page-bg-color: #121212;
 }
 .aurora {
@@ -801,11 +801,11 @@ html.device-full-viewport body {
   --f7-page-title-padding-vertical: 7px;
   --f7-page-bg-color: #f3f4f6;
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-page-bg-color: #121212;
 }
-.theme-dark {
+.dark {
   --f7-page-master-border-color: rgba(255, 255, 255, 0.2);
 }
 .pages {
@@ -1700,8 +1700,8 @@ html.device-full-viewport body {
   */
   --f7-navbar-subtitle-text-color: rgba(0, 0, 0, 0.55);
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.55);
 }
 .md {
@@ -1726,8 +1726,8 @@ html.device-full-viewport body {
   --f7-navbar-link-line-height: 48px;
   --f7-navbar-subtitle-text-color: rgba(0, 0, 0, 0.85);
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.85);
 }
 .aurora {
@@ -1752,8 +1752,8 @@ html.device-full-viewport body {
   --f7-navbar-link-line-height: inherit;
   --f7-navbar-subtitle-text-color: rgba(0, 0, 0, 0.6);
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.5);
 }
 .navbars,
@@ -2805,8 +2805,8 @@ html.device-full-viewport body {
   --f7-tabbar-label-letter-spacing: 0.01;
   --f7-tabbar-link-inactive-color: rgba(0, 0, 0, 0.4);
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.54);
 }
 .md {
@@ -2835,8 +2835,8 @@ html.device-full-viewport body {
   --f7-tabbar-label-letter-spacing: 0;
   --f7-tabbar-link-inactive-color: rgba(0, 0, 0, 0.54);
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.54);
 }
 .aurora {
@@ -2863,8 +2863,8 @@ html.device-full-viewport body {
   --f7-tabbar-label-letter-spacing: 0;
   --f7-tabbar-link-inactive-color: rgba(0, 0, 0, 0.5);
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.5);
 }
 .toolbar {
@@ -3770,8 +3770,8 @@ html.device-full-viewport body {
   --f7-block-title-large-text-color: #000;
   --f7-block-strong-bg-color: #fff;
 }
-:root .theme-dark,
-:root.theme-dark {
+:root .dark,
+:root.dark {
   --f7-block-title-text-color: #fff;
   --f7-block-strong-border-color: rgba(255, 255, 255, 0.15);
   --f7-block-title-medium-text-color: #fff;
@@ -3797,8 +3797,8 @@ html.device-full-viewport body {
   --f7-block-header-text-color: rgba(0, 0, 0, 0.45);
   --f7-block-footer-text-color: rgba(0, 0, 0, 0.45);
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-block-header-text-color: rgba(255, 255, 255, 0.55);
   --f7-block-footer-text-color: rgba(255, 255, 255, 0.55);
   --f7-block-strong-text-color: #fff;
@@ -3822,8 +3822,8 @@ html.device-full-viewport body {
   --f7-block-header-text-color: rgba(0, 0, 0, 0.54);
   --f7-block-footer-text-color: rgba(0, 0, 0, 0.54);
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-block-header-text-color: rgba(255, 255, 255, 0.54);
   --f7-block-footer-text-color: rgba(255, 255, 255, 0.54);
 }
@@ -3846,8 +3846,8 @@ html.device-full-viewport body {
   --f7-block-header-text-color: rgba(0, 0, 0, 0.6);
   --f7-block-footer-text-color: rgba(0, 0, 0, 0.6);
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-block-header-text-color: rgba(255, 255, 255, 0.54);
   --f7-block-footer-text-color: rgba(255, 255, 255, 0.54);
   --f7-block-strong-text-color: #fff;
@@ -4216,8 +4216,8 @@ html.device-full-viewport body {
   --f7-menu-list-selected-text-color: var(--f7-theme-color);
   --f7-menu-list-selected-bg-color: rgba(var(--f7-theme-color-rgb), 0.15);
 }
-:root .theme-dark,
-:root.theme-dark {
+:root .dark,
+:root.dark {
   --f7-list-button-border-color: rgba(255, 255, 255, 0.15);
   --f7-list-bg-color: #1c1c1d;
   --f7-list-border-color: rgba(255, 255, 255, 0.15);
@@ -4262,8 +4262,8 @@ html.device-full-viewport body {
   --f7-list-item-divider-text-color: rgba(0, 0, 0, 0.45);
   --f7-list-group-title-text-color: rgba(0, 0, 0, 0.45);
 }
-.ios .theme-dark,
-.ios.theme-dark {
+.ios .dark,
+.ios.dark {
   --f7-list-item-after-text-color: rgba(255, 255, 255, 0.55);
   --f7-list-item-header-text-color: rgba(255, 255, 255, 0.55);
   --f7-list-item-footer-text-color: rgba(255, 255, 255, 0.55);
@@ -4308,8 +4308,8 @@ html.device-full-viewport body {
   --f7-list-item-divider-text-color: rgba(0, 0, 0, 0.54);
   --f7-list-group-title-text-color: rgba(0, 0, 0, 0.54);
 }
-.md .theme-dark,
-.md.theme-dark {
+.md .dark,
+.md.dark {
   --f7-list-item-divider-text-color: #fff;
   --f7-list-group-title-text-color: #fff;
   --f7-list-link-pressed-bg-color: rgba(255, 255, 255, 0.05);
@@ -4353,8 +4353,8 @@ html.device-full-viewport body {
   --f7-list-item-divider-text-color: rgba(0, 0, 0, 0.6);
   --f7-list-group-title-text-color: rgba(0, 0, 0, 0.6);
 }
-.aurora .theme-dark,
-.aurora.theme-dark {
+.aurora .dark,
+.aurora.dark {
   --f7-list-item-text-text-color: rgba(255, 255, 255, 0.54);
   --f7-list-item-after-text-color: rgba(255, 255, 255, 0.54);
   --f7-list-item-footer-text-color: rgba(255, 255, 255, 0.54);
@@ -5307,8 +5307,8 @@ li.list-group-title,
   --f7-segmented-strong-button-active-text-color: #000;
   --f7-segmented-strong-button-active-bg-color: #fff;
 }
-:root .theme-dark,
-:root.theme-dark {
+:root .dark,
+:root.dark {
   --f7-segmented-strong-bg-color: rgba(255, 255, 255, 0.1);
   --f7-segmented-strong-button-pressed-bg-color: rgba(255, 255, 255, 0.04);
   --f7-segmented-strong-button-hover-bg-color: rgba(255, 255, 255, 0.02);
@@ -5790,7 +5790,7 @@ input[type='reset'].button {
   --f7-touch-ripple-white: rgba(255, 255, 255, 0.3);
   --f7-touch-ripple-color: var(--f7-touch-ripple-black);
 }
-.theme-dark {
+.dark {
   --f7-touch-ripple-color: var(--f7-touch-ripple-white);
 }
 .ripple,