@ntbjs/react-components 1.1.1 → 1.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/{ActionButton-c3f5ed94.js → ActionButton-06df3d6c.js} +15 -5
  2. package/Alert-13b75102.js +117 -0
  3. package/AssetGallery-d5e4f7a6.js +1857 -0
  4. package/{AssetPreviewTopBar-449e6019.js → AssetPreviewTopBar-c28715f7.js} +15 -15
  5. package/Badge-aec841c8.js +221 -0
  6. package/{Button-432f87c6.js → Button-49f82b31.js} +3 -3
  7. package/{Checkbox-d80544d6.js → Checkbox-68dc38a8.js} +13 -8
  8. package/{CompactAutocompleteSelect-0c08a1aa.js → CompactAutocompleteSelect-87c8c7e7.js} +121 -90
  9. package/{CompactStarRating-77f54a07.js → CompactStarRating-1aedbcf4.js} +103 -66
  10. package/{CompactTextInput-8750600d.js → CompactTextInput-aafb1a17.js} +88 -61
  11. package/{ContextMenu-d088833b.js → ContextMenu-4ec3d9f3.js} +1 -1
  12. package/ContextMenuItem-1fe17ed5.js +110 -0
  13. package/{InputGroup-09ce9572.js → InputGroup-49fbc423.js} +1 -1
  14. package/{Instructions-ed68e52f.js → Instructions-b9f2e184.js} +27 -14
  15. package/MultiLevelCheckboxSelect-eeb5dcef.js +698 -0
  16. package/{MultiSelect-abf02057.js → MultiSelect-4b8d3d0d.js} +2 -2
  17. package/{Popover-d3a4b72e.js → Popover-569cd272.js} +33 -7
  18. package/{Radio-70259f02.js → Radio-32d0513a.js} +1 -1
  19. package/{SectionSeparator-225719cd.js → SectionSeparator-259a22ed.js} +1 -1
  20. package/{Switch-a7cbb0c0.js → Switch-4a41585f.js} +1 -1
  21. package/{Tab-9936ddea.js → Tab-f499ecbc.js} +1 -1
  22. package/{Tabs-93f6362c.js → Tabs-4d7742bc.js} +8 -38
  23. package/TextArea-229e7abb.js +435 -0
  24. package/{TextInput-c0ef017d.js → TextInput-0d109708.js} +1 -1
  25. package/{Tooltip-1b7b0052.js → Tooltip-66daf6e3.js} +4 -4
  26. package/VerificationStatusIcon-b574fd21.js +106 -0
  27. package/data/Alert/index.js +3 -2
  28. package/data/Badge/index.js +2 -2
  29. package/data/Popover/index.js +4 -3
  30. package/data/Tab/index.js +2 -2
  31. package/data/Tabs/index.js +3 -3
  32. package/data/Tooltip/index.js +3 -3
  33. package/data/index.js +11 -8
  34. package/{defaultTheme-50f2b88f.js → defaultTheme-ea44e34a.js} +59 -1
  35. package/icons/add.svg +3 -0
  36. package/icons/album.svg +3 -0
  37. package/icons/check-rectangle-filled.svg +3 -0
  38. package/icons/corporate.svg +3 -0
  39. package/icons/download.svg +3 -3
  40. package/icons/index.js +77 -0
  41. package/icons/layers.svg +3 -0
  42. package/icons/play.svg +3 -3
  43. package/icons/shopping_cart_add.svg +3 -0
  44. package/icons/verification.svg +3 -0
  45. package/inputs/ActionButton/index.js +3 -2
  46. package/inputs/Button/index.js +6 -5
  47. package/inputs/Checkbox/index.js +2 -2
  48. package/inputs/CompactAutocompleteSelect/index.js +14 -4
  49. package/inputs/CompactStarRating/index.js +14 -3
  50. package/inputs/CompactTextInput/index.js +11 -10
  51. package/inputs/MultiSelect/index.js +3 -3
  52. package/inputs/Radio/index.js +2 -2
  53. package/inputs/Switch/index.js +2 -2
  54. package/inputs/TextArea/index.js +14 -3
  55. package/inputs/TextInput/index.js +2 -2
  56. package/inputs/index.js +29 -23
  57. package/layout/InputGroup/index.js +2 -2
  58. package/layout/SectionSeparator/index.js +2 -2
  59. package/layout/index.js +3 -3
  60. package/package.json +2 -1
  61. package/{react-select-creatable.esm-c4ae6839.js → react-select-creatable.esm-2f23d6c6.js} +8 -15
  62. package/{shift-away-subtle-cfdf1dbe.js → shift-away-subtle-0bed9a3c.js} +1 -1
  63. package/styles/config.scss +3 -1
  64. package/widgets/AssetGallery/index.js +34 -29
  65. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +2 -2
  66. package/widgets/ContextMenu/ContextMenuItem/index.js +5 -105
  67. package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +1 -1
  68. package/widgets/ContextMenu/index.js +2 -2
  69. package/widgets/Instructions/index.js +16 -6
  70. package/widgets/index.js +37 -31
  71. package/Alert-3e4f8be1.js +0 -62
  72. package/AssetGallery-f01f30eb.js +0 -1397
  73. package/Badge-9461fc7f.js +0 -154
  74. package/TextArea-1ed790e5.js +0 -340
  75. package/check-555d831b.js +0 -213
@@ -1,14 +1,20 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-50f2b88f.js');
3
+ var defaultTheme = require('./defaultTheme-ea44e34a.js');
4
4
  var lodash = require('lodash');
5
5
  var nanoid = require('nanoid');
6
6
  var React = require('react');
7
- var check = require('./check-555d831b.js');
7
+ require('./Alert-13b75102.js');
8
+ require('./Badge-aec841c8.js');
9
+ require('./Popover-569cd272.js');
10
+ require('./Tab-f499ecbc.js');
11
+ require('./Tabs-4d7742bc.js');
12
+ var Tooltip = require('./Tooltip-66daf6e3.js');
13
+ require('./VerificationStatusIcon-b574fd21.js');
8
14
  var styled = require('styled-components');
9
15
  var Select = require('react-select');
10
16
  var reactSelectAsyncPaginate = require('react-select-async-paginate');
11
- var reactSelectCreatable_esm = require('./react-select-creatable.esm-c4ae6839.js');
17
+ var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js');
12
18
  var close = require('./close-ebf2f3cf.js');
13
19
  var expandMore = require('./expand-more-94585605.js');
14
20
 
@@ -73,30 +79,36 @@ var AutocompletSelect = styled__default['default'](Select__default['default']).a
73
79
  var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n"])), sharedStyle, function (props) {
74
80
  return props.disabled && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
75
81
  });
76
- var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 2.5px 0 8px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n ", "\n\n ", ";\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
82
+ var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n\n height: 22px;\n min-height: 22px;\n box-shadow: none;\n box-sizing: border-box;\n padding: 1px 3px 0 8.7px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n ", "\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", "\n ", "\n ", "\n }\n\n & .dropdown-indicator {\n display: none;\n }\n\n &:hover .dropdown-indicator {\n display: flex;\n }\n\n &&:hover {\n border-color: transparent;\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n }\n"])), function (props) {
77
83
  return props.edit && props.theme.themeProp('background', '#505050', '#eff1f4');
78
84
  }, function (props) {
79
- return props.state && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
80
- return props.state === 'success' ? fadeIn : fadeOut;
85
+ return props.type && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n animation: ", " 0.5s ease-in-out;\n "])), function (props) {
86
+ return props.type === 'success' ? fadeIn : fadeOut;
81
87
  });
82
88
  }, function (props) {
83
- return props.state === 'warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C');
89
+ return props.type === 'warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFFDE8');
84
90
  }, function (props) {
85
- return props.state === 'error' && !props.isFocused && props.theme.themeProp('background-color', '#7f1b1b', '#fbeae6');
91
+ return props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C');
86
92
  }, function (props) {
87
- return props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600'));
93
+ return props.type === 'instructions-warning' && props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C');
88
94
  }, function (props) {
89
- return props.state === 'warning' && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('signal-yellow-500'), props.theme.getColor('signal-yellow-500'));
95
+ return props.type === 'error' && !props.isFocused && props.theme.themeProp('background-color', '#7f1b1b', '#FBEAE6');
90
96
  }, function (props) {
91
- return props.state === 'error' && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('red-500'), props.theme.getColor('red-500'));
97
+ return props.isFocused && !props.type === 'instructions-warning' && props.theme.themeProp('border-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600'));
98
+ }, function (props) {
99
+ return props.type === 'warning' && props.isFocused && props.theme.themeProp('border-color', '#F4E21E', '#F4E21E');
100
+ }, function (props) {
101
+ return props.type === 'error' && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('red-500'), props.theme.getColor('red-500'));
92
102
  }, function (props) {
93
103
  return !props.isFocused && props.theme.themeProp('background-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'));
94
104
  }, function (props) {
95
- return props.state === 'warning' && !props.isFocused && props.theme.themeProp('background', '#816600', '#F4E21E');
105
+ return props.type === 'warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#FFFEBF');
96
106
  }, function (props) {
97
- return props.state === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
107
+ return props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#F4E21E');
108
+ }, function (props) {
109
+ return props.type === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
98
110
  });
99
- var Option$1 = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = 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) {
111
+ var Option = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = 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) {
100
112
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
101
113
  }, function (props) {
102
114
  return props.isFocused && styled.css(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
@@ -106,11 +118,11 @@ var Option$1 = styled__default['default'](Select.components.Option).attrs(defaul
106
118
  return props.isFocused && props.isSelected && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
107
119
  });
108
120
  var Placeholder = styled__default['default'](Select.components.Placeholder).attrs(defaultTheme.applyDefaultTheme)(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", "\n ", ";\n }\n"])), function (props) {
109
- return (props.state === 'error' || props.state === 'warning') && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
121
+ return (props.type === 'error' || props.type === 'warning') && styled.css(_templateObject30 || (_templateObject30 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
110
122
  }, function (props) {
111
- return (props.state === 'error' || props.state === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6');
123
+ return (props.type === 'error' || props.type === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6');
112
124
  });
113
- var SingleValue$1 = styled__default['default'](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
125
+ var SingleValue = styled__default['default'](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
114
126
  return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
115
127
  });
116
128
  var Input = styled__default['default'](Select.components.Input).attrs(defaultTheme.applyDefaultTheme)(_templateObject32 || (_templateObject32 = defaultTheme._taggedTemplateLiteral(["\n && {\n margin: 0;\n padding: 0;\n padding-left: 2px;\n ", "\n }\n"])), function (props) {
@@ -120,12 +132,12 @@ var Menu = styled__default['default'](Select.components.Menu).attrs(defaultTheme
120
132
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
121
133
  });
122
134
  var ValueContainer = styled__default['default'](Select.components.ValueContainer).attrs(defaultTheme.applyDefaultTheme)(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n && {\n padding: 0;\n }\n"])));
123
- var ClearIndicator$1 = styled__default['default'](Select.components.ClearIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n cursor: pointer;\n ", ";\n }\n"])), function (props) {
135
+ var ClearIndicator = styled__default['default'](Select.components.ClearIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject35 || (_templateObject35 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n padding: 0;\n cursor: pointer;\n ", ";\n }\n"])), function (props) {
124
136
  return props.isFocused ? 'flex' : 'none';
125
137
  }, function (props) {
126
138
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
127
139
  });
128
- var DropdownIndicator$1 = styled__default['default'](Select.components.DropdownIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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) {
140
+ var DropdownIndicator = styled__default['default'](Select.components.DropdownIndicator).attrs(defaultTheme.applyDefaultTheme)(_templateObject36 || (_templateObject36 = 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) {
129
141
  return props.isFocused ? 'flex' : 'none';
130
142
  }, function (props) {
131
143
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
@@ -134,7 +146,7 @@ var DropdownIndicatorIcon = styled__default['default'](expandMore.SvgExpandMore)
134
146
  var ClearIndicatorIcon = styled__default['default'](close.SvgClose).attrs(defaultTheme.applyDefaultTheme)(_templateObject38 || (_templateObject38 = defaultTheme._taggedTemplateLiteral(["\n width: 8px;\n margin-right: 4px;\n ", ";\n stroke-width: 2px;\n"])), function (props) {
135
147
  return props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
136
148
  });
137
- var IndicatorSeparator$1 = styled__default['default'](Select.components.IndicatorSeparator).attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n margin: 4px;\n ", ";\n }\n"])), function (props) {
149
+ var IndicatorSeparator = styled__default['default'](Select.components.IndicatorSeparator).attrs(defaultTheme.applyDefaultTheme)(_templateObject39 || (_templateObject39 = defaultTheme._taggedTemplateLiteral(["\n && {\n display: ", ";\n margin: 4px;\n ", ";\n }\n"])), function (props) {
138
150
  return props.isFocused ? 'flex' : 'none';
139
151
  }, function (props) {
140
152
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
@@ -155,8 +167,11 @@ var CompactAutocompleteSelect = React__default['default'].forwardRef(function Co
155
167
  edit = _ref.edit,
156
168
  disabled = _ref.disabled,
157
169
  hidden = _ref.hidden,
158
- state = _ref.state,
159
- props = defaultTheme._objectWithoutProperties(_ref, ["label", "availableOptions", "placeholder", "selectedOption", "loadOptions", "noOptionsMessageFunc", "createNewOptionMessageFunc", "onUpdateCallback", "loadingMessageFunc", "creatable", "readOnly", "edit", "disabled", "hidden", "state"]);
170
+ type = _ref.type,
171
+ descriptionToolTip = _ref.descriptionToolTip,
172
+ loadingIcon = _ref.loadingIcon,
173
+ successIcon = _ref.successIcon,
174
+ props = defaultTheme._objectWithoutProperties(_ref, ["label", "availableOptions", "placeholder", "selectedOption", "loadOptions", "noOptionsMessageFunc", "createNewOptionMessageFunc", "onUpdateCallback", "loadingMessageFunc", "creatable", "readOnly", "edit", "disabled", "hidden", "type", "descriptionToolTip", "loadingIcon", "successIcon"]);
160
175
 
161
176
  var _useState = React.useState(nanoid.nanoid()),
162
177
  _useState2 = defaultTheme._slicedToArray(_useState, 1),
@@ -177,24 +192,28 @@ var CompactAutocompleteSelect = React__default['default'].forwardRef(function Co
177
192
  cacheUnique = _useState8[0],
178
193
  setCacheUnique = _useState8[1];
179
194
 
195
+ var memoizedDescriptionToolTip = React.useMemo(function () {
196
+ return descriptionToolTip;
197
+ }, [descriptionToolTip]);
198
+
180
199
  var Control$1 = function Control$1(props) {
181
200
  return React__default['default'].createElement(Control, defaultTheme._extends({
182
201
  className: "select-control",
183
202
  edit: edit,
184
- state: state
203
+ type: type
185
204
  }, props));
186
205
  };
187
206
 
188
207
  var ValueContainer$1 = React.useMemo(function () {
189
208
  var valueContainer = function valueContainer(props) {
190
209
  return React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(ValueContainer, defaultTheme._extends({
191
- state: state
210
+ type: type
192
211
  }, props)));
193
212
  };
194
213
 
195
214
  valueContainer.displayName = 'ValueContainerWrapper';
196
215
  return valueContainer;
197
- }, [state]);
216
+ }, [type]);
198
217
  var Input$1 = React.useMemo(function () {
199
218
  var selectInput = function selectInput(props) {
200
219
  return React__default['default'].createElement(Input, defaultTheme._extends({
@@ -219,18 +238,58 @@ var CompactAutocompleteSelect = React__default['default'].forwardRef(function Co
219
238
  var Placeholder$1 = function Placeholder$1(props) {
220
239
  return React__default['default'].createElement(Placeholder, defaultTheme._extends({
221
240
  className: "select-placeholder",
222
- state: state
241
+ type: type
242
+ }, props));
243
+ };
244
+
245
+ var Option$1 = function Option$1(props) {
246
+ return !props.data.link ? React__default['default'].createElement(Option, defaultTheme._extends({
247
+ className: "menu-item"
248
+ }, props)) : React__default['default'].createElement(Option, props, React__default['default'].createElement("a", {
249
+ href: props.data.link
250
+ }, props.data.icon, props.label));
251
+ };
252
+
253
+ var SingleValue$1 = function SingleValue$1(props) {
254
+ return React__default['default'].createElement(SingleValue, defaultTheme._extends({
255
+ className: "menu-value"
256
+ }, props));
257
+ };
258
+
259
+ Option$1.propTypes = process.env.NODE_ENV !== "production" ? {
260
+ data: defaultTheme.PropTypes.shape({
261
+ icon: defaultTheme.PropTypes.node,
262
+ link: defaultTheme.PropTypes.string
263
+ }),
264
+ label: defaultTheme.PropTypes.string
265
+ } : {};
266
+
267
+ var DropdownIndicator$1 = function DropdownIndicator$1(props) {
268
+ return React__default['default'].createElement(DropdownIndicator, defaultTheme._extends({
269
+ className: "dropdown-indicator"
270
+ }, props), React__default['default'].createElement(DropdownIndicatorIcon, null));
271
+ };
272
+
273
+ var ClearIndicator$1 = function ClearIndicator$1(props) {
274
+ return React__default['default'].createElement(ClearIndicator, defaultTheme._extends({
275
+ className: "clear-indicator"
276
+ }, props), React__default['default'].createElement(ClearIndicatorIcon, null));
277
+ };
278
+
279
+ var IndicatorSeparator$1 = function IndicatorSeparator$1(props) {
280
+ return React__default['default'].createElement(IndicatorSeparator, defaultTheme._extends({
281
+ className: "indicator-separator"
223
282
  }, props));
224
283
  };
225
284
 
226
285
  var innerComponents = {
227
286
  Control: Control$1,
228
287
  ValueContainer: ValueContainer$1,
229
- DropdownIndicator: DropdownIndicator,
230
- IndicatorSeparator: IndicatorSeparator,
231
- ClearIndicator: ClearIndicator,
232
- Option: Option,
233
- SingleValue: SingleValue,
288
+ DropdownIndicator: DropdownIndicator$1,
289
+ IndicatorSeparator: IndicatorSeparator$1,
290
+ ClearIndicator: ClearIndicator$1,
291
+ Option: Option$1,
292
+ SingleValue: SingleValue$1,
234
293
  Input: Input$1,
235
294
  Placeholder: Placeholder$1,
236
295
  Menu: Menu$1
@@ -320,23 +379,31 @@ var CompactAutocompleteSelect = React__default['default'].forwardRef(function Co
320
379
  }
321
380
  };
322
381
  if (hidden) return null;
323
- return React__default['default'].createElement(CompactAutocompleteSelect$1, {
324
- disabled: disabled
325
- }, React__default['default'].createElement(InputContainer, null, label && React__default['default'].createElement(Label, {
326
- htmlFor: uniqueId,
327
- disabled: disabled
328
- }, label, React__default['default'].createElement(SuccessContainer, null, state === 'loading' && React__default['default'].createElement(check._default, {
329
- color: '#b0b6b9',
330
- size: 15
331
- }), state === 'success' && React__default['default'].createElement(check.SvgCheck, null))), loadOptions ? creatable ? React__default['default'].createElement(AsyncCreatableAutocompleteSelect, defaultTheme._extends({
332
- $hasLabel: !lodash.isEmpty(label)
333
- }, sharedSelectProps, props)) : React__default['default'].createElement(AsyncAutocompleteSelect, defaultTheme._extends({
334
- $hasLabel: !lodash.isEmpty(label)
335
- }, sharedSelectProps, props)) : creatable ? React__default['default'].createElement(AutocompletCreatableSelect, defaultTheme._extends({
336
- $hasLabel: !lodash.isEmpty(label)
337
- }, sharedSelectProps, props)) : React__default['default'].createElement(AutocompletSelect, defaultTheme._extends({
338
- $hasLabel: !lodash.isEmpty(label)
339
- }, sharedSelectProps, props))));
382
+
383
+ var input = function input() {
384
+ return React__default['default'].createElement(CompactAutocompleteSelect$1, {
385
+ disabled: disabled
386
+ }, React__default['default'].createElement(InputContainer, null, label && React__default['default'].createElement(Label, {
387
+ htmlFor: uniqueId,
388
+ disabled: disabled
389
+ }, label, React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), loadOptions ? creatable ? React__default['default'].createElement(AsyncCreatableAutocompleteSelect, defaultTheme._extends({
390
+ $hasLabel: !lodash.isEmpty(label)
391
+ }, sharedSelectProps, props)) : React__default['default'].createElement(AsyncAutocompleteSelect, defaultTheme._extends({
392
+ $hasLabel: !lodash.isEmpty(label)
393
+ }, sharedSelectProps, props)) : creatable ? React__default['default'].createElement(AutocompletCreatableSelect, defaultTheme._extends({
394
+ $hasLabel: !lodash.isEmpty(label)
395
+ }, sharedSelectProps, props)) : React__default['default'].createElement(AutocompletSelect, defaultTheme._extends({
396
+ $hasLabel: !lodash.isEmpty(label)
397
+ }, sharedSelectProps, props))));
398
+ };
399
+
400
+ return React__default['default'].createElement(React__default['default'].Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default['default'].createElement("div", null, React__default['default'].createElement(Tooltip.Tooltip, {
401
+ content: memoizedDescriptionToolTip,
402
+ key: "tooltipTextArea1",
403
+ placement: "bottom-end",
404
+ trigger: 'mouseenter',
405
+ zIndex: 999999
406
+ }, input())));
340
407
  });
341
408
  CompactAutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
342
409
  label: defaultTheme.PropTypes.string,
@@ -355,7 +422,10 @@ CompactAutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
355
422
  onUpdateCallback: defaultTheme.PropTypes.func,
356
423
  creatable: defaultTheme.PropTypes.bool,
357
424
  disabled: defaultTheme.PropTypes.bool,
358
- state: defaultTheme.PropTypes.oneOf(['', 'error', 'warning', 'loading', 'success'])
425
+ type: defaultTheme.PropTypes.oneOf(['', 'error', 'warning', 'instructions-warning', 'loading', 'success']),
426
+ descriptionToolTip: defaultTheme.PropTypes.string,
427
+ loadingIcon: defaultTheme.PropTypes.element,
428
+ successIcon: defaultTheme.PropTypes.element
359
429
  } : {};
360
430
  CompactAutocompleteSelect.defaultProps = {
361
431
  noOptionsMessageFunc: function noOptionsMessageFunc(inputValue) {
@@ -372,47 +442,8 @@ CompactAutocompleteSelect.defaultProps = {
372
442
  error: false,
373
443
  warning: false,
374
444
  hidden: false,
375
- state: ''
376
- };
377
-
378
- var Option = function Option(props) {
379
- return !props.data.link ? React__default['default'].createElement(Option$1, defaultTheme._extends({
380
- className: "menu-item"
381
- }, props)) : React__default['default'].createElement(Option$1, props, React__default['default'].createElement("a", {
382
- href: props.data.link
383
- }, props.data.icon, props.label));
384
- };
385
-
386
- var SingleValue = function SingleValue(props) {
387
- return React__default['default'].createElement(SingleValue$1, defaultTheme._extends({
388
- className: "menu-value"
389
- }, props));
390
- };
391
-
392
- Option.propTypes = process.env.NODE_ENV !== "production" ? {
393
- data: defaultTheme.PropTypes.shape({
394
- icon: defaultTheme.PropTypes.node,
395
- link: defaultTheme.PropTypes.string
396
- }),
397
- label: defaultTheme.PropTypes.string
398
- } : {};
399
-
400
- var DropdownIndicator = function DropdownIndicator(props) {
401
- return React__default['default'].createElement(DropdownIndicator$1, defaultTheme._extends({
402
- className: "dropdown-indicator"
403
- }, props), React__default['default'].createElement(DropdownIndicatorIcon, null));
404
- };
405
-
406
- var ClearIndicator = function ClearIndicator(props) {
407
- return React__default['default'].createElement(ClearIndicator$1, defaultTheme._extends({
408
- className: "clear-indicator"
409
- }, props), React__default['default'].createElement(ClearIndicatorIcon, null));
410
- };
411
-
412
- var IndicatorSeparator = function IndicatorSeparator(props) {
413
- return React__default['default'].createElement(IndicatorSeparator$1, defaultTheme._extends({
414
- className: "indicator-separator"
415
- }, props));
445
+ type: '',
446
+ descriptionToolTip: ''
416
447
  };
417
448
 
418
449
  exports.CompactAutocompleteSelect = CompactAutocompleteSelect;