@ntbjs/react-components 1.2.0-rc.12 → 1.2.0-rc.14

package/{AssetGallery-d82e2298.js → AssetGallery-0ae4f093.js}

@@ -5,23 +5,23 @@ var lodash = require('lodash');
 var React = require('react');
 var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
 var ResizeObserver = require('resize-observer-polyfill');
-var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-418de626.js');
+var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-128ab199.js');
 var styled = require('styled-components');
 var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
 var warningCircle = require('./warning-circle-24522402.js');
 var Alert = require('./Alert-13b75102.js');
 var Badge = require('./Badge-aec841c8.js');
-var Popover = require('./Popover-6afb3779.js');
+var Popover = require('./Popover-e4ecb887.js');
 require('./Tab-f499ecbc.js');
-require('./Tabs-c2261e7e.js');
+require('./Tabs-4d7742bc.js');
 var Tooltip = require('./Tooltip-6b6f0b0a.js');
 require('./VerificationStatusIcon-b574fd21.js');
 var ActionButton = require('./ActionButton-06df3d6c.js');
-require('./Button-353f5bbc.js');
+require('./Button-c38d56a0.js');
 require('./Checkbox-68dc38a8.js');
 require('./CompactAutocompleteSelect-43e79e21.js');
 require('./CompactStarRating-9c81ca6e.js');
-require('./CompactTextInput-8d1aae0f.js');
+require('./CompactTextInput-eab4869f.js');
 require('./MultiSelect-4b8d3d0d.js');
 require('./Radio-32d0513a.js');
 require('./TextArea-b0125a43.js');

package/{Button-353f5bbc.js → Button-c38d56a0.js}

@@ -3,7 +3,7 @@
 var defaultTheme = require('./defaultTheme-ea44e34a.js');
 var React = require('react');
 var styled = require('styled-components');
-var Popover = require('./Popover-6afb3779.js');
+var Popover = require('./Popover-e4ecb887.js');
 var ContextMenu = require('./ContextMenu-4ec3d9f3.js');
 var expandMore = require('./expand-more-94585605.js');
 

package/{CompactTextInput-8d1aae0f.js → CompactTextInput-eab4869f.js}

@@ -7,9 +7,9 @@ var React = require('react');
 var editNote = require('./edit-note-c47d292e.js');
 require('./Alert-13b75102.js');
 require('./Badge-aec841c8.js');
-require('./Popover-6afb3779.js');
+require('./Popover-e4ecb887.js');
 require('./Tab-f499ecbc.js');
-require('./Tabs-c2261e7e.js');
+require('./Tabs-4d7742bc.js');
 var Tooltip = require('./Tooltip-6b6f0b0a.js');
 require('./VerificationStatusIcon-b574fd21.js');
 var styled = require('styled-components');

package/{MultiLevelCheckboxSelect-418de626.js → MultiLevelCheckboxSelect-128ab199.js}

@@ -5,9 +5,9 @@ var React = require('react');
 var styled = require('styled-components');
 require('./Alert-13b75102.js');
 require('./Badge-aec841c8.js');
-var Popover = require('./Popover-6afb3779.js');
+var Popover = require('./Popover-e4ecb887.js');
 require('./Tab-f499ecbc.js');
-require('./Tabs-c2261e7e.js');
+require('./Tabs-4d7742bc.js');
 require('./Tooltip-6b6f0b0a.js');
 require('./VerificationStatusIcon-b574fd21.js');
 var Checkbox = require('./Checkbox-68dc38a8.js');
@@ -371,20 +371,20 @@ CheckboxTree.propTypes = process.env.NODE_ENV !== "production" ? {
   node: defaultTheme.PropTypes.shape({
     label: defaultTheme.PropTypes.string.isRequired,
     value: defaultTheme.PropTypes.any.isRequired,
-    children: defaultTheme.PropTypes.shape({
+    children: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.shape({
       label: defaultTheme.PropTypes.string.isRequired,
       value: defaultTheme.PropTypes.any.isRequired,
       children: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.any)
-    })
+    }))
   }),
   nodes: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.shape({
     label: defaultTheme.PropTypes.string.isRequired,
     value: defaultTheme.PropTypes.any.isRequired,
-    children: defaultTheme.PropTypes.shape({
+    children: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.shape({
       label: defaultTheme.PropTypes.string.isRequired,
       value: defaultTheme.PropTypes.any.isRequired,
       children: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.any)
-    })
+    }))
   })),
   checked: defaultTheme.PropTypes.array.isRequired,
   search: defaultTheme.PropTypes.string,
@@ -392,7 +392,7 @@ CheckboxTree.propTypes = process.env.NODE_ENV !== "production" ? {
   onRemove: defaultTheme.PropTypes.func.isRequired
 } : {};
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
 var MultiLevelCheckboxSelect$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  font-family: ", ";\n"])), function (props) {
   return props.theme.primaryFontFamily;
 });
@@ -412,8 +412,12 @@ var Label = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)
   return props.theme.themeProp('background', "linear-gradient(0deg, ".concat(props.theme.getColor('gray-900'), " calc(50% + 1px), transparent 50%)"), "linear-gradient(0deg, ".concat(props.theme.getColor('white'), " calc(50% + 1px), transparent 50%)"));
 });
 var Placeholder = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n  font-size: 0.875rem;\n  line-height: 26px;\n  padding-left: 4px;\n  opacity: 0.4;\n"])));
-var SearchContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n  padding: 12px 8px;\n"])));
-var OptionsContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n  padding: 12px 8px;\n  overflow: auto;\n  max-height: 400px;\n"])));
+var PopoverContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n  max-height: inherit;\n  display: flex;\n  flex-direction: column;\n"])));
+var PopoverHeader = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n  ", "\n"])), function (props) {
+  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
+});
+var SearchContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n  padding: 12px 8px;\n"])));
+var OptionsContainer = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n  padding: 12px 8px;\n  overflow: auto;\n  box-sizing: border-box;\n"])));
 
 var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
 
@@ -439,49 +443,6 @@ function useEventListener(eventName, handler, element, options) {
   }, [eventName, element, options]);
 }
 
-function useElementSize(ref) {
-  var delayWindowResizeUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-
-  var _useState = React.useState({
-    width: 0,
-    height: 0
-  }),
-      _useState2 = defaultTheme._slicedToArray(_useState, 2),
-      size = _useState2[0],
-      setSize = _useState2[1];
-
-  var handleSize = function handleSize() {
-    var _ref$current, _ref$current2;
-
-    var newWidth = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.offsetWidth;
-    var newHeight = (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.offsetHeight;
-    if (size.width !== newWidth || size.height !== newHeight) setSize({
-      width: newWidth !== null && newWidth !== void 0 ? newWidth : 0,
-      height: newHeight !== null && newHeight !== void 0 ? newHeight : 0
-    });
-  };
-
-  useEventListener('resize', debounce(handleSize, delayWindowResizeUpdate));
-  React.useEffect(function () {
-    handleSize();
-  });
-  return size;
-}
-
-function debounce(fn, delay) {
-  var timer = null;
-  return function () {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    if (timer) clearTimeout(timer);
-    timer = setTimeout(function () {
-      fn.apply(void 0, args);
-    }, delay);
-  };
-}
-
 function useOnClickOutside(ref, handler) {
   var mouseEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'mousedown';
   useEventListener(mouseEvent, function (event) {
@@ -552,9 +513,6 @@ var MultiLevelCheckboxSelect = React__default['default'].forwardRef(function Mul
       open = _useState4[0],
       setOpen = _useState4[1];
 
-  var _useElementSize = useElementSize(inputRef),
-      width = _useElementSize.width;
-
   var handleClickInside = React.useCallback(function () {
     var _searchInputRef$curre;
 
@@ -600,7 +558,7 @@ var MultiLevelCheckboxSelect = React__default['default'].forwardRef(function Mul
 
     iterate(options);
     return checkedParents.sort();
-  }, [options, checkedProp]);
+  }, [JSON.stringify(options), JSON.stringify(checkedProp)]);
   var getLabelByValue = React.useCallback(function (targetValue) {
     var nodes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : options;
 
@@ -669,12 +627,23 @@ var MultiLevelCheckboxSelect = React__default['default'].forwardRef(function Mul
     arrow: false,
     placement: 'bottom',
     offset: [0, 6],
-    content: React__default['default'].createElement("div", {
-      ref: popoverContentRef,
-      style: {
-        minWidth: width - 2
+    modifiers: [{
+      name: 'sameWidth',
+      enabled: true,
+      phase: 'beforeWrite',
+      requires: ['computeStyles'],
+      fn: function fn(_ref2) {
+        var state = _ref2.state;
+        state.styles.popper.width = "".concat(state.rects.reference.width, "px");
+      },
+      effect: function effect(_ref3) {
+        var state = _ref3.state;
+        state.elements.popper.style.width = "".concat(state.elements.reference.offsetWidth, "px");
       }
-    }, React__default['default'].createElement(SearchContainer, null, React__default['default'].createElement(TextInput.TextInput, {
+    }],
+    content: React__default['default'].createElement(PopoverContainer, {
+      ref: popoverContentRef
+    }, React__default['default'].createElement(PopoverHeader, null, React__default['default'].createElement(SearchContainer, null, React__default['default'].createElement(TextInput.TextInput, {
       ref: searchInputRef,
       onBlur: function onBlur(e) {
         if (open) {
@@ -686,7 +655,7 @@ var MultiLevelCheckboxSelect = React__default['default'].forwardRef(function Mul
       onChange: function onChange(e) {
         return setSearchString(e.target.value);
       }
-    })), React__default['default'].createElement(SectionSeparator.SectionSeparator, null), React__default['default'].createElement(OptionsContainer, null, React__default['default'].createElement(MultiLevelCheckbox, {
+    })), React__default['default'].createElement(SectionSeparator.SectionSeparator, null)), React__default['default'].createElement(OptionsContainer, null, React__default['default'].createElement(MultiLevelCheckbox, {
       options: options,
       checked: checkedProp,
       search: searchString,

package/{Popover-6afb3779.js → Popover-e4ecb887.js}

@@ -7,15 +7,17 @@ var styled = require('styled-components');
 var polished = require('polished');
 var TippyTooltip = require('@tippyjs/react');
 require('./shift-away-subtle-0bed9a3c.js');
+var maxSize = require('popper-max-size-modifier');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 var TippyTooltip__default = /*#__PURE__*/_interopDefaultLegacy(TippyTooltip);
+var maxSize__default = /*#__PURE__*/_interopDefaultLegacy(maxSize);
 
 var _templateObject, _templateObject2, _templateObject3;
-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\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  .tippy-content {\n    padding: 0;\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) {
+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) {
   return props.theme.primaryFontFamily;
 }, function (props) {
   return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
@@ -55,7 +57,8 @@ var Popover = React__default['default'].forwardRef(function Popover(_ref, ref) {
       contextMenu = _ref.contextMenu,
       contextMenuSublevel = _ref.contextMenuSublevel,
       children = _ref.children,
-      props = defaultTheme._objectWithoutProperties(_ref, ["content", "interactive", "placement", "duration", "trigger", "offset", "arrow", "visible", "contextMenu", "contextMenuSublevel", "children"]);
+      modifiers = _ref.modifiers,
+      props = defaultTheme._objectWithoutProperties(_ref, ["content", "interactive", "placement", "duration", "trigger", "offset", "arrow", "visible", "contextMenu", "contextMenuSublevel", "children", "modifiers"]);
 
   var errorOffset = React.useMemo(function () {
     return arrow ? 15 : 0;
@@ -87,6 +90,27 @@ var Popover = React__default['default'].forwardRef(function Popover(_ref, ref) {
     offset: [offset[0], offset[1] + errorOffset],
     arrow: contextMenu ? false : arrow,
     visible: visible,
+    popperOptions: {
+      modifiers: [defaultTheme._objectSpread2(defaultTheme._objectSpread2({}, maxSize__default['default']), {}, {
+        options: {
+          boundary: 'viewport',
+          rootBoundary: 'viewport',
+          padding: 10
+        }
+      }), {
+        name: 'applyMaxSize',
+        enabled: true,
+        phase: 'beforeWrite',
+        requires: ['maxSize'],
+        fn: function fn(_ref2) {
+          var state = _ref2.state;
+          var height = state.modifiersData.maxSize.height;
+          state.styles.popper = defaultTheme._objectSpread2(defaultTheme._objectSpread2({}, state.styles.popper), {}, {
+            maxHeight: "".concat(height, "px")
+          });
+        }
+      }].concat(defaultTheme._toConsumableArray(modifiers))
+    },
     onShown: contextMenu ? handleContextMenuItemClick : undefined
   }, props), children);
 });
@@ -99,6 +123,7 @@ Popover.propTypes = process.env.NODE_ENV !== "production" ? {
   offset: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.number),
   arrow: defaultTheme.PropTypes.bool,
   visible: defaultTheme.PropTypes.bool,
+  modifiers: defaultTheme.PropTypes.array,
   contextMenu: defaultTheme.PropTypes.bool,
   contextMenuSublevel: defaultTheme.PropTypes.bool,
   children: defaultTheme.PropTypes.node.isRequired
@@ -114,7 +139,8 @@ Popover.defaultProps = {
   arrow: true,
   visible: undefined,
   contextMenu: false,
-  contextMenuSublevel: false
+  contextMenuSublevel: false,
+  modifiers: []
 };
 
 exports.Popover = Popover;

package/{Tabs-c2261e7e.js → Tabs-4d7742bc.js}

@@ -43,9 +43,8 @@ var TabContent = styled__default['default'].div.attrs(defaultTheme.applyDefaultT
 
 var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef) {
   var children = _ref.children,
-      minHeight = _ref.minHeight,
       defaultMinHeight = _ref.defaultMinHeight,
-      props = defaultTheme._objectWithoutProperties(_ref, ["children", "minHeight", "defaultMinHeight"]);
+      props = defaultTheme._objectWithoutProperties(_ref, ["children", "defaultMinHeight"]);
 
   var _useState = React.useState(0),
       _useState2 = defaultTheme._slicedToArray(_useState, 2),
@@ -54,33 +53,10 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
 
   var _useState3 = React.useState(),
       _useState4 = defaultTheme._slicedToArray(_useState3, 2),
-      firstTab = _useState4[0],
-      setFirstTab = _useState4[1];
-
-  var _useState5 = React.useState(),
-      _useState6 = defaultTheme._slicedToArray(_useState5, 2),
-      minTabHeight = _useState6[0],
-      setMinTabHeight = _useState6[1];
-
-  var _useState7 = React.useState(),
-      _useState8 = defaultTheme._slicedToArray(_useState7, 2),
-      defaultHeight = _useState8[0],
-      setDefaultHeight = _useState8[1];
+      defaultHeight = _useState4[0],
+      setDefaultHeight = _useState4[1];
 
   var contentRef = React.useRef(null);
-  var visibleTabs = [];
-  React.useEffect(function () {
-    if ((visibleTabs === null || visibleTabs === void 0 ? void 0 : visibleTabs.length) > 0) {
-      setActiveTab(visibleTabs[0].key);
-      setFirstTab(visibleTabs[0]);
-    }
-  }, []);
-  React.useLayoutEffect(function () {
-    if (contentRef.current) {
-      var height = contentRef.current.offsetHeight;
-      setMinTabHeight(height);
-    }
-  }, [firstTab]);
   React.useEffect(function () {
     setDefaultHeight(defaultMinHeight);
   }, []);
@@ -97,11 +73,7 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
           return null;
         }
 
-        if (child.type === Tab.Tab && !lodash.isEmpty(child.props.trigger)) {
-          visibleTabs.push({
-            key: index,
-            content: child.props.children
-          });
+        if (child.type === Tab.Tab) {
           tabs.push({
             key: index,
             trigger: child.props.trigger,
@@ -130,24 +102,22 @@ var Tabs = React__default['default'].forwardRef(function Tabs(_ref, forwardedRef
     }, tab.trigger);
   })), React__default['default'].createElement(TabContent, null, tabs.map(function (tab) {
     return React__default['default'].createElement("div", {
-      ref: tab.key === (firstTab === null || firstTab === void 0 ? void 0 : firstTab.key) ? contentRef : null,
+      ref: tab.key === (activeTab === null || activeTab === void 0 ? void 0 : activeTab.key) ? contentRef : null,
       key: tab.key,
       role: "tabpanel",
       hidden: tab.key !== activeTab,
       style: {
-        minHeight: minHeight ? minTabHeight : !lodash.isEmpty(defaultHeight) ? defaultHeight : ''
+        minHeight: !lodash.isEmpty(defaultHeight) ? defaultHeight : ''
       }
     }, tab.content);
   })));
 });
 Tabs.defaultProps = {
-  minHeight: false,
   defaultMinHeight: ''
 };
 Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
   children: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.array, defaultTheme.PropTypes.object]),
   backgroundColor: defaultTheme.PropTypes.string,
-  minHeight: defaultTheme.PropTypes.bool,
   defaultMinHeight: defaultTheme.PropTypes.string
 } : {};
 

package/data/Popover/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Popover = require('../../Popover-6afb3779.js');
+var Popover = require('../../Popover-e4ecb887.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
@@ -8,6 +8,7 @@ require('react');
 require('polished');
 require('@tippyjs/react');
 require('../../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 
 
 

package/data/Tabs/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Tabs = require('../../Tabs-c2261e7e.js');
+var Tabs = require('../../Tabs-4d7742bc.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');

package/data/index.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var Alert = require('../Alert-13b75102.js');
 var Badge = require('../Badge-aec841c8.js');
-var Popover = require('../Popover-6afb3779.js');
+var Popover = require('../Popover-e4ecb887.js');
 var Tab = require('../Tab-f499ecbc.js');
-var Tabs = require('../Tabs-c2261e7e.js');
+var Tabs = require('../Tabs-4d7742bc.js');
 var Tooltip = require('../Tooltip-6b6f0b0a.js');
 var VerificationStatusIcon = require('../VerificationStatusIcon-b574fd21.js');
 require('../defaultTheme-ea44e34a.js');
@@ -16,6 +16,7 @@ require('lodash');
 require('polished');
 require('@tippyjs/react');
 require('../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 
 
 

package/inputs/Button/index.js

@@ -1,14 +1,15 @@
 'use strict';
 
-var Button = require('../../Button-353f5bbc.js');
+var Button = require('../../Button-c38d56a0.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
-require('../../Popover-6afb3779.js');
+require('../../Popover-e4ecb887.js');
 require('lodash');
 require('polished');
 require('@tippyjs/react');
 require('../../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 require('../../ContextMenu-4ec3d9f3.js');
 require('../../expand-more-94585605.js');
 

package/inputs/CompactTextInput/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var CompactTextInput = require('../../CompactTextInput-8d1aae0f.js');
+var CompactTextInput = require('../../CompactTextInput-eab4869f.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
@@ -9,12 +9,13 @@ require('react');
 require('../../edit-note-c47d292e.js');
 require('../../Alert-13b75102.js');
 require('../../Badge-aec841c8.js');
-require('../../Popover-6afb3779.js');
+require('../../Popover-e4ecb887.js');
 require('polished');
 require('@tippyjs/react');
 require('../../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 require('../../Tab-f499ecbc.js');
-require('../../Tabs-c2261e7e.js');
+require('../../Tabs-4d7742bc.js');
 require('../../Tooltip-6b6f0b0a.js');
 require('../../VerificationStatusIcon-b574fd21.js');
 

package/inputs/index.js

@@ -3,25 +3,26 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var ActionButton = require('../ActionButton-06df3d6c.js');
-var Button = require('../Button-353f5bbc.js');
+var Button = require('../Button-c38d56a0.js');
 var Checkbox = require('../Checkbox-68dc38a8.js');
 var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-43e79e21.js');
 var CompactStarRating = require('../CompactStarRating-9c81ca6e.js');
-var CompactTextInput = require('../CompactTextInput-8d1aae0f.js');
+var CompactTextInput = require('../CompactTextInput-eab4869f.js');
 var MultiSelect = require('../MultiSelect-4b8d3d0d.js');
 var Radio = require('../Radio-32d0513a.js');
 var TextArea = require('../TextArea-b0125a43.js');
 var TextInput = require('../TextInput-0d109708.js');
 var Switch = require('../Switch-4a41585f.js');
-var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-418de626.js');
+var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-128ab199.js');
 require('../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');
 require('polished');
-require('../Popover-6afb3779.js');
+require('../Popover-e4ecb887.js');
 require('lodash');
 require('@tippyjs/react');
 require('../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 require('../ContextMenu-4ec3d9f3.js');
 require('../expand-more-94585605.js');
 require('nanoid');
@@ -34,7 +35,7 @@ require('../edit-note-c47d292e.js');
 require('../Alert-13b75102.js');
 require('../Badge-aec841c8.js');
 require('../Tab-f499ecbc.js');
-require('../Tabs-c2261e7e.js');
+require('../Tabs-4d7742bc.js');
 require('../Tooltip-6b6f0b0a.js');
 require('../VerificationStatusIcon-b574fd21.js');
 require('../useMergedRefs-b6d2f8fc.js');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "1.2.0-rc.12",
+  "version": "1.2.0-rc.14",
   "description": "NTBs common front-end design utilities and React components.",
   "scripts": {
     "build": "cross-env NODE_ENV=production rollup -c",
@@ -78,6 +78,7 @@
     "lodash": "^4.17.21",
     "nanoid": "^3.1.25",
     "polished": "^4.1.3",
+    "popper-max-size-modifier": "^0.2.0",
     "react-lazy-load-image-component": "^1.5.1",
     "react-select": "^5.7.7",
     "react-select-async-paginate": "^0.7.3",

package/widgets/AssetGallery/index.js

@@ -1,21 +1,22 @@
 'use strict';
 
-var AssetGallery = require('../../AssetGallery-d82e2298.js');
+var AssetGallery = require('../../AssetGallery-0ae4f093.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
 require('react');
 require('../../useMergedRefs-b6d2f8fc.js');
 require('resize-observer-polyfill');
-require('../../MultiLevelCheckboxSelect-418de626.js');
+require('../../MultiLevelCheckboxSelect-128ab199.js');
 require('../../Alert-13b75102.js');
 require('../../Badge-aec841c8.js');
-require('../../Popover-6afb3779.js');
+require('../../Popover-e4ecb887.js');
 require('polished');
 require('@tippyjs/react');
 require('../../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 require('../../Tab-f499ecbc.js');
-require('../../Tabs-c2261e7e.js');
+require('../../Tabs-4d7742bc.js');
 require('../../Tooltip-6b6f0b0a.js');
 require('../../VerificationStatusIcon-b574fd21.js');
 require('../../Checkbox-68dc38a8.js');
@@ -28,7 +29,7 @@ require('../../close-ebf2f3cf.js');
 require('react-lazy-load-image-component');
 require('../../warning-circle-24522402.js');
 require('../../ActionButton-06df3d6c.js');
-require('../../Button-353f5bbc.js');
+require('../../Button-c38d56a0.js');
 require('../../ContextMenu-4ec3d9f3.js');
 require('../../expand-more-94585605.js');
 require('../../CompactAutocompleteSelect-43e79e21.js');
@@ -37,7 +38,7 @@ require('react-select-async-paginate');
 require('../../react-select-creatable.esm-2f23d6c6.js');
 require('react-dom');
 require('../../CompactStarRating-9c81ca6e.js');
-require('../../CompactTextInput-8d1aae0f.js');
+require('../../CompactTextInput-eab4869f.js');
 require('../../MultiSelect-4b8d3d0d.js');
 require('../../Radio-32d0513a.js');
 require('../../TextArea-b0125a43.js');

package/widgets/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var AssetGallery = require('../AssetGallery-d82e2298.js');
+var AssetGallery = require('../AssetGallery-0ae4f093.js');
 var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
 var AssetPreviewTopBar = require('../AssetPreviewTopBar-c28715f7.js');
 var Instructions = require('../Instructions-92d9cb6f.js');
@@ -12,15 +12,16 @@ require('lodash');
 require('react');
 require('../useMergedRefs-b6d2f8fc.js');
 require('resize-observer-polyfill');
-require('../MultiLevelCheckboxSelect-418de626.js');
+require('../MultiLevelCheckboxSelect-128ab199.js');
 require('../Alert-13b75102.js');
 require('../Badge-aec841c8.js');
-require('../Popover-6afb3779.js');
+require('../Popover-e4ecb887.js');
 require('polished');
 require('@tippyjs/react');
 require('../shift-away-subtle-0bed9a3c.js');
+require('popper-max-size-modifier');
 require('../Tab-f499ecbc.js');
-require('../Tabs-c2261e7e.js');
+require('../Tabs-4d7742bc.js');
 require('../Tooltip-6b6f0b0a.js');
 require('../VerificationStatusIcon-b574fd21.js');
 require('../Checkbox-68dc38a8.js');
@@ -33,7 +34,7 @@ require('../close-ebf2f3cf.js');
 require('react-lazy-load-image-component');
 require('../warning-circle-24522402.js');
 require('../ActionButton-06df3d6c.js');
-require('../Button-353f5bbc.js');
+require('../Button-c38d56a0.js');
 require('../expand-more-94585605.js');
 require('../CompactAutocompleteSelect-43e79e21.js');
 require('react-select');
@@ -41,7 +42,7 @@ require('react-select-async-paginate');
 require('../react-select-creatable.esm-2f23d6c6.js');
 require('react-dom');
 require('../CompactStarRating-9c81ca6e.js');
-require('../CompactTextInput-8d1aae0f.js');
+require('../CompactTextInput-eab4869f.js');
 require('../MultiSelect-4b8d3d0d.js');
 require('../Radio-32d0513a.js');
 require('../TextArea-b0125a43.js');