@activecollab/components 1.0.224 → 1.0.226

package/dist/index.js

@@ -1140,6 +1140,36 @@
     Separator: ListSeparator
   });
 
+  var StyledIconButton = styled__default["default"](Button).withConfig({
+    displayName: "Styles__StyledIconButton",
+    componentId: "sc-1teza2f-0"
+  })(["display:inline-flex;justify-content:center;align-items:center;padding:0;width:32px;", " ", ""], function (_ref) {
+    var size = _ref.size;
+    return size === "small" && styled.css(["width:24px;"]);
+  }, function (_ref2) {
+    var size = _ref2.size;
+    return size === "big" && styled.css(["width:40px;"]);
+  });
+
+  var _excluded$_ = ["children", "className", "variant", "size"];
+
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+
+  var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+    var children = _ref.children,
+      className = _ref.className,
+      variant = _ref.variant,
+      size = _ref.size,
+      args = _objectWithoutProperties(_ref, _excluded$_);
+    return /*#__PURE__*/React__default["default"].createElement(StyledIconButton, _extends({
+      className: classNames__default["default"]("c-btn--icon-only", className),
+      variant: variant,
+      size: size,
+      ref: ref
+    }, args), children);
+  });
+  IconButton.displayName = "IconButton";
+
   var ActivityIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
     return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
       width: 24,
@@ -3901,14 +3931,14 @@
   });
   StyledBreadcrumbListItem.displayName = "StyledBreadcrumbListItem";
 
-  var _excluded$_ = ["children", "className", "separator"];
+  var _excluded$Z = ["children", "className", "separator"];
   var Breadcrumbs = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var _dimensions$width, _childDimensions$widt;
     var children = _ref.children,
       className = _ref.className,
       _ref$separator = _ref.separator,
       separator = _ref$separator === void 0 ? "/" : _ref$separator,
-      rest = _objectWithoutProperties(_ref, _excluded$_);
+      rest = _objectWithoutProperties(_ref, _excluded$Z);
     var internalRef = React.useRef(null);
     var listWrapperRef = React.useRef(null);
     var olRef = React.useRef(null);
@@ -3997,7 +4027,7 @@
     }, menuCollection.length > 0 ? /*#__PURE__*/React__default["default"].createElement(StyledBreadcrumbListItem, {
       "data-role": "menu"
     }, /*#__PURE__*/React__default["default"].createElement(Menu, {
-      target: /*#__PURE__*/React__default["default"].createElement(Button, {
+      target: /*#__PURE__*/React__default["default"].createElement(IconButton, {
         variant: "text gray"
       }, /*#__PURE__*/React__default["default"].createElement(TreeDotsIcon$1, null))
     }, /*#__PURE__*/React__default["default"].createElement(StyledMenuList, null, menuCollection.map(function (child, index) {
@@ -4075,10 +4105,10 @@
     return props.$isLight && styled.css(["background-color:var(--page-paper-main);box-shadow:var(--shadow-secondary);color:var(--color-theme-700);"]);
   });
 
-  var _excluded$Z = ["children"];
+  var _excluded$Y = ["children"];
   var TooltipAnimation = function TooltipAnimation(_ref) {
     var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$Z);
+      props = _objectWithoutProperties(_ref, _excluded$Y);
     return /*#__PURE__*/React__default["default"].createElement(FromElement, _extends({
       timeout: 0
     }, props), children);
@@ -4153,12 +4183,12 @@
   });
   Tooltip.displayName = "Tooltip";
 
-  var _excluded$Y = ["weight", "children"];
+  var _excluded$X = ["weight", "children"];
   var Body2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$Y);
+      props = _objectWithoutProperties(_ref, _excluded$X);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Body 2",
       weight: weight,
@@ -4205,7 +4235,7 @@
   });
   StyledCounterButtonLabel.displayName = "StyledCounterButtonLabel";
 
-  var _excluded$X = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className"];
+  var _excluded$W = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className"];
   var CounterButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var label = _ref.label,
       icon = _ref.icon,
@@ -4215,7 +4245,7 @@
       tooltipText = _ref.tooltipText,
       onClearAll = _ref.onClearAll,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$X);
+      args = _objectWithoutProperties(_ref, _excluded$W);
     return /*#__PURE__*/React__default["default"].createElement(StyledCounterButtonWrapper, {
       ref: ref,
       className: className
@@ -4524,7 +4554,7 @@
   StyledDatePicker.displayName = "StyledDatePicker";
   StyledDayPicker.displayName = "StyledDayPicker";
 
-  var _excluded$W = ["className", "onChange", "onDayClick", "selectedDays", "disabledDays", "selectionMode", "month", "onMonthChange", "dateRequired", "firstDayOfWeek", "fixedWeeks", "modifiers"];
+  var _excluded$V = ["className", "onChange", "onDayClick", "selectedDays", "disabledDays", "selectionMode", "month", "onMonthChange", "dateRequired", "firstDayOfWeek", "fixedWeeks", "modifiers"];
   var DatePicker = function DatePicker(_ref) {
     var className = _ref.className,
       onChange = _ref.onChange,
@@ -4546,7 +4576,7 @@
       _ref$fixedWeeks = _ref.fixedWeeks,
       fixedWeeks = _ref$fixedWeeks === void 0 ? true : _ref$fixedWeeks,
       defaultModifiers = _ref.modifiers,
-      rest = _objectWithoutProperties(_ref, _excluded$W);
+      rest = _objectWithoutProperties(_ref, _excluded$V);
     var _useState = React.useState(),
       _useState2 = _slicedToArray(_useState, 2),
       enteredTo = _useState2[0],
@@ -5427,10 +5457,10 @@
     componentId: "sc-x4ge7a-0"
   })(["width:70%;background:linear-gradient( 90deg,rgba(255,255,255,0) 20%,rgba(0,0,0,0.05) 50%,rgba(255,255,255,0) 60% );background-size:400%;height:16px;border-radius:8px;.neon &{background:linear-gradient( 90deg,rgba(255,255,255,0) 20%,rgba(0,0,0,0.2) 50%,rgba(255,255,255,0) 60% );background-size:500%;}animation-duration:1s;animation-iteration-count:infinite;animation-name:", ";animation-timing-function:linear;animation-direction:reverse;"], linearAnimation);
 
-  var _excluded$V = ["className"];
+  var _excluded$U = ["className"];
   var LinearLoader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$V);
+      rest = _objectWithoutProperties(_ref, _excluded$U);
     return /*#__PURE__*/React__default["default"].createElement(StyledLinearLoader, _extends({
       ref: ref,
       className: classNames__default["default"]("c-loader c-loader--linear", className)
@@ -5444,10 +5474,10 @@
     componentId: "sc-1f35d5h-0"
   })(["display:inline-block;text-align:center;& > span{display:inline-block;width:18px;height:18px;background-color:#777;border-radius:100%;animation:", " 1.4s infinite ease-in-out both;}span:nth-child(1){animation-delay:-0.32s;}span:nth-child(2){animation-delay:-0.16s;}"], dotAnimation);
 
-  var _excluded$U = ["className"];
+  var _excluded$T = ["className"];
   var DotsLoader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$U);
+      rest = _objectWithoutProperties(_ref, _excluded$T);
     return /*#__PURE__*/React__default["default"].createElement(StyledDotsLoader, _extends({
       ref: ref,
       className: classNames__default["default"]("c-loader c-loader--dots", className)
@@ -5469,7 +5499,7 @@
     return props.$activeColorPercentage === "75%" && styled.css(["border-right:", "px solid ", ";border-bottom:", "px solid ", ";border-left:", "px solid ", ";border-top:", "px solid ", ";"], props.$stroke, props.$activeStrokeColor, props.$stroke, props.$activeStrokeColor, props.$stroke, props.$inactiveStrokeColor, props.$stroke, props.$activeStrokeColor);
   });
 
-  var _excluded$T = ["radius", "stroke", "activeStrokeColor", "inactiveStrokeColor", "activeColorPercentage", "rotateDurationInSeconds", "className"];
+  var _excluded$S = ["radius", "stroke", "activeStrokeColor", "inactiveStrokeColor", "activeColorPercentage", "rotateDurationInSeconds", "className"];
   var SpinnerLoader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$radius = _ref.radius,
       radius = _ref$radius === void 0 ? 10 : _ref$radius,
@@ -5484,7 +5514,7 @@
       _ref$rotateDurationIn = _ref.rotateDurationInSeconds,
       rotateDurationInSeconds = _ref$rotateDurationIn === void 0 ? 0.75 : _ref$rotateDurationIn,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$T);
+      rest = _objectWithoutProperties(_ref, _excluded$S);
     return /*#__PURE__*/React__default["default"].createElement(StyledSpinnerLoader, _extends({
       ref: ref,
       className: className,
@@ -5498,7 +5528,7 @@
   });
   SpinnerLoader.displayName = "SpinnerLoader";
 
-  var _excluded$S = ["header", "rows", "className", "sortBy", "sortDirection", "onSortCallback", "theadClass", "noResultsCallback", "groupBy", "groupHead", "isCollapsible", "emptyValue", "loading", "loadingRows"];
+  var _excluded$R = ["header", "rows", "className", "sortBy", "sortDirection", "onSortCallback", "theadClass", "noResultsCallback", "groupBy", "groupHead", "isCollapsible", "emptyValue", "loading", "loadingRows"];
   exports.SortDirection = void 0;
   (function (SortDirection) {
     SortDirection["None"] = "none";
@@ -5546,7 +5576,7 @@
       loading = _ref.loading,
       _ref$loadingRows = _ref.loadingRows,
       loadingRows = _ref$loadingRows === void 0 ? 7 : _ref$loadingRows,
-      args = _objectWithoutProperties(_ref, _excluded$S);
+      args = _objectWithoutProperties(_ref, _excluded$R);
     var _useState = React.useState(sortDirection),
       _useState2 = _slicedToArray(_useState, 2),
       columnDirection = _useState2[0],
@@ -5948,7 +5978,7 @@
   });
   StyledPaper.displayName = "StyledPaper";
 
-  var _excluded$R = ["children", "className", "type", "hover", "useOptimizedShadow"];
+  var _excluded$Q = ["children", "className", "type", "hover", "useOptimizedShadow"];
   /**
    * This is a component description and should sit directly above your component
    */
@@ -5961,7 +5991,7 @@
       hover = _ref$hover === void 0 ? false : _ref$hover,
       _ref$useOptimizedShad = _ref.useOptimizedShadow,
       useOptimizedShadow = _ref$useOptimizedShad === void 0 ? false : _ref$useOptimizedShad,
-      rest = _objectWithoutProperties(_ref, _excluded$R);
+      rest = _objectWithoutProperties(_ref, _excluded$Q);
     return /*#__PURE__*/React__default["default"].createElement(StyledPaper, _extends({
       className: classNames__default["default"](className, {
         "ac-shadow--raised--lg": !useOptimizedShadow && hover && type === "paper-1",
@@ -6014,7 +6044,7 @@
   });
   StyledCard.displayName = "StyledCard";
 
-  var _excluded$Q = ["children", "className", "hoverable", "paperType"];
+  var _excluded$P = ["children", "className", "hoverable", "paperType"];
   var Card = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
@@ -6022,7 +6052,7 @@
       hoverable = _ref$hoverable === void 0 ? false : _ref$hoverable,
       _ref$paperType = _ref.paperType,
       paperType = _ref$paperType === void 0 ? "paper-2" : _ref$paperType,
-      rest = _objectWithoutProperties(_ref, _excluded$Q);
+      rest = _objectWithoutProperties(_ref, _excluded$P);
     return /*#__PURE__*/React__default["default"].createElement(StyledCard, _extends({}, rest, {
       type: paperType,
       className: classNames__default["default"]("c-card", className),
@@ -6101,12 +6131,12 @@
   });
   EntityCard$1.displayName = "EntityCard";
 
-  var _excluded$P = ["weight", "children"];
+  var _excluded$O = ["weight", "children"];
   var Title1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "light" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$P);
+      props = _objectWithoutProperties(_ref, _excluded$O);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       weight: weight,
       variant: "Title 1",
@@ -6115,12 +6145,12 @@
   });
   Title1.displayName = "Title1";
 
-  var _excluded$O = ["weight", "children"];
+  var _excluded$N = ["weight", "children"];
   var Title2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "light" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$O);
+      props = _objectWithoutProperties(_ref, _excluded$N);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       weight: weight,
       variant: "Title 2",
@@ -6129,10 +6159,10 @@
   });
   Title2.displayName = "Title2";
 
-  var _excluded$N = ["children"];
+  var _excluded$M = ["children"];
   var Header2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$N);
+      props = _objectWithoutProperties(_ref, _excluded$M);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       weight: "bold",
       variant: "Header 2",
@@ -6141,10 +6171,10 @@
   });
   Header2.displayName = "Header2";
 
-  var _excluded$M = ["children"];
+  var _excluded$L = ["children"];
   var Header3 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$M);
+      props = _objectWithoutProperties(_ref, _excluded$L);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       weight: "bold",
       variant: "Header 3",
@@ -6153,12 +6183,12 @@
   });
   Header3.displayName = "Header3";
 
-  var _excluded$L = ["weight", "children"];
+  var _excluded$K = ["weight", "children"];
   var Body1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$L);
+      props = _objectWithoutProperties(_ref, _excluded$K);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Body 1",
       weight: weight,
@@ -6167,12 +6197,12 @@
   });
   Body1.displayName = "Body1";
 
-  var _excluded$K = ["weight", "children"];
+  var _excluded$J = ["weight", "children"];
   var Caption1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$K);
+      props = _objectWithoutProperties(_ref, _excluded$J);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Caption 1",
       weight: weight,
@@ -6181,12 +6211,12 @@
   });
   Caption1.displayName = "Caption1";
 
-  var _excluded$J = ["weight", "children"];
+  var _excluded$I = ["weight", "children"];
   var Caption2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$J);
+      props = _objectWithoutProperties(_ref, _excluded$I);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Caption 2",
       weight: weight,
@@ -6297,7 +6327,7 @@
     "borderRadius": "9999px"
   });
 
-  var _excluded$I = ["url", "alt", "size", "className"];
+  var _excluded$H = ["url", "alt", "size", "className"];
   var Avatar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var url = _ref.url,
       _ref$alt = _ref.alt,
@@ -6305,7 +6335,7 @@
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 24 : _ref$size,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$I);
+      rest = _objectWithoutProperties(_ref, _excluded$H);
     return /*#__PURE__*/React__default["default"].createElement(StyledAvatar, _extends({}, rest, {
       ref: ref,
       src: url,
@@ -6326,13 +6356,13 @@
     return props.$color && styled.css(["background-color:", ";"], props.$color);
   });
 
-  var _excluded$H = ["color", "size", "className"];
+  var _excluded$G = ["color", "size", "className"];
   var Dot = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var color = _ref.color,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 8 : _ref$size,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$H);
+      rest = _objectWithoutProperties(_ref, _excluded$G);
     return /*#__PURE__*/React__default["default"].createElement(StyledDot, _extends({
       className: classNames__default["default"]("c-dot", className),
       ref: ref,
@@ -6369,7 +6399,7 @@
   });
   StyledTagText.displayName = "StyledTagText";
 
-  var _excluded$G = ["name", "color", "showText", "showDot", "className"];
+  var _excluded$F = ["name", "color", "showText", "showDot", "className"];
   var Tag = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var name = _ref.name,
       color = _ref.color,
@@ -6378,7 +6408,7 @@
       _ref$showDot = _ref.showDot,
       showDot = _ref$showDot === void 0 ? true : _ref$showDot,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$G);
+      rest = _objectWithoutProperties(_ref, _excluded$F);
     return /*#__PURE__*/React__default["default"].createElement(StyledTag, _extends({
       className: classNames__default["default"]("c-tag", className),
       ref: ref
@@ -6498,7 +6528,7 @@
   }, StyledInput$2, StyledLabel);
   StyledCheckbox$1.displayName = "StyledCheckbox";
 
-  var _excluded$F = ["className", "hover", "id"];
+  var _excluded$E = ["className", "hover", "id"];
   /**
    * Checkbox component
    */
@@ -6507,7 +6537,7 @@
       hover = _ref.hover,
       _ref$id = _ref.id,
       id = _ref$id === void 0 ? "checkbox" : _ref$id,
-      rest = _objectWithoutProperties(_ref, _excluded$F);
+      rest = _objectWithoutProperties(_ref, _excluded$E);
     return /*#__PURE__*/React__default["default"].createElement(StyledCheckbox$1, {
       className: classNames__default["default"]("c-checkbox", {
         "c-checkbox__hover": hover,
@@ -6694,7 +6724,7 @@
   StyledScrollShadowLeft.displayName = "StyledScrollShadowLeft";
   StyledScrollShadowRight.displayName = "StyledScrollShadowRight";
 
-  var _excluded$E = ["children", "className", "disableVertical", "disableHorizontal", "invertHorizontal", "invertVertical", "innerColor", "outerColor"];
+  var _excluded$D = ["children", "className", "disableVertical", "disableHorizontal", "invertHorizontal", "invertVertical", "innerColor", "outerColor"];
   var ScrollShadow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
@@ -6708,7 +6738,7 @@
       invertVertical = _ref$invertVertical === void 0 ? false : _ref$invertVertical,
       innerColor = _ref.innerColor,
       outerColor = _ref.outerColor,
-      rest = _objectWithoutProperties(_ref, _excluded$E);
+      rest = _objectWithoutProperties(_ref, _excluded$D);
     var _useState = React.useState({
         top: 0,
         right: 0,
@@ -6828,7 +6858,7 @@
     return height;
   };
 
-  var _excluded$D = ["as", "className", "invert", "style"];
+  var _excluded$C = ["as", "className", "invert", "style"];
   var ScrollElement = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$as = _ref.as,
       as = _ref$as === void 0 ? "div" : _ref$as,
@@ -6836,7 +6866,7 @@
       _ref$invert = _ref.invert,
       invert = _ref$invert === void 0 ? false : _ref$invert,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, _excluded$D);
+      rest = _objectWithoutProperties(_ref, _excluded$C);
     var internalRef = useInitScrollRef(null, invert);
     var handleRef = useForkRef(internalRef, ref);
     var props = _objectSpread2(_objectSpread2({}, rest), {}, {
@@ -7310,7 +7340,7 @@
   });
   StyledInput$1.displayName = "StyledInput";
 
-  var _excluded$C = ["className", "style", "type", "disabled", "size", "invalid", "startAdornment", "endAdornment", "wrapRef"];
+  var _excluded$B = ["className", "style", "type", "disabled", "size", "invalid", "startAdornment", "endAdornment", "wrapRef"];
   var Input = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var _ref$className = _ref.className,
       className = _ref$className === void 0 ? "" : _ref$className,
@@ -7326,7 +7356,7 @@
       startAdornment = _ref.startAdornment,
       endAdornment = _ref.endAdornment,
       wrapRef = _ref.wrapRef,
-      rest = _objectWithoutProperties(_ref, _excluded$C);
+      rest = _objectWithoutProperties(_ref, _excluded$B);
     var intInputRef = React.useRef(null);
     var handleRef = useForkRef(ref, intInputRef);
     var handleWrapperClick = React.useCallback(function () {
@@ -7377,14 +7407,14 @@
   }, StyledRadioLabel);
   StyledRadioButton$1.displayName = "StyledRadioButton";
 
-  var _excluded$B = ["className", "id", "hover"];
+  var _excluded$A = ["className", "id", "hover"];
   var RadioButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$className = _ref.className,
       className = _ref$className === void 0 ? "" : _ref$className,
       _ref$id = _ref.id,
       id = _ref$id === void 0 ? "radio" : _ref$id,
       hover = _ref.hover,
-      props = _objectWithoutProperties(_ref, _excluded$B);
+      props = _objectWithoutProperties(_ref, _excluded$A);
     return /*#__PURE__*/React__default["default"].createElement(StyledRadioButton$1, {
       className: classNames__default["default"]("c-radio-btn", {
         "c-radio-btn__hover": hover,
@@ -7476,7 +7506,7 @@
   };
   OptionContent.displayName = "OptionContent";
 
-  var _excluded$A = ["type", "mode", "target", "options", "selected", "position", "onChange", "actionIcon", "actionLabel", "placeholder", "emptyAction", "disableSearch", "forceCloseMenu", "selectClassName", "keepSameOptionsOrder", "onSelectOpen", "onSelectClose", "renderOption", "handleDefaultOptionChange", "preselectDefaultValue"];
+  var _excluded$z = ["type", "mode", "target", "options", "selected", "position", "onChange", "actionIcon", "actionLabel", "placeholder", "emptyAction", "disableSearch", "forceCloseMenu", "selectClassName", "keepSameOptionsOrder", "onSelectOpen", "onSelectClose", "renderOption", "handleDefaultOptionChange", "preselectDefaultValue"];
   var Select = function Select(_ref) {
     var _ref$type = _ref.type,
       type = _ref$type === void 0 ? "single" : _ref$type,
@@ -7510,7 +7540,7 @@
       handleDefaultOptionChange = _ref.handleDefaultOptionChange,
       _ref$preselectDefault = _ref.preselectDefaultValue,
       preselectDefaultValue = _ref$preselectDefault === void 0 ? type === "single" : _ref$preselectDefault,
-      prop = _objectWithoutProperties(_ref, _excluded$A);
+      prop = _objectWithoutProperties(_ref, _excluded$z);
     var _useState = React.useState(),
       _useState2 = _slicedToArray(_useState, 2),
       childNode = _useState2[0],
@@ -7754,7 +7784,7 @@
   });
   StyledNavAsMoreTarget.displayName = "StyledNavAsMoreTarget";
 
-  var _excluded$z = ["children", "active", "disabled", "className", "role"];
+  var _excluded$y = ["children", "active", "disabled", "className", "role"];
   var Item = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var children = _ref.children,
       _ref$active = _ref.active,
@@ -7763,7 +7793,7 @@
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       className = _ref.className,
       role = _ref.role,
-      rest = _objectWithoutProperties(_ref, _excluded$z);
+      rest = _objectWithoutProperties(_ref, _excluded$y);
     return /*#__PURE__*/React__default["default"].createElement(StyledNavListItem, _extends({
       className: classNames__default["default"]("c-nav__item", {
         "c-nav__item--active": active
@@ -7804,11 +7834,11 @@
   });
   StyledExpandSingle.displayName = "StyledExpandSingle";
 
-  var _excluded$y = ["expanded"];
+  var _excluded$x = ["expanded"];
   var ExpandSingle = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$expanded = _ref.expanded,
       expanded = _ref$expanded === void 0 ? false : _ref$expanded,
-      rest = _objectWithoutProperties(_ref, _excluded$y);
+      rest = _objectWithoutProperties(_ref, _excluded$x);
     return /*#__PURE__*/React__default["default"].createElement(StyledExpandSingle, _extends({
       ref: ref,
       viewBox: "0 0 24 24",
@@ -8098,7 +8128,7 @@
   };
   Nav.displayName = "Nav";
 
-  var _excluded$x = ["children", "as", "disablePointerEvents"];
+  var _excluded$w = ["children", "as", "disablePointerEvents"];
   var InputAdornmentBase = styled__default["default"].div.withConfig({
     displayName: "InputAdornment__InputAdornmentBase",
     componentId: "sc-1xfjx1z-0"
@@ -8115,7 +8145,7 @@
     var children = _ref.children,
       as = _ref.as,
       disablePointerEvents = _ref.disablePointerEvents,
-      rest = _objectWithoutProperties(_ref, _excluded$x);
+      rest = _objectWithoutProperties(_ref, _excluded$w);
     var Component = as || "div";
     return /*#__PURE__*/React__default["default"].createElement(InputAdornmentBase, _extends({}, rest, {
       as: Component,
@@ -8125,11 +8155,11 @@
   });
   InputAdornment.displayName = "InputAdornment";
 
-  var _excluded$w = ["expanded"];
+  var _excluded$v = ["expanded"];
   var ExpandAll = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$expanded = _ref.expanded,
       expanded = _ref$expanded === void 0 ? false : _ref$expanded,
-      rest = _objectWithoutProperties(_ref, _excluded$w);
+      rest = _objectWithoutProperties(_ref, _excluded$v);
     return /*#__PURE__*/React__default["default"].createElement(StyledExpand, _extends({
       ref: ref,
       viewBox: "0 0 24 24"
@@ -8331,14 +8361,14 @@
   });
   StyledTextarea.displayName = "StyledTextarea";
 
-  var _excluded$v = ["className", "disabled", "invalid"];
+  var _excluded$u = ["className", "disabled", "invalid"];
   var Textarea = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$invalid = _ref.invalid,
       invalid = _ref$invalid === void 0 ? false : _ref$invalid,
-      rest = _objectWithoutProperties(_ref, _excluded$v);
+      rest = _objectWithoutProperties(_ref, _excluded$u);
     return /*#__PURE__*/React__default["default"].createElement(StyledTextarea, _extends({}, rest, {
       $invalid: invalid,
       ref: ref,
@@ -8370,7 +8400,7 @@
     function () {});
   }
 
-  var _excluded$u = ["children", "disableFocusLock", "disableScrollLock", "disableBackgroundClick", "disableBackgroundColor", "disableCloseOnEsc", "open", "onClose"];
+  var _excluded$t = ["children", "disableFocusLock", "disableScrollLock", "disableBackgroundClick", "disableBackgroundColor", "disableCloseOnEsc", "open", "onClose"];
   var getHasTransition = function getHasTransition(children) {
     return children.props ? Object.prototype.hasOwnProperty.call(children.props, "in") : false;
   };
@@ -8389,7 +8419,7 @@
       _ref$open = _ref.open,
       defaultOpen = _ref$open === void 0 ? false : _ref$open,
       onClose = _ref.onClose,
-      rest = _objectWithoutProperties(_ref, _excluded$u);
+      rest = _objectWithoutProperties(_ref, _excluded$t);
     var _useState = React.useState(defaultOpen),
       _useState2 = _slicedToArray(_useState, 2),
       open = _useState2[0],
@@ -8523,7 +8553,7 @@
   });
   StyledCssTransition.displayName = "StyledCssTransition";
 
-  var _excluded$t = ["children", "onClose", "controls", "open", "animation", "position", "mode", "disableFocusLock", "disableScrollLock", "disableBackgroundColor", "bodyStyle", "bodyClassName", "disableBackgroundClick"];
+  var _excluded$s = ["children", "onClose", "controls", "open", "animation", "position", "mode", "disableFocusLock", "disableScrollLock", "disableBackgroundColor", "bodyStyle", "bodyClassName", "disableBackgroundClick"];
   var Sheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       onClose = _ref.onClose,
@@ -8547,7 +8577,7 @@
       bodyClassName = _ref.bodyClassName,
       _ref$disableBackgroun2 = _ref.disableBackgroundClick,
       disableBackgroundClick = _ref$disableBackgroun2 === void 0 ? false : _ref$disableBackgroun2,
-      rest = _objectWithoutProperties(_ref, _excluded$t);
+      rest = _objectWithoutProperties(_ref, _excluded$s);
     var _useState = React.useState(defaultOpen),
       _useState2 = _slicedToArray(_useState, 2),
       open = _useState2[0],
@@ -8638,13 +8668,13 @@
   });
   StyledHeader.displayName = "StyledHeader";
 
-  var _excluded$s = ["className", "size", "children"];
+  var _excluded$r = ["className", "size", "children"];
   var Header = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? "small" : _ref$size,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$s);
+      rest = _objectWithoutProperties(_ref, _excluded$r);
     return /*#__PURE__*/React__default["default"].createElement(StyledHeader, _extends({
       type: "paper-2",
       className: classNames__default["default"]("c-header", className),
@@ -8660,7 +8690,7 @@
   })(["white-space:pre-wrap;overflow-wrap:break-word;resize:none;"]);
   StyledAutoResizeTextarea.displayName = "StyledAutoResizeTextarea";
 
-  var _excluded$r = ["minRows", "maxRows", "lineHeight", "onChange", "className", "preventNewRowOnEnter", "cursorAtTextEnd", "onKeyDown", "value"];
+  var _excluded$q = ["minRows", "maxRows", "lineHeight", "onChange", "className", "preventNewRowOnEnter", "cursorAtTextEnd", "onKeyDown", "value"];
   var AutoResizeTextarea = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$minRows = _ref.minRows,
       minRows = _ref$minRows === void 0 ? 1 : _ref$minRows,
@@ -8676,7 +8706,7 @@
       cursorAtTextEnd = _ref$cursorAtTextEnd === void 0 ? false : _ref$cursorAtTextEnd,
       onKeyDown = _ref.onKeyDown,
       value = _ref.value,
-      rest = _objectWithoutProperties(_ref, _excluded$r);
+      rest = _objectWithoutProperties(_ref, _excluded$q);
     var innerRef = React.useRef(null);
     var _useState = React.useState(minRows),
       _useState2 = _slicedToArray(_useState, 2),
@@ -8952,7 +8982,7 @@
   });
   StyledChoose.displayName = "StyledChoose";
 
-  var _excluded$q = ["children", "disabled", "active", "className"];
+  var _excluded$p = ["children", "disabled", "active", "className"];
   /**
    * Choose component
    */
@@ -8963,7 +8993,7 @@
       _ref$active = _ref.active,
       active = _ref$active === void 0 ? false : _ref$active,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$q);
+      args = _objectWithoutProperties(_ref, _excluded$p);
     return /*#__PURE__*/React__default["default"].createElement(StyledChoose, _extends({
       disabled: disabled,
       className: classNames__default["default"]("c-choose", className),
@@ -9055,21 +9085,21 @@
   StyledLinkElements.displayName = "StyledLinkElements";
   StyledLink.displayName = "StyledLink";
 
-  var _excluded$p = ["children", "className"];
+  var _excluded$o = ["children", "className"];
   /**
    * Back link component
    */
   var BackLink = function BackLink(_ref) {
     var children = _ref.children,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$p);
+      args = _objectWithoutProperties(_ref, _excluded$o);
     return /*#__PURE__*/React__default["default"].createElement(StyledBackLink, _extends({
       className: classNames__default["default"]("c-back-link", className)
     }, args), children);
   };
   BackLink.displayName = "BackLink";
 
-  var _excluded$o = ["as", "children", "variant", "size", "disabled", "className"];
+  var _excluded$n = ["as", "children", "variant", "size", "disabled", "className"];
   /**
    * Link component
    */
@@ -9082,7 +9112,7 @@
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$o);
+      args = _objectWithoutProperties(_ref, _excluded$n);
     var Component = as || "a";
     return /*#__PURE__*/React__default["default"].createElement(StyledLink, _extends({
       ref: ref,
@@ -9193,7 +9223,7 @@
   })(["padding:20px 30px;", " ", ""], FontStyle, BoxSizingStyle);
   StyledDialogActions.displayName = "StyledDialogActions";
 
-  var _excluded$n = ["children", "className", "disableDefaultHeading"];
+  var _excluded$m = ["children", "className", "disableDefaultHeading"];
   // import { useDialogContext } from "./DialogContext";
 
   var DialogTitle = function DialogTitle(_ref) {
@@ -9201,7 +9231,7 @@
       className = _ref.className,
       _ref$disableDefaultHe = _ref.disableDefaultHeading,
       disableDefaultHeading = _ref$disableDefaultHe === void 0 ? false : _ref$disableDefaultHe,
-      rest = _objectWithoutProperties(_ref, _excluded$n);
+      rest = _objectWithoutProperties(_ref, _excluded$m);
     // useDialogContext();
 
     return /*#__PURE__*/React__default["default"].createElement(StyledDialogTitle, _extends({
@@ -9210,13 +9240,13 @@
   };
   DialogTitle.displayName = "DialogTitle";
 
-  var _excluded$m = ["className", "children"];
+  var _excluded$l = ["className", "children"];
   // import { useDialogContext } from "./DialogContext";
 
   var DialogContent = function DialogContent(_ref) {
     var className = _ref.className,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$m);
+      rest = _objectWithoutProperties(_ref, _excluded$l);
     // useDialogContext();
 
     return /*#__PURE__*/React__default["default"].createElement(StyledDialogContent, _extends({
@@ -9237,13 +9267,13 @@
   };
   DialogContentDivider.displayName = "DialogContentDivider";
 
-  var _excluded$l = ["className", "children"];
+  var _excluded$k = ["className", "children"];
   // import { useDialogContext } from "./DialogContext";
 
   var DialogActions = function DialogActions(_ref) {
     var className = _ref.className,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$l);
+      rest = _objectWithoutProperties(_ref, _excluded$k);
     // useDialogContext();
 
     return /*#__PURE__*/React__default["default"].createElement(StyledDialogActions, _extends({
@@ -9471,7 +9501,7 @@
       popperTooltipStyle: {
         zIndex: 1301
       }
-    }, /*#__PURE__*/React__default["default"].createElement(Button, {
+    }, /*#__PURE__*/React__default["default"].createElement(IconButton, {
       size: "small",
       variant: "text gray",
       onClick: onCancel
@@ -9497,7 +9527,7 @@
   });
   StyledPressed.displayName = "StyledPressed";
 
-  var _excluded$k = ["children", "active", "className"];
+  var _excluded$j = ["children", "active", "className"];
   /**
    * Pressed wrapper for button component
    */
@@ -9506,7 +9536,7 @@
       _ref$active = _ref.active,
       active = _ref$active === void 0 ? false : _ref$active,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$k);
+      args = _objectWithoutProperties(_ref, _excluded$j);
     return /*#__PURE__*/React__default["default"].createElement(StyledPressed, _extends({
       active: active,
       ref: ref,
@@ -9959,7 +9989,7 @@
   StyledToastMessage.displayName = "StyledToastMessage";
   StyledCloseSmallIcon.displayName = "StyledCloseSmallIcon";
 
-  var _excluded$j = ["text", "type", "onClose", "dismissible", "dropShadow", "timeout"];
+  var _excluded$i = ["text", "type", "onClose", "dismissible", "dropShadow", "timeout"];
   var ToastMessage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var text = _ref.text,
       type = _ref.type,
@@ -9970,7 +10000,7 @@
       dropShadow = _ref$dropShadow === void 0 ? false : _ref$dropShadow,
       _ref$timeout = _ref.timeout,
       timeout = _ref$timeout === void 0 ? 0 : _ref$timeout,
-      rest = _objectWithoutProperties(_ref, _excluded$j);
+      rest = _objectWithoutProperties(_ref, _excluded$i);
     var handleOnClose = React.useCallback(function () {
       if (typeof onClose === "function") {
         onClose();
@@ -9994,7 +10024,7 @@
   });
   ToastMessage.displayName = "ToastMessage";
 
-  var _excluded$i = ["in", "children", "style", "timeout"];
+  var _excluded$h = ["in", "children", "style", "timeout"];
   var defaultStyle$1 = function defaultStyle(duration) {
     return {
       transition: "all ".concat(duration, "ms ease-in-out"),
@@ -10022,7 +10052,7 @@
       style = _ref.style,
       _ref$timeout = _ref.timeout,
       timeout = _ref$timeout === void 0 ? 500 : _ref$timeout,
-      rest = _objectWithoutProperties(_ref, _excluded$i);
+      rest = _objectWithoutProperties(_ref, _excluded$h);
     return /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.Transition, _extends({
       appear: true,
       in: inProp,
@@ -10037,7 +10067,7 @@
   };
   Fade.displayName = "Fade";
 
-  var _excluded$h = ["in", "children", "style", "timeout", "initialDirection"];
+  var _excluded$g = ["in", "children", "style", "timeout", "initialDirection"];
   var Slide = function Slide(_ref) {
     var _ref$in = _ref.in,
       inProp = _ref$in === void 0 ? false : _ref$in,
@@ -10047,7 +10077,7 @@
       timeout = _ref$timeout === void 0 ? 300 : _ref$timeout,
       _ref$initialDirection = _ref.initialDirection,
       initialDirection = _ref$initialDirection === void 0 ? "left" : _ref$initialDirection,
-      rest = _objectWithoutProperties(_ref, _excluded$h);
+      rest = _objectWithoutProperties(_ref, _excluded$g);
     var directionSign;
     switch (initialDirection) {
       case "right":
@@ -10100,12 +10130,12 @@
     return props.$direction === "right" && styled.css(["&.c-slide-enter{position:absolute;transform:translateX(-100%);}&.c-slide-enter-active{transform:translateX(0%);transition:all 200ms ease;}&.c-slide-exit{position:absolute;}&.c-slide-exit-active{transform:translateX(100%);transition:all 200ms ease;}"]);
   });
 
-  var _excluded$g = ["children", "direction"];
+  var _excluded$f = ["children", "direction"];
   var SlideLeftRightTransition = function SlideLeftRightTransition(_ref) {
     var children = _ref.children,
       _ref$direction = _ref.direction,
       direction = _ref$direction === void 0 ? "left" : _ref$direction,
-      props = _objectWithoutProperties(_ref, _excluded$g);
+      props = _objectWithoutProperties(_ref, _excluded$f);
     return /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, _extends({
       timeout: 200,
       classNames: "c-slide",
@@ -10148,7 +10178,7 @@
   };
   ResizeTransition.displayName = "ResizeTransition";
 
-  var _excluded$f = ["in", "children", "style", "timeout"];
+  var _excluded$e = ["in", "children", "style", "timeout"];
   var defaultStyle = function defaultStyle(duration) {
     return {
       transition: "all ".concat(duration, "ms ease-in"),
@@ -10182,7 +10212,7 @@
       style = _ref.style,
       _ref$timeout = _ref.timeout,
       timeout = _ref$timeout === void 0 ? 200 : _ref$timeout,
-      rest = _objectWithoutProperties(_ref, _excluded$f);
+      rest = _objectWithoutProperties(_ref, _excluded$e);
     return /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.Transition, _extends({
       appear: true,
       in: inProp,
@@ -10256,7 +10286,7 @@
   });
   StyledValueButton.displayName = "StyledValueButton";
 
-  var _excluded$e = ["active", "alwaysShowIcon", "icon", "label", "value"];
+  var _excluded$d = ["active", "alwaysShowIcon", "icon", "label", "value"];
   var ValueButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$active = _ref.active,
       active = _ref$active === void 0 ? false : _ref$active,
@@ -10265,7 +10295,7 @@
       icon = _ref.icon,
       label = _ref.label,
       value = _ref.value,
-      args = _objectWithoutProperties(_ref, _excluded$e);
+      args = _objectWithoutProperties(_ref, _excluded$d);
     return /*#__PURE__*/React__default["default"].createElement(StyledValueButton, _extends({
       className: "c-value-button"
     }, args, {
@@ -10294,12 +10324,12 @@
   })(["border:none;margin:0;padding:0;width:auto;overflow:visible;cursor:pointer;background:transparent;outline:none;color:inherit;font:inherit;line-height:inherit;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none;&::-moz-focus-inner{border:0;padding:0;}"]);
   StyledButton.displayName = "StyledButton";
 
-  var _excluded$d = ["children", "type"];
+  var _excluded$c = ["children", "type"];
   var Trigger = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       _ref$type = _ref.type,
       type = _ref$type === void 0 ? "button" : _ref$type,
-      rest = _objectWithoutProperties(_ref, _excluded$d);
+      rest = _objectWithoutProperties(_ref, _excluded$c);
     return /*#__PURE__*/React__default["default"].createElement(StyledButton, _extends({
       ref: ref,
       role: "button",
@@ -10345,7 +10375,7 @@
   });
   StyledCaretIcon.displayName = "StyledCaretIcon";
 
-  var _excluded$c = ["children", "type", "size", "invalid", "open", "endAdornment"];
+  var _excluded$b = ["children", "type", "size", "invalid", "open", "endAdornment"];
   var SelectTrigger = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       _ref$type = _ref.type,
@@ -10357,7 +10387,7 @@
       _ref$open = _ref.open,
       open = _ref$open === void 0 ? false : _ref$open,
       endAdornment = _ref.endAdornment,
-      rest = _objectWithoutProperties(_ref, _excluded$c);
+      rest = _objectWithoutProperties(_ref, _excluded$b);
     return /*#__PURE__*/React__default["default"].createElement(StyledSelectTrigger, _extends({
       ref: ref,
       role: "button",
@@ -10404,11 +10434,11 @@
   });
   StyledToggle.displayName = "StyledToggle";
 
-  var _excluded$b = ["hovered", "className"];
+  var _excluded$a = ["hovered", "className"];
   var Toggle = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var hovered = _ref.hovered,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$b);
+      args = _objectWithoutProperties(_ref, _excluded$a);
     return /*#__PURE__*/React__default["default"].createElement(StyledToggle, {
       className: classNames__default["default"]("c-toggle", className),
       $isHovered: hovered,
@@ -10561,7 +10591,7 @@
   });
   ChipCloseIcon.displayName = "ChipCloseIcon";
 
-  var _excluded$a = ["leftAdornment", "label", "onClose", "size", "color", "backgroundColor", "closeClassName", "variant", "typographyProps"];
+  var _excluded$9 = ["leftAdornment", "label", "onClose", "size", "color", "backgroundColor", "closeClassName", "variant", "typographyProps"];
   var Chip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var leftAdornment = _ref.leftAdornment,
       label = _ref.label,
@@ -10573,7 +10603,7 @@
       closeClassName = _ref.closeClassName,
       variant = _ref.variant,
       typographyProps = _ref.typographyProps,
-      rest = _objectWithoutProperties(_ref, _excluded$a);
+      rest = _objectWithoutProperties(_ref, _excluded$9);
     var showClose = typeof onClose === "function";
     var _variant = React.useMemo(function () {
       if (typeof variant !== "undefined") {
@@ -10640,7 +10670,7 @@
     return condition ? wrap(children) : children;
   };
 
-  var _excluded$9 = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid", "type", "renderChip", "forceCloseMenu", "renderOption", "limitChips", "hiddenNumberText", "inPortal", "inputWrapperClassName", "scrollWrapper"];
+  var _excluded$8 = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid", "type", "renderChip", "forceCloseMenu", "renderOption", "limitChips", "hiddenNumberText", "inPortal", "inputWrapperClassName", "scrollWrapper"];
   var ComboBox = function ComboBox(_ref) {
     var _comboBoxRef$current2, _comboBoxRef$current3;
     var _ref$options = _ref.options,
@@ -10671,7 +10701,7 @@
       inPortal = _ref$inPortal === void 0 ? false : _ref$inPortal,
       inputWrapperClassName = _ref.inputWrapperClassName,
       scrollWrapper = _ref.scrollWrapper,
-      prop = _objectWithoutProperties(_ref, _excluded$9);
+      prop = _objectWithoutProperties(_ref, _excluded$8);
     var selectedName = React.useMemo(function () {
       var value = "";
       if (!selected) {
@@ -10942,7 +10972,7 @@
       startAdornment: startAdornment,
       endAdornment: !disabled ? /*#__PURE__*/React__default["default"].createElement(InputAdornment, {
         disablePointerEvents: disabled
-      }, loading ? /*#__PURE__*/React__default["default"].createElement(SpinnerLoader, null) : selected ? /*#__PURE__*/React__default["default"].createElement(Button, {
+      }, loading ? /*#__PURE__*/React__default["default"].createElement(SpinnerLoader, null) : selected ? /*#__PURE__*/React__default["default"].createElement(IconButton, {
         onMouseDown: handleMouseDown,
         onClick: handleDeselect,
         variant: "text gray",
@@ -11024,11 +11054,11 @@
   })(["display:flex;justify-content:center;gap:12px;align-items:center;height:32px;padding:4px 16px 4px 4px;position:relative;background:none;border:none;cursor:pointer;&:before{content:\"\";display:block;height:2px;width:0%;position:absolute;left:16px;background:var(--color-primary);transition:ease 0.3s all;border-radius:30px;opacity:0;}&:hover{", "{color:var(--page-paper-main);}&:before{height:32px;width:100%;left:0;opacity:1;}", "{fill:var(--page-paper-main);transform:rotate(90deg);transition:ease 0.3s;}}"], StyledText, StyledAddCrossIcon);
   StyledAddToListButton.displayName = "StyledAddToListButton";
 
-  var _excluded$8 = ["text", "className"];
+  var _excluded$7 = ["text", "className"];
   var AddToListButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var text = _ref.text,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$8);
+      rest = _objectWithoutProperties(_ref, _excluded$7);
     return /*#__PURE__*/React__default["default"].createElement(StyledAddToListButton, _extends({
       ref: ref,
       className: classNames__default["default"]("c--add-to-list-btn", className)
@@ -11424,7 +11454,7 @@
   ThumbsDownIcon.displayName = "ThumbsDownIcon";
   var ThumbsDownIcon$1 = ThumbsDownIcon;
 
-  var _excluded$7 = ["invalid", "required", "size", "children", "className", "weight"];
+  var _excluded$6 = ["invalid", "required", "size", "children", "className", "weight"];
   var Label = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$invalid = _ref.invalid,
       invalid = _ref$invalid === void 0 ? false : _ref$invalid,
@@ -11436,7 +11466,7 @@
       className = _ref.className,
       _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "bold" : _ref$weight,
-      props = _objectWithoutProperties(_ref, _excluded$7);
+      props = _objectWithoutProperties(_ref, _excluded$6);
     var color = invalid ? "alert" : "primary";
     var variant = size === "regular" ? "Body 2" : "Caption 1";
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
@@ -11594,7 +11624,7 @@
   });
   StyledInput.displayName = "StyledInput";
 
-  var _excluded$6 = ["className", "variant", "weight", "disabled", "inputProps", "wrapRef"];
+  var _excluded$5 = ["className", "variant", "weight", "disabled", "inputProps", "wrapRef"];
   var EditableContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
       _ref$variant = _ref.variant,
@@ -11604,7 +11634,7 @@
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       inputProps = _ref.inputProps,
       wrapRef = _ref.wrapRef,
-      props = _objectWithoutProperties(_ref, _excluded$6);
+      props = _objectWithoutProperties(_ref, _excluded$5);
     var intInputRef = React.useRef(null);
     var handleRef = useForkRef(ref, intInputRef);
     var handleBlur = React.useCallback(function (evt) {
@@ -11633,13 +11663,13 @@
   });
   EditableContent.displayName = "EditableContent";
 
-  var _excluded$5 = ["onSave", "onCancel", "value", "inputProps"];
+  var _excluded$4 = ["onSave", "onCancel", "value", "inputProps"];
   var EditableText = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var onSave = _ref.onSave,
       onCancel = _ref.onCancel,
       value = _ref.value,
       inputProps = _ref.inputProps,
-      props = _objectWithoutProperties(_ref, _excluded$5);
+      props = _objectWithoutProperties(_ref, _excluded$4);
     var _useState = React.useState(value),
       _useState2 = _slicedToArray(_useState, 2),
       currentValue = _useState2[0],
@@ -11697,11 +11727,11 @@
   });
   EditableText.displayName = "EditableText";
 
-  var _excluded$4 = ["withDocuments"];
+  var _excluded$3 = ["withDocuments"];
   var FolderIcon = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, svgRef) {
     var _ref$withDocuments = _ref.withDocuments,
       withDocuments = _ref$withDocuments === void 0 ? false : _ref$withDocuments,
-      props = _objectWithoutProperties(_ref, _excluded$4);
+      props = _objectWithoutProperties(_ref, _excluded$3);
     return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
       width: 100,
       height: 100,
@@ -11844,7 +11874,7 @@
     return $renderAs === "list" && styled.css(["justify-self:flex-end;"]);
   });
 
-  var _excluded$3 = ["children", "gap", "renderAs"];
+  var _excluded$2 = ["children", "gap", "renderAs"];
   var EntityGroupContext = /*#__PURE__*/React__default["default"].createContext({
     renderAs: "grid"
   });
@@ -11853,7 +11883,7 @@
       gap = _ref.gap,
       _ref$renderAs = _ref.renderAs,
       renderAs = _ref$renderAs === void 0 ? "grid" : _ref$renderAs,
-      rest = _objectWithoutProperties(_ref, _excluded$3);
+      rest = _objectWithoutProperties(_ref, _excluded$2);
     return /*#__PURE__*/React__default["default"].createElement(EntityGroupContext.Provider, {
       value: {
         renderAs: renderAs
@@ -11865,14 +11895,14 @@
   };
   EntityGroup.displayName = "EntityGroup";
 
-  var _excluded$2 = ["children", "isCollection", "background", "className", "as"];
+  var _excluded$1 = ["children", "isCollection", "background", "className", "as"];
   var EntityCard = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       isCollection = _ref.isCollection,
       background = _ref.background,
       className = _ref.className,
       as = _ref.as,
-      rest = _objectWithoutProperties(_ref, _excluded$2);
+      rest = _objectWithoutProperties(_ref, _excluded$1);
     var _useContext = React.useContext(EntityGroupContext),
       renderAs = _useContext.renderAs;
     var classSuffix = "c-entity-card-".concat(renderAs);
@@ -11891,13 +11921,13 @@
   });
   EntityCard.displayName = "EntityCard";
 
-  var _excluded$1 = ["listOrder", "listWidth", "visibleFromBreakpoint", "className"];
+  var _excluded = ["listOrder", "listWidth", "visibleFromBreakpoint", "className"];
   var EntityProperty = function EntityProperty(_ref) {
     var listOrder = _ref.listOrder,
       listWidth = _ref.listWidth,
       visibleFromBreakpoint = _ref.visibleFromBreakpoint,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$1);
+      props = _objectWithoutProperties(_ref, _excluded);
     var _useContext = React.useContext(EntityGroupContext),
       renderAs = _useContext.renderAs;
     var classSuffix = "c-entity-property-".concat(renderAs);
@@ -11937,7 +11967,7 @@
       ref: ref
     }, /*#__PURE__*/React__default["default"].createElement(MenuHeader, {
       title: title,
-      leftElement: /*#__PURE__*/React__default["default"].createElement(Button, {
+      leftElement: /*#__PURE__*/React__default["default"].createElement(IconButton, {
         onClick: onBack,
         variant: "text gray",
         size: "small"
@@ -12293,12 +12323,12 @@
       }
       return onNextButtonClick && onNextButtonClick();
     }, [isLast, onClose, onNextButtonClick]);
-    return !skip ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeader, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React__default["default"].createElement(Button, {
+    return !skip ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeader, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React__default["default"].createElement(IconButton, {
       onClick: onPreviousButtonClick,
       variant: "text gray",
       className: "tw--ml-3 tw-mr-2",
       disabled: changingStepInProgress
-    }, /*#__PURE__*/React__default["default"].createElement(ArrowBackMobileIcon$1, null)) : null, /*#__PURE__*/React__default["default"].createElement(StyledStepTitle, null, /*#__PURE__*/React__default["default"].createElement(Caption2, null, title), /*#__PURE__*/React__default["default"].createElement(Header3, null, subtitle))), /*#__PURE__*/React__default["default"].createElement(Button, {
+    }, /*#__PURE__*/React__default["default"].createElement(ArrowBackMobileIcon$1, null)) : null, /*#__PURE__*/React__default["default"].createElement(StyledStepTitle, null, /*#__PURE__*/React__default["default"].createElement(Caption2, null, title), /*#__PURE__*/React__default["default"].createElement(Header3, null, subtitle))), /*#__PURE__*/React__default["default"].createElement(IconButton, {
       onClick: onClose,
       variant: "text gray",
       disabled: changingStepInProgress
@@ -12386,36 +12416,6 @@
   });
   Wizard.displayName = "Wizard";
 
-  var StyledIconButton = styled__default["default"](Button).withConfig({
-    displayName: "Styles__StyledIconButton",
-    componentId: "sc-1teza2f-0"
-  })(["display:flex;justify-content:center;align-items:center;padding:0;width:32px;", " ", ""], function (_ref) {
-    var size = _ref.size;
-    return size === "small" && styled.css(["width:24px;"]);
-  }, function (_ref2) {
-    var size = _ref2.size;
-    return size === "big" && styled.css(["width:40px;"]);
-  });
-
-  var _excluded = ["children", "className", "variant", "size"];
-
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
-
-  var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-    var children = _ref.children,
-      className = _ref.className,
-      variant = _ref.variant,
-      size = _ref.size,
-      args = _objectWithoutProperties(_ref, _excluded);
-    return /*#__PURE__*/React__default["default"].createElement(StyledIconButton, _extends({
-      className: classNames__default["default"]("c-btn--icon-only", className),
-      variant: variant,
-      size: size,
-      ref: ref
-    }, args), children);
-  });
-  IconButton.displayName = "IconButton";
-
   exports.Accordion = Accordion;
   exports.AccordionContext = AccordionContext;
   exports.AccordionItem = AccordionItem;