es-components - npm Package Compare versions

Comparing version 3.8.2 to 3.9.0

lib/components/controls/checkbox/Checkbox.js

@@ -37,4 +37,4 @@ 'use strict';
     _templateObject2 = (0, _taggedTemplateLiteral3.default)(['\n  clip: rect(0, 0, 0, 0);\n  position: absolute;\n\n  &:focus ~ .checkbox-fill {\n    outline: 5px auto ', ';\n  }\n'], ['\n  clip: rect(0, 0, 0, 0);\n  position: absolute;\n\n  &:focus ~ .checkbox-fill {\n    outline: 5px auto ', ';\n  }\n']),
-    _templateObject3 = (0, _taggedTemplateLiteral3.default)(['\n  background: ', '\n  border: 3px solid ', ';\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  height: 25px;\n  position: absolute;\n  transition: all .25s linear;\n  width: 25px;\n\n  &:after {\n    background: transparent;\n    border: 3px solid ', ';\n    border-right: none;\n    border-top: none;\n    box-sizing: border-box;\n    content: \'\';\n    height: 9px;\n    top: 3px;\n    left: 2px;\n    position: absolute;\n    transform: rotate(-45deg);\n    transition: border .25s linear;\n    width: 15px;\n  }\n'], ['\n  background: ', '\n  border: 3px solid ', ';\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  height: 25px;\n  position: absolute;\n  transition: all .25s linear;\n  width: 25px;\n\n  &:after {\n    background: transparent;\n    border: 3px solid ', ';\n    border-right: none;\n    border-top: none;\n    box-sizing: border-box;\n    content: \'\';\n    height: 9px;\n    top: 3px;\n    left: 2px;\n    position: absolute;\n    transform: rotate(-45deg);\n    transition: border .25s linear;\n    width: 15px;\n  }\n']),
-    _templateObject4 = (0, _taggedTemplateLiteral3.default)(['\n  margin-left: 30px;\n'], ['\n  margin-left: 30px;\n']);
+    _templateObject3 = (0, _taggedTemplateLiteral3.default)(['\n  background: ', ';\n  border: 3px solid ', ';\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  height: 25px;\n  position: absolute;\n  transition: all .25s linear;\n  width: 25px;\n\n  &:after {\n    background: transparent;\n    border: 3px solid ', ';\n    border-right: none;\n    border-top: none;\n    box-sizing: border-box;\n    content: \'\';\n    height: 9px;\n    top: 3px;\n    left: 2px;\n    position: absolute;\n    transform: rotate(-45deg);\n    transition: border .25s linear;\n    width: 15px;\n  }\n'], ['\n  background: ', ';\n  border: 3px solid ', ';\n  border-radius: 4px;\n  box-sizing: border-box;\n  cursor: pointer;\n  height: 25px;\n  position: absolute;\n  transition: all .25s linear;\n  width: 25px;\n\n  &:after {\n    background: transparent;\n    border: 3px solid ', ';\n    border-right: none;\n    border-top: none;\n    box-sizing: border-box;\n    content: \'\';\n    height: 9px;\n    top: 3px;\n    left: 2px;\n    position: absolute;\n    transform: rotate(-45deg);\n    transition: border .25s linear;\n    width: 15px;\n  }\n']),
+    _templateObject4 = (0, _taggedTemplateLiteral3.default)(['\n  line-height: 1.4;\n  margin-left: 30px;\n'], ['\n  line-height: 1.4;\n  margin-left: 30px;\n']);
 
@@ -61,3 +61,3 @@ var _react = require('react');
 
-var CheckboxLabel = (0, _styledComponents2.default)(_Label2.default)(_templateObject, _theme.sizes.baseFontSize, function (props) {
+var CheckboxLabel = _Label2.default.extend(_templateObject, _theme.sizes.baseFontSize, function (props) {
   return props.isChecked ? _theme.colors.accent : _theme.colors.white;
@@ -64,0 +64,0 @@ }, function (props) {

lib/components/controls/Label.js

@@ -11,3 +11,3 @@ 'use strict';
 
-var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n  color: ', ';\n  display: ', ';\n  margin-bottom: 20px;\n  text-transform: uppercase;\n  flex: ', ';\n  font-size: ', 'px;\n  font-weight: bold;\n\n  &[disabled] {\n    cursor: not-allowed;\n  }\n'], ['\n  color: ', ';\n  display: ', ';\n  margin-bottom: 20px;\n  text-transform: uppercase;\n  flex: ', ';\n  font-size: ', 'px;\n  font-weight: bold;\n\n  &[disabled] {\n    cursor: not-allowed;\n  }\n']);
+var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n  color: ', ';\n  cursor: pointer;\n  display: ', ';\n  margin-bottom: 20px;\n  text-transform: uppercase;\n  flex: ', ';\n  font-size: ', 'px;\n  font-weight: bold;\n\n  &[disabled] {\n    cursor: not-allowed;\n  }\n'], ['\n  color: ', ';\n  cursor: pointer;\n  display: ', ';\n  margin-bottom: 20px;\n  text-transform: uppercase;\n  flex: ', ';\n  font-size: ', 'px;\n  font-weight: bold;\n\n  &[disabled] {\n    cursor: not-allowed;\n  }\n']);
 
@@ -14,0 +14,0 @@ var _styledComponents = require('styled-components');

lib/index.js

@@ -6,3 +6,3 @@ 'use strict';
 });
-exports.DatePickerTextbox = exports.DatePicker = exports.Dropdown = exports.RadioGroup = exports.Button = exports.Textbox = exports.Label = exports.Modal = exports.PopoverLink = exports.Tooltip = exports.Fieldset = exports.Drawer = exports.Alert = exports.Icon = undefined;
+exports.DatePickerTextbox = exports.Checkbox = exports.DatePicker = exports.Dropdown = exports.RadioGroup = exports.Button = exports.Textbox = exports.Label = exports.Modal = exports.PopoverLink = exports.Tooltip = exports.Fieldset = exports.Drawer = exports.Alert = exports.Icon = undefined;
 
@@ -61,2 +61,6 @@ var _Icon2 = require('./components/base/icons/Icon');
 
+var _Checkbox2 = require('./components/controls/checkbox/Checkbox');
+
+var _Checkbox3 = _interopRequireDefault(_Checkbox2);
+
 var _DatePickerTextbox2 = require('./components/patterns/datepicker-textbox/DatePickerTextbox');
@@ -81,2 +85,3 @@
 exports.DatePicker = _DatePicker3.default;
+exports.Checkbox = _Checkbox3.default;
 exports.DatePickerTextbox = _DatePickerTextbox3.default;

package.json

 {
   "name": "es-components",
-  "version": "3.8.2",
+  "version": "3.9.0",
   "description": "React components built for Exchange Solutions products",
@@ -5,0 +5,0 @@ "repository": "https://github.com/TWExchangeSolutions/es-components",

src/components/controls/Label.js

@@ -7,2 +7,3 @@ import styled from 'styled-components';
   color: ${props => props.color || 'inherit'};
+  cursor: pointer;
   display: ${props => (props.inline ? 'flex' : 'block')};
@@ -9,0 +10,0 @@ margin-bottom: 20px;

src/index.js

@@ -16,3 +16,4 @@ export Icon from './components/base/icons/Icon';
 export DatePicker from './components/controls/datepicker/DatePicker';
+export Checkbox from './components/controls/checkbox/Checkbox';
 
 export DatePickerTextbox from './components/patterns/datepicker-textbox/DatePickerTextbox';

No alert changes

Improved metrics

Total package byte prevSize

621853

increased by0.98%

Number of package files

164

increased by3.8%

Lines of code

9013

increased by1.73%

No dependency changes