@ntbjs/react-components 1.3.0-rc.59 → 1.3.0-rc.6-patch.1
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.
- package/.eslintrc +8 -7
- package/{ActionButton-b2345555.js → ActionButton-dea072f4.js} +16 -19
- package/{Alert-d69a3f95.js → Alert-347a66eb.js} +24 -20
- package/{AssetAction-9622c4f9.js → AssetGallery-f24a8bb1.js} +651 -606
- package/AssetPreviewTopBar-b64d4665.js +99 -0
- package/{Badge-e984e6f5.js → Badge-b5d734ce.js} +49 -28
- package/{Button-090fb526.js → Button-211d92ec.js} +85 -94
- package/{Checkbox-ad9c9e54.js → Checkbox-b6f6fabf.js} +35 -30
- package/{CompactAutocompleteSelect-26949125.js → CompactAutocompleteSelect-15a10abb.js} +114 -82
- package/{CompactStarRating-65bf27e5.js → CompactStarRating-821494e0.js} +94 -83
- package/{CompactTextInput-60edc635.js → CompactTextInput-ca8a67af.js} +106 -110
- package/{ContextMenu-4eb8fdc5.js → ContextMenu-d269f2b4.js} +6 -6
- package/{ContextMenuItem-c536b460.js → ContextMenuItem-960e1acf.js} +26 -22
- package/{InputGroup-a89a0ea3.js → InputGroup-b5ebae07.js} +6 -6
- package/{Instructions-dbd4514c.js → Instructions-6bfa0f6e.js} +81 -97
- package/{MultiLevelCheckboxSelect-3d5d5f2c.js → MultiLevelCheckboxSelect-b145322d.js} +164 -102
- package/{MultiSelect-cdfe6ffa.js → MultiSelect-b2459602.js} +101 -71
- package/{Popover-52d29ca6.js → Popover-ec433aaf.js} +40 -41
- package/{Radio-55db4781.js → Radio-2ab61f91.js} +22 -21
- package/{SectionSeparator-af8dc1ce.js → SectionSeparator-a28c6af2.js} +6 -6
- package/{Switch-04ecd8d0.js → Switch-e3289575.js} +27 -25
- package/{Tab-e43241f0.js → Tab-91278790.js} +7 -7
- package/{Tabs-cfc08c6b.js → Tabs-2a0f1d84.js} +43 -39
- package/{TextArea-44b4d3c4.js → TextArea-8c8757d9.js} +125 -93
- package/{TextInput-c3c71881.js → TextInput-4cac4342.js} +50 -48
- package/{Tooltip-a68a7e49.js → Tooltip-978b6cdd.js} +13 -13
- package/{VerificationStatusIcon-7b0e23fe.js → VerificationStatusIcon-ad0159e3.js} +30 -20
- package/{close-1751121a.js → close-ebf2f3cf.js} +12 -8
- package/data/Alert/index.js +2 -2
- package/data/Badge/index.js +2 -2
- package/data/Popover/index.js +3 -3
- package/data/Tab/index.js +2 -2
- package/data/Tabs/index.js +3 -3
- package/data/Tooltip/index.js +3 -3
- package/data/index.js +9 -9
- package/{defaultTheme-cd01e6c2.js → defaultTheme-44832997.js} +261 -213
- package/edit-note-c47d292e.js +41 -0
- package/{expand-more-d74e2bd2.js → expand-more-94585605.js} +12 -8
- package/inputs/ActionButton/index.js +2 -2
- package/inputs/Button/index.js +6 -6
- package/inputs/Checkbox/index.js +2 -2
- package/inputs/CompactAutocompleteSelect/index.js +13 -13
- package/inputs/CompactStarRating/index.js +10 -10
- package/inputs/CompactTextInput/index.js +11 -11
- package/inputs/MultiSelect/index.js +4 -4
- package/inputs/Radio/index.js +2 -2
- package/inputs/Switch/index.js +2 -2
- package/inputs/TextArea/index.js +11 -11
- package/inputs/TextInput/index.js +3 -3
- package/inputs/index.js +28 -28
- package/layout/InputGroup/index.js +2 -2
- package/layout/SectionSeparator/index.js +2 -2
- package/layout/index.js +3 -3
- package/package.json +1 -2
- package/{react-select-creatable.esm-383b1e78.js → react-select-creatable.esm-2f23d6c6.js} +1285 -1414
- package/{shift-away-subtle-631cd794.js → shift-away-subtle-22739ae8.js} +1 -1
- package/ssr/index.js +3 -1
- package/styles/config.scss +2 -2
- package/warning-circle-24522402.js +41 -0
- package/widgets/AssetGallery/index.js +32 -34
- package/widgets/AssetPreview/AssetPreviewTopBar/index.js +3 -3
- package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
- package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +6 -6
- package/widgets/ContextMenu/index.js +2 -2
- package/widgets/Instructions/index.js +17 -16
- package/widgets/index.js +35 -37
- package/AssetPreviewTopBar-b1fe3188.js +0 -104
- package/edit-note-cefe2215.js +0 -37
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-44832997.js');
|
|
4
4
|
var lodash = require('lodash');
|
|
5
5
|
var nanoid = require('nanoid');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
require('./Alert-
|
|
8
|
-
require('./Badge-
|
|
9
|
-
require('./Popover-
|
|
10
|
-
require('./Tab-
|
|
11
|
-
require('./Tabs-
|
|
12
|
-
var Tooltip = require('./Tooltip-
|
|
13
|
-
require('./VerificationStatusIcon-
|
|
7
|
+
require('./Alert-347a66eb.js');
|
|
8
|
+
require('./Badge-b5d734ce.js');
|
|
9
|
+
require('./Popover-ec433aaf.js');
|
|
10
|
+
require('./Tab-91278790.js');
|
|
11
|
+
require('./Tabs-2a0f1d84.js');
|
|
12
|
+
var Tooltip = require('./Tooltip-978b6cdd.js');
|
|
13
|
+
require('./VerificationStatusIcon-ad0159e3.js');
|
|
14
14
|
var styled = require('styled-components');
|
|
15
15
|
var Select = require('react-select');
|
|
16
16
|
var reactSelectAsyncPaginate = require('react-select-async-paginate');
|
|
17
|
-
var reactSelectCreatable_esm = require('./react-select-creatable.esm-
|
|
18
|
-
var close = require('./close-
|
|
19
|
-
var expandMore = require('./expand-more-
|
|
17
|
+
var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js');
|
|
18
|
+
var close = require('./close-ebf2f3cf.js');
|
|
19
|
+
var expandMore = require('./expand-more-94585605.js');
|
|
20
20
|
|
|
21
21
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
22
22
|
|
|
@@ -43,43 +43,43 @@ var sharedStyle = styled.css(_templateObject5 || (_templateObject5 = defaultThem
|
|
|
43
43
|
}, function (props) {
|
|
44
44
|
return props.$hasLabel ? '66.66%' : '100%';
|
|
45
45
|
});
|
|
46
|
-
var CompactAutocompleteSelect$1 = styled__default[
|
|
46
|
+
var CompactAutocompleteSelect$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 24px;\n font-family: ", ";\n ", "\n"])), function (props) {
|
|
47
47
|
return props.theme.primaryFontFamily;
|
|
48
48
|
}, function (props) {
|
|
49
49
|
return props.disabled && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
|
|
50
50
|
});
|
|
51
|
-
var Label = styled__default[
|
|
51
|
+
var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n height: 19px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 2px;\n ", "\n"])), function (props) {
|
|
52
52
|
return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
|
|
53
53
|
}, function (props) {
|
|
54
54
|
return props.disabled && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
|
|
55
55
|
});
|
|
56
|
-
var InputContainer = styled__default[
|
|
57
|
-
var SuccessContainer = styled__default[
|
|
56
|
+
var InputContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n width: 100%;\n height: 19px;\n"])));
|
|
57
|
+
var SuccessContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n pointer-events: none;\n display: flex;\n opacity: ", ";\n animation: ", " 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n ", "\n > svg {\n width: 13px;\n }\n"])), function (props) {
|
|
58
58
|
return props.fadeIn ? 0 : 1;
|
|
59
59
|
}, function (props) {
|
|
60
60
|
return props.fadeIn ? fadeOutCheck : fadeInCheck;
|
|
61
61
|
}, function (props) {
|
|
62
62
|
return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'));
|
|
63
63
|
});
|
|
64
|
-
var AsyncCreatableAutocompleteSelect = styled__default[
|
|
64
|
+
var AsyncCreatableAutocompleteSelect = styled__default['default'](AsyncCreatableSelectPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover:not(:focus) {\n ", "\n }\n"])), sharedStyle, function (props) {
|
|
65
65
|
return props.disabled && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n "])));
|
|
66
66
|
}, function (props) {
|
|
67
67
|
return props.disabled && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed;\n "])));
|
|
68
68
|
});
|
|
69
|
-
var AsyncAutocompleteSelect = styled__default[
|
|
69
|
+
var AsyncAutocompleteSelect = styled__default['default'](reactSelectAsyncPaginate.AsyncPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover:not(:focus) {\n ", "\n }\n"])), sharedStyle, function (props) {
|
|
70
70
|
return props.disabled && styled.css(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
|
|
71
71
|
}, function (props) {
|
|
72
72
|
return props.disabled && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed;\n "])));
|
|
73
73
|
});
|
|
74
|
-
var AutocompletSelect = styled__default[
|
|
74
|
+
var AutocompletSelect = styled__default['default'](Select__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n &&:hover:not(:focus) {\n ", "\n }\n"])), sharedStyle, function (props) {
|
|
75
75
|
return props.disabled && styled.css(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
|
|
76
76
|
}, function (props) {
|
|
77
77
|
return props.disabled && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n background: none !important;\n cursor: not-allowed;\n "])));
|
|
78
78
|
});
|
|
79
|
-
var AutocompletCreatableSelect = styled__default[
|
|
79
|
+
var AutocompletCreatableSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n ", "\n"])), sharedStyle, function (props) {
|
|
80
80
|
return props.disabled && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n "])));
|
|
81
81
|
});
|
|
82
|
-
var Control = styled__default[
|
|
82
|
+
var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n && {\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) {
|
|
83
83
|
return props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)');
|
|
84
84
|
}, function (props) {
|
|
85
85
|
return props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)');
|
|
@@ -110,7 +110,7 @@ var Control = styled__default["default"](Select.components.Control).attrs(defaul
|
|
|
110
110
|
}, function (props) {
|
|
111
111
|
return props.type === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0');
|
|
112
112
|
});
|
|
113
|
-
var Option = styled__default[
|
|
113
|
+
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) {
|
|
114
114
|
return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
|
|
115
115
|
}, function (props) {
|
|
116
116
|
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')));
|
|
@@ -119,132 +119,145 @@ var Option = styled__default["default"](Select.components.Option).attrs(defaultT
|
|
|
119
119
|
}, function (props) {
|
|
120
120
|
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')));
|
|
121
121
|
});
|
|
122
|
-
var Placeholder = styled__default[
|
|
122
|
+
var Placeholder = styled__default['default'](Select.components.Placeholder).attrs(defaultTheme.applyDefaultTheme)(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", "\n ", ";\n }\n"])), function (props) {
|
|
123
123
|
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')));
|
|
124
124
|
}, function (props) {
|
|
125
125
|
return (props.type === 'error' || props.type === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6');
|
|
126
126
|
});
|
|
127
|
-
var SingleValue = styled__default[
|
|
127
|
+
var SingleValue = styled__default['default'](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject31 || (_templateObject31 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
|
|
128
128
|
return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
|
|
129
129
|
});
|
|
130
|
-
var Input = styled__default[
|
|
130
|
+
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) {
|
|
131
131
|
return props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'));
|
|
132
132
|
});
|
|
133
|
-
var Menu = styled__default[
|
|
133
|
+
var Menu = styled__default['default'](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)(_templateObject33 || (_templateObject33 = defaultTheme._taggedTemplateLiteral(["\n && {\n ", ";\n }\n"])), function (props) {
|
|
134
134
|
return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
|
|
135
135
|
});
|
|
136
|
-
var ValueContainer = styled__default[
|
|
137
|
-
var ClearIndicator = styled__default[
|
|
136
|
+
var ValueContainer = styled__default['default'](Select.components.ValueContainer).attrs(defaultTheme.applyDefaultTheme)(_templateObject34 || (_templateObject34 = defaultTheme._taggedTemplateLiteral(["\n && {\n padding: 0;\n }\n"])));
|
|
137
|
+
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) {
|
|
138
138
|
return props.isFocused ? 'flex' : 'none';
|
|
139
139
|
}, function (props) {
|
|
140
140
|
return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
|
|
141
141
|
});
|
|
142
|
-
var DropdownIndicator = styled__default[
|
|
142
|
+
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) {
|
|
143
143
|
return props.isFocused ? 'flex' : 'none';
|
|
144
144
|
}, function (props) {
|
|
145
145
|
return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
|
|
146
146
|
});
|
|
147
|
-
var DropdownIndicatorIcon = styled__default[
|
|
148
|
-
var ClearIndicatorIcon = styled__default[
|
|
147
|
+
var DropdownIndicatorIcon = styled__default['default'](expandMore.SvgExpandMore).attrs(defaultTheme.applyDefaultTheme)(_templateObject37 || (_templateObject37 = defaultTheme._taggedTemplateLiteral(["\n width: 12px;\n"])));
|
|
148
|
+
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) {
|
|
149
149
|
return props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
|
|
150
150
|
});
|
|
151
|
-
var IndicatorSeparator = styled__default[
|
|
151
|
+
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) {
|
|
152
152
|
return props.isFocused ? 'flex' : 'none';
|
|
153
153
|
}, function (props) {
|
|
154
154
|
return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
|
|
155
155
|
});
|
|
156
156
|
|
|
157
|
-
var
|
|
158
|
-
var CompactAutocompleteSelect = React__default["default"].forwardRef(function CompactAutocompleteSelect(_ref, forwardedRef) {
|
|
157
|
+
var CompactAutocompleteSelect = React__default['default'].forwardRef(function CompactAutocompleteSelect(_ref, forwardedRef) {
|
|
159
158
|
var label = _ref.label,
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
159
|
+
availableOptions = _ref.availableOptions,
|
|
160
|
+
placeholder = _ref.placeholder,
|
|
161
|
+
selectedOption = _ref.selectedOption,
|
|
162
|
+
loadOptions = _ref.loadOptions,
|
|
163
|
+
noOptionsMessageFunc = _ref.noOptionsMessageFunc,
|
|
164
|
+
createNewOptionMessageFunc = _ref.createNewOptionMessageFunc,
|
|
165
|
+
onUpdateCallback = _ref.onUpdateCallback,
|
|
166
|
+
loadingMessageFunc = _ref.loadingMessageFunc,
|
|
167
|
+
creatable = _ref.creatable,
|
|
168
|
+
readOnly = _ref.readOnly,
|
|
169
|
+
edit = _ref.edit,
|
|
170
|
+
disabled = _ref.disabled,
|
|
171
|
+
hidden = _ref.hidden,
|
|
172
|
+
type = _ref.type,
|
|
173
|
+
descriptionToolTip = _ref.descriptionToolTip,
|
|
174
|
+
loadingIcon = _ref.loadingIcon,
|
|
175
|
+
successIcon = _ref.successIcon,
|
|
176
|
+
props = defaultTheme._objectWithoutProperties(_ref, ["label", "availableOptions", "placeholder", "selectedOption", "loadOptions", "noOptionsMessageFunc", "createNewOptionMessageFunc", "onUpdateCallback", "loadingMessageFunc", "creatable", "readOnly", "edit", "disabled", "hidden", "type", "descriptionToolTip", "loadingIcon", "successIcon"]);
|
|
177
|
+
|
|
178
178
|
var _useState = React.useState(nanoid.nanoid()),
|
|
179
|
-
|
|
180
|
-
|
|
179
|
+
_useState2 = defaultTheme._slicedToArray(_useState, 1),
|
|
180
|
+
uniqueId = _useState2[0];
|
|
181
|
+
|
|
181
182
|
var _useState3 = React.useState(selectedOption),
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
183
|
+
_useState4 = defaultTheme._slicedToArray(_useState3, 2),
|
|
184
|
+
selected = _useState4[0],
|
|
185
|
+
setSelected = _useState4[1];
|
|
186
|
+
|
|
185
187
|
var _useState5 = React.useState(false),
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
188
|
+
_useState6 = defaultTheme._slicedToArray(_useState5, 2),
|
|
189
|
+
focused = _useState6[0],
|
|
190
|
+
setFocused = _useState6[1];
|
|
191
|
+
|
|
189
192
|
var _useState7 = React.useState(0),
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
+
_useState8 = defaultTheme._slicedToArray(_useState7, 2),
|
|
194
|
+
cacheUnique = _useState8[0],
|
|
195
|
+
setCacheUnique = _useState8[1];
|
|
196
|
+
|
|
193
197
|
var memoizedDescriptionToolTip = React.useMemo(function () {
|
|
194
198
|
return descriptionToolTip;
|
|
195
199
|
}, [descriptionToolTip]);
|
|
200
|
+
|
|
196
201
|
var Control$1 = function Control$1(props) {
|
|
197
|
-
return React__default[
|
|
202
|
+
return React__default['default'].createElement(Control, defaultTheme._extends({
|
|
198
203
|
className: "select-control",
|
|
199
204
|
edit: edit,
|
|
200
205
|
type: type
|
|
201
206
|
}, props));
|
|
202
207
|
};
|
|
208
|
+
|
|
203
209
|
var ValueContainer$1 = React.useMemo(function () {
|
|
204
210
|
var valueContainer = function valueContainer(props) {
|
|
205
|
-
return React__default[
|
|
211
|
+
return React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(ValueContainer, defaultTheme._extends({
|
|
206
212
|
type: type
|
|
207
213
|
}, props)));
|
|
208
214
|
};
|
|
215
|
+
|
|
209
216
|
valueContainer.displayName = 'ValueContainerWrapper';
|
|
210
217
|
return valueContainer;
|
|
211
218
|
}, [type]);
|
|
212
219
|
var Input$1 = React.useMemo(function () {
|
|
213
220
|
var selectInput = function selectInput(props) {
|
|
214
|
-
return React__default[
|
|
221
|
+
return React__default['default'].createElement(Input, defaultTheme._extends({
|
|
215
222
|
className: "select-input"
|
|
216
223
|
}, props));
|
|
217
224
|
};
|
|
225
|
+
|
|
218
226
|
selectInput.displayName = 'InputWrapper';
|
|
219
227
|
return selectInput;
|
|
220
228
|
}, []);
|
|
221
229
|
var Menu$1 = React.useMemo(function () {
|
|
222
230
|
var menu = function menu(props) {
|
|
223
|
-
return React__default[
|
|
231
|
+
return React__default['default'].createElement(Menu, defaultTheme._extends({
|
|
224
232
|
className: "select-menu"
|
|
225
233
|
}, props));
|
|
226
234
|
};
|
|
235
|
+
|
|
227
236
|
menu.displayName = 'MenuWrapper';
|
|
228
237
|
return menu;
|
|
229
238
|
}, []);
|
|
239
|
+
|
|
230
240
|
var Placeholder$1 = function Placeholder$1(props) {
|
|
231
|
-
return React__default[
|
|
241
|
+
return React__default['default'].createElement(Placeholder, defaultTheme._extends({
|
|
232
242
|
className: "select-placeholder",
|
|
233
243
|
type: type
|
|
234
244
|
}, props));
|
|
235
245
|
};
|
|
246
|
+
|
|
236
247
|
var Option$1 = function Option$1(props) {
|
|
237
|
-
return !props.data.link ? React__default[
|
|
248
|
+
return !props.data.link ? React__default['default'].createElement(Option, defaultTheme._extends({
|
|
238
249
|
className: "menu-item"
|
|
239
|
-
}, props)) : React__default[
|
|
250
|
+
}, props)) : React__default['default'].createElement(Option, props, React__default['default'].createElement("a", {
|
|
240
251
|
href: props.data.link
|
|
241
252
|
}, props.data.icon, props.label));
|
|
242
253
|
};
|
|
254
|
+
|
|
243
255
|
var SingleValue$1 = function SingleValue$1(props) {
|
|
244
|
-
return React__default[
|
|
256
|
+
return React__default['default'].createElement(SingleValue, defaultTheme._extends({
|
|
245
257
|
className: "menu-value"
|
|
246
258
|
}, props));
|
|
247
259
|
};
|
|
260
|
+
|
|
248
261
|
Option$1.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
249
262
|
data: defaultTheme.PropTypes.shape({
|
|
250
263
|
icon: defaultTheme.PropTypes.node,
|
|
@@ -252,21 +265,25 @@ var CompactAutocompleteSelect = React__default["default"].forwardRef(function Co
|
|
|
252
265
|
}),
|
|
253
266
|
label: defaultTheme.PropTypes.string
|
|
254
267
|
} : {};
|
|
268
|
+
|
|
255
269
|
var DropdownIndicator$1 = function DropdownIndicator$1(props) {
|
|
256
|
-
return React__default[
|
|
270
|
+
return React__default['default'].createElement(DropdownIndicator, defaultTheme._extends({
|
|
257
271
|
className: "dropdown-indicator"
|
|
258
|
-
}, props), React__default[
|
|
272
|
+
}, props), React__default['default'].createElement(DropdownIndicatorIcon, null));
|
|
259
273
|
};
|
|
274
|
+
|
|
260
275
|
var ClearIndicator$1 = function ClearIndicator$1(props) {
|
|
261
|
-
return React__default[
|
|
276
|
+
return React__default['default'].createElement(ClearIndicator, defaultTheme._extends({
|
|
262
277
|
className: "clear-indicator"
|
|
263
|
-
}, props), React__default[
|
|
278
|
+
}, props), React__default['default'].createElement(ClearIndicatorIcon, null));
|
|
264
279
|
};
|
|
280
|
+
|
|
265
281
|
var IndicatorSeparator$1 = function IndicatorSeparator$1(props) {
|
|
266
|
-
return React__default[
|
|
282
|
+
return React__default['default'].createElement(IndicatorSeparator, defaultTheme._extends({
|
|
267
283
|
className: "indicator-separator"
|
|
268
284
|
}, props));
|
|
269
285
|
};
|
|
286
|
+
|
|
270
287
|
var innerComponents = {
|
|
271
288
|
Control: Control$1,
|
|
272
289
|
ValueContainer: ValueContainer$1,
|
|
@@ -309,65 +326,80 @@ var CompactAutocompleteSelect = React__default["default"].forwardRef(function Co
|
|
|
309
326
|
if (onUpdateCallback) {
|
|
310
327
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
311
328
|
}
|
|
329
|
+
|
|
312
330
|
if (loadOptions) {
|
|
313
331
|
setCacheUnique(cacheUnique + 1);
|
|
314
332
|
}
|
|
333
|
+
|
|
315
334
|
setSelected(selected);
|
|
316
335
|
break;
|
|
336
|
+
|
|
317
337
|
case 'select-option':
|
|
318
338
|
if (onUpdateCallback) {
|
|
319
339
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
320
340
|
}
|
|
341
|
+
|
|
321
342
|
setSelected(selected);
|
|
322
343
|
break;
|
|
344
|
+
|
|
323
345
|
case 'remove-value':
|
|
324
346
|
if (onUpdateCallback) {
|
|
325
347
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
326
348
|
}
|
|
349
|
+
|
|
327
350
|
setSelected(selected);
|
|
328
351
|
break;
|
|
352
|
+
|
|
329
353
|
case 'pop-value':
|
|
330
354
|
if (onUpdateCallback) {
|
|
331
355
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
332
356
|
}
|
|
357
|
+
|
|
333
358
|
setSelected(selected);
|
|
334
359
|
break;
|
|
360
|
+
|
|
335
361
|
case 'deselect-option':
|
|
336
362
|
if (onUpdateCallback) {
|
|
337
363
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
338
364
|
}
|
|
365
|
+
|
|
339
366
|
setSelected(selected);
|
|
340
367
|
break;
|
|
368
|
+
|
|
341
369
|
case 'clear':
|
|
342
370
|
setSelected(selected);
|
|
343
371
|
break;
|
|
372
|
+
|
|
344
373
|
default:
|
|
345
374
|
if (onUpdateCallback) {
|
|
346
375
|
onUpdateCallback(actionMeta.action, selected.value);
|
|
347
376
|
}
|
|
377
|
+
|
|
348
378
|
setSelected(selected);
|
|
349
379
|
break;
|
|
350
380
|
}
|
|
351
381
|
}
|
|
352
382
|
};
|
|
353
383
|
if (hidden) return null;
|
|
384
|
+
|
|
354
385
|
var input = function input() {
|
|
355
|
-
return React__default[
|
|
386
|
+
return React__default['default'].createElement(CompactAutocompleteSelect$1, {
|
|
356
387
|
disabled: disabled
|
|
357
|
-
}, React__default[
|
|
388
|
+
}, React__default['default'].createElement(InputContainer, null, label && React__default['default'].createElement(Label, {
|
|
358
389
|
htmlFor: uniqueId,
|
|
359
390
|
disabled: disabled
|
|
360
|
-
}, label, React__default[
|
|
391
|
+
}, label, React__default['default'].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), loadOptions ? creatable ? React__default['default'].createElement(AsyncCreatableAutocompleteSelect, defaultTheme._extends({
|
|
361
392
|
$hasLabel: !lodash.isEmpty(label)
|
|
362
|
-
}, sharedSelectProps, props)) : React__default[
|
|
393
|
+
}, sharedSelectProps, props)) : React__default['default'].createElement(AsyncAutocompleteSelect, defaultTheme._extends({
|
|
363
394
|
$hasLabel: !lodash.isEmpty(label)
|
|
364
|
-
}, sharedSelectProps, props)) : creatable ? React__default[
|
|
395
|
+
}, sharedSelectProps, props)) : creatable ? React__default['default'].createElement(AutocompletCreatableSelect, defaultTheme._extends({
|
|
365
396
|
$hasLabel: !lodash.isEmpty(label)
|
|
366
|
-
}, sharedSelectProps, props)) : React__default[
|
|
397
|
+
}, sharedSelectProps, props)) : React__default['default'].createElement(AutocompletSelect, defaultTheme._extends({
|
|
367
398
|
$hasLabel: !lodash.isEmpty(label)
|
|
368
399
|
}, sharedSelectProps, props))));
|
|
369
400
|
};
|
|
370
|
-
|
|
401
|
+
|
|
402
|
+
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, {
|
|
371
403
|
content: memoizedDescriptionToolTip,
|
|
372
404
|
key: "tooltipTextArea1",
|
|
373
405
|
placement: "bottom-end",
|