@dscout/particle 1.0.0-alpha.2 → 1.0.0-alpha.3

package/lib/components/email_input.js

@@ -13,10 +13,20 @@ var _props = require("../utils/props");
 
 var _refs = require("../utils/refs");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _common_input = _interopRequireDefault(require("./common_input"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "autoFocus", "disabled", "getRef", "id", "invalid", "maxLength", "mini", "name", "onBlur", "onChange", "onFocus", "onKeyDown", "onPaste", "onPrefixClick", "onSuffixClick", "placeholder", "prefix", "readOnly", "suffix", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -74,8 +84,10 @@ function EmailInput(_ref) {
       readOnly = _ref.readOnly,
       suffix = _ref.suffix,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
-  return _react.default.createElement(_common_input.default, {
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return _react.default.createElement(_common_input.default, _extends({}, (0, _data_attributes.default)(rest), {
     _modifierClass: _modifierClass,
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
@@ -104,7 +116,7 @@ function EmailInput(_ref) {
     tabIndex: tabIndex,
     type: "email",
     value: value
-  });
+  }));
 }
 
 EmailInput.propTypes = propTypes;

package/lib/components/file_input.js

@@ -13,8 +13,18 @@ var _refs = require("../utils/refs");
 
 var _forms = require("../utils/forms");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
+var _excluded = ["_modifierClass", "accept", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "filename", "getRef", "id", "label", "multiple", "name", "value", "tabIndex", "onChange"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   accept: _propTypes.default.string,
@@ -49,11 +59,13 @@ function FileInput(_ref) {
       _ref$value = _ref.value,
       value = _ref$value === void 0 ? '' : _ref$value,
       tabIndex = _ref.tabIndex,
-      onChange = _ref.onChange;
+      onChange = _ref.onChange,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   var uniqueId = (0, _forms.unique)(id);
   return _react.default.createElement("fieldset", {
     className: _modifierClass
-  }, _react.default.createElement("input", {
+  }, _react.default.createElement("input", _extends({}, (0, _data_attributes.default)(rest), {
     accept: accept,
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
@@ -68,7 +80,7 @@ function FileInput(_ref) {
     onChange: onChange,
     tabIndex: tabIndex,
     type: "file"
-  }), _react.default.createElement("label", {
+  })), _react.default.createElement("label", {
     htmlFor: uniqueId,
     className: "File-Input__Label btn btn--small btn--color-dscout"
   }, label), _react.default.createElement("span", {

package/lib/components/link_text.js

@@ -0,0 +1,283 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _class_names = _interopRequireDefault(require("../utils/class_names"));
+
+var _props = require("../utils/props");
+
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
+var _excluded = ["_modifierClass", "aria-describedby", "aria-label", "aria-labelledby", "children", "color", "download", "href", "id", "onClick", "rel", "size", "target", "title", "weight"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var propTypes = {
+  _modifierClass: _propTypes.default.string,
+  'aria-describedby': _propTypes.default.string,
+  'aria-label': _propTypes.default.string,
+  'aria-labelledby': _propTypes.default.string,
+  children: _propTypes.default.node.isRequired,
+  color: _propTypes.default.oneOf(_props.COLORS),
+  download: _propTypes.default.oneOf([_propTypes.default.bool, _propTypes.default.string]),
+  href: _propTypes.default.string.isRequired,
+  id: _propTypes.default.string,
+  onClick: _propTypes.default.func,
+  rel: _propTypes.default.string,
+  size: _propTypes.default.oneOf(['xxs', 'xs', 's', 'base', 'l', 'xl', 'xxl', 'xxxl', 'subheadline', 'headline']),
+  target: _propTypes.default.string,
+  title: _propTypes.default.string,
+  weight: _propTypes.default.oneOf(['normal', 'semibold', 'bold', '1', '2', '3', '4', '5', '6', '7', '8', '9'])
+};
+
+function secureRel(target, rel) {
+  // For security, links opened in new tabs should always have `rel="noopener"`,
+  // so we're applying that automatically unless the `rel` attribute has been
+  // explicitly provided.
+  if (target === '_blank') return rel || 'noopener';
+  return rel;
+}
+
+function LinkText(_ref) {
+  var _classNames;
+
+  var _modifierClass = _ref._modifierClass,
+      ariaDescribedby = _ref['aria-describedby'],
+      ariaLabel = _ref['aria-label'],
+      ariaLabelledby = _ref['aria-labelledby'],
+      children = _ref.children,
+      color = _ref.color,
+      download = _ref.download,
+      href = _ref.href,
+      id = _ref.id,
+      onClick = _ref.onClick,
+      rel = _ref.rel,
+      size = _ref.size,
+      target = _ref.target,
+      title = _ref.title,
+      weight = _ref.weight,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var className = (0, _class_names.default)('Link-Text', _modifierClass, (_classNames = {}, _defineProperty(_classNames, "color--".concat(color), color), _defineProperty(_classNames, "font-size--".concat(size), size), _defineProperty(_classNames, "font-weight--".concat(weight), weight), _classNames));
+  return _react.default.createElement("a", _extends({}, (0, _data_attributes.default)(rest), {
+    "aria-describedby": ariaDescribedby,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledby,
+    className: className,
+    download: download,
+    href: href,
+    id: id,
+    onClick: onClick,
+    rel: secureRel(target, rel),
+    target: target,
+    title: title
+  }), children);
+}
+
+LinkText.propTypes = propTypes;
+LinkText.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "LinkText",
+  "props": {
+    "_modifierClass": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "aria-describedby": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "aria-label": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "aria-labelledby": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "children": {
+      "type": {
+        "name": "node"
+      },
+      "required": true,
+      "description": ""
+    },
+    "color": {
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "COLORS"
+      },
+      "required": false,
+      "description": ""
+    },
+    "download": {
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "PropTypes.bool",
+          "computed": true
+        }, {
+          "value": "PropTypes.string",
+          "computed": true
+        }]
+      },
+      "required": false,
+      "description": ""
+    },
+    "href": {
+      "type": {
+        "name": "string"
+      },
+      "required": true,
+      "description": ""
+    },
+    "id": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "onClick": {
+      "type": {
+        "name": "func"
+      },
+      "required": false,
+      "description": ""
+    },
+    "rel": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "size": {
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'xxs'",
+          "computed": false
+        }, {
+          "value": "'xs'",
+          "computed": false
+        }, {
+          "value": "'s'",
+          "computed": false
+        }, {
+          "value": "'base'",
+          "computed": false
+        }, {
+          "value": "'l'",
+          "computed": false
+        }, {
+          "value": "'xl'",
+          "computed": false
+        }, {
+          "value": "'xxl'",
+          "computed": false
+        }, {
+          "value": "'xxxl'",
+          "computed": false
+        }, {
+          "value": "'subheadline'",
+          "computed": false
+        }, {
+          "value": "'headline'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": ""
+    },
+    "target": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "title": {
+      "type": {
+        "name": "string"
+      },
+      "required": false,
+      "description": ""
+    },
+    "weight": {
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'normal'",
+          "computed": false
+        }, {
+          "value": "'semibold'",
+          "computed": false
+        }, {
+          "value": "'bold'",
+          "computed": false
+        }, {
+          "value": "'1'",
+          "computed": false
+        }, {
+          "value": "'2'",
+          "computed": false
+        }, {
+          "value": "'3'",
+          "computed": false
+        }, {
+          "value": "'4'",
+          "computed": false
+        }, {
+          "value": "'5'",
+          "computed": false
+        }, {
+          "value": "'6'",
+          "computed": false
+        }, {
+          "value": "'7'",
+          "computed": false
+        }, {
+          "value": "'8'",
+          "computed": false
+        }, {
+          "value": "'9'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": ""
+    }
+  }
+};
+var _default = LinkText;
+exports.default = _default;

package/lib/components/number_input.js

@@ -13,10 +13,20 @@ var _refs = require("../utils/refs");
 
 var _props = require("../utils/props");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _common_input = _interopRequireDefault(require("./common_input"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "autoFocus", "disabled", "getRef", "id", "invalid", "max", "min", "mini", "name", "onBlur", "onChange", "onFocus", "onKeyDown", "onPaste", "onPrefixClick", "onSuffixClick", "placeholder", "prefix", "readOnly", "suffix", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -76,8 +86,10 @@ function NumberInput(_ref) {
       readOnly = _ref.readOnly,
       suffix = _ref.suffix,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
-  return _react.default.createElement(_common_input.default, {
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return _react.default.createElement(_common_input.default, _extends({}, (0, _data_attributes.default)(rest), {
     _modifierClass: _modifierClass,
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
@@ -107,7 +119,7 @@ function NumberInput(_ref) {
     tabIndex: tabIndex,
     type: "number",
     value: value
-  });
+  }));
 }
 
 NumberInput.propTypes = propTypes;

package/lib/components/password_input.js

@@ -13,10 +13,20 @@ var _refs = require("../utils/refs");
 
 var _props = require("../utils/props");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _common_input = _interopRequireDefault(require("./common_input"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "autoFocus", "disabled", "getRef", "id", "invalid", "maxLength", "mini", "name", "onBlur", "onChange", "onFocus", "onKeyDown", "onPaste", "onPrefixClick", "onSuffixClick", "placeholder", "prefix", "readOnly", "suffix", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -74,8 +84,10 @@ function PasswordInput(_ref) {
       readOnly = _ref.readOnly,
       suffix = _ref.suffix,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
-  return _react.default.createElement(_common_input.default, {
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return _react.default.createElement(_common_input.default, _extends({}, (0, _data_attributes.default)(rest), {
     _modifierClass: _modifierClass,
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
@@ -104,7 +116,7 @@ function PasswordInput(_ref) {
     tabIndex: tabIndex,
     type: "password",
     value: value
-  });
+  }));
 }
 
 PasswordInput.propTypes = propTypes;

package/lib/components/radio_input.js

@@ -15,10 +15,20 @@ var _refs = require("../utils/refs");
 
 var _forms = require("../utils/forms");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _radio_circle = _interopRequireDefault(require("../icons/radio_circle"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "checked", "disabled", "getRef", "id", "label", "name", "onChange", "readOnly", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -52,14 +62,16 @@ function RadioInput(_ref) {
       onChange = _ref.onChange,
       readOnly = _ref.readOnly,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   var radioId = (0, _forms.looksUnique)(id) ? id : (0, _forms.unique)(id);
   var className = (0, _class_names.default)('Selector', _modifierClass, {
     'Selector--with-label': label
   });
   return _react.default.createElement("div", {
     className: className
-  }, _react.default.createElement("input", {
+  }, _react.default.createElement("input", _extends({}, (0, _data_attributes.default)(rest), {
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
     "aria-label": ariaLabel,
@@ -75,7 +87,7 @@ function RadioInput(_ref) {
     tabIndex: tabIndex,
     type: "radio",
     value: (0, _forms.inputValue)(value, onChange)
-  }), _react.default.createElement("label", {
+  })), _react.default.createElement("label", {
     className: "Selector__Field",
     htmlFor: radioId
   }), label && _react.default.createElement("label", {

package/lib/components/range_input.js

@@ -13,8 +13,18 @@ var _types = require("../utils/types");
 
 var _refs = require("../utils/refs");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "getRef", "id", "disabled", "maximum", "minimum", "name", "onChange", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var inputAttribute = _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]);
 
 var propTypes = {
@@ -57,10 +67,12 @@ function RangeInput(_ref) {
       name = _ref.name,
       onChange = _ref.onChange,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   return _react.default.createElement("fieldset", {
     className: _modifierClass
-  }, _react.default.createElement("input", {
+  }, _react.default.createElement("input", _extends({}, (0, _data_attributes.default)(rest), {
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
     "aria-label": ariaLabel,
@@ -77,7 +89,7 @@ function RangeInput(_ref) {
     type: "range",
     disabled: disabled,
     value: value
-  }), ((0, _types.exists)(minimum) || (0, _types.exists)(maximum)) && _react.default.createElement("div", {
+  })), ((0, _types.exists)(minimum) || (0, _types.exists)(maximum)) && _react.default.createElement("div", {
     className: "flex justify--between"
   }, renderMinOrMax(minimum), renderMinOrMax(maximum)));
 }

package/lib/components/search_input.js

@@ -13,10 +13,20 @@ var _refs = require("../utils/refs");
 
 var _props = require("../utils/props");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _common_input = _interopRequireDefault(require("./common_input"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "autoFocus", "disabled", "getRef", "id", "invalid", "mini", "name", "onBlur", "onChange", "onFocus", "onKeyDown", "onPaste", "placeholder", "readOnly", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -65,8 +75,10 @@ function SearchInput(_ref) {
       placeholder = _ref$placeholder === void 0 ? 'Search' : _ref$placeholder,
       readOnly = _ref.readOnly,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
-  return _react.default.createElement(_common_input.default, {
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return _react.default.createElement(_common_input.default, _extends({}, (0, _data_attributes.default)(rest), {
     _modifierClass: _modifierClass,
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
@@ -90,7 +102,7 @@ function SearchInput(_ref) {
     tabIndex: tabIndex,
     type: "search",
     value: value
-  });
+  }));
 }
 
 SearchInput.propTypes = propTypes;

package/lib/components/select_input.js

@@ -13,14 +13,24 @@ var _class_names = _interopRequireDefault(require("../utils/class_names"));
 
 var _refs = require("../utils/refs");
 
+var _data_attributes = _interopRequireDefault(require("../utils/data_attributes"));
+
 var _triangle_inverted = _interopRequireDefault(require("../icons/triangle_inverted"));
 
 var _with_addons = _interopRequireDefault(require("./with_addons"));
 
+var _excluded = ["_modifierClass", "aria-describedby", "aria-invalid", "aria-label", "aria-labelledby", "autoComplete", "children", "disabled", "getRef", "id", "invalid", "mini", "name", "onChange", "onFocus", "prefix", "readOnly", "suffix", "tabIndex", "value"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var propTypes = {
   _modifierClass: _propTypes.default.string,
   'aria-describedby': _propTypes.default.string,
@@ -67,7 +77,9 @@ function SelectInput(_ref) {
       readOnly = _ref.readOnly,
       suffix = _ref.suffix,
       tabIndex = _ref.tabIndex,
-      value = _ref.value;
+      value = _ref.value,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   var affixed = !!prefix || !!suffix;
   var wrapperClassName = (0, _class_names.default)('Dropdown__Toggle', (_classNames = {}, _defineProperty(_classNames, _modifierClass, _modifierClass && !affixed), _defineProperty(_classNames, 'Dropdown__Toggle--disabled', disabled), _defineProperty(_classNames, 'Dropdown__Toggle--mini', mini), _defineProperty(_classNames, 'Dropdown__Toggle--readonly', readOnly), _classNames));
   var selectClassName = (0, _class_names.default)('Input', 'truncate', {
@@ -78,7 +90,7 @@ function SelectInput(_ref) {
 
   var input = _react.default.createElement("div", {
     className: wrapperClassName
-  }, _react.default.createElement("select", {
+  }, _react.default.createElement("select", _extends({}, (0, _data_attributes.default)(rest), {
     "aria-describedby": ariaDescribedby,
     "aria-invalid": ariaInvalid,
     "aria-label": ariaLabel,
@@ -94,7 +106,7 @@ function SelectInput(_ref) {
     tabIndex: tabIndex,
     ref: getRef,
     value: value
-  }, children), _react.default.createElement("div", {
+  }), children), _react.default.createElement("div", {
     className: "Dropdown__Toggle__Icon"
   }, _react.default.createElement(_triangle_inverted.default, null)));