@ntbjs/react-components 1.1.0-beta.61 → 1.1.0-beta.63

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.
@@ -7,23 +7,24 @@ var TextInput = require('./TextInput-a1083be3.js');
7
7
  var ResizeObserver = require('resize-observer-polyfill');
8
8
  var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
9
9
  var ActionButton = require('./ActionButton-c3f5ed94.js');
10
- require('./AutocompleteSelect-57a324e3.js');
11
- require('./Button-dd271c4b.js');
10
+ require('./Button-f893df21.js');
12
11
  require('./Checkbox-012bbd3f.js');
13
- require('./CompactStarRating-942afff1.js');
14
- require('./CompactTextInput-e9c99aa3.js');
12
+ require('./CompactAutocompleteSelect-0160cb3e.js');
13
+ require('./CompactStarRating-9c4c4f2c.js');
14
+ require('./CompactTextInput-d2fabaf5.js');
15
15
  require('./MultiSelect-5b008b32.js');
16
16
  require('./Radio-0594409d.js');
17
- require('./TextArea-6dad1bbe.js');
17
+ require('./TextArea-76e2ff1e.js');
18
18
  require('./Switch-cd165c8c.js');
19
19
  require('./Alert-3e4f8be1.js');
20
20
  require('./Badge-9bcebe96.js');
21
- require('./Popover-11df9750.js');
21
+ require('./Popover-cf1e9677.js');
22
22
  require('./Tab-bd0f3345.js');
23
23
  require('./Tabs-cfc35dc0.js');
24
24
  var Tooltip = require('./Tooltip-f4f9ab8f.js');
25
25
  var styled = require('styled-components');
26
26
  var polished = require('polished');
27
+ var checkCircleFilled = require('./check-circle-filled-1640873e.js');
27
28
  var warningCircle = require('./warning-circle-24522402.js');
28
29
 
29
30
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -155,21 +156,6 @@ var OverlayInfoBottomActions = styled__default['default'].div.attrs(defaultTheme
155
156
  var ConsumerDefinedOverlay$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
156
157
  var Fragment$1 = styled__default['default'].div(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral([""])));
157
158
 
158
- function _extends$5() { _extends$5 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
159
-
160
- var _ref$5 = /*#__PURE__*/React__namespace.createElement("path", {
161
- fill: "currentColor",
162
- d: "M12 0a12 12 0 1012 12A12 12 0 0012 0zM9.6 18l-6-6 1.69-1.69L9.6 14.6l9.11-9.1 1.69 1.7z",
163
- fillOpacity: 0.9
164
- });
165
-
166
- function SvgCheckCircleFilled(props) {
167
- return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
168
- xmlns: "http://www.w3.org/2000/svg",
169
- viewBox: "0 0 24 24"
170
- }, props), _ref$5);
171
- }
172
-
173
159
  function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
174
160
 
175
161
  var _ref$4 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -499,7 +485,7 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
499
485
  assetTitle: asset.title
500
486
  }, asset.note.icon ? asset.note.icon : React__default['default'].createElement(warningCircle.SvgWarningCircle, null), React__default['default'].createElement(OverlayInfoTopNoteTitle, null, asset.note.title)))), React__default['default'].createElement(OverlayInfoBottom, null, selectable && React__default['default'].createElement(OverlayInfoBottomSelectButton, {
501
487
  selected: selected
502
- }, React__default['default'].createElement(SvgCheckCircleFilled, {
488
+ }, React__default['default'].createElement(checkCircleFilled.SvgCheckCircleFilled, {
503
489
  onClick: onSelectClick
504
490
  })), React__default['default'].createElement(OverlayInfoBottomActions, null, asset.actions && asset.actions.map(function (action) {
505
491
  return React__default['default'].createElement(Tooltip.Tooltip, {
@@ -814,7 +800,7 @@ var AssetGalleryGridCard = function AssetGalleryGridCard(props) {
814
800
  as: SvgFile
815
801
  })), React__default['default'].createElement(InfoDescription, null, asset.description)), React__default['default'].createElement(Bottom, null, selectable && React__default['default'].createElement(BottomSelectButton, {
816
802
  selected: selected
817
- }, React__default['default'].createElement(SvgCheckCircleFilled, {
803
+ }, React__default['default'].createElement(checkCircleFilled.SvgCheckCircleFilled, {
818
804
  onClick: onSelectClick
819
805
  })), React__default['default'].createElement(BottomActions, null, asset.actions && asset.actions.map(function (action) {
820
806
  return React__default['default'].createElement(Tooltip.Tooltip, {
@@ -3,7 +3,7 @@
3
3
  var defaultTheme = require('./defaultTheme-50f2b88f.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
- var Popover = require('./Popover-11df9750.js');
6
+ var Popover = require('./Popover-cf1e9677.js');
7
7
  var ContextMenu = require('./ContextMenu-d088833b.js');
8
8
  var expandMore = require('./expand-more-94585605.js');
9
9
 
@@ -10,6 +10,7 @@ var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js
10
10
  var reactSelectAsyncPaginate = require('react-select-async-paginate');
11
11
  var close = require('./close-ebf2f3cf.js');
12
12
  var expandMore = require('./expand-more-94585605.js');
13
+ var checkCircleFilled = require('./check-circle-filled-1640873e.js');
13
14
 
14
15
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
16
 
@@ -17,28 +18,35 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
18
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
18
19
  var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
19
20
 
20
- 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;
21
+ 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;
21
22
  var AsyncCreatableSelectPaginate = reactSelectAsyncPaginate.withAsyncPaginate(reactSelectCreatable_esm.CreatableSelect$1);
22
23
  var sharedStyle = styled.css(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 0.875rem;\n line-height: 1rem;\n width: 100%;\n display: block;\n box-shadow: 'none';\n flex-basis: ", ";\n"])), function (props) {
23
24
  return props.theme.primaryFontFamily;
24
25
  }, function (props) {
25
26
  return props.$hasLabel ? '66.66%' : '100%';
26
27
  });
27
- var AutocompleteSelect$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n"])), function (props) {
28
+ var CompactAutocompleteSelect$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n"])), function (props) {
28
29
  return props.theme.primaryFontFamily;
29
30
  });
30
- var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = 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 padding-top: 2px;\n margin-right: 8px;\n"])), function (props) {
31
+ var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = 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 padding-top: 2px;\n"])), function (props) {
31
32
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
32
33
  });
33
34
  var InputContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n width: 100%;\n height: 19px;\n"])));
34
- var AsyncCreatableAutocompleteSelect = styled__default['default'](AsyncCreatableSelectPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
35
- var AsyncAutocompleteSelect = styled__default['default'](reactSelectAsyncPaginate.AsyncPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
36
- var AutocompletSelect = styled__default['default'](Select__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
37
- var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
38
- var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n && {\n height: 22px;\n min-height: 22px;\n background: transparent;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 4px;\n cursor: text;\n border: 1px solid transparent;\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"])), function (props) {
35
+ var CheckIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n margin-top: 0;\n pointer-events: none;\n padding-right: 60px;\n padding-left: 30px;\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 2px;\n bottom: 0;\n color: ", ";\n > svg {\n width: 13px;\n }\n"])), function (props) {
36
+ return props.theme.getColor('emerald-500');
37
+ });
38
+ var AsyncCreatableAutocompleteSelect = styled__default['default'](AsyncCreatableSelectPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
39
+ var AsyncAutocompleteSelect = styled__default['default'](reactSelectAsyncPaginate.AsyncPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
40
+ var AutocompletSelect = styled__default['default'](Select__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
41
+ var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
42
+ var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n && {\n height: 22px;\n min-height: 22px;\n background: ", ";\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 10px;\n cursor: text;\n border: 1px solid transparent;\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 &&:not(:hover):not(:focus) {\n ", ";\n }\n\n &&:focus {\n ", ";\n }\n"])), function (props) {
43
+ return props.success ? props.theme.themeProp('background', props.theme.getColor('emerald-500'), props.theme.getColor('emerald-300')) : 'transparent';
44
+ }, function (props) {
39
45
  return props.warning && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#fffde8');
40
46
  }, function (props) {
41
47
  return props.error && !props.isFocused && props.theme.themeProp('background-color', '#7f1b1b', '#fbeae6');
48
+ }, function (props) {
49
+ return props.success && !props.isFocused && props.theme.themeProp('background-color', '#64b49d', '#bfe0d5');
42
50
  }, function (props) {
43
51
  return props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600'));
44
52
  }, function (props) {
@@ -47,56 +55,62 @@ var Control = styled__default['default'](Select.components.Control).attrs(defaul
47
55
  return props.error && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('red-500'), props.theme.getColor('red-500'));
48
56
  }, function (props) {
49
57
  return !props.isFocused && props.theme.themeProp('background-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
58
+ }, function (props) {
59
+ return props.success && props.theme.themeProp('background-color', props.theme.getColor('emerald-400'), props.theme.getColor('emerald-300'));
50
60
  }, function (props) {
51
61
  return props.warning && !props.isFocused && props.theme.themeProp('background', '#816600', '#fffebf');
52
62
  }, function (props) {
53
63
  return props.error && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
64
+ }, function (props) {
65
+ return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
66
+ }, function (props) {
67
+ return props.success && props.theme.themeProp('background-color', props.theme.getColor('emerald-400'), props.theme.getColor('emerald-300'));
54
68
  });
55
- var Option$1 = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n && {\n min-height: 22px;\n height: 22px;\n display: flex;\n align-items: center;\n padding: 6px;\n cursor: pointer;\n ", "\n ", "\n ", "\n ", "\n }\n svg {\n width: 15px;\n margin: 0 9px 0 0;\n }\n a {\n display: flex;\n text-decoration: none;\n color: inherit;\n }\n"])), function (props) {
69
+ var Option$1 = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n && {\n min-height: 22px;\n height: 22px;\n display: flex;\n align-items: center;\n padding: 6px;\n cursor: pointer;\n padding: 1px 13px;\n ", "\n ", "\n ", "\n ", "\n }\n svg {\n width: 15px;\n margin: 0 9px 0 0;\n }\n a {\n display: flex;\n text-decoration: none;\n color: inherit;\n }\n"])), function (props) {
56
70
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
57
71
  }, function (props) {
58
- return props.isFocused && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
72
+ return props.isFocused && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
59
73
  }, function (props) {
60
- return props.isSelected && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n ", "\n\n ", "\n "])), props.theme.themeProp('background-color', 'transparent', 'transparent'), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
74
+ return props.isSelected && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n ", "\n\n ", "\n "])), props.theme.themeProp('background-color', 'transparent', 'transparent'), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
61
75
  }, function (props) {
62
- return props.isFocused && props.isSelected && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
76
+ return props.isFocused && props.isSelected && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
63
77
  });
64
- var Placeholder = styled__default['default'](Select.components.Placeholder).attrs(defaultTheme.applyDefaultTheme)(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", "\n ", ";\n }\n"])), function (props) {
65
- return (props.error || props.warning) && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
78
+ var Placeholder = styled__default['default'](Select.components.Placeholder).attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", "\n ", ";\n }\n"])), function (props) {
79
+ return (props.error || props.warning) && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
66
80
  }, function (props) {
67
81
  return (props.error || props.warning) && props.theme.themeProp('opacity', '0.6', '0.6');
68
82
  });
69
- var SingleValue$1 = styled__default['default'](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
83
+ var SingleValue$1 = styled__default['default'](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
70
84
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
71
85
  });
72
- var Input = styled__default['default'](Select.components.Input).attrs(defaultTheme.applyDefaultTheme)(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n && {\n margin: 0;\n padding: 0;\n padding-left: 2px;\n ", "\n }\n"])), function (props) {
86
+ var Input = styled__default['default'](Select.components.Input).attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n && {\n margin: 0;\n padding: 0;\n padding-left: 2px;\n ", "\n }\n"])), function (props) {
73
87
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
74
88
  });
75
- var Menu = styled__default['default'](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
89
+ var Menu = styled__default['default'](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
76
90
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
77
91
  });
78
- var ValueContainer = styled__default['default'](Select.components.ValueContainer).attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n && {\n padding: 0;\n"])));
79
- var ClearIndicator$1 = styled__default['default'](Select.components.ClearIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n cursor: pointer;\n ", ";\n }\n"])), function (props) {
92
+ var ValueContainer = styled__default['default'](Select.components.ValueContainer).attrs(defaultTheme.applyDefaultTheme)(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n && {\n padding: 0;\n }\n"])));
93
+ var ClearIndicator$1 = styled__default['default'](Select.components.ClearIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n cursor: pointer;\n ", ";\n }\n"])), function (props) {
80
94
  return props.isFocused ? 'flex' : 'none';
81
95
  }, function (props) {
82
96
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
83
97
  });
84
- var DropdownIndicator$1 = styled__default['default'](Select.components.DropdownIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n width: 18px;\n margin-left: 2px;\n cursor: pointer;\n margin-top: 1px;\n ", ";\n }\n"])), function (props) {
98
+ var DropdownIndicator$1 = styled__default['default'](Select.components.DropdownIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n width: 18px;\n margin-left: 2px;\n cursor: pointer;\n margin-top: 1px;\n ", ";\n }\n"])), function (props) {
85
99
  return props.isFocused ? 'flex' : 'none';
86
100
  }, function (props) {
87
101
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
88
102
  });
89
- var DropdownIndicatorIcon = styled__default['default'](expandMore.SvgExpandMore).attrs(defaultTheme.applyDefaultTheme)(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n width: 12px;\n"])));
90
- var ClearIndicatorIcon = styled__default['default'](close.SvgClose).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n width: 8px;\n margin-right: 4px;\n ", ";\n stroke-width: 2px;\n"])), function (props) {
103
+ var DropdownIndicatorIcon = styled__default['default'](expandMore.SvgExpandMore).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n width: 12px;\n"])));
104
+ var ClearIndicatorIcon = styled__default['default'](close.SvgClose).attrs(defaultTheme.applyDefaultTheme)(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n width: 8px;\n margin-right: 4px;\n ", ";\n stroke-width: 2px;\n"])), function (props) {
91
105
  return props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
92
106
  });
93
- var IndicatorSeparator$1 = styled__default['default'](Select.components.IndicatorSeparator).attrs(defaultTheme.applyDefaultTheme)(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n margin: 4px;\n ", ";\n }\n"])), function (props) {
107
+ var IndicatorSeparator$1 = styled__default['default'](Select.components.IndicatorSeparator).attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n margin: 4px;\n ", ";\n }\n"])), function (props) {
94
108
  return props.isFocused ? 'flex' : 'none';
95
109
  }, function (props) {
96
110
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
97
111
  });
98
112
 
99
- var AutocompleteSelect = React__default['default'].forwardRef(function AutocompleteSelect(_ref, forwardedRef) {
113
+ var CompactAutocompleteSelect = React__default['default'].forwardRef(function CompactAutocompleteSelect(_ref, forwardedRef) {
100
114
  var label = _ref.label,
101
115
  availableOptions = _ref.availableOptions,
102
116
  placeholder = _ref.placeholder,
@@ -108,11 +122,13 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
108
122
  loadingMessageFunc = _ref.loadingMessageFunc,
109
123
  creatable = _ref.creatable,
110
124
  readOnly = _ref.readOnly,
125
+ success = _ref.success,
126
+ edit = _ref.edit,
111
127
  disabled = _ref.disabled,
112
128
  error = _ref.error,
113
129
  hidden = _ref.hidden,
114
130
  warning = _ref.warning,
115
- props = defaultTheme._objectWithoutProperties(_ref, ["label", "availableOptions", "placeholder", "selectedOption", "loadOptions", "noOptionsMessageFunc", "createNewOptionMessageFunc", "onUpdateCallback", "loadingMessageFunc", "creatable", "readOnly", "disabled", "error", "hidden", "warning"]);
131
+ props = defaultTheme._objectWithoutProperties(_ref, ["label", "availableOptions", "placeholder", "selectedOption", "loadOptions", "noOptionsMessageFunc", "createNewOptionMessageFunc", "onUpdateCallback", "loadingMessageFunc", "creatable", "readOnly", "success", "edit", "disabled", "error", "hidden", "warning"]);
116
132
 
117
133
  var _useState = React.useState(nanoid.nanoid()),
118
134
  _useState2 = defaultTheme._slicedToArray(_useState, 1),
@@ -137,7 +153,9 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
137
153
  var control = function control(props) {
138
154
  return React__default['default'].createElement(Control, defaultTheme._extends({
139
155
  className: "select-control",
156
+ edit: edit,
140
157
  error: error,
158
+ success: success,
141
159
  warning: warning
142
160
  }, props));
143
161
  };
@@ -147,11 +165,12 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
147
165
  }, [error, warning]);
148
166
  var ValueContainer$1 = React.useMemo(function () {
149
167
  var valueContainer = function valueContainer(props) {
150
- return React__default['default'].createElement(ValueContainer, defaultTheme._extends({
168
+ return React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(ValueContainer, defaultTheme._extends({
151
169
  className: "value-container",
152
170
  error: error,
171
+ success: success,
153
172
  warning: warning
154
- }, props));
173
+ }, props)), ' ', success && React__default['default'].createElement(CheckIconContainer, null, React__default['default'].createElement(checkCircleFilled.SvgCheckCircleFilled, null)));
155
174
  };
156
175
 
157
176
  valueContainer.displayName = 'ValueContainerWrapper';
@@ -160,7 +179,8 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
160
179
  var Input$1 = React.useMemo(function () {
161
180
  var selectInput = function selectInput(props) {
162
181
  return React__default['default'].createElement(Input, defaultTheme._extends({
163
- className: "select-input"
182
+ className: "select-input",
183
+ success: success
164
184
  }, props));
165
185
  };
166
186
 
@@ -284,7 +304,7 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
284
304
  }
285
305
  };
286
306
  if (hidden) return null;
287
- return React__default['default'].createElement(AutocompleteSelect$1, null, React__default['default'].createElement(InputContainer, null, label && React__default['default'].createElement(Label, {
307
+ return React__default['default'].createElement(CompactAutocompleteSelect$1, null, React__default['default'].createElement(InputContainer, null, label && React__default['default'].createElement(Label, {
288
308
  htmlFor: uniqueId
289
309
  }, label), loadOptions ? creatable ? React__default['default'].createElement(AsyncCreatableAutocompleteSelect, defaultTheme._extends({
290
310
  $hasLabel: !lodash.isEmpty(label)
@@ -296,7 +316,7 @@ var AutocompleteSelect = React__default['default'].forwardRef(function Autocompl
296
316
  $hasLabel: !lodash.isEmpty(label)
297
317
  }, sharedSelectProps, props))));
298
318
  });
299
- AutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
319
+ CompactAutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
300
320
  label: defaultTheme.PropTypes.string,
301
321
  placeholder: defaultTheme.PropTypes.string,
302
322
  availableOptions: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.object),
@@ -306,6 +326,8 @@ AutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
306
326
  createNewOptionMessageFunc: defaultTheme.PropTypes.func,
307
327
  noOptionsMessageFunc: defaultTheme.PropTypes.func,
308
328
  readOnly: defaultTheme.PropTypes.bool,
329
+ edit: defaultTheme.PropTypes.bool,
330
+ success: defaultTheme.PropTypes.bool,
309
331
  hidden: defaultTheme.PropTypes.bool,
310
332
  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
311
333
  warning: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
@@ -313,7 +335,7 @@ AutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
313
335
  creatable: defaultTheme.PropTypes.bool,
314
336
  disabled: defaultTheme.PropTypes.bool
315
337
  } : {};
316
- AutocompleteSelect.defaultProps = {
338
+ CompactAutocompleteSelect.defaultProps = {
317
339
  noOptionsMessageFunc: function noOptionsMessageFunc(inputValue) {
318
340
  if (inputValue) {
319
341
  return "No matches for \"".concat(inputValue, "\"");
@@ -322,10 +344,13 @@ AutocompleteSelect.defaultProps = {
322
344
  }
323
345
  },
324
346
  readOnly: false,
347
+ success: false,
325
348
  disabled: false,
326
349
  creatable: true,
350
+ edit: false,
327
351
  error: false,
328
- warning: false
352
+ warning: false,
353
+ hidden: false
329
354
  };
330
355
 
331
356
  var Option = function Option(props) {
@@ -368,8 +393,4 @@ var IndicatorSeparator = function IndicatorSeparator(props) {
368
393
  }, props));
369
394
  };
370
395
 
371
- AutocompleteSelect.defaultProps = {
372
- hidden: false
373
- };
374
-
375
- exports.AutocompleteSelect = AutocompleteSelect;
396
+ exports.CompactAutocompleteSelect = CompactAutocompleteSelect;
@@ -38,10 +38,12 @@ var CompactStarRating$1 = styled__default['default'].div.attrs(defaultTheme.appl
38
38
  var labelWidth = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n width: 33.3%;\n display: flex;\n align-items: center;\n text-align: left;\n font: normal normal normal 14px/16px Roboto;\n letter-spacing: 0px;\n padding: 0;\n height: 19px;\n\n ", "\n"])), function (props) {
39
39
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
40
40
  });
41
- var starsWidth = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n width: 66.6%;\n border-radius: 3px;\n height: 24px;\n align-items: center;\n\n ", "\n\n ", "\n"])), function (props) {
41
+ var starsWidth = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n width: 66.6%;\n border-radius: 3px;\n height: 24px;\n align-items: center;\n padding: 1px 10px;\n\n ", "\n\n ", "\n &&:not(:hover):not(:focus) {\n ", ";\n }\n"])), function (props) {
42
42
  return props.error && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), props.theme.themeProp('background', '#7F1B1B', '#FBEAE6'));
43
43
  }, function (props) {
44
44
  return props.warning && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n "])), props.theme.themeProp('background', '#634E01', '#FFFDE8'));
45
+ }, function (props) {
46
+ return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
45
47
  });
46
48
  var Star = styled__default['default'].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n\n svg {\n height: 12px;\n padding-left: 4px;\n transition: color 250ms;\n }\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", "\n"])), function (props) {
47
49
  return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'));
@@ -108,9 +110,10 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
108
110
  error = _ref.error,
109
111
  warning = _ref.warning,
110
112
  readOnly = _ref.readOnly,
113
+ edit = _ref.edit,
111
114
  hidden = _ref.hidden,
112
115
  getRatingProp = _ref.getRating,
113
- props = defaultTheme._objectWithoutProperties(_ref, ["label", "icon", "iconFill", "max", "defaultValue", "value", "name", "viewEmpty", "onChange", "onBlur", "error", "warning", "readOnly", "hidden", "getRating"]);
116
+ props = defaultTheme._objectWithoutProperties(_ref, ["label", "icon", "iconFill", "max", "defaultValue", "value", "name", "viewEmpty", "onChange", "onBlur", "error", "warning", "readOnly", "edit", "hidden", "getRating"]);
114
117
 
115
118
  var stars = Array.from(Array(max).keys());
116
119
 
@@ -216,6 +219,7 @@ var CompactStarRating = React__default['default'].forwardRef(function CompactSta
216
219
  onChange: onChange,
217
220
  onBlur: onBlur
218
221
  }, props), React__default['default'].createElement(labelWidth, null, label), React__default['default'].createElement(starsWidth, {
222
+ edit: edit,
219
223
  error: hasError,
220
224
  warning: hasWarning
221
225
  }, stars.map(function (key) {
@@ -252,6 +256,7 @@ CompactStarRating.propTypes = process.env.NODE_ENV !== "production" ? {
252
256
  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
253
257
  warning: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
254
258
  readOnly: defaultTheme.PropTypes.bool,
259
+ edit: defaultTheme.PropTypes.bool,
255
260
  hidden: defaultTheme.PropTypes.bool,
256
261
  getRating: defaultTheme.PropTypes.func
257
262
  } : {};
@@ -6,9 +6,10 @@ var nanoid = require('nanoid');
6
6
  var lodash = require('lodash');
7
7
  var styled = require('styled-components');
8
8
  var editNote = require('./edit-note-c47d292e.js');
9
+ var checkCircleFilled = require('./check-circle-filled-1640873e.js');
9
10
  require('./Alert-3e4f8be1.js');
10
11
  require('./Badge-9bcebe96.js');
11
- var Popover = require('./Popover-11df9750.js');
12
+ var Popover = require('./Popover-cf1e9677.js');
12
13
  require('./Tab-bd0f3345.js');
13
14
  require('./Tabs-cfc35dc0.js');
14
15
  var Tooltip = require('./Tooltip-f4f9ab8f.js');
@@ -39,7 +40,7 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
39
40
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
40
41
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
41
42
 
42
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
43
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
43
44
  var CompactTextInput$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n"])), function (props) {
44
45
  return props.theme.primaryFontFamily;
45
46
  });
@@ -62,44 +63,55 @@ var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.apply
62
63
  }, function (props) {
63
64
  return props.error && props.theme.themeProp('color', '#CB968F', '#CB968F');
64
65
  });
65
- var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = 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 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 &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n\n & + ", " {\n opacity: 1;\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) {
66
+ var CheckIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n padding-right: 4px;\n padding-left: 30px;\n display: flex;\n align-items: center;\n position: absolute;\n right: 0;\n top: 2px;\n bottom: 0;\n color: ", ";\n > svg {\n width: 13px;\n }\n"])), function (props) {
67
+ return props.theme.getColor('emerald-500');
68
+ });
69
+ var Input = styled__default['default'].input.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = 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 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 &&:hover:not(:focus) {\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n & + ", " {\n opacity: 1;\n ", ";\n\n & + ", " {\n opacity: 1;\n }\n }\n }\n\n &&:focus {\n ", ";\n\n ", ";\n outline: none;\n\n ", ";\n\n ", ";\n\n ", ";\n }\n\n &&::placeholder {\n color: inherit;\n opacity: 0.6;\n }\n\n ", "\n"])), function (props) {
66
70
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
67
71
  }, function (props) {
68
72
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('white'));
69
73
  }, function (props) {
70
- return props.hasLink && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n ", "\n }\n\n &&:read-only {\n cursor: pointer;\n }\n "])), function (props) {
74
+ return props.hasLink && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n &&:not(:focus),\n &&:read-only {\n text-decoration: underline;\n ", "\n }\n\n &&:read-only {\n cursor: pointer;\n }\n "])), function (props) {
71
75
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('emerald-500'));
72
76
  });
73
77
  }, function (props) {
74
78
  return props.warning && props.theme.themeProp('background', '#634e01', '#fffde8');
75
79
  }, function (props) {
76
- return props.error && props.theme.themeProp('background', '#7f1b1b', '#fbeae6');
80
+ return props.error && props.theme.themeProp('background', '#red', '#fbeae6');
77
81
  }, function (props) {
78
82
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
83
+ }, function (props) {
84
+ return props.success && props.theme.themeProp('background', props.theme.getColor('emerald-500'), props.theme.getColor('emerald-300'));
79
85
  }, function (props) {
80
86
  return !props.readOnly && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
81
87
  }, function (props) {
82
88
  return props.warning && !props.readOnly && props.theme.themeProp('background', '#816600', '#fffebf');
89
+ }, function (props) {
90
+ return props.success && props.theme.themeProp('background', props.theme.getColor('emerald-500'), props.theme.getColor('emerald-300'));
83
91
  }, function (props) {
84
92
  return props.error && !props.readOnly && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
85
93
  }, InputIconContainer, function (props) {
94
+ return props.success && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
95
+ }, CheckIconContainer, function (props) {
86
96
  return props.error && !props.readOnly && props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
87
97
  }, function (props) {
88
- return !props.readOnly && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
98
+ return !props.readOnly && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
89
99
  return props.theme.getColor('gray-600');
90
100
  });
91
101
  }, function (props) {
92
- return props.warning && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
102
+ return props.warning && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
93
103
  return props.theme.getColor('signal-yellow-500');
94
104
  });
95
105
  }, function (props) {
96
- return props.error && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
106
+ return props.error && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", ";\n "])), function (props) {
97
107
  return props.theme.getColor('red-500');
98
108
  });
99
109
  }, function (props) {
100
- return props.bold && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n font-size: 1rem;\n font-weight: 500;\n line-height: 1.0625;\n padding-top: 3px;\n padding-bottom: 2px;\n "])));
110
+ return props.success && props.theme.themeProp('background', props.theme.getColor('emerald-500'), props.theme.getColor('emerald-300'));
111
+ }, function (props) {
112
+ return props.bold && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n font-size: 1rem;\n font-weight: 500;\n line-height: 1.0625;\n padding-top: 3px;\n padding-bottom: 2px;\n "])));
101
113
  });
102
- var LinkPopoverContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject13 || (_templateObject13 = 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) {
114
+ var LinkPopoverContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = 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) {
103
115
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('emerald-500'), 1);
104
116
  });
105
117
 
@@ -136,6 +148,7 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
136
148
  autoSelect = _ref2.autoSelect,
137
149
  readOnly = _ref2.readOnly,
138
150
  edit = _ref2.edit,
151
+ success = _ref2.success,
139
152
  error = _ref2.error,
140
153
  warning = _ref2.warning,
141
154
  bold = _ref2.bold,
@@ -143,7 +156,7 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
143
156
  onChangeProp = _ref2.onChange,
144
157
  onFocusProp = _ref2.onFocus,
145
158
  onBlurProp = _ref2.onBlur,
146
- props = defaultTheme._objectWithoutProperties(_ref2, ["label", "type", "name", "defaultValue", "value", "placeholder", "link", "linkTarget", "autoSelect", "readOnly", "edit", "error", "warning", "bold", "hidden", "onChange", "onFocus", "onBlur"]);
159
+ props = defaultTheme._objectWithoutProperties(_ref2, ["label", "type", "name", "defaultValue", "value", "placeholder", "link", "linkTarget", "autoSelect", "readOnly", "edit", "success", "error", "warning", "bold", "hidden", "onChange", "onFocus", "onBlur"]);
147
160
 
148
161
  var _useState = React.useState(nanoid.nanoid()),
149
162
  _useState2 = defaultTheme._slicedToArray(_useState, 1),
@@ -241,10 +254,12 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
241
254
  name: name,
242
255
  readOnly: readOnly,
243
256
  edit: edit,
257
+ sucess: success,
244
258
  placeholder: placeholder,
245
259
  defaultValue: defaultValue,
246
260
  value: value,
247
261
  error: error,
262
+ success: success,
248
263
  warning: warning,
249
264
  bold: bold,
250
265
  hasLink: !lodash.isEmpty(link),
@@ -254,7 +269,7 @@ var CompactTextInput = React__default['default'].forwardRef(function CompactText
254
269
  }), !readOnly && React__default['default'].createElement(InputIconContainer, {
255
270
  error: error,
256
271
  warning: warning
257
- }, React__default['default'].createElement(editNote.SvgEditNote, null))))));
272
+ }, React__default['default'].createElement(editNote.SvgEditNote, null)), success && React__default['default'].createElement(CheckIconContainer, null, React__default['default'].createElement(checkCircleFilled.SvgCheckCircleFilled, null))))));
258
273
  });
259
274
  CompactTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
260
275
  label: defaultTheme.PropTypes.string,
@@ -268,6 +283,7 @@ CompactTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
268
283
  autoSelect: defaultTheme.PropTypes.bool,
269
284
  readOnly: defaultTheme.PropTypes.bool,
270
285
  edit: defaultTheme.PropTypes.bool,
286
+ success: defaultTheme.PropTypes.bool,
271
287
  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
272
288
  warning: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
273
289
  bold: defaultTheme.PropTypes.bool,
@@ -282,6 +298,7 @@ CompactTextInput.defaultProps = {
282
298
  linkTarget: '_self',
283
299
  bold: false,
284
300
  readOnly: false,
301
+ success: false,
285
302
  edit: false,
286
303
  error: false,
287
304
  warning: false,
@@ -3,8 +3,8 @@
3
3
  var defaultTheme = require('./defaultTheme-50f2b88f.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
- var TextArea = require('./TextArea-6dad1bbe.js');
7
- var AutocompleteSelect = require('./AutocompleteSelect-57a324e3.js');
6
+ var TextArea = require('./TextArea-76e2ff1e.js');
7
+ var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-0160cb3e.js');
8
8
  var warningCircle = require('./warning-circle-24522402.js');
9
9
  var lodash = require('lodash');
10
10
 
@@ -173,7 +173,7 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
173
173
  }, props), React__default['default'].createElement(TopBarContainer, {
174
174
  initialHover: initialHover,
175
175
  className: isHovered && !readOnly && 'slide-in'
176
- }, React__default['default'].createElement(SelectContainer, null, React__default['default'].createElement(AutocompleteSelect.AutocompleteSelect, defaultTheme._extends({
176
+ }, React__default['default'].createElement(SelectContainer, null, React__default['default'].createElement(CompactAutocompleteSelect.CompactAutocompleteSelect, defaultTheme._extends({
177
177
  warning: true,
178
178
  value: selectedOption,
179
179
  creatable: false,
@@ -15,7 +15,7 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
15
15
  var TippyTooltip__default = /*#__PURE__*/_interopDefaultLegacy(TippyTooltip);
16
16
 
17
17
  var _templateObject, _templateObject2, _templateObject3;
18
- var Popover$1 = styled__default['default'](TippyTooltip__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 400;\n color: inherit;\n border-radius: 0;\n line-height: inherit;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n .tippy-content {\n padding: 0;\n }\n\n .tippy-arrow {\n ", "\n }\n\n && > .tippy-arrow::before {\n position: absolute;\n border-color: transparent;\n border-style: solid;\n }\n\n & > .tippy-arrow::after {\n content: '';\n position: absolute;\n border-color: transparent;\n border-style: solid;\n }\n\n &[data-placement^='top'] {\n & > .tippy-arrow:before {\n bottom: -16px;\n left: -5px;\n border-width: 15px 13px 0;\n ", "\n }\n\n & > .tippy-arrow:after {\n bottom: -15px;\n left: -5px;\n border-width: 15px 13px 0;\n border-top-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='right'] {\n & > .tippy-arrow:before {\n bottom: -5px;\n left: -16px;\n border-width: 13px 15px 13px 0;\n ", "\n }\n\n & > .tippy-arrow:after {\n bottom: -5px;\n left: -15px;\n border-width: 13px 15px 13px 0;\n border-right-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='bottom'] {\n & > .tippy-arrow:before {\n top: -16px;\n left: -5px;\n border-width: 0 13px 15px 13px;\n ", "\n }\n\n & > .tippy-arrow:after {\n top: -15px;\n left: -5px;\n border-width: 0 13px 15px 13px;\n border-bottom-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='left'] {\n & > .tippy-arrow::before {\n bottom: -5px;\n right: -16px;\n border-width: 13px 0 13px 15px;\n ", "\n }\n\n & > .tippy-arrow::after {\n bottom: -5px;\n right: -15px;\n border-width: 13px 0 13px 15px;\n border-left-color: initial;\n transform-origin: center top;\n }\n }\n"])), function (props) {
18
+ var Popover$1 = styled__default['default'](TippyTooltip__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 400;\n color: inherit;\n border-radius: 0;\n line-height: inherit;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n .tippy-content {\n padding: 0;\n }\n\n .tippy-arrow {\n ", "\n }\n\n && > .tippy-arrow::before {\n position: absolute;\n border-color: transparent;\n border-style: solid;\n }\n\n & > .tippy-arrow::after {\n content: '';\n position: absolute;\n border-color: transparent;\n border-style: solid;\n }\n\n &[data-placement^='top'] {\n & > .tippy-arrow:before {\n bottom: -16px;\n left: -5px;\n border-width: 15px 13px 0;\n ", "\n }\n\n & > .tippy-arrow:after {\n bottom: -15px;\n left: -5px;\n border-width: 15px 13px 0;\n border-top-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='right'] {\n & > .tippy-arrow:before {\n bottom: -5px;\n left: -16px;\n border-width: 13px 15px 13px 0;\n ", "\n }\n\n & > .tippy-arrow:after {\n bottom: -5px;\n left: -15px;\n border-width: 13px 15px 13px 0;\n border-right-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='bottom'] {\n & > .tippy-arrow:before {\n top: -16px;\n left: -5px;\n border-width: 0 13px 15px 13px;\n ", "\n }\n\n & > .tippy-arrow:after {\n top: -14.5px;\n left: -5px;\n border-width: 0 13px 15px 13px;\n border-bottom-color: initial;\n transform-origin: center top;\n }\n }\n\n &[data-placement^='left'] {\n & > .tippy-arrow::before {\n bottom: -5px;\n right: -16px;\n border-width: 13px 0 13px 15px;\n ", "\n }\n\n & > .tippy-arrow::after {\n bottom: -5px;\n right: -15px;\n border-width: 13px 0 13px 15px;\n border-left-color: initial;\n transform-origin: center top;\n }\n }\n"])), function (props) {
19
19
  return props.theme.primaryFontFamily;
20
20
  }, function (props) {
21
21
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
@@ -32,15 +32,15 @@ var Popover$1 = styled__default['default'](TippyTooltip__default['default']).att
32
32
  }, function (props) {
33
33
  return props.contextMenuSublevel && styled.css(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n &[data-placement^='right-start'],\n &[data-placement^='left-start'] {\n margin-top: -4px;\n }\n\n &[data-placement^='left'] {\n margin-right: -6px;\n }\n\n &[data-placement^='right'] {\n margin-left: -6px;\n }\n "])));
34
34
  }, function (props) {
35
- return props.theme.themeProp('color', props.theme.getColor('gray-700'), props.theme.getColor('white'));
35
+ return props.theme.themeProp('color', props.theme.getColor('gray-700'), props.theme.getColor('white'), 1);
36
36
  }, function (props) {
37
- return props.theme.themeProp('border-top-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-400'));
37
+ return props.theme.themeProp('border-top-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-300'), 1);
38
38
  }, function (props) {
39
- return props.theme.themeProp('border-right-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-400'));
39
+ return props.theme.themeProp('border-right-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-300'), 1);
40
40
  }, function (props) {
41
- return props.theme.themeProp('border-bottom-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-400'));
41
+ return props.theme.themeProp('border-bottom-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-300'), 1);
42
42
  }, function (props) {
43
- return props.theme.themeProp('border-left-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-400'));
43
+ return props.theme.themeProp('border-left-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-300'), 1);
44
44
  });
45
45
 
46
46
  var Popover = React__default['default'].forwardRef(function Popover(_ref, ref) {
@@ -6,13 +6,14 @@ var nanoid = require('nanoid');
6
6
  var styled = require('styled-components');
7
7
  var lodash = require('lodash');
8
8
  var editNote = require('./edit-note-c47d292e.js');
9
+ var checkCircleFilled = require('./check-circle-filled-1640873e.js');
9
10
 
10
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
12
 
12
13
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
14
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
14
15
 
15
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
16
+ 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;
16
17
  var activeLabel = styled.css(_templateObject || (_templateObject = 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"])));
17
18
  var placeholderBaseStyle = styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n ", "\n\n ", "\n"])), function (props) {
18
19
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'));
@@ -22,7 +23,12 @@ var placeholderBaseStyle = styled.css(_templateObject2 || (_templateObject2 = de
22
23
  var InputIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = 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: 5px;\n top: 10px;\n bottom: 0;\n svg {\n width: 15px;\n opacity: 0.7;\n transition: opacity 250ms;\n ", "\n }\n"])), function (props) {
23
24
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-900'), '!important');
24
25
  });
25
- var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n width: 100%;\n font-family: inherit;\n font-size: 0.875rem;\n border-radius: 2px;\n padding: 13px 10px;\n resize: vertical;\n ", "\n ", "\n ", "\n border: 1px solid;\n ", "\n ", " \n\n ", " \n\n ", " \n ", "\n ", ";\n &&:hover:not(:focus) {\n ", ";\n transition: background 350ms;\n & + ", " {\n opacity: 1;\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) {
26
+ var CheckIconContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\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: 6px;\n top: 8px;\n bottom: 0;\n svg {\n width: 15px;\n color: ", ";\n }\n"])), function (props) {
27
+ return props.theme.getColor('emerald-500');
28
+ });
29
+ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: block;\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\n ", "\n \n ", "\n ", "\n ", "\n border: 1px solid;\n ", "\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
+ return props.expanded && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n height: ", "em;\n "])), props.maxHeight);
31
+ }, function (props) {
26
32
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
27
33
  }, function (props) {
28
34
  return (props.warningAlert || props.errorAlert) && props.theme.themeProp('color', props.theme.getColor('gray-900'), props.theme.getColor('gray-900'));
@@ -31,25 +37,29 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
31
37
  }, function (props) {
32
38
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-400'));
33
39
  }, function (props) {
34
- return props.noBorder && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px 13px 10px;\n border-color: transparent !important;\n "])));
40
+ return props.noBorder && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n padding: 13px 15px 13px 10px;\n border-color: transparent !important;\n "])));
41
+ }, function (props) {
42
+ return props.success && styled.css(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n ", "\n &&:hover {\n ", "\n }\n "])), props.theme.themeProp('background', props.theme.getColor('emerald-500'), props.theme.getColor('emerald-300')), props.theme.themeProp('background', '#64b49d !important', '#bfe0d5 !important'));
35
43
  }, function (props) {
36
- return props.warningAlert && styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n background: ", " !important;\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n background: ", " !important;\n }\n &&:read-only:hover {\n background: ", " !important;\n }\n "])), props.theme.getColor('signal-yellow-400'), props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400'));
44
+ return props.warningAlert && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n background: ", " !important;\n :focus {\n background: white !important;\n }\n &&:hover:not(:focus) {\n background: ", " !important;\n }\n &&:read-only:hover {\n background: ", " !important;\n }\n "])), props.theme.getColor('signal-yellow-400'), props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-400'));
37
45
  }, function (props) {
38
- return props.errorAlert && styled.css(_templateObject7 || (_templateObject7 = 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'));
46
+ return props.errorAlert && styled.css(_templateObject10 || (_templateObject10 = 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'));
39
47
  }, function (props) {
40
- return props.lightBackground && styled.css(_templateObject8 || (_templateObject8 = 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'));
48
+ return props.lightBackground && styled.css(_templateObject11 || (_templateObject11 = 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'));
41
49
  }, function (props) {
42
50
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
43
51
  }, function (props) {
44
52
  return props.noBorder && !props.readOnly ? props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')) : 'background: transparent';
45
53
  }, InputIconContainer, function (props) {
46
- return props.warning && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", " !important;\n "])), props.theme.getColor('orange-500'));
54
+ return props.success && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n "])));
47
55
  }, function (props) {
48
- return props.error && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", " !important;\n "])), props.theme.getColor('red-500'));
56
+ return props.warning && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", " !important;\n "])), props.theme.getColor('orange-500'));
49
57
  }, function (props) {
50
- return props.hasIcon && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 35px;\n "])));
58
+ return props.error && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n border-color: ", " !important;\n "])), props.theme.getColor('red-500'));
51
59
  }, function (props) {
52
- return (props.warningAlert || props.errorAlert) && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 25px;\n padding-right: 30px;\n "])));
60
+ return props.hasIcon && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 35px;\n "])));
61
+ }, function (props) {
62
+ return (props.warningAlert || props.errorAlert) && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 55px;\n padding-top: 25px;\n padding-right: 30px;\n "])));
53
63
  }, function (props) {
54
64
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'), 1);
55
65
  }, function (props) {
@@ -59,26 +69,31 @@ var TextInputField = styled__default['default'].textarea.attrs(defaultTheme.appl
59
69
  }, function (props) {
60
70
  return props.theme.getColor('gray-600');
61
71
  });
62
- var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject13 || (_templateObject13 = 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) {
72
+ var TextInputLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject17 || (_templateObject17 = 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) {
63
73
  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%)"));
64
74
  }, function (props) {
65
- return props.hasPlaceholder && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.error && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
75
+ return props.hasPlaceholder && styled.css(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n ", "\n "])), activeLabel, props.error && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n color: ", " !important;\n "])), props.theme.getColor('red-500')));
66
76
  }, function (props) {
67
- return props.hasIcon && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n left: 35px;\n "])));
77
+ return props.hasIcon && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n left: 35px;\n "])));
68
78
  });
69
- var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject17 || (_templateObject17 = 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"])));
70
- var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\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) {
79
+ var TextInputFieldIcon = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = 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"])));
80
+ var TextInputFieldIconAlert = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 13px;\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) {
71
81
  return props.theme.themeProp('color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600'), 1);
72
82
  });
73
- var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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"])), TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
83
+ var TextInput = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\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"])), TextInputLabel, activeLabel, TextInputFieldIcon, TextInputField, TextInputLabel, activeLabel, function (props) {
74
84
  return props.error && props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500'));
75
85
  }, function (props) {
76
- return props.disabled && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
86
+ return props.disabled && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n\n > * {\n cursor: not-allowed;\n }\n "])));
77
87
  });
78
- var Description = styled__default['default'].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = 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) {
88
+ var Description = styled__default['default'].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = 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) {
79
89
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
80
90
  }, function (props) {
81
- return props.error && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
91
+ return props.error && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
92
+ });
93
+ var ShowMoreText = styled__default['default'].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n margin: 8px 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 ", "\n"])), function (props) {
94
+ return props.theme.themeProp('color', props.theme.getColor('emerald-300'), props.theme.getColor('emerald-500'));
95
+ }, function (props) {
96
+ return props.error && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
82
97
  });
83
98
 
84
99
  var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forwardedRef) {
@@ -92,8 +107,11 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
92
107
  hidden = _ref.hidden,
93
108
  readOnly = _ref.readOnly,
94
109
  edit = _ref.edit,
110
+ showMore = _ref.showMore,
111
+ showMoreText = _ref.showMoreText,
95
112
  autoComplete = _ref.autoComplete,
96
113
  description = _ref.description,
114
+ success = _ref.success,
97
115
  error = _ref.error,
98
116
  warning = _ref.warning,
99
117
  icon = _ref.icon,
@@ -106,11 +124,38 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
106
124
  noBorder = _ref.noBorder,
107
125
  warningAlert = _ref.warningAlert,
108
126
  errorAlert = _ref.errorAlert,
109
- rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "autoComplete", "description", "error", "warning", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "warningAlert", "errorAlert"]);
127
+ rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "showMore", "showMoreText", "autoComplete", "description", "success", "error", "warning", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "warningAlert", "errorAlert"]);
128
+
129
+ var lineheight = 1.5;
130
+
131
+ var _useState = React.useState(''),
132
+ _useState2 = defaultTheme._slicedToArray(_useState, 2),
133
+ contentRows = _useState2[0],
134
+ setContentRows = _useState2[1];
135
+
136
+ var _useState3 = React.useState(rows),
137
+ _useState4 = defaultTheme._slicedToArray(_useState3, 2),
138
+ defaultRows = _useState4[0],
139
+ setDefaultRows = _useState4[1];
110
140
 
111
- var _useState = React.useState(nanoid.nanoid()),
112
- _useState2 = defaultTheme._slicedToArray(_useState, 1),
113
- uniqueId = _useState2[0];
141
+ var _useState5 = React.useState(false),
142
+ _useState6 = defaultTheme._slicedToArray(_useState5, 2),
143
+ expanded = _useState6[0],
144
+ setExpanded = _useState6[1];
145
+
146
+ var _useState7 = React.useState("".concat(defaultRows * lineheight, "em")),
147
+ _useState8 = defaultTheme._slicedToArray(_useState7, 2),
148
+ maxHeight = _useState8[0],
149
+ setMaxHeight = _useState8[1];
150
+
151
+ console.log('default maxHeight', maxHeight);
152
+ React.useEffect(function () {
153
+ setDefaultRows(rows);
154
+ }, []);
155
+
156
+ var _useState9 = React.useState(nanoid.nanoid()),
157
+ _useState10 = defaultTheme._slicedToArray(_useState9, 1),
158
+ uniqueId = _useState10[0];
114
159
 
115
160
  var hasError = React.useMemo(function () {
116
161
  if (lodash.isBoolean(error)) {
@@ -141,6 +186,26 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
141
186
 
142
187
  return null;
143
188
  }, [description, error, warning]);
189
+
190
+ var handleTextAreaChange = function handleTextAreaChange(event) {
191
+ var textarea = event.target;
192
+ var currentRows = Math.floor(textarea.scrollHeight / (lineheight * 0.9));
193
+ var maxHeight = currentRows * lineheight + 'em';
194
+
195
+ if (lodash.isEmpty(currentRows)) {
196
+ setContentRows(currentRows);
197
+ setMaxHeight(maxHeight);
198
+ setExpanded(true);
199
+ }
200
+
201
+ if (contentRows > defaultRows) {
202
+ setContentRows(defaultRows);
203
+ setExpanded(false);
204
+ }
205
+ };
206
+
207
+ console.log('maxHeight', maxHeight);
208
+ console.log('expanded', expanded);
144
209
  if (hidden) return null;
145
210
  return React__default['default'].createElement(TextInput, {
146
211
  disabled: disabled,
@@ -148,10 +213,13 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
148
213
  error: hasError,
149
214
  warning: hasWarning,
150
215
  className: className,
151
- style: style
216
+ style: style,
217
+ showMore: showMore
152
218
  }, !warningAlert && !errorAlert && React__default['default'].createElement(TextInputFieldIcon, null, icon), (warningAlert || errorAlert) && React__default['default'].createElement(TextInputFieldIconAlert, null, icon), React__default['default'].createElement(TextInputField, defaultTheme._extends({
153
219
  ref: forwardedRef,
154
- rows: rows,
220
+ rows: contentRows > rows ? contentRows : rows,
221
+ expanded: expanded,
222
+ maxHeight: maxHeight,
155
223
  value: value,
156
224
  defaultValue: defaultValue,
157
225
  name: name,
@@ -160,6 +228,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
160
228
  disabled: disabled || readOnly,
161
229
  readOnly: readOnly,
162
230
  edit: edit,
231
+ success: success,
163
232
  autoComplete: autoComplete,
164
233
  hasIcon: Boolean(icon),
165
234
  icon: icon,
@@ -175,14 +244,17 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
175
244
  }, rest)), !readOnly && noBorder && React__default['default'].createElement(InputIconContainer, {
176
245
  warningAlert: warningAlert,
177
246
  errorAlert: errorAlert
178
- }, React__default['default'].createElement(editNote.SvgEditNote, null)), label && React__default['default'].createElement(TextInputLabel, {
247
+ }, React__default['default'].createElement(editNote.SvgEditNote, null)), success && React__default['default'].createElement(CheckIconContainer, null, React__default['default'].createElement(checkCircleFilled.SvgCheckCircleFilled, null)), label && React__default['default'].createElement(TextInputLabel, {
179
248
  htmlFor: "text-input-".concat(uniqueId),
180
249
  hasPlaceholder: Boolean(placeholder),
181
250
  hasIcon: Boolean(icon),
182
251
  error: hasError
183
252
  }, label, required && ' *'), typeof descriptionText === 'string' && descriptionText.length > 0 && React__default['default'].createElement(Description, {
184
253
  error: hasError
185
- }, descriptionText));
254
+ }, descriptionText), typeof showMoreText === 'string' && showMoreText.length > 0 && React__default['default'].createElement(ShowMoreText, {
255
+ onClick: handleTextAreaChange,
256
+ showMore: showMore
257
+ }, showMoreText));
186
258
  });
187
259
  TextArea.defaultProps = {
188
260
  rows: 4,
@@ -191,7 +263,9 @@ TextArea.defaultProps = {
191
263
  edit: false,
192
264
  warningAlert: false,
193
265
  errorAlert: false,
194
- hidden: false
266
+ hidden: false,
267
+ showMore: false,
268
+ showMoreText: ''
195
269
  };
196
270
  TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
197
271
  value: defaultTheme.PropTypes.string,
@@ -203,11 +277,14 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
203
277
  disabled: defaultTheme.PropTypes.bool,
204
278
  hidden: defaultTheme.PropTypes.bool,
205
279
  readOnly: defaultTheme.PropTypes.bool,
280
+ showMore: defaultTheme.PropTypes.bool,
281
+ showMoreText: defaultTheme.PropTypes.string,
206
282
  edit: defaultTheme.PropTypes.bool,
207
283
  autoComplete: defaultTheme.PropTypes.string,
208
284
  description: defaultTheme.PropTypes.string,
209
285
  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
210
286
  warning: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
287
+ success: defaultTheme.PropTypes.bool,
211
288
  icon: defaultTheme.PropTypes.element,
212
289
  rows: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.number, defaultTheme.PropTypes.string]),
213
290
  className: defaultTheme.PropTypes.string,
@@ -0,0 +1,42 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+
5
+ function _interopNamespace(e) {
6
+ if (e && e.__esModule) return e;
7
+ var n = Object.create(null);
8
+ if (e) {
9
+ Object.keys(e).forEach(function (k) {
10
+ if (k !== 'default') {
11
+ var d = Object.getOwnPropertyDescriptor(e, k);
12
+ Object.defineProperty(n, k, d.get ? d : {
13
+ enumerable: true,
14
+ get: function () {
15
+ return e[k];
16
+ }
17
+ });
18
+ }
19
+ });
20
+ }
21
+ n['default'] = e;
22
+ return Object.freeze(n);
23
+ }
24
+
25
+ var React__namespace = /*#__PURE__*/_interopNamespace(React);
26
+
27
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
28
+
29
+ var _ref = /*#__PURE__*/React__namespace.createElement("path", {
30
+ fill: "currentColor",
31
+ d: "M12 0a12 12 0 1012 12A12 12 0 0012 0zM9.6 18l-6-6 1.69-1.69L9.6 14.6l9.11-9.1 1.69 1.7z",
32
+ fillOpacity: 0.9
33
+ });
34
+
35
+ function SvgCheckCircleFilled(props) {
36
+ return /*#__PURE__*/React__namespace.createElement("svg", _extends({
37
+ xmlns: "http://www.w3.org/2000/svg",
38
+ viewBox: "0 0 24 24"
39
+ }, props), _ref);
40
+ }
41
+
42
+ exports.SvgCheckCircleFilled = SvgCheckCircleFilled;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Popover = require('../../Popover-11df9750.js');
3
+ var Popover = require('../../Popover-cf1e9677.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
package/data/index.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Alert = require('../Alert-3e4f8be1.js');
6
6
  var Badge = require('../Badge-9bcebe96.js');
7
- var Popover = require('../Popover-11df9750.js');
7
+ var Popover = require('../Popover-cf1e9677.js');
8
8
  var Tab = require('../Tab-bd0f3345.js');
9
9
  var Tabs = require('../Tabs-cfc35dc0.js');
10
10
  var Tooltip = require('../Tooltip-f4f9ab8f.js');
@@ -1,10 +1,10 @@
1
1
  'use strict';
2
2
 
3
- var Button = require('../../Button-dd271c4b.js');
3
+ var Button = require('../../Button-f893df21.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
- require('../../Popover-11df9750.js');
7
+ require('../../Popover-cf1e9677.js');
8
8
  require('lodash');
9
9
  require('polished');
10
10
  require('@tippyjs/react');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var AutocompleteSelect = require('../../AutocompleteSelect-57a324e3.js');
3
+ var CompactAutocompleteSelect = require('../../CompactAutocompleteSelect-0160cb3e.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -12,7 +12,8 @@ require('react-dom');
12
12
  require('react-select-async-paginate');
13
13
  require('../../close-ebf2f3cf.js');
14
14
  require('../../expand-more-94585605.js');
15
+ require('../../check-circle-filled-1640873e.js');
15
16
 
16
17
 
17
18
 
18
- module.exports = AutocompleteSelect.AutocompleteSelect;
19
+ module.exports = CompactAutocompleteSelect.CompactAutocompleteSelect;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactStarRating = require('../../CompactStarRating-942afff1.js');
3
+ var CompactStarRating = require('../../CompactStarRating-9c4c4f2c.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -1,15 +1,16 @@
1
1
  'use strict';
2
2
 
3
- var CompactTextInput = require('../../CompactTextInput-e9c99aa3.js');
3
+ var CompactTextInput = require('../../CompactTextInput-d2fabaf5.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('nanoid');
8
8
  require('lodash');
9
9
  require('../../edit-note-c47d292e.js');
10
+ require('../../check-circle-filled-1640873e.js');
10
11
  require('../../Alert-3e4f8be1.js');
11
12
  require('../../Badge-9bcebe96.js');
12
- require('../../Popover-11df9750.js');
13
+ require('../../Popover-cf1e9677.js');
13
14
  require('polished');
14
15
  require('@tippyjs/react');
15
16
  require('../../shift-away-subtle-cfdf1dbe.js');
@@ -1,12 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-6dad1bbe.js');
3
+ var TextArea = require('../../TextArea-76e2ff1e.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('nanoid');
8
8
  require('lodash');
9
9
  require('../../edit-note-c47d292e.js');
10
+ require('../../check-circle-filled-1640873e.js');
10
11
 
11
12
 
12
13
 
package/inputs/index.js CHANGED
@@ -3,32 +3,33 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var ActionButton = require('../ActionButton-c3f5ed94.js');
6
- var AutocompleteSelect = require('../AutocompleteSelect-57a324e3.js');
7
- var Button = require('../Button-dd271c4b.js');
6
+ var Button = require('../Button-f893df21.js');
8
7
  var Checkbox = require('../Checkbox-012bbd3f.js');
9
- var CompactStarRating = require('../CompactStarRating-942afff1.js');
10
- var CompactTextInput = require('../CompactTextInput-e9c99aa3.js');
8
+ var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-0160cb3e.js');
9
+ var CompactStarRating = require('../CompactStarRating-9c4c4f2c.js');
10
+ var CompactTextInput = require('../CompactTextInput-d2fabaf5.js');
11
11
  var MultiSelect = require('../MultiSelect-5b008b32.js');
12
12
  var Radio = require('../Radio-0594409d.js');
13
- var TextArea = require('../TextArea-6dad1bbe.js');
13
+ var TextArea = require('../TextArea-76e2ff1e.js');
14
14
  var TextInput = require('../TextInput-a1083be3.js');
15
15
  var Switch = require('../Switch-cd165c8c.js');
16
16
  require('../defaultTheme-50f2b88f.js');
17
17
  require('styled-components');
18
18
  require('react');
19
- require('nanoid');
19
+ require('../Popover-cf1e9677.js');
20
20
  require('lodash');
21
+ require('polished');
22
+ require('@tippyjs/react');
23
+ require('../shift-away-subtle-cfdf1dbe.js');
24
+ require('../ContextMenu-d088833b.js');
25
+ require('../expand-more-94585605.js');
26
+ require('nanoid');
21
27
  require('react-select');
22
28
  require('../react-select-creatable.esm-2f23d6c6.js');
23
29
  require('react-dom');
24
30
  require('react-select-async-paginate');
25
31
  require('../close-ebf2f3cf.js');
26
- require('../expand-more-94585605.js');
27
- require('../Popover-11df9750.js');
28
- require('polished');
29
- require('@tippyjs/react');
30
- require('../shift-away-subtle-cfdf1dbe.js');
31
- require('../ContextMenu-d088833b.js');
32
+ require('../check-circle-filled-1640873e.js');
32
33
  require('../edit-note-c47d292e.js');
33
34
  require('../Alert-3e4f8be1.js');
34
35
  require('../Badge-9bcebe96.js');
@@ -39,9 +40,9 @@ require('../Tooltip-f4f9ab8f.js');
39
40
 
40
41
 
41
42
  exports.ActionButton = ActionButton.ActionButton;
42
- exports.AutocompleteSelect = AutocompleteSelect.AutocompleteSelect;
43
43
  exports.Button = Button.Button;
44
44
  exports.Checkbox = Checkbox.Checkbox;
45
+ exports.CompactAutocompleteSelect = CompactAutocompleteSelect.CompactAutocompleteSelect;
45
46
  exports.CompactStarRating = CompactStarRating.CompactStarRating;
46
47
  exports.CompactTextInput = CompactTextInput.CompactTextInput;
47
48
  exports.MultiSelect = MultiSelect.MultiSelect;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.1.0-beta.61",
3
+ "version": "1.1.0-beta.63",
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-c80b2a20.js');
3
+ var AssetGallery = require('../../AssetGallery-59ea0b08.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
@@ -11,22 +11,23 @@ require('../../edit-note-c47d292e.js');
11
11
  require('resize-observer-polyfill');
12
12
  require('react-lazy-load-image-component');
13
13
  require('../../ActionButton-c3f5ed94.js');
14
- require('../../AutocompleteSelect-57a324e3.js');
15
- require('react-select');
16
- require('../../react-select-creatable.esm-2f23d6c6.js');
17
- require('react-dom');
18
- require('react-select-async-paginate');
19
- require('../../close-ebf2f3cf.js');
20
- require('../../expand-more-94585605.js');
21
- require('../../Button-dd271c4b.js');
22
- require('../../Popover-11df9750.js');
14
+ require('../../Button-f893df21.js');
15
+ require('../../Popover-cf1e9677.js');
23
16
  require('polished');
24
17
  require('@tippyjs/react');
25
18
  require('../../shift-away-subtle-cfdf1dbe.js');
26
19
  require('../../ContextMenu-d088833b.js');
20
+ require('../../expand-more-94585605.js');
27
21
  require('../../Checkbox-012bbd3f.js');
28
- require('../../CompactStarRating-942afff1.js');
29
- require('../../CompactTextInput-e9c99aa3.js');
22
+ require('../../CompactAutocompleteSelect-0160cb3e.js');
23
+ require('react-select');
24
+ require('../../react-select-creatable.esm-2f23d6c6.js');
25
+ require('react-dom');
26
+ require('react-select-async-paginate');
27
+ require('../../close-ebf2f3cf.js');
28
+ require('../../check-circle-filled-1640873e.js');
29
+ require('../../CompactStarRating-9c4c4f2c.js');
30
+ require('../../CompactTextInput-d2fabaf5.js');
30
31
  require('../../Alert-3e4f8be1.js');
31
32
  require('../../Badge-9bcebe96.js');
32
33
  require('../../Tab-bd0f3345.js');
@@ -34,7 +35,7 @@ require('../../Tabs-cfc35dc0.js');
34
35
  require('../../Tooltip-f4f9ab8f.js');
35
36
  require('../../MultiSelect-5b008b32.js');
36
37
  require('../../Radio-0594409d.js');
37
- require('../../TextArea-6dad1bbe.js');
38
+ require('../../TextArea-76e2ff1e.js');
38
39
  require('../../Switch-cd165c8c.js');
39
40
  require('../../warning-circle-24522402.js');
40
41
 
@@ -1,14 +1,15 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-e96905c7.js');
3
+ var Instructions = require('../../Instructions-3be0c5c8.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
- require('../../TextArea-6dad1bbe.js');
7
+ require('../../TextArea-76e2ff1e.js');
8
8
  require('nanoid');
9
9
  require('lodash');
10
10
  require('../../edit-note-c47d292e.js');
11
- require('../../AutocompleteSelect-57a324e3.js');
11
+ require('../../check-circle-filled-1640873e.js');
12
+ require('../../CompactAutocompleteSelect-0160cb3e.js');
12
13
  require('react-select');
13
14
  require('../../react-select-creatable.esm-2f23d6c6.js');
14
15
  require('react-dom');
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-c80b2a20.js');
5
+ var AssetGallery = require('../AssetGallery-59ea0b08.js');
6
6
  var ContextMenu = require('../ContextMenu-d088833b.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-449e6019.js');
8
- var Instructions = require('../Instructions-e96905c7.js');
8
+ var Instructions = require('../Instructions-3be0c5c8.js');
9
9
  require('../defaultTheme-50f2b88f.js');
10
10
  require('styled-components');
11
11
  require('react');
@@ -16,21 +16,22 @@ require('../edit-note-c47d292e.js');
16
16
  require('resize-observer-polyfill');
17
17
  require('react-lazy-load-image-component');
18
18
  require('../ActionButton-c3f5ed94.js');
19
- require('../AutocompleteSelect-57a324e3.js');
19
+ require('../Button-f893df21.js');
20
+ require('../Popover-cf1e9677.js');
21
+ require('polished');
22
+ require('@tippyjs/react');
23
+ require('../shift-away-subtle-cfdf1dbe.js');
24
+ require('../expand-more-94585605.js');
25
+ require('../Checkbox-012bbd3f.js');
26
+ require('../CompactAutocompleteSelect-0160cb3e.js');
20
27
  require('react-select');
21
28
  require('../react-select-creatable.esm-2f23d6c6.js');
22
29
  require('react-dom');
23
30
  require('react-select-async-paginate');
24
31
  require('../close-ebf2f3cf.js');
25
- require('../expand-more-94585605.js');
26
- require('../Button-dd271c4b.js');
27
- require('../Popover-11df9750.js');
28
- require('polished');
29
- require('@tippyjs/react');
30
- require('../shift-away-subtle-cfdf1dbe.js');
31
- require('../Checkbox-012bbd3f.js');
32
- require('../CompactStarRating-942afff1.js');
33
- require('../CompactTextInput-e9c99aa3.js');
32
+ require('../check-circle-filled-1640873e.js');
33
+ require('../CompactStarRating-9c4c4f2c.js');
34
+ require('../CompactTextInput-d2fabaf5.js');
34
35
  require('../Alert-3e4f8be1.js');
35
36
  require('../Badge-9bcebe96.js');
36
37
  require('../Tab-bd0f3345.js');
@@ -38,7 +39,7 @@ require('../Tabs-cfc35dc0.js');
38
39
  require('../Tooltip-f4f9ab8f.js');
39
40
  require('../MultiSelect-5b008b32.js');
40
41
  require('../Radio-0594409d.js');
41
- require('../TextArea-6dad1bbe.js');
42
+ require('../TextArea-76e2ff1e.js');
42
43
  require('../Switch-cd165c8c.js');
43
44
  require('../warning-circle-24522402.js');
44
45