@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,12 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-44832997.js');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var nanoid = require('nanoid');
|
|
6
6
|
var styled = require('styled-components');
|
|
7
|
-
var close = require('./close-
|
|
7
|
+
var close = require('./close-ebf2f3cf.js');
|
|
8
8
|
var Select = require('react-select');
|
|
9
|
-
var reactSelectCreatable_esm = require('./react-select-creatable.esm-
|
|
9
|
+
var reactSelectCreatable_esm = require('./react-select-creatable.esm-2f23d6c6.js');
|
|
10
10
|
var reactSelectAsyncPaginate = require('react-select-async-paginate');
|
|
11
11
|
|
|
12
12
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -21,26 +21,26 @@ var showMoreHeight = 114;
|
|
|
21
21
|
var sharedStyle = styled.css(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 12px;\n font-weight: 400;\n position: relative;\n"])), function (props) {
|
|
22
22
|
return props.theme.primaryFontFamily;
|
|
23
23
|
});
|
|
24
|
-
var Label = styled__default[
|
|
24
|
+
var Label = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n flex-basis: 33.33%;\n font-size: 0.875rem;\n line-height: 1rem;\n cursor: pointer;\n height: 19px;\n display: flex;\n align-items: center;\n"])), function (props) {
|
|
25
25
|
return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
|
|
26
26
|
});
|
|
27
|
-
var MultiSelect$1 = styled__default[
|
|
28
|
-
var CreatableMultiSelect = styled__default[
|
|
29
|
-
var AsyncCreatableMultiSelect = styled__default[
|
|
30
|
-
var AsyncMultiSelect = styled__default[
|
|
31
|
-
var MultiSelectWrapper = styled__default[
|
|
32
|
-
var Control = styled__default[
|
|
27
|
+
var MultiSelect$1 = styled__default['default'](Select__default['default']).attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
|
|
28
|
+
var CreatableMultiSelect = styled__default['default'](reactSelectCreatable_esm.CreatableSelect$1).attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
|
|
29
|
+
var AsyncCreatableMultiSelect = styled__default['default'](AsyncCreatableSelectPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
|
|
30
|
+
var AsyncMultiSelect = styled__default['default'](reactSelectAsyncPaginate.AsyncPaginate).attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedStyle);
|
|
31
|
+
var MultiSelectWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n"])));
|
|
32
|
+
var Control = styled__default['default'](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n && {\n align-items: flex-start;\n background: transparent;\n border: none;\n box-shadow: none;\n }\n\n :hover {\n cursor: ", ";\n }\n"])), function (props) {
|
|
33
33
|
return !props.isDisabled && props.focused || props.readOnly ? 'default' : 'pointer';
|
|
34
34
|
});
|
|
35
|
-
var ValueContainer = styled__default[
|
|
35
|
+
var ValueContainer = styled__default['default'](Select.components.ValueContainer)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n && {\n align-items: flex-start;\n gap: 8px;\n padding: 0;\n\n max-height: ", " !important;\n\n ", "\n }\n"])), function (props) {
|
|
36
36
|
return props.showMore ? props.error || props.warning ? '100%' : showMoreHeight + 16 + 'px' : '100%';
|
|
37
37
|
}, function (props) {
|
|
38
38
|
return (props.error || props.warning) && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n border: 1px solid;\n border-radius: 3px;\n padding: 4px;\n\n border-color: ", ";\n "])), function (props) {
|
|
39
39
|
return props.error ? props.theme.getColor('red-500') : props.warning ? props.theme.getColor('orange-500') : 'inherit';
|
|
40
40
|
});
|
|
41
41
|
});
|
|
42
|
-
var MultiValueWrapper = styled__default[
|
|
43
|
-
var MultiValue = styled__default[
|
|
42
|
+
var MultiValueWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n && {\n border-radius: 3px;\n margin: 0;\n }\n"])));
|
|
43
|
+
var MultiValue = styled__default['default'](Select.components.MultiValue).attrs(defaultTheme.applyDefaultTheme)(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n && {\n border-radius: 3px;\n margin: 0;\n\n ", "\n\n ", "\n\n > div {\n align-items: center;\n display: flex;\n font-size: 12px;\n min-height: 26px;\n\n :first-of-type {\n padding: ", ";\n }\n\n :last-child:not(:only-child) {\n padding: 0 8px 0 5px;\n height: 100%;\n width: fit-content;\n }\n\n :last-child:not(:only-child):hover {\n background-color: ", ";\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n cursor: pointer;\n }\n\n svg {\n stroke: white;\n stroke-width: 2px;\n width: 8px;\n }\n\n :hover {\n cursor: pointer;\n }\n }\n"])), function (props) {
|
|
44
44
|
return props.theme.themeProp('background-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-800'));
|
|
45
45
|
}, function (props) {
|
|
46
46
|
return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-100'));
|
|
@@ -49,8 +49,8 @@ var MultiValue = styled__default["default"](Select.components.MultiValue).attrs(
|
|
|
49
49
|
}, function (props) {
|
|
50
50
|
return props.theme.getColor('red-500');
|
|
51
51
|
});
|
|
52
|
-
var MultiValueRemove = styled__default[
|
|
53
|
-
var Input = styled__default[
|
|
52
|
+
var MultiValueRemove = styled__default['default'](Select.components.MultiValueRemove).attrs(defaultTheme.applyDefaultTheme)(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral([""])));
|
|
53
|
+
var Input = styled__default['default'](Select.components.Input).attrs(defaultTheme.applyDefaultTheme)(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n align-self: center;\n font-size: ", ";\n min-width: 150px;\n\n ", "\n\n ", "\n }\n"])), function (props) {
|
|
54
54
|
return props.$focused ? '14px' : '12px';
|
|
55
55
|
}, function (props) {
|
|
56
56
|
return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
|
|
@@ -61,7 +61,7 @@ var Input = styled__default["default"](Select.components.Input).attrs(defaultThe
|
|
|
61
61
|
return props.edittext;
|
|
62
62
|
});
|
|
63
63
|
});
|
|
64
|
-
var DropdownMenu = styled__default[
|
|
64
|
+
var DropdownMenu = styled__default['default'](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n font-size: 14px;\n\n ", "\n\n ", "\n"])), function (props) {
|
|
65
65
|
return props.theme.themeProp('background-color', props.theme.getColor('gray-600'), props.theme.getColor('white'));
|
|
66
66
|
}, function (props) {
|
|
67
67
|
return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
|
|
@@ -73,112 +73,124 @@ var sharedOptionStyle = styled.css(_templateObject17 || (_templateObject17 = def
|
|
|
73
73
|
}, function (props) {
|
|
74
74
|
return props.isFocused && props.isSelected && styled.css(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200')));
|
|
75
75
|
});
|
|
76
|
-
var Option = styled__default[
|
|
77
|
-
var SelectedOption$1 = styled__default[
|
|
78
|
-
var DropdownOptionDeleteIcon = styled__default[
|
|
76
|
+
var Option = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), sharedOptionStyle);
|
|
77
|
+
var SelectedOption$1 = styled__default['default'](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n ", "\n\n display: flex !important;\n justify-content: space-between;\n"])), sharedOptionStyle);
|
|
78
|
+
var DropdownOptionDeleteIcon = styled__default['default'](close.SvgClose).attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n stroke-width: 1px;\n width: 8px;\n\n ", "\n"])), function (props) {
|
|
79
79
|
return props.theme.themeProp('stroke', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'));
|
|
80
80
|
});
|
|
81
|
-
var ShowMoreWrapper = styled__default[
|
|
81
|
+
var ShowMoreWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n align-items: end;\n display: flex;\n flex-direction: column;\n height: 100%;\n left: 0;\n position: absolute;\n max-height: ", "px;\n top: 0;\n width: 100%;\n\n ", "\n\n :hover {\n cursor: pointer;\n text-decoration: underline;\n }\n"])), showMoreHeight + 16, function (props) {
|
|
82
82
|
return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('emerald-500'));
|
|
83
83
|
});
|
|
84
|
-
var ShowMoreOverlay = styled__default[
|
|
84
|
+
var ShowMoreOverlay = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n align-items: end;\n display: block;\n height: 100%;\n max-height: ", "px;\n left: 0;\n top: 0;\n width: 100%;\n\n ", "\n"])), showMoreHeight, function (props) {
|
|
85
85
|
return props.theme.themeProp('background', 'transparent linear-gradient(180deg, #12121200 0%, #12121230 40%, #12121279 70%, #121212 95%, #121212 100%) 0% 0% no-repeat padding-box', 'transparent linear-gradient(180deg, #fefefe00 0%, #fefefe30 40%, #fefefe79 70%, #fefefe 95%, #fefefe 100%) 0% 0% no-repeat padding-box');
|
|
86
86
|
});
|
|
87
|
-
var ShowMoreText = styled__default[
|
|
87
|
+
var ShowMoreText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n font-size: 0.875rem;\n width: 100%;\n ", "\n"])), function (props) {
|
|
88
88
|
return props.theme.themeProp('background-color', '#121212', '#fefefe');
|
|
89
89
|
});
|
|
90
|
-
var ErrorMessage = styled__default[
|
|
90
|
+
var ErrorMessage = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n color: ", ";\n font-size: 0.75rem;\n margin-top: 8px;\n padding: 0 12px;\n"])), function (props) {
|
|
91
91
|
return props.error ? props.theme.getColor('red-500') : props.warning ? props.theme.getColor('orange-500') : 'inherit';
|
|
92
92
|
});
|
|
93
93
|
|
|
94
|
-
var
|
|
95
|
-
var MultiSelect = React__default["default"].forwardRef(function MultiSelect(_ref, forwardedRef) {
|
|
94
|
+
var MultiSelect = React__default['default'].forwardRef(function MultiSelect(_ref, forwardedRef) {
|
|
96
95
|
var label = _ref.label,
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
96
|
+
selectedOptions = _ref.selectedOptions,
|
|
97
|
+
availableOptions = _ref.availableOptions,
|
|
98
|
+
loadOptions = _ref.loadOptions,
|
|
99
|
+
loadingMessageFunc = _ref.loadingMessageFunc,
|
|
100
|
+
onUpdateCallback = _ref.onUpdateCallback,
|
|
101
|
+
editText = _ref.editText,
|
|
102
|
+
createNewOptionMessageFunc = _ref.createNewOptionMessageFunc,
|
|
103
|
+
noOptionsMessageFunc = _ref.noOptionsMessageFunc,
|
|
104
|
+
onMultiValueClick = _ref.onMultiValueClick,
|
|
105
|
+
showMore = _ref.showMore,
|
|
106
|
+
showMoreText = _ref.showMoreText,
|
|
107
|
+
displayTotalOnShowMore = _ref.displayTotalOnShowMore,
|
|
108
|
+
creatable = _ref.creatable,
|
|
109
|
+
readOnly = _ref.readOnly,
|
|
110
|
+
hidden = _ref.hidden,
|
|
111
|
+
disabled = _ref.disabled,
|
|
112
|
+
error = _ref.error,
|
|
113
|
+
warning = _ref.warning,
|
|
114
|
+
props = defaultTheme._objectWithoutProperties(_ref, ["label", "selectedOptions", "availableOptions", "loadOptions", "loadingMessageFunc", "onUpdateCallback", "editText", "createNewOptionMessageFunc", "noOptionsMessageFunc", "onMultiValueClick", "showMore", "showMoreText", "displayTotalOnShowMore", "creatable", "readOnly", "hidden", "disabled", "error", "warning"]);
|
|
115
|
+
|
|
116
116
|
var _useState = React.useState(nanoid.nanoid()),
|
|
117
|
-
|
|
118
|
-
|
|
117
|
+
_useState2 = defaultTheme._slicedToArray(_useState, 1),
|
|
118
|
+
uniqueId = _useState2[0];
|
|
119
|
+
|
|
119
120
|
var _useState3 = React.useState(selectedOptions),
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
121
|
+
_useState4 = defaultTheme._slicedToArray(_useState3, 2),
|
|
122
|
+
selected = _useState4[0],
|
|
123
|
+
setSelected = _useState4[1];
|
|
124
|
+
|
|
123
125
|
var _useState5 = React.useState(false),
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
126
|
+
_useState6 = defaultTheme._slicedToArray(_useState5, 2),
|
|
127
|
+
focused = _useState6[0],
|
|
128
|
+
setFocused = _useState6[1];
|
|
129
|
+
|
|
127
130
|
var _useState7 = React.useState(error || warning ? false : showMore),
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
+
_useState8 = defaultTheme._slicedToArray(_useState7, 2),
|
|
132
|
+
displayShowMore = _useState8[0],
|
|
133
|
+
setDisplayShowMore = _useState8[1];
|
|
134
|
+
|
|
131
135
|
var _useState9 = React.useState(0),
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
136
|
+
_useState10 = defaultTheme._slicedToArray(_useState9, 2),
|
|
137
|
+
cacheUnique = _useState10[0],
|
|
138
|
+
setCacheUnique = _useState10[1];
|
|
139
|
+
|
|
135
140
|
React.useEffect(function () {
|
|
136
141
|
setSelected(selectedOptions);
|
|
137
142
|
}, [selectedOptions]);
|
|
143
|
+
|
|
138
144
|
var handleShowMoreClick = function handleShowMoreClick() {
|
|
139
145
|
setDisplayShowMore(false);
|
|
140
146
|
};
|
|
147
|
+
|
|
141
148
|
var Control$1 = React.useMemo(function () {
|
|
142
149
|
var ControlWrapper = function ControlWrapper(innerProps) {
|
|
143
|
-
return React__default[
|
|
150
|
+
return React__default['default'].createElement(Control, defaultTheme._extends({
|
|
144
151
|
className: "multi-select-control",
|
|
145
152
|
readOnly: readOnly
|
|
146
153
|
}, innerProps));
|
|
147
154
|
};
|
|
155
|
+
|
|
148
156
|
ControlWrapper.displayName = 'ControlWrapper';
|
|
149
157
|
return ControlWrapper;
|
|
150
158
|
}, []);
|
|
151
159
|
var ValueContainer$1 = React.useMemo(function () {
|
|
152
160
|
var ValueContainerWrapper = function ValueContainerWrapper(innerProps) {
|
|
153
|
-
return React__default[
|
|
161
|
+
return React__default['default'].createElement(React__default['default'].Fragment, null, label && React__default['default'].createElement(Label, {
|
|
154
162
|
htmlFor: uniqueId
|
|
155
|
-
}, label), React__default[
|
|
163
|
+
}, label), React__default['default'].createElement(ValueContainer, defaultTheme._extends({
|
|
156
164
|
showMore: displayShowMore,
|
|
157
165
|
error: error,
|
|
158
166
|
warning: warning,
|
|
159
167
|
className: "multi-select-values-container"
|
|
160
168
|
}, innerProps)));
|
|
161
169
|
};
|
|
170
|
+
|
|
162
171
|
ValueContainerWrapper.displayName = 'ValueContainerWrapper';
|
|
163
172
|
return ValueContainerWrapper;
|
|
164
173
|
}, [displayShowMore, error, warning]);
|
|
174
|
+
|
|
165
175
|
var MultiValue$1 = function MultiValue$1(innerProps) {
|
|
166
|
-
return React__default[
|
|
176
|
+
return React__default['default'].createElement(MultiValueWrapper, {
|
|
167
177
|
className: "multi-value-wrapper",
|
|
168
178
|
onMouseDown: function onMouseDown(e) {
|
|
169
179
|
e.stopPropagation();
|
|
180
|
+
|
|
170
181
|
if (onMultiValueClick && innerProps.data && !(e.target.role === 'button' || e.target instanceof SVGElement)) {
|
|
171
182
|
onMultiValueClick(innerProps.data);
|
|
172
183
|
}
|
|
173
184
|
}
|
|
174
|
-
}, React__default[
|
|
185
|
+
}, React__default['default'].createElement(MultiValue, defaultTheme._extends({
|
|
175
186
|
className: "multi-value",
|
|
176
187
|
readOnly: readOnly
|
|
177
188
|
}, innerProps)));
|
|
178
189
|
};
|
|
190
|
+
|
|
179
191
|
var Input$1 = React.useMemo(function () {
|
|
180
192
|
var InputWrapper = function InputWrapper(innerProps) {
|
|
181
|
-
return React__default[
|
|
193
|
+
return React__default['default'].createElement(Input, defaultTheme._extends({
|
|
182
194
|
className: "multi-select-input",
|
|
183
195
|
$focused: focused,
|
|
184
196
|
edittext: editText
|
|
@@ -186,6 +198,7 @@ var MultiSelect = React__default["default"].forwardRef(function MultiSelect(_ref
|
|
|
186
198
|
isDisabled: readOnly || disabled
|
|
187
199
|
}));
|
|
188
200
|
};
|
|
201
|
+
|
|
189
202
|
InputWrapper.displayName = 'InputWrapper';
|
|
190
203
|
return InputWrapper;
|
|
191
204
|
}, [focused]);
|
|
@@ -237,53 +250,66 @@ var MultiSelect = React__default["default"].forwardRef(function MultiSelect(_ref
|
|
|
237
250
|
if (onUpdateCallback) {
|
|
238
251
|
onUpdateCallback(actionMeta.action, actionMeta.option);
|
|
239
252
|
}
|
|
253
|
+
|
|
240
254
|
if (loadOptions) {
|
|
241
255
|
setCacheUnique(cacheUnique + 1);
|
|
242
256
|
}
|
|
257
|
+
|
|
243
258
|
setSelected(selectedOptions);
|
|
244
259
|
break;
|
|
260
|
+
|
|
245
261
|
case 'select-option':
|
|
246
262
|
if (onUpdateCallback) {
|
|
247
263
|
onUpdateCallback(actionMeta.action, actionMeta.option);
|
|
248
264
|
}
|
|
265
|
+
|
|
249
266
|
setSelected(selectedOptions);
|
|
250
267
|
break;
|
|
268
|
+
|
|
251
269
|
case 'remove-value':
|
|
252
270
|
if (onUpdateCallback) {
|
|
253
271
|
onUpdateCallback(actionMeta.action, actionMeta.removedValue);
|
|
254
272
|
}
|
|
273
|
+
|
|
255
274
|
setSelected(selectedOptions);
|
|
256
275
|
break;
|
|
276
|
+
|
|
257
277
|
case 'pop-value':
|
|
258
278
|
if (onUpdateCallback) {
|
|
259
279
|
onUpdateCallback(actionMeta.action, actionMeta.removedValue);
|
|
260
280
|
}
|
|
281
|
+
|
|
261
282
|
setSelected(selectedOptions);
|
|
262
283
|
break;
|
|
284
|
+
|
|
263
285
|
case 'deselect-option':
|
|
264
286
|
if (onUpdateCallback) {
|
|
265
287
|
onUpdateCallback(actionMeta.action, actionMeta.option);
|
|
266
288
|
}
|
|
289
|
+
|
|
267
290
|
setSelected(selectedOptions);
|
|
268
291
|
break;
|
|
292
|
+
|
|
269
293
|
case 'clear':
|
|
270
294
|
break;
|
|
295
|
+
|
|
271
296
|
default:
|
|
272
297
|
if (onUpdateCallback) {
|
|
273
298
|
onUpdateCallback(actionMeta.action, actionMeta.option);
|
|
274
299
|
}
|
|
300
|
+
|
|
275
301
|
setSelected(selectedOptions);
|
|
276
302
|
break;
|
|
277
303
|
}
|
|
278
304
|
}
|
|
279
305
|
};
|
|
280
306
|
if (hidden) return null;
|
|
281
|
-
return React__default[
|
|
307
|
+
return React__default['default'].createElement(MultiSelectWrapper, {
|
|
282
308
|
error: error,
|
|
283
309
|
warning: warning
|
|
284
|
-
}, loadOptions ? creatable ? React__default[
|
|
310
|
+
}, loadOptions ? creatable ? React__default['default'].createElement(AsyncCreatableMultiSelect, defaultTheme._extends({}, sharedSelectProps, props)) : React__default['default'].createElement(AsyncMultiSelect, defaultTheme._extends({}, sharedSelectProps, props)) : creatable ? React__default['default'].createElement(CreatableMultiSelect, defaultTheme._extends({}, sharedSelectProps, props)) : React__default['default'].createElement(MultiSelect$1, defaultTheme._extends({}, sharedSelectProps, props)), displayShowMore && !(error || warning) && React__default['default'].createElement(ShowMoreWrapper, {
|
|
285
311
|
onClick: handleShowMoreClick
|
|
286
|
-
}, React__default[
|
|
312
|
+
}, React__default['default'].createElement(ShowMoreOverlay, null), React__default['default'].createElement(ShowMoreText, null, showMoreText, " ", displayTotalOnShowMore && '(' + selected.length + ')')), (typeof error === 'string' || typeof warning === 'string') && React__default['default'].createElement(ErrorMessage, {
|
|
287
313
|
error: error,
|
|
288
314
|
warning: warning
|
|
289
315
|
}, error ? error : warning));
|
|
@@ -327,21 +353,25 @@ MultiSelect.defaultProps = {
|
|
|
327
353
|
showMoreText: 'Show more',
|
|
328
354
|
hidden: false
|
|
329
355
|
};
|
|
356
|
+
|
|
330
357
|
var _MultiValueRemove = function _MultiValueRemove(innerProps) {
|
|
331
|
-
return React__default[
|
|
358
|
+
return React__default['default'].createElement(MultiValueRemove, innerProps, React__default['default'].createElement(close.SvgClose, {
|
|
332
359
|
className: "multi-value-remove-icon"
|
|
333
360
|
}));
|
|
334
361
|
};
|
|
362
|
+
|
|
335
363
|
var Menu = function Menu(innerProps) {
|
|
336
|
-
return React__default[
|
|
364
|
+
return React__default['default'].createElement(DropdownMenu, innerProps);
|
|
337
365
|
};
|
|
366
|
+
|
|
338
367
|
var _Option = function _Option(innerProps) {
|
|
339
|
-
return React__default[
|
|
368
|
+
return React__default['default'].createElement(Option, defaultTheme._extends({
|
|
340
369
|
className: "multi-select-dropdown-item"
|
|
341
370
|
}, innerProps));
|
|
342
371
|
};
|
|
372
|
+
|
|
343
373
|
var SelectedOption = function SelectedOption(innerProps) {
|
|
344
|
-
return React__default[
|
|
374
|
+
return React__default['default'].createElement(SelectedOption$1, innerProps, innerProps.label, React__default['default'].createElement(DropdownOptionDeleteIcon, null));
|
|
345
375
|
};
|
|
346
376
|
|
|
347
377
|
exports.MultiSelect = MultiSelect;
|
|
@@ -1,12 +1,12 @@
|
|
|
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 React = require('react');
|
|
6
6
|
var styled = require('styled-components');
|
|
7
7
|
var polished = require('polished');
|
|
8
8
|
var TippyTooltip = require('@tippyjs/react');
|
|
9
|
-
require('./shift-away-subtle-
|
|
9
|
+
require('./shift-away-subtle-22739ae8.js');
|
|
10
10
|
var maxSize = require('popper-max-size-modifier');
|
|
11
11
|
|
|
12
12
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -16,11 +16,9 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
|
16
16
|
var TippyTooltip__default = /*#__PURE__*/_interopDefaultLegacy(TippyTooltip);
|
|
17
17
|
var maxSize__default = /*#__PURE__*/_interopDefaultLegacy(maxSize);
|
|
18
18
|
|
|
19
|
-
var _templateObject, _templateObject2, _templateObject3
|
|
20
|
-
var Popover$1 = styled__default[
|
|
19
|
+
var _templateObject, _templateObject2, _templateObject3;
|
|
20
|
+
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 max-height: inherit;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n .tippy-content {\n padding: 0;\n max-height: inherit;\n\n > div {\n max-height: inherit;\n }\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) {
|
|
21
21
|
return props.theme.primaryFontFamily;
|
|
22
|
-
}, function (props) {
|
|
23
|
-
return props.maxWidth && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n max-width: ", ";\n "])), props.maxWidth);
|
|
24
22
|
}, function (props) {
|
|
25
23
|
return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
|
|
26
24
|
}, function (props) {
|
|
@@ -28,13 +26,13 @@ var Popover$1 = styled__default["default"](TippyTooltip__default["default"]).att
|
|
|
28
26
|
}, function (props) {
|
|
29
27
|
return props.theme.themeProp('border', "1px solid ".concat(props.theme.getColor('gray-800')), "1px solid ".concat(props.theme.getColor('gray-300')));
|
|
30
28
|
}, function (props) {
|
|
31
|
-
return props.contextMenu && styled.css(
|
|
29
|
+
return props.contextMenu && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n border-radius: 4px;\n\n ", "\n\n ", "\n "])), function (props) {
|
|
32
30
|
return props.theme.themeProp('border', 'none', 'none');
|
|
33
31
|
}, function (props) {
|
|
34
32
|
return props.theme.themeProp('box-shadow', "none", "0 1px 6px ".concat(polished.rgba(props.theme.getColor('gray-900'), 0.3)));
|
|
35
33
|
});
|
|
36
34
|
}, function (props) {
|
|
37
|
-
return props.contextMenuSublevel && styled.css(
|
|
35
|
+
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 "])));
|
|
38
36
|
}, function (props) {
|
|
39
37
|
return props.theme.themeProp('color', props.theme.getColor('gray-700'), props.theme.getColor('white'), 1);
|
|
40
38
|
}, function (props) {
|
|
@@ -47,40 +45,28 @@ var Popover$1 = styled__default["default"](TippyTooltip__default["default"]).att
|
|
|
47
45
|
return props.theme.themeProp('border-left-color', props.theme.getColor('gray-800'), props.theme.getColor('gray-300'), 1);
|
|
48
46
|
});
|
|
49
47
|
|
|
50
|
-
var
|
|
51
|
-
var
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
arrow = _ref$arrow === void 0 ? true : _ref$arrow,
|
|
66
|
-
_ref$visible = _ref.visible,
|
|
67
|
-
visible = _ref$visible === void 0 ? undefined : _ref$visible,
|
|
68
|
-
_ref$contextMenu = _ref.contextMenu,
|
|
69
|
-
contextMenu = _ref$contextMenu === void 0 ? false : _ref$contextMenu,
|
|
70
|
-
_ref$contextMenuSuble = _ref.contextMenuSublevel,
|
|
71
|
-
contextMenuSublevel = _ref$contextMenuSuble === void 0 ? false : _ref$contextMenuSuble,
|
|
72
|
-
children = _ref.children,
|
|
73
|
-
_ref$modifiers = _ref.modifiers,
|
|
74
|
-
modifiers = _ref$modifiers === void 0 ? [] : _ref$modifiers,
|
|
75
|
-
_ref$maxWidth = _ref.maxWidth,
|
|
76
|
-
maxWidth = _ref$maxWidth === void 0 ? 'none' : _ref$maxWidth,
|
|
77
|
-
props = defaultTheme._objectWithoutProperties(_ref, _excluded);
|
|
48
|
+
var Popover = React__default['default'].forwardRef(function Popover(_ref, ref) {
|
|
49
|
+
var content = _ref.content,
|
|
50
|
+
interactive = _ref.interactive,
|
|
51
|
+
placement = _ref.placement,
|
|
52
|
+
duration = _ref.duration,
|
|
53
|
+
trigger = _ref.trigger,
|
|
54
|
+
offset = _ref.offset,
|
|
55
|
+
arrow = _ref.arrow,
|
|
56
|
+
visible = _ref.visible,
|
|
57
|
+
contextMenu = _ref.contextMenu,
|
|
58
|
+
contextMenuSublevel = _ref.contextMenuSublevel,
|
|
59
|
+
children = _ref.children,
|
|
60
|
+
modifiers = _ref.modifiers,
|
|
61
|
+
props = defaultTheme._objectWithoutProperties(_ref, ["content", "interactive", "placement", "duration", "trigger", "offset", "arrow", "visible", "contextMenu", "contextMenuSublevel", "children", "modifiers"]);
|
|
62
|
+
|
|
78
63
|
var errorOffset = React.useMemo(function () {
|
|
79
64
|
return arrow ? 15 : 0;
|
|
80
65
|
}, [arrow]);
|
|
81
66
|
var isControlled = React.useMemo(function () {
|
|
82
67
|
return lodash.isBoolean(visible);
|
|
83
68
|
}, [visible]);
|
|
69
|
+
|
|
84
70
|
var handleContextMenuItemClick = function handleContextMenuItemClick() {
|
|
85
71
|
document.querySelectorAll('.context-menu-item:not(.opens-sublevel)').forEach(function (item) {
|
|
86
72
|
return item.addEventListener('click', function () {
|
|
@@ -92,7 +78,8 @@ var Popover = React__default["default"].forwardRef(function Popover(_ref, ref) {
|
|
|
92
78
|
});
|
|
93
79
|
});
|
|
94
80
|
};
|
|
95
|
-
|
|
81
|
+
|
|
82
|
+
return React__default['default'].createElement("div", null, React__default['default'].createElement(Popover$1, defaultTheme._extends({
|
|
96
83
|
ref: ref,
|
|
97
84
|
content: content,
|
|
98
85
|
interactive: interactive,
|
|
@@ -104,7 +91,7 @@ var Popover = React__default["default"].forwardRef(function Popover(_ref, ref) {
|
|
|
104
91
|
arrow: contextMenu ? false : arrow,
|
|
105
92
|
visible: visible,
|
|
106
93
|
popperOptions: {
|
|
107
|
-
modifiers: [defaultTheme._objectSpread2(defaultTheme._objectSpread2({}, maxSize__default[
|
|
94
|
+
modifiers: [defaultTheme._objectSpread2(defaultTheme._objectSpread2({}, maxSize__default['default']), {}, {
|
|
108
95
|
options: {
|
|
109
96
|
boundary: 'viewport',
|
|
110
97
|
rootBoundary: 'viewport',
|
|
@@ -124,8 +111,7 @@ var Popover = React__default["default"].forwardRef(function Popover(_ref, ref) {
|
|
|
124
111
|
}
|
|
125
112
|
}].concat(defaultTheme._toConsumableArray(modifiers))
|
|
126
113
|
},
|
|
127
|
-
onShown: contextMenu ? handleContextMenuItemClick : undefined
|
|
128
|
-
maxWidth: maxWidth
|
|
114
|
+
onShown: contextMenu ? handleContextMenuItemClick : undefined
|
|
129
115
|
}, props), children));
|
|
130
116
|
});
|
|
131
117
|
Popover.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
@@ -138,10 +124,23 @@ Popover.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
138
124
|
arrow: defaultTheme.PropTypes.bool,
|
|
139
125
|
visible: defaultTheme.PropTypes.bool,
|
|
140
126
|
modifiers: defaultTheme.PropTypes.array,
|
|
141
|
-
maxWidth: defaultTheme.PropTypes.string,
|
|
142
127
|
contextMenu: defaultTheme.PropTypes.bool,
|
|
143
128
|
contextMenuSublevel: defaultTheme.PropTypes.bool,
|
|
144
129
|
children: defaultTheme.PropTypes.node.isRequired
|
|
145
130
|
} : {};
|
|
131
|
+
Popover.defaultProps = {
|
|
132
|
+
content: 'Tooltip',
|
|
133
|
+
interactive: true,
|
|
134
|
+
placement: 'bottom-end',
|
|
135
|
+
duration: 350,
|
|
136
|
+
offset: [0, 8],
|
|
137
|
+
maxWidth: 'none',
|
|
138
|
+
trigger: 'click focus',
|
|
139
|
+
arrow: true,
|
|
140
|
+
visible: undefined,
|
|
141
|
+
contextMenu: false,
|
|
142
|
+
contextMenuSublevel: false,
|
|
143
|
+
modifiers: []
|
|
144
|
+
};
|
|
146
145
|
|
|
147
146
|
exports.Popover = Popover;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-44832997.js');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var nanoid = require('nanoid');
|
|
6
6
|
var polished = require('polished');
|
|
@@ -13,10 +13,10 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
|
13
13
|
|
|
14
14
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
15
15
|
var radioSize = '18px';
|
|
16
|
-
var RadioLabel = styled__default[
|
|
16
|
+
var RadioLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n padding-left: ", ";\n font-weight: 400;\n font-size: 0.875rem;\n\n ", ";\n"])), polished.math("".concat(radioSize, " + 10px")), function (props) {
|
|
17
17
|
return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'));
|
|
18
18
|
});
|
|
19
|
-
var Radio$1 = styled__default[
|
|
19
|
+
var Radio$1 = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n cursor: pointer;\n line-height: ", ";\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n border: 2px solid ", ";\n width: ", ";\n height: ", ";\n top: 0;\n border-radius: 50%;\n transition: all 200ms;\n box-sizing: border-box;\n }\n\n &::after {\n content: '';\n position: absolute;\n width: 8px;\n height: 8px;\n top: 5px;\n left: 5px;\n border-radius: 50%;\n transform: scale(0);\n transition: all 200ms;\n }\n\n &:has(input:checked) {\n ::before {\n border-color: ", ";\n }\n\n ::after {\n background: ", ";\n transform: scale(1);\n }\n\n ", " {\n opacity: 1;\n }\n }\n & {\n input[type='radio'] {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n }\n }\n\n ", "\n\n ", "\n"])), radioSize, function (props) {
|
|
20
20
|
return props.theme.getColor('gray-300');
|
|
21
21
|
}, radioSize, radioSize, function (props) {
|
|
22
22
|
return props.theme.getColor('emerald-500');
|
|
@@ -28,30 +28,31 @@ var Radio$1 = styled__default["default"].label.attrs(defaultTheme.applyDefaultTh
|
|
|
28
28
|
return props.disabled && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n user-select: text;\n "])));
|
|
29
29
|
});
|
|
30
30
|
|
|
31
|
-
var
|
|
32
|
-
var Radio = React__default["default"].forwardRef(function Radio(_ref, forwardedRef) {
|
|
31
|
+
var Radio = React__default['default'].forwardRef(function Radio(_ref, forwardedRef) {
|
|
33
32
|
var name = _ref.name,
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
33
|
+
value = _ref.value,
|
|
34
|
+
checked = _ref.checked,
|
|
35
|
+
defaultChecked = _ref.defaultChecked,
|
|
36
|
+
disabled = _ref.disabled,
|
|
37
|
+
readOnly = _ref.readOnly,
|
|
38
|
+
label = _ref.label,
|
|
39
|
+
className = _ref.className,
|
|
40
|
+
style = _ref.style,
|
|
41
|
+
onChange = _ref.onChange,
|
|
42
|
+
onBlur = _ref.onBlur,
|
|
43
|
+
rest = defaultTheme._objectWithoutProperties(_ref, ["name", "value", "checked", "defaultChecked", "disabled", "readOnly", "label", "className", "style", "onChange", "onBlur"]);
|
|
44
|
+
|
|
45
45
|
var _useState = React.useState(nanoid.nanoid()),
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
46
|
+
_useState2 = defaultTheme._slicedToArray(_useState, 1),
|
|
47
|
+
uniqueId = _useState2[0];
|
|
48
|
+
|
|
49
|
+
return React__default['default'].createElement(Radio$1, {
|
|
49
50
|
htmlFor: uniqueId,
|
|
50
51
|
disabled: disabled,
|
|
51
52
|
readOnly: readOnly,
|
|
52
53
|
className: className,
|
|
53
54
|
style: style
|
|
54
|
-
}, React__default[
|
|
55
|
+
}, React__default['default'].createElement("input", defaultTheme._extends({
|
|
55
56
|
ref: forwardedRef,
|
|
56
57
|
type: "radio",
|
|
57
58
|
name: name,
|
|
@@ -63,7 +64,7 @@ var Radio = React__default["default"].forwardRef(function Radio(_ref, forwardedR
|
|
|
63
64
|
id: uniqueId,
|
|
64
65
|
onChange: onChange,
|
|
65
66
|
onBlur: onBlur
|
|
66
|
-
}, rest)), React__default[
|
|
67
|
+
}, rest)), React__default['default'].createElement(RadioLabel, null, label));
|
|
67
68
|
});
|
|
68
69
|
Radio.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
69
70
|
label: defaultTheme.PropTypes.any,
|