@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.
Files changed (68) hide show
  1. package/.eslintrc +8 -7
  2. package/{ActionButton-b2345555.js → ActionButton-dea072f4.js} +16 -19
  3. package/{Alert-d69a3f95.js → Alert-347a66eb.js} +24 -20
  4. package/{AssetAction-9622c4f9.js → AssetGallery-f24a8bb1.js} +651 -606
  5. package/AssetPreviewTopBar-b64d4665.js +99 -0
  6. package/{Badge-e984e6f5.js → Badge-b5d734ce.js} +49 -28
  7. package/{Button-090fb526.js → Button-211d92ec.js} +85 -94
  8. package/{Checkbox-ad9c9e54.js → Checkbox-b6f6fabf.js} +35 -30
  9. package/{CompactAutocompleteSelect-26949125.js → CompactAutocompleteSelect-15a10abb.js} +114 -82
  10. package/{CompactStarRating-65bf27e5.js → CompactStarRating-821494e0.js} +94 -83
  11. package/{CompactTextInput-60edc635.js → CompactTextInput-ca8a67af.js} +106 -110
  12. package/{ContextMenu-4eb8fdc5.js → ContextMenu-d269f2b4.js} +6 -6
  13. package/{ContextMenuItem-c536b460.js → ContextMenuItem-960e1acf.js} +26 -22
  14. package/{InputGroup-a89a0ea3.js → InputGroup-b5ebae07.js} +6 -6
  15. package/{Instructions-dbd4514c.js → Instructions-6bfa0f6e.js} +81 -97
  16. package/{MultiLevelCheckboxSelect-3d5d5f2c.js → MultiLevelCheckboxSelect-b145322d.js} +164 -102
  17. package/{MultiSelect-cdfe6ffa.js → MultiSelect-b2459602.js} +101 -71
  18. package/{Popover-52d29ca6.js → Popover-ec433aaf.js} +40 -41
  19. package/{Radio-55db4781.js → Radio-2ab61f91.js} +22 -21
  20. package/{SectionSeparator-af8dc1ce.js → SectionSeparator-a28c6af2.js} +6 -6
  21. package/{Switch-04ecd8d0.js → Switch-e3289575.js} +27 -25
  22. package/{Tab-e43241f0.js → Tab-91278790.js} +7 -7
  23. package/{Tabs-cfc08c6b.js → Tabs-2a0f1d84.js} +43 -39
  24. package/{TextArea-44b4d3c4.js → TextArea-8c8757d9.js} +125 -93
  25. package/{TextInput-c3c71881.js → TextInput-4cac4342.js} +50 -48
  26. package/{Tooltip-a68a7e49.js → Tooltip-978b6cdd.js} +13 -13
  27. package/{VerificationStatusIcon-7b0e23fe.js → VerificationStatusIcon-ad0159e3.js} +30 -20
  28. package/{close-1751121a.js → close-ebf2f3cf.js} +12 -8
  29. package/data/Alert/index.js +2 -2
  30. package/data/Badge/index.js +2 -2
  31. package/data/Popover/index.js +3 -3
  32. package/data/Tab/index.js +2 -2
  33. package/data/Tabs/index.js +3 -3
  34. package/data/Tooltip/index.js +3 -3
  35. package/data/index.js +9 -9
  36. package/{defaultTheme-cd01e6c2.js → defaultTheme-44832997.js} +261 -213
  37. package/edit-note-c47d292e.js +41 -0
  38. package/{expand-more-d74e2bd2.js → expand-more-94585605.js} +12 -8
  39. package/inputs/ActionButton/index.js +2 -2
  40. package/inputs/Button/index.js +6 -6
  41. package/inputs/Checkbox/index.js +2 -2
  42. package/inputs/CompactAutocompleteSelect/index.js +13 -13
  43. package/inputs/CompactStarRating/index.js +10 -10
  44. package/inputs/CompactTextInput/index.js +11 -11
  45. package/inputs/MultiSelect/index.js +4 -4
  46. package/inputs/Radio/index.js +2 -2
  47. package/inputs/Switch/index.js +2 -2
  48. package/inputs/TextArea/index.js +11 -11
  49. package/inputs/TextInput/index.js +3 -3
  50. package/inputs/index.js +28 -28
  51. package/layout/InputGroup/index.js +2 -2
  52. package/layout/SectionSeparator/index.js +2 -2
  53. package/layout/index.js +3 -3
  54. package/package.json +1 -2
  55. package/{react-select-creatable.esm-383b1e78.js → react-select-creatable.esm-2f23d6c6.js} +1285 -1414
  56. package/{shift-away-subtle-631cd794.js → shift-away-subtle-22739ae8.js} +1 -1
  57. package/ssr/index.js +3 -1
  58. package/styles/config.scss +2 -2
  59. package/warning-circle-24522402.js +41 -0
  60. package/widgets/AssetGallery/index.js +32 -34
  61. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +3 -3
  62. package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
  63. package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +6 -6
  64. package/widgets/ContextMenu/index.js +2 -2
  65. package/widgets/Instructions/index.js +17 -16
  66. package/widgets/index.js +35 -37
  67. package/AssetPreviewTopBar-b1fe3188.js +0 -104
  68. package/edit-note-cefe2215.js +0 -37
@@ -1,12 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-cd01e6c2.js');
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-1751121a.js');
7
+ var close = require('./close-ebf2f3cf.js');
8
8
  var Select = require('react-select');
9
- var reactSelectCreatable_esm = require('./react-select-creatable.esm-383b1e78.js');
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["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) {
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["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) {
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["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) {
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["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) {
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["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) {
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["default"](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n font-size: 14px;\n\n ", "\n\n ", "\n"])), function (props) {
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["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) {
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["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) {
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["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) {
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["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n font-size: 0.875rem;\n width: 100%;\n ", "\n"])), function (props) {
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["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) {
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 _excluded = ["label", "selectedOptions", "availableOptions", "loadOptions", "loadingMessageFunc", "onUpdateCallback", "editText", "createNewOptionMessageFunc", "noOptionsMessageFunc", "onMultiValueClick", "showMore", "showMoreText", "displayTotalOnShowMore", "creatable", "readOnly", "hidden", "disabled", "error", "warning"];
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
- selectedOptions = _ref.selectedOptions,
98
- availableOptions = _ref.availableOptions,
99
- loadOptions = _ref.loadOptions,
100
- loadingMessageFunc = _ref.loadingMessageFunc,
101
- onUpdateCallback = _ref.onUpdateCallback,
102
- editText = _ref.editText,
103
- createNewOptionMessageFunc = _ref.createNewOptionMessageFunc,
104
- noOptionsMessageFunc = _ref.noOptionsMessageFunc,
105
- onMultiValueClick = _ref.onMultiValueClick,
106
- showMore = _ref.showMore,
107
- showMoreText = _ref.showMoreText,
108
- displayTotalOnShowMore = _ref.displayTotalOnShowMore,
109
- creatable = _ref.creatable,
110
- readOnly = _ref.readOnly,
111
- hidden = _ref.hidden,
112
- disabled = _ref.disabled,
113
- error = _ref.error,
114
- warning = _ref.warning,
115
- props = defaultTheme._objectWithoutProperties(_ref, _excluded);
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
- _useState2 = defaultTheme._slicedToArray(_useState, 1),
118
- uniqueId = _useState2[0];
117
+ _useState2 = defaultTheme._slicedToArray(_useState, 1),
118
+ uniqueId = _useState2[0];
119
+
119
120
  var _useState3 = React.useState(selectedOptions),
120
- _useState4 = defaultTheme._slicedToArray(_useState3, 2),
121
- selected = _useState4[0],
122
- setSelected = _useState4[1];
121
+ _useState4 = defaultTheme._slicedToArray(_useState3, 2),
122
+ selected = _useState4[0],
123
+ setSelected = _useState4[1];
124
+
123
125
  var _useState5 = React.useState(false),
124
- _useState6 = defaultTheme._slicedToArray(_useState5, 2),
125
- focused = _useState6[0],
126
- setFocused = _useState6[1];
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
- _useState8 = defaultTheme._slicedToArray(_useState7, 2),
129
- displayShowMore = _useState8[0],
130
- setDisplayShowMore = _useState8[1];
131
+ _useState8 = defaultTheme._slicedToArray(_useState7, 2),
132
+ displayShowMore = _useState8[0],
133
+ setDisplayShowMore = _useState8[1];
134
+
131
135
  var _useState9 = React.useState(0),
132
- _useState10 = defaultTheme._slicedToArray(_useState9, 2),
133
- cacheUnique = _useState10[0],
134
- setCacheUnique = _useState10[1];
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["default"].createElement(Control, defaultTheme._extends({
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["default"].createElement(React__default["default"].Fragment, null, label && React__default["default"].createElement(Label, {
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["default"].createElement(ValueContainer, defaultTheme._extends({
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["default"].createElement(MultiValueWrapper, {
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["default"].createElement(MultiValue, defaultTheme._extends({
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["default"].createElement(Input, defaultTheme._extends({
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["default"].createElement(MultiSelectWrapper, {
307
+ return React__default['default'].createElement(MultiSelectWrapper, {
282
308
  error: error,
283
309
  warning: warning
284
- }, 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, {
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["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, {
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["default"].createElement(MultiValueRemove, innerProps, React__default["default"].createElement(close.SvgClose, {
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["default"].createElement(DropdownMenu, innerProps);
364
+ return React__default['default'].createElement(DropdownMenu, innerProps);
337
365
  };
366
+
338
367
  var _Option = function _Option(innerProps) {
339
- return React__default["default"].createElement(Option, defaultTheme._extends({
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["default"].createElement(SelectedOption$1, innerProps, innerProps.label, React__default["default"].createElement(DropdownOptionDeleteIcon, null));
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-cd01e6c2.js');
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-631cd794.js');
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, _templateObject4;
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 ", "\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) {
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(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n border-radius: 4px;\n\n ", "\n\n ", "\n "])), function (props) {
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(_templateObject4 || (_templateObject4 = 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 "])));
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 _excluded = ["content", "interactive", "placement", "duration", "trigger", "offset", "arrow", "visible", "contextMenu", "contextMenuSublevel", "children", "modifiers", "maxWidth"];
51
- var Popover = React__default["default"].forwardRef(function Popover(_ref, ref) {
52
- var _ref$content = _ref.content,
53
- content = _ref$content === void 0 ? 'Tooltip' : _ref$content,
54
- _ref$interactive = _ref.interactive,
55
- interactive = _ref$interactive === void 0 ? true : _ref$interactive,
56
- _ref$placement = _ref.placement,
57
- placement = _ref$placement === void 0 ? 'bottom-end' : _ref$placement,
58
- _ref$duration = _ref.duration,
59
- duration = _ref$duration === void 0 ? 350 : _ref$duration,
60
- _ref$trigger = _ref.trigger,
61
- trigger = _ref$trigger === void 0 ? 'click focus' : _ref$trigger,
62
- _ref$offset = _ref.offset,
63
- offset = _ref$offset === void 0 ? [0, 8] : _ref$offset,
64
- _ref$arrow = _ref.arrow,
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
- return React__default["default"].createElement("div", null, React__default["default"].createElement(Popover$1, defaultTheme._extends({
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["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-cd01e6c2.js');
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["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) {
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["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) {
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 _excluded = ["name", "value", "checked", "defaultChecked", "disabled", "readOnly", "label", "className", "style", "onChange", "onBlur"];
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
- value = _ref.value,
35
- checked = _ref.checked,
36
- defaultChecked = _ref.defaultChecked,
37
- disabled = _ref.disabled,
38
- readOnly = _ref.readOnly,
39
- label = _ref.label,
40
- className = _ref.className,
41
- style = _ref.style,
42
- onChange = _ref.onChange,
43
- onBlur = _ref.onBlur,
44
- rest = defaultTheme._objectWithoutProperties(_ref, _excluded);
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
- _useState2 = defaultTheme._slicedToArray(_useState, 1),
47
- uniqueId = _useState2[0];
48
- return React__default["default"].createElement(Radio$1, {
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["default"].createElement("input", defaultTheme._extends({
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["default"].createElement(RadioLabel, null, label));
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,