@desynova-digital/components 8.19.0 → 8.19.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/atoms/icon/icon.story.js +4 -1
  2. package/atoms/icon/icons.json +28 -0
  3. package/atoms/inputText/inputText.js +7 -4
  4. package/package.json +2 -2
package/atoms/icon/icon.story.js CHANGED
@@ -208,7 +208,10 @@ console.log(iconsArr);
208
208
  _react2.default.createElement(_components.Icon, { name: "log-out", width: 12, height: 12 }),
209
209
  _react2.default.createElement(_components.Icon, { name: "brief", width: 14, height: 12 }),
210
210
  _react2.default.createElement(_components.Icon, { name: "upload-asset", width: 24, height: 24 }),
211
- _react2.default.createElement(_components.Icon, { name: "back-to-back", width: 14, height: 15 })
211
+ _react2.default.createElement(_components.Icon, { name: "back-to-back", width: 14, height: 15 }),
212
+ _react2.default.createElement(_components.Icon, { name: "clevr", width: 16, height: 16, color: "#999" }),
213
+ _react2.default.createElement(_components.Icon, { name: "craft", width: 16, height: 16, color: "#999" }),
214
+ _react2.default.createElement(_components.Icon, { name: "check-module", width: 16, height: 16, color: "#999" })
212
215
  )
213
216
  );
214
217
  });
package/atoms/icon/icons.json CHANGED
@@ -1440,6 +1440,34 @@
1440
1440
  ],
1441
1441
  "width": 8,
1442
1442
  "height": 8
1443
+ },
1444
+ "clevr": {
1445
+ "paths": [
1446
+ "M5.33333 0.666667V2H4C2.89543 2 2 2.89543 2 4V5.33333H0.666667C0.298477 5.33333 0 5.63181 0 6C0 6.36819 0.298477 6.66667 0.666667 6.66667H2V8.66667H0.666667C0.298477 8.66667 0 8.96514 0 9.33333C0 9.70152 0.298477 10 0.666667 10H2V12C2 13.1046 2.89543 14 4 14H5.33333V15.3333C5.33333 15.7015 5.63181 16 6 16C6.36819 16 6.66667 15.7015 6.66667 15.3333V14H9.33333V15.3333C9.33333 15.7015 9.63181 16 10 16C10.3682 16 10.6667 15.7015 10.6667 15.3333V14H12C13.1046 14 14 13.1046 14 12V10H15.3333C15.7015 10 16 9.70152 16 9.33333C16 8.96514 15.7015 8.66667 15.3333 8.66667H14V6.66667H15.3333C15.7015 6.66667 16 6.36819 16 6C16 5.63181 15.7015 5.33333 15.3333 5.33333H14V4C14 2.89543 13.1046 2 12 2H10.6667V0.666667C10.6667 0.298477 10.3682 0 10 0C9.63181 0 9.33333 0.298477 9.33333 0.666667V2H6.66667V0.666667C6.66667 0.298477 6.36819 0 6 0C5.63181 0 5.33333 0.298477 5.33333 0.666667ZM3.33333 9.33333V12C3.33333 12.3682 3.63181 12.6667 4 12.6667L6 12.6667H10L12 12.6667C12.3682 12.6667 12.6667 12.3682 12.6667 12L12.6667 9.33333V6L12.6667 4C12.6667 3.63181 12.3682 3.33333 12 3.33333H10H6H4C3.63181 3.33333 3.33333 3.63181 3.33333 4V6V9.33333ZM6 5.33333H10C10.3682 5.33333 10.6667 5.63181 10.6667 6V10C10.6667 10.3682 10.3682 10.6667 10 10.6667H6C5.63181 10.6667 5.33333 10.3682 5.33333 10V6C5.33333 5.63181 5.63181 5.33333 6 5.33333ZM9.33333 9.33333H6.66667V6.66667H9.33333V9.33333Z"
1447
+ ],
1448
+ "width": 16,
1449
+ "height": 16,
1450
+ "fillRule": "evenodd",
1451
+ "clipRule": "evenodd"
1452
+ },
1453
+ "craft": {
1454
+ "paths": [
1455
+ "M0 8C0 12.4183 3.58172 16 8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8ZM14.5455 8C14.5455 11.615 11.615 14.5455 8 14.5455C4.38505 14.5455 1.45455 11.615 1.45455 8C1.45455 4.38505 4.38505 1.45455 8 1.45455C11.615 1.45455 14.5455 4.38505 14.5455 8ZM8 13.0909C5.18837 13.0909 2.90909 10.8116 2.90909 8C2.90909 5.18837 5.18837 2.90909 8 2.90909C10.8116 2.90909 13.0909 5.18837 13.0909 8C13.0909 10.8116 10.8116 13.0909 8 13.0909ZM11.6364 8C11.6364 10.0083 10.0083 11.6364 8 11.6364C5.99169 11.6364 4.36364 10.0083 4.36364 8C4.36364 5.99169 5.99169 4.36364 8 4.36364C10.0083 4.36364 11.6364 5.99169 11.6364 8ZM8 10.1818C6.79502 10.1818 5.81818 9.20498 5.81818 8C5.81818 6.79502 6.79502 5.81818 8 5.81818C9.20498 5.81818 10.1818 6.79502 10.1818 8C10.1818 9.20498 9.20498 10.1818 8 10.1818ZM8.72727 8C8.72727 8.40166 8.40166 8.72727 8 8.72727C7.59834 8.72727 7.27273 8.40166 7.27273 8C7.27273 7.59834 7.59834 7.27273 8 7.27273C8.40166 7.27273 8.72727 7.59834 8.72727 8Z"
1456
+ ],
1457
+ "width": 16,
1458
+ "height": 16,
1459
+ "fillRule": "evenodd",
1460
+ "clipRule": "evenodd"
1461
+ },
1462
+ "check-module": {
1463
+ "paths": [
1464
+ "M0 8C0 12.4183 3.58172 16 8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8ZM14.5455 8C14.5455 11.615 11.615 14.5455 8 14.5455C4.38505 14.5455 1.45455 11.615 1.45455 8C1.45455 4.38505 4.38505 1.45455 8 1.45455C11.615 1.45455 14.5455 4.38505 14.5455 8Z",
1465
+ "M5.56904 8.09763C5.43886 7.96746 5.22781 7.96746 5.09763 8.09763C4.96746 8.22781 4.96746 8.43886 5.09763 8.56904L6.7643 10.2357C6.89447 10.3659 7.10553 10.3659 7.2357 10.2357L10.9024 6.56904C11.0325 6.43886 11.0325 6.22781 10.9024 6.09763C10.7722 5.96746 10.5611 5.96746 10.431 6.09763L7 9.5286L5.56904 8.09763Z"
1466
+ ],
1467
+ "width": 16,
1468
+ "height": 16,
1469
+ "fillRule": "evenodd",
1470
+ "clipRule": "evenodd"
1443
1471
  }
1444
1472
  }
1445
1473
  }
package/atoms/inputText/inputText.js CHANGED
@@ -12,7 +12,8 @@ var _templateObject = _taggedTemplateLiteral(['\n background: transparent;\n f
12
12
  _templateObject2 = _taggedTemplateLiteral(['\n color: ', ';\n padding-top: 5px;\n display: inline-block;\n font-size: 12px;\n font-family: inherit;\n width: 100%;\n text-align: left;\n'], ['\n color: ', ';\n padding-top: 5px;\n display: inline-block;\n font-size: 12px;\n font-family: inherit;\n width: 100%;\n text-align: left;\n']),
13
13
  _templateObject3 = _taggedTemplateLiteral(['\n background: none;\n border: none;\n cursor: pointer;\n position: absolute;\n right: 0;\n top: 5px;\n &:focus {\n outline: none;\n }\n'], ['\n background: none;\n border: none;\n cursor: pointer;\n position: absolute;\n right: 0;\n top: 5px;\n &:focus {\n outline: none;\n }\n']),
14
14
  _templateObject4 = _taggedTemplateLiteral(['\n position: absolute;\n right: 0px;\n top: 0px;\n background-color: #303F51;\n border-radius: 12px;\n font-size: 12px;\n padding: 5px 10px;\n color: #FFFFFF;\n'], ['\n position: absolute;\n right: 0px;\n top: 0px;\n background-color: #303F51;\n border-radius: 12px;\n font-size: 12px;\n padding: 5px 10px;\n color: #FFFFFF;\n']),
15
- _templateObject5 = _taggedTemplateLiteral(['\n width: 100%;\n box-sizing: border-box;\n\n background: ', ';\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n border-bottom: 1px solid\n ', ';\n\n font-family: \'SFUIText-Medium\';\n color: ', ';\n\n cursor: ', ';\n\n font-size: 14px;\n padding: 7px 0px 2px;\n margin-top: 15px;\n display: block;\n\n &:hover {\n border-color: ', ';\n }\n &:disabled:hover {\n border-color: ', ';\n }\n &:disabled {\n border-color: ', ';\n color: ', ';\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ', ';\n\n opacity: ', ';\n transition: 0.2s ease all;\n }\n\n &:focus::placeholder {\n color: ', ';\n\n opacity: ', ';\n }\n'], ['\n width: 100%;\n box-sizing: border-box;\n\n background: ', ';\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n border-bottom: 1px solid\n ', ';\n\n font-family: \'SFUIText-Medium\';\n color: ', ';\n\n cursor: ', ';\n\n font-size: 14px;\n padding: 7px 0px 2px;\n margin-top: 15px;\n display: block;\n\n &:hover {\n border-color: ', ';\n }\n &:disabled:hover {\n border-color: ', ';\n }\n &:disabled {\n border-color: ', ';\n color: ', ';\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ', ';\n\n opacity: ', ';\n transition: 0.2s ease all;\n }\n\n &:focus::placeholder {\n color: ', ';\n\n opacity: ', ';\n }\n']);
15
+ _templateObject5 = _taggedTemplateLiteral(['', ' '], ['', ' ']),
16
+ _templateObject6 = _taggedTemplateLiteral(['\n width: 100%;\n box-sizing: border-box;\n\n background: ', ';\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n border-bottom: 1px solid\n ', ';\n\n font-family: \'SFUIText-Medium\';\n color: ', ';\n\n cursor: ', ';\n\n font-size: 14px;\n padding: ', ';\n margin-top: 15px;\n display: block;\n\n &:hover {\n border-color: ', ';\n }\n &:disabled:hover {\n border-color: ', ';\n }\n &:disabled {\n border-color: ', ';\n color: ', ';\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ', ';\n\n opacity: ', ';\n transition: 0.2s ease all;\n }\n\n &:focus::placeholder {\n color: ', ';\n\n opacity: ', ';\n }\n'], ['\n width: 100%;\n box-sizing: border-box;\n\n background: ', ';\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n border-bottom: 1px solid\n ', ';\n\n font-family: \'SFUIText-Medium\';\n color: ', ';\n\n cursor: ', ';\n\n font-size: 14px;\n padding: ', ';\n margin-top: 15px;\n display: block;\n\n &:hover {\n border-color: ', ';\n }\n &:disabled:hover {\n border-color: ', ';\n }\n &:disabled {\n border-color: ', ';\n color: ', ';\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ', ';\n\n opacity: ', ';\n transition: 0.2s ease all;\n }\n\n &:focus::placeholder {\n color: ', ';\n\n opacity: ', ';\n }\n']);
16
17
 
17
18
  var _react = require('react');
18
19
 
@@ -86,14 +87,14 @@ var InputText = function InputText(_ref) {
86
87
  return _react2.default.createElement(
87
88
  InputTextDiv,
88
89
  { theme: props.theme },
89
- _react2.default.createElement(InputText.Element, _extends({ type: hidden ? type : 'text', value: props.value, defaultValue: defaultValue }, props, { maxLength: maxLength || '' })),
90
+ _react2.default.createElement(InputText.Element, _extends({ type: hidden ? type : 'text', value: props.value, defaultValue: defaultValue }, props, { maxLength: maxLength || '', showLengthCount: showLengthCount || false })),
90
91
  props.label ? _react2.default.createElement(
91
92
  'label',
92
93
  {
93
94
  htmlFor: props.id,
94
95
  className: props.value && props.value.length > 0 ? 'floaton' : ''
95
96
  },
96
- '' + props.label + (props.isRequired ? '*' : '')
97
+ props.isRequired && '*'(_templateObject5, props.label)
97
98
  ) : '',
98
99
  errorMesssage ? _react2.default.createElement(
99
100
  InputError,
@@ -132,7 +133,7 @@ var InputText = function InputText(_ref) {
132
133
  );
133
134
  };
134
135
 
135
- InputText.Element = _styledComponents2.default.input(_templateObject5, function (props) {
136
+ InputText.Element = _styledComponents2.default.input(_templateObject6, function (props) {
136
137
  return _tokens.colors[props.theme].inputCommon.background;
137
138
  }, function (props) {
138
139
  if (props.error) {
@@ -144,6 +145,8 @@ InputText.Element = _styledComponents2.default.input(_templateObject5, function
144
145
  return _tokens.colors[props.theme].inputCommon.color;
145
146
  }, function (props) {
146
147
  return props.readOnly ? 'not-allowed' : 'text';
148
+ }, function (props) {
149
+ return props.showLengthCount && props.maxLength ? '7px 60px 2px 0px' : '7px 0px 2px 0px';
147
150
  }, function (props) {
148
151
  if (props.error) {
149
152
  return _tokens.colors[props.theme].inputError.borderHover;
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@desynova-digital/components",
3
- "version": "8.19.0",
3
+ "version": "8.19.2",
4
4
  "description": "Components for Desynova Digital",
5
5
  "main": "index.js",
6
6
  "author": "desynova-digital",
7
7
  "license": "MIT",
8
8
  "repository": "desynova-digital",
9
9
  "dependencies": {
10
- "@desynova-digital/tokens": "8.19.0",
10
+ "@desynova-digital/tokens": "8.19.2",
11
11
  "prop-types": "^15.7.2",
12
12
  "styled-components": "^4.3.2"
13
13
  },