@ntbjs/react-components 1.1.11 → 1.1.13

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 (22) hide show
  1. package/{AssetGallery-a948de8d.js → AssetGallery-f62e16b2.js} +8 -8
  2. package/{Badge-aec841c8.js → Badge-757b0a39.js} +1 -1
  3. package/{CompactAutocompleteSelect-b68618b3.js → CompactAutocompleteSelect-96137f48.js} +3 -3
  4. package/{CompactStarRating-405e4508.js → CompactStarRating-15c1b812.js} +5 -5
  5. package/{CompactTextInput-0d53acdf.js → CompactTextInput-a43aea28.js} +49 -37
  6. package/{Instructions-d7dcc0ce.js → Instructions-9a0fd247.js} +2 -2
  7. package/{MultiLevelCheckboxSelect-f3de8047.js → MultiLevelCheckboxSelect-e6e5cb90.js} +3 -3
  8. package/{Tabs-a8c77f71.js → Tabs-116aa951.js} +27 -19
  9. package/{TextArea-57c69d16.js → TextArea-a869b1a9.js} +50 -108
  10. package/{VerificationStatusIcon-6fe95a92.js → VerificationStatusIcon-d5bfb67a.js} +4 -1
  11. package/data/Badge/index.js +1 -1
  12. package/data/Tabs/index.js +1 -1
  13. package/data/index.js +3 -3
  14. package/inputs/CompactAutocompleteSelect/index.js +4 -4
  15. package/inputs/CompactStarRating/index.js +4 -4
  16. package/inputs/CompactTextInput/index.js +4 -4
  17. package/inputs/TextArea/index.js +5 -5
  18. package/inputs/index.js +8 -8
  19. package/package.json +1 -1
  20. package/widgets/AssetGallery/index.js +9 -9
  21. package/widgets/Instructions/index.js +6 -6
  22. package/widgets/index.js +10 -10
package/{AssetGallery-a948de8d.js → AssetGallery-f62e16b2.js} RENAMED
@@ -5,26 +5,26 @@ var lodash = require('lodash');
5
5
  var React = require('react');
6
6
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
7
7
  var ResizeObserver = require('resize-observer-polyfill');
8
- var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-f3de8047.js');
8
+ var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-e6e5cb90.js');
9
9
  var styled = require('styled-components');
10
10
  var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
11
11
  var warningCircle = require('./warning-circle-24522402.js');
12
12
  var Alert = require('./Alert-13b75102.js');
13
- var Badge = require('./Badge-aec841c8.js');
13
+ var Badge = require('./Badge-757b0a39.js');
14
14
  var Popover = require('./Popover-569cd272.js');
15
15
  require('./Tab-f499ecbc.js');
16
- require('./Tabs-a8c77f71.js');
16
+ require('./Tabs-116aa951.js');
17
17
  var Tooltip = require('./Tooltip-66daf6e3.js');
18
- require('./VerificationStatusIcon-6fe95a92.js');
18
+ require('./VerificationStatusIcon-d5bfb67a.js');
19
19
  var ActionButton = require('./ActionButton-46735b89.js');
20
20
  require('./Button-49f82b31.js');
21
21
  require('./Checkbox-68dc38a8.js');
22
- require('./CompactAutocompleteSelect-b68618b3.js');
23
- require('./CompactStarRating-405e4508.js');
24
- require('./CompactTextInput-0d53acdf.js');
22
+ require('./CompactAutocompleteSelect-96137f48.js');
23
+ require('./CompactStarRating-15c1b812.js');
24
+ require('./CompactTextInput-a43aea28.js');
25
25
  require('./MultiSelect-efd60232.js');
26
26
  require('./Radio-32d0513a.js');
27
- require('./TextArea-57c69d16.js');
27
+ require('./TextArea-a869b1a9.js');
28
28
  require('./TextInput-0d109708.js');
29
29
  require('./Switch-4a41585f.js');
30
30
  var ContextMenu = require('./ContextMenu-4ec3d9f3.js');
package/{Badge-aec841c8.js → Badge-757b0a39.js} RENAMED
@@ -190,7 +190,7 @@ var Badge = React__default['default'].forwardRef(function Badge(_ref, forwardedR
190
190
  });
191
191
  Badge.propTypes = process.env.NODE_ENV !== "production" ? {
192
192
  badgeIcon: defaultTheme.PropTypes.node,
193
- badgeContent: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number]),
193
+ badgeContent: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number, defaultTheme.PropTypes.func, defaultTheme.PropTypes.element]),
194
194
  children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.node, defaultTheme.PropTypes.string]),
195
195
  elevated: defaultTheme.PropTypes.bool,
196
196
  active: defaultTheme.PropTypes.bool,
package/{CompactAutocompleteSelect-b68618b3.js → CompactAutocompleteSelect-96137f48.js} RENAMED
@@ -5,12 +5,12 @@ var lodash = require('lodash');
5
5
  var nanoid = require('nanoid');
6
6
  var React = require('react');
7
7
  require('./Alert-13b75102.js');
8
- require('./Badge-aec841c8.js');
8
+ require('./Badge-757b0a39.js');
9
9
  require('./Popover-569cd272.js');
10
10
  require('./Tab-f499ecbc.js');
11
- require('./Tabs-a8c77f71.js');
11
+ require('./Tabs-116aa951.js');
12
12
  var Tooltip = require('./Tooltip-66daf6e3.js');
13
- require('./VerificationStatusIcon-6fe95a92.js');
13
+ require('./VerificationStatusIcon-d5bfb67a.js');
14
14
  var styled = require('styled-components');
15
15
  var Select = require('react-select');
16
16
  var reactSelectAsyncPaginate = require('react-select-async-paginate');
package/{CompactStarRating-405e4508.js → CompactStarRating-15c1b812.js} RENAMED
@@ -3,12 +3,12 @@
3
3
  var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
5
  require('./Alert-13b75102.js');
6
- require('./Badge-aec841c8.js');
6
+ require('./Badge-757b0a39.js');
7
7
  require('./Popover-569cd272.js');
8
8
  require('./Tab-f499ecbc.js');
9
- require('./Tabs-a8c77f71.js');
9
+ require('./Tabs-116aa951.js');
10
10
  var Tooltip = require('./Tooltip-66daf6e3.js');
11
- require('./VerificationStatusIcon-6fe95a92.js');
11
+ require('./VerificationStatusIcon-d5bfb67a.js');
12
12
  var styled = require('styled-components');
13
13
 
14
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -243,7 +243,7 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
243
243
  setHover(false);
244
244
  },
245
245
  hover: hover && key + 1 <= tempRating,
246
- type: type,
246
+ type: "button",
247
247
  key: key
248
248
  }, iconFill);
249
249
  } else if (viewEmpty) {
@@ -263,7 +263,7 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
263
263
  setHover(false);
264
264
  },
265
265
  hover: hover && key + 1 <= tempRating,
266
- type: type,
266
+ type: "button",
267
267
  key: key
268
268
  }, icon);
269
269
  }
package/{CompactTextInput-0d53acdf.js → CompactTextInput-a43aea28.js} RENAMED
@@ -6,12 +6,12 @@ var nanoid = require('nanoid');
6
6
  var React = require('react');
7
7
  var editNote = require('./edit-note-c47d292e.js');
8
8
  require('./Alert-13b75102.js');
9
- require('./Badge-aec841c8.js');
9
+ require('./Badge-757b0a39.js');
10
10
  require('./Popover-569cd272.js');
11
11
  require('./Tab-f499ecbc.js');
12
- require('./Tabs-a8c77f71.js');
12
+ require('./Tabs-116aa951.js');
13
13
  var Tooltip = require('./Tooltip-66daf6e3.js');
14
- require('./VerificationStatusIcon-6fe95a92.js');
14
+ require('./VerificationStatusIcon-d5bfb67a.js');
15
15
  var styled = require('styled-components');
16
16
 
17
17
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -54,7 +54,7 @@ function SvgLink(props) {
54
54
  }, props), _ref);
55
55
  }
56
56
 
57
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28;
57
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31;
58
58
  var fadeIn = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n background-color: ", ";\n }\n to {\n background-color: ", ";\n }\n"])), function (props) {
59
59
  return props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)');
60
60
  }, function (props) {
@@ -67,35 +67,39 @@ var fadeOut = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTh
67
67
  });
68
68
  var fadeInCheck = styled.keyframes(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
69
69
  var fadeOutCheck = styled.keyframes(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
70
- var CompactTextInput$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n"])), function (props) {
70
+ var linkColor = styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), function (props) {
71
+ return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('emerald-500'));
72
+ });
73
+ var commonAnchorTagStyle = styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n padding: 5px 8px;\n\n a,\n && {\n font-size: 0.875rem;\n }\n"])));
74
+ var CompactTextInput$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n"])), function (props) {
71
75
  return props.theme.primaryFontFamily;
72
76
  });
73
- var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n justify-content: space-between;\n height: 19px;\n display: flex;\n align-items: center;\n ", "\n"])), function (props) {
77
+ var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n justify-content: space-between;\n height: 19px;\n display: flex;\n align-items: center;\n ", "\n"])), function (props) {
74
78
  return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
75
79
  }, function (props) {
76
- return props.disabled && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
80
+ return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
77
81
  });
78
- var InputContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n height: 19px;\n flex-basis: ", ";\n"])), function (props) {
82
+ var InputContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n height: 19px;\n flex-basis: ", ";\n"])), function (props) {
79
83
  return props.$hasLabel ? '66.66%' : '100%';
80
84
  });
81
- var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n display: flex;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n ", "\n > svg {\n width: 13px;\n }\n"])), function (props) {
85
+ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n display: flex;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n ", "\n > svg {\n width: 13px;\n }\n"])), function (props) {
82
86
  return props.fadeIn ? 0 : 1;
83
87
  }, function (props) {
84
88
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
85
89
  }, function (props) {
86
90
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
87
91
  });
88
- var InputSuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n display: flex;\n justify-content: flex-end;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n position: relative;\n margin-top: -20px;\n margin-right: 8px;\n ", "\n > svg {\n width: 13px;\n }\n"])), function (props) {
92
+ var InputSuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n display: flex;\n justify-content: flex-end;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n position: relative;\n margin-top: -20px;\n margin-right: 8px;\n ", "\n > svg {\n width: 13px;\n }\n"])), function (props) {
89
93
  return props.fadeIn ? 0 : 1;
90
94
  }, function (props) {
91
95
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
92
96
  }, function (props) {
93
97
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
94
98
  });
95
- var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n padding: 5px 10px 0 0;\n ", ";\n\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n color: ", ";\n\n ", "\n\n ", "\n\n > svg {\n width: 12px;\n }\n"])), function (props) {
96
- return props.theme.themeProp('background', styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n linear-gradient(-90deg,\n ", " 55%,\n transparent)\n "])), function (props) {
99
+ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n padding: 5px 10px 0 0;\n ", ";\n\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n color: ", ";\n\n ", "\n\n ", "\n\n > svg {\n width: 12px;\n }\n"])), function (props) {
100
+ return props.theme.themeProp('background', styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n linear-gradient(-90deg,\n ", " 55%,\n transparent)\n "])), function (props) {
97
101
  return props.type === 'error' ? '#901d1d' : props.type === 'warning' ? '#816600' : props.theme.getColor('gray-700');
98
- }), styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n linear-gradient(-90deg,\n ", " 55%,\n transparent)\n "])), function (props) {
102
+ }), styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n linear-gradient(-90deg,\n ", " 55%,\n transparent)\n "])), function (props) {
99
103
  return props.type === 'error' ? '#f7d5d0' : props.type === 'warning' ? '#fffebf' : props.theme.getColor('gray-100');
100
104
  }));
101
105
  }, function (props) {
@@ -105,12 +109,12 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
105
109
  }, function (props) {
106
110
  return props.type === 'error' && props.theme.themeProp('color', '#CB968F', '#CB968F');
107
111
  });
108
- var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n box-sizing: border-box;\n height: 22px;\n width: 100%;\n display: block;\n font-size: 0.875rem;\n line-height: 1rem;\n font-family: inherit;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n padding: 1px 10px;\n ", ";\n border-radius: 3px;\n border: 1px solid transparent;\n text-overflow: ellipsis;\n\n ", ";\n\n &&:not(:hover):not(:focus) {\n ", "\n ", ";\n ", ";\n ", ";\n ", ";\n \n ", "\n }\n\n &&:hover:not(:focus) {\n\n ", "\n\n ", " \n\n ", ";\n\n ", ";\n\n ", ";\n\n\n ", "\n & + ", " {\n opacity: 1;\n \n }\n }\n\n ", "\n ", "\n\n }\n\n &&:focus {\n ", ";\n\n ", ";\n \n ", ";\n\n ", ";\n outline: none;\n\n ", ";\n\n ", ";\n }\n\n &&::placeholder {\n color: inherit;\n opacity: 0.6;\n }\n\n ", "\n"])), function (props) {
109
- return props.readOnly && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n "])));
112
+ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n box-sizing: border-box;\n height: 22px;\n width: 100%;\n display: block;\n font-size: 0.875rem;\n line-height: 1rem;\n font-family: inherit;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n padding: 1px 10px;\n ", ";\n border-radius: 3px;\n border: 1px solid transparent;\n\n ", ";\n\n &&:not(:hover):not(:focus) {\n ", "\n ", ";\n ", ";\n ", ";\n ", ";\n \n ", "\n }\n\n &&:hover:not(:focus) {\n\n ", "\n\n ", " \n\n ", ";\n\n ", ";\n\n ", ";\n\n\n ", "\n & + ", " {\n opacity: 1;\n \n }\n }\n\n ", "\n ", "\n\n }\n\n &&:focus {\n ", ";\n\n ", ";\n \n ", ";\n\n ", ";\n outline: none;\n\n ", ";\n\n ", ";\n }\n\n &&::placeholder {\n color: inherit;\n opacity: 0.6;\n }\n\n ", "\n"])), function (props) {
113
+ return props.readOnly && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n "])));
110
114
  }, function (props) {
111
- return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
115
+ return props.disabled && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
112
116
  }, function (props) {
113
- return props.type === 'success' && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
117
+ return props.type === 'success' && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
114
118
  return props.type === 'success' ? fadeIn : fadeOut;
115
119
  });
116
120
  }, function (props) {
@@ -118,11 +122,9 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
118
122
  }, function (props) {
119
123
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
120
124
  }, function (props) {
121
- return props.hasLink && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n ", "\n }\n &&:read-only {\n cursor: default;\n }\n "])), function (props) {
122
- return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('emerald-500'));
123
- });
125
+ return props.hasLink && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n ", "\n }\n &&:read-only {\n cursor: default;\n }\n "])), linkColor);
124
126
  }, function (props) {
125
- return !props.readOnly && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n background: none;\n "])));
127
+ return !props.readOnly && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n background: none;\n "])));
126
128
  }, function (props) {
127
129
  return props.type === 'warning' && props.theme.themeProp('background', '#634E01', '#FFFDE8');
128
130
  }, function (props) {
@@ -132,9 +134,7 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
132
134
  }, function (props) {
133
135
  return props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)');
134
136
  }, function (props) {
135
- return props.hasLink && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n cursor: default;\n ", "\n }\n "])), function (props) {
136
- return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('emerald-500'));
137
- });
137
+ return props.hasLink && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n cursor: default;\n ", "\n }\n "])), linkColor);
138
138
  }, function (props) {
139
139
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
140
140
  }, function (props) {
@@ -146,11 +146,11 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
146
146
  }, function (props) {
147
147
  return props.type === 'error' && props.theme.themeProp('background', '#901d1d', '#F7D5D0');
148
148
  }, function (props) {
149
- return props.hasLink && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n cursor: pointer;\n\n &&:read-only {\n background: none !important;\n cursor: default;\n }\n "])));
149
+ return props.hasLink && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n cursor: pointer;\n\n &&:read-only {\n background: none !important;\n cursor: default;\n }\n "])));
150
150
  }, InputIconContainer, function (props) {
151
- return props.disabled && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed;\n "])));
151
+ return props.disabled && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed;\n "])));
152
152
  }, function (props) {
153
- return props.disabled && props.hasLink && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed !important;\n "])));
153
+ return props.disabled && props.hasLink && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed !important;\n "])));
154
154
  }, function (props) {
155
155
  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
156
156
  }, function (props) {
@@ -158,23 +158,22 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
158
158
  }, function (props) {
159
159
  return props.type === 'error' && !props.readOnly && props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
160
160
  }, function (props) {
161
- return !props.readOnly && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
161
+ return !props.readOnly && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
162
162
  return props.theme.getColor('gray-600');
163
163
  });
164
164
  }, function (props) {
165
- return props.type === 'warning' && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
165
+ return props.type === 'warning' && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
166
166
  return props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
167
167
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
168
168
  }, function (props) {
169
- return props.type === 'error' && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
169
+ return props.type === 'error' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
170
170
  return props.theme.themeProp('border-color', '#D83018', '#D83018');
171
171
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
172
172
  }, function (props) {
173
- return props.bold && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n font-size: 1rem;\n font-weight: 500;\n line-height: 1.0625;\n padding-top: 3px;\n padding-bottom: 2px;\n "])));
174
- });
175
- var LinkPopoverContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n padding: 5px 8px;\n\n a {\n font-size: 0.875rem;\n ", ";\n }\n\n svg {\n width: 18px;\n margin-right: 8px;\n }\n"])), function (props) {
176
- return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('emerald-500'), 1);
173
+ return props.bold && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n font-size: 1rem;\n font-weight: 500;\n line-height: 1.0625;\n padding-top: 3px;\n padding-bottom: 2px;\n "])));
177
174
  });
175
+ var LinkPopoverContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n ", "\n\n svg {\n width: 18px;\n margin-right: 8px;\n }\n"])), commonAnchorTagStyle);
176
+ var StyledLink = styled__default['default'].a.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n"])), commonAnchorTagStyle, linkColor);
178
177
 
179
178
  var CompactTextInput = React__default['default'].forwardRef(function CompactTextInput(_ref, forwardedRef) {
180
179
  var label = _ref.label,
@@ -284,8 +283,8 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
284
283
  placement: "bottom-end",
285
284
  trigger: 'mouseenter',
286
285
  zIndex: 999999
287
- }, input())), link && activeLinkHandler && !readOnly && React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip.Tooltip, {
288
- content: React__default['default'].createElement(LinkPopoverContainer, null, React__default['default'].createElement("a", {
286
+ }, input())), link && !readOnly && React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip.Tooltip, {
287
+ content: React__default['default'].createElement(LinkPopoverContainer, null, activeLinkHandler ? React__default['default'].createElement(StyledLink, {
289
288
  href: link,
290
289
  target: linkTarget,
291
290
  onClick: function onClick(e) {
@@ -295,12 +294,25 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
295
294
  }
296
295
  },
297
296
  rel: "noreferrer"
297
+ }, React__default['default'].createElement(SvgLink, null), currentValue) : React__default['default'].createElement(StyledLink, {
298
+ href: link,
299
+ target: linkTarget,
300
+ rel: "noreferrer"
298
301
  }, React__default['default'].createElement(SvgLink, null), currentValue)),
299
302
  key: "tooltip2",
300
303
  placement: "bottom-start",
301
304
  zIndex: 999999,
302
305
  interactive: true
303
- }, input())), !memoizedDescriptionToolTip && link && readOnly && input(), !readOnly && !disabled && React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(InputIconContainer, {
306
+ }, input())), link && readOnly && React__default['default'].createElement(StyledLink, {
307
+ href: link,
308
+ rel: "noreferrer",
309
+ style: {
310
+ marginLeft: 3,
311
+ marginTop: -2,
312
+ display: 'inline-block'
313
+ },
314
+ target: linkTarget
315
+ }, currentValue), !readOnly && !disabled && React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(InputIconContainer, {
304
316
  type: type
305
317
  }, React__default['default'].createElement(editNote.SvgEditNote, null)), lodash.isEmpty(label) && React__default['default'].createElement(InputSuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon))));
306
318
  });
package/{Instructions-d7dcc0ce.js → Instructions-9a0fd247.js} RENAMED
@@ -4,8 +4,8 @@ var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var lodash = require('lodash');
5
5
  var React = require('react');
6
6
  var warningCircle = require('./warning-circle-24522402.js');
7
- var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-b68618b3.js');
8
- var TextArea = require('./TextArea-57c69d16.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-96137f48.js');
8
+ var TextArea = require('./TextArea-a869b1a9.js');
9
9
  var styled = require('styled-components');
10
10
 
11
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
package/{MultiLevelCheckboxSelect-f3de8047.js → MultiLevelCheckboxSelect-e6e5cb90.js} RENAMED
@@ -4,12 +4,12 @@ var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
  require('./Alert-13b75102.js');
7
- require('./Badge-aec841c8.js');
7
+ require('./Badge-757b0a39.js');
8
8
  var Popover = require('./Popover-569cd272.js');
9
9
  require('./Tab-f499ecbc.js');
10
- require('./Tabs-a8c77f71.js');
10
+ require('./Tabs-116aa951.js');
11
11
  require('./Tooltip-66daf6e3.js');
12
- require('./VerificationStatusIcon-6fe95a92.js');
12
+ require('./VerificationStatusIcon-d5bfb67a.js');
13
13
  var Checkbox = require('./Checkbox-68dc38a8.js');
14
14
  var lodash = require('lodash');
15
15
  var TextInput = require('./TextInput-0d109708.js');
package/{Tabs-a8c77f71.js → Tabs-116aa951.js} RENAMED
@@ -11,15 +11,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
 
14
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
14
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
15
15
  var Tabs$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n ", ";\n"])), function (props) {
16
16
  return props.backgroundColor && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n background-color: ", ";\n "])), props.backgroundColor);
17
17
  });
18
- var TabHeaders = styled__default['default'].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n margin: 0;\n padding: 0;\n"])));
19
- var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
18
+ var TabHeaders = styled__default['default'].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n\n margin: 0;\n ", ";\n ", ";\n"])), function (props) {
19
+ return !props.customPadding && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n padding: 0;\n "])));
20
+ }, function (props) {
21
+ return props.customPadding && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n padding: 0 ", ";\n "])), props.customPadding);
22
+ });
23
+ var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
20
24
  return props.theme.secondaryFontFamily;
21
25
  }, function (props) {
22
- return props.active && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
26
+ return props.active && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
23
27
  return props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-700'));
24
28
  });
25
29
  }, function (props) {
@@ -37,29 +41,27 @@ var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultThe
37
41
  }
38
42
  });
39
43
  });
40
- var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n margin-top: -2px;\n display: block;\n ", ";\n"])), function (props) {
44
+ var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n"])));
45
+ var TabHeaderBorder = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
41
46
  return props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5');
47
+ }, function (props) {
48
+ return !props.customPadding && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px 0;\n "])));
49
+ }, function (props) {
50
+ return props.customPadding && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px ", ";\n "])), props.customPadding);
42
51
  });
43
52
 
44
53
  var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef) {
45
54
  var children = _ref.children,
46
55
  defaultMinHeight = _ref.defaultMinHeight,
47
- props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight"]);
56
+ customPadding = _ref.customPadding,
57
+ props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight", "customPadding"]);
48
58
 
49
59
  var _useState = React.useState(0),
50
60
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
51
61
  activeTab = _useState2[0],
52
62
  setActiveTab = _useState2[1];
53
63
 
54
- var _useState3 = React.useState(),
55
- _useState4 = defaultTheme._slicedToArray(_useState3, 2),
56
- defaultHeight = _useState4[0],
57
- setDefaultHeight = _useState4[1];
58
-
59
64
  var contentRef = React.useRef(null);
60
- React.useEffect(function () {
61
- setDefaultHeight(defaultMinHeight);
62
- }, []);
63
65
  var tabs = React.useMemo(function () {
64
66
  var tabs = [];
65
67
 
@@ -109,7 +111,9 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
109
111
  ref: forwardedRef
110
112
  }, props, {
111
113
  role: "tablist"
112
- }), React__default['default'].createElement(TabHeaders, null, tabs.map(function (tab) {
114
+ }), React__default['default'].createElement(TabHeaders, {
115
+ customPadding: customPadding
116
+ }, tabs.map(function (tab) {
113
117
  return React__default['default'].createElement(TabHeader, {
114
118
  key: tab.key,
115
119
  hidden: tab.hidden,
@@ -119,25 +123,29 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
119
123
  },
120
124
  role: "tab"
121
125
  }, tab.trigger);
122
- })), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
126
+ })), React__default['default'].createElement(TabHeaderBorder, {
127
+ customPadding: customPadding
128
+ }), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
123
129
  return React__default['default'].createElement("div", {
124
130
  ref: tab.key === (activeTab === null || activeTab === void 0 ? void 0 : activeTab.key) ? contentRef : null,
125
131
  key: tab.key,
126
132
  role: "tabpanel",
127
133
  hidden: tab.key !== activeTab,
128
134
  style: {
129
- minHeight: !lodash.isEmpty(defaultHeight) ? defaultHeight : ''
135
+ minHeight: !lodash.isEmpty(defaultMinHeight) ? defaultMinHeight : ''
130
136
  }
131
137
  }, tab.content);
132
138
  })));
133
139
  });
134
140
  Tabs.defaultProps = {
135
- defaultMinHeight: ''
141
+ defaultMinHeight: '',
142
+ customPadding: 0
136
143
  };
137
144
  Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
138
145
  children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.array, defaultTheme.PropTypes.object]),
139
146
  backgroundColor: defaultTheme.PropTypes.string,
140
- defaultMinHeight: defaultTheme.PropTypes.string
147
+ defaultMinHeight: defaultTheme.PropTypes.string,
148
+ customPadding: defaultTheme.PropTypes.string
141
149
  } : {};
142
150
 
143
151
  exports.Tabs = Tabs;
package/{TextArea-57c69d16.js → TextArea-a869b1a9.js} RENAMED
@@ -2,15 +2,16 @@
2
2
 
3
3
  var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var React = require('react');
5
+ var lodash = require('lodash');
5
6
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
6
7
  var nanoid = require('nanoid');
7
8
  require('./Alert-13b75102.js');
8
- require('./Badge-aec841c8.js');
9
+ require('./Badge-757b0a39.js');
9
10
  require('./Popover-569cd272.js');
10
11
  require('./Tab-f499ecbc.js');
11
- require('./Tabs-a8c77f71.js');
12
+ require('./Tabs-116aa951.js');
12
13
  var Tooltip = require('./Tooltip-66daf6e3.js');
13
- require('./VerificationStatusIcon-6fe95a92.js');
14
+ require('./VerificationStatusIcon-d5bfb67a.js');
14
15
  var editNote = require('./edit-note-c47d292e.js');
15
16
  var styled = require('styled-components');
16
17
 
@@ -19,7 +20,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
19
20
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
20
21
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
21
22
 
22
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46;
23
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47;
23
24
  var fadeInCheck = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
24
25
  var fadeOutCheck = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
25
26
  var activeLabel = styled.css(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n font-size: 0.75rem;\n padding: 0 3px;\n top: -7px;\n letter-spacing: 0.03em;\n left: 8px !important;\n opacity: 1 !important;\n"])));
@@ -28,27 +29,27 @@ var placeholderBaseStyle = styled.css(_templateObject4 || (_templateObject4 = de
28
29
  }, function (props) {
29
30
  return props.theme.themeProp('opacity', 0.6, 0.5);
30
31
  });
31
- var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n display: flex;\n align-items: flex-start;\n position: absolute;\n right: 15px;\n top: 10px;\n bottom: 0;\n > .smallPadingIcon {\n padding: 4px;\n width: 15px;\n height: 15px;\n border-radius: 5px;\n opacity: 1;\n margin-top: -5px;\n ", "\n }\n svg {\n width: 15px;\n opacity: 0.7;\n transition: opacity 250ms;\n\n ", "\n }\n"])), function (props) {
32
- return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
32
+ var TextAreaContainter = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n"])));
33
+ var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n height: 19px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 13px;\n ", "\n"])), function (props) {
34
+ return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
33
35
  }, function (props) {
34
- return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
36
+ return props.disabled && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
35
37
  });
36
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n ", "\n\n\n\n ", "\n ", "\n\n transition: height 550ms ease-in-out; border-color 350ms;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n \n ", "\n \n ", "\n\n ", "\n \n ", "\n\n ", "\n\n ", " \n\n ", " \n \n\n ", " \n\n \n \n ", "\n\n ", " \n\n ", "\n \n \n ", "\n\n ", "\n\n\n ", ";\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\n\n &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n\n \n ", "; \n\n\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", "\n\n ", ";\n\n \n ", " \n \n ", "\n\n }\n\n &&:not(:hover):not(:focus) {\n ", ";\n ", ";\n\n ", "\n\n ", ";\n\n \n }\n"])), function (props) {
37
- return props.borderRadius && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n border-radius: ", "px;\n "])), props.borderRadius);
38
- }, function (props) {
39
- return props.showMore && !props.expanded && props.defaultHeight < props.maxHeight && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n -webkit-mask-image: linear-gradient(0deg, transparent 5px, white 45px);\n "])));
38
+ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n pointer-events: none;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px;\n display: flex;\n align-items: flex-start;\n\n position: absolute;\n right: 15px;\n top: 10px;\n bottom: 0;\n > .smallPadingIcon {\n padding: 4px;\n width: 15px;\n height: 15px;\n border-radius: 5px;\n opacity: 1;\n margin-top: -5px;\n ", "\n }\n svg {\n width: 15px;\n opacity: 0.7;\n transition: opacity 250ms;\n\n ", "\n }\n"])), function (props) {
39
+ return props.theme.themeProp('background-color', props.theme.getColor('gray-900'), props.theme.getColor('gray-300'), '!important');
40
40
  }, function (props) {
41
- return props.expanded && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n height: ", "px;\n "])), props.maxHeight);
41
+ return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
42
+ });
43
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 5px 10px;\n resize: vertical;\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n border: 1px solid;\n\n \n\n ", "\n\n \n \n\n transition: height 550ms ease-in-out; border-color 350ms;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n \n\n \n ", "\n\n ", "\n \n ", "\n\n ", "\n\n ", " \n\n ", " \n \n\n ", " \n\n \n \n ", "\n\n ", " \n\n ", "\n \n \n ", "\n\n ", "\n\n\n ", ";\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\n\n &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n\n \n ", "; \n\n\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", "\n\n ", ";\n\n \n ", " \n \n ", "\n\n }\n\n &&:not(:hover):not(:focus) {\n ", ";\n ", ";\n\n ", "\n\n ", ";\n\n \n }\n"])), function (props) {
44
+ return props.borderRadius && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n border-radius: ", "px;\n "])), props.borderRadius);
42
45
  }, function (props) {
43
46
  return props.theme.themeProp('color', 'white', 'black');
44
47
  }, function (props) {
45
- return props.readOnly && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n border-color: transparent !important;\n "])));
46
- }, function (props) {
47
- return props.disabled && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
48
+ return props.readOnly && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n border-color: transparent !important;\n "])));
48
49
  }, function (props) {
49
- return props.readOnly && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n padding: 12px 10px; ;\n "])));
50
+ return props.disabled && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
50
51
  }, function (props) {
51
- return props.showMore && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n overflow: hidden;\n "])));
52
+ return props.readOnly && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n padding: 12px 10px; ;\n "])));
52
53
  }, function (props) {
53
54
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
54
55
  }, function (props) {
@@ -110,7 +111,7 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
110
111
  }, function (props) {
111
112
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-600'));
112
113
  }, function (props) {
113
- return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
114
+ return props.theme.themeProp('background', 'transparent', props.theme.getColor('white'));
114
115
  }, function (props) {
115
116
  return props.type === 'warning' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n ", "\n "])), function (props) {
116
117
  return props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
@@ -142,11 +143,13 @@ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDe
142
143
  return props.hasIcon && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
143
144
  });
144
145
  var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n height: 2.625rem;\n display: flex;\n padding: 0 10px;\n\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n }\n"])));
145
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n display: flex;\n padding: 0 10px 0 30px;\n opacity: 0.6;\n transition: opacity 250ms;\n ", "\n svg {\n margin-top: 11px;\n width: 15px;\n }\n"])), function (props) {
146
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n display: flex;\n padding: 0 10px 0 30px;\n opacity: 0.6;\n transition: opacity 250ms;\n ", "\n svg {\n margin-top: 12px;\n width: 15px;\n }\n"])), function (props) {
146
147
  return props.type === 'warning' && props.theme.themeProp('color', '#EAB308', '#2F2402');
147
148
  });
148
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n\n ", "\n\n ", "\n\n &:focus-within {\n ", " {\n ", ";\n }\n\n ", " {\n svg {\n opacity: 1;\n }\n }\n }\n\n ", ":not(:placeholder-shown) + ", " {\n ", ";\n ", "\n }\n }\n"])), function (props) {
149
- return props.readOnly && styled.css(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n pointer-events: none;\n "])));
149
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n flex-basis: ", ";\n\n ", "\n\n ", "\n\n \n\n &:focus-within {\n ", " {\n ", ";\n }\n\n ", " {\n svg {\n opacity: 1;\n }\n }\n }\n\n ", ":not(:placeholder-shown) + ", " {\n ", ";\n ", "\n }\n }\n"])), function (props) {
150
+ return props.$fieldLabel ? '66.66%' : '100%';
151
+ }, function (props) {
152
+ return props.readOnly && styled.css(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n overflow: auto;\n "])));
150
153
  }, function (props) {
151
154
  return props.disabled && styled.css(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
152
155
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
@@ -166,14 +169,21 @@ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDe
166
169
  }, function (props) {
167
170
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
168
171
  });
169
- var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n margin-top: -18px;\n margin-bottom: 0;\n display: block;\n position: absolute;\n font-size: 0.875rem;\n cursor: pointer;\n padding: 2px 10px;\n margin-right: 10px;\n margin-top: -26px;\n ", "\n transition: margin-top 550ms ease-in-out;\n -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 7px);\n ", "\n\n ", ";\n\n ", "\n"])), function (props) {
170
- return props.expanded && styled.css(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
172
+ var SuccessContainerLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject44 || (_templateObject44 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n margin-top: -7px;\n width: 15px;\n height: 15px;\n padding: 5px;\n ", "\n\n > svg {\n width: 13px;\n }\n"])), function (props) {
173
+ return props.fadeIn ? 0 : 1;
174
+ }, function (props) {
175
+ return props.fadeIn ? fadeOutCheck : fadeInCheck;
176
+ }, function (props) {
177
+ return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
178
+ });
179
+ styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject45 || (_templateObject45 = defaultTheme._taggedTemplateLiteral(["\n margin-top: -18px;\n margin-bottom: 0;\n display: block;\n position: absolute;\n font-size: 0.875rem;\n cursor: pointer;\n padding: 2px 10px;\n margin-right: 10px;\n margin-top: -26px;\n ", "\n transition: margin-top 550ms ease-in-out;\n -webkit-mask-image: linear-gradient(180deg, transparent 1px, white 7px);\n ", "\n\n ", ";\n\n ", "\n"])), function (props) {
180
+ return props.expanded && styled.css(_templateObject46 || (_templateObject46 = defaultTheme._taggedTemplateLiteral(["\n margin-top: 0px;\n "])));
171
181
  }, function (props) {
172
182
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
173
183
  }, function (props) {
174
184
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('emerald-500'));
175
185
  }, function (props) {
176
- return props.type === 'error' && styled.css(_templateObject46 || (_templateObject46 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
186
+ return props.type === 'error' && styled.css(_templateObject47 || (_templateObject47 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
177
187
  });
178
188
 
179
189
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
@@ -187,9 +197,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
187
197
  hidden = _ref.hidden,
188
198
  readOnly = _ref.readOnly,
189
199
  edit = _ref.edit,
190
- showMore = _ref.showMore,
191
- showMoreText = _ref.showMoreText,
192
- showLessText = _ref.showLessText,
193
200
  autoComplete = _ref.autoComplete,
194
201
  description = _ref.description,
195
202
  type = _ref.type,
@@ -202,13 +209,13 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
202
209
  lightBackground = _ref.lightBackground,
203
210
  noBorder = _ref.noBorder,
204
211
  instructionsTextArea = _ref.instructionsTextArea,
205
- isExpanded = _ref.isExpanded,
206
212
  loadingIcon = _ref.loadingIcon,
207
213
  successIcon = _ref.successIcon,
208
214
  padding = _ref.padding,
209
215
  descriptionToolTip = _ref.descriptionToolTip,
210
216
  borderRadius = _ref.borderRadius,
211
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "showMore", "showMoreText", "showLessText", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea", "isExpanded", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius"]);
217
+ fieldLabel = _ref.fieldLabel,
218
+ rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius", "fieldLabel"]);
212
219
 
213
220
  var textInputDomNode = React.useRef(null);
214
221
  var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
@@ -218,76 +225,21 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
218
225
  inputIsEmpty = _useState2[0],
219
226
  setInputIsEmpty = _useState2[1];
220
227
 
221
- var _useState3 = React.useState(''),
228
+ var _useState3 = React.useState(false),
222
229
  _useState4 = defaultTheme._slicedToArray(_useState3, 2),
223
- maxContentRows = _useState4[0],
224
- setMaxContentRows = _useState4[1];
225
-
226
- var _useState5 = React.useState(false),
227
- _useState6 = defaultTheme._slicedToArray(_useState5, 2),
228
- expanded = _useState6[0],
229
- setExpanded = _useState6[1];
230
-
231
- var _useState7 = React.useState(''),
232
- _useState8 = defaultTheme._slicedToArray(_useState7, 2),
233
- maxHeight = _useState8[0],
234
- setMaxHeight = _useState8[1];
230
+ autoFocus = _useState4[0],
231
+ setAutoFocus = _useState4[1];
235
232
 
236
- var _useState9 = React.useState(''),
237
- _useState10 = defaultTheme._slicedToArray(_useState9, 2),
238
- defaultHeight = _useState10[0],
239
- setDefaultHeight = _useState10[1];
240
-
241
- var _useState11 = React.useState(false),
242
- _useState12 = defaultTheme._slicedToArray(_useState11, 2),
243
- autoFocus = _useState12[0],
244
- setAutoFocus = _useState12[1];
245
-
246
- var _useState13 = React.useState(nanoid.nanoid()),
247
- _useState14 = defaultTheme._slicedToArray(_useState13, 1),
248
- uniqueId = _useState14[0];
233
+ var _useState5 = React.useState(nanoid.nanoid()),
234
+ _useState6 = defaultTheme._slicedToArray(_useState5, 1),
235
+ uniqueId = _useState6[0];
249
236
 
250
237
  var memoizedDescriptionToolTip = React.useMemo(function () {
251
238
  return descriptionToolTip;
252
239
  }, [descriptionToolTip]);
253
240
  React.useEffect(function () {
254
- setExpanded(false);
255
- isExpanded(false);
256
241
  setAutoFocus(false);
257
242
  }, [value, defaultValue]);
258
-
259
- var handleTextAreaChange = function handleTextAreaChange() {
260
- setExpanded(true);
261
- isExpanded(true);
262
- };
263
-
264
- var handleTextAreaShowLess = function handleTextAreaShowLess() {
265
- setExpanded(!expanded);
266
- isExpanded(!expanded);
267
- };
268
-
269
- var calculateRows = function calculateRows() {
270
- var textareaRefCurrent = textInputDomNode === null || textInputDomNode === void 0 ? void 0 : textInputDomNode.current;
271
-
272
- if (textareaRefCurrent !== null) {
273
- var textAreaHeight = textareaRefCurrent === null || textareaRefCurrent === void 0 ? void 0 : textareaRefCurrent.scrollHeight;
274
- var lineHeight = 16;
275
- var calculatedRows = Math.floor(textAreaHeight / lineHeight);
276
- var defaultRowsHeight = rows * lineHeight;
277
- setMaxContentRows(calculatedRows);
278
-
279
- if (calculatedRows > rows) {
280
- setDefaultHeight(defaultRowsHeight);
281
- setMaxHeight(textAreaHeight);
282
- } else {
283
- setMaxHeight();
284
- }
285
- }
286
- };
287
-
288
- React.useEffect(function () {
289
- calculateRows();
290
- }, [value, defaultValue]);
291
243
  var onKeyDown = React.useCallback(function (event) {
292
244
  if (event.key === 'Enter') {
293
245
  event.stopPropagation();
@@ -295,7 +247,11 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
295
247
  }, []);
296
248
 
297
249
  var input = function input() {
298
- return React__default['default'].createElement(TextInput, {
250
+ return React__default['default'].createElement(TextAreaContainter, null, fieldLabel && React__default['default'].createElement(Label, {
251
+ htmlFor: uniqueId,
252
+ disabled: disabled
253
+ }, fieldLabel, React__default['default'].createElement(SuccessContainerLabel, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React__default['default'].createElement(TextInput, {
254
+ $fieldLabel: !lodash.isEmpty(fieldLabel),
299
255
  disabled: disabled,
300
256
  readOnly: readOnly,
301
257
  type: type,
@@ -308,9 +264,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
308
264
  borderRadius: borderRadius,
309
265
  ref: textInputRef,
310
266
  rows: rows,
311
- expanded: expanded,
312
- defaultHeight: defaultHeight,
313
- maxHeight: maxHeight,
314
267
  value: value,
315
268
  defaultValue: defaultValue,
316
269
  name: name,
@@ -320,7 +273,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
320
273
  disabled: disabled,
321
274
  edit: edit,
322
275
  instructionsTextArea: instructionsTextArea,
323
- showMore: showMore,
324
276
  type: type,
325
277
  autoComplete: autoComplete,
326
278
  hasIcon: Boolean(icon),
@@ -349,9 +301,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
349
301
  onKeyDown: onKeyDown,
350
302
  onBlur: onBlur,
351
303
  noBorder: noBorder
352
- }, rest, {
353
- onClick: showMore ? handleTextAreaChange : undefined
354
- })), (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
304
+ }, rest)), !fieldLabel && (type === 'loading' || type === 'success') && React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
355
305
  disabled: disabled
356
306
  }, React__default['default'].createElement(editNote.SvgEditNote, {
357
307
  className: padding === 'small' ? 'smallPadingIcon' : undefined
@@ -362,10 +312,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
362
312
  inputIsEmpty: inputIsEmpty
363
313
  }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
364
314
  type: type
365
- }, description), maxContentRows > rows && showMore && React__default['default'].createElement(ShowMoreText, {
366
- onClick: showMore ? handleTextAreaShowLess : undefined,
367
- expanded: expanded
368
- }, !expanded ? showMoreText : showLessText));
315
+ }, description)));
369
316
  };
370
317
 
371
318
  if (hidden) return null;
@@ -383,9 +330,6 @@ TextArea.defaultProps = {
383
330
  readOnly: false,
384
331
  edit: false,
385
332
  hidden: false,
386
- showMore: false,
387
- showMoreText: '',
388
- showLessText: '',
389
333
  type: '',
390
334
  padding: 'medium',
391
335
  instructionsTextArea: false,
@@ -399,14 +343,12 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
399
343
  defaultValue: defaultTheme.PropTypes.string,
400
344
  name: defaultTheme.PropTypes.string,
401
345
  label: defaultTheme.PropTypes.string,
346
+ fieldLabel: defaultTheme.PropTypes.string,
402
347
  placeholder: defaultTheme.PropTypes.string,
403
348
  required: defaultTheme.PropTypes.bool,
404
349
  disabled: defaultTheme.PropTypes.bool,
405
350
  hidden: defaultTheme.PropTypes.bool,
406
351
  readOnly: defaultTheme.PropTypes.bool,
407
- showMore: defaultTheme.PropTypes.bool,
408
- showMoreText: defaultTheme.PropTypes.string,
409
- showLessText: defaultTheme.PropTypes.string,
410
352
  edit: defaultTheme.PropTypes.bool,
411
353
  autoComplete: defaultTheme.PropTypes.string,
412
354
  description: defaultTheme.PropTypes.string,
package/{VerificationStatusIcon-6fe95a92.js → VerificationStatusIcon-d5bfb67a.js} RENAMED
@@ -68,6 +68,9 @@ var VerificationStatusColor = styled__default['default'].div.attrs(defaultTheme.
68
68
  } else if (props.status === 'rejected') {
69
69
  darkThemeColor = props.theme.getColor('red-600');
70
70
  lightThemeColor = props.theme.getColor('red-600');
71
+ } else if (props.status === 'mixed') {
72
+ darkThemeColor = '#008CDB';
73
+ lightThemeColor = '#008CDB';
71
74
  }
72
75
 
73
76
  return props.theme.themeProp('background-color', darkThemeColor, lightThemeColor);
@@ -106,7 +109,7 @@ var VerificationStatusIcon = React__default['default'].forwardRef(function Verif
106
109
  })));
107
110
  });
108
111
  VerificationStatusIcon.propTypes = process.env.NODE_ENV !== "production" ? {
109
- status: defaultTheme.PropTypes.oneOf(['verified', 'pending', 'rejected']).isRequired,
112
+ status: defaultTheme.PropTypes.oneOf(['verified', 'pending', 'rejected', 'mixed']).isRequired,
110
113
  iconHeight: defaultTheme.PropTypes.number,
111
114
  background: defaultTheme.PropTypes.bool
112
115
  } : {};
package/data/Badge/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Badge = require('../../Badge-aec841c8.js');
3
+ var Badge = require('../../Badge-757b0a39.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
package/data/Tabs/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Tabs = require('../../Tabs-a8c77f71.js');
3
+ var Tabs = require('../../Tabs-116aa951.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
package/data/index.js CHANGED
@@ -3,12 +3,12 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Alert = require('../Alert-13b75102.js');
6
- var Badge = require('../Badge-aec841c8.js');
6
+ var Badge = require('../Badge-757b0a39.js');
7
7
  var Popover = require('../Popover-569cd272.js');
8
8
  var Tab = require('../Tab-f499ecbc.js');
9
- var Tabs = require('../Tabs-a8c77f71.js');
9
+ var Tabs = require('../Tabs-116aa951.js');
10
10
  var Tooltip = require('../Tooltip-66daf6e3.js');
11
- var VerificationStatusIcon = require('../VerificationStatusIcon-6fe95a92.js');
11
+ var VerificationStatusIcon = require('../VerificationStatusIcon-d5bfb67a.js');
12
12
  require('../defaultTheme-ea44e34a.js');
13
13
  require('styled-components');
14
14
  require('react');
package/inputs/CompactAutocompleteSelect/index.js CHANGED
@@ -1,22 +1,22 @@
1
1
  'use strict';
2
2
 
3
- var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-b68618b3.js');
3
+ var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-96137f48.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('nanoid');
8
8
  require('react');
9
9
  require('../../Alert-13b75102.js');
10
- require('../../Badge-aec841c8.js');
10
+ require('../../Badge-757b0a39.js');
11
11
  require('../../Popover-569cd272.js');
12
12
  require('polished');
13
13
  require('@tippyjs/react');
14
14
  require('../../shift-away-subtle-0bed9a3c.js');
15
15
  require('popper-max-size-modifier');
16
16
  require('../../Tab-f499ecbc.js');
17
- require('../../Tabs-a8c77f71.js');
17
+ require('../../Tabs-116aa951.js');
18
18
  require('../../Tooltip-66daf6e3.js');
19
- require('../../VerificationStatusIcon-6fe95a92.js');
19
+ require('../../VerificationStatusIcon-d5bfb67a.js');
20
20
  require('react-select');
21
21
  require('react-select-async-paginate');
22
22
  require('../../react-select-creatable.esm-2f23d6c6.js');
package/inputs/CompactStarRating/index.js CHANGED
@@ -1,21 +1,21 @@
1
1
  'use strict';
2
2
 
3
- var CompactStarRating = require('../../CompactStarRating-405e4508.js');
3
+ var CompactStarRating = require('../../CompactStarRating-15c1b812.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('../../Alert-13b75102.js');
8
8
  require('lodash');
9
- require('../../Badge-aec841c8.js');
9
+ require('../../Badge-757b0a39.js');
10
10
  require('../../Popover-569cd272.js');
11
11
  require('polished');
12
12
  require('@tippyjs/react');
13
13
  require('../../shift-away-subtle-0bed9a3c.js');
14
14
  require('popper-max-size-modifier');
15
15
  require('../../Tab-f499ecbc.js');
16
- require('../../Tabs-a8c77f71.js');
16
+ require('../../Tabs-116aa951.js');
17
17
  require('../../Tooltip-66daf6e3.js');
18
- require('../../VerificationStatusIcon-6fe95a92.js');
18
+ require('../../VerificationStatusIcon-d5bfb67a.js');
19
19
 
20
20
 
21
21
 
package/inputs/CompactTextInput/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactTextInput = require('../../CompactTextInput-0d53acdf.js');
3
+ var CompactTextInput = require('../../CompactTextInput-a43aea28.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -8,16 +8,16 @@ require('nanoid');
8
8
  require('react');
9
9
  require('../../edit-note-c47d292e.js');
10
10
  require('../../Alert-13b75102.js');
11
- require('../../Badge-aec841c8.js');
11
+ require('../../Badge-757b0a39.js');
12
12
  require('../../Popover-569cd272.js');
13
13
  require('polished');
14
14
  require('@tippyjs/react');
15
15
  require('../../shift-away-subtle-0bed9a3c.js');
16
16
  require('popper-max-size-modifier');
17
17
  require('../../Tab-f499ecbc.js');
18
- require('../../Tabs-a8c77f71.js');
18
+ require('../../Tabs-116aa951.js');
19
19
  require('../../Tooltip-66daf6e3.js');
20
- require('../../VerificationStatusIcon-6fe95a92.js');
20
+ require('../../VerificationStatusIcon-d5bfb67a.js');
21
21
 
22
22
 
23
23
 
package/inputs/TextArea/index.js CHANGED
@@ -1,23 +1,23 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-57c69d16.js');
3
+ var TextArea = require('../../TextArea-a869b1a9.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('react');
7
+ require('lodash');
7
8
  require('../../useMergedRefs-b6d2f8fc.js');
8
9
  require('nanoid');
9
10
  require('../../Alert-13b75102.js');
10
- require('lodash');
11
- require('../../Badge-aec841c8.js');
11
+ require('../../Badge-757b0a39.js');
12
12
  require('../../Popover-569cd272.js');
13
13
  require('polished');
14
14
  require('@tippyjs/react');
15
15
  require('../../shift-away-subtle-0bed9a3c.js');
16
16
  require('popper-max-size-modifier');
17
17
  require('../../Tab-f499ecbc.js');
18
- require('../../Tabs-a8c77f71.js');
18
+ require('../../Tabs-116aa951.js');
19
19
  require('../../Tooltip-66daf6e3.js');
20
- require('../../VerificationStatusIcon-6fe95a92.js');
20
+ require('../../VerificationStatusIcon-d5bfb67a.js');
21
21
  require('../../edit-note-c47d292e.js');
22
22
 
23
23
 
package/inputs/index.js CHANGED
@@ -5,15 +5,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var ActionButton = require('../ActionButton-46735b89.js');
6
6
  var Button = require('../Button-49f82b31.js');
7
7
  var Checkbox = require('../Checkbox-68dc38a8.js');
8
- var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-b68618b3.js');
9
- var CompactStarRating = require('../CompactStarRating-405e4508.js');
10
- var CompactTextInput = require('../CompactTextInput-0d53acdf.js');
8
+ var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-96137f48.js');
9
+ var CompactStarRating = require('../CompactStarRating-15c1b812.js');
10
+ var CompactTextInput = require('../CompactTextInput-a43aea28.js');
11
11
  var MultiSelect = require('../MultiSelect-efd60232.js');
12
12
  var Radio = require('../Radio-32d0513a.js');
13
- var TextArea = require('../TextArea-57c69d16.js');
13
+ var TextArea = require('../TextArea-a869b1a9.js');
14
14
  var TextInput = require('../TextInput-0d109708.js');
15
15
  var Switch = require('../Switch-4a41585f.js');
16
- var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-f3de8047.js');
16
+ var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-e6e5cb90.js');
17
17
  require('../defaultTheme-ea44e34a.js');
18
18
  require('styled-components');
19
19
  require('react');
@@ -27,11 +27,11 @@ require('../ContextMenu-4ec3d9f3.js');
27
27
  require('../expand-more-94585605.js');
28
28
  require('nanoid');
29
29
  require('../Alert-13b75102.js');
30
- require('../Badge-aec841c8.js');
30
+ require('../Badge-757b0a39.js');
31
31
  require('../Tab-f499ecbc.js');
32
- require('../Tabs-a8c77f71.js');
32
+ require('../Tabs-116aa951.js');
33
33
  require('../Tooltip-66daf6e3.js');
34
- require('../VerificationStatusIcon-6fe95a92.js');
34
+ require('../VerificationStatusIcon-d5bfb67a.js');
35
35
  require('react-select');
36
36
  require('react-select-async-paginate');
37
37
  require('../react-select-creatable.esm-2f23d6c6.js');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.1.11",
3
+ "version": "1.1.13",
4
4
  "description": "NTBs common front-end design utilities and React components.",
5
5
  "scripts": {
6
6
  "build": "cross-env NODE_ENV=production rollup -c",
package/widgets/AssetGallery/index.js CHANGED
@@ -1,24 +1,24 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-a948de8d.js');
3
+ var AssetGallery = require('../../AssetGallery-f62e16b2.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../useMergedRefs-b6d2f8fc.js');
9
9
  require('resize-observer-polyfill');
10
- require('../../MultiLevelCheckboxSelect-f3de8047.js');
10
+ require('../../MultiLevelCheckboxSelect-e6e5cb90.js');
11
11
  require('../../Alert-13b75102.js');
12
- require('../../Badge-aec841c8.js');
12
+ require('../../Badge-757b0a39.js');
13
13
  require('../../Popover-569cd272.js');
14
14
  require('polished');
15
15
  require('@tippyjs/react');
16
16
  require('../../shift-away-subtle-0bed9a3c.js');
17
17
  require('popper-max-size-modifier');
18
18
  require('../../Tab-f499ecbc.js');
19
- require('../../Tabs-a8c77f71.js');
19
+ require('../../Tabs-116aa951.js');
20
20
  require('../../Tooltip-66daf6e3.js');
21
- require('../../VerificationStatusIcon-6fe95a92.js');
21
+ require('../../VerificationStatusIcon-d5bfb67a.js');
22
22
  require('../../Checkbox-68dc38a8.js');
23
23
  require('nanoid');
24
24
  require('../../TextInput-0d109708.js');
@@ -32,16 +32,16 @@ require('../../ActionButton-46735b89.js');
32
32
  require('../../Button-49f82b31.js');
33
33
  require('../../ContextMenu-4ec3d9f3.js');
34
34
  require('../../expand-more-94585605.js');
35
- require('../../CompactAutocompleteSelect-b68618b3.js');
35
+ require('../../CompactAutocompleteSelect-96137f48.js');
36
36
  require('react-select');
37
37
  require('react-select-async-paginate');
38
38
  require('../../react-select-creatable.esm-2f23d6c6.js');
39
39
  require('react-dom');
40
- require('../../CompactStarRating-405e4508.js');
41
- require('../../CompactTextInput-0d53acdf.js');
40
+ require('../../CompactStarRating-15c1b812.js');
41
+ require('../../CompactTextInput-a43aea28.js');
42
42
  require('../../MultiSelect-efd60232.js');
43
43
  require('../../Radio-32d0513a.js');
44
- require('../../TextArea-57c69d16.js');
44
+ require('../../TextArea-a869b1a9.js');
45
45
  require('../../Switch-4a41585f.js');
46
46
  require('../../ContextMenuItem-ba2b697e.js');
47
47
 
package/widgets/Instructions/index.js CHANGED
@@ -1,31 +1,31 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-d7dcc0ce.js');
3
+ var Instructions = require('../../Instructions-9a0fd247.js');
4
4
  require('../../defaultTheme-ea44e34a.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../warning-circle-24522402.js');
9
- require('../../CompactAutocompleteSelect-b68618b3.js');
9
+ require('../../CompactAutocompleteSelect-96137f48.js');
10
10
  require('nanoid');
11
11
  require('../../Alert-13b75102.js');
12
- require('../../Badge-aec841c8.js');
12
+ require('../../Badge-757b0a39.js');
13
13
  require('../../Popover-569cd272.js');
14
14
  require('polished');
15
15
  require('@tippyjs/react');
16
16
  require('../../shift-away-subtle-0bed9a3c.js');
17
17
  require('popper-max-size-modifier');
18
18
  require('../../Tab-f499ecbc.js');
19
- require('../../Tabs-a8c77f71.js');
19
+ require('../../Tabs-116aa951.js');
20
20
  require('../../Tooltip-66daf6e3.js');
21
- require('../../VerificationStatusIcon-6fe95a92.js');
21
+ require('../../VerificationStatusIcon-d5bfb67a.js');
22
22
  require('react-select');
23
23
  require('react-select-async-paginate');
24
24
  require('../../react-select-creatable.esm-2f23d6c6.js');
25
25
  require('react-dom');
26
26
  require('../../close-ebf2f3cf.js');
27
27
  require('../../expand-more-94585605.js');
28
- require('../../TextArea-57c69d16.js');
28
+ require('../../TextArea-a869b1a9.js');
29
29
  require('../../useMergedRefs-b6d2f8fc.js');
30
30
  require('../../edit-note-c47d292e.js');
31
31
 
package/widgets/index.js CHANGED
@@ -2,28 +2,28 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-a948de8d.js');
5
+ var AssetGallery = require('../AssetGallery-f62e16b2.js');
6
6
  var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-912c3469.js');
8
- var Instructions = require('../Instructions-d7dcc0ce.js');
8
+ var Instructions = require('../Instructions-9a0fd247.js');
9
9
  require('../defaultTheme-ea44e34a.js');
10
10
  require('styled-components');
11
11
  require('lodash');
12
12
  require('react');
13
13
  require('../useMergedRefs-b6d2f8fc.js');
14
14
  require('resize-observer-polyfill');
15
- require('../MultiLevelCheckboxSelect-f3de8047.js');
15
+ require('../MultiLevelCheckboxSelect-e6e5cb90.js');
16
16
  require('../Alert-13b75102.js');
17
- require('../Badge-aec841c8.js');
17
+ require('../Badge-757b0a39.js');
18
18
  require('../Popover-569cd272.js');
19
19
  require('polished');
20
20
  require('@tippyjs/react');
21
21
  require('../shift-away-subtle-0bed9a3c.js');
22
22
  require('popper-max-size-modifier');
23
23
  require('../Tab-f499ecbc.js');
24
- require('../Tabs-a8c77f71.js');
24
+ require('../Tabs-116aa951.js');
25
25
  require('../Tooltip-66daf6e3.js');
26
- require('../VerificationStatusIcon-6fe95a92.js');
26
+ require('../VerificationStatusIcon-d5bfb67a.js');
27
27
  require('../Checkbox-68dc38a8.js');
28
28
  require('nanoid');
29
29
  require('../TextInput-0d109708.js');
@@ -36,16 +36,16 @@ require('../warning-circle-24522402.js');
36
36
  require('../ActionButton-46735b89.js');
37
37
  require('../Button-49f82b31.js');
38
38
  require('../expand-more-94585605.js');
39
- require('../CompactAutocompleteSelect-b68618b3.js');
39
+ require('../CompactAutocompleteSelect-96137f48.js');
40
40
  require('react-select');
41
41
  require('react-select-async-paginate');
42
42
  require('../react-select-creatable.esm-2f23d6c6.js');
43
43
  require('react-dom');
44
- require('../CompactStarRating-405e4508.js');
45
- require('../CompactTextInput-0d53acdf.js');
44
+ require('../CompactStarRating-15c1b812.js');
45
+ require('../CompactTextInput-a43aea28.js');
46
46
  require('../MultiSelect-efd60232.js');
47
47
  require('../Radio-32d0513a.js');
48
- require('../TextArea-57c69d16.js');
48
+ require('../TextArea-a869b1a9.js');
49
49
  require('../Switch-4a41585f.js');
50
50
  require('../ContextMenuItem-ba2b697e.js');
51
51