react-reflex - npm Package Compare versions

Comparing version 2.0.11 to 2.1.0

dist/commonjs/ReflexContainer.js

@@ -358,2 +358,15 @@ 'use strict';
     /////////////////////////////////////////////////////////
+    // Determines if element is a splitter
+    // or wraps a splitter
+    //
+    /////////////////////////////////////////////////////////
+
+  }, {
+    key: 'isSplitterElement',
+    value: function isSplitterElement(element) {
+
+      return element.type === _ReflexSplitter2.default;
+    }
+
+    /////////////////////////////////////////////////////////
     // Handles splitter stopResize event
@@ -366,2 +379,3 @@ //
     value: function onSplitterStopResize(data) {
+      var _this4 = this;
 
@@ -377,3 +391,3 @@ document.body.style.cursor = 'auto';
 
-        return child.type !== _ReflexSplitter2.default && resizedRefs.includes(child.ref);
+        return !_this4.isSplitterElement(child) && resizedRefs.includes(child.ref);
       });
@@ -392,3 +406,3 @@
     value: function onElementSize(data) {
-      var _this4 = this;
+      var _this5 = this;
 
@@ -401,3 +415,3 @@ return new _promise2.default(function (resolve) {
 
-          var size = _this4.getSize(_this4.children[idx]);
+          var size = _this5.getSize(_this5.children[idx]);
 
@@ -410,16 +424,16 @@ var offset = data.size - size;
 
-          var availableOffset = _this4.computeAvailableOffset(splitterIdx, dir * offset);
+          var availableOffset = _this5.computeAvailableOffset(splitterIdx, dir * offset);
 
-          _this4.elements = null;
+          _this5.elements = null;
 
           if (availableOffset) {
 
-            _this4.elements = _this4.dispatchOffset(splitterIdx, availableOffset);
+            _this5.elements = _this5.dispatchOffset(splitterIdx, availableOffset);
 
-            _this4.adjustFlex(_this4.elements);
+            _this5.adjustFlex(_this5.elements);
           }
 
-          _this4.setPartialState(_this4.state).then(function () {
+          _this5.setPartialState(_this5.state).then(function () {
 
-            _this4.emitElementsEvent(_this4.elements, 'onResize');
+            _this5.emitElementsEvent(_this5.elements, 'onResize');
 
@@ -444,3 +458,3 @@ resolve();
     value: function adjustFlex(elements) {
-      var _this5 = this;
+      var _this6 = this;
 
@@ -453,3 +467,3 @@ var diffFlex = elements.reduce(function (sum, element) {
 
-        var nextFlex = _this5.state.flexData[idx].flex;
+        var nextFlex = _this6.state.flexData[idx].flex;
 
@@ -460,3 +474,3 @@ return sum + (previousFlex - nextFlex) / elements.length;
       elements.forEach(function (element) {
-        _this5.state.flexData[element.props.index].flex += diffFlex;
+        _this6.state.flexData[element.props.index].flex += diffFlex;
       });
@@ -503,3 +517,3 @@ }
 
-          var typeCheck = child.type === _ReflexSplitter2.default;
+          var typeCheck = this.isSplitterElement(child);
 
@@ -514,3 +528,3 @@ return typeCheck && child.props.propagate;
 
-          var _typeCheck = _child.type === _ReflexSplitter2.default;
+          var _typeCheck = this.isSplitterElement(_child);
 
@@ -738,3 +752,3 @@ return _typeCheck && _child.props.propagate;
     value: function emitElementsEvent(elements, event) {
-      var _this6 = this;
+      var _this7 = this;
 
@@ -745,3 +759,3 @@ this.toArray(elements).forEach(function (element) {
 
-          var ref = _this6.refs[element.ref];
+          var ref = _this7.refs[element.ref];
 
@@ -766,3 +780,3 @@ element.props[event]({
     value: function computeFlexData() {
-      var _this7 = this;
+      var _this8 = this;
 
@@ -776,3 +790,3 @@ var children = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getValidChildren();
         return flexData.reduce(function (sum, entry) {
-          if (entry.type !== _ReflexSplitter2.default && entry.constrained) {
+          if (!_this8.isSplitterElement(entry) && entry.constrained) {
             return sum - entry.flex;
@@ -786,3 +800,3 @@ }
         return flexData.reduce(function (sum, entry) {
-          if (entry.type !== _ReflexSplitter2.default && !entry.constrained) {
+          if (!_this8.isSplitterElement(entry) && !entry.constrained) {
             return sum + 1;
@@ -803,3 +817,3 @@ }
           constrained: props.flex !== undefined,
-          guid: props.ref || _this7.guid(),
+          guid: props.ref || _this8.guid(),
           flex: props.flex || 0,
@@ -820,3 +834,3 @@ type: child.type
 
-          if (entry.type === _ReflexSplitter2.default) {
+          if (_this8.isSplitterElement(entry)) {
             return entry;
@@ -846,6 +860,6 @@ }
 
-        return entry.type !== _ReflexSplitter2.default ? {
-          guid: entry.guid,
-          flex: entry.flex
-        } : { flex: 0 };
+        return {
+          flex: !_this8.isSplitterElement(entry) ? entry.flex : 0.0,
+          guid: entry.guid
+        };
       });
@@ -897,3 +911,3 @@ }
     value: function render() {
-      var _this8 = this;
+      var _this9 = this;
 
@@ -904,13 +918,13 @@ var classNames = ['reflex-layout', 'reflex-container', this.props.orientation].concat((0, _toConsumableArray3.default)(this.props.className.split(' ')));
 
-        if (idx > _this8.state.flexData.length - 1) {
+        if (idx > _this9.state.flexData.length - 1) {
           return _react2.default.createElement('div', null);
         }
 
-        var flexData = _this8.state.flexData[idx];
+        var flexData = _this9.state.flexData[idx];
 
         var newProps = (0, _assign2.default)({}, child.props, {
           maxSize: child.props.maxSize || Number.MAX_VALUE,
-          orientation: _this8.props.orientation,
+          orientation: _this9.props.orientation,
           minSize: child.props.minSize || 1,
-          events: _this8.events,
+          events: _this9.events,
           flex: flexData.flex,
@@ -917,0 +931,0 @@ ref: flexData.guid,

dist/commonjs/ReflexElement.js

@@ -15,2 +15,6 @@ 'use strict';
 
+var _extends2 = require('babel-runtime/helpers/extends');
+
+var _extends3 = _interopRequireDefault(_extends2);
+
 var _regenerator = require('babel-runtime/regenerator');
@@ -235,10 +239,12 @@
     value: function onResize(rect) {
+      var _props = this.props,
+          renderOnResize = _props.renderOnResize,
+          resizeHeight = _props.resizeHeight,
+          resizeWidth = _props.resizeWidth;
 
-      if (this.props.renderOnResize) {
 
+      if (renderOnResize) {
+
         this.setStateThrottled({
-          dimensions: {
-            height: Math.floor(rect.bounds.height),
-            width: Math.floor(rect.bounds.width)
-          }
+          dimensions: (0, _extends3.default)({}, resizeHeight && { height: Math.floor(rect.bounds.height) }, resizeWidth && { width: Math.floor(rect.bounds.width) })
         });
@@ -325,8 +331,12 @@ }
   renderOnResize: _propTypes2.default.bool,
+  resizeHeight: _propTypes2.default.bool,
+  resizeWidth: _propTypes2.default.bool,
   className: _propTypes2.default.string };
 ReflexElement.defaultProps = {
-  renderOnResize: _Browser2.default.isSafari(),
+  renderOnResize: _Browser2.default.isSafari(), // Safari is creepy ...
   propagateDimensions: false,
   renderOnResizeRate: 60,
+  resizeHeight: true,
+  resizeWidth: true,
   className: '' };
 exports.default = ReflexElement;

dist/commonjs/ReflexSplitter.js

@@ -250,3 +250,4 @@ 'use strict';
           onMouseDown: this.onMouseDown,
-          style: this.props.style },
+          style: this.props.style,
+          id: this.props.id },
         this.props.children
@@ -253,0 +254,0 @@ );

dist/es/ReflexContainer.js

@@ -306,2 +306,15 @@ import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
     /////////////////////////////////////////////////////////
+    // Determines if element is a splitter
+    // or wraps a splitter
+    //
+    /////////////////////////////////////////////////////////
+
+  }, {
+    key: 'isSplitterElement',
+    value: function isSplitterElement(element) {
+
+      return element.type === ReflexSplitter;
+    }
+
+    /////////////////////////////////////////////////////////
     // Handles splitter stopResize event
@@ -314,2 +327,3 @@ //
     value: function onSplitterStopResize(data) {
+      var _this4 = this;
 
@@ -325,3 +339,3 @@ document.body.style.cursor = 'auto';
 
-        return child.type !== ReflexSplitter && resizedRefs.includes(child.ref);
+        return !_this4.isSplitterElement(child) && resizedRefs.includes(child.ref);
       });
@@ -340,3 +354,3 @@
     value: function onElementSize(data) {
-      var _this4 = this;
+      var _this5 = this;
 
@@ -349,3 +363,3 @@ return new _Promise(function (resolve) {
 
-          var size = _this4.getSize(_this4.children[idx]);
+          var size = _this5.getSize(_this5.children[idx]);
 
@@ -358,16 +372,16 @@ var offset = data.size - size;
 
-          var availableOffset = _this4.computeAvailableOffset(splitterIdx, dir * offset);
+          var availableOffset = _this5.computeAvailableOffset(splitterIdx, dir * offset);
 
-          _this4.elements = null;
+          _this5.elements = null;
 
           if (availableOffset) {
 
-            _this4.elements = _this4.dispatchOffset(splitterIdx, availableOffset);
+            _this5.elements = _this5.dispatchOffset(splitterIdx, availableOffset);
 
-            _this4.adjustFlex(_this4.elements);
+            _this5.adjustFlex(_this5.elements);
           }
 
-          _this4.setPartialState(_this4.state).then(function () {
+          _this5.setPartialState(_this5.state).then(function () {
 
-            _this4.emitElementsEvent(_this4.elements, 'onResize');
+            _this5.emitElementsEvent(_this5.elements, 'onResize');
 
@@ -392,3 +406,3 @@ resolve();
     value: function adjustFlex(elements) {
-      var _this5 = this;
+      var _this6 = this;
 
@@ -401,3 +415,3 @@ var diffFlex = elements.reduce(function (sum, element) {
 
-        var nextFlex = _this5.state.flexData[idx].flex;
+        var nextFlex = _this6.state.flexData[idx].flex;
 
@@ -408,3 +422,3 @@ return sum + (previousFlex - nextFlex) / elements.length;
       elements.forEach(function (element) {
-        _this5.state.flexData[element.props.index].flex += diffFlex;
+        _this6.state.flexData[element.props.index].flex += diffFlex;
       });
@@ -451,3 +465,3 @@ }
 
-          var typeCheck = child.type === ReflexSplitter;
+          var typeCheck = this.isSplitterElement(child);
 
@@ -462,3 +476,3 @@ return typeCheck && child.props.propagate;
 
-          var _typeCheck = _child.type === ReflexSplitter;
+          var _typeCheck = this.isSplitterElement(_child);
 
@@ -686,3 +700,3 @@ return _typeCheck && _child.props.propagate;
     value: function emitElementsEvent(elements, event) {
-      var _this6 = this;
+      var _this7 = this;
 
@@ -693,3 +707,3 @@ this.toArray(elements).forEach(function (element) {
 
-          var ref = _this6.refs[element.ref];
+          var ref = _this7.refs[element.ref];
 
@@ -714,3 +728,3 @@ element.props[event]({
     value: function computeFlexData() {
-      var _this7 = this;
+      var _this8 = this;
 
@@ -724,3 +738,3 @@ var children = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getValidChildren();
         return flexData.reduce(function (sum, entry) {
-          if (entry.type !== ReflexSplitter && entry.constrained) {
+          if (!_this8.isSplitterElement(entry) && entry.constrained) {
             return sum - entry.flex;
@@ -734,3 +748,3 @@ }
         return flexData.reduce(function (sum, entry) {
-          if (entry.type !== ReflexSplitter && !entry.constrained) {
+          if (!_this8.isSplitterElement(entry) && !entry.constrained) {
             return sum + 1;
@@ -751,3 +765,3 @@ }
           constrained: props.flex !== undefined,
-          guid: props.ref || _this7.guid(),
+          guid: props.ref || _this8.guid(),
           flex: props.flex || 0,
@@ -768,3 +782,3 @@ type: child.type
 
-          if (entry.type === ReflexSplitter) {
+          if (_this8.isSplitterElement(entry)) {
             return entry;
@@ -794,6 +808,6 @@ }
 
-        return entry.type !== ReflexSplitter ? {
-          guid: entry.guid,
-          flex: entry.flex
-        } : { flex: 0 };
+        return {
+          flex: !_this8.isSplitterElement(entry) ? entry.flex : 0.0,
+          guid: entry.guid
+        };
       });
@@ -845,3 +859,3 @@ }
     value: function render() {
-      var _this8 = this;
+      var _this9 = this;
 
@@ -852,13 +866,13 @@ var classNames = ['reflex-layout', 'reflex-container', this.props.orientation].concat(_toConsumableArray(this.props.className.split(' ')));
 
-        if (idx > _this8.state.flexData.length - 1) {
+        if (idx > _this9.state.flexData.length - 1) {
           return React.createElement('div', null);
         }
 
-        var flexData = _this8.state.flexData[idx];
+        var flexData = _this9.state.flexData[idx];
 
         var newProps = _Object$assign({}, child.props, {
           maxSize: child.props.maxSize || Number.MAX_VALUE,
-          orientation: _this8.props.orientation,
+          orientation: _this9.props.orientation,
           minSize: child.props.minSize || 1,
-          events: _this8.events,
+          events: _this9.events,
           flex: flexData.flex,
@@ -865,0 +879,0 @@ ref: flexData.guid,

dist/es/ReflexElement.js

 import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
 import _Object$assign from 'babel-runtime/core-js/object/assign';
+import _extends from 'babel-runtime/helpers/extends';
 import _regeneratorRuntime from 'babel-runtime/regenerator';
@@ -179,10 +180,12 @@ import _getIterator from 'babel-runtime/core-js/get-iterator';
     value: function onResize(rect) {
+      var _props = this.props,
+          renderOnResize = _props.renderOnResize,
+          resizeHeight = _props.resizeHeight,
+          resizeWidth = _props.resizeWidth;
 
-      if (this.props.renderOnResize) {
 
+      if (renderOnResize) {
+
         this.setStateThrottled({
-          dimensions: {
-            height: Math.floor(rect.bounds.height),
-            width: Math.floor(rect.bounds.width)
-          }
+          dimensions: _extends({}, resizeHeight && { height: Math.floor(rect.bounds.height) }, resizeWidth && { width: Math.floor(rect.bounds.width) })
         });
@@ -270,8 +273,12 @@ }
   renderOnResize: PropTypes.bool,
+  resizeHeight: PropTypes.bool,
+  resizeWidth: PropTypes.bool,
   className: PropTypes.string };
 ReflexElement.defaultProps = {
-  renderOnResize: Browser.isSafari(),
+  renderOnResize: Browser.isSafari(), // Safari is creepy ...
   propagateDimensions: false,
   renderOnResizeRate: 60,
+  resizeHeight: true,
+  resizeWidth: true,
   className: '' };
 export default ReflexElement;

dist/es/ReflexSplitter.js

@@ -213,3 +213,4 @@ import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
           onMouseDown: this.onMouseDown,
-          style: this.props.style },
+          style: this.props.style,
+          id: this.props.id },
         this.props.children
@@ -216,0 +217,0 @@ );

package.json

 {
   "name": "react-reflex",
-  "version": "2.0.11",
+  "version": "2.1.0",
   "description": "Flex layout component for advanced React web applications",
@@ -5,0 +5,0 @@ "main": "dist/commonjs/index.js",

README.md

@@ -122,8 +122,12 @@ ![re-flex](./resources/img/re-flex-banner.png)
 
- ![forge-rcdb](https://github.com/Autodesk-Forge/forge-rcdb.nodejs/blob/master/resources/img/forge-rcdb.jpg)
+ ![forge-rcdb](https://github.com/Autodesk-Forge/forge-rcdb.nodejs/blob/master/resources/img/misc/readme.png)
 
  * [Autodesk Forge RCDB Configurator](https://forge-rcdb.autodesk.io/configurator?id=57f3739777c879f48ad54a44)
 
-  ![forge-rcdb-configurator](https://github.com/Autodesk-Forge/forge-rcdb.nodejs/blob/master/resources/img/forge-rcdb-configurator.png)
+  ![forge-rcdb-configurator](https://github.com/Autodesk-Forge/forge-rcdb.nodejs/blob/master/resources/img/misc/configurator.png)
 
+ * [CodecastJS.com](https://codecastjs.com)
+
+  ![CodecastJS](https://codecastjs.com/images/editor-screen-shot.png)
+
 (Feel free to add your own by submitting a pull request...)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

363233

increased by0.7%

Lines of code

2594

increased by1.45%

Number of lines in readme file

133

increased by3.1%

No dependency changes