@luminati-io/uikit 6.3.8 → 6.3.9

package/dist/umd/uikit.development.js

@@ -36695,10 +36695,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _hoc__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../hoc */ "./src/hoc/index.js");
-/* harmony import */ var _icon_button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../icon_button */ "./src/icon_button.js");
-/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../layout */ "./src/layout/index.js");
-/* harmony import */ var _menu__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../menu */ "./src/menu/index.js");
+/* harmony import */ var _icon_button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../icon_button */ "./src/icon_button.js");
+/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../layout */ "./src/layout/index.js");
+/* harmony import */ var _menu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../menu */ "./src/menu/index.js");
+/* harmony import */ var _popover__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../popover */ "./src/popover/index.js");
 /* harmony import */ var _divider__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./divider */ "./src/breadcrumbs/divider.js");
 // LICENSE_CODE ZON
 
@@ -36710,6 +36710,12 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 
 
 
@@ -36718,42 +36724,45 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 
 var CollapsedItems = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {
   var items = _ref.items;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_3__.Flex, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_2__.Flex, {
     ref: ref,
     "data-testid": "button-more",
     align_items: "center"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MenuButton, {
-    popoverProps: {
-      items: items
-    }
+    items: items
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_divider__WEBPACK_IMPORTED_MODULE_5__.Divider, null));
 });
 CollapsedItems.displayName = 'CollapsedItems';
-var MenuButton = (0,_hoc__WEBPACK_IMPORTED_MODULE_1__.withPopover)(function (_ref2) {
-  var popover = _ref2.popover;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_2__.IconButton, {
-    size: "xs",
-    icon: "DotsHorizontal",
-    onClick: popover.toggle
-  });
-}, function (_ref3) {
-  var items = _ref3.items,
-    popover = _ref3.popover;
+var MenuButton = function MenuButton(_ref2) {
+  var items = _ref2.items;
+  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
   var menuItems = items.map(function (i) {
     return _objectSpread(_objectSpread({
       key: i.text
     }, i), {}, {
       onClick: function onClick(e) {
-        popover.hide();
+        setVisible(false);
         i === null || i === void 0 || i.onClick(e);
       }
     });
   });
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_menu__WEBPACK_IMPORTED_MODULE_4__.Menu, {
-    size: "sm",
-    items: menuItems
-  });
-});
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_popover__WEBPACK_IMPORTED_MODULE_4__.Popover, {
+    trigger: "click",
+    visible: visible,
+    onVisibleChange: setVisible,
+    popover: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_menu__WEBPACK_IMPORTED_MODULE_3__.Menu, {
+      size: "sm",
+      items: menuItems,
+      noBorder: true
+    })
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_1__.IconButton, {
+    size: "xs",
+    icon: "DotsHorizontal"
+  }));
+};
 
 /***/ }),
 
@@ -39236,8 +39245,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
-/* harmony import */ var _code_snippet__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./code_snippet */ "./src/code/code_snippet.js");
+/* harmony import */ var rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/lib/pickAttrs */ "./node_modules/rc-util/lib/pickAttrs.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _code_snippet__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./code_snippet */ "./src/code/code_snippet.js");
 // LICENSE_CODE ZON
 
 
@@ -39248,6 +39258,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
 
 
 
+
 var CodeBlock = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
   var className = props.className,
     classNamePrefix = props.classNamePrefix,
@@ -39269,16 +39280,16 @@ var CodeBlock = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(f
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CodeBlockWrapper, _extends({
     ref: ref,
     "data-testid": "code_block"
-  }, (0,_util__WEBPACK_IMPORTED_MODULE_3__.getCommonProps)(props), {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+  }, (0,rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__["default"])(props), {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       wrapper: true
     }, className)
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CodeBlockHeader, {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       header: true
     }, variant)
-  }, header), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_code_snippet__WEBPACK_IMPORTED_MODULE_4__.CodeSnippet, {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+  }, header), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_code_snippet__WEBPACK_IMPORTED_MODULE_5__.CodeSnippet, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       snippet: true
     }),
     maxHeight: maxHeight || max_height,
@@ -39287,7 +39298,7 @@ var CodeBlock = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(f
     variant: variant,
     lineNumbers: lineNumbers,
     copyButton: copyButton,
-    copyButtonClassName: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+    copyButtonClassName: (0,_util__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       copyButton: true
     }),
     copyButtonPlacement: copyButtonPlacement,
@@ -39315,7 +39326,7 @@ CodeBlock.propTypes = {
 var CodeBlockWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CodeBlockWrapper",
   componentId: "sc-dgi5hi-0"
-})(["", "{border-top-left-radius:0;border-top-right-radius:0;}"], _code_snippet__WEBPACK_IMPORTED_MODULE_4__.CodeSnippetWrapper);
+})(["", "{border-top-left-radius:0;border-top-right-radius:0;}"], _code_snippet__WEBPACK_IMPORTED_MODULE_5__.CodeSnippetWrapper);
 var CodeBlockHeader = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CodeBlockHeader",
   componentId: "sc-dgi5hi-1"
@@ -41143,7 +41154,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ "prop-types");
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @icons */ "./assets/icons/index.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./util */ "./src/util/index.js");
+/* harmony import */ var rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! rc-util/lib/pickAttrs */ "./node_modules/rc-util/lib/pickAttrs.js");
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils */ "./src/utils.js");
 // LICENSE_CODE ZON
 
@@ -41159,19 +41170,19 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 
 
 
-var Icon = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {
-  var name = _ref.name,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'md' : _ref$size,
-    color = _ref.color,
-    verticalAlign = _ref.verticalAlign,
-    rest = _objectWithoutProperties(_ref, _excluded);
+var Icon = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (props, ref) {
+  var name = props.name,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'md' : _props$size,
+    color = props.color,
+    verticalAlign = props.verticalAlign,
+    rest = _objectWithoutProperties(props, _excluded);
   var theme = (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.useTheme)();
   var ic = _icons__WEBPACK_IMPORTED_MODULE_3__["default"][name];
   if (!ic) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StyledSvg, _extends({
     ref: ref
-  }, (0,_util__WEBPACK_IMPORTED_MODULE_4__.getCommonProps)(rest), {
+  }, (0,rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_4__["default"])(rest), {
     $size: size,
     viewBox: ic.viewBox,
     $color: theme.color[color],
@@ -41349,10 +41360,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./icon */ "./src/icon.js");
-/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./layout */ "./src/layout/index.js");
-/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./typography */ "./src/typography/index.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./util */ "./src/util/index.js");
+/* harmony import */ var rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/lib/pickAttrs */ "./node_modules/rc-util/lib/pickAttrs.js");
+/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./icon */ "./src/icon.js");
+/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./layout */ "./src/layout/index.js");
+/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./typography */ "./src/typography/index.js");
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ "./src/utils.js");
 // LICENSE_CODE ZON
 
@@ -41388,15 +41399,14 @@ var InfoChip = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forward
     warning: 'icon_warning',
     info: 'icon_primary'
   }[variant] || 'icon_accent';
-  var commonProps = (0,_util__WEBPACK_IMPORTED_MODULE_6__.getCommonProps)(rest);
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(InfoChipWrapper, _extends({
     ref: ref,
     $variant: variant
-  }, commonProps), icon && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, {
+  }, (0,rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__["default"])(rest)), icon && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_4__.Icon, {
     size: "xxs",
     color: iconColor,
     name: icon
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_5__.Label, {
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_6__.Label, {
     variant: "xs",
     color: textColor
   }, text));
@@ -41407,7 +41417,7 @@ InfoChip.propTypes = {
   text: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
   icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_7__.iconNames)
 };
-var InfoChipWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_layout__WEBPACK_IMPORTED_MODULE_4__.Flex).attrs({
+var InfoChipWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_layout__WEBPACK_IMPORTED_MODULE_5__.Flex).attrs({
   align_items: 'center',
   gap: '02',
   padding_top: '0',
@@ -46273,7 +46283,7 @@ var InputContentWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default
 var InputWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "InputWrapper",
   componentId: "sc-r60v1b-7"
-})(["position:relative;width:100%;border:1px solid;border-radius:4px;box-sizing:border-box;font-family:", ";padding:", "px ", "px;overflow:auto;display:flex;gap:8px;align-items:", ";border-left-width:1px;border-right-width:1px;border-top-left-radius:", ";border-bottom-left-radius:", ";border-top-right-radius:", ";border-bottom-right-radius:", ";", " ", " box-shadow:", ";"], function (_ref32) {
+})(["position:relative;width:100%;border:1px solid;border-radius:4px;box-sizing:border-box;font-family:", ";padding:", "px ", "px;overflow:auto;display:flex;gap:8px;align-items:", ";border-left-width:1px;border-right-width:1px;border-top-left-radius:", ";border-bottom-left-radius:", ";border-top-right-radius:", ";border-bottom-right-radius:", ";", " cursor:", ";background-color:", ";color:", ";border-color:", ";&:hover{border-color:", ";}box-shadow:", ";"], function (_ref32) {
   var font_family = _ref32.theme.font_family;
   return font_family.sans;
 }, _constants__WEBPACK_IMPORTED_MODULE_12__.INPUT_VERTICAL_PADDING, _constants__WEBPACK_IMPORTED_MODULE_12__.INPUT_HORIZONTAL_PADDING, function (_ref33) {
@@ -46291,23 +46301,36 @@ var InputWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.
   var _props$$heightCalcula;
   return (_props$$heightCalcula = props.$heightCalculationCallback) === null || _props$$heightCalcula === void 0 ? void 0 : _props$$heightCalcula.call(props);
 }, function (_ref34) {
-  var $disabled = _ref34.$disabled,
-    $invalid = _ref34.$invalid,
-    $active = _ref34.$active,
-    color = _ref34.theme.color;
-  if ($disabled) {
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["cursor:default;background-color:", ";border-color:", ";color:", ";"], color.bg_fill_teritary, color.border_disabled, color.text_disabled);
-  }
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["cursor:text;background-color:", ";color:", ";border-color:", ";&:hover{border-color:", ";}"], color.bg, color.text_tertiary, $invalid ? color.border_error : $active ? color.border_primary : color.border, color.border_accent);
+  var $disabled = _ref34.$disabled;
+  return $disabled ? 'default' : 'text';
 }, function (_ref35) {
-  var $active = _ref35.$active,
-    shadow = _ref35.theme.shadow;
+  var $disabled = _ref35.$disabled,
+    color = _ref35.theme.color;
+  return $disabled ? color.bg_fill_teritary : color.bg;
+}, function (_ref36) {
+  var $disabled = _ref36.$disabled,
+    color = _ref36.theme.color;
+  return $disabled ? color.text_disabled : color.text_tertiary;
+}, function (_ref37) {
+  var $disabled = _ref37.$disabled,
+    $invalid = _ref37.$invalid,
+    $active = _ref37.$active,
+    color = _ref37.theme.color;
+  return $disabled ? color.border_disabled : $invalid ? color.border_error : $active ? color.border_primary : color.border;
+}, function (_ref38) {
+  var $disabled = _ref38.$disabled,
+    $active = _ref38.$active,
+    color = _ref38.theme.color;
+  return $disabled ? color.border_disabled : $active ? color.border_primary : color.border_accent;
+}, function (_ref39) {
+  var $active = _ref39.$active,
+    shadow = _ref39.theme.shadow;
   return $active ? shadow.primary : null;
 });
-var HelperText = function HelperText(_ref36) {
-  var classNamePrefix = _ref36.classNamePrefix,
-    children = _ref36.children,
-    invalid = _ref36.invalid;
+var HelperText = function HelperText(_ref40) {
+  var classNamePrefix = _ref40.classNamePrefix,
+    children = _ref40.children,
+    invalid = _ref40.invalid;
   if (!children) return null;
   var color = invalid ? 'text_error' : 'text_quaternary';
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_9__.Label, {
@@ -50983,14 +51006,15 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _hoc__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../hoc */ "./src/hoc/index.js");
-/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
-/* harmony import */ var _icon_button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icon_button */ "./src/icon_button.js");
-/* harmony import */ var _input__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../input */ "./src/input/index.js");
-/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../tooltip */ "./src/tooltip/index.js");
-/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
+/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
+/* harmony import */ var _icon_button__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icon_button */ "./src/icon_button.js");
+/* harmony import */ var _input__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../input */ "./src/input/index.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../tooltip */ "./src/tooltip/index.js");
+/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
+/* harmony import */ var _popover__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../popover */ "./src/popover/index.js");
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
-/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
+/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
 // LICENSE_CODE ZON
 
 
@@ -50999,12 +51023,12 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 var _excluded = ["Dragger", "isDragging"];
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -51022,8 +51046,14 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 
 
 
-var CustomizeButton = function CustomizeButton(props) {
-  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_10__.useTableContext)(),
+
+var CustomizeButton = function CustomizeButton(_ref) {
+  var searchable = _ref.searchable,
+    _ref$popoverPlacement = _ref.popoverPlacement,
+    popoverPlacement = _ref$popoverPlacement === void 0 ? 'bottom' : _ref$popoverPlacement,
+    _ref$maxMenuHeight = _ref.maxMenuHeight,
+    maxMenuHeight = _ref$maxMenuHeight === void 0 ? 300 : _ref$maxMenuHeight;
+  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_11__.useTableContext)(),
     allColumns = _useTableContext.allColumns,
     canOrderColumns = _useTableContext.canOrderColumns,
     orderLogic = _useTableContext.orderLogic;
@@ -51033,43 +51063,46 @@ var CustomizeButton = function CustomizeButton(props) {
     setSearch = _useState2[1];
   (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
     return setSearch('');
-  }, [props.searchable]);
+  }, [searchable]);
   var columns = allColumns.filter(function (col) {
     return col.canHide || col.canPin;
   });
   if (!columns.length) return null;
   var filtered = columns.filter(searchColumn(search));
   var orderProps = canOrderColumns && orderLogic;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonWithPopover, {
-    popoverProps: _objectSpread(_objectSpread({}, props), {}, {
-      items: filtered,
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_popover__WEBPACK_IMPORTED_MODULE_8__.Popover, {
+    trigger: "click",
+    popover: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonPopover, {
+      searchable: searchable,
       search: search,
       setSearch: setSearch,
+      maxMenuHeight: maxMenuHeight,
+      items: filtered,
       orderProps: orderProps
-    })
-  });
+    }),
+    placement: popoverPlacement,
+    style: {
+      padding: '4px 0',
+      minWidth: 168,
+      maxWidth: 540
+    }
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_4__.IconButton, {
+    tooltip: "Customize columns",
+    icon: "Customize"
+  }));
 };
 CustomizeButton.displayName = 'Table.CustomizeButton';
 CustomizeButton.propTypes = {
   searchable: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
-  maxMenuHeight: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)
+  maxMenuHeight: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  popoverPlacement: _constants__WEBPACK_IMPORTED_MODULE_10__.PT_TOOLTIP_PLACEMENT
 };
-var PopoverContainer = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
-  displayName: "PopoverContainer",
-  componentId: "sc-1uptv2h-0"
-})(["box-shadow:", ";background:", ";border-radius:4px;padding:4px 0;min-width:168px;max-width:540px;"], function (_ref) {
-  var shadow = _ref.theme.shadow;
-  return shadow.medium;
-}, function (_ref2) {
-  var color = _ref2.theme.color;
-  return color.bg_elevated;
-});
-var Search = function Search(_ref3) {
-  var search = _ref3.search,
-    setSearch = _ref3.setSearch;
+var Search = function Search(_ref2) {
+  var search = _ref2.search,
+    setSearch = _ref2.setSearch;
   var _useTheme = (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.useTheme)(),
     spacing = _useTheme.spacing;
-  var clearButton = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_5__.IconButton, {
+  var clearButton = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_4__.IconButton, {
     size: "xs",
     icon: "Close",
     style: {
@@ -51083,8 +51116,8 @@ var Search = function Search(_ref3) {
     style: {
       padding: spacing['03']
     }
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_6__.Textbox, {
-    leftInnerContent: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_4__.Icon, {
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_5__.Textbox, {
+    leftInnerContent: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, {
       size: "xs",
       name: "Search",
       color: "icon"
@@ -51096,25 +51129,24 @@ var Search = function Search(_ref3) {
 };
 var ItemsWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "ItemsWrapper",
-  componentId: "sc-1uptv2h-1"
-})(["width:100%;display:flex;flex-direction:column;gap:2px;box-sizing:border-box;", ""], function (_ref4) {
-  var $maxMenuHeight = _ref4.$maxMenuHeight,
-    scrollbars = _ref4.theme.scrollbars;
+  componentId: "sc-1uptv2h-0"
+})(["width:100%;display:flex;flex-direction:column;gap:2px;box-sizing:border-box;", ""], function (_ref3) {
+  var $maxMenuHeight = _ref3.$maxMenuHeight,
+    scrollbars = _ref3.theme.scrollbars;
   if ($maxMenuHeight > 0) {
     return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["max-height:", ";overflow-y:auto;", ""], (0,_utils__WEBPACK_IMPORTED_MODULE_9__.toPixel)($maxMenuHeight), scrollbars.thin);
   }
 });
-var CustomizeButtonPopover = function CustomizeButtonPopover(_ref5) {
-  var searchable = _ref5.searchable,
-    search = _ref5.search,
-    setSearch = _ref5.setSearch,
-    _ref5$maxMenuHeight = _ref5.maxMenuHeight,
-    maxMenuHeight = _ref5$maxMenuHeight === void 0 ? 300 : _ref5$maxMenuHeight,
-    items = _ref5.items,
-    orderProps = _ref5.orderProps;
+var CustomizeButtonPopover = function CustomizeButtonPopover(_ref4) {
+  var searchable = _ref4.searchable,
+    search = _ref4.search,
+    setSearch = _ref4.setSearch,
+    maxMenuHeight = _ref4.maxMenuHeight,
+    items = _ref4.items,
+    orderProps = _ref4.orderProps;
   var maxHeight = Number.parseInt(maxMenuHeight);
   var _maxMenuHeight = orderProps && (!maxHeight || maxHeight < 600) ? 600 : maxMenuHeight;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(PopoverContainer, null, searchable && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Search, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, searchable && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Search, {
     search: search,
     setSearch: setSearch
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ItemsWrapper, {
@@ -51125,28 +51157,18 @@ var CustomizeButtonPopover = function CustomizeButtonPopover(_ref5) {
     items: items
   })));
 };
-var CustomizeButtonWithPopover = (0,_hoc__WEBPACK_IMPORTED_MODULE_3__.withPopover)(function (_ref6) {
-  var popover = _ref6.popover;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_5__.IconButton, {
-    onClick: popover.toggle,
-    tooltip: "Customize columns",
-    icon: "Customize"
-  });
-}, CustomizeButtonPopover, {
-  placement: 'bottom'
-});
-var CustomizeButtonStaticItems = function CustomizeButtonStaticItems(_ref7) {
-  var items = _ref7.items;
+var CustomizeButtonStaticItems = function CustomizeButtonStaticItems(_ref5) {
+  var items = _ref5.items;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, items.map(function (c) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonItem, _extends({
       key: c.id
     }, c));
   }));
 };
-var CustomizeButtonDraggableItems = function CustomizeButtonDraggableItems(_ref8) {
-  var items = _ref8.items,
-    orders = _ref8.orders,
-    moveColumn = _ref8.moveColumn;
+var CustomizeButtonDraggableItems = function CustomizeButtonDraggableItems(_ref6) {
+  var items = _ref6.items,
+    orders = _ref6.orders,
+    moveColumn = _ref6.moveColumn;
   var sections = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
     var _orders$pinned;
     return [((_orders$pinned = orders.pinned) === null || _orders$pinned === void 0 ? void 0 : _orders$pinned.length) && {
@@ -51193,7 +51215,7 @@ var CustomizeButtonDraggableItems = function CustomizeButtonDraggableItems(_ref8
       }, it);
     });
   }, [items]);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_6__.DragDrop, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_5__.DragDrop, {
     value: value,
     onChange: onChange,
     items: _items,
@@ -51202,32 +51224,32 @@ var CustomizeButtonDraggableItems = function CustomizeButtonDraggableItems(_ref8
     CustomDrag: CustomizeButtonDraggableItem
   });
 };
-var CustomizeButtonDraggableItem = function CustomizeButtonDraggableItem(_ref9) {
-  var Dragger = _ref9.Dragger,
-    isDragging = _ref9.isDragging,
-    itemProps = _objectWithoutProperties(_ref9, _excluded);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_6__.DragDrop.DraggableItem, {
+var CustomizeButtonDraggableItem = function CustomizeButtonDraggableItem(_ref7) {
+  var Dragger = _ref7.Dragger,
+    isDragging = _ref7.isDragging,
+    itemProps = _objectWithoutProperties(_ref7, _excluded);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_input__WEBPACK_IMPORTED_MODULE_5__.DragDrop.DraggableItem, {
     Dragger: Dragger,
     isDragging: isDragging
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonItem, itemProps));
 };
-var CustomizeButtonItem = function CustomizeButtonItem(_ref10) {
-  var id = _ref10.id,
-    name = _ref10.name,
-    canPin = _ref10.canPin,
-    isPinned = _ref10.isPinned,
-    togglePinned = _ref10.togglePinned,
-    canHide = _ref10.canHide,
-    isVisible = _ref10.isVisible,
-    toggleHidden = _ref10.toggleHidden,
-    className = _ref10.className;
+var CustomizeButtonItem = function CustomizeButtonItem(_ref8) {
+  var id = _ref8.id,
+    name = _ref8.name,
+    canPin = _ref8.canPin,
+    isPinned = _ref8.isPinned,
+    togglePinned = _ref8.togglePinned,
+    canHide = _ref8.canHide,
+    isVisible = _ref8.isVisible,
+    toggleHidden = _ref8.toggleHidden,
+    className = _ref8.className;
   var handlePinned = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
     togglePinned(!isPinned);
   }, [isPinned, togglePinned]);
   var handleHidden = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
     toggleHidden(isVisible);
   }, [isVisible, toggleHidden]);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonItemWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_8__.Label, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonItemWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_7__.Label, {
     variant: "sm",
     color: isVisible ? 'text_secondary' : 'text_disabled',
     "data-label": true,
@@ -51244,21 +51266,21 @@ var CustomizeButtonItem = function CustomizeButtonItem(_ref10) {
 };
 var CustomizeButtonItemWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CustomizeButtonItemWrapper",
-  componentId: "sc-1uptv2h-2"
-})(["margin:0;padding:8px 16px;display:flex;align-items:center;gap:4px;min-width:230px;div[data-label]{margin-right:auto;}&:hover{background-color:", ";}"], function (_ref11) {
-  var color = _ref11.theme.color;
+  componentId: "sc-1uptv2h-1"
+})(["margin:0;padding:8px 16px;display:flex;align-items:center;gap:4px;min-width:230px;div[data-label]{margin-right:auto;}&:hover{background-color:", ";}"], function (_ref9) {
+  var color = _ref9.theme.color;
   return color.bg_fill_secondary;
 });
-var CustomizeButtonItemAction = function CustomizeButtonItemAction(_ref12) {
-  var onClick = _ref12.onClick,
-    tooltip = _ref12.tooltip,
-    icon = _ref12.icon;
+var CustomizeButtonItemAction = function CustomizeButtonItemAction(_ref10) {
+  var onClick = _ref10.onClick,
+    tooltip = _ref10.tooltip,
+    icon = _ref10.icon;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CustomizeButtonItemActionWrapper, {
     onClick: onClick
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_7__.Tooltip2, {
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_6__.Tooltip2, {
     tooltip: tooltip,
     tooltipPlacement: "top"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_4__.Icon, {
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, {
     name: icon,
     size: "xs",
     color: "icon"
@@ -51266,7 +51288,7 @@ var CustomizeButtonItemAction = function CustomizeButtonItemAction(_ref12) {
 };
 var CustomizeButtonItemActionWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CustomizeButtonItemActionWrapper",
-  componentId: "sc-1uptv2h-3"
+  componentId: "sc-1uptv2h-2"
 })(["cursor:pointer;visibility:hidden;", ":hover &{visibility:visible;}"], CustomizeButtonItemWrapper);
 var searchColumn = function searchColumn(search) {
   return function (col) {
@@ -51522,14 +51544,21 @@ var ExpandHandle = function ExpandHandle(_ref) {
     isExpanded = _ref.isExpanded;
   var _useTheme = (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.useTheme)(),
     spacing = _useTheme.spacing;
-  var icon = isExpanded ? 'ChevronDown' : 'ChevronRight';
   if (!canExpand) return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_2__.Box, {
     width: spacing['06']
   });
+  var icon = isExpanded ? 'ChevronDown' : 'ChevronRight';
+  var props = getToggleRowExpandedProps();
+  var onClick = function onClick(e) {
+    e.stopPropagation(); // prevents onRowClick
+    props.onClick(e);
+  };
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon_button__WEBPACK_IMPORTED_MODULE_3__.IconButton, _extends({
     icon: icon,
     size: "xs"
-  }, getToggleRowExpandedProps()));
+  }, props, {
+    onClick: onClick
+  }));
 };
 var withAttachedProps = function withAttachedProps(Comp, rowProps) {
   return function WithAttachedProps() {
@@ -52246,6 +52275,12 @@ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 
 
+if (!Array.prototype.toSpliced) {
+  Array.prototype.toSpliced = function () {
+    var _Array$from;
+    return (_Array$from = Array.from(this)).splice.apply(_Array$from, arguments);
+  };
+}
 var useOrderLogic = function useOrderLogic(table) {
   var _table$state = table.state,
     columnOrder = _table$state.columnOrder,
@@ -53952,7 +53987,8 @@ var TableBody = function TableBody(props) {
     setIsDraggingRow = _useTableContext2.setIsDraggingRow,
     onRowDragStart = _useTableContext2.onRowDragStart,
     onRowDragEnd = _useTableContext2.onRowDragEnd,
-    rowsById = _useTableContext2.rowsById;
+    rowsById = _useTableContext2.rowsById,
+    draggableRows = _useTableContext2.draggableRows;
   var rows = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {
     return [].concat(_toConsumableArray(pinnedRows), _toConsumableArray(page.filter(function (row) {
       return !row.isPinned;
@@ -54013,10 +54049,7 @@ var TableBody = function TableBody(props) {
     cache.current.clearAll();
     onRowDragEnd === null || onRowDragEnd === void 0 || onRowDragEnd(event, originRow, destRow, context);
   }, [rows, cache.current]);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(react_beautiful_dnd__WEBPACK_IMPORTED_MODULE_13__.DragDropContext, {
-    onDragStart: onDragStart,
-    onDragEnd: onDragEnd
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(TableBodyRowGroup, _extends({
+  var content = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(TableBodyRowGroup, _extends({
     "data-rowgroup-type": "body"
   }, bodyProps, {
     style: style,
@@ -54024,21 +54057,39 @@ var TableBody = function TableBody(props) {
       tableBody: true
     }),
     onScroll: onScroll
-  }), body));
+  }), body);
+  if (draggableRows) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(react_beautiful_dnd__WEBPACK_IMPORTED_MODULE_13__.DragDropContext, {
+      onDragStart: onDragStart,
+      onDragEnd: onDragEnd
+    }, content);
+  }
+  return content;
 };
 var Body = function Body(props) {
   var _useTableContext3 = (0,_context__WEBPACK_IMPORTED_MODULE_6__.useTableContext)(),
-    virtualized = _useTableContext3.virtualized;
+    virtualized = _useTableContext3.virtualized,
+    draggableRows = _useTableContext3.draggableRows;
   var droppableProps = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {
     return {
       droppableId: 'table-body-rows',
       type: 'ROWS'
     };
   }, []);
-  var BodyComp = virtualized ? _virtualized_body__WEBPACK_IMPORTED_MODULE_11__.VirtualizedBody : _dnd__WEBPACK_IMPORTED_MODULE_12__.DroppableBody;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(BodyComp, _extends({}, props, {
+  if (virtualized) return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_virtualized_body__WEBPACK_IMPORTED_MODULE_11__.VirtualizedBody, _extends({}, props, {
+    droppableProps: droppableProps
+  }));
+  if (draggableRows) return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_dnd__WEBPACK_IMPORTED_MODULE_12__.DroppableBody, _extends({}, props, {
     droppableProps: droppableProps
   }));
+  var rows = props.rows,
+    _renderRow = props.renderRow;
+  return rows.map(function (row, index) {
+    return _renderRow({
+      row: row,
+      index: index
+    });
+  });
 };
 var TableBodyRowGroup = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
   displayName: "TableBodyRowGroup",
@@ -54246,8 +54297,10 @@ var RowRenderer = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().memo
     index = props.index,
     style = props.style,
     parent = props.parent,
-    rowHoverEvents = props.rowHoverEvents;
-  // padding is needed to see the divider between rows when new rows are added
+    rowHoverEvents = props.rowHoverEvents,
+    draggableRows = props.draggableRows;
+  // padding is needed to see the divider between rows
+  // when new rows are added
   var _style = _objectSpread(_objectSpread({}, style), {}, {
     padding: '0.3px 0'
   });
@@ -54258,28 +54311,34 @@ var RowRenderer = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().memo
     rowIndex: index
   }, function (_ref) {
     var measure = _ref.measure;
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dnd__WEBPACK_IMPORTED_MODULE_4__.DraggableWrapper, {
-      key: row.id,
+    if (draggableRows) {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dnd__WEBPACK_IMPORTED_MODULE_4__.DraggableWrapper, {
+        key: row.id,
+        row: row,
+        index: index,
+        render: function render(wrapperProps, dragHandleProps) {
+          return renderRow({
+            row: row,
+            index: index,
+            wrapperProps: _objectSpread(_objectSpread(_objectSpread({}, wrapperProps), rowHoverEvents), {}, {
+              onPointerEnter: function onPointerEnter(e) {
+                return rowHoverEvents.onPointerEnter(e, row, dragHandleProps);
+              },
+              style: _style,
+              measureContentSize: measure
+            })
+          });
+        }
+      });
+    }
+    return renderRow({
       row: row,
-      index: index,
-      render: function render(wrapperProps, dragHandleProps) {
-        return renderRow({
-          row: row,
-          index: index,
-          wrapperProps: _objectSpread(_objectSpread(_objectSpread({}, wrapperProps), rowHoverEvents), {}, {
-            onPointerEnter: function onPointerEnter(e) {
-              return rowHoverEvents.onPointerEnter(e, row, dragHandleProps);
-            },
-            style: _style,
-            measureContentSize: measure
-          })
-        });
-      }
+      index: index
     });
   });
 });
 RowRenderer.displayName = 'RowRenderer';
-var rowRenderer = function rowRenderer(rows, cache, renderRow, rowHoverEvents) {
+var rowRenderer = function rowRenderer(rows, cache, renderRow, rowHoverEvents, draggableRows) {
   var RendererWrapper = function RendererWrapper(_ref2) {
     var key = _ref2.key,
       index = _ref2.index,
@@ -54294,7 +54353,8 @@ var rowRenderer = function rowRenderer(rows, cache, renderRow, rowHoverEvents) {
       parent: parent,
       cache: cache,
       renderRow: renderRow,
-      rowHoverEvents: rowHoverEvents
+      rowHoverEvents: rowHoverEvents,
+      draggableRows: draggableRows
     });
   };
   return RendererWrapper;
@@ -54320,7 +54380,7 @@ var listRefHandler = function listRefHandler(setListDOMRef, droppableProvided) {
     var element = ref === null || ref === void 0 || (_ref$Grid = ref.Grid) === null || _ref$Grid === void 0 ? void 0 : _ref$Grid._scrollingContainer;
     if (element instanceof window.HTMLElement) {
       setListDOMRef(element === null || element === void 0 ? void 0 : element.firstChild);
-      droppableProvided.innerRef(element);
+      droppableProvided === null || droppableProvided === void 0 || droppableProvided.innerRef(element);
     }
   };
 };
@@ -54328,7 +54388,8 @@ var VirtualizedBodyComp = function VirtualizedBodyComp(props) {
   var rows = props.rows,
     measurerCache = props.measurerCache,
     renderRow = props.renderRow,
-    droppableProps = props.droppableProps;
+    droppableProps = props.droppableProps,
+    draggableRows = props.draggableRows;
   var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_3__.useTableContext)(),
     maxHeight = _useTableContext.scrollHeight;
   var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(),
@@ -54348,40 +54409,72 @@ var VirtualizedBodyComp = function VirtualizedBodyComp(props) {
       return acc += measurerCache.current.getHeight(index, 0);
     }, 0));
   }, [listDOMRef, rows]);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_beautiful_dnd__WEBPACK_IMPORTED_MODULE_6__.Droppable, _extends({}, droppableProps, {
-    mode: "virtual",
-    renderClone: renderClone(rows, renderRow)
-  }), function (provided) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-      style: {
-        height: _height,
-        maxHeight: maxHeight,
-        width: '100%'
-      }
-    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_virtualized__WEBPACK_IMPORTED_MODULE_1__.AutoSizer, null, function (_ref3) {
-      var width = _ref3.width,
-        height = _ref3.height;
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StyledList, {
-        width: width,
-        height: height,
-        overscanRowCount: 5,
-        estimatedRowSize: 30,
-        rowHeight: measurerCache.current.rowHeight,
-        rowCount: rows.length,
-        deferredMeasurementCache: measurerCache.current,
-        ref: listRefHandler(setListDOMRef, provided),
-        rowRenderer: rowRenderer(rows, measurerCache, renderRow, rowHoverEvents)
-      });
-    })), renderHoverActions());
+  if (draggableRows) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_beautiful_dnd__WEBPACK_IMPORTED_MODULE_6__.Droppable, _extends({}, droppableProps, {
+      mode: "virtual",
+      renderClone: renderClone(rows, renderRow)
+    }), function (provided) {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(VirtualizedBodyList, {
+        rows: rows,
+        measurerCache: measurerCache,
+        renderRow: renderRow,
+        rowHoverEvents: rowHoverEvents,
+        style: {
+          height: _height,
+          maxHeight: maxHeight,
+          width: '100%'
+        },
+        listRef: listRefHandler(setListDOMRef, provided),
+        draggableRows: true
+      }), renderHoverActions());
+    });
+  }
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(VirtualizedBodyList, {
+    rows: rows,
+    measurerCache: measurerCache,
+    renderRow: renderRow,
+    rowHoverEvents: rowHoverEvents,
+    style: {
+      height: _height,
+      maxHeight: maxHeight,
+      width: '100%'
+    },
+    listRef: listRefHandler(setListDOMRef, undefined)
   });
 };
 var VirtualizedBody = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().memo(VirtualizedBodyComp);
 VirtualizedBody.displayName = 'VirtualizedBody';
+var VirtualizedBodyList = function VirtualizedBodyList(_ref3) {
+  var rows = _ref3.rows,
+    measurerCache = _ref3.measurerCache,
+    renderRow = _ref3.renderRow,
+    rowHoverEvents = _ref3.rowHoverEvents,
+    style = _ref3.style,
+    listRef = _ref3.listRef,
+    draggableRows = _ref3.draggableRows;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+    style: style
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_virtualized__WEBPACK_IMPORTED_MODULE_1__.AutoSizer, null, function (_ref4) {
+    var width = _ref4.width,
+      height = _ref4.height;
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StyledList, {
+      width: width,
+      height: height,
+      overscanRowCount: 5,
+      estimatedRowSize: 30,
+      rowHeight: measurerCache.current.rowHeight,
+      rowCount: rows.length,
+      deferredMeasurementCache: measurerCache.current,
+      ref: listRef,
+      rowRenderer: rowRenderer(rows, measurerCache, renderRow, rowHoverEvents, draggableRows)
+    });
+  }));
+};
 var StyledList = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(react_virtualized__WEBPACK_IMPORTED_MODULE_1__.List).withConfig({
   displayName: "StyledList",
   componentId: "sc-1mdy9tq-0"
-})(["", ""], function (_ref4) {
-  var scrollbars = _ref4.theme.scrollbars;
+})(["", ""], function (_ref5) {
+  var scrollbars = _ref5.theme.scrollbars;
   return scrollbars.thin;
 });