react-bootstrap-toggle - npm Package Compare versions

Comparing version 1.2.1 to 1.2.11

gulpfile.js

@@ -24,3 +24,3 @@ var gulp = require('gulp');
       .pipe(sourcemaps.init({ loadMaps: true }))
-      .pipe(sourcemaps.write('./'))
+      .pipe(sourcemaps.write('./dist'))
       .pipe(gulp.dest('./dist'));
@@ -27,0 +27,0 @@ }

lib/react-bootstrap-toggle.js

@@ -21,22 +21,36 @@ 'use strict';
 
-var outerHeight = function outerHeight(el) {
-  var height = el.scrollHeight;
-  var style = getComputedStyle(el);
+var getStyle = function getStyle(el, str) {
+  return parseInt(getComputedStyle(el).getPropertyValue(str), 10);
+};
+
+var getWidth = function getWidth(el) {
+  var width = 0;
+  var pLeft = getStyle(el, 'padding-left');
+  var pRight = getStyle(el, 'padding-right');
   if (el.childElementCount) {
+
     var child = el.childNodes[0];
-    var childeStyle = getComputedStyle(child);
+    var mLeft = getStyle(child, 'margin-left');
+    var mRight = getStyle(child, 'margin-right');
+    var cWidth = child.scrollWidth;
+
+    return cWidth + mLeft + mRight + pLeft + pRight;
   }
-  return height + parseInt(style.marginTop) + parseInt(style.marginBottom) + parseInt(style.paddingTop) + parseInt(style.paddingBottom);
+  return el.offsetWidth;
 };
 
-var outerWidth = function outerWidth(el) {
+var getHeight = function getHeight(el) {
+  var height = 0;
+  var pTop = getStyle(el, 'padding-top');
+  var pBottom = getStyle(el, 'padding-top');
+  var elHeight = 0;
+  if (el.childElementCount) {
 
-  var width = el.scrollWidth;
-  var style = getComputedStyle(el);
-  if (el.childElementCount) {
     var child = el.childNodes[0];
-    var childeStyle = getComputedStyle(child);
-    width += parseInt(childeStyle.marginLeft) + parseInt(childeStyle.marginRight) + child.scrollWidth;
+    var mTop = getStyle(child, 'margin-top');
+    var mBottom = getStyle(child, 'margin-bottom');
+    var cHeight = child.offsetHeight;
+    return cHeight + mBottom + mTop + pTop + pBottom;
   }
-  return width + parseInt(style.marginLeft) + parseInt(style.marginRight);
+  return el.offsetHeight;
 };
@@ -71,5 +85,6 @@
       var toggle = this.refs.toggle;
-      var width = Math.max(outerWidth(on), outerWidth(off)) + outerWidth(toggle) / 1.25;
-      var height = Math.max(outerHeight(on), outerHeight(off));
-
+      var width = Math.max(getWidth(on), getWidth(off));
+      console.log(width);
+      var height = Math.max(getHeight(on), getHeight(off));
+      console.log(this.refs.switcher.offsetHeight);
       this.setState({ width: this.props.width || width, height: this.props.height || height });
@@ -84,3 +99,3 @@ }
     key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps() {
+    value: function componentWillReceiveProps(p) {
       this.setDimensions();
@@ -87,0 +102,0 @@ }

package.json

 {
   "name": "react-bootstrap-toggle",
-  "version": "1.2.1",
+  "version": "1.2.11",
   "description": "A React version of the bootstrap-toggle without the JQuery dependency",
@@ -5,0 +5,0 @@ "main": "./lib/react-bootstrap-toggle.js",

readme.md

@@ -27,16 +27,3 @@ ## React-Bootstrap-Toggle
 
-Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-on="Enabled"`.
 
-```html
-<input type="checkbox" data-toggle="toggle" data-on="Enabled" data-off="Disabled">
-<input type="checkbox" id="toggle-two">
-<script>
-  $(function() {
-    $('#toggle-two').bootstrapToggle({
-      on: 'Enabled',
-      off: 'Disabled'
-    });
-  })
-</script>
-```
 
@@ -50,3 +37,2 @@ Name|Type|Default|Description|
 offstyle|string|"default"|Style of the off toggle. Possible values are `default`, `primary`, `success`, `info`, `warning`, `danger`
-style|string| |Appends the value to the class attribute of the toggle. This can be used to apply custom styles. Refer to Custom Styles for reference.
 width|integer|*null*|Sets the width of the toggle. if set to *null*, width will be calculated.
@@ -53,0 +39,0 @@ height|integer|*null*|Sets the height of the toggle. if set to *null*, height will be calculated.

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

Lines of code

315

increased by4.3%

Worsened metrics

Total package byte prevSize

12775

decreased by-2.17%

Number of lines in readme file

43

decreased by-24.56%

No dependency changes