react-split-pane 0.1.84 → 0.1.89

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/index.cjs.js CHANGED
@@ -1,194 +1,37 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
6
 
5
7
  var React = _interopDefault(require('react'));
6
8
  var PropTypes = _interopDefault(require('prop-types'));
7
- var Prefixer = _interopDefault(require('inline-style-prefixer'));
8
9
  var stylePropType = _interopDefault(require('react-style-proptype'));
10
+ var reactLifecyclesCompat = require('react-lifecycles-compat');
9
11
 
10
- /**
11
- * Copyright (c) 2013-present, Facebook, Inc.
12
- *
13
- * This source code is licensed under the MIT license found in the
14
- * LICENSE file in the root directory of this source tree.
15
- */
16
-
17
- function componentWillMount() {
18
- // Call this.constructor.gDSFP to support sub-classes.
19
- var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
20
- if (state !== null && state !== undefined) {
21
- this.setState(state);
22
- }
23
- }
24
-
25
- function componentWillReceiveProps(nextProps) {
26
- // Call this.constructor.gDSFP to support sub-classes.
27
- // Use the setState() updater to ensure state isn't stale in certain edge cases.
28
- function updater(prevState) {
29
- var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);
30
- return state !== null && state !== undefined ? state : null;
12
+ function _classCallCheck(instance, Constructor) {
13
+ if (!(instance instanceof Constructor)) {
14
+ throw new TypeError("Cannot call a class as a function");
31
15
  }
32
- // Binding "this" is important for shallow renderer support.
33
- this.setState(updater.bind(this));
34
16
  }
35
17
 
36
- function componentWillUpdate(nextProps, nextState) {
37
- try {
38
- var prevProps = this.props;
39
- var prevState = this.state;
40
- this.props = nextProps;
41
- this.state = nextState;
42
- this.__reactInternalSnapshotFlag = true;
43
- this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(
44
- prevProps,
45
- prevState
46
- );
47
- } finally {
48
- this.props = prevProps;
49
- this.state = prevState;
18
+ function _defineProperties(target, props) {
19
+ for (var i = 0; i < props.length; i++) {
20
+ var descriptor = props[i];
21
+ descriptor.enumerable = descriptor.enumerable || false;
22
+ descriptor.configurable = true;
23
+ if ("value" in descriptor) descriptor.writable = true;
24
+ Object.defineProperty(target, descriptor.key, descriptor);
50
25
  }
51
26
  }
52
27
 
53
- // React may warn about cWM/cWRP/cWU methods being deprecated.
54
- // Add a flag to suppress these warnings for this special case.
55
- componentWillMount.__suppressDeprecationWarning = true;
56
- componentWillReceiveProps.__suppressDeprecationWarning = true;
57
- componentWillUpdate.__suppressDeprecationWarning = true;
58
-
59
- function polyfill(Component) {
60
- var prototype = Component.prototype;
61
-
62
- if (!prototype || !prototype.isReactComponent) {
63
- throw new Error('Can only polyfill class components');
64
- }
65
-
66
- if (
67
- typeof Component.getDerivedStateFromProps !== 'function' &&
68
- typeof prototype.getSnapshotBeforeUpdate !== 'function'
69
- ) {
70
- return Component;
71
- }
72
-
73
- // If new component APIs are defined, "unsafe" lifecycles won't be called.
74
- // Error if any of these lifecycles are present,
75
- // Because they would work differently between older and newer (16.3+) versions of React.
76
- var foundWillMountName = null;
77
- var foundWillReceivePropsName = null;
78
- var foundWillUpdateName = null;
79
- if (typeof prototype.componentWillMount === 'function') {
80
- foundWillMountName = 'componentWillMount';
81
- } else if (typeof prototype.UNSAFE_componentWillMount === 'function') {
82
- foundWillMountName = 'UNSAFE_componentWillMount';
83
- }
84
- if (typeof prototype.componentWillReceiveProps === 'function') {
85
- foundWillReceivePropsName = 'componentWillReceiveProps';
86
- } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {
87
- foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
88
- }
89
- if (typeof prototype.componentWillUpdate === 'function') {
90
- foundWillUpdateName = 'componentWillUpdate';
91
- } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {
92
- foundWillUpdateName = 'UNSAFE_componentWillUpdate';
93
- }
94
- if (
95
- foundWillMountName !== null ||
96
- foundWillReceivePropsName !== null ||
97
- foundWillUpdateName !== null
98
- ) {
99
- var componentName = Component.displayName || Component.name;
100
- var newApiName =
101
- typeof Component.getDerivedStateFromProps === 'function'
102
- ? 'getDerivedStateFromProps()'
103
- : 'getSnapshotBeforeUpdate()';
104
-
105
- throw Error(
106
- 'Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' +
107
- componentName +
108
- ' uses ' +
109
- newApiName +
110
- ' but also contains the following legacy lifecycles:' +
111
- (foundWillMountName !== null ? '\n ' + foundWillMountName : '') +
112
- (foundWillReceivePropsName !== null
113
- ? '\n ' + foundWillReceivePropsName
114
- : '') +
115
- (foundWillUpdateName !== null ? '\n ' + foundWillUpdateName : '') +
116
- '\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' +
117
- 'https://fb.me/react-async-component-lifecycle-hooks'
118
- );
119
- }
120
-
121
- // React <= 16.2 does not support static getDerivedStateFromProps.
122
- // As a workaround, use cWM and cWRP to invoke the new static lifecycle.
123
- // Newer versions of React will ignore these lifecycles if gDSFP exists.
124
- if (typeof Component.getDerivedStateFromProps === 'function') {
125
- prototype.componentWillMount = componentWillMount;
126
- prototype.componentWillReceiveProps = componentWillReceiveProps;
127
- }
128
-
129
- // React <= 16.2 does not support getSnapshotBeforeUpdate.
130
- // As a workaround, use cWU to invoke the new lifecycle.
131
- // Newer versions of React will ignore that lifecycle if gSBU exists.
132
- if (typeof prototype.getSnapshotBeforeUpdate === 'function') {
133
- if (typeof prototype.componentDidUpdate !== 'function') {
134
- throw new Error(
135
- 'Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype'
136
- );
137
- }
138
-
139
- prototype.componentWillUpdate = componentWillUpdate;
140
-
141
- var componentDidUpdate = prototype.componentDidUpdate;
142
-
143
- prototype.componentDidUpdate = function componentDidUpdatePolyfill(
144
- prevProps,
145
- prevState,
146
- maybeSnapshot
147
- ) {
148
- // 16.3+ will not execute our will-update method;
149
- // It will pass a snapshot value to did-update though.
150
- // Older versions will require our polyfilled will-update value.
151
- // We need to handle both cases, but can't just check for the presence of "maybeSnapshot",
152
- // Because for <= 15.x versions this might be a "prevContext" object.
153
- // We also can't just check "__reactInternalSnapshot",
154
- // Because get-snapshot might return a falsy value.
155
- // So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.
156
- var snapshot = this.__reactInternalSnapshotFlag
157
- ? this.__reactInternalSnapshot
158
- : maybeSnapshot;
159
-
160
- componentDidUpdate.call(this, prevProps, prevState, snapshot);
161
- };
162
- }
163
-
164
- return Component;
28
+ function _createClass(Constructor, protoProps, staticProps) {
29
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
30
+ if (staticProps) _defineProperties(Constructor, staticProps);
31
+ return Constructor;
165
32
  }
166
33
 
167
- var classCallCheck = function (instance, Constructor) {
168
- if (!(instance instanceof Constructor)) {
169
- throw new TypeError("Cannot call a class as a function");
170
- }
171
- };
172
-
173
- var createClass = function () {
174
- function defineProperties(target, props) {
175
- for (var i = 0; i < props.length; i++) {
176
- var descriptor = props[i];
177
- descriptor.enumerable = descriptor.enumerable || false;
178
- descriptor.configurable = true;
179
- if ("value" in descriptor) descriptor.writable = true;
180
- Object.defineProperty(target, descriptor.key, descriptor);
181
- }
182
- }
183
-
184
- return function (Constructor, protoProps, staticProps) {
185
- if (protoProps) defineProperties(Constructor.prototype, protoProps);
186
- if (staticProps) defineProperties(Constructor, staticProps);
187
- return Constructor;
188
- };
189
- }();
190
-
191
- var defineProperty = function (obj, key, value) {
34
+ function _defineProperty(obj, key, value) {
192
35
  if (key in obj) {
193
36
  Object.defineProperty(obj, key, {
194
37
  value: value,
@@ -201,63 +44,101 @@ var defineProperty = function (obj, key, value) {
201
44
  }
202
45
 
203
46
  return obj;
204
- };
47
+ }
205
48
 
206
- var inherits = function (subClass, superClass) {
49
+ function _objectSpread(target) {
50
+ for (var i = 1; i < arguments.length; i++) {
51
+ var source = arguments[i] != null ? arguments[i] : {};
52
+ var ownKeys = Object.keys(source);
53
+
54
+ if (typeof Object.getOwnPropertySymbols === 'function') {
55
+ ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
56
+ return Object.getOwnPropertyDescriptor(source, sym).enumerable;
57
+ }));
58
+ }
59
+
60
+ ownKeys.forEach(function (key) {
61
+ _defineProperty(target, key, source[key]);
62
+ });
63
+ }
64
+
65
+ return target;
66
+ }
67
+
68
+ function _inherits(subClass, superClass) {
207
69
  if (typeof superClass !== "function" && superClass !== null) {
208
- throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
70
+ throw new TypeError("Super expression must either be null or a function");
209
71
  }
210
72
 
211
73
  subClass.prototype = Object.create(superClass && superClass.prototype, {
212
74
  constructor: {
213
75
  value: subClass,
214
- enumerable: false,
215
76
  writable: true,
216
77
  configurable: true
217
78
  }
218
79
  });
219
- if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
220
- };
80
+ if (superClass) _setPrototypeOf(subClass, superClass);
81
+ }
82
+
83
+ function _getPrototypeOf(o) {
84
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
85
+ return o.__proto__ || Object.getPrototypeOf(o);
86
+ };
87
+ return _getPrototypeOf(o);
88
+ }
89
+
90
+ function _setPrototypeOf(o, p) {
91
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
92
+ o.__proto__ = p;
93
+ return o;
94
+ };
95
+
96
+ return _setPrototypeOf(o, p);
97
+ }
221
98
 
222
- var possibleConstructorReturn = function (self, call) {
223
- if (!self) {
99
+ function _assertThisInitialized(self) {
100
+ if (self === void 0) {
224
101
  throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
225
102
  }
226
103
 
227
- return call && (typeof call === "object" || typeof call === "function") ? call : self;
228
- };
104
+ return self;
105
+ }
229
106
 
230
- var DEFAULT_USER_AGENT = 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.2 (KHTML, like Gecko) Safari/537.2';
231
- var USER_AGENT = typeof navigator !== 'undefined' ? navigator.userAgent : DEFAULT_USER_AGENT;
107
+ function _possibleConstructorReturn(self, call) {
108
+ if (call && (typeof call === "object" || typeof call === "function")) {
109
+ return call;
110
+ }
232
111
 
233
- var Pane = function (_React$PureComponent) {
234
- inherits(Pane, _React$PureComponent);
112
+ return _assertThisInitialized(self);
113
+ }
114
+
115
+ var Pane =
116
+ /*#__PURE__*/
117
+ function (_React$PureComponent) {
118
+ _inherits(Pane, _React$PureComponent);
235
119
 
236
120
  function Pane() {
237
- classCallCheck(this, Pane);
238
- return possibleConstructorReturn(this, (Pane.__proto__ || Object.getPrototypeOf(Pane)).apply(this, arguments));
121
+ _classCallCheck(this, Pane);
122
+
123
+ return _possibleConstructorReturn(this, _getPrototypeOf(Pane).apply(this, arguments));
239
124
  }
240
125
 
241
- createClass(Pane, [{
242
- key: 'render',
126
+ _createClass(Pane, [{
127
+ key: "render",
243
128
  value: function render() {
244
- var _props = this.props,
245
- children = _props.children,
246
- className = _props.className,
247
- prefixer = _props.prefixer,
248
- split = _props.split,
249
- styleProps = _props.style,
250
- size = _props.size,
251
- eleRef = _props.eleRef;
252
-
253
-
129
+ var _this$props = this.props,
130
+ children = _this$props.children,
131
+ className = _this$props.className,
132
+ split = _this$props.split,
133
+ styleProps = _this$props.style,
134
+ size = _this$props.size,
135
+ eleRef = _this$props.eleRef;
254
136
  var classes = ['Pane', split, className];
255
-
256
- var style = Object.assign({}, styleProps || {}, {
137
+ var style = {
257
138
  flex: 1,
258
139
  position: 'relative',
259
140
  outline: 'none'
260
- });
141
+ };
261
142
 
262
143
  if (size !== undefined) {
263
144
  if (split === 'vertical') {
@@ -266,95 +147,94 @@ var Pane = function (_React$PureComponent) {
266
147
  style.height = size;
267
148
  style.display = 'flex';
268
149
  }
150
+
269
151
  style.flex = 'none';
270
152
  }
271
153
 
272
- return React.createElement(
273
- 'div',
274
- {
275
- ref: eleRef,
276
- className: classes.join(' '),
277
- style: prefixer.prefix(style)
278
- },
279
- children
280
- );
154
+ style = Object.assign({}, style, styleProps || {});
155
+ return React.createElement("div", {
156
+ ref: eleRef,
157
+ className: classes.join(' '),
158
+ style: style
159
+ }, children);
281
160
  }
282
161
  }]);
162
+
283
163
  return Pane;
284
164
  }(React.PureComponent);
285
165
 
286
166
  Pane.propTypes = {
287
167
  className: PropTypes.string.isRequired,
288
168
  children: PropTypes.node.isRequired,
289
- prefixer: PropTypes.instanceOf(Prefixer).isRequired,
290
169
  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
291
170
  split: PropTypes.oneOf(['vertical', 'horizontal']),
292
171
  style: stylePropType,
293
172
  eleRef: PropTypes.func
294
173
  };
174
+ Pane.defaultProps = {};
295
175
 
296
- Pane.defaultProps = {
297
- prefixer: new Prefixer({ userAgent: USER_AGENT })
298
- };
299
-
300
- var DEFAULT_USER_AGENT$1 = 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.2 (KHTML, like Gecko) Safari/537.2';
301
- var USER_AGENT$1 = typeof navigator !== 'undefined' ? navigator.userAgent : DEFAULT_USER_AGENT$1;
302
176
  var RESIZER_DEFAULT_CLASSNAME = 'Resizer';
303
177
 
304
- var Resizer = function (_React$Component) {
305
- inherits(Resizer, _React$Component);
178
+ var Resizer =
179
+ /*#__PURE__*/
180
+ function (_React$Component) {
181
+ _inherits(Resizer, _React$Component);
306
182
 
307
183
  function Resizer() {
308
- classCallCheck(this, Resizer);
309
- return possibleConstructorReturn(this, (Resizer.__proto__ || Object.getPrototypeOf(Resizer)).apply(this, arguments));
184
+ _classCallCheck(this, Resizer);
185
+
186
+ return _possibleConstructorReturn(this, _getPrototypeOf(Resizer).apply(this, arguments));
310
187
  }
311
188
 
312
- createClass(Resizer, [{
313
- key: 'render',
189
+ _createClass(Resizer, [{
190
+ key: "render",
314
191
  value: function render() {
315
- var _props = this.props,
316
- className = _props.className,
317
- _onClick = _props.onClick,
318
- _onDoubleClick = _props.onDoubleClick,
319
- _onMouseDown = _props.onMouseDown,
320
- _onTouchEnd = _props.onTouchEnd,
321
- _onTouchStart = _props.onTouchStart,
322
- prefixer = _props.prefixer,
323
- resizerClassName = _props.resizerClassName,
324
- split = _props.split,
325
- style = _props.style;
326
-
192
+ var _this$props = this.props,
193
+ className = _this$props.className,
194
+ _onClick = _this$props.onClick,
195
+ _onDoubleClick = _this$props.onDoubleClick,
196
+ _onMouseDown = _this$props.onMouseDown,
197
+ _onTouchEnd = _this$props.onTouchEnd,
198
+ _onTouchStart = _this$props.onTouchStart,
199
+ resizerClassName = _this$props.resizerClassName,
200
+ split = _this$props.split,
201
+ style = _this$props.style;
327
202
  var classes = [resizerClassName, split, className];
328
-
329
- return React.createElement('span', {
203
+ return React.createElement("span", {
204
+ role: "presentation",
330
205
  className: classes.join(' '),
331
- style: prefixer.prefix(style) || {},
206
+ style: style,
332
207
  onMouseDown: function onMouseDown(event) {
333
208
  return _onMouseDown(event);
334
209
  },
335
210
  onTouchStart: function onTouchStart(event) {
336
211
  event.preventDefault();
212
+
337
213
  _onTouchStart(event);
338
214
  },
339
215
  onTouchEnd: function onTouchEnd(event) {
340
216
  event.preventDefault();
217
+
341
218
  _onTouchEnd(event);
342
219
  },
343
220
  onClick: function onClick(event) {
344
221
  if (_onClick) {
345
222
  event.preventDefault();
223
+
346
224
  _onClick(event);
347
225
  }
348
226
  },
349
227
  onDoubleClick: function onDoubleClick(event) {
350
228
  if (_onDoubleClick) {
351
229
  event.preventDefault();
230
+
352
231
  _onDoubleClick(event);
353
232
  }
354
233
  }
355
234
  });
356
235
  }
357
236
  }]);
237
+
358
238
  return Resizer;
359
239
  }(React.Component);
360
240
 
@@ -365,27 +245,20 @@ Resizer.propTypes = {
365
245
  onMouseDown: PropTypes.func.isRequired,
366
246
  onTouchStart: PropTypes.func.isRequired,
367
247
  onTouchEnd: PropTypes.func.isRequired,
368
- prefixer: PropTypes.instanceOf(Prefixer).isRequired,
369
248
  split: PropTypes.oneOf(['vertical', 'horizontal']),
370
249
  style: stylePropType,
371
250
  resizerClassName: PropTypes.string.isRequired
372
251
  };
373
-
374
252
  Resizer.defaultProps = {
375
- prefixer: new Prefixer({ userAgent: USER_AGENT$1 }),
376
253
  resizerClassName: RESIZER_DEFAULT_CLASSNAME
377
254
  };
378
255
 
379
- var DEFAULT_USER_AGENT$2 = 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.2 (KHTML, like Gecko) Safari/537.2';
380
- var USER_AGENT$2 = typeof navigator !== 'undefined' ? navigator.userAgent : DEFAULT_USER_AGENT$2;
381
-
382
256
  function unFocus(document, window) {
383
257
  if (document.selection) {
384
258
  document.selection.empty();
385
259
  } else {
386
260
  try {
387
- window.getSelection().removeAllRanges();
388
- // eslint-disable-next-line no-empty
261
+ window.getSelection().removeAllRanges(); // eslint-disable-next-line no-empty
389
262
  } catch (e) {}
390
263
  }
391
264
  }
@@ -396,9 +269,11 @@ function getDefaultSize(defaultSize, minSize, maxSize, draggedSize) {
396
269
  var max = typeof maxSize === 'number' && maxSize >= 0 ? maxSize : Infinity;
397
270
  return Math.max(min, Math.min(max, draggedSize));
398
271
  }
272
+
399
273
  if (defaultSize !== undefined) {
400
274
  return defaultSize;
401
275
  }
276
+
402
277
  return minSize;
403
278
  }
404
279
 
@@ -408,21 +283,22 @@ function removeNullChildren(children) {
408
283
  });
409
284
  }
410
285
 
411
- var SplitPane = function (_React$Component) {
412
- inherits(SplitPane, _React$Component);
286
+ var SplitPane =
287
+ /*#__PURE__*/
288
+ function (_React$Component) {
289
+ _inherits(SplitPane, _React$Component);
413
290
 
414
291
  function SplitPane(props) {
415
- classCallCheck(this, SplitPane);
292
+ var _this;
416
293
 
417
- var _this = possibleConstructorReturn(this, (SplitPane.__proto__ || Object.getPrototypeOf(SplitPane)).call(this, props));
294
+ _classCallCheck(this, SplitPane);
418
295
 
419
- _this.onMouseDown = _this.onMouseDown.bind(_this);
420
- _this.onTouchStart = _this.onTouchStart.bind(_this);
421
- _this.onMouseMove = _this.onMouseMove.bind(_this);
422
- _this.onTouchMove = _this.onTouchMove.bind(_this);
423
- _this.onMouseUp = _this.onMouseUp.bind(_this);
424
-
425
- // order of setting panel sizes.
296
+ _this = _possibleConstructorReturn(this, _getPrototypeOf(SplitPane).call(this, props));
297
+ _this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_assertThisInitialized(_this)));
298
+ _this.onTouchStart = _this.onTouchStart.bind(_assertThisInitialized(_assertThisInitialized(_this)));
299
+ _this.onMouseMove = _this.onMouseMove.bind(_assertThisInitialized(_assertThisInitialized(_this)));
300
+ _this.onTouchMove = _this.onTouchMove.bind(_assertThisInitialized(_assertThisInitialized(_this)));
301
+ _this.onMouseUp = _this.onMouseUp.bind(_assertThisInitialized(_assertThisInitialized(_this))); // order of setting panel sizes.
426
302
  // 1. size
427
303
  // 2. getDefaultSize(defaultSize, minsize, maxSize)
428
304
 
@@ -431,16 +307,12 @@ var SplitPane = function (_React$Component) {
431
307
  minSize = props.minSize,
432
308
  maxSize = props.maxSize,
433
309
  primary = props.primary;
434
-
435
-
436
310
  var initialSize = size !== undefined ? size : getDefaultSize(defaultSize, minSize, maxSize, null);
437
-
438
311
  _this.state = {
439
312
  active: false,
440
313
  resized: false,
441
314
  pane1Size: primary === 'first' ? initialSize : undefined,
442
315
  pane2Size: primary === 'second' ? initialSize : undefined,
443
-
444
316
  // these are props that are needed in static functions. ie: gDSFP
445
317
  instanceProps: {
446
318
  size: size
@@ -449,8 +321,8 @@ var SplitPane = function (_React$Component) {
449
321
  return _this;
450
322
  }
451
323
 
452
- createClass(SplitPane, [{
453
- key: 'componentDidMount',
324
+ _createClass(SplitPane, [{
325
+ key: "componentDidMount",
454
326
  value: function componentDidMount() {
455
327
  document.addEventListener('mouseup', this.onMouseUp);
456
328
  document.addEventListener('mousemove', this.onMouseMove);
@@ -458,27 +330,30 @@ var SplitPane = function (_React$Component) {
458
330
  this.setState(SplitPane.getSizeUpdate(this.props, this.state));
459
331
  }
460
332
  }, {
461
- key: 'componentWillUnmount',
333
+ key: "componentWillUnmount",
462
334
  value: function componentWillUnmount() {
463
335
  document.removeEventListener('mouseup', this.onMouseUp);
464
336
  document.removeEventListener('mousemove', this.onMouseMove);
465
337
  document.removeEventListener('touchmove', this.onTouchMove);
466
338
  }
467
339
  }, {
468
- key: 'onMouseDown',
340
+ key: "onMouseDown",
469
341
  value: function onMouseDown(event) {
470
342
  var eventWithTouches = Object.assign({}, event, {
471
- touches: [{ clientX: event.clientX, clientY: event.clientY }]
343
+ touches: [{
344
+ clientX: event.clientX,
345
+ clientY: event.clientY
346
+ }]
472
347
  });
473
348
  this.onTouchStart(eventWithTouches);
474
349
  }
475
350
  }, {
476
- key: 'onTouchStart',
351
+ key: "onTouchStart",
477
352
  value: function onTouchStart(event) {
478
- var _props = this.props,
479
- allowResize = _props.allowResize,
480
- onDragStarted = _props.onDragStarted,
481
- split = _props.split;
353
+ var _this$props = this.props,
354
+ allowResize = _this$props.allowResize,
355
+ onDragStarted = _this$props.onDragStarted,
356
+ split = _this$props.split;
482
357
 
483
358
  if (allowResize) {
484
359
  unFocus(document, window);
@@ -487,6 +362,7 @@ var SplitPane = function (_React$Component) {
487
362
  if (typeof onDragStarted === 'function') {
488
363
  onDragStarted();
489
364
  }
365
+
490
366
  this.setState({
491
367
  active: true,
492
368
  position: position
@@ -494,33 +370,36 @@ var SplitPane = function (_React$Component) {
494
370
  }
495
371
  }
496
372
  }, {
497
- key: 'onMouseMove',
373
+ key: "onMouseMove",
498
374
  value: function onMouseMove(event) {
499
375
  var eventWithTouches = Object.assign({}, event, {
500
- touches: [{ clientX: event.clientX, clientY: event.clientY }]
376
+ touches: [{
377
+ clientX: event.clientX,
378
+ clientY: event.clientY
379
+ }]
501
380
  });
502
381
  this.onTouchMove(eventWithTouches);
503
382
  }
504
383
  }, {
505
- key: 'onTouchMove',
384
+ key: "onTouchMove",
506
385
  value: function onTouchMove(event) {
507
- var _props2 = this.props,
508
- allowResize = _props2.allowResize,
509
- maxSize = _props2.maxSize,
510
- minSize = _props2.minSize,
511
- onChange = _props2.onChange,
512
- split = _props2.split,
513
- step = _props2.step;
514
- var _state = this.state,
515
- active = _state.active,
516
- position = _state.position;
517
-
386
+ var _this$props2 = this.props,
387
+ allowResize = _this$props2.allowResize,
388
+ maxSize = _this$props2.maxSize,
389
+ minSize = _this$props2.minSize,
390
+ onChange = _this$props2.onChange,
391
+ split = _this$props2.split,
392
+ step = _this$props2.step;
393
+ var _this$state = this.state,
394
+ active = _this$state.active,
395
+ position = _this$state.position;
518
396
 
519
397
  if (allowResize && active) {
520
398
  unFocus(document, window);
521
399
  var isPrimaryFirst = this.props.primary === 'first';
522
400
  var ref = isPrimaryFirst ? this.pane1 : this.pane2;
523
401
  var ref2 = isPrimaryFirst ? this.pane2 : this.pane1;
402
+
524
403
  if (ref) {
525
404
  var node = ref;
526
405
  var node2 = ref2;
@@ -531,25 +410,30 @@ var SplitPane = function (_React$Component) {
531
410
  var current = split === 'vertical' ? event.touches[0].clientX : event.touches[0].clientY;
532
411
  var size = split === 'vertical' ? width : height;
533
412
  var positionDelta = position - current;
413
+
534
414
  if (step) {
535
415
  if (Math.abs(positionDelta) < step) {
536
416
  return;
537
- }
538
- // Integer division
417
+ } // Integer division
539
418
  // eslint-disable-next-line no-bitwise
419
+
420
+
540
421
  positionDelta = ~~(positionDelta / step) * step;
541
422
  }
542
- var sizeDelta = isPrimaryFirst ? positionDelta : -positionDelta;
543
423
 
424
+ var sizeDelta = isPrimaryFirst ? positionDelta : -positionDelta;
544
425
  var pane1Order = parseInt(window.getComputedStyle(node).order);
545
426
  var pane2Order = parseInt(window.getComputedStyle(node2).order);
427
+
546
428
  if (pane1Order > pane2Order) {
547
429
  sizeDelta = -sizeDelta;
548
430
  }
549
431
 
550
432
  var newMaxSize = maxSize;
433
+
551
434
  if (maxSize !== undefined && maxSize <= 0) {
552
435
  var splitPane = this.splitPane;
436
+
553
437
  if (split === 'vertical') {
554
438
  newMaxSize = splitPane.getBoundingClientRect().width + maxSize;
555
439
  } else {
@@ -572,8 +456,7 @@ var SplitPane = function (_React$Component) {
572
456
  }
573
457
 
574
458
  if (onChange) onChange(newSize);
575
-
576
- this.setState(defineProperty({
459
+ this.setState(_defineProperty({
577
460
  draggedSize: newSize
578
461
  }, isPrimaryFirst ? 'pane1Size' : 'pane2Size', newSize));
579
462
  }
@@ -581,58 +464,55 @@ var SplitPane = function (_React$Component) {
581
464
  }
582
465
  }
583
466
  }, {
584
- key: 'onMouseUp',
467
+ key: "onMouseUp",
585
468
  value: function onMouseUp() {
586
- var _props3 = this.props,
587
- allowResize = _props3.allowResize,
588
- onDragFinished = _props3.onDragFinished;
589
- var _state2 = this.state,
590
- active = _state2.active,
591
- draggedSize = _state2.draggedSize;
469
+ var _this$props3 = this.props,
470
+ allowResize = _this$props3.allowResize,
471
+ onDragFinished = _this$props3.onDragFinished;
472
+ var _this$state2 = this.state,
473
+ active = _this$state2.active,
474
+ draggedSize = _this$state2.draggedSize;
592
475
 
593
476
  if (allowResize && active) {
594
477
  if (typeof onDragFinished === 'function') {
595
478
  onDragFinished(draggedSize);
596
479
  }
597
- this.setState({ active: false });
598
- }
599
- }
600
480
 
601
- // we have to check values since gDSFP is called on every render and more in StrictMode
481
+ this.setState({
482
+ active: false
483
+ });
484
+ }
485
+ } // we have to check values since gDSFP is called on every render and more in StrictMode
602
486
 
603
487
  }, {
604
- key: 'render',
488
+ key: "render",
605
489
  value: function render() {
606
490
  var _this2 = this;
607
491
 
608
- var _props4 = this.props,
609
- allowResize = _props4.allowResize,
610
- children = _props4.children,
611
- className = _props4.className,
612
- onResizerClick = _props4.onResizerClick,
613
- onResizerDoubleClick = _props4.onResizerDoubleClick,
614
- paneClassName = _props4.paneClassName,
615
- pane1ClassName = _props4.pane1ClassName,
616
- pane2ClassName = _props4.pane2ClassName,
617
- paneStyle = _props4.paneStyle,
618
- pane1StyleProps = _props4.pane1Style,
619
- pane2StyleProps = _props4.pane2Style,
620
- prefixer = _props4.prefixer,
621
- resizerClassName = _props4.resizerClassName,
622
- resizerStyle = _props4.resizerStyle,
623
- split = _props4.split,
624
- styleProps = _props4.style;
625
- var _state3 = this.state,
626
- pane1Size = _state3.pane1Size,
627
- pane2Size = _state3.pane2Size;
628
-
629
-
492
+ var _this$props4 = this.props,
493
+ allowResize = _this$props4.allowResize,
494
+ children = _this$props4.children,
495
+ className = _this$props4.className,
496
+ onResizerClick = _this$props4.onResizerClick,
497
+ onResizerDoubleClick = _this$props4.onResizerDoubleClick,
498
+ paneClassName = _this$props4.paneClassName,
499
+ pane1ClassName = _this$props4.pane1ClassName,
500
+ pane2ClassName = _this$props4.pane2ClassName,
501
+ paneStyle = _this$props4.paneStyle,
502
+ pane1StyleProps = _this$props4.pane1Style,
503
+ pane2StyleProps = _this$props4.pane2Style,
504
+ resizerClassName = _this$props4.resizerClassName,
505
+ resizerStyle = _this$props4.resizerStyle,
506
+ split = _this$props4.split,
507
+ styleProps = _this$props4.style;
508
+ var _this$state3 = this.state,
509
+ pane1Size = _this$state3.pane1Size,
510
+ pane2Size = _this$state3.pane2Size;
630
511
  var disabledClass = allowResize ? '' : 'disabled';
631
- var resizerClassNamesIncludingDefault = resizerClassName ? resizerClassName + ' ' + RESIZER_DEFAULT_CLASSNAME : resizerClassName;
632
-
512
+ var resizerClassNamesIncludingDefault = resizerClassName ? "".concat(resizerClassName, " ").concat(RESIZER_DEFAULT_CLASSNAME) : resizerClassName;
633
513
  var notNullChildren = removeNullChildren(children);
634
514
 
635
- var style = Object.assign({}, {
515
+ var style = _objectSpread({
636
516
  display: 'flex',
637
517
  flex: 1,
638
518
  height: '100%',
@@ -643,7 +523,7 @@ var SplitPane = function (_React$Component) {
643
523
  WebkitUserSelect: 'text',
644
524
  msUserSelect: 'text',
645
525
  userSelect: 'text'
646
- }, styleProps || {});
526
+ }, styleProps);
647
527
 
648
528
  if (split === 'vertical') {
649
529
  Object.assign(style, {
@@ -662,75 +542,61 @@ var SplitPane = function (_React$Component) {
662
542
  }
663
543
 
664
544
  var classes = ['SplitPane', className, split, disabledClass];
665
- var pane1Style = prefixer.prefix(Object.assign({}, paneStyle || {}, pane1StyleProps || {}));
666
- var pane2Style = prefixer.prefix(Object.assign({}, paneStyle || {}, pane2StyleProps || {}));
545
+
546
+ var pane1Style = _objectSpread({}, paneStyle, pane1StyleProps);
547
+
548
+ var pane2Style = _objectSpread({}, paneStyle, pane2StyleProps);
667
549
 
668
550
  var pane1Classes = ['Pane1', paneClassName, pane1ClassName].join(' ');
669
551
  var pane2Classes = ['Pane2', paneClassName, pane2ClassName].join(' ');
670
-
671
- return React.createElement(
672
- 'div',
673
- {
674
- className: classes.join(' '),
675
- ref: function ref(node) {
676
- _this2.splitPane = node;
677
- },
678
- style: prefixer.prefix(style)
552
+ return React.createElement("div", {
553
+ className: classes.join(' '),
554
+ ref: function ref(node) {
555
+ _this2.splitPane = node;
556
+ },
557
+ style: style
558
+ }, React.createElement(Pane, {
559
+ className: pane1Classes,
560
+ key: "pane1",
561
+ eleRef: function eleRef(node) {
562
+ _this2.pane1 = node;
563
+ },
564
+ size: pane1Size,
565
+ split: split,
566
+ style: pane1Style
567
+ }, notNullChildren[0]), React.createElement(Resizer, {
568
+ className: disabledClass,
569
+ onClick: onResizerClick,
570
+ onDoubleClick: onResizerDoubleClick,
571
+ onMouseDown: this.onMouseDown,
572
+ onTouchStart: this.onTouchStart,
573
+ onTouchEnd: this.onMouseUp,
574
+ key: "resizer",
575
+ resizerClassName: resizerClassNamesIncludingDefault,
576
+ split: split,
577
+ style: resizerStyle || {}
578
+ }), React.createElement(Pane, {
579
+ className: pane2Classes,
580
+ key: "pane2",
581
+ eleRef: function eleRef(node) {
582
+ _this2.pane2 = node;
679
583
  },
680
- React.createElement(
681
- Pane,
682
- {
683
- className: pane1Classes,
684
- key: 'pane1',
685
- eleRef: function eleRef(node) {
686
- _this2.pane1 = node;
687
- },
688
- size: pane1Size,
689
- split: split,
690
- style: pane1Style
691
- },
692
- notNullChildren[0]
693
- ),
694
- React.createElement(Resizer, {
695
- className: disabledClass,
696
- onClick: onResizerClick,
697
- onDoubleClick: onResizerDoubleClick,
698
- onMouseDown: this.onMouseDown,
699
- onTouchStart: this.onTouchStart,
700
- onTouchEnd: this.onMouseUp,
701
- key: 'resizer',
702
- resizerClassName: resizerClassNamesIncludingDefault,
703
- split: split,
704
- style: resizerStyle || {}
705
- }),
706
- React.createElement(
707
- Pane,
708
- {
709
- className: pane2Classes,
710
- key: 'pane2',
711
- eleRef: function eleRef(node) {
712
- _this2.pane2 = node;
713
- },
714
- size: pane2Size,
715
- split: split,
716
- style: pane2Style
717
- },
718
- notNullChildren[1]
719
- )
720
- );
584
+ size: pane2Size,
585
+ split: split,
586
+ style: pane2Style
587
+ }, notNullChildren[1]));
721
588
  }
722
589
  }], [{
723
- key: 'getDerivedStateFromProps',
590
+ key: "getDerivedStateFromProps",
724
591
  value: function getDerivedStateFromProps(nextProps, prevState) {
725
592
  return SplitPane.getSizeUpdate(nextProps, prevState);
726
593
  }
727
594
  }, {
728
- key: 'getSizeUpdate',
595
+ key: "getSizeUpdate",
729
596
  value: function getSizeUpdate(props, state) {
730
597
  var newState = {};
731
598
  var instanceProps = state.instanceProps;
732
599
 
733
-
734
600
  if (instanceProps.size === props.size && props.size !== undefined) {
735
601
  return {};
736
602
  }
@@ -742,15 +608,15 @@ var SplitPane = function (_React$Component) {
742
608
  }
743
609
 
744
610
  var isPanel1Primary = props.primary === 'first';
745
-
746
611
  newState[isPanel1Primary ? 'pane1Size' : 'pane2Size'] = newSize;
747
612
  newState[isPanel1Primary ? 'pane2Size' : 'pane1Size'] = undefined;
748
-
749
- newState.instanceProps = { size: props.size };
750
-
613
+ newState.instanceProps = {
614
+ size: props.size
615
+ };
751
616
  return newState;
752
617
  }
753
618
  }]);
619
+
754
620
  return SplitPane;
755
621
  }(React.Component);
756
622
 
@@ -770,7 +636,6 @@ SplitPane.propTypes = {
770
636
  onChange: PropTypes.func,
771
637
  onResizerClick: PropTypes.func,
772
638
  onResizerDoubleClick: PropTypes.func,
773
- prefixer: PropTypes.instanceOf(Prefixer).isRequired,
774
639
  style: stylePropType,
775
640
  resizerStyle: stylePropType,
776
641
  paneClassName: PropTypes.string,
@@ -782,18 +647,16 @@ SplitPane.propTypes = {
782
647
  resizerClassName: PropTypes.string,
783
648
  step: PropTypes.number
784
649
  };
785
-
786
650
  SplitPane.defaultProps = {
787
651
  allowResize: true,
788
652
  minSize: 50,
789
- prefixer: new Prefixer({ userAgent: USER_AGENT$2 }),
790
653
  primary: 'first',
791
654
  split: 'vertical',
792
655
  paneClassName: '',
793
656
  pane1ClassName: '',
794
657
  pane2ClassName: ''
795
658
  };
659
+ reactLifecyclesCompat.polyfill(SplitPane);
796
660
 
797
- polyfill(SplitPane);
798
-
799
- module.exports = SplitPane;
661
+ exports.default = SplitPane;
662
+ exports.Pane = Pane;