@ntbjs/react-components 1.1.10 → 1.1.12

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 (28) hide show
  1. package/{ActionButton-06df3d6c.js → ActionButton-46735b89.js} +13 -5
  2. package/{AssetGallery-3e57dc2c.js → AssetGallery-6f665c7a.js} +54 -27
  3. package/{AssetPreviewTopBar-c28715f7.js → AssetPreviewTopBar-912c3469.js} +8 -3
  4. package/{Badge-aec841c8.js → Badge-757b0a39.js} +1 -1
  5. package/{CompactAutocompleteSelect-86e10ff4.js → CompactAutocompleteSelect-96137f48.js} +8 -6
  6. package/{CompactStarRating-f1e62f3e.js → CompactStarRating-15c1b812.js} +17 -11
  7. package/{CompactTextInput-c27d33c1.js → CompactTextInput-c0d45782.js} +55 -39
  8. package/{Instructions-fed010b2.js → Instructions-2babb8a3.js} +2 -2
  9. package/{MultiLevelCheckboxSelect-040d2f28.js → MultiLevelCheckboxSelect-e6e5cb90.js} +3 -3
  10. package/{MultiSelect-4b8d3d0d.js → MultiSelect-efd60232.js} +1 -1
  11. package/{Tabs-a8c77f71.js → Tabs-116aa951.js} +27 -19
  12. package/{TextArea-d8ec6308.js → TextArea-18fbcc9f.js} +99 -159
  13. package/{VerificationStatusIcon-b574fd21.js → VerificationStatusIcon-d5bfb67a.js} +28 -13
  14. package/data/Badge/index.js +1 -1
  15. package/data/Tabs/index.js +1 -1
  16. package/data/index.js +3 -3
  17. package/inputs/ActionButton/index.js +1 -1
  18. package/inputs/CompactAutocompleteSelect/index.js +4 -4
  19. package/inputs/CompactStarRating/index.js +4 -4
  20. package/inputs/CompactTextInput/index.js +4 -4
  21. package/inputs/MultiSelect/index.js +1 -1
  22. package/inputs/TextArea/index.js +5 -5
  23. package/inputs/index.js +10 -10
  24. package/package.json +1 -1
  25. package/widgets/AssetGallery/index.js +11 -11
  26. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +1 -1
  27. package/widgets/Instructions/index.js +6 -6
  28. package/widgets/index.js +13 -13
package/{CompactTextInput-c27d33c1.js → CompactTextInput-c0d45782.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-b574fd21.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) {
74
- return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
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) {
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 &&:hover:not(:focus) {\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 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) {
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,35 +122,35 @@ 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) {
129
131
  return props.type === 'error' && props.theme.themeProp('background', '#7f1b1b', '#FBEAE6');
130
132
  }, function (props) {
131
- return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
133
+ return props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)');
132
134
  }, function (props) {
133
- 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) {
134
- return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('emerald-500'));
135
- });
135
+ return props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)');
136
+ }, function (props) {
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);
136
138
  }, function (props) {
137
139
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
138
140
  }, function (props) {
139
141
  return props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
142
+ }, function (props) {
143
+ return props.edit && props.theme.themeProp('border-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
140
144
  }, function (props) {
141
145
  return props.type === 'warning' && props.theme.themeProp('background', '#806403', '#FFFEBF');
142
146
  }, function (props) {
143
147
  return props.type === 'error' && props.theme.themeProp('background', '#901d1d', '#F7D5D0');
144
148
  }, function (props) {
145
- 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 "])));
146
150
  }, InputIconContainer, function (props) {
147
- 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 "])));
148
152
  }, function (props) {
149
- 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 "])));
150
154
  }, function (props) {
151
155
  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
152
156
  }, function (props) {
@@ -154,23 +158,22 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
154
158
  }, function (props) {
155
159
  return props.type === 'error' && !props.readOnly && props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
156
160
  }, function (props) {
157
- 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) {
158
162
  return props.theme.getColor('gray-600');
159
163
  });
160
164
  }, function (props) {
161
- 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) {
162
166
  return props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
163
167
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
164
168
  }, function (props) {
165
- 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) {
166
170
  return props.theme.themeProp('border-color', '#D83018', '#D83018');
167
171
  }, props.theme.themeProp('background', 'white', 'white'), props.theme.themeProp('color', 'black', 'black'));
168
172
  }, function (props) {
169
- 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 "])));
170
- });
171
- 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) {
172
- 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 "])));
173
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);
174
177
 
175
178
  var CompactTextInput = React__default['default'].forwardRef(function CompactTextInput(_ref, forwardedRef) {
176
179
  var label = _ref.label,
@@ -280,8 +283,8 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
280
283
  placement: "bottom-end",
281
284
  trigger: 'mouseenter',
282
285
  zIndex: 999999
283
- }, input())), link && activeLinkHandler && !readOnly && React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip.Tooltip, {
284
- 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, {
285
288
  href: link,
286
289
  target: linkTarget,
287
290
  onClick: function onClick(e) {
@@ -291,12 +294,25 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
291
294
  }
292
295
  },
293
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"
294
301
  }, React__default['default'].createElement(SvgLink, null), currentValue)),
295
302
  key: "tooltip2",
296
303
  placement: "bottom-start",
297
304
  zIndex: 999999,
298
305
  interactive: true
299
- }, 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, {
300
316
  type: type
301
317
  }, React__default['default'].createElement(editNote.SvgEditNote, null)), lodash.isEmpty(label) && React__default['default'].createElement(InputSuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon))));
302
318
  });
package/{Instructions-fed010b2.js → Instructions-2babb8a3.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-86e10ff4.js');
8
- var TextArea = require('./TextArea-d8ec6308.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-96137f48.js');
8
+ var TextArea = require('./TextArea-18fbcc9f.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-040d2f28.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-b574fd21.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/{MultiSelect-4b8d3d0d.js → MultiSelect-efd60232.js} RENAMED
@@ -22,7 +22,7 @@ var sharedStyle = styled.css(_templateObject || (_templateObject = defaultTheme.
22
22
  return props.theme.primaryFontFamily;
23
23
  });
24
24
  var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n cursor: pointer;\n height: 19px;\n display: flex;\n align-items: center;\n"])), function (props) {
25
- return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
25
+ return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
26
26
  });
27
27
  var MultiSelect$1 = styled__default['default'](Select__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
28
28
  var CreatableMultiSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
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;