@tarojs/components 3.6.0-canary.7 → 3.6.0-canary.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/taro-tabbar.cjs.entry.js.map +1 -1
- package/dist/esm/taro-tabbar.entry.js.map +1 -1
- package/dist/esm-es5/taro-tabbar.entry.js.map +1 -1
- package/dist/react/component-lib/index.js +20 -10
- package/dist/react/component-lib/input.js +2 -3
- package/dist/react/component-lib/reactify-wc.js +6 -43
- package/dist/react/components.js +0 -2
- package/dist/react/react-component-lib/createComponent.js +9 -29
- package/dist/react/react-component-lib/createOverlayComponent.js +2 -29
- package/dist/react/react-component-lib/utils/attachProps.js +9 -18
- package/dist/react/react-component-lib/utils/index.js +0 -2
- package/dist/taro-components/p-49a6cae4.system.entry.js.map +1 -1
- package/dist/taro-components/p-e0d6b00b.entry.js.map +1 -1
- package/dist/vue2/component-lib/components.js +22 -11
- package/dist/vue2/component-lib/createFormsComponent.js +0 -5
- package/dist/vue2/component-lib/index.js +6 -8
- package/dist/vue2/component-lib/mixins/refs.js +0 -5
- package/dist/vue2/components.js +0 -3
- package/dist/vue2/index.js +3 -7
- package/dist/vue2/vue-component-lib/utils.js +0 -1
- package/dist/vue3/component-lib/createComponent.js +1 -1
- package/dist/vue3/component-lib/createFormsComponent.js +3 -8
- package/dist/vue3/component-lib/forwardRef.js +0 -2
- package/dist/vue3/component-lib/icon.js +2 -2
- package/dist/vue3/component-lib/image.js +2 -2
- package/dist/vue3/component-lib/index.js +22 -11
- package/dist/vue3/component-lib/scroll-view.js +2 -2
- package/dist/vue3/component-lib/text.js +2 -2
- package/dist/vue3/components.js +0 -2
- package/dist/vue3/index.js +2 -4
- package/dist/vue3/vue-component-lib/utils.js +7 -29
- package/package.json +4 -4
- package/types/Button.d.ts +1 -1
- package/types/Camera.d.ts +1 -1
- package/types/Checkbox.d.ts +1 -1
- package/types/CheckboxGroup.d.ts +1 -1
- package/types/CoverImage.d.ts +1 -1
- package/types/CustomWrapper.d.ts +1 -0
- package/types/Form.d.ts +1 -1
- package/types/Icon.d.ts +1 -1
- package/types/Image.d.ts +1 -1
- package/types/Input.d.ts +15 -1
- package/types/Label.d.ts +1 -1
- package/types/NativeSlot.d.ts +1 -0
- package/types/NavigationBar.d.ts +2 -1
- package/types/Navigator.d.ts +1 -1
- package/types/Picker.d.ts +1 -1
- package/types/PickerView.d.ts +1 -1
- package/types/PickerViewColumn.d.ts +1 -1
- package/types/Progress.d.ts +1 -1
- package/types/Radio.d.ts +1 -1
- package/types/RadioGroup.d.ts +1 -1
- package/types/RichText.d.ts +1 -1
- package/types/ScrollView.d.ts +1 -1
- package/types/ShareElement.d.ts +3 -3
- package/types/Slider.d.ts +1 -1
- package/types/Slot.d.ts +2 -1
- package/types/Swiper.d.ts +1 -1
- package/types/SwiperItem.d.ts +1 -1
- package/types/Switch.d.ts +1 -1
- package/types/Textarea.d.ts +1 -1
- package/types/Video.d.ts +1 -1
- package/types/View.d.ts +1 -1
- package/types/WebView.d.ts +1 -1
- package/virtual-list/index.js +3 -2
|
@@ -2,16 +2,15 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import reactifyWc from './reactify-wc';
|
|
4
4
|
var Input = reactifyWc('taro-input-core');
|
|
5
|
-
var h = React.createElement;
|
|
5
|
+
var h = React.createElement;
|
|
6
6
|
|
|
7
|
+
// eslint-disable-next-line react/display-name
|
|
7
8
|
export default /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
8
9
|
var args = _objectSpread({}, props);
|
|
9
|
-
|
|
10
10
|
if (args.hasOwnProperty('focus')) {
|
|
11
11
|
args.autoFocus = Boolean(args.focus);
|
|
12
12
|
delete args.focus;
|
|
13
13
|
}
|
|
14
|
-
|
|
15
14
|
return h(Input, _objectSpread(_objectSpread({}, args), {}, {
|
|
16
15
|
ref: ref
|
|
17
16
|
}));
|
|
@@ -8,7 +8,6 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
|
8
8
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
10
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
11
|
-
|
|
12
11
|
/**
|
|
13
12
|
* https://github.com/BBKolton/reactify-wc/
|
|
14
13
|
* modified event naming
|
|
@@ -16,8 +15,9 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
|
16
15
|
import React, { createElement, createRef } from 'react';
|
|
17
16
|
var h = React.createElement;
|
|
18
17
|
var SCROLL_VIEW = 'taro-scroll-view-core';
|
|
19
|
-
var IS_NON_DIMENSIONAL = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;
|
|
18
|
+
var IS_NON_DIMENSIONAL = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;
|
|
20
19
|
|
|
20
|
+
// 为了不要覆盖 wc 中 host 内置的 class 和 stencil 加入的 class
|
|
21
21
|
function getClassName(wc, prevProps, props) {
|
|
22
22
|
var classList = Array.from(wc.classList);
|
|
23
23
|
var oldClassNames = (prevProps.className || prevProps.class || '').split(' ');
|
|
@@ -36,7 +36,6 @@ function getClassName(wc, prevProps, props) {
|
|
|
36
36
|
finalClassNames = [].concat(_toConsumableArray(finalClassNames), _toConsumableArray(incomingClassNames));
|
|
37
37
|
return finalClassNames.join(' ');
|
|
38
38
|
}
|
|
39
|
-
|
|
40
39
|
function updateStyle(dom, key, val) {
|
|
41
40
|
if (/^--/.test(key)) {
|
|
42
41
|
// css variable
|
|
@@ -47,32 +46,26 @@ function updateStyle(dom, key, val) {
|
|
|
47
46
|
dom.style[key] = val + 'px';
|
|
48
47
|
}
|
|
49
48
|
}
|
|
50
|
-
|
|
51
49
|
function updateProp(ctx, comp, propKey, prevProps, props) {
|
|
52
50
|
var dom = ctx.ref.current;
|
|
53
51
|
var val = props[propKey];
|
|
54
52
|
var prevVal = prevProps ? prevProps[propKey] : undefined;
|
|
55
|
-
|
|
56
53
|
if (propKey === 'children') {
|
|
57
54
|
return;
|
|
58
55
|
}
|
|
59
|
-
|
|
60
56
|
if (propKey.toLowerCase() === 'classname') {
|
|
61
57
|
dom.className = prevProps ? getClassName(dom, prevProps, props) : val;
|
|
62
58
|
return;
|
|
63
59
|
}
|
|
64
|
-
|
|
65
60
|
if (propKey === 'style') {
|
|
66
61
|
if (typeof val === 'string') {
|
|
67
62
|
dom.setAttribute(propKey, val);
|
|
68
63
|
return;
|
|
69
64
|
}
|
|
70
|
-
|
|
71
65
|
if (!val) {
|
|
72
66
|
dom.removeAttribute(propKey);
|
|
73
67
|
return;
|
|
74
68
|
}
|
|
75
|
-
|
|
76
69
|
if (prevProps) {
|
|
77
70
|
if (typeof prevVal === 'string') {
|
|
78
71
|
dom.style.cssText = '';
|
|
@@ -82,87 +75,66 @@ function updateProp(ctx, comp, propKey, prevProps, props) {
|
|
|
82
75
|
}
|
|
83
76
|
}
|
|
84
77
|
}
|
|
85
|
-
|
|
86
78
|
for (var _styleKey in val) {
|
|
87
79
|
updateStyle(dom, _styleKey, val[_styleKey]);
|
|
88
80
|
}
|
|
89
|
-
|
|
90
81
|
return;
|
|
91
82
|
}
|
|
92
|
-
|
|
93
83
|
if (/^data-.+/.test(propKey)) {
|
|
94
84
|
dom.setAttribute(propKey, val);
|
|
95
85
|
}
|
|
96
|
-
|
|
97
86
|
if (comp === SCROLL_VIEW) {
|
|
98
87
|
if (propKey === 'scrollTop') {
|
|
99
88
|
dom.mpScrollTop = val;
|
|
100
89
|
return;
|
|
101
90
|
}
|
|
102
|
-
|
|
103
91
|
if (propKey === 'scrollLeft') {
|
|
104
92
|
dom.mpScrollLeft = val;
|
|
105
93
|
return;
|
|
106
94
|
}
|
|
107
|
-
|
|
108
95
|
if (propKey === 'scrollIntoView') {
|
|
109
96
|
dom.mpScrollIntoView = val;
|
|
110
97
|
return;
|
|
111
98
|
}
|
|
112
99
|
}
|
|
113
|
-
|
|
114
100
|
if (typeof val === 'function' && propKey.match(/^on[A-Z]/)) {
|
|
115
101
|
var event = propKey.substr(2).toLowerCase();
|
|
116
102
|
ctx.eventHandlers.push([event, val]);
|
|
117
103
|
return dom.addEventListener(event, val);
|
|
118
104
|
}
|
|
119
|
-
|
|
120
105
|
if (typeof val === 'string' || typeof val === 'number') {
|
|
121
106
|
dom.setAttribute(propKey, val);
|
|
122
107
|
dom[propKey] = val;
|
|
123
108
|
return;
|
|
124
109
|
}
|
|
125
|
-
|
|
126
110
|
if (typeof val === 'boolean') {
|
|
127
111
|
if (val) {
|
|
128
112
|
dom[propKey] = true;
|
|
129
113
|
return dom.setAttribute(propKey, val);
|
|
130
114
|
}
|
|
131
|
-
|
|
132
115
|
dom[propKey] = false;
|
|
133
116
|
return dom.removeAttribute(propKey);
|
|
134
117
|
}
|
|
135
|
-
|
|
136
118
|
dom[propKey] = val;
|
|
137
119
|
}
|
|
138
|
-
|
|
139
120
|
var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
140
121
|
var Index = /*#__PURE__*/function (_React$Component) {
|
|
141
122
|
_inherits(Index, _React$Component);
|
|
142
|
-
|
|
143
123
|
var _super = _createSuper(Index);
|
|
144
|
-
|
|
145
124
|
function Index(props) {
|
|
146
125
|
var _this;
|
|
147
|
-
|
|
148
126
|
_classCallCheck(this, Index);
|
|
149
|
-
|
|
150
127
|
_this = _super.call(this, props);
|
|
151
|
-
|
|
152
128
|
_defineProperty(_assertThisInitialized(_this), "eventHandlers", void 0);
|
|
153
|
-
|
|
154
129
|
_defineProperty(_assertThisInitialized(_this), "ref", void 0);
|
|
155
|
-
|
|
156
130
|
_this.eventHandlers = [];
|
|
157
131
|
_this.ref = /*#__PURE__*/createRef();
|
|
158
132
|
return _this;
|
|
159
133
|
}
|
|
160
|
-
|
|
161
134
|
_createClass(Index, [{
|
|
162
135
|
key: "update",
|
|
163
136
|
value: function update(prevProps) {
|
|
164
137
|
var _this2 = this;
|
|
165
|
-
|
|
166
138
|
this.clearEventHandlers();
|
|
167
139
|
if (!this.ref.current) return;
|
|
168
140
|
Object.keys(prevProps || {}).forEach(function (key) {
|
|
@@ -183,7 +155,6 @@ var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
|
183
155
|
key: "componentDidMount",
|
|
184
156
|
value: function componentDidMount() {
|
|
185
157
|
var forwardRef = this.props.forwardRef;
|
|
186
|
-
|
|
187
158
|
if (typeof forwardRef === 'function') {
|
|
188
159
|
forwardRef(this.ref.current);
|
|
189
160
|
} else if (forwardRef && _typeof(forwardRef) === 'object' && forwardRef.hasOwnProperty('current')) {
|
|
@@ -191,7 +162,6 @@ var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
|
191
162
|
} else if (typeof forwardRef === 'string') {
|
|
192
163
|
console.warn('内置组件不支持字符串 ref');
|
|
193
164
|
}
|
|
194
|
-
|
|
195
165
|
this.update(undefined);
|
|
196
166
|
}
|
|
197
167
|
}, {
|
|
@@ -203,14 +173,11 @@ var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
|
203
173
|
key: "clearEventHandlers",
|
|
204
174
|
value: function clearEventHandlers() {
|
|
205
175
|
var _this3 = this;
|
|
206
|
-
|
|
207
176
|
this.eventHandlers.forEach(function (_ref) {
|
|
208
177
|
var _ref2 = _slicedToArray(_ref, 2),
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
178
|
+
event = _ref2[0],
|
|
179
|
+
handler = _ref2[1];
|
|
212
180
|
if (!_this3.ref.current) return;
|
|
213
|
-
|
|
214
181
|
_this3.ref.current.removeEventListener(event, handler);
|
|
215
182
|
});
|
|
216
183
|
this.eventHandlers = [];
|
|
@@ -219,8 +186,8 @@ var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
|
219
186
|
key: "render",
|
|
220
187
|
value: function render() {
|
|
221
188
|
var _this$props = this.props,
|
|
222
|
-
|
|
223
|
-
|
|
189
|
+
children = _this$props.children,
|
|
190
|
+
dangerouslySetInnerHTML = _this$props.dangerouslySetInnerHTML;
|
|
224
191
|
var props = {
|
|
225
192
|
ref: this.ref
|
|
226
193
|
};
|
|
@@ -228,16 +195,12 @@ var reactifyWebComponent = function reactifyWebComponent(WC) {
|
|
|
228
195
|
return /*#__PURE__*/createElement(WC, props, children);
|
|
229
196
|
}
|
|
230
197
|
}]);
|
|
231
|
-
|
|
232
198
|
return Index;
|
|
233
199
|
}(React.Component); // eslint-disable-next-line react/display-name
|
|
234
|
-
|
|
235
|
-
|
|
236
200
|
return /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
237
201
|
return h(Index, _objectSpread(_objectSpread({}, props), {}, {
|
|
238
202
|
forwardRef: ref
|
|
239
203
|
}));
|
|
240
204
|
});
|
|
241
205
|
};
|
|
242
|
-
|
|
243
206
|
export default reactifyWebComponent;
|
package/dist/react/components.js
CHANGED
|
@@ -14,30 +14,20 @@ export var createReactComponent = function createReactComponent(tagName, ReactCo
|
|
|
14
14
|
if (defineCustomElement !== undefined) {
|
|
15
15
|
defineCustomElement();
|
|
16
16
|
}
|
|
17
|
-
|
|
18
17
|
var displayName = dashToPascalCase(tagName);
|
|
19
|
-
|
|
20
18
|
var ReactComponent = /*#__PURE__*/function (_React$Component) {
|
|
21
19
|
_inherits(ReactComponent, _React$Component);
|
|
22
|
-
|
|
23
20
|
var _super = _createSuper(ReactComponent);
|
|
24
|
-
|
|
25
21
|
function ReactComponent(props) {
|
|
26
22
|
var _this;
|
|
27
|
-
|
|
28
23
|
_classCallCheck(this, ReactComponent);
|
|
29
|
-
|
|
30
24
|
_this = _super.call(this, props);
|
|
31
|
-
|
|
32
25
|
_defineProperty(_assertThisInitialized(_this), "componentEl", void 0);
|
|
33
|
-
|
|
34
26
|
_defineProperty(_assertThisInitialized(_this), "setComponentElRef", function (element) {
|
|
35
27
|
_this.componentEl = element;
|
|
36
28
|
});
|
|
37
|
-
|
|
38
29
|
return _this;
|
|
39
30
|
}
|
|
40
|
-
|
|
41
31
|
_createClass(ReactComponent, [{
|
|
42
32
|
key: "componentDidMount",
|
|
43
33
|
value: function componentDidMount() {
|
|
@@ -52,19 +42,16 @@ export var createReactComponent = function createReactComponent(tagName, ReactCo
|
|
|
52
42
|
key: "render",
|
|
53
43
|
value: function render() {
|
|
54
44
|
var _this$props = this.props,
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
45
|
+
children = _this$props.children,
|
|
46
|
+
forwardedRef = _this$props.forwardedRef,
|
|
47
|
+
style = _this$props.style,
|
|
48
|
+
className = _this$props.className,
|
|
49
|
+
ref = _this$props.ref,
|
|
50
|
+
cProps = _objectWithoutProperties(_this$props, _excluded);
|
|
62
51
|
var propsToPass = Object.keys(cProps).reduce(function (acc, name) {
|
|
63
52
|
var value = cProps[name];
|
|
64
|
-
|
|
65
53
|
if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
|
|
66
54
|
var eventName = name.substring(2).toLowerCase();
|
|
67
|
-
|
|
68
55
|
if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {
|
|
69
56
|
acc[name] = value;
|
|
70
57
|
}
|
|
@@ -72,23 +59,20 @@ export var createReactComponent = function createReactComponent(tagName, ReactCo
|
|
|
72
59
|
// we should only render strings, booleans, and numbers as attrs in html.
|
|
73
60
|
// objects, functions, arrays etc get synced via properties on mount.
|
|
74
61
|
var type = _typeof(value);
|
|
75
|
-
|
|
76
62
|
if (type === 'string' || type === 'boolean' || type === 'number') {
|
|
77
63
|
acc[camelToDashCase(name)] = value;
|
|
78
64
|
}
|
|
79
65
|
}
|
|
80
|
-
|
|
81
66
|
return acc;
|
|
82
67
|
}, {});
|
|
83
|
-
|
|
84
68
|
if (manipulatePropsFunction) {
|
|
85
69
|
propsToPass = manipulatePropsFunction(this.props, propsToPass);
|
|
86
70
|
}
|
|
87
|
-
|
|
88
71
|
var newProps = _objectSpread(_objectSpread({}, propsToPass), {}, {
|
|
89
72
|
ref: mergeRefs(forwardedRef, this.setComponentElRef),
|
|
90
73
|
style: style
|
|
91
74
|
});
|
|
75
|
+
|
|
92
76
|
/**
|
|
93
77
|
* We use createElement here instead of
|
|
94
78
|
* React.createElement to work around a
|
|
@@ -96,8 +80,6 @@ export var createReactComponent = function createReactComponent(tagName, ReactCo
|
|
|
96
80
|
* React.createElement causes all elements to be rendered
|
|
97
81
|
* as <tagname> instead of the actual Web Component.
|
|
98
82
|
*/
|
|
99
|
-
|
|
100
|
-
|
|
101
83
|
return /*#__PURE__*/createElement(tagName, newProps, children);
|
|
102
84
|
}
|
|
103
85
|
}], [{
|
|
@@ -106,14 +88,12 @@ export var createReactComponent = function createReactComponent(tagName, ReactCo
|
|
|
106
88
|
return displayName;
|
|
107
89
|
}
|
|
108
90
|
}]);
|
|
109
|
-
|
|
110
91
|
return ReactComponent;
|
|
111
|
-
}(React.Component);
|
|
112
|
-
|
|
92
|
+
}(React.Component);
|
|
113
93
|
|
|
94
|
+
// If context was passed to createReactComponent then conditionally add it to the Component Class
|
|
114
95
|
if (ReactComponentContext) {
|
|
115
96
|
ReactComponent.contextType = ReactComponentContext;
|
|
116
97
|
}
|
|
117
|
-
|
|
118
98
|
return createForwardRef(ReactComponent, displayName);
|
|
119
99
|
};
|
|
@@ -21,31 +21,21 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
21
21
|
var willDismissEventName = "on".concat(displayName, "WillDismiss");
|
|
22
22
|
var willPresentEventName = "on".concat(displayName, "WillPresent");
|
|
23
23
|
var isDismissing = false;
|
|
24
|
-
|
|
25
24
|
var Overlay = /*#__PURE__*/function (_React$Component) {
|
|
26
25
|
_inherits(Overlay, _React$Component);
|
|
27
|
-
|
|
28
26
|
var _super = _createSuper(Overlay);
|
|
29
|
-
|
|
30
27
|
function Overlay(props) {
|
|
31
28
|
var _this;
|
|
32
|
-
|
|
33
29
|
_classCallCheck(this, Overlay);
|
|
34
|
-
|
|
35
30
|
_this = _super.call(this, props);
|
|
36
|
-
|
|
37
31
|
_defineProperty(_assertThisInitialized(_this), "overlay", void 0);
|
|
38
|
-
|
|
39
32
|
_defineProperty(_assertThisInitialized(_this), "el", void 0);
|
|
40
|
-
|
|
41
33
|
if (typeof document !== 'undefined') {
|
|
42
34
|
_this.el = document.createElement('div');
|
|
43
35
|
}
|
|
44
|
-
|
|
45
36
|
_this.handleDismiss = _this.handleDismiss.bind(_assertThisInitialized(_this));
|
|
46
37
|
return _this;
|
|
47
38
|
}
|
|
48
|
-
|
|
49
39
|
_createClass(Overlay, [{
|
|
50
40
|
key: "componentDidMount",
|
|
51
41
|
value: function componentDidMount() {
|
|
@@ -66,7 +56,6 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
66
56
|
if (this.props.onDidDismiss) {
|
|
67
57
|
this.props.onDidDismiss(event);
|
|
68
58
|
}
|
|
69
|
-
|
|
70
59
|
setRef(this.props.forwardedRef, null);
|
|
71
60
|
}
|
|
72
61
|
}, {
|
|
@@ -76,7 +65,6 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
76
65
|
if (this.overlay && nextProps.isOpen !== this.props.isOpen && nextProps.isOpen === false) {
|
|
77
66
|
isDismissing = true;
|
|
78
67
|
}
|
|
79
|
-
|
|
80
68
|
return true;
|
|
81
69
|
}
|
|
82
70
|
}, {
|
|
@@ -90,29 +78,24 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
90
78
|
if (this.overlay) {
|
|
91
79
|
attachProps(this.overlay, this.props, prevProps);
|
|
92
80
|
}
|
|
93
|
-
|
|
94
81
|
if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen === true) {
|
|
95
82
|
this.present(prevProps);
|
|
96
83
|
}
|
|
97
|
-
|
|
98
84
|
if (!(this.overlay && prevProps.isOpen !== this.props.isOpen && this.props.isOpen === false)) {
|
|
99
85
|
_context.next = 7;
|
|
100
86
|
break;
|
|
101
87
|
}
|
|
102
|
-
|
|
103
88
|
_context.next = 5;
|
|
104
89
|
return this.overlay.dismiss();
|
|
105
|
-
|
|
106
90
|
case 5:
|
|
107
91
|
isDismissing = false;
|
|
92
|
+
|
|
108
93
|
/**
|
|
109
94
|
* Now that the overlay is dismissed
|
|
110
95
|
* we need to render again so that any
|
|
111
96
|
* inner components will be unmounted
|
|
112
97
|
*/
|
|
113
|
-
|
|
114
98
|
this.forceUpdate();
|
|
115
|
-
|
|
116
99
|
case 7:
|
|
117
100
|
case "end":
|
|
118
101
|
return _context.stop();
|
|
@@ -120,11 +103,9 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
120
103
|
}
|
|
121
104
|
}, _callee, this);
|
|
122
105
|
}));
|
|
123
|
-
|
|
124
106
|
function componentDidUpdate(_x) {
|
|
125
107
|
return _componentDidUpdate.apply(this, arguments);
|
|
126
108
|
}
|
|
127
|
-
|
|
128
109
|
return componentDidUpdate;
|
|
129
110
|
}()
|
|
130
111
|
}, {
|
|
@@ -132,10 +113,8 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
132
113
|
value: function () {
|
|
133
114
|
var _present = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(prevProps) {
|
|
134
115
|
var _this2 = this,
|
|
135
|
-
|
|
136
|
-
|
|
116
|
+
_objectSpread2;
|
|
137
117
|
var _this$props, children, isOpen, onDidDismiss, onDidPresent, onWillDismiss, onWillPresent, cProps, elementProps;
|
|
138
|
-
|
|
139
118
|
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
140
119
|
while (1) {
|
|
141
120
|
switch (_context2.prev = _context2.next) {
|
|
@@ -155,14 +134,12 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
155
134
|
component: this.el,
|
|
156
135
|
componentProps: {}
|
|
157
136
|
}));
|
|
158
|
-
|
|
159
137
|
case 4:
|
|
160
138
|
this.overlay = _context2.sent;
|
|
161
139
|
setRef(this.props.forwardedRef, this.overlay);
|
|
162
140
|
attachProps(this.overlay, elementProps, prevProps);
|
|
163
141
|
_context2.next = 9;
|
|
164
142
|
return this.overlay.present();
|
|
165
|
-
|
|
166
143
|
case 9:
|
|
167
144
|
case "end":
|
|
168
145
|
return _context2.stop();
|
|
@@ -170,11 +147,9 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
170
147
|
}
|
|
171
148
|
}, _callee2, this);
|
|
172
149
|
}));
|
|
173
|
-
|
|
174
150
|
function present(_x2) {
|
|
175
151
|
return _present.apply(this, arguments);
|
|
176
152
|
}
|
|
177
|
-
|
|
178
153
|
return present;
|
|
179
154
|
}()
|
|
180
155
|
}, {
|
|
@@ -193,10 +168,8 @@ export var createOverlayComponent = function createOverlayComponent(tagName, con
|
|
|
193
168
|
return displayName;
|
|
194
169
|
}
|
|
195
170
|
}]);
|
|
196
|
-
|
|
197
171
|
return Overlay;
|
|
198
172
|
}(React.Component);
|
|
199
|
-
|
|
200
173
|
return /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
201
174
|
return /*#__PURE__*/_jsx(Overlay, _objectSpread(_objectSpread({}, props), {}, {
|
|
202
175
|
forwardedRef: ref
|
|
@@ -2,33 +2,26 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
|
2
2
|
import { camelToDashCase } from './case';
|
|
3
3
|
export var attachProps = function attachProps(node, newProps) {
|
|
4
4
|
var oldProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
5
|
-
|
|
6
5
|
// some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first
|
|
7
6
|
if (node instanceof Element) {
|
|
8
7
|
// add any classes in className to the class list
|
|
9
8
|
var className = getClassName(node.classList, newProps, oldProps);
|
|
10
|
-
|
|
11
9
|
if (className !== '') {
|
|
12
10
|
node.className = className;
|
|
13
11
|
}
|
|
14
|
-
|
|
15
12
|
Object.keys(newProps).forEach(function (name) {
|
|
16
13
|
if (name === 'children' || name === 'style' || name === 'ref' || name === 'class' || name === 'className' || name === 'forwardedRef') {
|
|
17
14
|
return;
|
|
18
15
|
}
|
|
19
|
-
|
|
20
16
|
if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
|
|
21
17
|
var eventName = name.substring(2);
|
|
22
18
|
var eventNameLc = eventName.toLowerCase();
|
|
23
|
-
|
|
24
19
|
if (!isCoveredByReact(eventNameLc)) {
|
|
25
20
|
syncEvent(node, eventNameLc, newProps[name]);
|
|
26
21
|
}
|
|
27
22
|
} else {
|
|
28
23
|
node[name] = newProps[name];
|
|
29
|
-
|
|
30
24
|
var propType = _typeof(newProps[name]);
|
|
31
|
-
|
|
32
25
|
if (propType === 'string') {
|
|
33
26
|
node.setAttribute(camelToDashCase(name), newProps[name]);
|
|
34
27
|
}
|
|
@@ -38,14 +31,14 @@ export var attachProps = function attachProps(node, newProps) {
|
|
|
38
31
|
};
|
|
39
32
|
export var getClassName = function getClassName(classList, newProps, oldProps) {
|
|
40
33
|
var newClassProp = newProps.className || newProps.class;
|
|
41
|
-
var oldClassProp = oldProps.className || oldProps.class;
|
|
42
|
-
|
|
34
|
+
var oldClassProp = oldProps.className || oldProps.class;
|
|
35
|
+
// map the classes to Maps for performance
|
|
43
36
|
var currentClasses = arrayToMap(classList);
|
|
44
37
|
var incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);
|
|
45
38
|
var oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);
|
|
46
|
-
var finalClassNames = [];
|
|
39
|
+
var finalClassNames = [];
|
|
40
|
+
// loop through each of the current classes on the component
|
|
47
41
|
// to see if it should be a part of the classNames added
|
|
48
|
-
|
|
49
42
|
currentClasses.forEach(function (currentClass) {
|
|
50
43
|
if (incomingPropClasses.has(currentClass)) {
|
|
51
44
|
// add it as its already included in classnames coming in from newProps
|
|
@@ -61,43 +54,41 @@ export var getClassName = function getClassName(classList, newProps, oldProps) {
|
|
|
61
54
|
});
|
|
62
55
|
return finalClassNames.join(' ');
|
|
63
56
|
};
|
|
57
|
+
|
|
64
58
|
/**
|
|
65
59
|
* Checks if an event is supported in the current execution environment.
|
|
66
60
|
* @license Modernizr 3.0.0pre (Custom Build) | MIT
|
|
67
61
|
*/
|
|
68
|
-
|
|
69
62
|
export var isCoveredByReact = function isCoveredByReact(eventNameSuffix) {
|
|
70
63
|
if (typeof document === 'undefined') {
|
|
71
64
|
return true;
|
|
72
65
|
} else {
|
|
73
66
|
var eventName = 'on' + eventNameSuffix;
|
|
74
67
|
var isSupported = (eventName in document);
|
|
75
|
-
|
|
76
68
|
if (!isSupported) {
|
|
77
69
|
var element = document.createElement('div');
|
|
78
70
|
element.setAttribute(eventName, 'return;');
|
|
79
71
|
isSupported = typeof element[eventName] === 'function';
|
|
80
72
|
}
|
|
81
|
-
|
|
82
73
|
return isSupported;
|
|
83
74
|
}
|
|
84
75
|
};
|
|
85
76
|
export var syncEvent = function syncEvent(node, eventName, newEventHandler) {
|
|
86
77
|
var eventStore = node.__events || (node.__events = {});
|
|
87
|
-
var oldEventHandler = eventStore[eventName];
|
|
78
|
+
var oldEventHandler = eventStore[eventName];
|
|
88
79
|
|
|
80
|
+
// Remove old listener so they don't double up.
|
|
89
81
|
if (oldEventHandler) {
|
|
90
82
|
node.removeEventListener(eventName, oldEventHandler);
|
|
91
|
-
}
|
|
92
|
-
|
|
83
|
+
}
|
|
93
84
|
|
|
85
|
+
// Bind new listener.
|
|
94
86
|
node.addEventListener(eventName, eventStore[eventName] = function handler(e) {
|
|
95
87
|
if (newEventHandler) {
|
|
96
88
|
newEventHandler.call(this, e);
|
|
97
89
|
}
|
|
98
90
|
});
|
|
99
91
|
};
|
|
100
|
-
|
|
101
92
|
var arrayToMap = function arrayToMap(arr) {
|
|
102
93
|
var map = new Map();
|
|
103
94
|
arr.forEach(function (s) {
|
|
@@ -13,7 +13,6 @@ export var mergeRefs = function mergeRefs() {
|
|
|
13
13
|
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
14
14
|
refs[_key] = arguments[_key];
|
|
15
15
|
}
|
|
16
|
-
|
|
17
16
|
return function (value) {
|
|
18
17
|
refs.forEach(function (ref) {
|
|
19
18
|
setRef(ref, value);
|
|
@@ -26,7 +25,6 @@ export var createForwardRef = function createForwardRef(ReactComponent, displayN
|
|
|
26
25
|
forwardedRef: ref
|
|
27
26
|
}));
|
|
28
27
|
};
|
|
29
|
-
|
|
30
28
|
forwardRef.displayName = displayName;
|
|
31
29
|
return /*#__PURE__*/React.forwardRef(forwardRef);
|
|
32
30
|
};
|