@ntbjs/react-components 1.1.0-beta.85 → 1.1.0-beta.87

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.
@@ -9,12 +9,12 @@ var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
9
9
  var ActionButton = require('./ActionButton-c3f5ed94.js');
10
10
  require('./Button-432f87c6.js');
11
11
  require('./Checkbox-85394137.js');
12
- require('./CompactAutocompleteSelect-d1a7836f.js');
12
+ require('./CompactAutocompleteSelect-5ee8443f.js');
13
13
  require('./CompactStarRating-de1bcfe9.js');
14
- require('./CompactTextInput-cae26b42.js');
14
+ require('./CompactTextInput-480f59cc.js');
15
15
  require('./MultiSelect-01a257b8.js');
16
16
  require('./Radio-c811ce4a.js');
17
- require('./TextArea-e237b6e8.js');
17
+ require('./TextArea-a4a70687.js');
18
18
  require('./Switch-3ac11c97.js');
19
19
  require('./Alert-3e4f8be1.js');
20
20
  require('./Badge-9bcebe96.js');
@@ -73,7 +73,7 @@ var AutocompletSelect = styled__default['default'](Select__default['default']).a
73
73
  var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n"])), sharedStyle, function (props) {
74
74
  return props.disabled && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
75
75
  });
76
- var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 2px 0 10px;\n cursor: pointer;\n border: 1px solid transparent;\n ", "\n\n ", ";\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
76
+ var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 2px 0 10px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n ", "\n\n ", ";\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
77
77
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
78
78
  }, function (props) {
79
79
  return props.state && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
@@ -105,7 +105,7 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
105
105
  }, function (props) {
106
106
  return props.state === 'error' && props.theme.themeProp('color', '#CB968F', '#CB968F');
107
107
  });
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 opacity: 1;\n \n }\n }\n ", ";\n\n ", "\n\n ", ";\n\n ", ";\n }\n\n &&:focus {\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) {
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 opacity: 1;\n \n }\n }\n ", ";\n\n ", "\n\n ", ";\n\n ", ";\n }\n\n &&:focus {\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
109
  return props.readOnly && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n cursor: default;\n "])));
110
110
  }, function (props) {
111
111
  return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
@@ -143,6 +143,8 @@ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultThem
143
143
  return props.state === 'warning' && !props.readOnly && props.theme.themeProp('background', '#816600', '#fffebf');
144
144
  }, function (props) {
145
145
  return props.state === 'error' && !props.readOnly && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
146
+ }, function (props) {
147
+ return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
146
148
  }, function (props) {
147
149
  return props.state === 'error' && !props.readOnly && props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
148
150
  }, function (props) {
@@ -4,8 +4,8 @@ var defaultTheme = require('./defaultTheme-50f2b88f.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-d1a7836f.js');
8
- var TextArea = require('./TextArea-e237b6e8.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-5ee8443f.js');
8
+ var TextArea = require('./TextArea-a4a70687.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 }; }
@@ -49,7 +49,9 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
49
49
  rows = _ref.rows,
50
50
  showMore = _ref.showMore,
51
51
  showMoreText = _ref.showMoreText,
52
- props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "loadOptions", "readOnly", "disabled", "hidden", "name", "lightBackground", "autoSelect", "subscribeCurrentValue", "onChange", "onFocus", "onBlur", "onUpdateCallback", "availableOptions", "loadingMessageFunc", "placeholder", "state", "editWarning", "rows", "showMore", "showMoreText"]);
52
+ isExpanded = _ref.isExpanded,
53
+ maxRows = _ref.maxRows,
54
+ props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "loadOptions", "readOnly", "disabled", "hidden", "name", "lightBackground", "autoSelect", "subscribeCurrentValue", "onChange", "onFocus", "onBlur", "onUpdateCallback", "availableOptions", "loadingMessageFunc", "placeholder", "state", "editWarning", "rows", "showMore", "showMoreText", "isExpanded", "maxRows"]);
53
55
 
54
56
  var _useState = React.useState(false),
55
57
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
@@ -192,6 +194,8 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
192
194
  readOnly: readOnly,
193
195
  disabled: disabled,
194
196
  name: name,
197
+ isExpanded: isExpanded,
198
+ maxRows: maxRows,
195
199
  editWarning: editWarning,
196
200
  value: currentValue === null ? '' : currentValue,
197
201
  onFocus: onFocus,
@@ -237,7 +241,9 @@ Instructions.propTypes = process.env.NODE_ENV !== "production" ? {
237
241
  onFocus: defaultTheme.PropTypes.func,
238
242
  onBlur: defaultTheme.PropTypes.func,
239
243
  onUpdateCallback: defaultTheme.PropTypes.func,
240
- state: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'loading', 'success'])
244
+ state: defaultTheme.PropTypes.oneOf(['', 'error', 'error-border', 'warning', 'loading', 'success']),
245
+ maxRows: defaultTheme.PropTypes.func,
246
+ isExpanded: defaultTheme.PropTypes.func
241
247
  } : {};
242
248
 
243
249
  exports.Instructions = Instructions;
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
12
12
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
13
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
14
14
 
15
- 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;
15
+ 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;
16
16
  var fadeInCheck = styled.keyframes(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n"])));
17
17
  var fadeOutCheck = styled.keyframes(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n"])));
18
18
  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"])));
@@ -27,7 +27,7 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
27
27
  return props.disabled && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: none;\n "])));
28
28
  });
29
29
  var Container = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral([""])));
30
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 13px 10px;\n resize: vertical;\n transition: height 0.3s ease;\n z-index: 0; \n ", "\n ", "\n\n ", "\n\n\n ", "\n\n ", "\n \n ", "\n ", "\n ", "\n border: 1px solid;\n ", "\n ", " \n ", "\n \n ", " \n\n ", " \n\n ", " \n ", "\n ", ";\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n \n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n ", "\n ", "\n ", "\n\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n :focus {\n outline: none;\n ", "\n }\n\n :focus {\n outline: none;\n border-color: ", " !important\n \n"])), function (props) {
30
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 13px 10px;\n resize: vertical;\n transition: height 0.3s ease;\n z-index: 0;\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n \n ", "\n ", "\n ", "\n border: 1px solid;\n ", "\n ", " \n ", "\n\n &&:hover:not(:focus) {\n ", ";\n }\n\n ", "\n\n ", " \n\n ", " \n ", "\n ", ";\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\n ", ";\n transition: opacity 350ms;\n }\n }\n\n border-radius: 3px;\n box-sizing: border-box;\n appearance: none;\n transition: border-color 350ms;\n ", "\n ", "\n ", "\n\n ", "\n\n &::placeholder {\n ", "\n\n ", "\n }\n\n &&:focus {\n outline: none;\n ", " ", ";\n }\n"])), function (props) {
31
31
  return props.theme.themeProp('color', 'white', 'black');
32
32
  }, function (props) {
33
33
  return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
@@ -36,7 +36,7 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
36
36
  }, function (props) {
37
37
  return props.expanded && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n height: ", "em;\n "])), props.maxHeight);
38
38
  }, function (props) {
39
- return props.showMore && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n overflow: hidden;\n "])));
39
+ return props.showMore && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n overflow: hidden;\n "])));
40
40
  }, function (props) {
41
41
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
42
42
  }, function (props) {
@@ -48,31 +48,33 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
48
48
  }, function (props) {
49
49
  return props.noBorder && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px 13px 10px;\n border-color: transparent !important;\n "])));
50
50
  }, function (props) {
51
- return props.state === 'error-border' && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
51
+ return props.state === 'error-border' && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('border-color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
52
52
  }, function (props) {
53
- return props.state === 'warning' && !props.editWarning && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n :focus {\n background: white !important;\n color: black !important;\n }\n &&:hover:not(:focus) {\n ", "\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400')), function (props) {
54
- return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n "])));
53
+ return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
54
+ }, function (props) {
55
+ return props.state === 'warning' && !props.editWarning && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n :focus {\n background: white !important;\n color: black !important;\n }\n &&:hover:not(:focus) {\n ", "\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('color', 'white', 'black'), props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400')), function (props) {
56
+ return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n "])));
55
57
  }, props.theme.themeProp('background', '#816600', '#F4E21E'), props.theme.themeProp('background', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400')));
56
58
  }, function (props) {
57
- return props.state === 'warning' && props.editWarning && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n ", "\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#fffde8', '#fffde8'), props.theme.themeProp('background', '#fffebf', '#fffebf'), props.theme.themeProp('background', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400')));
59
+ return props.state === 'warning' && props.editWarning && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n ", "\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n ", "\n }\n &&:read-only:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#fffde8', '#fffde8'), props.theme.themeProp('background', '#fffebf', '#fffebf'), props.theme.themeProp('background', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400')));
58
60
  }, function (props) {
59
61
  return props.state === 'error' && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n background: ", " !important;\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n background: #f7d5d0 !important;\n }\n &&:read-only:hover {\n background: ", " !important;\n }\n "])), props.theme.getColor('red-200'), props.theme.getColor('red-200'));
60
62
  }, function (props) {
61
- return props.lightBackground && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#FFFDDE', '#fffde8'), props.theme.themeProp('color', props.theme.getColor('gray-900'), props.theme.getColor('gray-900')), props.theme.themeProp('background', 'white', 'white'));
63
+ return props.lightBackground && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover {\n ", "\n }\n "])), props.theme.themeProp('background', '#FFFDDE', '#fffde8'), props.theme.themeProp('color', props.theme.getColor('gray-900'), props.theme.getColor('gray-900')), props.theme.themeProp('background', 'white', 'white'));
62
64
  }, function (props) {
63
65
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
64
66
  }, function (props) {
65
67
  return props.noBorder && !props.readOnly && props.state != 'warning' ? props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')) : 'background: transparent';
66
68
  }, InputIconContainer, function (props) {
67
- return props.state === 'success' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
69
+ return props.state === 'success' && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
68
70
  }, function (props) {
69
71
  return props.state === 'warning' && styled.css(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('orange-500'));
70
72
  }, function (props) {
71
73
  return props.state === 'error' && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), props.theme.getColor('red-500'));
72
74
  }, function (props) {
73
- return props.hasIcon && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 35px;\n "])));
75
+ return props.hasIcon && styled.css(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-right: 25px;\n "])));
74
76
  }, function (props) {
75
- return props.instructionsTextArea && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 15px;\n padding-right: 50px;\n "])));
77
+ return props.instructionsTextArea && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 15px;\n padding-right: 50px;\n "])));
76
78
  }, function (props) {
77
79
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'), 1);
78
80
  }, function (props) {
@@ -80,42 +82,44 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
80
82
  }, function (props) {
81
83
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-600'));
82
84
  }, function (props) {
83
- return props.theme.getColor('gray-600');
85
+ return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
84
86
  });
85
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\n left: 11px;\n line-height: 1.2;\n font-size: 0.875rem;\n transition: all 150ms;\n\n ", ";\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
87
+ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\n left: 11px;\n line-height: 1.2;\n font-size: 0.875rem;\n transition: all 150ms;\n\n ", ";\n\n ", "\n\n ", "\n\n ", "\n content: \"\";\n\n ", "\n"])), placeholderBaseStyle, function (props) {
86
88
  return props.theme.themeProp('background', "linear-gradient(0deg, ".concat(props.theme.getColor('gray-900'), " calc(50% + 1px), transparent 50%)"), "linear-gradient(0deg, ".concat(props.theme.getColor('white'), " calc(50% + 1px), transparent 50%)"));
87
89
  }, function (props) {
88
- return props.hasPlaceholder && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.state === 'error' && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
90
+ return !props.inputIsEmpty && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), activeLabel);
91
+ }, function (props) {
92
+ return props.hasPlaceholder && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.state === 'error' && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
89
93
  }, function (props) {
90
- return props.hasIcon && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n left: 35px;\n "])));
94
+ return props.hasIcon && styled.css(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n left: 55px;\n "])));
91
95
  });
92
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject29 || (_templateObject29 = 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"])));
93
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n height: 2.625rem;\n display: flex;\n padding: 0 10px 0 30px;\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n ", "\n }\n"])), function (props) {
96
+ var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject30 || (_templateObject30 = 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"])));
97
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 2.8px;\n height: 2.625rem;\n display: flex;\n padding: 0 10px 0 30px;\n svg {\n width: 15px;\n opacity: 0.6;\n transition: opacity 250ms;\n margin-top: -3px;\n ", "\n }\n"])), function (props) {
94
98
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-600'));
95
99
  });
96
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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) {
97
- return props.disabled && styled.css(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
100
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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\n ", "\n"])), function (props) {
101
+ return props.disabled && styled.css(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
98
102
  }, TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
99
103
  return props.state === 'error' && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
104
+ }, function (props) {
105
+ return props.disabled && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
100
106
  });
101
- var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n margin: 8px 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n\n ", "\n"])), function (props) {
107
+ var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n margin: 8px 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n\n ", "\n"])), function (props) {
102
108
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
103
109
  }, function (props) {
104
- return (props.state === 'error-border' || props.state === 'error') && styled.css(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
110
+ return (props.state === 'error-border' || props.state === 'error') && styled.css(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
105
111
  });
106
- var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = 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 position: absolute;\n margin-top: -35px;\n margin-left: 5px;\n width: 15px;\n height: 15px;\n padding: 5px;\n border-radius: 30px;\n ", "\n ", "\n > svg {\n width: 15px;\n }\n"])), function (props) {
112
+ var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = 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 position: absolute;\n margin-top: -35px;\n margin-left: 5px;\n width: 15px;\n height: 15px;\n padding: 5px;\n ", "\n\n > svg {\n width: 15px;\n }\n"])), function (props) {
107
113
  return props.fadeIn ? 0 : 1;
108
114
  }, function (props) {
109
115
  return props.fadeIn ? fadeOutCheck : fadeInCheck;
110
116
  }, function (props) {
111
117
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
112
- }, function (props) {
113
- return props.theme.themeProp('background-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-100'));
114
118
  });
115
- var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = defaultTheme._taggedTemplateLiteral(["\n margin: 0 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n cursor: pointer;\n ", ";\n\n ", "\n"])), function (props) {
119
+ var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n margin: 0 0 0 0;\n padding: 0 0.6875rem;\n font-size: 0.75rem;\n line-height: 1.333;\n cursor: pointer;\n ", ";\n\n ", "\n"])), function (props) {
116
120
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('emerald-500'));
117
121
  }, function (props) {
118
- return props.state === 'error' && styled.css(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
122
+ return props.state === 'error' && styled.css(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
119
123
  });
120
124
 
121
125
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
@@ -129,6 +133,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
129
133
  hidden = _ref.hidden,
130
134
  readOnly = _ref.readOnly,
131
135
  edit = _ref.edit,
136
+ isExpanded = _ref.isExpanded,
132
137
  editWarning = _ref.editWarning,
133
138
  maxRows = _ref.maxRows,
134
139
  showMore = _ref.showMore,
@@ -140,55 +145,61 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
140
145
  rows = _ref.rows,
141
146
  className = _ref.className,
142
147
  style = _ref.style,
143
- onChange = _ref.onChange,
148
+ _onChange = _ref.onChange,
144
149
  onBlur = _ref.onBlur,
145
150
  lightBackground = _ref.lightBackground,
146
151
  noBorder = _ref.noBorder,
147
152
  instructionsTextArea = _ref.instructionsTextArea,
148
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "editWarning", "maxRows", "showMore", "showMoreText", "autoComplete", "description", "state", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea"]);
153
+ rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "isExpanded", "editWarning", "maxRows", "showMore", "showMoreText", "autoComplete", "description", "state", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "instructionsTextArea"]);
149
154
 
150
155
  var textInputRef = React.useRef(null);
151
156
 
152
- var _useState = React.useState(''),
157
+ var _useState = React.useState(!(value || defaultValue)),
153
158
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
154
- contentRows = _useState2[0],
155
- setContentRows = _useState2[1];
159
+ inputIsEmpty = _useState2[0],
160
+ setInputIsEmpty = _useState2[1];
156
161
 
157
162
  var _useState3 = React.useState(''),
158
163
  _useState4 = defaultTheme._slicedToArray(_useState3, 2),
159
- maxContentRows = _useState4[0],
160
- setMaxContentRows = _useState4[1];
164
+ contentRows = _useState4[0],
165
+ setContentRows = _useState4[1];
161
166
 
162
- var _useState5 = React.useState(rows),
167
+ var _useState5 = React.useState(''),
163
168
  _useState6 = defaultTheme._slicedToArray(_useState5, 2),
164
- defaultRows = _useState6[0],
165
- setDefaultRows = _useState6[1];
169
+ maxContentRows = _useState6[0],
170
+ setMaxContentRows = _useState6[1];
166
171
 
167
- var _useState7 = React.useState(false),
172
+ var _useState7 = React.useState(rows),
168
173
  _useState8 = defaultTheme._slicedToArray(_useState7, 2),
169
- expanded = _useState8[0],
170
- setExpanded = _useState8[1];
174
+ defaultRows = _useState8[0],
175
+ setDefaultRows = _useState8[1];
171
176
 
172
- var _useState9 = React.useState(''),
177
+ var _useState9 = React.useState(false),
173
178
  _useState10 = defaultTheme._slicedToArray(_useState9, 2),
174
- maxHeight = _useState10[0],
175
- setMaxHeight = _useState10[1];
179
+ expanded = _useState10[0],
180
+ setExpanded = _useState10[1];
176
181
 
177
- var _useState11 = React.useState(false),
182
+ var _useState11 = React.useState(''),
178
183
  _useState12 = defaultTheme._slicedToArray(_useState11, 2),
179
- showReadMore = _useState12[0],
180
- setShowReadMore = _useState12[1];
184
+ maxHeight = _useState12[0],
185
+ setMaxHeight = _useState12[1];
186
+
187
+ var _useState13 = React.useState(false),
188
+ _useState14 = defaultTheme._slicedToArray(_useState13, 2),
189
+ showReadMore = _useState14[0],
190
+ setShowReadMore = _useState14[1];
181
191
 
182
192
  React.useEffect(function () {
183
193
  setDefaultRows(rows);
184
194
  }, [rows]);
185
195
 
186
- var _useState13 = React.useState(nanoid.nanoid()),
187
- _useState14 = defaultTheme._slicedToArray(_useState13, 1),
188
- uniqueId = _useState14[0];
196
+ var _useState15 = React.useState(nanoid.nanoid()),
197
+ _useState16 = defaultTheme._slicedToArray(_useState15, 1),
198
+ uniqueId = _useState16[0];
189
199
 
190
200
  var handleTextAreaChange = function handleTextAreaChange() {
191
201
  setExpanded(!expanded);
202
+ isExpanded(expanded);
192
203
 
193
204
  if (expanded === true) {
194
205
  setContentRows(maxContentRows);
@@ -254,7 +265,15 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
254
265
  icon: icon,
255
266
  id: "text-input-".concat(uniqueId),
256
267
  lightBackground: lightBackground,
257
- onChange: onChange,
268
+ onChange: function onChange(e) {
269
+ if (e.target.value) {
270
+ setInputIsEmpty(false);
271
+ } else {
272
+ setInputIsEmpty(true);
273
+ }
274
+
275
+ _onChange();
276
+ },
258
277
  onBlur: onBlur,
259
278
  noBorder: noBorder
260
279
  }, rest)), (state === 'loading' || state === 'success') && React__default['default'].createElement(SuccessContainer, null, state === 'loading' && React__default['default'].createElement(check._default, {
@@ -266,7 +285,8 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
266
285
  htmlFor: "text-input-".concat(uniqueId),
267
286
  hasPlaceholder: Boolean(placeholder),
268
287
  hasIcon: Boolean(icon),
269
- state: state
288
+ state: state,
289
+ inputIsEmpty: inputIsEmpty
270
290
  }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
271
291
  state: state
272
292
  }, description), maxContentRows > defaultRows && showMore && showReadMore && React__default['default'].createElement(ShowMoreText, {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-d1a7836f.js');
3
+ var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-5ee8443f.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactTextInput = require('../../CompactTextInput-cae26b42.js');
3
+ var CompactTextInput = require('../../CompactTextInput-480f59cc.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-e237b6e8.js');
3
+ var TextArea = require('../../TextArea-a4a70687.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
package/inputs/index.js CHANGED
@@ -5,12 +5,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var ActionButton = require('../ActionButton-c3f5ed94.js');
6
6
  var Button = require('../Button-432f87c6.js');
7
7
  var Checkbox = require('../Checkbox-85394137.js');
8
- var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-d1a7836f.js');
8
+ var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-5ee8443f.js');
9
9
  var CompactStarRating = require('../CompactStarRating-de1bcfe9.js');
10
- var CompactTextInput = require('../CompactTextInput-cae26b42.js');
10
+ var CompactTextInput = require('../CompactTextInput-480f59cc.js');
11
11
  var MultiSelect = require('../MultiSelect-01a257b8.js');
12
12
  var Radio = require('../Radio-c811ce4a.js');
13
- var TextArea = require('../TextArea-e237b6e8.js');
13
+ var TextArea = require('../TextArea-a4a70687.js');
14
14
  var TextInput = require('../TextInput-8ea31a7b.js');
15
15
  var Switch = require('../Switch-3ac11c97.js');
16
16
  require('../defaultTheme-50f2b88f.js');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.1.0-beta.85",
3
+ "version": "1.1.0-beta.87",
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",
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-4d3e41a9.js');
3
+ var AssetGallery = require('../../AssetGallery-7767299e.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -19,7 +19,7 @@ require('../../shift-away-subtle-cfdf1dbe.js');
19
19
  require('../../ContextMenu-d088833b.js');
20
20
  require('../../expand-more-94585605.js');
21
21
  require('../../Checkbox-85394137.js');
22
- require('../../CompactAutocompleteSelect-d1a7836f.js');
22
+ require('../../CompactAutocompleteSelect-5ee8443f.js');
23
23
  require('../../check-555d831b.js');
24
24
  require('react-select');
25
25
  require('react-select-async-paginate');
@@ -27,7 +27,7 @@ require('../../react-select-creatable.esm-7231b55e.js');
27
27
  require('react-dom');
28
28
  require('../../close-ebf2f3cf.js');
29
29
  require('../../CompactStarRating-de1bcfe9.js');
30
- require('../../CompactTextInput-cae26b42.js');
30
+ require('../../CompactTextInput-480f59cc.js');
31
31
  require('../../Alert-3e4f8be1.js');
32
32
  require('../../Badge-9bcebe96.js');
33
33
  require('../../Tab-bd0f3345.js');
@@ -35,7 +35,7 @@ require('../../Tabs-bf42275e.js');
35
35
  require('../../Tooltip-1b7b0052.js');
36
36
  require('../../MultiSelect-01a257b8.js');
37
37
  require('../../Radio-c811ce4a.js');
38
- require('../../TextArea-e237b6e8.js');
38
+ require('../../TextArea-a4a70687.js');
39
39
  require('../../Switch-3ac11c97.js');
40
40
  require('../../warning-circle-24522402.js');
41
41
 
@@ -1,12 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-4358acd3.js');
3
+ var Instructions = require('../../Instructions-f56e7b8c.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
7
7
  require('react');
8
8
  require('../../warning-circle-24522402.js');
9
- require('../../CompactAutocompleteSelect-d1a7836f.js');
9
+ require('../../CompactAutocompleteSelect-5ee8443f.js');
10
10
  require('nanoid');
11
11
  require('../../check-555d831b.js');
12
12
  require('react-select');
@@ -15,7 +15,7 @@ require('../../react-select-creatable.esm-7231b55e.js');
15
15
  require('react-dom');
16
16
  require('../../close-ebf2f3cf.js');
17
17
  require('../../expand-more-94585605.js');
18
- require('../../TextArea-e237b6e8.js');
18
+ require('../../TextArea-a4a70687.js');
19
19
  require('../../edit-note-c47d292e.js');
20
20
 
21
21
 
package/widgets/index.js CHANGED
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-4d3e41a9.js');
5
+ var AssetGallery = require('../AssetGallery-7767299e.js');
6
6
  var ContextMenu = require('../ContextMenu-d088833b.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-449e6019.js');
8
- var Instructions = require('../Instructions-4358acd3.js');
8
+ var Instructions = require('../Instructions-f56e7b8c.js');
9
9
  require('../defaultTheme-50f2b88f.js');
10
10
  require('styled-components');
11
11
  require('react');
@@ -23,7 +23,7 @@ require('@tippyjs/react');
23
23
  require('../shift-away-subtle-cfdf1dbe.js');
24
24
  require('../expand-more-94585605.js');
25
25
  require('../Checkbox-85394137.js');
26
- require('../CompactAutocompleteSelect-d1a7836f.js');
26
+ require('../CompactAutocompleteSelect-5ee8443f.js');
27
27
  require('../check-555d831b.js');
28
28
  require('react-select');
29
29
  require('react-select-async-paginate');
@@ -31,7 +31,7 @@ require('../react-select-creatable.esm-7231b55e.js');
31
31
  require('react-dom');
32
32
  require('../close-ebf2f3cf.js');
33
33
  require('../CompactStarRating-de1bcfe9.js');
34
- require('../CompactTextInput-cae26b42.js');
34
+ require('../CompactTextInput-480f59cc.js');
35
35
  require('../Alert-3e4f8be1.js');
36
36
  require('../Badge-9bcebe96.js');
37
37
  require('../Tab-bd0f3345.js');
@@ -39,7 +39,7 @@ require('../Tabs-bf42275e.js');
39
39
  require('../Tooltip-1b7b0052.js');
40
40
  require('../MultiSelect-01a257b8.js');
41
41
  require('../Radio-c811ce4a.js');
42
- require('../TextArea-e237b6e8.js');
42
+ require('../TextArea-a4a70687.js');
43
43
  require('../Switch-3ac11c97.js');
44
44
  require('../warning-circle-24522402.js');
45
45