Merge 9cca810 into fa30402

package.json

@@ -18,6 +18,7 @@
   },
   "homepage": "https://github.com/patternfly/patternfly-react#readme",
   "dependencies": {
+    "bootstrap-slider": "^10.0.0",
     "breakjs": "^1.0.0",
     "classnames": "^2.2.5",
     "patternfly": "^3.38.0",
@@ -75,7 +76,7 @@
     "node-sass": "^4.7.2",
     "prettier": "^1.9.2",
     "prettier-eslint": "^8.8.1",
-    "prop-types": "^15.6.0",
+    "prop-types": "^15.6.1",
     "raf": "^3.4.0",
     "react": "^16.2.0",
     "react-dev-utils": "^5.0.0",

src/components/Slider/BSColumnsManager.js

@@ -0,0 +1,55 @@
+const LAYOUT = {
+  label: {
+    xs: 1,
+    sm: 1,
+    md: 1
+  },
+  form: {
+    xs: 4,
+    sm: 4,
+    md: 2
+  }
+};
+const SIZES = ['xs', 'sm', 'md'];
+
+/**
+ * class BSColumnsManager - helps to keep track on the BS grid usage.
+ *
+ * @return {type}  description
+ */
+export default class BSColumnsManager {
+  constructor() {
+    this.columnCounter = { xs: 0, sm: 0, md: 0 };
+  }
+
+  /**
+   * Calculates the element column width by iterating over its size settings
+   * in the LAYOUT object.
+   * returns a class string, E.G: 'col-xs-2 col-sm-4 col-md-4'.
+   * @param {String} elementName
+   * @return {string}
+   */
+  getElementColumnsClass = (elementName, props) =>
+    SIZES.map(size => {
+      if (elementName !== 'slider') {
+        const numberOfColumns = LAYOUT[elementName][size];
+        this.columnCounter[size] += numberOfColumns;
+        return `col-${size}-${numberOfColumns}`;
+      }
+      const demoCounter = { xs: 0, sm: 0, md: 0 };
+
+      if (props.input || props.selectList) {
+        demoCounter[size] += LAYOUT.form[size];
+      }
+
+      if (props.icon || props.label) {
+        demoCounter[size] += LAYOUT.label[size];
+      }
+
+      return `col-${size}-${12 - demoCounter[size]}`;
+    }).join(' ');
+
+  resetColumnsCount = () => {
+    this.columnCounter = { xs: 0, sm: 0, md: 0 };
+  };
+}