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

package/{AssetGallery-d82e2298.js → AssetGallery-d2914de2.js}

@@ -5,26 +5,26 @@ 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-c4060a73.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');
 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-c7d0ac82.js');
 require('./MultiSelect-4b8d3d0d.js');
 require('./Radio-32d0513a.js');
-require('./TextArea-b0125a43.js');
+require('./TextArea-9ddf9649.js');
 require('./TextInput-0d109708.js');
 require('./Switch-4a41585f.js');
 var ContextMenu = require('./ContextMenu-4ec3d9f3.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-c7d0ac82.js}

@@ -7,7 +7,7 @@ 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');
 var Tooltip = require('./Tooltip-6b6f0b0a.js');

package/{Instructions-92d9cb6f.js → Instructions-ea9e5aa9.js}

@@ -5,7 +5,7 @@ var lodash = require('lodash');
 var React = require('react');
 var warningCircle = require('./warning-circle-24522402.js');
 var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-43e79e21.js');
-var TextArea = require('./TextArea-b0125a43.js');
+var TextArea = require('./TextArea-9ddf9649.js');
 var styled = require('styled-components');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/{MultiLevelCheckboxSelect-418de626.js → MultiLevelCheckboxSelect-c4060a73.js}

@@ -5,7 +5,7 @@ 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('./Tooltip-6b6f0b0a.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/{TextArea-b0125a43.js → TextArea-9ddf9649.js}

@@ -187,29 +187,24 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
       inputIsEmpty = _useState2[0],
       setInputIsEmpty = _useState2[1];
 
-  var _useState3 = React.useState(''),
+  var _useState3 = React.useState(false),
       _useState4 = defaultTheme._slicedToArray(_useState3, 2),
-      maxContentRows = _useState4[0],
-      setMaxContentRows = _useState4[1];
+      expanded = _useState4[0],
+      setExpanded = _useState4[1];
 
-  var _useState5 = React.useState(false),
+  var _useState5 = React.useState(''),
       _useState6 = defaultTheme._slicedToArray(_useState5, 2),
-      expanded = _useState6[0],
-      setExpanded = _useState6[1];
+      maxHeight = _useState6[0],
+      setMaxHeight = _useState6[1];
 
   var _useState7 = React.useState(''),
       _useState8 = defaultTheme._slicedToArray(_useState7, 2),
-      maxHeight = _useState8[0],
-      setMaxHeight = _useState8[1];
+      defaultHeight = _useState8[0],
+      setDefaultHeight = _useState8[1];
 
-  var _useState9 = React.useState(''),
-      _useState10 = defaultTheme._slicedToArray(_useState9, 2),
-      defaultHeight = _useState10[0],
-      setDefaultHeight = _useState10[1];
-
-  var _useState11 = React.useState(nanoid.nanoid()),
-      _useState12 = defaultTheme._slicedToArray(_useState11, 1),
-      uniqueId = _useState12[0];
+  var _useState9 = React.useState(nanoid.nanoid()),
+      _useState10 = defaultTheme._slicedToArray(_useState9, 1),
+      uniqueId = _useState10[0];
 
   var handleTextAreaChange = function handleTextAreaChange() {
     setExpanded(true);
@@ -229,7 +224,6 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
       var lineHeight = 16;
       var calculatedRows = Math.floor(textAreaHeight / lineHeight);
       var defaultRowsHeight = rows * lineHeight;
-      setMaxContentRows(calculatedRows);
 
       if (calculatedRows > rows) {
         setDefaultHeight(defaultRowsHeight);
@@ -303,7 +297,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
     inputIsEmpty: inputIsEmpty
   }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default['default'].createElement(Description, {
     type: type
-  }, description), maxContentRows > rows && showMore && React__default['default'].createElement(ShowMoreText, {
+  }, description), showMore && React__default['default'].createElement(ShowMoreText, {
     onClick: showMore ? handleTextAreaShowLess : undefined,
     expanded: expanded
   }, !expanded ? showMoreText : showLessText));

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/index.js

@@ -4,7 +4,7 @@ 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 Tooltip = require('../Tooltip-6b6f0b0a.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-c7d0ac82.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
@@ -9,10 +9,11 @@ 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('../../Tooltip-6b6f0b0a.js');

package/inputs/TextArea/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var TextArea = require('../../TextArea-b0125a43.js');
+var TextArea = require('../../TextArea-9ddf9649.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');

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-c7d0ac82.js');
 var MultiSelect = require('../MultiSelect-4b8d3d0d.js');
 var Radio = require('../Radio-32d0513a.js');
-var TextArea = require('../TextArea-b0125a43.js');
+var TextArea = require('../TextArea-9ddf9649.js');
 var TextInput = require('../TextInput-0d109708.js');
 var Switch = require('../Switch-4a41585f.js');
-var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-418de626.js');
+var MultiLevelCheckboxSelect = require('../MultiLevelCheckboxSelect-c4060a73.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');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "1.2.0-rc.12",
+  "version": "1.2.0-rc.13",
   "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,19 +1,20 @@
 'use strict';
 
-var AssetGallery = require('../../AssetGallery-d82e2298.js');
+var AssetGallery = require('../../AssetGallery-d2914de2.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-c4060a73.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('../../Tooltip-6b6f0b0a.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,10 +38,10 @@ 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-c7d0ac82.js');
 require('../../MultiSelect-4b8d3d0d.js');
 require('../../Radio-32d0513a.js');
-require('../../TextArea-b0125a43.js');
+require('../../TextArea-9ddf9649.js');
 require('../../Switch-4a41585f.js');
 require('../../ContextMenuItem-1fe17ed5.js');
 

package/widgets/Instructions/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Instructions = require('../../Instructions-92d9cb6f.js');
+var Instructions = require('../../Instructions-ea9e5aa9.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
@@ -14,7 +14,7 @@ require('../../react-select-creatable.esm-2f23d6c6.js');
 require('react-dom');
 require('../../close-ebf2f3cf.js');
 require('../../expand-more-94585605.js');
-require('../../TextArea-b0125a43.js');
+require('../../TextArea-9ddf9649.js');
 require('../../useMergedRefs-b6d2f8fc.js');
 require('../../edit-note-c47d292e.js');
 

package/widgets/index.js

@@ -2,23 +2,24 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var AssetGallery = require('../AssetGallery-d82e2298.js');
+var AssetGallery = require('../AssetGallery-d2914de2.js');
 var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
 var AssetPreviewTopBar = require('../AssetPreviewTopBar-c28715f7.js');
-var Instructions = require('../Instructions-92d9cb6f.js');
+var Instructions = require('../Instructions-ea9e5aa9.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-c4060a73.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('../Tooltip-6b6f0b0a.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,10 +42,10 @@ 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-c7d0ac82.js');
 require('../MultiSelect-4b8d3d0d.js');
 require('../Radio-32d0513a.js');
-require('../TextArea-b0125a43.js');
+require('../TextArea-9ddf9649.js');
 require('../Switch-4a41585f.js');
 require('../ContextMenuItem-1fe17ed5.js');