framework7-react 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.
Files changed (129) hide show
  1. package/components/accordion-content.js +2 -2
  2. package/components/accordion-item.js +4 -4
  3. package/components/accordion-toggle.js +2 -2
  4. package/components/accordion.js +2 -2
  5. package/components/actions-button.js +3 -3
  6. package/components/actions-group.js +2 -2
  7. package/components/actions-label.js +2 -2
  8. package/components/actions.d.ts +1 -1
  9. package/components/actions.js +6 -6
  10. package/components/app.js +5 -5
  11. package/components/appbar.js +2 -2
  12. package/components/area-chart.js +22 -18
  13. package/components/badge.js +3 -3
  14. package/components/block-footer.js +2 -2
  15. package/components/block-header.js +2 -2
  16. package/components/block-title.js +2 -2
  17. package/components/block.js +3 -3
  18. package/components/breadcrumbs-collapsed.d.ts +16 -0
  19. package/components/breadcrumbs-collapsed.js +32 -0
  20. package/components/breadcrumbs-item.d.ts +17 -0
  21. package/components/breadcrumbs-item.js +33 -0
  22. package/components/breadcrumbs-separator.d.ts +15 -0
  23. package/components/breadcrumbs-separator.js +25 -0
  24. package/components/breadcrumbs.d.ts +15 -0
  25. package/components/breadcrumbs.js +26 -0
  26. package/components/button.js +6 -6
  27. package/components/card-content.js +2 -2
  28. package/components/card-footer.js +2 -2
  29. package/components/card-header.js +2 -2
  30. package/components/card.js +8 -8
  31. package/components/checkbox.js +2 -2
  32. package/components/chip.js +4 -4
  33. package/components/col.js +3 -3
  34. package/components/fab-backdrop.js +1 -1
  35. package/components/fab-button.js +3 -3
  36. package/components/fab-buttons.js +2 -2
  37. package/components/fab.js +3 -3
  38. package/components/gauge.js +1 -1
  39. package/components/icon.js +4 -4
  40. package/components/input.js +28 -12
  41. package/components/link.js +8 -8
  42. package/components/list-button.js +4 -4
  43. package/components/list-group.js +3 -3
  44. package/components/list-index.js +5 -5
  45. package/components/list-input.js +27 -11
  46. package/components/list-item-cell.js +2 -2
  47. package/components/list-item-content.js +3 -3
  48. package/components/list-item-row.js +2 -2
  49. package/components/list-item.js +10 -10
  50. package/components/list.d.ts +1 -0
  51. package/components/list.js +13 -6
  52. package/components/login-screen-title.js +2 -2
  53. package/components/login-screen.js +6 -6
  54. package/components/menu-dropdown-item.js +3 -3
  55. package/components/menu-dropdown.js +2 -2
  56. package/components/menu-item.js +7 -7
  57. package/components/menu.js +2 -2
  58. package/components/message.js +2 -2
  59. package/components/messagebar-attachment.js +2 -2
  60. package/components/messagebar-attachments.js +2 -2
  61. package/components/messagebar-sheet-image.js +2 -2
  62. package/components/messagebar-sheet-item.js +2 -2
  63. package/components/messagebar-sheet.js +2 -2
  64. package/components/messagebar.js +7 -7
  65. package/components/messages-title.js +2 -2
  66. package/components/messages.js +5 -5
  67. package/components/nav-left.js +4 -4
  68. package/components/nav-right.js +2 -2
  69. package/components/nav-title-large.js +2 -2
  70. package/components/nav-title.js +2 -2
  71. package/components/navbar.js +8 -8
  72. package/components/page-content.js +6 -6
  73. package/components/page.js +5 -5
  74. package/components/panel.js +10 -6
  75. package/components/photo-browser.js +4 -4
  76. package/components/pie-chart.js +8 -7
  77. package/components/popover.js +6 -6
  78. package/components/popup.js +6 -6
  79. package/components/preloader.js +3 -3
  80. package/components/progressbar.js +3 -3
  81. package/components/radio.js +2 -2
  82. package/components/range.d.ts +1 -1
  83. package/components/range.js +5 -5
  84. package/components/routable-modals.js +8 -7
  85. package/components/row.js +3 -3
  86. package/components/searchbar.js +4 -4
  87. package/components/segmented.js +2 -2
  88. package/components/sheet.js +6 -6
  89. package/components/skeleton-avatar.d.ts +1 -0
  90. package/components/skeleton-avatar.js +1 -0
  91. package/components/skeleton-block.d.ts +1 -0
  92. package/components/skeleton-block.js +1 -0
  93. package/components/skeleton-image.d.ts +1 -0
  94. package/components/skeleton-image.js +1 -0
  95. package/components/skeleton-text.d.ts +1 -0
  96. package/components/skeleton-text.js +1 -0
  97. package/components/stepper.js +5 -5
  98. package/components/subnavbar.js +2 -2
  99. package/components/swipeout-actions.js +2 -2
  100. package/components/swipeout-button.js +2 -2
  101. package/components/tab.js +7 -7
  102. package/components/tabs.js +3 -3
  103. package/components/text-editor.js +5 -5
  104. package/components/toggle.js +18 -7
  105. package/components/toolbar.js +6 -6
  106. package/components/treeview-item.js +5 -5
  107. package/components/treeview.js +2 -2
  108. package/components/view.d.ts +1 -0
  109. package/components/view.js +28 -23
  110. package/components/views.js +2 -2
  111. package/framework7-react.d.ts +5 -1
  112. package/framework7-react.js +107 -103
  113. package/package.json +2 -1
  114. package/shared/components-router.js +30 -22
  115. package/shared/f7.js +10 -2
  116. package/shared/get-router-initial-component.js +1 -1
  117. package/shared/mixins.js +3 -3
  118. package/shared/modal-state-classes.js +5 -4
  119. package/shared/plugin.js +7 -3
  120. package/shared/router-open-in.js +106 -0
  121. package/shared/use-icon.js +7 -3
  122. package/shared/use-route-props.js +4 -3
  123. package/shared/use-smart-select.js +2 -2
  124. package/shared/use-store.js +6 -6
  125. package/shared/use-tab.js +3 -3
  126. package/shared/use-theme.js +1 -1
  127. package/shared/use-tooltip.js +2 -2
  128. package/shared/utils.js +32 -6
  129. package/shared/watch-prop.js +1 -1
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, noUndefinedProps } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, noUndefinedProps } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
9
 
10
10
 
11
11
  const Messages = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,10 +1,10 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
6
- import { useTheme } from '../shared/use-theme';
7
- import Link from './link';
4
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
+ import { useTheme } from '../shared/use-theme.js';
7
+ import Link from './link.js';
8
8
 
9
9
  const NavLeft = /*#__PURE__*/forwardRef((props, ref) => {
10
10
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const NavRight = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const NavTitleLarge = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const NavTitle = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,14 +1,14 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, emit, getSlots } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { useTheme } from '../shared/use-theme';
9
- import NavLeft from './nav-left';
10
- import NavTitle from './nav-title';
11
- import NavRight from './nav-right';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, emit, getSlots } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { useTheme } from '../shared/use-theme.js';
9
+ import NavLeft from './nav-left.js';
10
+ import NavTitle from './nav-title.js';
11
+ import NavRight from './nav-right.js';
12
12
 
13
13
  const Navbar = /*#__PURE__*/forwardRef((props, ref) => {
14
14
  const {
@@ -1,12 +1,12 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import Preloader from './preloader';
8
- import { useTab } from '../shared/use-tab';
9
- import { f7ready, f7 } from '../shared/f7';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import Preloader from './preloader.js';
8
+ import { useTab } from '../shared/use-tab.js';
9
+ import { f7ready, f7 } from '../shared/f7.js';
10
10
 
11
11
  const PageContent = /*#__PURE__*/forwardRef((props, ref) => {
12
12
  const {
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, getSlots, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import PageContent from './page-content';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, getSlots, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import PageContent from './page-content.js';
9
9
 
10
10
  const Page = /*#__PURE__*/forwardRef((props, ref) => {
11
11
  const {
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, noUndefinedProps, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, noUndefinedProps, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
9
 
10
10
 
11
11
  const Panel = /*#__PURE__*/forwardRef((props, ref) => {
@@ -88,7 +88,11 @@ const Panel = /*#__PURE__*/forwardRef((props, ref) => {
88
88
  emit(props, 'panelCollapsedBreakpoint', event);
89
89
  };
90
90
 
91
- const onResize = (...args) => {
91
+ const onResize = function () {
92
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
93
+ args[_key] = arguments[_key];
94
+ }
95
+
92
96
  emit(props, 'panelResize', ...args);
93
97
  };
94
98
 
@@ -1,8 +1,8 @@
1
1
  import { forwardRef, useRef, useImperativeHandle } from 'react';
2
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
3
- import { extend, emit } from '../shared/utils';
4
- import { watchProp } from '../shared/watch-prop';
5
- import { f7ready, f7 } from '../shared/f7';
2
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
3
+ import { extend, emit } from '../shared/utils.js';
4
+ import { watchProp } from '../shared/watch-prop.js';
5
+ import { f7ready, f7 } from '../shared/f7.js';
6
6
 
7
7
 
8
8
  const PhotoBrowser = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle, useState, useEffect } from 'react';
4
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
5
- import { f7 } from '../shared/f7';
4
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
+ import { f7 } from '../shared/f7.js';
6
6
 
7
7
  const PieChart = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -42,11 +42,12 @@ const PieChart = /*#__PURE__*/forwardRef((props, ref) => {
42
42
  return [x, y];
43
43
  }
44
44
 
45
- datasets.forEach(({
46
- value,
47
- label,
48
- color
49
- }) => {
45
+ datasets.forEach(_ref => {
46
+ let {
47
+ value,
48
+ label,
49
+ color
50
+ } = _ref;
50
51
  const percentage = value / getSummValue();
51
52
  const [startX, startY] = getCoordinatesForPercentage(cumulativePercentage);
52
53
  cumulativePercentage += percentage;
@@ -1,12 +1,12 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
9
- import { modalStateClasses } from '../shared/modal-state-classes';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
+ import { modalStateClasses } from '../shared/modal-state-classes.js';
10
10
 
11
11
 
12
12
  const Popover = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,12 +1,12 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useImperativeHandle, useRef } from 'react';
4
- import { f7, f7ready } from '../shared/f7';
5
- import { colorClasses } from '../shared/mixins';
6
- import { modalStateClasses } from '../shared/modal-state-classes';
7
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
8
- import { classNames, emit, getExtraAttrs } from '../shared/utils';
9
- import { watchProp } from '../shared/watch-prop';
4
+ import { f7, f7ready } from '../shared/f7.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
+ import { modalStateClasses } from '../shared/modal-state-classes.js';
7
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
8
+ import { classNames, emit, getExtraAttrs } from '../shared/utils.js';
9
+ import { watchProp } from '../shared/watch-prop.js';
10
10
 
11
11
 
12
12
  const Popup = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,9 +1,9 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs, extend } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
6
- import { useTheme } from '../shared/use-theme';
4
+ import { classNames, getExtraAttrs, extend } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
+ import { useTheme } from '../shared/use-theme.js';
7
7
 
8
8
  const Preloader = /*#__PURE__*/forwardRef((props, ref) => {
9
9
  const theme = useTheme();
@@ -1,9 +1,9 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
6
- import { f7 } from '../shared/f7';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
+ import { f7 } from '../shared/f7.js';
7
7
 
8
8
  const Progressbar = /*#__PURE__*/forwardRef((props, ref) => {
9
9
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const Radio = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -38,7 +38,7 @@ interface RangeProps {
38
38
  themeDark?: boolean;
39
39
  onRangeChange ?: (val?: any) => void;
40
40
  onRangeChanged ?: (val?: any) => void;
41
- ref?: React.MutableRefObject<{el: HTMLElement | null; f7Range: () => Range.Rage}>;
41
+ ref?: React.MutableRefObject<{el: HTMLElement | null; f7Range: () => Range.Range}>;
42
42
  }
43
43
  declare const Range: React.FunctionComponent<RangeProps>;
44
44
 
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, noUndefinedProps, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, noUndefinedProps, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
9
 
10
10
 
11
11
  const Range = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle, useState } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { f7events, f7routers, f7 } from '../shared/f7';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { f7events, f7routers, f7 } from '../shared/f7.js';
6
6
 
7
7
  const RoutableModals = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const [modals, setModals] = useState([]);
@@ -42,11 +42,12 @@ const RoutableModals = /*#__PURE__*/forwardRef((props, ref) => {
42
42
  return /*#__PURE__*/React.createElement("div", {
43
43
  ref: elRef,
44
44
  className: "framework7-modals"
45
- }, modals.map(({
46
- component: ModalComponent,
47
- id: modalId,
48
- props: modalProps
49
- }) => {
45
+ }, modals.map(_ref => {
46
+ let {
47
+ component: ModalComponent,
48
+ id: modalId,
49
+ props: modalProps
50
+ } = _ref;
50
51
  return /*#__PURE__*/React.createElement(ModalComponent, _extends({
51
52
  key: modalId
52
53
  }, modalProps));
package/components/row.js CHANGED
@@ -1,9 +1,9 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
4
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
6
- import { f7ready, f7 } from '../shared/f7';
4
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
+ import { f7ready, f7 } from '../shared/f7.js';
7
7
 
8
8
  const Row = /*#__PURE__*/forwardRef((props, ref) => {
9
9
  const {
@@ -1,10 +1,10 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, getSlots, noUndefinedProps, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, getSlots, noUndefinedProps, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
8
 
9
9
 
10
10
  const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const Segmented = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,12 +1,12 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, emit, getSlots } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
9
- import { modalStateClasses } from '../shared/modal-state-classes';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, emit, getSlots } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
+ import { modalStateClasses } from '../shared/modal-state-classes.js';
10
10
 
11
11
 
12
12
  const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonAvatar } from 'skeleton-elements/react';
2
3
 
3
4
  export default SkeletonAvatar;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonAvatar } from 'skeleton-elements/react';
2
3
  export default SkeletonAvatar;
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonBlock } from 'skeleton-elements/react';
2
3
 
3
4
  export default SkeletonBlock;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonBlock } from 'skeleton-elements/react';
2
3
  export default SkeletonBlock;
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonImage } from 'skeleton-elements/react';
2
3
 
3
4
  export default SkeletonImage;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonImage } from 'skeleton-elements/react';
2
3
  export default SkeletonImage;
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonText } from 'skeleton-elements/react';
2
3
 
3
4
  export default SkeletonText;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { SkeletonText } from 'skeleton-elements/react';
2
3
  export default SkeletonText;
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, emit, noUndefinedProps } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, emit, noUndefinedProps } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
9
 
10
10
 
11
11
  const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const Subnavbar = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const SwipeoutActions = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
@@ -1,8 +1,8 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { classNames, getExtraAttrs, emit } from '../shared/utils';
5
- import { colorClasses } from '../shared/mixins';
4
+ import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
+ import { colorClasses } from '../shared/mixins.js';
6
6
 
7
7
  const SwipeoutButton = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
package/components/tab.js CHANGED
@@ -1,13 +1,13 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle, useState, useContext } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, getComponentId } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7routers, f7, f7events } from '../shared/f7';
8
- import { useTab } from '../shared/use-tab';
9
- import { RouterContext } from '../shared/router-context';
10
- import { useAsyncComponent } from '../shared/use-async-component';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, getComponentId } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7routers, f7, f7events } from '../shared/f7.js';
8
+ import { useTab } from '../shared/use-tab.js';
9
+ import { RouterContext } from '../shared/router-context.js';
10
+ import { useAsyncComponent } from '../shared/use-async-component.js';
11
11
 
12
12
  const Tab = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const {
@@ -1,9 +1,9 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
7
 
8
8
 
9
9
  const Tabs = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1,11 +1,11 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
- import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
5
- import { classNames, getExtraAttrs, getSlots, noUndefinedProps, emit } from '../shared/utils';
6
- import { colorClasses } from '../shared/mixins';
7
- import { f7ready, f7 } from '../shared/f7';
8
- import { watchProp } from '../shared/watch-prop';
4
+ import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
+ import { classNames, getExtraAttrs, getSlots, noUndefinedProps, emit } from '../shared/utils.js';
6
+ import { colorClasses } from '../shared/mixins.js';
7
+ import { f7ready, f7 } from '../shared/f7.js';
8
+ import { watchProp } from '../shared/watch-prop.js';
9
9
 
10
10
 
11
11
  const TextEditor = /*#__PURE__*/forwardRef((props, ref) => {