react-textfit - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

lib/Textfit.js

@@ -75,2 +75,3 @@ 'use strict';
             throttle: 50,
+            autoResize: true,
             onReady: noop
@@ -81,3 +82,4 @@ };
         return {
-            fontSize: null
+            fontSize: null,
+            ready: false
         };
@@ -89,18 +91,27 @@ },
     componentDidMount: function componentDidMount() {
-        window.addEventListener('resize', this.handleWindowResize);
+        var autoResize = this.props.autoResize;
+
+        if (autoResize) {
+            window.addEventListener('resize', this.handleWindowResize);
+        }
         this.process();
     },
+    componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
+        if ((0, _shallowEqual2.default)(this.props, nextProps)) return;
+        this.process();
+    },
     shouldComponentUpdate: function shouldComponentUpdate(nextProps, nextState) {
-        if (!this.ready) return true;
-        var dataChanged = !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
-        return dataChanged;
+        var ready = this.state.ready;
+
+        if (!ready) return true;
+        return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
     },
-    componentDidUpdate: function componentDidUpdate() {
-        if (!this.ready) return;
-        this.process();
-    },
     componentWillUnmount: function componentWillUnmount() {
+        var autoResize = this.props.autoResize;
+
+        if (autoResize) {
+            window.removeEventListener('resize', this.handleWindowResize);
+        }
         // Setting a new pid will cancel all running processes
         this.pid = (0, _uniqueId2.default)();
-        window.removeEventListener('resize', this.handleWindowResize);
     },
@@ -139,3 +150,3 @@ handleWindowResize: function handleWindowResize() {
         this.pid = pid;
-        this.ready = false;
+
         var shouldCancelProcess = function shouldCancelProcess() {
@@ -161,2 +172,4 @@ return pid !== _this.pid;
 
+        this.setState({ ready: false });
+
         (0, _series2.default)([
@@ -221,4 +234,5 @@ // Step 1:
             if (err) return;
-            _this.ready = true;
-            onReady(mid);
+            _this.setState({ ready: true }, function () {
+                return onReady(mid);
+            });
         });
@@ -237,3 +251,5 @@ },
 
-        var fontSize = this.state.fontSize;
+        var _state = this.state;
+        var fontSize = _state.fontSize;
+        var ready = _state.ready;
 
@@ -245,3 +261,3 @@ var finalStyle = _extends({}, style, {
         var wrapperStyle = {
-            display: 'inline-block'
+            display: ready ? 'block' : 'inline-block'
         };
@@ -256,3 +272,3 @@ if (mode === 'single') wrapperStyle.whiteSpace = 'nowrap';
                 { ref: 'wrapper', style: wrapperStyle },
-                !!text && typeof children === 'function' ? children(text) : children
+                !!text && typeof children === 'function' ? ready ? children(text) : text : children
             )
@@ -259,0 +275,0 @@ );

package.json

 {
   "name": "react-textfit",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "React component to fit headlines and paragraphs into any element",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -39,3 +39,3 @@ react-textfit
         Fat headline!
-      </Scrollbars>
+      </Textfit>
     );
@@ -58,3 +58,3 @@ }
         Fat headline!
-      </Scrollbars>
+      </Textfit>
     );
@@ -75,3 +75,3 @@ }
         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-      </Scrollbars>
+      </Textfit>
     );
@@ -78,0 +78,0 @@ }

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

24261

increased by1.99%

Lines of code

408

increased by2.77%

No dependency changes