framework7-react 7.0.9 → 8.0.0-beta.1

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 +6 -20
  49. package/components/list-item.d.ts +0 -1
  50. package/components/list-item.js +5 -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/swiper-slide.d.ts +1 -0
  96. package/components/swiper-slide.js +1 -0
  97. package/components/swiper.d.ts +1 -0
  98. package/components/swiper.js +1 -0
  99. package/components/tab.js +4 -15
  100. package/components/tabs.js +1 -4
  101. package/components/text-editor.js +1 -18
  102. package/components/toggle.js +1 -13
  103. package/components/toolbar.d.ts +2 -6
  104. package/components/toolbar.js +9 -20
  105. package/components/treeview-item.d.ts +0 -1
  106. package/components/treeview-item.js +2 -11
  107. package/components/treeview.js +2 -2
  108. package/components/view.d.ts +0 -6
  109. package/components/view.js +3 -30
  110. package/components/views.js +2 -2
  111. package/framework7-react.d.ts +2 -12
  112. package/framework7-react.js +3 -12
  113. package/package.json +1 -1
  114. package/shared/components-router.js +0 -32
  115. package/shared/f7.js +5 -19
  116. package/shared/get-router-initial-component.js +0 -4
  117. package/shared/mixins.js +2 -8
  118. package/shared/plugin.js +2 -8
  119. package/shared/router-open-in.js +4 -15
  120. package/shared/tabbar-context.js +1 -1
  121. package/shared/use-icon.js +1 -6
  122. package/shared/use-isomorphic-layout-effect.js +0 -2
  123. package/shared/use-route-props.js +0 -1
  124. package/shared/use-smart-select.js +0 -3
  125. package/shared/use-store.js +4 -8
  126. package/shared/use-tab.js +0 -4
  127. package/shared/use-theme.js +0 -2
  128. package/shared/use-tooltip.js +0 -5
  129. package/shared/utils.js +0 -18
  130. package/shared/watch-prop.js +0 -1
  131. package/components/appbar.d.ts +0 -28
  132. package/components/appbar.js +0 -45
  133. package/components/col.d.ts +0 -36
  134. package/components/col.js +0 -75
  135. package/components/list-item-cell.d.ts +0 -23
  136. package/components/list-item-cell.js +0 -28
  137. package/components/list-item-row.d.ts +0 -23
  138. package/components/list-item-row.js +0 -28
  139. package/components/menu-dropdown-item.d.ts +0 -68
  140. package/components/menu-dropdown-item.js +0 -59
  141. package/components/menu-dropdown.d.ts +0 -28
  142. package/components/menu-dropdown.js +0 -42
  143. package/components/menu-item.d.ts +0 -81
  144. package/components/menu-item.js +0 -101
  145. package/components/menu.d.ts +0 -23
  146. package/components/menu.js +0 -30
  147. package/components/row.d.ts +0 -31
  148. package/components/row.js +0 -64
@@ -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, getSlots } 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 Sheet = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const f7Sheet = useRef(null);
14
14
  const {
@@ -35,45 +35,36 @@ const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
35
35
  const elRef = useRef(null);
36
36
  const isOpened = useRef(opened);
37
37
  const isClosing = useRef(false);
38
-
39
38
  const onStepProgress = (instance, progress) => {
40
39
  emit(props, 'sheetStepProgress', instance, progress);
41
40
  };
42
-
43
41
  const onStepOpen = instance => {
44
42
  emit(props, 'sheetStepOpen', instance);
45
43
  };
46
-
47
44
  const onStepClose = instance => {
48
45
  emit(props, 'sheetStepClose', instance);
49
46
  };
50
-
51
47
  const onOpen = instance => {
52
48
  isOpened.current = true;
53
49
  isClosing.current = false;
54
50
  emit(props, 'sheetOpen', instance);
55
51
  };
56
-
57
52
  const onOpened = instance => {
58
53
  emit(props, 'sheetOpened', instance);
59
54
  };
60
-
61
55
  const onClose = instance => {
62
56
  isOpened.current = false;
63
57
  isClosing.current = true;
64
58
  emit(props, 'sheetClose', instance);
65
59
  };
66
-
67
60
  const onClosed = instance => {
68
61
  isClosing.current = false;
69
62
  emit(props, 'sheetClosed', instance);
70
63
  };
71
-
72
64
  useImperativeHandle(ref, () => ({
73
65
  el: elRef.current,
74
66
  f7Sheet: () => f7Sheet.current
75
67
  }));
76
-
77
68
  const modalEvents = method => {
78
69
  if (!f7Sheet.current) return;
79
70
  f7Sheet.current[method]('open', onOpen);
@@ -84,7 +75,6 @@ const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
84
75
  f7Sheet.current[method]('stepClose', onStepClose);
85
76
  f7Sheet.current[method]('stepProgress', onStepProgress);
86
77
  };
87
-
88
78
  const onMount = () => {
89
79
  if (!elRef.current) return;
90
80
  const sheetParams = {
@@ -103,21 +93,17 @@ const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
103
93
  f7ready(() => {
104
94
  f7Sheet.current = f7.sheet.create(sheetParams);
105
95
  modalEvents('on');
106
-
107
96
  if (opened) {
108
97
  f7Sheet.current.open(false);
109
98
  }
110
99
  });
111
100
  };
112
-
113
101
  const onDestroy = () => {
114
102
  if (f7Sheet.current) {
115
103
  f7Sheet.current.destroy();
116
104
  }
117
-
118
105
  f7Sheet.current = null;
119
106
  };
120
-
121
107
  useIsomorphicLayoutEffect(() => {
122
108
  modalEvents('on');
123
109
  return () => {
@@ -130,7 +116,6 @@ const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
130
116
  }, []);
131
117
  watchProp(opened, value => {
132
118
  if (!f7Sheet.current) return;
133
-
134
119
  if (value) {
135
120
  f7Sheet.current.open();
136
121
  } else {
@@ -142,26 +127,21 @@ const Sheet = /*#__PURE__*/forwardRef((props, ref) => {
142
127
  const staticList = [];
143
128
  const fixedTags = 'navbar toolbar tabbar subnavbar searchbar messagebar fab list-index panel'.split(' ').map(tagName => `f7-${tagName}`);
144
129
  const slotsDefault = slots.default;
145
-
146
130
  if (slotsDefault && slotsDefault.length) {
147
131
  slotsDefault.forEach(child => {
148
132
  if (typeof child === 'undefined') return;
149
133
  let isFixedTag = false;
150
134
  const tag = child.type && (child.type.displayName || child.type.name);
151
-
152
135
  if (!tag) {
153
136
  staticList.push(child);
154
137
  return;
155
138
  }
156
-
157
139
  if (fixedTags.indexOf(tag) >= 0) {
158
140
  isFixedTag = true;
159
141
  }
160
-
161
142
  if (isFixedTag) fixedList.push(child);else staticList.push(child);
162
143
  });
163
144
  }
164
-
165
145
  const innerEl = /*#__PURE__*/React.createElement("div", {
166
146
  className: "sheet-modal-inner"
167
147
  }, staticList, slots.static);
@@ -31,23 +31,18 @@ export interface StepperProps {
31
31
  round ?: boolean;
32
32
  roundMd ?: boolean;
33
33
  roundIos ?: boolean;
34
- roundAurora ?: boolean;
35
34
  fill ?: boolean;
36
35
  fillMd ?: boolean;
37
36
  fillIos ?: boolean;
38
- fillAurora ?: boolean;
39
37
  large ?: boolean;
40
38
  largeMd ?: boolean;
41
39
  largeIos ?: boolean;
42
- largeAurora ?: boolean;
43
40
  small ?: boolean;
44
41
  smallMd ?: boolean;
45
42
  smallIos ?: boolean;
46
- smallAurora ?: boolean;
47
43
  raised ?: boolean;
48
44
  raisedMd ?: boolean;
49
45
  raisedIos ?: boolean;
50
- raisedAurora ?: boolean;
51
46
  color?: string;
52
47
  colorTheme?: string;
53
48
  textColor?: string;
@@ -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, noUndefinedProps } from '../shared/utils.js';
@@ -36,65 +35,50 @@ const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
36
35
  round,
37
36
  roundMd,
38
37
  roundIos,
39
- roundAurora,
40
38
  fill,
41
39
  fillMd,
42
40
  fillIos,
43
- fillAurora,
44
41
  large,
45
42
  largeMd,
46
43
  largeIos,
47
- largeAurora,
48
44
  small,
49
45
  smallMd,
50
46
  smallIos,
51
- smallAurora,
52
47
  raised,
53
48
  raisedMd,
54
- raisedIos,
55
- raisedAurora
49
+ raisedIos
56
50
  } = props;
57
51
  const extraAttrs = getExtraAttrs(props);
58
52
  const elRef = useRef(null);
59
-
60
53
  const increment = () => {
61
54
  if (!f7Stepper.current) return;
62
55
  f7Stepper.current.increment();
63
56
  };
64
-
65
57
  const decrement = () => {
66
58
  if (!f7Stepper.current) return;
67
59
  f7Stepper.current.decrement();
68
60
  };
69
-
70
61
  const setValue = newValue => {
71
62
  if (f7Stepper.current && f7Stepper.current.setValue) f7Stepper.current.setValue(newValue);
72
63
  };
73
-
74
64
  const getValue = () => {
75
65
  if (f7Stepper.current && f7Stepper.current.getValue) {
76
66
  return f7Stepper.current.getValue();
77
67
  }
78
-
79
68
  return undefined;
80
69
  };
81
-
82
70
  const onInput = event => {
83
71
  emit(props, 'input', event, f7Stepper.current);
84
72
  };
85
-
86
73
  const onChange = event => {
87
74
  emit(props, 'change', event, f7Stepper.current);
88
75
  };
89
-
90
76
  const onMinusClick = event => {
91
77
  emit(props, 'stepperMinusClick', event, f7Stepper.current);
92
78
  };
93
-
94
79
  const onPlusClick = event => {
95
80
  emit(props, 'stepperPlusClick', event, f7Stepper.current);
96
81
  };
97
-
98
82
  useImperativeHandle(ref, () => ({
99
83
  el: elRef.current,
100
84
  f7Stepper: () => f7Stepper.current,
@@ -107,16 +91,13 @@ const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
107
91
  if (!f7Stepper.current) return;
108
92
  f7Stepper.current.setValue(newValue);
109
93
  });
110
-
111
94
  const onStepperChange = (stepper, newValue) => {
112
95
  emit(props, 'stepperChange', newValue);
113
96
  };
114
-
115
97
  const stepperEvents = method => {
116
98
  if (!f7Stepper.current) return;
117
99
  f7Stepper.current[method]('change', onStepperChange);
118
100
  };
119
-
120
101
  const onMount = () => {
121
102
  f7ready(() => {
122
103
  if (!init || !elRef.current) return;
@@ -137,15 +118,12 @@ const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
137
118
  stepperEvents('on');
138
119
  });
139
120
  };
140
-
141
121
  const onDestroy = () => {
142
122
  if (f7Stepper.current && f7Stepper.current.destroy) {
143
123
  f7Stepper.current.destroy();
144
124
  }
145
-
146
125
  f7Stepper.current = null;
147
126
  };
148
-
149
127
  useIsomorphicLayoutEffect(() => {
150
128
  stepperEvents('on');
151
129
  return () => {
@@ -158,7 +136,6 @@ const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
158
136
  }, []);
159
137
  let inputWrapEl;
160
138
  let valueEl;
161
-
162
139
  if (input && !buttonsOnly) {
163
140
  const inputEl = /*#__PURE__*/React.createElement("input", {
164
141
  name: name,
@@ -176,35 +153,28 @@ const Stepper = /*#__PURE__*/forwardRef((props, ref) => {
176
153
  className: "stepper-input-wrap"
177
154
  }, inputEl);
178
155
  }
179
-
180
156
  if (!input && !buttonsOnly) {
181
157
  valueEl = /*#__PURE__*/React.createElement("div", {
182
158
  className: "stepper-value"
183
159
  }, value);
184
160
  }
185
-
186
161
  const classes = classNames(className, 'stepper', {
187
162
  disabled,
188
163
  'stepper-round': round,
189
164
  'stepper-round-ios': roundIos,
190
165
  'stepper-round-md': roundMd,
191
- 'stepper-round-aurora': roundAurora,
192
166
  'stepper-fill': fill,
193
167
  'stepper-fill-ios': fillIos,
194
168
  'stepper-fill-md': fillMd,
195
- 'stepper-fill-aurora': fillAurora,
196
169
  'stepper-large': large,
197
170
  'stepper-large-ios': largeIos,
198
171
  'stepper-large-md': largeMd,
199
- 'stepper-large-aurora': largeAurora,
200
172
  'stepper-small': small,
201
173
  'stepper-small-ios': smallIos,
202
174
  'stepper-small-md': smallMd,
203
- 'stepper-small-aurora': smallAurora,
204
175
  'stepper-raised': raised,
205
176
  'stepper-raised-ios': raisedIos,
206
- 'stepper-raised-md': raisedMd,
207
- 'stepper-raised-aurora': raisedAurora
177
+ 'stepper-raised-md': raisedMd
208
178
  }, colorClasses(props));
209
179
  return /*#__PURE__*/React.createElement("div", _extends({
210
180
  ref: elRef,
@@ -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 Subnavbar = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
9
9
  className,
@@ -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 SwipeoutActions = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
9
9
  className,
@@ -20,12 +20,10 @@ const SwipeoutActions = /*#__PURE__*/forwardRef((props, ref) => {
20
20
  el: elRef.current
21
21
  }));
22
22
  let sideComputed = side;
23
-
24
23
  if (!sideComputed) {
25
24
  if (left) sideComputed = 'left';
26
25
  if (right) sideComputed = 'right';
27
26
  }
28
-
29
27
  const classes = classNames(className, `swipeout-actions-${sideComputed}`, colorClasses(props));
30
28
  return /*#__PURE__*/React.createElement("div", _extends({
31
29
  id: id,
@@ -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 SwipeoutButton = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  const {
9
9
  className,
@@ -20,11 +20,9 @@ const SwipeoutButton = /*#__PURE__*/forwardRef((props, ref) => {
20
20
  } = props;
21
21
  const extraAttrs = getExtraAttrs(props);
22
22
  const elRef = useRef(null);
23
-
24
23
  const onClick = e => {
25
24
  emit(props, 'click', e);
26
25
  };
27
-
28
26
  useImperativeHandle(ref, () => ({
29
27
  el: elRef.current
30
28
  }));
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { SwiperSlide } from 'swiper/react';
2
3
 
3
4
  export default SwiperSlide;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { SwiperSlide } from 'swiper/react';
2
3
  export default SwiperSlide;
@@ -1,3 +1,4 @@
1
+ // eslint-disable-next-line
1
2
  import { Swiper } from 'swiper/react';
2
3
 
3
4
  export default Swiper;
@@ -1,2 +1,3 @@
1
+ // eslint-disable-next-line
1
2
  import { Swiper } from 'swiper/react';
2
3
  export default Swiper;
package/components/tab.js CHANGED
@@ -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, useState, useContext } from 'react';
4
3
  import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
5
4
  import { classNames, getExtraAttrs, getComponentId } from '../shared/utils.js';
@@ -9,6 +8,7 @@ import { useTab } from '../shared/use-tab.js';
9
8
  import { RouterContext } from '../shared/router-context.js';
10
9
  import { useAsyncComponent } from '../shared/use-async-component.js';
11
10
 
11
+
12
12
  const Tab = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const {
14
14
  className,
@@ -22,21 +22,20 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
22
22
  const routerData = useRef(null);
23
23
  const routerContext = useContext(RouterContext);
24
24
  let initialTabContent = null;
25
-
26
25
  if (!routerData.current && routerContext && routerContext.route && routerContext.route.route && routerContext.route.route.tab && routerContext.route.route.tab.id === id) {
27
26
  const {
28
27
  component,
29
28
  asyncComponent,
30
29
  options: tabRouteOptions
31
30
  } = routerContext.route.route.tab;
32
-
33
31
  if (component || asyncComponent) {
34
32
  const parentProps = routerContext.route.route.options && routerContext.route.route.options.props;
35
33
  initialTabContent = {
36
34
  id: getComponentId(),
37
35
  component: component || asyncComponent,
38
36
  isAsync: !!asyncComponent,
39
- props: { ...(parentProps || {}),
37
+ props: {
38
+ ...(parentProps || {}),
40
39
  ...(tabRouteOptions && tabRouteOptions.props || {}),
41
40
  f7router: routerContext.router,
42
41
  f7route: routerContext.route,
@@ -45,24 +44,20 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
45
44
  };
46
45
  }
47
46
  }
48
-
49
47
  const [tabContent, setTabContent] = useState(initialTabContent || null);
50
48
  useImperativeHandle(ref, () => ({
51
49
  el: elRef.current
52
50
  }));
53
-
54
51
  if (f7 && !routerData.current) {
55
52
  routerData.current = {
56
53
  setTabContent
57
54
  };
58
55
  f7routers.tabs.push(routerData.current);
59
56
  }
60
-
61
57
  const onMount = () => {
62
58
  if (elRef.current && initialTabContent) {
63
59
  elRef.current.f7RouterTabLoaded = true;
64
60
  }
65
-
66
61
  f7ready(() => {
67
62
  if (!routerData.current) {
68
63
  routerData.current = {
@@ -75,13 +70,11 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
75
70
  }
76
71
  });
77
72
  };
78
-
79
73
  const onDestroy = () => {
80
74
  if (!routerData.current) return;
81
75
  f7routers.tabs.splice(f7routers.tabs.indexOf(routerData.current), 1);
82
76
  routerData.current = null;
83
77
  };
84
-
85
78
  useIsomorphicLayoutEffect(() => {
86
79
  onMount();
87
80
  return onDestroy;
@@ -94,20 +87,16 @@ const Tab = /*#__PURE__*/forwardRef((props, ref) => {
94
87
  const classes = classNames(className, 'tab', {
95
88
  'tab-active': tabActive
96
89
  }, colorClasses(props));
97
-
98
90
  const renderChildren = () => {
99
91
  if (!tabContent) return children;
100
-
101
92
  if (tabContent.isAsync) {
102
93
  return useAsyncComponent(tabContent.component, tabContent.props, tabContent.id);
103
94
  }
104
-
105
95
  const TabContent = tabContent.component;
106
96
  return /*#__PURE__*/React.createElement(TabContent, _extends({
107
97
  key: tabContent.id
108
98
  }, tabContent.props));
109
99
  };
110
-
111
100
  return /*#__PURE__*/React.createElement("div", _extends({
112
101
  id: id,
113
102
  style: style,
@@ -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 } from '../shared/utils.js';
@@ -36,7 +35,6 @@ const Tabs = /*#__PURE__*/forwardRef((props, ref) => {
36
35
  tabs: true,
37
36
  'tabs-routable': routable
38
37
  });
39
-
40
38
  if (animated || swipeable) {
41
39
  return /*#__PURE__*/React.createElement("div", _extends({
42
40
  id: id,
@@ -47,7 +45,6 @@ const Tabs = /*#__PURE__*/forwardRef((props, ref) => {
47
45
  className: tabsClasses
48
46
  }, children));
49
47
  }
50
-
51
48
  return /*#__PURE__*/React.createElement("div", _extends({
52
49
  id: id,
53
50
  style: style,
@@ -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';
@@ -27,51 +26,39 @@ const TextEditor = /*#__PURE__*/forwardRef((props, ref) => {
27
26
  } = props;
28
27
  const extraAttrs = getExtraAttrs(props);
29
28
  const elRef = useRef(null);
30
-
31
29
  const onChange = (editor, editorValue) => {
32
30
  emit(props, 'textEditorChange', editorValue);
33
31
  };
34
-
35
32
  const onInput = (editor, editorValue) => {
36
33
  emit(props, 'textEditorInput', editorValue);
37
34
  };
38
-
39
35
  const onFocus = () => {
40
36
  emit(props, 'textEditorFocus');
41
37
  };
42
-
43
38
  const onBlur = () => {
44
39
  emit(props, 'textEditorBlur');
45
40
  };
46
-
47
41
  const onButtonClick = (editor, button) => {
48
42
  emit(props, 'textEditorButtonClick', button);
49
43
  };
50
-
51
44
  const onKeyboardOpen = () => {
52
45
  emit(props, 'textEditorKeyboardOpen');
53
46
  };
54
-
55
47
  const onKeyboardClose = () => {
56
48
  emit(props, 'textEditorKeyboardClose');
57
49
  };
58
-
59
50
  const onPopoverOpen = () => {
60
51
  emit(props, 'textEditorPopoverOpen');
61
52
  };
62
-
63
53
  const onPopoverClose = () => {
64
54
  emit(props, 'textEditorPopoverClose');
65
55
  };
66
-
67
56
  const onInsertLink = (editor, url) => {
68
57
  emit(props, 'textEditorInsertLink', url);
69
58
  };
70
-
71
59
  const onInsertImage = (editor, url) => {
72
60
  emit(props, 'textEditorInsertImage', url);
73
61
  };
74
-
75
62
  useImperativeHandle(ref, () => ({
76
63
  el: elRef.current,
77
64
  f7TextEditor: () => f7TextEditor.current
@@ -81,7 +68,6 @@ const TextEditor = /*#__PURE__*/forwardRef((props, ref) => {
81
68
  f7TextEditor.current.setValue(newValue);
82
69
  }
83
70
  });
84
-
85
71
  const onMount = () => {
86
72
  const params = noUndefinedProps({
87
73
  el: elRef.current,
@@ -112,15 +98,12 @@ const TextEditor = /*#__PURE__*/forwardRef((props, ref) => {
112
98
  f7TextEditor.current = f7.textEditor.create(params);
113
99
  });
114
100
  };
115
-
116
101
  const onDestroy = () => {
117
102
  if (f7TextEditor.current && f7TextEditor.current.destroy) {
118
103
  f7TextEditor.current.destroy();
119
104
  }
120
-
121
105
  f7TextEditor.current = null;
122
106
  };
123
-
124
107
  useIsomorphicLayoutEffect(() => {
125
108
  onMount();
126
109
  return onDestroy;
@@ -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';
@@ -26,11 +25,9 @@ const Toggle = /*#__PURE__*/forwardRef((props, ref) => {
26
25
  const extraAttrs = getExtraAttrs(props);
27
26
  const elRef = useRef(null);
28
27
  const inputElRef = useRef(null);
29
-
30
28
  const onChange = event => {
31
29
  emit(props, 'change', event);
32
30
  };
33
-
34
31
  useImperativeHandle(ref, () => ({
35
32
  el: elRef.current,
36
33
  f7Toggle: () => f7Toggle.current
@@ -40,16 +37,13 @@ const Toggle = /*#__PURE__*/forwardRef((props, ref) => {
40
37
  if (!f7Toggle.current) return;
41
38
  f7Toggle.current.checked = newValue;
42
39
  });
43
-
44
40
  const onToggleChange = toggleInstance => {
45
41
  emit(props, 'toggleChange', toggleInstance.checked);
46
42
  };
47
-
48
43
  const toggleEvents = method => {
49
44
  if (!f7Toggle.current) return;
50
45
  f7Toggle.current[method]('toggleChange', onToggleChange);
51
46
  };
52
-
53
47
  const onMount = () => {
54
48
  f7ready(() => {
55
49
  if (!init || !elRef.current) return;
@@ -59,25 +53,19 @@ const Toggle = /*#__PURE__*/forwardRef((props, ref) => {
59
53
  toggleEvents('on');
60
54
  });
61
55
  };
62
-
63
56
  const onDestroy = () => {
64
57
  if (f7Toggle.current && f7Toggle.current.destroy && f7Toggle.current.$el) {
65
58
  f7Toggle.current.destroy();
66
59
  }
67
-
68
60
  f7Toggle.current = null;
69
61
  };
70
-
71
62
  useIsomorphicLayoutEffect(() => {
72
63
  toggleEvents('on');
73
-
74
64
  if (inputElRef.current) {
75
65
  inputElRef.current.addEventListener('change', onChange);
76
66
  }
77
-
78
67
  return () => {
79
68
  toggleEvents('off');
80
-
81
69
  if (inputElRef.current) {
82
70
  inputElRef.current.removeEventListener('change', onChange);
83
71
  }
@@ -8,20 +8,16 @@ export interface ToolbarProps {
8
8
  className?: string;
9
9
  style?: React.CSSProperties;
10
10
  tabbar ?: boolean;
11
- labels ?: boolean;
11
+ icons ?: boolean;
12
12
  scrollable ?: boolean;
13
13
  hidden ?: boolean;
14
- noShadow ?: boolean;
15
- noHairline ?: boolean;
16
- noBorder ?: boolean;
14
+ outline ?: boolean;
17
15
  position ?: string;
18
16
  topMd ?: boolean;
19
17
  topIos ?: boolean;
20
- topAurora ?: boolean;
21
18
  top ?: boolean;
22
19
  bottomMd ?: boolean;
23
20
  bottomIos ?: boolean;
24
- bottomAurora ?: boolean;
25
21
  bottom ?: boolean;
26
22
  inner ?: boolean;
27
23
  color?: string;