@lostmyname/components - npm Package Compare versions

Comparing version 0.0.12 to 0.0.13

dist/assets.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(238);
+	module.exports = __webpack_require__(248);
 
@@ -64,3 +64,3 @@
 
-/***/ 238:
+/***/ 248:
 /***/ function(module, exports, __webpack_require__) {
@@ -75,3 +75,3 @@
 
-	var _locale = __webpack_require__(239);
+	var _locale = __webpack_require__(249);
 
@@ -120,3 +120,3 @@ /**
 
-/***/ 239:
+/***/ 249:
 /***/ function(module, exports) {
@@ -123,0 +123,0 @@

dist/Banner.js

@@ -310,17 +310,15 @@ (function webpackUniversalModuleDefinition(root, factory) {
 	    defaultValue: 'secondary',
-	    description: 'The background colour of the banner',
 	    required: true
 	  },
 	  showCloseButton: {
-	    type: 'bool',
-	    description: 'Whether the `Banner` close button will be displayed'
+	    type: 'bool'
 	  },
 	  visible: {
-	    type: 'bool',
-	    description: 'Whether the banner is visible'
+	    type: 'bool'
 	  },
 	  onCloseClick: {
-	    type: 'func',
-	    required: true,
-	    description: 'A callback function that occurs on the click of the close button'
+	    type: 'func'
+	  },
+	  children: {
+	    type: 'node'
 	  }
@@ -327,0 +325,0 @@ };

dist/Checkbox.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(38);
+	module.exports = __webpack_require__(175);
 
@@ -71,3 +71,3 @@
 
-/***/ 38:
+/***/ 175:
 /***/ function(module, exports, __webpack_require__) {
@@ -87,3 +87,3 @@
 
-	__webpack_require__(39);
+	__webpack_require__(176);
 	var Checkbox = _react2['default'].createClass({
@@ -125,3 +125,3 @@ displayName: 'Checkbox',
 
-/***/ 39:
+/***/ 176:
 /***/ function(module, exports) {
@@ -128,0 +128,0 @@

dist/CloudImageSrcset.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(41);
+	module.exports = __webpack_require__(178);
 
@@ -149,3 +149,3 @@
 
-/***/ 41:
+/***/ 178:
 /***/ function(module, exports, __webpack_require__) {
@@ -164,3 +164,3 @@
 
-	var _makeQueryParams = __webpack_require__(42);
+	var _makeQueryParams = __webpack_require__(179);
 
@@ -292,3 +292,3 @@ var _makeQueryParams2 = _interopRequireDefault(_makeQueryParams);
 
-/***/ 42:
+/***/ 179:
 /***/ function(module, exports) {
@@ -295,0 +295,0 @@

dist/CompleteTick.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(43);
+	module.exports = __webpack_require__(180);
 
@@ -273,3 +273,3 @@
 
-/***/ 43:
+/***/ 180:
 /***/ function(module, exports, __webpack_require__) {
@@ -300,7 +300,6 @@
 
-	__webpack_require__(44);
+	__webpack_require__(181);
 	var PropTypes = exports.PropTypes = {
 	  ticked: {
-	    type: 'bool',
-	    description: 'Whether the tick should appear completed, or not.'
+	    type: 'bool'
 	  }
@@ -330,3 +329,3 @@ };
 
-/***/ 44:
+/***/ 181:
 /***/ function(module, exports) {
@@ -333,0 +332,0 @@

dist/Divider.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(46);
+	module.exports = __webpack_require__(183);
 
@@ -204,3 +204,3 @@
 
-/***/ 46:
+/***/ 183:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,3 +227,3 @@
 
-	__webpack_require__(47);
+	__webpack_require__(184);
 
@@ -233,20 +233,15 @@ var PropTypes = exports.PropTypes = {
 	    type: 'oneOf',
-	    allowedValues: ['white', 'primary'],
-	    description: 'The colour of the divider'
+	    allowedValues: ['white', 'primary']
 	  },
 	  top: {
-	    type: 'bool',
-	    description: 'Top divider is shown'
+	    type: 'bool'
 	  },
 	  right: {
-	    type: 'bool',
-	    description: 'Right divider is shown'
+	    type: 'bool'
 	  },
 	  bottom: {
-	    type: 'bool',
-	    description: 'Bottom divider is shown'
+	    type: 'bool'
 	  },
 	  left: {
-	    type: 'bool',
-	    description: 'Left divider is shown'
+	    type: 'bool'
 	  }
@@ -279,3 +274,3 @@ };
 
-/***/ 47:
+/***/ 184:
 /***/ function(module, exports) {
@@ -282,0 +277,0 @@

dist/Flipper.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(49);
+	module.exports = __webpack_require__(186);
 
@@ -149,3 +149,3 @@
 
-/***/ 49:
+/***/ 186:
 /***/ function(module, exports, __webpack_require__) {
@@ -166,3 +166,3 @@
 
-	__webpack_require__(50);
+	__webpack_require__(187);
 
@@ -172,9 +172,7 @@ var PropTypes = exports.PropTypes = {
 	    type: 'number',
-	    required: true,
-	    description: 'The number which is displayed in the `Flipper`'
+	    required: true
 	  },
 	  duration: {
 	    type: 'number',
-	    defaultValue: 1000,
-	    description: 'How long the flipping animation will go on for, in ms. This doesn\'t actually affect the duration of the animation, as that\'s set in the CSS. So make sure this matches the duration set there.'
+	    defaultValue: 1000
 	  }
@@ -289,11 +287,13 @@ };
 	  setRef: function setRef(i) {
+	    var _this3 = this;
+
 	    return function (c) {
-	      this['_flipper-' + i] = c;
+	      _this3['_flipper-' + i] = c;
 	    };
 	  },
 	  render: function render() {
-	    var _this3 = this;
+	    var _this4 = this;
 
 	    var flipperNumbers = this.state.number.map(function (item, key) {
-	      return _this3.getNumber(item.current, item.next, item.current + item.next + key);
+	      return _this4.getNumber(item.current, item.next, item.current + item.next + key);
 	    });
@@ -310,3 +310,3 @@ return _react2['default'].createElement(
 
-/***/ 50:
+/***/ 187:
 /***/ function(module, exports) {
@@ -313,0 +313,0 @@

dist/HiddenFields.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(52);
+	module.exports = __webpack_require__(189);
 
@@ -149,3 +149,3 @@
 
-/***/ 52:
+/***/ 189:
 /***/ function(module, exports, __webpack_require__) {
@@ -152,0 +152,0 @@

dist/InlineFormField.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(53);
+	module.exports = __webpack_require__(190);
 
@@ -204,3 +204,3 @@
 
-/***/ 53:
+/***/ 190:
 /***/ function(module, exports, __webpack_require__) {
@@ -213,4 +213,2 @@
 
-	var _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; };
-
 	var _react = __webpack_require__(2);
@@ -224,2 +222,18 @@
 
+	var _InlineLabel = __webpack_require__(191);
+
+	var _InlineLabel2 = _interopRequireDefault(_InlineLabel);
+
+	var _TextField = __webpack_require__(195);
+
+	var _TextField2 = _interopRequireDefault(_TextField);
+
+	var _TextArea = __webpack_require__(199);
+
+	var _TextArea2 = _interopRequireDefault(_TextArea);
+
+	var _Select = __webpack_require__(203);
+
+	var _Select2 = _interopRequireDefault(_Select);
+
 	var _definitions = __webpack_require__(6);
@@ -229,13 +243,20 @@
 
-	__webpack_require__(54);
+	__webpack_require__(207);
 
 	var PropTypes = exports.PropTypes = {
-	  className: {
+	  id: {
 	    type: 'string',
-	    description: 'Any additional CSS classes to add to this component. `inline-label` gets added by default.'
+	    required: true
 	  },
-	  centered: {
-	    type: 'bool',
-	    defaultValue: true,
-	    description: 'Whether the label should appear in the center top of the input.'
+	  fieldType: {
+	    type: 'oneOf',
+	    allowedValues: ['input', 'textarea', 'select'],
+	    required: true
+	  },
+	  label: {
+	    type: 'any',
+	    required: true
+	  },
+	  className: {
+	    type: 'string'
 	  }
@@ -251,8 +272,23 @@ };
 	  },
+	  getContents: function getContents() {
+	    if (this.props.fieldType === 'input') {
+	      return _react2['default'].createElement(_TextField2['default'], this.props);
+	    } else if (this.props.fieldType === 'textarea') {
+	      return _react2['default'].createElement(_TextArea2['default'], this.props);
+	    } else if (this.props.fieldType === 'select') {
+	      return _react2['default'].createElement(_Select2['default'], this.props);
+	    }
+	  },
+
 	  render: function render() {
 	    return _react2['default'].createElement(
 	      'div',
-	      _extends({}, this.props, {
-	        className: (0, _classnames2['default'])('inline-label', this.props.className) }),
-	      this.props.children
+	      {
+	        className: (0, _classnames2['default'])('inline-label', this.props.className) },
+	      _react2['default'].createElement(
+	        _InlineLabel2['default'],
+	        { htmlFor: this.props.id },
+	        this.props.label
+	      ),
+	      this.getContents()
 	    );
@@ -266,3 +302,74 @@ }
 
-/***/ 54:
+/***/ 191:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+
+	var _InlineLabel = __webpack_require__(192);
+
+	Object.defineProperty(exports, 'default', {
+	  enumerable: true,
+	  get: function get() {
+	    return _interopRequireDefault(_InlineLabel)['default'];
+	  }
+	});
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+/***/ },
+
+/***/ 192:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+	exports.PropTypes = undefined;
+
+	var _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; };
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _definitions = __webpack_require__(6);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+	__webpack_require__(193);
+	var PropTypes = exports.PropTypes = {
+	  htmlFor: {
+	    type: 'string',
+	    required: true
+	  },
+	  children: {
+	    type: 'any',
+	    required: true
+	  }
+	};
+
+	var InlineLabel = _react2['default'].createClass({
+	  displayName: 'InlineLabel',
+
+	  propTypes: (0, _definitions.getPropTypes)(PropTypes),
+
+	  render: function render() {
+	    return _react2['default'].createElement(
+	      'label',
+	      _extends({
+	        className: 'inline-label__tag',
+	        htmlFor: this.props.htmlFor
+	      }, this.props),
+	      this.props.children
+	    );
+	  }
+	});
+
+	exports['default'] = InlineLabel;
+
+/***/ },
+
+/***/ 193:
 /***/ function(module, exports) {
@@ -272,2 +379,303 @@
 
+/***/ },
+
+/***/ 195:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+
+	var _TextField = __webpack_require__(196);
+
+	Object.defineProperty(exports, 'default', {
+	  enumerable: true,
+	  get: function get() {
+	    return _interopRequireDefault(_TextField)['default'];
+	  }
+	});
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+/***/ },
+
+/***/ 196:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+	exports.PropTypes = undefined;
+
+	var _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; };
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _classnames = __webpack_require__(5);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	var _definitions = __webpack_require__(6);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+	__webpack_require__(197);
+
+	var PropTypes = exports.PropTypes = {
+	  id: {
+	    type: 'string',
+	    required: true
+	  },
+	  value: {
+	    type: 'string'
+	  },
+	  type: {
+	    type: 'string',
+	    defaultValue: 'text'
+	  },
+	  required: {
+	    type: 'bool',
+	    defaultValue: false
+	  },
+	  touched: {
+	    type: 'bool'
+	  },
+	  error: {
+	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
+	  }
+	};
+
+	var TextField = _react2['default'].createClass({
+	  displayName: 'TextField',
+
+	  propTypes: (0, _definitions.getPropTypes)(PropTypes),
+	  getDefaultProps: function getDefaultProps() {
+	    return (0, _definitions.getDefaultProps)(PropTypes);
+	  },
+	  render: function render() {
+	    return _react2['default'].createElement('input', _extends({}, this.props, {
+	      className: (0, _classnames2['default'])(this.props.className, { 'input--alert': this.props.touched && this.props.error }),
+	      name: this.props.id,
+	      value: this.props.value
+	    }));
+	  }
+	});
+
+	exports['default'] = TextField;
+
+/***/ },
+
+/***/ 197:
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
+/***/ },
+
+/***/ 199:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+
+	var _TextArea = __webpack_require__(200);
+
+	Object.defineProperty(exports, 'default', {
+	  enumerable: true,
+	  get: function get() {
+	    return _interopRequireDefault(_TextArea)['default'];
+	  }
+	});
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+/***/ },
+
+/***/ 200:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+	exports.PropTypes = undefined;
+
+	var _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; };
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _classnames = __webpack_require__(5);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	var _definitions = __webpack_require__(6);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+	__webpack_require__(201);
+
+	var PropTypes = exports.PropTypes = {
+	  id: {
+	    type: 'string',
+	    defaultValue: 'field-id',
+	    required: true
+	  },
+	  value: {
+	    type: 'string',
+	    required: true
+	  },
+	  required: {
+	    type: 'bool',
+	    defaultValue: false
+	  },
+	  touched: {
+	    type: 'bool'
+	  },
+	  error: {
+	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
+	  }
+	};
+
+	var TextArea = _react2['default'].createClass({
+	  displayName: 'TextArea',
+
+	  propTypes: (0, _definitions.getPropTypes)(PropTypes),
+	  render: function render() {
+	    return _react2['default'].createElement('textarea', _extends({}, this.props, {
+	      className: (0, _classnames2['default'])(this.props.className, { 'textarea--alert': this.props.touched && this.props.error }),
+	      name: this.props.id,
+	      value: this.props.value
+	    }));
+	  }
+	});
+
+	exports['default'] = TextArea;
+
+/***/ },
+
+/***/ 201:
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
+/***/ },
+
+/***/ 203:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+
+	var _Select = __webpack_require__(204);
+
+	Object.defineProperty(exports, 'default', {
+	  enumerable: true,
+	  get: function get() {
+	    return _interopRequireDefault(_Select)['default'];
+	  }
+	});
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+/***/ },
+
+/***/ 204:
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.__esModule = true;
+	exports.PropTypes = undefined;
+
+	var _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; };
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _definitions = __webpack_require__(6);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+	__webpack_require__(205);
+
+	var PropTypes = exports.PropTypes = {
+	  id: {
+	    type: 'string',
+	    required: true
+	  },
+	  options: {
+	    type: 'arrayOf',
+	    allowedValues: _react2['default'].PropTypes.object,
+	    required: true
+	  },
+	  className: {
+	    type: 'string'
+	  },
+	  value: {
+	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
+	  }
+	};
+
+	var Select = _react2['default'].createClass({
+	  displayName: 'Select',
+
+	  propTypes: (0, _definitions.getPropTypes)(PropTypes),
+	  getFirstOptionValue: function getFirstOptionValue() {
+	    if (!this.props.options[0]) {
+	      return '';
+	    }
+
+	    return this.props.options[0].value;
+	  },
+	  render: function render() {
+	    var options = this.props.options.map(function (key) {
+	      return _react2['default'].createElement(
+	        'option',
+	        {
+	          value: key.value,
+	          key: key.value },
+	        key.label
+	      );
+	    });
+	    return _react2['default'].createElement(
+	      'select',
+	      _extends({}, this.props, {
+	        name: this.props.id,
+	        value: this.props.value }),
+	      options
+	    );
+	  }
+	});
+
+	exports['default'] = Select;
+
+/***/ },
+
+/***/ 205:
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
+/***/ },
+
+/***/ 207:
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
 /***/ }
@@ -274,0 +682,0 @@

dist/InlineLabel.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(56);
+	module.exports = __webpack_require__(192);
 
@@ -149,3 +149,3 @@
 
-/***/ 56:
+/***/ 192:
 /***/ function(module, exports, __webpack_require__) {
@@ -168,3 +168,3 @@
 
-	__webpack_require__(57);
+	__webpack_require__(193);
 	var PropTypes = exports.PropTypes = {
@@ -202,3 +202,3 @@ htmlFor: {
 
-/***/ 57:
+/***/ 193:
 /***/ function(module, exports) {
@@ -205,0 +205,0 @@

dist/InputCounter.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(59);
+	module.exports = __webpack_require__(209);
 
@@ -204,3 +204,3 @@
 
-/***/ 59:
+/***/ 209:
 /***/ function(module, exports, __webpack_require__) {
@@ -225,3 +225,3 @@
 
-	__webpack_require__(60);
+	__webpack_require__(210);
 	var PropTypes = exports.PropTypes = {
@@ -268,3 +268,3 @@ maxLength: {
 
-/***/ 60:
+/***/ 210:
 /***/ function(module, exports) {
@@ -271,0 +271,0 @@

dist/List.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(62);
+	module.exports = __webpack_require__(212);
 
@@ -204,3 +204,3 @@
 
-/***/ 62:
+/***/ 212:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,3 +227,3 @@
 
-	__webpack_require__(63);
+	__webpack_require__(213);
 
@@ -266,3 +266,3 @@ var PropTypes = exports.PropTypes = {
 
-/***/ 63:
+/***/ 213:
 /***/ function(module, exports) {
@@ -269,0 +269,0 @@

dist/locale.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(239);
+	module.exports = __webpack_require__(249);
 
@@ -64,3 +64,3 @@
 
-/***/ 239:
+/***/ 249:
 /***/ function(module, exports) {
@@ -67,0 +67,0 @@

dist/makeQueryParams.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(42);
+	module.exports = __webpack_require__(179);
 
@@ -64,3 +64,3 @@
 
-/***/ 42:
+/***/ 179:
 /***/ function(module, exports) {
@@ -67,0 +67,0 @@

dist/Media.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(65);
+	module.exports = __webpack_require__(215);
 
@@ -204,3 +204,3 @@
 
-/***/ 65:
+/***/ 215:
 /***/ function(module, exports, __webpack_require__) {
@@ -225,3 +225,3 @@
 
-	__webpack_require__(66);
+	__webpack_require__(216);
 
@@ -317,3 +317,3 @@ var MediaPropTypes = exports.MediaPropTypes = {
 
-/***/ 66:
+/***/ 216:
 /***/ function(module, exports) {
@@ -320,0 +320,0 @@

dist/Panel.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(70);
+	module.exports = __webpack_require__(220);
 
@@ -204,3 +204,3 @@
 
-/***/ 70:
+/***/ 220:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,4 +227,4 @@
 
-	__webpack_require__(71);
-	// require("svg-url!./images/panel-highlight-green.svg");
+	__webpack_require__(221);
+
 	var PropTypes = exports.PropTypes = {
@@ -235,4 +235,3 @@ border: {
 	    allowedValues: ['shadow', 'solid'],
-	    defaultValue: 'shadow',
-	    description: 'Add a border or shadow edge. (`solid` borders are not visible when a background is applied).'
+	    defaultValue: 'shadow'
 	  },
@@ -242,4 +241,3 @@ highlight: {
 	    canBeNull: true,
-	    allowedValues: ['grass-ceiling', 'grass-ceiling-red', 'airmail'],
-	    description: 'Something special to line the top of the panel. (Is not visible when a background is applied).'
+	    allowedValues: ['grass-ceiling', 'grass-ceiling-red']
 	  },
@@ -249,8 +247,10 @@ background: {
 	    canBeNull: true,
-	    allowedValues: ['alert', 'light', 'notice', 'semi-transparent', 'semi-transparent-tinted'],
-	    description: 'The background color of the panel'
+	    allowedValues: ['alert', 'light', 'notice', 'semi-transparent', 'semi-transparent-tinted']
 	  },
 	  className: {
-	    type: 'string',
-	    description: 'An optional property to add some CSS classes to the component'
+	    type: 'string'
+	  },
+	  children: {
+	    type: 'node',
+	    required: true
 	  }
@@ -277,3 +277,3 @@ };
 
-/***/ 71:
+/***/ 221:
 /***/ function(module, exports) {
@@ -280,0 +280,0 @@

dist/Rule.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(224);
+	module.exports = __webpack_require__(237);
 
@@ -149,3 +149,3 @@
 
-/***/ 224:
+/***/ 237:
 /***/ function(module, exports, __webpack_require__) {
@@ -166,3 +166,3 @@
 
-	__webpack_require__(225);
+	__webpack_require__(238);
 	var PropTypes = exports.PropTypes = {
@@ -188,3 +188,3 @@ type: {
 
-/***/ 225:
+/***/ 238:
 /***/ function(module, exports) {
@@ -191,0 +191,0 @@

dist/Select.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(228);
+	module.exports = __webpack_require__(204);
 
@@ -149,3 +149,3 @@
 
-/***/ 228:
+/***/ 204:
 /***/ function(module, exports, __webpack_require__) {
@@ -168,3 +168,3 @@
 
-	__webpack_require__(229);
+	__webpack_require__(205);
 
@@ -186,2 +186,5 @@ var PropTypes = exports.PropTypes = {
 	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
 	  }
@@ -225,3 +228,3 @@ };
 
-/***/ 229:
+/***/ 205:
 /***/ function(module, exports) {
@@ -228,0 +231,0 @@

dist/setTestGlobal.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(277);
+	module.exports = __webpack_require__(279);
 
@@ -64,3 +64,3 @@
 
-/***/ 277:
+/***/ 279:
 /***/ function(module, exports) {
@@ -67,0 +67,0 @@

dist/SocialIcon.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(231);
+	module.exports = __webpack_require__(241);
 
@@ -149,3 +149,3 @@
 
-/***/ 231:
+/***/ 241:
 /***/ function(module, exports, __webpack_require__) {
@@ -168,13 +168,11 @@
 
-	__webpack_require__(232);
+	__webpack_require__(242);
 	var PropTypes = exports.PropTypes = {
 	  network: {
 	    type: 'string',
-	    required: true,
-	    description: 'The social network icon to be displayed.'
+	    required: true
 	  },
 	  href: {
 	    type: 'string',
-	    required: true,
-	    description: 'The URL of the social network page to link to.'
+	    required: true
 	  }
@@ -201,3 +199,3 @@ };
 
-/***/ 232:
+/***/ 242:
 /***/ function(module, exports) {
@@ -204,0 +202,0 @@

dist/StarRating.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(234);
+	module.exports = __webpack_require__(244);
 
@@ -273,3 +273,3 @@
 
-/***/ 234:
+/***/ 244:
 /***/ function(module, exports, __webpack_require__) {
@@ -298,3 +298,3 @@
 
-	__webpack_require__(235);
+	__webpack_require__(245);
 
@@ -337,3 +337,3 @@ var PropTypes = exports.PropTypes = {
 
-/***/ 235:
+/***/ 245:
 /***/ function(module, exports) {
@@ -340,0 +340,0 @@

dist/SvgTag.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(237);
+	module.exports = __webpack_require__(247);
 
@@ -149,3 +149,3 @@
 
-/***/ 237:
+/***/ 247:
 /***/ function(module, exports, __webpack_require__) {
@@ -166,3 +166,3 @@
 
-	var _assets = __webpack_require__(238);
+	var _assets = __webpack_require__(248);
 
@@ -223,3 +223,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-/***/ 238:
+/***/ 248:
 /***/ function(module, exports, __webpack_require__) {
@@ -234,3 +234,3 @@
 
-	var _locale = __webpack_require__(239);
+	var _locale = __webpack_require__(249);
 
@@ -279,3 +279,3 @@ /**
 
-/***/ 239:
+/***/ 249:
 /***/ function(module, exports) {
@@ -282,0 +282,0 @@

dist/TextArea.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(240);
+	module.exports = __webpack_require__(200);
 
@@ -204,3 +204,3 @@
 
-/***/ 240:
+/***/ 200:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,3 +227,3 @@
 
-	__webpack_require__(241);
+	__webpack_require__(201);
 
@@ -249,2 +249,5 @@ var PropTypes = exports.PropTypes = {
 	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
 	  }
@@ -270,3 +273,3 @@ };
 
-/***/ 241:
+/***/ 201:
 /***/ function(module, exports) {
@@ -273,0 +276,0 @@

dist/TextField.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(243);
+	module.exports = __webpack_require__(196);
 
@@ -204,3 +204,3 @@
 
-/***/ 243:
+/***/ 196:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,3 +227,3 @@
 
-	__webpack_require__(244);
+	__webpack_require__(197);
 
@@ -233,18 +233,14 @@ var PropTypes = exports.PropTypes = {
 	    type: 'string',
-	    required: true,
-	    description: 'The unique `id` for this field, used for storing the value of the field when submitting.'
+	    required: true
 	  },
 	  value: {
-	    type: 'string',
-	    description: 'The value of the TextField.'
+	    type: 'string'
 	  },
 	  type: {
 	    type: 'string',
-	    defaultValue: 'text',
-	    description: 'The type of `<input>`, in case you wish to change to something like email, number, search, etc.'
+	    defaultValue: 'text'
 	  },
 	  required: {
 	    type: 'bool',
-	    defaultValue: false,
-	    description: 'Whether this field is required for validation'
+	    defaultValue: false
 	  },
@@ -256,2 +252,5 @@ touched: {
 	    type: 'string'
+	  },
+	  onChange: {
+	    type: 'func'
 	  }
@@ -280,3 +279,3 @@ };
 
-/***/ 244:
+/***/ 197:
 /***/ function(module, exports) {
@@ -283,0 +282,0 @@

dist/Tooltip.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(246);
+	module.exports = __webpack_require__(250);
 
@@ -204,3 +204,3 @@
 
-/***/ 246:
+/***/ 250:
 /***/ function(module, exports, __webpack_require__) {
@@ -227,29 +227,25 @@
 
-	__webpack_require__(247);
+	__webpack_require__(251);
 
 	var PropTypes = exports.PropTypes = {
 	  visible: {
-	    type: 'bool',
-	    description: 'Whether the current `Tooltip` is visible or not.'
+	    type: 'bool'
 	  },
-	  unstyledifNoJs: {
-	    type: 'bool',
-	    description: 'Whether the tooltip should styles should be rendered when JS is not available.'
+	  absolute: {
+	    type: 'bool'
 	  },
-	  inlineOnTabletDown: {
-	    type: 'bool',
-	    description: 'Whether we should show this `Tooltip` inline on tablet sized and smaller screens, or keep it positioned absolutely.'
+	  unstyledIfNoJs: {
+	    type: 'bool'
 	  },
-	  inlineOnFabletDown: {
-	    type: 'bool',
-	    description: 'Whether we should show this `Tooltip` inline on fablet sized and smaller screens, or keep it positioned absolutely'
+	  inlineOn: {
+	    type: 'oneOf',
+	    allowedValues: ['mobile', 'fablet-down', 'fablet', 'fablet-up', 'tablet-down', 'tablet', 'tablet-up'],
+	    canBeNull: true
 	  },
 	  huge: {
-	    type: 'bool',
-	    description: 'Whether to double the width of the tooltip'
+	    type: 'bool'
 	  },
 	  type: {
 	    type: 'oneOf',
-	    allowedValues: ['default', 'alert'],
-	    description: 'This changes the appearance of the `Tooltip`, useful for things like validation errors.'
+	    allowedValues: ['default', 'alert']
 	  },
@@ -259,4 +255,3 @@ tooltipAlignment: {
 	    allowedValues: ['below', 'above'],
-	    defaultValue: 'above',
-	    description: 'This prop determins the placement of the caret of the tooltip. If this prop is set to `above`, we add the caret to the bottom as we therefore expect the `ToolTip` to be positioned above any related nodes. If this props is set to `below`, we add the caret to the top.'
+	    defaultValue: 'above'
 	  },
@@ -266,12 +261,9 @@ tooltipSide: {
 	    allowedValues: ['center', 'left', 'right'],
-	    defaultValue: 'center',
-	    description: 'What side of the associated element the `Tooltip` should anchor to.'
+	    defaultValue: 'center'
 	  },
 	  noPadding: {
-	    type: 'bool',
-	    description: 'If checked, we add no padding to the `Tooltip`. Useful if another element is a child of the `Tooltip`, for example a `Panel`'
+	    type: 'bool'
 	  },
 	  children: {
-	    type: 'any',
-	    description: 'The content of the `Tooltip`.'
+	    type: 'any'
 	  }
@@ -288,3 +280,3 @@ };
 	  render: function render() {
-	    var classes = (0, _classnames2['default'])({ tooltip: !this.props.unstyledifNoJs }, { 'tooltip-if-js': this.props.unstyledifNoJs }, { 'tooltip--inline-on-tablet-down': this.props.inlineOnTabletDown }, { 'tooltip--inline-on-fablet-down': this.props.inlineOnFabletDown }, { 'tooltip--padded': !this.props.noPadding }, { 'tooltip--visible': this.props.visible }, _defineProperty({}, 'tooltip--' + this.props.type, this.props.type && this.props.type !== 'default'), _defineProperty({}, 'tooltip--' + this.props.tooltipSide, this.props.tooltipSide), _defineProperty({}, 'tooltip--' + this.props.tooltipAlignment, this.props.tooltipAlignment), _defineProperty({}, 'tooltip--huge', this.props.huge));
+	    var classes = (0, _classnames2['default'])({ tooltip: !this.props.unstyledifNoJs }, { 'tooltip-if-js': this.props.unstyledifNoJs }, _defineProperty({}, 'tooltip--inline-on-' + this.props.inlineOn, this.props.inlineOn), { 'tooltip--padded': !this.props.noPadding }, { 'tooltip--visible': this.props.visible }, { 'tooltip--absolute': this.props.absolute }, _defineProperty({}, 'tooltip--' + this.props.type, this.props.type && this.props.type !== 'default'), _defineProperty({}, 'tooltip--' + this.props.tooltipSide, this.props.tooltipSide), _defineProperty({}, 'tooltip--' + this.props.tooltipAlignment, this.props.tooltipAlignment), _defineProperty({}, 'tooltip--huge', this.props.huge));
 
@@ -301,3 +293,3 @@ return _react2['default'].createElement(
 
-/***/ 247:
+/***/ 251:
 /***/ function(module, exports) {
@@ -304,0 +296,0 @@

dist/ValueProps.js

@@ -58,3 +58,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-	module.exports = __webpack_require__(249);
+	module.exports = __webpack_require__(253);
 
@@ -393,3 +393,3 @@
 
-/***/ 249:
+/***/ 253:
 /***/ function(module, exports, __webpack_require__) {
@@ -412,3 +412,3 @@
 
-	__webpack_require__(250);
+	__webpack_require__(254);
 
@@ -451,3 +451,3 @@ var PropTypes = exports.PropTypes = {
 
-/***/ 250:
+/***/ 254:
 /***/ function(module, exports) {
@@ -454,0 +454,0 @@

package.json

 {
   "name": "@lostmyname/components",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "The home of all of Lost My Name's reusable React Components",
@@ -48,2 +48,3 @@ "main": "dist/components.js",
     "babel-preset-es2015-lmn": "^2.0.0",
+    "babel-preset-lmn": "^1.0.1",
     "babel-preset-react": "^6.5.0",
@@ -50,0 +51,0 @@ "babel-register": "^6.9.0",

No alert changes

Improved metrics

Total package byte prevSize

1165498

increased by47.3%

Lines of code

36655

increased by52.82%

Worsened metrics

Dev dependency count

40

increased by2.56%

Number of medium supply chain risk alerts

6

increased by100%

No dependency changes