frc-auto-size - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

es/AutoSize.js

@@ -5,4 +5,4 @@ import React from 'react';
 class AutoSize extends React.Component {
-  constructor() {
-    super(...arguments);
+  constructor(props) {
+    super(props);
     this.fResize = () => {
@@ -48,2 +48,6 @@ const {disableHeight, disableWidth, onResize} = this.props;
     };
+    this.state = {
+      width: 0,
+      height: 0
+    };
   }
@@ -50,0 +54,0 @@ componentDidMount() {

lib/AutoSize.js

@@ -1,4 +0,4 @@
-"use strict";
+'use strict';
 
-Object.defineProperty(exports, "__esModule", {
+Object.defineProperty(exports, '__esModule', {
   value: true
@@ -8,40 +8,114 @@ });
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireDefault(require('react'));
 
-var _frcDetectElementResize = _interopRequireDefault(require("frc-detect-element-resize"));
+var _frcDetectElementResize = _interopRequireDefault(
+  require('frc-detect-element-resize')
+);
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {default: obj};
+}
 
-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); }
+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);
+}
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError('Cannot call a class as a 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); } }
+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);
+  }
+}
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
 
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+function _possibleConstructorReturn(self, call) {
+  if (call && (_typeof(call) === 'object' || typeof call === 'function')) {
+    return call;
+  }
+  return _assertThisInitialized(self);
+}
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError(
+      "this hasn't been initialised - super() hasn't been called"
+    );
+  }
+  return self;
+}
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _getPrototypeOf(o) {
+  _getPrototypeOf = Object.setPrototypeOf
+    ? Object.getPrototypeOf
+    : function _getPrototypeOf(o) {
+        return o.__proto__ || Object.getPrototypeOf(o);
+      };
+  return _getPrototypeOf(o);
+}
 
-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); }
+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);
+}
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf =
+    Object.setPrototypeOf ||
+    function _setPrototypeOf(o, p) {
+      o.__proto__ = p;
+      return o;
+    };
+  return _setPrototypeOf(o, p);
+}
 
 var AutoSize =
-/*#__PURE__*/
-function (_React$Component) {
-  _inherits(AutoSize, _React$Component);
+  /*#__PURE__*/
+  (function(_React$Component) {
+    _inherits(AutoSize, _React$Component);
 
-  function AutoSize() {
-    var _this;
+    function AutoSize(props) {
+      var _this;
 
-    _classCallCheck(this, AutoSize);
+      _classCallCheck(this, AutoSize);
 
-    _this = _possibleConstructorReturn(this, _getPrototypeOf(AutoSize).apply(this, arguments));
+      _this = _possibleConstructorReturn(
+        this,
+        _getPrototypeOf(AutoSize).call(this, props)
+      );
 
-    _this.fResize = function () {
-      var _this$props = _this.props,
+      _this.fResize = function() {
+        var _this$props = _this.props,
           disableHeight = _this$props.disableHeight,
@@ -51,107 +125,138 @@ disableWidth = _this$props.disableWidth,
 
-      if (_this._parentNode) {
-        var height = _this._parentNode.offsetHeight || 0;
-        var width = _this._parentNode.offsetWidth || 0;
-        var style = window.getComputedStyle(_this._parentNode) || {};
-        var paddingLeft = parseInt(style.paddingLeft || '0', 10) || 0;
-        var paddingRight = parseInt(style.paddingRight || '0', 10) || 0;
-        var paddingTop = parseInt(style.paddingTop || '0', 10) || 0;
-        var paddingBottom = parseInt(style.paddingBottom || '0', 10) || 0;
-        var borderLeftWidth = parseInt(style.borderLeftWidth || '0', 10) || 0;
-        var borderTopWidth = parseInt(style.borderTopWidth || '0', 10) || 0;
-        var borderRightWidth = parseInt(style.borderRightWidth || '0', 10) || 0;
-        var borderBottomWidth = parseInt(style.borderBottomWidth || '0', 10) || 0;
-        var newHeight = height - paddingTop - paddingBottom;
-        var newWidth = width - paddingLeft - paddingRight;
+        if (_this._parentNode) {
+          var height = _this._parentNode.offsetHeight || 0;
+          var width = _this._parentNode.offsetWidth || 0;
+          var style = window.getComputedStyle(_this._parentNode) || {};
+          var paddingLeft = parseInt(style.paddingLeft || '0', 10) || 0;
+          var paddingRight = parseInt(style.paddingRight || '0', 10) || 0;
+          var paddingTop = parseInt(style.paddingTop || '0', 10) || 0;
+          var paddingBottom = parseInt(style.paddingBottom || '0', 10) || 0;
+          var borderLeftWidth = parseInt(style.borderLeftWidth || '0', 10) || 0;
+          var borderTopWidth = parseInt(style.borderTopWidth || '0', 10) || 0;
+          var borderRightWidth =
+            parseInt(style.borderRightWidth || '0', 10) || 0;
+          var borderBottomWidth =
+            parseInt(style.borderBottomWidth || '0', 10) || 0;
+          var newHeight = height - paddingTop - paddingBottom;
+          var newWidth = width - paddingLeft - paddingRight;
 
-        if (style.boxSizing === 'border-box') {
-          newHeight = newHeight - borderTopWidth - borderBottomWidth;
-          newWidth = newWidth - borderLeftWidth - borderRightWidth;
-        }
+          if (style.boxSizing === 'border-box') {
+            newHeight = newHeight - borderTopWidth - borderBottomWidth;
+            newWidth = newWidth - borderLeftWidth - borderRightWidth;
+          }
 
-        if (!disableHeight && _this.state.height !== newHeight || !disableWidth && _this.state.width !== newWidth) {
-          var state = {
-            height: newHeight,
-            width: newWidth
-          };
+          if (
+            (!disableHeight && _this.state.height !== newHeight) ||
+            (!disableWidth && _this.state.width !== newWidth)
+          ) {
+            var state = {
+              height: newHeight,
+              width: newWidth
+            };
 
-          _this.setState(state);
+            _this.setState(state);
 
-          if (typeof onResize === 'function') {
-            onResize(state);
+            if (typeof onResize === 'function') {
+              onResize(state);
+            }
           }
         }
-      }
-    };
+      };
 
-    _this.fSetRef = function (autoSizer) {
-      _this._autoSizer = autoSizer;
-    };
+      _this.fSetRef = function(autoSizer) {
+        _this._autoSizer = autoSizer;
+      };
 
-    return _this;
-  }
+      _this.state = {
+        width: 0,
+        height: 0
+      };
+      return _this;
+    }
 
-  _createClass(AutoSize, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var nonce = this.props.nonce;
+    _createClass(AutoSize, [
+      {
+        key: 'componentDidMount',
+        value: function componentDidMount() {
+          var nonce = this.props.nonce;
 
-      if (this._autoSizer && this._autoSizer.parentNode && this._autoSizer.parentNode.ownerDocument && this._autoSizer.parentNode.ownerDocument.defaultView && this._autoSizer.parentNode instanceof HTMLElement) {
-        this._parentNode = this._autoSizer.parentNode;
-        this._detectElementResize = (0, _frcDetectElementResize.default)(nonce);
+          if (
+            this._autoSizer &&
+            this._autoSizer.parentNode &&
+            this._autoSizer.parentNode.ownerDocument &&
+            this._autoSizer.parentNode.ownerDocument.defaultView &&
+            this._autoSizer.parentNode instanceof HTMLElement
+          ) {
+            this._parentNode = this._autoSizer.parentNode;
+            this._detectElementResize = (0, _frcDetectElementResize.default)(
+              nonce
+            );
 
-        if (this._detectElementResize) {
-          this._detectElementResize.addResizeListener(this._parentNode, this.fResize);
+            if (this._detectElementResize) {
+              this._detectElementResize.addResizeListener(
+                this._parentNode,
+                this.fResize
+              );
+            }
+
+            this.fResize();
+          }
         }
+      },
+      {
+        key: 'componentWillUnmount',
+        value: function componentWillUnmount() {
+          if (this._detectElementResize && this._parentNode) {
+            this._detectElementResize.removeResizeListener(
+              this._parentNode,
+              this.fResize
+            );
+          }
+        }
+      },
+      {
+        key: 'render',
+        value: function render() {
+          var _this$props2 = this.props,
+            children = _this$props2.children,
+            className = _this$props2.className,
+            disableHeight = _this$props2.disableHeight,
+            disableWidth = _this$props2.disableWidth,
+            style = _this$props2.style;
+          var _this$state = this.state,
+            height = _this$state.height,
+            width = _this$state.width;
+          var outerStyle = {
+            overflow: 'visible'
+          };
+          var childParams = {};
 
-        this.fResize();
-      }
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      if (this._detectElementResize && this._parentNode) {
-        this._detectElementResize.removeResizeListener(this._parentNode, this.fResize);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props2 = this.props,
-          children = _this$props2.children,
-          className = _this$props2.className,
-          disableHeight = _this$props2.disableHeight,
-          disableWidth = _this$props2.disableWidth,
-          style = _this$props2.style;
-      var _this$state = this.state,
-          height = _this$state.height,
-          width = _this$state.width;
-      var outerStyle = {
-        overflow: 'visible'
-      };
-      var childParams = {};
+          if (!disableHeight) {
+            outerStyle.height = 0;
+            childParams.height = height;
+          }
 
-      if (!disableHeight) {
-        outerStyle.height = 0;
-        childParams.height = height;
-      }
+          if (!disableWidth) {
+            outerStyle.width = 0;
+            childParams.width = width;
+          }
 
-      if (!disableWidth) {
-        outerStyle.width = 0;
-        childParams.width = width;
+          return _react.default.createElement(
+            'div',
+            {
+              className: className,
+              ref: this.fSetRef,
+              style: Object.assign({}, outerStyle, style, {
+                height: '100%'
+              })
+            },
+            typeof children === 'function' && children(childParams)
+          );
+        }
       }
+    ]);
 
-      return _react.default.createElement('div', {
-        className: className,
-        ref: this.fSetRef,
-        style: Object.assign({}, outerStyle, style, {
-          height: '100%'
-        })
-      }, typeof children === 'function' && children(childParams));
-    }
-  }]);
+    return AutoSize;
+  })(_react.default.Component);
 
-  return AutoSize;
-}(_react.default.Component);
-
 AutoSize.defaultProps = {
@@ -165,2 +270,2 @@ disableWidth: false,
 var _default = AutoSize;
-exports.default = _default;
+exports.default = _default;

lib/index.js

@@ -1,4 +0,4 @@
-"use strict";
+'use strict';
 
-Object.defineProperty(exports, "__esModule", {
+Object.defineProperty(exports, '__esModule', {
   value: true
@@ -8,7 +8,9 @@ });
 
-var _AutoSize = _interopRequireDefault(require("./AutoSize"));
+var _AutoSize = _interopRequireDefault(require('./AutoSize'));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {default: obj};
+}
 
 var _default = _AutoSize.default;
-exports.default = _default;
+exports.default = _default;

package.json

 {
   "name": "frc-auto-size",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "react component auto size",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

ts/AutoSize.d.ts

@@ -35,2 +35,3 @@ import React, { ReactNode } from 'react';
     _detectElementResize?: IDetectElementResizeProps;
+    constructor(props: IAutoSizeProps);
     componentDidMount(): void;
@@ -37,0 +38,0 @@ componentWillUnmount(): void;

No alert changes

Improved metrics

Total package byte prevSize

17396

increased by6.33%

Lines of code

408

increased by37.37%

No dependency changes