react-fittext - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

client/scripts/index.js

@@ -5,3 +5,3 @@ 'use strict';
 var React = require("react");
-var ReactFitText = require('../../src/ReactFitText');
+var ReactFitText = require('../../lib/ReactFitText');
 
@@ -8,0 +8,0 @@ var Body = React.createClass({

lib/ReactFitText.js

@@ -0,1 +1,10 @@
+/*
+ * React FitText v0.0.3
+ * https://github.com/gianu/react-fittext
+ *
+ * A port of the jQuery plugin: http://github.com/davatron5000/FitText.js
+ *
+ * Released under the MIT license
+ * http://gianu.mit-license.org
+ */
 'use strict';
@@ -10,3 +19,6 @@
   propTypes: {
-    compressor: ReactPropTypes.number
+    children: ReactPropTypes.element.isRequired,
+    compressor: ReactPropTypes.number,
+    minFontSize: ReactPropTypes.number,
+    maxFontSize: ReactPropTypes.number
   },
@@ -22,32 +34,23 @@
 
-  getInitialState: function() {
-    return {
-      width: 920
-    }
-  },
-
   componentDidMount: function() {
-    console.log(' --- COMPRESSOR ---> ' + this.props.compressor);
-    // var width = this.refs.fitTextContainer.getDOMNode().offsetWidth;
-    var width = this.getDOMNode().offsetWidth
-    this.setState({width: width});
-    // document.body.onresize = this._onBodyResize;
     window.addEventListener("resize", this._onBodyResize);
+    this._onBodyResize();
   },
 
+  componentWillUnmount: function() {
+    window.removeEventListener("resize", this._onBodyResize);
+  },
+
   _onBodyResize: function() {
-    // var width = this.refs.fitTextContainer.getDOMNode().offsetWidth;
-    var width = this.getDOMNode().offsetWidth;
-    this.setState({width: width});
+    var element = this.getDOMNode();
+    var width = element.offsetWidth;
+    element.style.fontSize = Math.max(
+                      Math.min((width / (this.props.compressor*10)),
+                                parseFloat(this.props.maxFontSize)),
+                      parseFloat(this.props.minFontSize)) + 'px';
   },
 
   render: function() {
-    var divStyle = {
-      'font-size': Math.max(Math.min((this.state.width / (this.props.compressor*10)), parseFloat(this.props.maxFontSize)), parseFloat(this.props.minFontSize))
-    };
-
-    return React.createElement("div", {ref: "fitTextContainer", style: divStyle}, 
-              this.props.children
-           );
+    return this.props.children;
   }
 });

package.json

 {
   "name": "react-fittext",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "A React plugin to fit the text in the screen",
@@ -5,0 +5,0 @@ "main": "lib/ReactFitText.js",

README.md

@@ -31,3 +31,3 @@ # React Fit text
 
- * __compressor__: you can tweak this variable to increase / decrase the font-size. Default is 1.
+ * __compressor__: you can tweak this variable to increase / decrease the font-size. Default is 1.
  * __minFontSize__: the minimun font size (in px) this component should use.
@@ -38,4 +38,8 @@ * __maxFontSize__: the maximum font size (in px) this component should use.
 
- If you found any issue with this componente, please [report it](https://github.com/gianu/react-fittext/issues).
+ If you found any issue with this component, please [report it](https://github.com/gianu/react-fittext/issues).
 
  If you want to improve the code, feel free to create a PR!
+ 
+## Thanks
+* [KyleAMathews](https://github.com/KyleAMathews)
+* [revolunet](https://github.com/revolunet)

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

44

increased by10%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

26830

decreased by-4.05%

Number of package files

14

decreased by-6.67%

Lines of code

348

decreased by-9.84%

No dependency changes