Skip to content

Commit 56dcbaa

Browse files
maslianokmaslianok
authored
Merge pull request #49 from karl-run/master
upgrade to babel 7
2 parents 3c4dfe9 + 0ed2e64 commit 56dcbaa

File tree

8 files changed

+8732
-5600
lines changed

8 files changed

+8732
-5600
lines changed

‎.babelrc

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
{
2-
"presets": ["es2015", "react"]
3-
}
2+
"presets": ["@babel/env", "@babel/react"],
3+
"plugins": ["@babel/plugin-proposal-class-properties"]
4+
}

‎.eslintrc

+2-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
},
99
"rules": {
1010
"max-len": [2, 120],
11-
"react/jsx-filename-extension": 0
11+
"react/jsx-filename-extension": 0,
12+
"react/destructuring-assignment": 0
1213
},
1314
"settings": {
1415
"import/resolve": {

‎examples/package.json

+10-4
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,19 @@
22
"name": "examples",
33
"version": "1.1.0",
44
"private": true,
5+
"browserslist": [
6+
">0.2%",
7+
"not dead",
8+
"not ie <= 11",
9+
"not op_mini all"
10+
],
511
"devDependencies": {
6-
"linklocal": "^2.8.1",
7-
"react-scripts": "^1.1.1"
12+
"linklocal": "^2.8.2",
13+
"react-scripts": "^2.0.5"
814
},
915
"dependencies": {
10-
"react": "^16.2.0",
11-
"react-dom": "^16.2.0",
16+
"react": "^16.5.2",
17+
"react-dom": "^16.5.2",
1218
"react-resize-detector": "file:../"
1319
},
1420
"scripts": {

‎examples/yarn.lock

+6,553-3,889
Large diffs are not rendered by default.

‎lib/index.js

+97-74
Original file line numberDiff line numberDiff line change
@@ -1,182 +1,203 @@
1-
'use strict';
1+
"use strict";
22

33
Object.defineProperty(exports, "__esModule", {
44
value: true
55
});
6-
exports.withResizeDetector = undefined;
6+
exports.default = exports.withResizeDetector = void 0;
77

8-
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8+
var _react = _interopRequireWildcard(require("react"));
99

10-
var _react = require('react');
10+
var _propTypes = _interopRequireDefault(require("prop-types"));
1111

12-
var _react2 = _interopRequireDefault(_react);
12+
var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
1313

14-
var _propTypes = require('prop-types');
14+
var _lodash = _interopRequireDefault(require("lodash.debounce"));
1515

16-
var _propTypes2 = _interopRequireDefault(_propTypes);
16+
var _lodash2 = _interopRequireDefault(require("lodash.throttle"));
1717

18-
var _resizeObserverPolyfill = require('resize-observer-polyfill');
18+
var _lodash3 = _interopRequireDefault(require("lodash.isfunction"));
1919

20-
var _resizeObserverPolyfill2 = _interopRequireDefault(_resizeObserverPolyfill);
20+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
2121

22-
var _lodash = require('lodash.debounce');
22+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
2323

24-
var _lodash2 = _interopRequireDefault(_lodash);
24+
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
2525

26-
var _lodash3 = require('lodash.throttle');
26+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
2727

28-
var _lodash4 = _interopRequireDefault(_lodash3);
28+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
2929

30-
var _lodash5 = require('lodash.isfunction');
30+
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
3131

32-
var _lodash6 = _interopRequireDefault(_lodash5);
32+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
3333

34-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
34+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
3535

36-
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
36+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
3737

38-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
38+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
39+
40+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
3941

40-
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
42+
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
4143

42-
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
44+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
4345

44-
var listMode = { debounce: _lodash2.default, throttle: _lodash4.default };
46+
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
4547

48+
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
49+
50+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
51+
52+
var listMode = {
53+
debounce: _lodash.default,
54+
throttle: _lodash2.default
55+
};
4656
var styles = {
4757
position: 'absolute',
4858
width: 0,
4959
height: 0,
5060
visibility: 'hidden',
5161
display: 'none'
5262
};
53-
5463
/**
5564
* detect component's children and convert them to array
5665
* @param {*} children - component's children
5766
*/
67+
5868
function convertChildrenToArray(children) {
5969
if (!children) return [];
6070
if (!Array.isArray(children)) return [children];
6171
return children;
6272
}
6373

64-
var ResizeDetector = function (_PureComponent) {
74+
var ResizeDetector =
75+
/*#__PURE__*/
76+
function (_PureComponent) {
6577
_inherits(ResizeDetector, _PureComponent);
6678

6779
function ResizeDetector(props) {
80+
var _this;
81+
6882
_classCallCheck(this, ResizeDetector);
6983

70-
var _this = _possibleConstructorReturn(this, (ResizeDetector.__proto__ || Object.getPrototypeOf(ResizeDetector)).call(this, props));
84+
_this = _possibleConstructorReturn(this, _getPrototypeOf(ResizeDetector).call(this, props));
7185

72-
_this.getElement = function () {
86+
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "getElement", function () {
7387
var resizableElementId = _this.props.resizableElementId;
74-
75-
7688
var otherElement = resizableElementId && document.getElementById(resizableElementId);
7789
var parentElement = _this.el && _this.el.parentElement;
78-
7990
var resizableElement = otherElement || parentElement;
80-
8191
return resizableElement;
82-
};
92+
});
8393

84-
_this.createResizeHandler = function (entries) {
94+
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "createResizeHandler", function (entries) {
8595
var _this$props = _this.props,
8696
handleWidth = _this$props.handleWidth,
8797
handleHeight = _this$props.handleHeight,
8898
onResize = _this$props.onResize;
89-
9099
entries.forEach(function (entry) {
91100
var _entry$contentRect = entry.contentRect,
92101
width = _entry$contentRect.width,
93102
height = _entry$contentRect.height;
94-
95103
var notifyWidth = handleWidth && _this.state.width !== width;
96104
var notifyHeight = handleHeight && _this.state.height !== height;
105+
97106
if (!_this.skipOnMount && (notifyWidth || notifyHeight) && typeof window !== 'undefined') {
98107
_this.animationFrameID = window.requestAnimationFrame(function () {
99108
onResize(width, height);
100-
_this.setState({ width: width, height: height });
109+
110+
_this.setState({
111+
width: width,
112+
height: height
113+
});
101114
});
102115
}
116+
103117
_this.skipOnMount = false;
104118
});
105-
};
119+
});
106120

107-
_this.handleRenderProp = function () {
121+
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleRenderProp", function () {
108122
var _this$state = _this.state,
109123
width = _this$state.width,
110124
height = _this$state.height;
111125
var render = _this.props.render;
112126

113127
if (render && typeof render === 'function') {
114-
return (0, _react.cloneElement)(render({ width: width, height: height }), { key: 'render' });
128+
return (0, _react.cloneElement)(render({
129+
width: width,
130+
height: height
131+
}), {
132+
key: 'render'
133+
});
115134
}
116135

117136
return undefined;
118-
};
137+
});
119138

120-
_this.renderChildren = function () {
139+
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "renderChildren", function () {
121140
var _this$state2 = _this.state,
122141
width = _this$state2.width,
123142
height = _this$state2.height;
124143
var children = _this.props.children;
125-
126144
return convertChildrenToArray(children).filter(function (child) {
127145
return !!child;
128146
}).map(function (child, key) {
129-
if ((0, _lodash6.default)(child)) return (0, _react.cloneElement)(child(width, height), { key: key });
130-
if ((0, _react.isValidElement)(child)) return (0, _react.cloneElement)(child, { width: width, height: height, key: key });
147+
if ((0, _lodash3.default)(child)) return (0, _react.cloneElement)(child(width, height), {
148+
key: key
149+
});
150+
if ((0, _react.isValidElement)(child)) return (0, _react.cloneElement)(child, {
151+
width: width,
152+
height: height,
153+
key: key
154+
});
131155
return child;
132156
});
133-
};
157+
});
134158

135159
var skipOnMount = props.skipOnMount,
136160
refreshMode = props.refreshMode,
137161
refreshRate = props.refreshRate;
138-
139-
140162
_this.state = {
141163
width: undefined,
142164
height: undefined
143165
};
144-
145166
_this.skipOnMount = skipOnMount;
146167
_this.animationFrameID = null;
147-
148168
_this.resizeHandler = listMode[refreshMode] && listMode[refreshMode](_this.createResizeHandler, refreshRate) || _this.createResizeHandler;
149-
150-
_this.ro = new _resizeObserverPolyfill2.default(_this.resizeHandler);
169+
_this.ro = new _resizeObserverPolyfill.default(_this.resizeHandler);
151170
return _this;
152171
}
153172

154173
_createClass(ResizeDetector, [{
155-
key: 'componentDidMount',
174+
key: "componentDidMount",
156175
value: function componentDidMount() {
157176
var resizableElement = this.getElement();
158177
if (resizableElement) this.ro.observe(resizableElement);
159178
}
160179
}, {
161-
key: 'componentWillUnmount',
180+
key: "componentWillUnmount",
162181
value: function componentWillUnmount() {
163182
var resizableElement = this.getElement();
164183
if (resizableElement) this.ro.unobserve(resizableElement);
184+
165185
if (typeof window !== 'undefined' && this.animationFrameID) {
166186
window.cancelAnimationFrame(this.animationFrameID);
167187
}
188+
168189
if (this.resizeHandler && this.resizeHandler.cancel) {
169190
// cancel debounced handler
170191
this.resizeHandler.cancel();
171192
}
172193
}
173194
}, {
174-
key: 'render',
195+
key: "render",
175196
value: function render() {
176197
var _this2 = this;
177198

178-
return [_react2.default.createElement('div', {
179-
key: 'resize-detector',
199+
return [_react.default.createElement("div", {
200+
key: "resize-detector",
180201
style: styles,
181202
ref: function ref(el) {
182203
_this2.el = el;
@@ -189,17 +210,17 @@ var ResizeDetector = function (_PureComponent) {
189210
}(_react.PureComponent);
190211

191212
ResizeDetector.propTypes = {
192-
handleWidth: _propTypes2.default.bool,
193-
handleHeight: _propTypes2.default.bool,
194-
skipOnMount: _propTypes2.default.bool,
195-
refreshRate: _propTypes2.default.number,
196-
refreshMode: _propTypes2.default.string,
197-
resizableElementId: _propTypes2.default.string,
198-
onResize: _propTypes2.default.func,
199-
render: _propTypes2.default.func,
200-
children: _propTypes2.default.any // eslint-disable-line react/forbid-prop-types
201-
};
213+
handleWidth: _propTypes.default.bool,
214+
handleHeight: _propTypes.default.bool,
215+
skipOnMount: _propTypes.default.bool,
216+
refreshRate: _propTypes.default.number,
217+
refreshMode: _propTypes.default.string,
218+
resizableElementId: _propTypes.default.string,
219+
onResize: _propTypes.default.func,
220+
render: _propTypes.default.func,
221+
children: _propTypes.default.any // eslint-disable-line react/forbid-prop-types
202222

223+
};
203224
ResizeDetector.defaultProps = {
204225
handleWidth: false,
205226
handleHeight: false,
@@ -214,27 +235,27 @@ ResizeDetector.defaultProps = {
214235
children: null
215236
};
216237

217-
var withResizeDetector = exports.withResizeDetector = function withResizeDetector(WrappedComponent) {
218-
var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { handleWidth: true, handleHeight: true };
238+
var withResizeDetector = function withResizeDetector(WrappedComponent) {
239+
var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
240+
handleWidth: true,
241+
handleHeight: true
242+
};
219243
return (
244+
/*#__PURE__*/
220245
// eslint-disable-next-line
221246
function (_Component) {
222247
_inherits(ResizeDetectorHOC, _Component);
223248

224249
function ResizeDetectorHOC() {
225250
_classCallCheck(this, ResizeDetectorHOC);
226251

227-
return _possibleConstructorReturn(this, (ResizeDetectorHOC.__proto__ || Object.getPrototypeOf(ResizeDetectorHOC)).apply(this, arguments));
252+
return _possibleConstructorReturn(this, _getPrototypeOf(ResizeDetectorHOC).apply(this, arguments));
228253
}
229254

230255
_createClass(ResizeDetectorHOC, [{
231-
key: 'render',
256+
key: "render",
232257
value: function render() {
233-
return _react2.default.createElement(
234-
ResizeDetector,
235-
props,
236-
_react2.default.createElement(WrappedComponent, this.props)
237-
);
258+
return _react.default.createElement(ResizeDetector, props, _react.default.createElement(WrappedComponent, this.props));
238259
}
239260
}]);
240261

@@ -243,4 +264,6 @@ var withResizeDetector = exports.withResizeDetector = function withResizeDetecto
243264
);
244265
};
245266

246-
exports.default = ResizeDetector;
267+
exports.withResizeDetector = withResizeDetector;
268+
var _default = ResizeDetector;
269+
exports.default = _default;

0 commit comments

Comments
 (0)