@ntbjs/react-components 1.1.13 → 1.1.15

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 (67) hide show
  1. package/.eslintrc +7 -8
  2. package/{ActionButton-46735b89.js → ActionButton-b2345555.js} +19 -16
  3. package/{Alert-13b75102.js → Alert-d69a3f95.js} +20 -24
  4. package/{AssetGallery-f62e16b2.js → AssetAction-2e2d496e.js} +585 -650
  5. package/AssetPreviewTopBar-b1fe3188.js +104 -0
  6. package/{Badge-757b0a39.js → Badge-e984e6f5.js} +28 -49
  7. package/{Button-49f82b31.js → Button-39607724.js} +53 -65
  8. package/{Checkbox-68dc38a8.js → Checkbox-ad9c9e54.js} +30 -35
  9. package/{CompactAutocompleteSelect-96137f48.js → CompactAutocompleteSelect-7d05d707.js} +82 -114
  10. package/{CompactStarRating-15c1b812.js → CompactStarRating-d4cfae17.js} +71 -87
  11. package/{CompactTextInput-a43aea28.js → CompactTextInput-f89988be.js} +95 -105
  12. package/{ContextMenu-4ec3d9f3.js → ContextMenu-4eb8fdc5.js} +6 -6
  13. package/{ContextMenuItem-ba2b697e.js → ContextMenuItem-c536b460.js} +22 -26
  14. package/{InputGroup-49fbc423.js → InputGroup-a89a0ea3.js} +6 -6
  15. package/{Instructions-9a0fd247.js → Instructions-c8502398.js} +97 -81
  16. package/{MultiLevelCheckboxSelect-e6e5cb90.js → MultiLevelCheckboxSelect-6be69491.js} +102 -164
  17. package/{MultiSelect-efd60232.js → MultiSelect-81e7016c.js} +71 -101
  18. package/{Popover-569cd272.js → Popover-c5e425a7.js} +19 -21
  19. package/{Radio-32d0513a.js → Radio-55db4781.js} +21 -22
  20. package/{SectionSeparator-259a22ed.js → SectionSeparator-af8dc1ce.js} +6 -6
  21. package/{Switch-4a41585f.js → Switch-04ecd8d0.js} +25 -27
  22. package/{Tab-f499ecbc.js → Tab-e43241f0.js} +7 -7
  23. package/{Tabs-116aa951.js → Tabs-cfc08c6b.js} +21 -33
  24. package/{TextArea-a869b1a9.js → TextArea-6e15b44f.js} +110 -135
  25. package/{TextInput-0d109708.js → TextInput-9a995449.js} +41 -48
  26. package/{Tooltip-66daf6e3.js → Tooltip-a68a7e49.js} +13 -13
  27. package/{VerificationStatusIcon-d5bfb67a.js → VerificationStatusIcon-7b0e23fe.js} +20 -30
  28. package/{close-ebf2f3cf.js → close-1751121a.js} +8 -12
  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-ea44e34a.js → defaultTheme-cd01e6c2.js} +212 -260
  37. package/edit-note-cefe2215.js +37 -0
  38. package/{expand-more-94585605.js → expand-more-d74e2bd2.js} +8 -12
  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 +2 -1
  55. package/{react-select-creatable.esm-2f23d6c6.js → react-select-creatable.esm-9745dc34.js} +1502 -1281
  56. package/{shift-away-subtle-0bed9a3c.js → shift-away-subtle-631cd794.js} +1 -1
  57. package/ssr/index.js +1 -3
  58. package/widgets/AssetGallery/index.js +34 -32
  59. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +3 -3
  60. package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
  61. package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +6 -6
  62. package/widgets/ContextMenu/index.js +2 -2
  63. package/widgets/Instructions/index.js +16 -17
  64. package/widgets/index.js +37 -35
  65. package/AssetPreviewTopBar-912c3469.js +0 -99
  66. package/edit-note-c47d292e.js +0 -41
  67. package/warning-circle-24522402.js +0 -41
package/{Switch-4a41585f.js → Switch-04ecd8d0.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var nanoid = require('nanoid');
6
6
  var polished = require('polished');
@@ -13,63 +13,61 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
 
14
14
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
15
15
  var switchButtonSize = '16px';
16
- var Switch$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n * {\n box-sizing: border-box;\n }\n\n display: flex;\n flex-direction: column;\n\n ", "\n\n ", "\n"])), function (props) {
16
+ var Switch$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n * {\n box-sizing: border-box;\n }\n\n display: flex;\n flex-direction: column;\n\n ", "\n\n ", "\n"])), function (props) {
17
17
  return props.readOnly && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n > * {\n pointer-events: none;\n user-select: text;\n }\n "])));
18
18
  }, function (props) {
19
19
  return props.disabled && styled.css(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0.5;\n cursor: not-allowed;\n * {\n pointer-events: none;\n user-select: text;\n }\n "])));
20
20
  });
21
- var SwitchIndicator = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n ", "\n height: ", ";\n width: 32px;\n border-radius: 20px;\n border: 1px solid;\n ", "\n transition: background 200ms;\n"])), function (props) {
21
+ var SwitchIndicator = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n ", "\n height: ", ";\n width: 32px;\n border-radius: 20px;\n border: 1px solid;\n ", "\n transition: background 200ms;\n"])), function (props) {
22
22
  return props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('gray-200'));
23
23
  }, polished.math("".concat(switchButtonSize, " + 2px")), function (props) {
24
24
  return props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-300'));
25
25
  });
26
- var SwitchIndicatorButton = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n ", "\n height: ", ";\n width: ", ";\n border-radius: 50%;\n box-shadow: ", " 0 0px 2px 0px;\n transition: left 200ms;\n"])), function (props) {
26
+ var SwitchIndicatorButton = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n ", "\n height: ", ";\n width: ", ";\n border-radius: 50%;\n box-shadow: ", " 0 0px 2px 0px;\n transition: left 200ms;\n"])), function (props) {
27
27
  return props.theme.themeProp('background', props.theme.getColor('gray-200'), props.theme.getColor('white'));
28
28
  }, switchButtonSize, switchButtonSize, function (props) {
29
29
  return props.theme.getColor('gray-500');
30
30
  });
31
- var SwitchIndicatorLabelText = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 18px;\n\n ", ";\n"])), function (props) {
31
+ var SwitchIndicatorLabelText = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n padding-left: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 18px;\n\n ", ";\n"])), function (props) {
32
32
  return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'));
33
33
  });
34
- var SwitchLabel = styled__default['default'].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: inline-flex;\n margin-right: auto;\n cursor: pointer;\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n }\n\n &:has(input[type='checkbox']:not(:checked)) {\n ", " {\n left: 0;\n }\n }\n\n &:has(input[type='checkbox']:checked) {\n ", " {\n left: calc(100% - ", ");\n }\n\n ", " {\n background: ", ";\n\n ", "\n }\n }\n\n &:has(input[type='checkbox']:focus-visible) {\n ", " {\n ", "\n }\n }\n"])), SwitchIndicatorButton, SwitchIndicatorButton, switchButtonSize, SwitchIndicator, function (props) {
34
+ var SwitchLabel = styled__default["default"].label.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: inline-flex;\n margin-right: auto;\n cursor: pointer;\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n }\n\n &:has(input[type='checkbox']:not(:checked)) {\n ", " {\n left: 0;\n }\n }\n\n &:has(input[type='checkbox']:checked) {\n ", " {\n left: calc(100% - ", ");\n }\n\n ", " {\n background: ", ";\n\n ", "\n }\n }\n\n &:has(input[type='checkbox']:focus-visible) {\n ", " {\n ", "\n }\n }\n"])), SwitchIndicatorButton, SwitchIndicatorButton, switchButtonSize, SwitchIndicator, function (props) {
35
35
  return props.theme.getColor('emerald-500');
36
36
  }, function (props) {
37
37
  return props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-300'), 1);
38
38
  }, SwitchIndicatorButton, function (props) {
39
39
  return props.theme.themeProp('outline', "8px solid ".concat(polished.rgba(props.theme.getColor('emerald-500'), 0.5)), "8px solid ".concat(polished.rgba(props.theme.getColor('emerald-500'), 0.3)), 1);
40
40
  });
41
- var Description = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n margin: ", " 0 0 0;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n"])), function (props) {
41
+ var Description = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n margin: ", " 0 0 0;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n"])), function (props) {
42
42
  return props.spaciousDescription ? '16px' : '6px';
43
43
  }, function (props) {
44
44
  return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
45
45
  });
46
46
 
47
- var Switch = React__default['default'].forwardRef(function Switch(_ref, forwardedRef) {
47
+ var Switch = React__default["default"].forwardRef(function Switch(_ref, forwardedRef) {
48
48
  var name = _ref.name,
49
- checked = _ref.checked,
50
- defaultChecked = _ref.defaultChecked,
51
- label = _ref.label,
52
- disabled = _ref.disabled,
53
- readOnly = _ref.readOnly,
54
- description = _ref.description,
55
- spaciousDescription = _ref.spaciousDescription,
56
- className = _ref.className,
57
- style = _ref.style,
58
- onChange = _ref.onChange,
59
- onBlur = _ref.onBlur;
60
-
49
+ checked = _ref.checked,
50
+ defaultChecked = _ref.defaultChecked,
51
+ label = _ref.label,
52
+ disabled = _ref.disabled,
53
+ readOnly = _ref.readOnly,
54
+ description = _ref.description,
55
+ spaciousDescription = _ref.spaciousDescription,
56
+ className = _ref.className,
57
+ style = _ref.style,
58
+ onChange = _ref.onChange,
59
+ onBlur = _ref.onBlur;
61
60
  var _useState = React.useState(nanoid.nanoid()),
62
- _useState2 = defaultTheme._slicedToArray(_useState, 1),
63
- uniqueId = _useState2[0];
64
-
65
- return React__default['default'].createElement(Switch$1, {
61
+ _useState2 = defaultTheme._slicedToArray(_useState, 1),
62
+ uniqueId = _useState2[0];
63
+ return React__default["default"].createElement(Switch$1, {
66
64
  disabled: disabled,
67
65
  readOnly: readOnly,
68
66
  className: className,
69
67
  style: style
70
- }, React__default['default'].createElement(SwitchLabel, {
68
+ }, React__default["default"].createElement(SwitchLabel, {
71
69
  htmlFor: uniqueId
72
- }, React__default['default'].createElement("input", {
70
+ }, React__default["default"].createElement("input", {
73
71
  ref: forwardedRef,
74
72
  checked: checked,
75
73
  defaultChecked: defaultChecked,
@@ -80,7 +78,7 @@ var Switch = React__default['default'].forwardRef(function Switch(_ref, forwarde
80
78
  type: "checkbox",
81
79
  onBlur: onBlur,
82
80
  onChange: onChange
83
- }), React__default['default'].createElement(SwitchIndicator, null, React__default['default'].createElement(SwitchIndicatorButton, null)), typeof label === 'string' && label.length > 0 && React__default['default'].createElement(SwitchIndicatorLabelText, null, label)), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
81
+ }), React__default["default"].createElement(SwitchIndicator, null, React__default["default"].createElement(SwitchIndicatorButton, null)), typeof label === 'string' && label.length > 0 && React__default["default"].createElement(SwitchIndicatorLabelText, null, label)), typeof description === 'string' && description.length > 0 && React__default["default"].createElement(Description, {
84
82
  spaciousDescription: spaciousDescription
85
83
  }, description));
86
84
  });
package/{Tab-f499ecbc.js → Tab-e43241f0.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
 
@@ -10,17 +10,17 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
10
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
11
 
12
12
  var _templateObject;
13
- var Tab$1 = styled__default['default'].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 500;\n border-bottom: 1px solid;\n min-height: 35px;\n"])), function (props) {
13
+ var Tab$1 = styled__default["default"].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n font-size: 1rem;\n font-weight: 500;\n border-bottom: 1px solid;\n min-height: 35px;\n"])), function (props) {
14
14
  return props.theme.primaryFontFamily;
15
15
  });
16
16
 
17
- var Tab = React__default['default'].forwardRef(function Tab(_ref, forwardedRef) {
17
+ var _excluded = ["children", "hidden"];
18
+ var Tab = React__default["default"].forwardRef(function Tab(_ref, forwardedRef) {
18
19
  var children = _ref.children,
19
- hidden = _ref.hidden,
20
- props = defaultTheme._objectWithoutProperties(_ref, ["children", "hidden"]);
21
-
20
+ hidden = _ref.hidden,
21
+ props = defaultTheme._objectWithoutProperties(_ref, _excluded);
22
22
  if (hidden) return null;
23
- return React__default['default'].createElement(Tab$1, defaultTheme._extends({
23
+ return React__default["default"].createElement(Tab$1, defaultTheme._extends({
24
24
  ref: forwardedRef
25
25
  }, props), children);
26
26
  });
package/{Tabs-116aa951.js → Tabs-cfc08c6b.js} RENAMED
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-ea44e34a.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var lodash = require('lodash');
5
5
  var React = require('react');
6
- var Tab = require('./Tab-f499ecbc.js');
6
+ var Tab = require('./Tab-e43241f0.js');
7
7
  var styled = require('styled-components');
8
8
 
9
9
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -12,15 +12,15 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
 
14
14
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
15
- var Tabs$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n ", ";\n"])), function (props) {
15
+ var Tabs$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n ", ";\n"])), function (props) {
16
16
  return props.backgroundColor && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n background-color: ", ";\n "])), props.backgroundColor);
17
17
  });
18
- var TabHeaders = styled__default['default'].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n\n margin: 0;\n ", ";\n ", ";\n"])), function (props) {
18
+ var TabHeaders = styled__default["default"].ul.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n gap: 24px;\n\n margin: 0;\n ", ";\n ", ";\n"])), function (props) {
19
19
  return !props.customPadding && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n padding: 0;\n "])));
20
20
  }, function (props) {
21
21
  return props.customPadding && styled.css(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n padding: 0 ", ";\n "])), props.customPadding);
22
22
  });
23
- var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
23
+ var TabHeader = styled__default["default"].li.attrs(defaultTheme.applyDefaultTheme)(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n text-transform: uppercase;\n font-weight: 600;\n font-size: 0.875rem;\n display: flex;\n padding-bottom: 8px;\n letter-spacing: 0.6px;\n cursor: pointer;\n border-bottom: 1px solid;\n border-color: transparent;\n margin-bottom: 1px;\n\n ", ";\n &&:hover:not(:focus) {\n ", ";\n }\n"])), function (props) {
24
24
  return props.theme.secondaryFontFamily;
25
25
  }, function (props) {
26
26
  return props.active && styled.css(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), function (props) {
@@ -41,8 +41,8 @@ var TabHeader = styled__default['default'].li.attrs(defaultTheme.applyDefaultThe
41
41
  }
42
42
  });
43
43
  });
44
- var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n"])));
45
- var TabHeaderBorder = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
44
+ var TabContent = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n"])));
45
+ var TabHeaderBorder = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n border-top: 1px solid;\n\n ", ";\n ", ";\n ", ";\n"])), function (props) {
46
46
  return props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5');
47
47
  }, function (props) {
48
48
  return !props.customPadding && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px 0;\n "])));
@@ -50,42 +50,34 @@ var TabHeaderBorder = styled__default['default'].div.attrs(defaultTheme.applyDef
50
50
  return props.customPadding && styled.css(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n margin: -2px ", ";\n "])), props.customPadding);
51
51
  });
52
52
 
53
- var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef) {
53
+ var _excluded = ["children", "defaultMinHeight", "customPadding"];
54
+ var Tabs = React__default["default"].forwardRef(function Tabs(_ref, forwardedRef) {
54
55
  var children = _ref.children,
55
- defaultMinHeight = _ref.defaultMinHeight,
56
- customPadding = _ref.customPadding,
57
- props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight", "customPadding"]);
58
-
56
+ defaultMinHeight = _ref.defaultMinHeight,
57
+ customPadding = _ref.customPadding,
58
+ props = defaultTheme._objectWithoutProperties(_ref, _excluded);
59
59
  var _useState = React.useState(0),
60
- _useState2 = defaultTheme._slicedToArray(_useState, 2),
61
- activeTab = _useState2[0],
62
- setActiveTab = _useState2[1];
63
-
60
+ _useState2 = defaultTheme._slicedToArray(_useState, 2),
61
+ activeTab = _useState2[0],
62
+ setActiveTab = _useState2[1];
64
63
  var contentRef = React.useRef(null);
65
64
  var tabs = React.useMemo(function () {
66
65
  var tabs = [];
67
-
68
66
  function extractChildren(children) {
69
67
  React.Children.forEach(children, function (child, index) {
70
68
  var _child$props2;
71
-
72
69
  if (lodash.isNil(child)) {
73
70
  return null;
74
71
  }
75
-
76
72
  if (child.type === React.Fragment) {
77
73
  var _child$props;
78
-
79
74
  extractChildren((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children);
80
75
  }
81
-
82
76
  if ((_child$props2 = child.props) !== null && _child$props2 !== void 0 && _child$props2.hidden) {
83
77
  return null;
84
78
  }
85
-
86
79
  if (child.type === Tab.Tab) {
87
80
  var _child$props3, _child$props4;
88
-
89
81
  tabs.push({
90
82
  key: index,
91
83
  trigger: (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.trigger,
@@ -94,27 +86,23 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
94
86
  }
95
87
  });
96
88
  }
97
-
98
89
  extractChildren(children);
99
-
100
90
  if (!tabs.some(function (tab) {
101
91
  return (tab === null || tab === void 0 ? void 0 : tab.key) === activeTab;
102
92
  })) {
103
93
  var _tabs$;
104
-
105
94
  setActiveTab((_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key);
106
95
  }
107
-
108
96
  return tabs;
109
97
  }, [children]);
110
- return React__default['default'].createElement(Tabs$1, defaultTheme._extends({
98
+ return React__default["default"].createElement(Tabs$1, defaultTheme._extends({
111
99
  ref: forwardedRef
112
100
  }, props, {
113
101
  role: "tablist"
114
- }), React__default['default'].createElement(TabHeaders, {
102
+ }), React__default["default"].createElement(TabHeaders, {
115
103
  customPadding: customPadding
116
104
  }, tabs.map(function (tab) {
117
- return React__default['default'].createElement(TabHeader, {
105
+ return React__default["default"].createElement(TabHeader, {
118
106
  key: tab.key,
119
107
  hidden: tab.hidden,
120
108
  active: tab.key === activeTab,
@@ -123,10 +111,10 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
123
111
  },
124
112
  role: "tab"
125
113
  }, tab.trigger);
126
- })), React__default['default'].createElement(TabHeaderBorder, {
114
+ })), React__default["default"].createElement(TabHeaderBorder, {
127
115
  customPadding: customPadding
128
- }), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
129
- return React__default['default'].createElement("div", {
116
+ }), React__default["default"].createElement(TabContent, null, tabs.map(function (tab) {
117
+ return React__default["default"].createElement("div", {
130
118
  ref: tab.key === (activeTab === null || activeTab === void 0 ? void 0 : activeTab.key) ? contentRef : null,
131
119
  key: tab.key,
132
120
  role: "tabpanel",