framework7-react 7.1.5 → 8.0.0-beta.2

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 (148) hide show
  1. package/components/accordion-content.js +2 -2
  2. package/components/accordion-item.js +2 -11
  3. package/components/accordion-toggle.js +2 -2
  4. package/components/accordion.js +2 -2
  5. package/components/actions-button.d.ts +1 -1
  6. package/components/actions-button.js +4 -8
  7. package/components/actions-group.js +2 -2
  8. package/components/actions-label.js +4 -6
  9. package/components/actions.js +4 -14
  10. package/components/app.js +4 -8
  11. package/components/area-chart.js +6 -45
  12. package/components/badge.js +2 -2
  13. package/components/block-footer.js +2 -2
  14. package/components/block-header.js +2 -2
  15. package/components/block-title.js +2 -2
  16. package/components/block.d.ts +17 -4
  17. package/components/block.js +37 -11
  18. package/components/breadcrumbs-collapsed.js +2 -4
  19. package/components/breadcrumbs-item.js +2 -4
  20. package/components/breadcrumbs-separator.js +2 -2
  21. package/components/breadcrumbs.js +2 -2
  22. package/components/button.d.ts +3 -7
  23. package/components/button.js +8 -24
  24. package/components/card-content.js +2 -2
  25. package/components/card-footer.js +2 -2
  26. package/components/card-header.js +2 -2
  27. package/components/card.d.ts +5 -2
  28. package/components/card.js +14 -23
  29. package/components/checkbox.js +2 -4
  30. package/components/chip.d.ts +0 -1
  31. package/components/chip.js +2 -9
  32. package/components/fab-backdrop.js +2 -2
  33. package/components/fab-button.js +2 -6
  34. package/components/fab-buttons.js +2 -2
  35. package/components/fab.js +2 -10
  36. package/components/gauge.js +2 -2
  37. package/components/icon.d.ts +0 -1
  38. package/components/icon.js +3 -17
  39. package/components/input.js +1 -57
  40. package/components/link.d.ts +0 -1
  41. package/components/link.js +5 -12
  42. package/components/list-button.js +2 -4
  43. package/components/list-group.js +2 -2
  44. package/components/list-index.d.ts +0 -1
  45. package/components/list-index.js +3 -13
  46. package/components/list-input.d.ts +0 -1
  47. package/components/list-input.js +1 -55
  48. package/components/list-item-content.js +9 -20
  49. package/components/list-item.d.ts +1 -1
  50. package/components/list-item.js +6 -35
  51. package/components/list.d.ts +21 -9
  52. package/components/list.js +43 -37
  53. package/components/login-screen-title.js +2 -2
  54. package/components/login-screen.js +3 -15
  55. package/components/message.js +2 -10
  56. package/components/messagebar-attachment.js +2 -5
  57. package/components/messagebar-attachments.js +2 -2
  58. package/components/messagebar-sheet-image.js +4 -5
  59. package/components/messagebar-sheet-item.js +2 -2
  60. package/components/messagebar-sheet.js +2 -2
  61. package/components/messagebar.js +1 -19
  62. package/components/messages-title.js +2 -2
  63. package/components/messages.js +2 -15
  64. package/components/nav-left.js +2 -6
  65. package/components/nav-right.js +2 -2
  66. package/components/nav-title-large.js +2 -2
  67. package/components/nav-title.js +2 -4
  68. package/components/navbar.d.ts +1 -2
  69. package/components/navbar.js +5 -31
  70. package/components/page-content.js +2 -16
  71. package/components/page.d.ts +0 -1
  72. package/components/page.js +4 -62
  73. package/components/panel.d.ts +1 -0
  74. package/components/panel.js +6 -26
  75. package/components/photo-browser.js +1 -17
  76. package/components/pie-chart.js +6 -18
  77. package/components/popover.d.ts +1 -0
  78. package/components/popover.js +4 -14
  79. package/components/popup.js +3 -19
  80. package/components/preloader.js +5 -14
  81. package/components/progressbar.js +2 -4
  82. package/components/radio.js +2 -4
  83. package/components/range.js +2 -9
  84. package/components/routable-modals.js +2 -7
  85. package/components/searchbar.d.ts +1 -2
  86. package/components/searchbar.js +5 -30
  87. package/components/segmented.d.ts +0 -3
  88. package/components/segmented.js +4 -10
  89. package/components/sheet.js +2 -22
  90. package/components/stepper.d.ts +0 -5
  91. package/components/stepper.js +3 -33
  92. package/components/subnavbar.js +2 -2
  93. package/components/swipeout-actions.js +2 -4
  94. package/components/swipeout-button.js +2 -4
  95. package/components/tab.js +4 -15
  96. package/components/tabs.js +1 -4
  97. package/components/text-editor.js +1 -18
  98. package/components/toggle.js +1 -13
  99. package/components/toolbar.d.ts +2 -6
  100. package/components/toolbar.js +9 -20
  101. package/components/treeview-item.d.ts +0 -1
  102. package/components/treeview-item.js +2 -11
  103. package/components/treeview.js +2 -2
  104. package/components/view.d.ts +0 -6
  105. package/components/view.js +3 -30
  106. package/components/views.js +2 -2
  107. package/framework7-react.d.ts +2 -14
  108. package/framework7-react.js +3 -14
  109. package/package.json +1 -1
  110. package/shared/components-router.js +0 -32
  111. package/shared/f7.js +5 -19
  112. package/shared/get-router-initial-component.js +0 -4
  113. package/shared/mixins.js +2 -8
  114. package/shared/plugin.js +2 -8
  115. package/shared/router-open-in.js +4 -15
  116. package/shared/tabbar-context.js +1 -1
  117. package/shared/use-icon.js +1 -6
  118. package/shared/use-isomorphic-layout-effect.js +0 -2
  119. package/shared/use-route-props.js +0 -1
  120. package/shared/use-smart-select.js +0 -3
  121. package/shared/use-store.js +4 -8
  122. package/shared/use-tab.js +0 -4
  123. package/shared/use-theme.js +0 -2
  124. package/shared/use-tooltip.js +0 -5
  125. package/shared/utils.js +0 -18
  126. package/shared/watch-prop.js +0 -1
  127. package/components/appbar.d.ts +0 -28
  128. package/components/appbar.js +0 -45
  129. package/components/col.d.ts +0 -36
  130. package/components/col.js +0 -75
  131. package/components/list-item-cell.d.ts +0 -23
  132. package/components/list-item-cell.js +0 -28
  133. package/components/list-item-row.d.ts +0 -23
  134. package/components/list-item-row.js +0 -28
  135. package/components/menu-dropdown-item.d.ts +0 -68
  136. package/components/menu-dropdown-item.js +0 -59
  137. package/components/menu-dropdown.d.ts +0 -28
  138. package/components/menu-dropdown.js +0 -42
  139. package/components/menu-item.d.ts +0 -81
  140. package/components/menu-item.js +0 -101
  141. package/components/menu.d.ts +0 -23
  142. package/components/menu.js +0 -30
  143. package/components/row.d.ts +0 -31
  144. package/components/row.js +0 -64
  145. package/components/swiper-slide.d.ts +0 -4
  146. package/components/swiper-slide.js +0 -3
  147. package/components/swiper.d.ts +0 -4
  148. package/components/swiper.js +0 -3
@@ -1,5 +1,4 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
4
  import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
@@ -9,6 +8,7 @@ import { watchProp } from '../shared/watch-prop.js';
9
8
  import { modalStateClasses } from '../shared/modal-state-classes.js';
10
9
 
11
10
 
11
+
12
12
  const Popover = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const f7Popover = useRef(null);
14
14
  const {
@@ -19,6 +19,7 @@ const Popover = /*#__PURE__*/forwardRef((props, ref) => {
19
19
  opened,
20
20
  animate,
21
21
  targetEl,
22
+ angle,
22
23
  backdrop,
23
24
  backdropEl,
24
25
  closeByBackdropClick,
@@ -31,42 +32,35 @@ const Popover = /*#__PURE__*/forwardRef((props, ref) => {
31
32
  const elRef = useRef(null);
32
33
  const isOpened = useRef(opened);
33
34
  const isClosing = useRef(false);
34
-
35
35
  const onOpen = instance => {
36
36
  isOpened.current = true;
37
37
  isClosing.current = false;
38
38
  emit(props, 'popoverOpen', instance);
39
39
  };
40
-
41
40
  const onOpened = instance => {
42
41
  emit(props, 'popoverOpened', instance);
43
42
  };
44
-
45
43
  const onClose = instance => {
46
44
  isOpened.current = false;
47
45
  isClosing.current = true;
48
46
  emit(props, 'popoverClose', instance);
49
47
  };
50
-
51
48
  const onClosed = instance => {
52
49
  isClosing.current = false;
53
50
  emit(props, 'popoverClosed', instance);
54
51
  };
55
-
56
52
  useImperativeHandle(ref, () => ({
57
53
  el: elRef.current,
58
54
  f7Popover: () => f7Popover.current
59
55
  }));
60
56
  watchProp(opened, value => {
61
57
  if (!f7Popover.current) return;
62
-
63
58
  if (value) {
64
59
  f7Popover.current.open();
65
60
  } else {
66
61
  f7Popover.current.close();
67
62
  }
68
63
  });
69
-
70
64
  const modalEvents = method => {
71
65
  if (!f7Popover.current) return;
72
66
  f7Popover.current[method]('open', onOpen);
@@ -74,7 +68,6 @@ const Popover = /*#__PURE__*/forwardRef((props, ref) => {
74
68
  f7Popover.current[method]('close', onClose);
75
69
  f7Popover.current[method]('closed', onClosed);
76
70
  };
77
-
78
71
  const onMount = () => {
79
72
  if (!elRef.current) return;
80
73
  const popoverParams = {
@@ -84,6 +77,7 @@ const Popover = /*#__PURE__*/forwardRef((props, ref) => {
84
77
  if ('closeByBackdropClick' in props) popoverParams.closeByBackdropClick = closeByBackdropClick;
85
78
  if ('closeByOutsideClick' in props) popoverParams.closeByOutsideClick = closeByOutsideClick;
86
79
  if ('closeOnEscape' in props) popoverParams.closeOnEscape = closeOnEscape;
80
+ if ('angle' in props) popoverParams.angle = angle;
87
81
  if ('backdrop' in props) popoverParams.backdrop = backdrop;
88
82
  if ('backdropEl' in props) popoverParams.backdropEl = backdropEl;
89
83
  if ('animate' in props) popoverParams.animate = animate;
@@ -92,21 +86,17 @@ const Popover = /*#__PURE__*/forwardRef((props, ref) => {
92
86
  f7ready(() => {
93
87
  f7Popover.current = f7.popover.create(popoverParams);
94
88
  modalEvents('on');
95
-
96
89
  if (opened && targetEl) {
97
90
  f7Popover.current.open(targetEl, false);
98
91
  }
99
92
  });
100
93
  };
101
-
102
94
  const onDestroy = () => {
103
95
  if (f7Popover.current) {
104
96
  f7Popover.current.destroy();
105
97
  }
106
-
107
98
  f7Popover.current = null;
108
99
  };
109
-
110
100
  useIsomorphicLayoutEffect(() => {
111
101
  modalEvents('on');
112
102
  return () => {
@@ -1,5 +1,4 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useImperativeHandle, useRef } from 'react';
4
3
  import { f7, f7ready } from '../shared/f7.js';
5
4
  import { colorClasses } from '../shared/mixins.js';
@@ -9,6 +8,7 @@ import { classNames, emit, getExtraAttrs } from '../shared/utils.js';
9
8
  import { watchProp } from '../shared/watch-prop.js';
10
9
 
11
10
 
11
+
12
12
  const Popup = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const f7Popup = useRef(null);
14
14
  const {
@@ -32,58 +32,47 @@ const Popup = /*#__PURE__*/forwardRef((props, ref) => {
32
32
  const elRef = useRef(null);
33
33
  const isOpened = useRef(opened);
34
34
  const isClosing = useRef(false);
35
-
36
35
  const onSwipeStart = instance => {
37
36
  emit(props, 'popupSwipeStart', instance);
38
37
  };
39
-
40
38
  const onSwipeMove = instance => {
41
39
  emit(props, 'popupSwipeMove', instance);
42
40
  };
43
-
44
41
  const onSwipeEnd = instance => {
45
42
  emit(props, 'popupSwipeEnd', instance);
46
43
  };
47
-
48
44
  const onSwipeClose = instance => {
49
45
  emit(props, 'popupSwipeClose', instance);
50
46
  };
51
-
52
47
  const onOpen = instance => {
53
48
  isOpened.current = true;
54
49
  isClosing.current = false;
55
50
  emit(props, 'popupOpen', instance);
56
51
  };
57
-
58
52
  const onOpened = instance => {
59
53
  emit(props, 'popupOpened', instance);
60
54
  };
61
-
62
55
  const onClose = instance => {
63
56
  isOpened.current = false;
64
57
  isClosing.current = true;
65
58
  emit(props, 'popupClose', instance);
66
59
  };
67
-
68
60
  const onClosed = instance => {
69
61
  isClosing.current = false;
70
62
  emit(props, 'popupClosed', instance);
71
63
  };
72
-
73
64
  useImperativeHandle(ref, () => ({
74
65
  el: elRef.current,
75
66
  f7Popup: () => f7Popup.current
76
67
  }));
77
68
  watchProp(opened, value => {
78
69
  if (!f7Popup.current) return;
79
-
80
70
  if (value) {
81
71
  f7Popup.current.open();
82
72
  } else {
83
73
  f7Popup.current.close();
84
74
  }
85
75
  });
86
-
87
76
  const modalEvents = method => {
88
77
  if (!f7Popup.current) return;
89
78
  f7Popup.current[method]('swipeStart', onSwipeStart);
@@ -95,7 +84,6 @@ const Popup = /*#__PURE__*/forwardRef((props, ref) => {
95
84
  f7Popup.current[method]('close', onClose);
96
85
  f7Popup.current[method]('closed', onClosed);
97
86
  };
98
-
99
87
  const onMount = () => {
100
88
  if (!elRef.current) return;
101
89
  const popupParams = {
@@ -112,21 +100,17 @@ const Popup = /*#__PURE__*/forwardRef((props, ref) => {
112
100
  f7ready(() => {
113
101
  f7Popup.current = f7.popup.create(popupParams);
114
102
  modalEvents('on');
115
-
116
103
  if (opened) {
117
- f7Popup.current.open(false);
104
+ f7Popup.current.open(false, true);
118
105
  }
119
106
  });
120
107
  };
121
-
122
108
  const onDestroy = () => {
123
109
  if (f7Popup.current) {
124
110
  f7Popup.current.destroy();
125
111
  }
126
-
127
112
  f7Popup.current = null;
128
113
  };
129
-
130
114
  useIsomorphicLayoutEffect(() => {
131
115
  modalEvents('on');
132
116
  return () => {
@@ -1,10 +1,10 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { classNames, getExtraAttrs, extend } from '../shared/utils.js';
5
4
  import { colorClasses } from '../shared/mixins.js';
6
5
  import { useTheme } from '../shared/use-theme.js';
7
6
 
7
+
8
8
  const Preloader = /*#__PURE__*/forwardRef((props, ref) => {
9
9
  const theme = useTheme();
10
10
  const {
@@ -20,20 +20,16 @@ const Preloader = /*#__PURE__*/forwardRef((props, ref) => {
20
20
  }));
21
21
  const preloaderStyle = {};
22
22
  let sizeComputed = size;
23
-
24
23
  if (sizeComputed && typeof sizeComputed === 'string' && sizeComputed.indexOf('px') >= 0) {
25
24
  sizeComputed = sizeComputed.replace('px', '');
26
25
  }
27
-
28
26
  if (sizeComputed) {
29
27
  preloaderStyle.width = `${sizeComputed}px`;
30
28
  preloaderStyle.height = `${sizeComputed}px`;
31
29
  preloaderStyle['--f7-preloader-size'] = `${sizeComputed}px`;
32
30
  }
33
-
34
31
  if (style) extend(preloaderStyle, style || {});
35
32
  let innerEl;
36
-
37
33
  if (theme && theme.md) {
38
34
  innerEl = /*#__PURE__*/React.createElement("span", {
39
35
  className: "preloader-inner"
@@ -64,19 +60,14 @@ const Preloader = /*#__PURE__*/forwardRef((props, ref) => {
64
60
  }), /*#__PURE__*/React.createElement("span", {
65
61
  className: "preloader-inner-line"
66
62
  }));
67
- } else if (theme && theme.aurora) {
68
- innerEl = /*#__PURE__*/React.createElement("span", {
69
- className: "preloader-inner"
70
- }, /*#__PURE__*/React.createElement("span", {
71
- className: "preloader-inner-circle"
72
- }));
73
63
  } else if (!theme) {
74
64
  innerEl = /*#__PURE__*/React.createElement("span", {
75
65
  className: "preloader-inner"
76
66
  });
77
67
  }
78
-
79
- const classes = classNames(className, 'preloader', colorClasses(props));
68
+ const classes = classNames(className, {
69
+ preloader: true
70
+ }, colorClasses(props));
80
71
  return /*#__PURE__*/React.createElement("span", _extends({
81
72
  id: id,
82
73
  style: preloaderStyle,
@@ -1,10 +1,10 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { classNames, getExtraAttrs } from '../shared/utils.js';
5
4
  import { colorClasses } from '../shared/mixins.js';
6
5
  import { f7 } from '../shared/f7.js';
7
6
 
7
+
8
8
  const Progressbar = /*#__PURE__*/forwardRef((props, ref) => {
9
9
  const {
10
10
  className,
@@ -15,12 +15,10 @@ const Progressbar = /*#__PURE__*/forwardRef((props, ref) => {
15
15
  } = props;
16
16
  const extraAttrs = getExtraAttrs(props);
17
17
  const elRef = useRef(null);
18
-
19
18
  const set = (newProgress, speed) => {
20
19
  if (!f7) return;
21
20
  f7.progressbar.set(elRef.current, newProgress, speed);
22
21
  };
23
-
24
22
  useImperativeHandle(ref, () => ({
25
23
  el: elRef.current,
26
24
  set
@@ -1,9 +1,9 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
5
4
  import { colorClasses } from '../shared/mixins.js';
6
5
 
6
+
7
7
  const Radio = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
9
9
  className,
@@ -18,11 +18,9 @@ const Radio = /*#__PURE__*/forwardRef((props, ref) => {
18
18
  } = props;
19
19
  const extraAttrs = getExtraAttrs(props);
20
20
  const elRef = useRef(null);
21
-
22
21
  const onChange = event => {
23
22
  emit(props, 'change', event);
24
23
  };
25
-
26
24
  useImperativeHandle(ref, () => ({
27
25
  el: elRef.current
28
26
  }));
@@ -1,5 +1,4 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
4
  import { classNames, getExtraAttrs, noUndefinedProps, emit } from '../shared/utils.js';
@@ -8,6 +7,7 @@ import { f7ready, f7 } from '../shared/f7.js';
8
7
  import { watchProp } from '../shared/watch-prop.js';
9
8
 
10
9
 
10
+
11
11
  const Range = /*#__PURE__*/forwardRef((props, ref) => {
12
12
  const f7Range = useRef(null);
13
13
  const {
@@ -45,7 +45,6 @@ const Range = /*#__PURE__*/forwardRef((props, ref) => {
45
45
  watchProp(value, newValue => {
46
46
  if (!f7Range.current) return;
47
47
  const rangeValue = f7Range.current.value;
48
-
49
48
  if (Array.isArray(newValue) && Array.isArray(rangeValue)) {
50
49
  if (rangeValue[0] !== newValue[0] || rangeValue[1] !== newValue[1]) {
51
50
  f7Range.current.setValue(newValue);
@@ -54,21 +53,17 @@ const Range = /*#__PURE__*/forwardRef((props, ref) => {
54
53
  f7Range.current.setValue(newValue);
55
54
  }
56
55
  });
57
-
58
56
  const onChange = (range, val) => {
59
57
  emit(props, 'rangeChange', val);
60
58
  };
61
-
62
59
  const onChanged = (range, val) => {
63
60
  emit(props, 'rangeChanged', val);
64
61
  };
65
-
66
62
  const rangeEvents = method => {
67
63
  if (!f7Range.current) return;
68
64
  f7Range.current[method]('change', onChange);
69
65
  f7Range.current[method]('changed', onChanged);
70
66
  };
71
-
72
67
  const onMount = () => {
73
68
  f7ready(() => {
74
69
  if (!init || !elRef.current) return;
@@ -93,12 +88,10 @@ const Range = /*#__PURE__*/forwardRef((props, ref) => {
93
88
  rangeEvents('on');
94
89
  });
95
90
  };
96
-
97
91
  const onDestroy = () => {
98
92
  if (f7Range.current && f7Range.current.destroy) f7Range.current.destroy();
99
93
  f7Range.current = null;
100
94
  };
101
-
102
95
  useIsomorphicLayoutEffect(() => {
103
96
  rangeEvents('on');
104
97
  return () => {
@@ -1,9 +1,9 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle, useState } from 'react';
4
3
  import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
4
  import { f7events, f7routers, f7 } from '../shared/f7.js';
6
5
 
6
+
7
7
  const RoutableModals = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const [modals, setModals] = useState([]);
9
9
  const elRef = useRef(null);
@@ -11,26 +11,21 @@ const RoutableModals = /*#__PURE__*/forwardRef((props, ref) => {
11
11
  useImperativeHandle(ref, () => ({
12
12
  el: elRef.current
13
13
  }));
14
-
15
14
  const onMount = () => {
16
15
  routerData.current = {
17
16
  modals,
18
17
  el: elRef.current,
19
-
20
18
  setModals(newModals) {
21
19
  setModals([...newModals]);
22
20
  }
23
-
24
21
  };
25
22
  f7routers.modals = routerData.current;
26
23
  };
27
-
28
24
  const onDestroy = () => {
29
25
  if (!routerData.current) return;
30
26
  f7routers.modals = null;
31
27
  routerData.current = null;
32
28
  };
33
-
34
29
  useIsomorphicLayoutEffect(() => {
35
30
  onMount();
36
31
  return onDestroy;
@@ -9,8 +9,7 @@ export interface SearchbarProps {
9
9
  id?: string | number;
10
10
  className?: string;
11
11
  style?: React.CSSProperties;
12
- noShadow ?: boolean;
13
- noHairline ?: boolean;
12
+ outline ?: boolean;
14
13
  form ?: boolean;
15
14
  placeholder ?: string;
16
15
  disableButton ?: boolean;
@@ -1,5 +1,4 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
4
  import { classNames, getExtraAttrs, getSlots, noUndefinedProps, emit } from '../shared/utils.js';
@@ -7,14 +6,14 @@ import { colorClasses } from '../shared/mixins.js';
7
6
  import { f7ready, f7 } from '../shared/f7.js';
8
7
 
9
8
 
9
+
10
10
  const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
11
11
  const f7Searchbar = useRef(null);
12
12
  const {
13
13
  className,
14
14
  id,
15
15
  style,
16
- noShadow,
17
- noHairline,
16
+ outline = true,
18
17
  form = true,
19
18
  placeholder = 'Search',
20
19
  spellcheck,
@@ -31,7 +30,7 @@ const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
31
30
  searchIn = '.item-title',
32
31
  searchItem = 'li',
33
32
  searchGroup = '.list-group',
34
- searchGroupTitle = '.item-divider, .list-group-title',
33
+ searchGroupTitle = '.list-group-title',
35
34
  foundEl = '.searchbar-found',
36
35
  notFoundEl = '.searchbar-not-found',
37
36
  backdrop,
@@ -47,60 +46,47 @@ const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
47
46
  } = props;
48
47
  const extraAttrs = getExtraAttrs(props);
49
48
  const elRef = useRef(null);
50
-
51
49
  const search = query => {
52
50
  if (!f7Searchbar.current) return undefined;
53
51
  return f7Searchbar.current.search(query);
54
52
  };
55
-
56
53
  const enable = () => {
57
54
  if (!f7Searchbar.current) return undefined;
58
55
  return f7Searchbar.current.enable();
59
56
  };
60
-
61
57
  const disable = () => {
62
58
  if (!f7Searchbar.current) return undefined;
63
59
  return f7Searchbar.current.disable();
64
60
  };
65
-
66
61
  const toggle = () => {
67
62
  if (!f7Searchbar.current) return undefined;
68
63
  return f7Searchbar.current.toggle();
69
64
  };
70
-
71
65
  const clear = () => {
72
66
  if (!f7Searchbar.current) return undefined;
73
67
  return f7Searchbar.current.clear();
74
68
  };
75
-
76
69
  const onChange = event => {
77
70
  emit(props, 'change', event);
78
71
  };
79
-
80
72
  const onInput = event => {
81
73
  emit(props, 'input', event);
82
74
  };
83
-
84
75
  const onFocus = event => {
85
76
  emit(props, 'focus', event);
86
77
  };
87
-
88
78
  const onBlur = event => {
89
79
  emit(props, 'blur', event);
90
80
  };
91
-
92
81
  const onSubmit = event => {
93
82
  emit(props, 'submit', event);
94
83
  };
95
-
96
84
  const onClearButtonClick = event => {
97
85
  emit(props, 'click:clear clickClear', event);
98
86
  };
99
-
100
87
  const onDisableButtonClick = event => {
101
88
  emit(props, 'click:disable clickDisable', event);
102
89
  };
103
-
104
90
  useImperativeHandle(ref, () => ({
105
91
  el: elRef.current,
106
92
  f7Searchbar: () => f7Searchbar.current,
@@ -110,7 +96,6 @@ const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
110
96
  toggle,
111
97
  clear
112
98
  }));
113
-
114
99
  const onMount = () => {
115
100
  if (!init) return;
116
101
  f7ready(() => {
@@ -140,19 +125,15 @@ const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
140
125
  search(searchbar, query, previousQuery) {
141
126
  emit(props, 'searchbarSearch', searchbar, query, previousQuery);
142
127
  },
143
-
144
128
  clear(searchbar, previousQuery) {
145
129
  emit(props, 'searchbarClear', searchbar, previousQuery);
146
130
  },
147
-
148
131
  enable(searchbar) {
149
132
  emit(props, 'searchbarEnable', searchbar);
150
133
  },
151
-
152
134
  disable(searchbar) {
153
135
  emit(props, 'searchbarDisable', searchbar);
154
136
  }
155
-
156
137
  }
157
138
  });
158
139
  Object.keys(params).forEach(key => {
@@ -163,38 +144,32 @@ const Searchbar = /*#__PURE__*/forwardRef((props, ref) => {
163
144
  f7Searchbar.current = f7.searchbar.create(params);
164
145
  });
165
146
  };
166
-
167
147
  const onDestroy = () => {
168
148
  if (f7Searchbar.current && f7Searchbar.current.destroy) f7Searchbar.current.destroy();
169
149
  f7Searchbar.current = null;
170
150
  };
171
-
172
151
  useIsomorphicLayoutEffect(() => {
173
152
  onMount();
174
153
  return onDestroy;
175
154
  }, []);
176
155
  let clearEl;
177
156
  let disableEl;
178
-
179
157
  if (clearButton) {
180
158
  clearEl = /*#__PURE__*/React.createElement("span", {
181
159
  className: "input-clear-button",
182
160
  onClick: onClearButtonClick
183
161
  });
184
162
  }
185
-
186
163
  if (disableButton) {
187
164
  disableEl = /*#__PURE__*/React.createElement("span", {
188
165
  className: "searchbar-disable-button",
189
166
  onClick: onDisableButtonClick
190
167
  }, disableButtonText);
191
168
  }
192
-
193
169
  const SearchbarTag = form ? 'form' : 'div';
194
170
  const classes = classNames(className, 'searchbar', {
195
171
  'searchbar-inline': inline,
196
- 'no-shadow': noShadow,
197
- 'no-hairline': noHairline,
172
+ 'no-outline': !outline,
198
173
  'searchbar-expandable': expandable
199
174
  }, colorClasses(props));
200
175
  const slots = getSlots(props);
@@ -10,15 +10,12 @@ export interface SegmentedProps {
10
10
  raised ?: boolean;
11
11
  raisedIos ?: boolean;
12
12
  raisedMd ?: boolean;
13
- raisedAurora ?: boolean;
14
13
  round ?: boolean;
15
14
  roundIos ?: boolean;
16
15
  roundMd ?: boolean;
17
- roundAurora ?: boolean;
18
16
  strong ?: boolean;
19
17
  strongIos ?: boolean;
20
18
  strongMd ?: boolean;
21
- strongAurora ?: boolean;
22
19
  tag ?: string;
23
20
  ref?: React.MutableRefObject<{el: HTMLElement | null}>;
24
21
  children?: React.ReactNode;
@@ -1,9 +1,9 @@
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
-
1
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
3
2
  import React, { forwardRef, useRef, useImperativeHandle } from 'react';
4
3
  import { classNames, getExtraAttrs } from '../shared/utils.js';
5
4
  import { colorClasses } from '../shared/mixins.js';
6
5
 
6
+
7
7
  const Segmented = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
9
9
  className,
@@ -13,15 +13,12 @@ const Segmented = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  raised,
14
14
  raisedIos,
15
15
  raisedMd,
16
- raisedAurora,
17
16
  round,
18
17
  roundIos,
19
18
  roundMd,
20
- roundAurora,
21
19
  strong,
22
20
  strongIos,
23
21
  strongMd,
24
- strongAurora,
25
22
  tag = 'div'
26
23
  } = props;
27
24
  const extraAttrs = getExtraAttrs(props);
@@ -33,16 +30,13 @@ const Segmented = /*#__PURE__*/forwardRef((props, ref) => {
33
30
  segmented: true,
34
31
  'segmented-raised': raised,
35
32
  'segmented-raised-ios': raisedIos,
36
- 'segmented-raised-aurora': raisedAurora,
37
33
  'segmented-raised-md': raisedMd,
38
34
  'segmented-round': round,
39
35
  'segmented-round-ios': roundIos,
40
- 'segmented-round-aurora': roundAurora,
41
36
  'segmented-round-md': roundMd,
42
37
  'segmented-strong': strong,
43
38
  'segmented-strong-ios': strongIos,
44
- 'segmented-strong-md': strongMd,
45
- 'segmented-strong-aurora': strongAurora
39
+ 'segmented-strong-md': strongMd
46
40
  }, colorClasses(props));
47
41
  const SegmentedTag = tag;
48
42
  return /*#__PURE__*/React.createElement(SegmentedTag, _extends({
@@ -50,7 +44,7 @@ const Segmented = /*#__PURE__*/forwardRef((props, ref) => {
50
44
  style: style,
51
45
  className: classes,
52
46
  ref: elRef
53
- }, extraAttrs), children, (strong || strongIos || strongMd || strongAurora) && /*#__PURE__*/React.createElement("span", {
47
+ }, extraAttrs), children, (strong || strongIos || strongMd) && /*#__PURE__*/React.createElement("span", {
54
48
  className: "segmented-highlight"
55
49
  }));
56
50
  });