@activecollab/components 1.0.69 → 1.0.72

package/dist/index.js

@@ -314,7 +314,7 @@
   })(["display:inline-flex;svg{margin:0 4px;}"]);
   StyledButtonElement.displayName = "StyledButtonElement";
 
-  var _excluded$W = ["children", "variant", "size", "disabled", "className"];
+  var _excluded$X = ["children", "variant", "size", "disabled", "className"];
 
   /**
    * Button component
@@ -328,7 +328,7 @@
         _ref$disabled = _ref.disabled,
         disabled = _ref$disabled === void 0 ? false : _ref$disabled,
         className = _ref.className,
-        args = _objectWithoutProperties(_ref, _excluded$W);
+        args = _objectWithoutProperties(_ref, _excluded$X);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledButton$1, _extends({
       disabled: disabled,
@@ -381,12 +381,12 @@
   })(["svg{fill:var(--color-theme-100);}&:hover svg{transform:rotate(90deg);transition:ease 0.3s;}"]);
   StyledGlobalAddButton.displayName = "StyledGlobalAddButton";
 
-  var _excluded$V = ["className", "disabled"];
+  var _excluded$W = ["className", "disabled"];
   var GlobalAddButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
         _ref$disabled = _ref.disabled,
         disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-        rest = _objectWithoutProperties(_ref, _excluded$V);
+        rest = _objectWithoutProperties(_ref, _excluded$W);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledGlobalAddButton, _extends({
       ref: ref,
@@ -419,11 +419,11 @@
   });
   StyledButtonGroup$1.displayName = "StyledButtonGroup";
 
-  var _excluded$U = ["children", "className"];
+  var _excluded$V = ["children", "className"];
   var ButtonGroup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
         className = _ref.className,
-        rest = _objectWithoutProperties(_ref, _excluded$U);
+        rest = _objectWithoutProperties(_ref, _excluded$V);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledButtonGroup$1, _extends({
       ref: ref,
@@ -449,7 +449,7 @@
     }, [refA, refB]);
   }
 
-  var _excluded$T = ["children", "anchorEl", "open", "style", "transition", "placement"];
+  var _excluded$U = ["children", "anchorEl", "open", "style", "transition", "placement"];
   var Popper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
         anchorEl = _ref.anchorEl,
@@ -460,7 +460,7 @@
         transition = _ref$transition === void 0 ? false : _ref$transition,
         _ref$placement = _ref.placement,
         initialPlacement = _ref$placement === void 0 ? "bottom" : _ref$placement,
-        rest = _objectWithoutProperties(_ref, _excluded$T);
+        rest = _objectWithoutProperties(_ref, _excluded$U);
 
     var _useState = React.useState(true),
         _useState2 = _slicedToArray(_useState, 2),
@@ -632,11 +632,11 @@
     return props.$isLight && styled.css(["background-color:var(--page-paper-main);box-shadow:var(--shadow-secondary);color:var(--color-theme-700);"]);
   });
 
-  var _excluded$S = ["children"];
+  var _excluded$T = ["children"];
 
   var TooltipAnimation = function TooltipAnimation(_ref) {
     var children = _ref.children,
-        props = _objectWithoutProperties(_ref, _excluded$S);
+        props = _objectWithoutProperties(_ref, _excluded$T);
 
     return /*#__PURE__*/React__default["default"].createElement(FromElement, _extends({
       timeout: 0
@@ -659,7 +659,8 @@
         disable = _ref2.disable;
 
     var _useLayerContext = useLayerContext(),
-        zIndex = _useLayerContext.zIndex;
+        _useLayerContext$zInd = _useLayerContext.zIndex,
+        zIndex = _useLayerContext$zInd === void 0 ? 1300 : _useLayerContext$zInd;
 
     var _useState = React.useState(false),
         _useState2 = _slicedToArray(_useState, 2),
@@ -777,10 +778,12 @@
   var StyledTypography = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledTypography",
     componentId: "sc-mskw5w-0"
-  })(["", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, function (props) {
+  })(["", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, function (props) {
     return colors[props.$color];
   }, function (props) {
     return props.$variant === "Title 1" && styled.css(["font-size:2rem;"]);
+  }, function (props) {
+    return props.$variant === "Title 2" && styled.css(["font-size:1.625rem;"]);
   }, function (props) {
     return props.$variant === "Header 2" && styled.css(["font-size:1.125rem;"]);
   }, function (props) {
@@ -864,7 +867,7 @@
   });
   StyledTypography.displayName = "StyledTypography";
 
-  var _excluded$R = ["variant", "as", "color", "italic", "tabularNums", "letterSpacing", "lineHeight", "align", "decoration", "transform", "overflow", "whitespace", "wordBreak", "weight", "className", "children"];
+  var _excluded$S = ["variant", "as", "color", "italic", "tabularNums", "letterSpacing", "lineHeight", "align", "decoration", "transform", "overflow", "whitespace", "wordBreak", "weight", "className", "children"];
   var Typography = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$variant = _ref.variant,
         variant = _ref$variant === void 0 ? "Title 1" : _ref$variant,
@@ -895,7 +898,7 @@
         weight = _ref$weight === void 0 ? "regular" : _ref$weight,
         className = _ref.className,
         children = _ref.children,
-        props = _objectWithoutProperties(_ref, _excluded$R);
+        props = _objectWithoutProperties(_ref, _excluded$S);
 
     var Component = as || "div";
     return /*#__PURE__*/React__default["default"].createElement(StyledTypography, _extends({
@@ -919,18 +922,18 @@
   });
   Typography.displayName = "Typography";
 
-  var _excluded$Q = ["weight", "children"];
+  var _excluded$R = ["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$Q);
+        props = _objectWithoutProperties(_ref, _excluded$R);
 
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Body 2",
       weight: weight,
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Body2.displayName = "Body2";
 
@@ -965,7 +968,7 @@
   });
   StyledCounterButtonLabel.displayName = "StyledCounterButtonLabel";
 
-  var _excluded$P = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className"];
+  var _excluded$Q = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className"];
   var CounterButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var label = _ref.label,
         icon = _ref.icon,
@@ -975,7 +978,7 @@
         tooltipText = _ref.tooltipText,
         onClearAll = _ref.onClearAll,
         className = _ref.className,
-        args = _objectWithoutProperties(_ref, _excluded$P);
+        args = _objectWithoutProperties(_ref, _excluded$Q);
 
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: classnames__default["default"]("tw-flex ac-font box-sizing", className)
@@ -1008,37 +1011,21 @@
   });
   CounterButton.displayName = "CounterButton";
 
-  var CaretLeftIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
-    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
-      width: 18,
-      height: 18,
-      viewBox: "0 0 18 18",
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "var(--color-theme-600)",
-      ref: svgRef
-    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
-      d: "M10 5v8L6 9l4-4z",
-      fillRule: "evenodd"
-    }));
-  });
-  CaretLeftIcon.displayName = "CaretLeftIcon";
-  var CaretLeftIcon$1 = CaretLeftIcon;
-
-  var CaretRightIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
+  var MenuNavIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
     return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
-      width: 18,
-      height: 18,
-      viewBox: "0 0 18 18",
+      width: 24,
+      height: 24,
+      viewBox: "0 0 24 24",
       xmlns: "http://www.w3.org/2000/svg",
       fill: "var(--color-theme-600)",
       ref: svgRef
     }, props), /*#__PURE__*/React__default["default"].createElement("path", {
-      d: "M8 5v8l4-4-4-4z",
+      d: "M13.45 6.337l-5.657 5.657 5.657 5.657a1 1 0 101.414-1.414l-4.241-4.243 4.241-4.243a1 1 0 00-1.414-1.414z",
       fillRule: "evenodd"
     }));
   });
-  CaretRightIcon.displayName = "CaretRightIcon";
-  var CaretRightIcon$1 = CaretRightIcon;
+  MenuNavIcon.displayName = "MenuNavIcon";
+  var MenuNavIcon$1 = MenuNavIcon;
 
   var customClassNames = {
     container: "c-DayPicker",
@@ -1071,22 +1058,6 @@
     nonWorkingDay: "c-DayPicker-Day--nonWorkingDay"
   };
 
-  var MenuNavIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
-    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
-      width: 24,
-      height: 24,
-      viewBox: "0 0 24 24",
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "var(--color-theme-600)",
-      ref: svgRef
-    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
-      d: "M13.45 6.337l-5.657 5.657 5.657 5.657a1 1 0 101.414-1.414l-4.241-4.243 4.241-4.243a1 1 0 00-1.414-1.414z",
-      fillRule: "evenodd"
-    }));
-  });
-  MenuNavIcon.displayName = "MenuNavIcon";
-  var MenuNavIcon$1 = MenuNavIcon;
-
   var StyledNavBarButton = styled__default["default"](Button).withConfig({
     displayName: "Styles__StyledNavBarButton",
     componentId: "sc-1owijsg-0"
@@ -1345,7 +1316,7 @@
   StyledDatePicker.displayName = "StyledDatePicker";
   StyledDayPicker.displayName = "StyledDayPicker";
 
-  var _excluded$O = ["className", "onChange", "onDayClick", "selectedDays", "disabledDays", "selectionMode", "month", "onMonthChange", "dateRequired", "firstDayOfWeek", "fixedWeeks", "modifiers"];
+  var _excluded$P = ["className", "onChange", "onDayClick", "selectedDays", "disabledDays", "selectionMode", "month", "onMonthChange", "dateRequired", "firstDayOfWeek", "fixedWeeks", "modifiers"];
   var DatePicker = function DatePicker(_ref) {
     var className = _ref.className,
         onChange = _ref.onChange,
@@ -1367,7 +1338,7 @@
         _ref$fixedWeeks = _ref.fixedWeeks,
         fixedWeeks = _ref$fixedWeeks === void 0 ? true : _ref$fixedWeeks,
         defaultModifiers = _ref.modifiers,
-        rest = _objectWithoutProperties(_ref, _excluded$O);
+        rest = _objectWithoutProperties(_ref, _excluded$P);
 
     var _useState = React.useState(),
         _useState2 = _slicedToArray(_useState, 2),
@@ -1712,12 +1683,12 @@
   });
   StyledOverlay.displayName = "StyledOverlay";
 
-  var _excluded$N = ["className", "disableBackgroundColor"];
+  var _excluded$O = ["className", "disableBackgroundColor"];
   var Overlay = function Overlay(_ref) {
     var className = _ref.className,
         _ref$disableBackgroun = _ref.disableBackgroundColor,
         disableBackgroundColor = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
-        rest = _objectWithoutProperties(_ref, _excluded$N);
+        rest = _objectWithoutProperties(_ref, _excluded$O);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledOverlay, _extends({
       className: classnames__default["default"]("c-overlay", className),
@@ -1732,7 +1703,7 @@
   })(["", " ", " position:fixed;top:0;right:0;bottom:0;left:0;"], FontStyle, BoxSizingStyle);
   StyledWindow.displayName = "StyledWindow";
 
-  var _excluded$M = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "preventClickEventBubbling", "onClick"];
+  var _excluded$N = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "preventClickEventBubbling", "onClick"];
   var returnFocus = {
     preventScroll: true
   };
@@ -1749,7 +1720,7 @@
         _ref$preventClickEven = _ref.preventClickEventBubbling,
         preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven,
         onClick = _ref.onClick,
-        rest = _objectWithoutProperties(_ref, _excluded$M);
+        rest = _objectWithoutProperties(_ref, _excluded$N);
 
     var innerRef = React.useRef(null);
     var handleRef = useForkRef(innerRef, ref);
@@ -1823,7 +1794,7 @@
   }, FontStyle, BoxSizingStyle);
   StyledBubble.displayName = "StyledBubble";
 
-  var _excluded$L = ["children", "className", "innerRef", "style"];
+  var _excluded$M = ["children", "className", "innerRef", "style"];
   var Bubble = function Bubble(_ref) {
     var children = _ref.children,
         className = _ref.className,
@@ -1831,7 +1802,7 @@
         innerRef = _ref$innerRef === void 0 ? null : _ref$innerRef,
         _ref$style = _ref.style,
         style = _ref$style === void 0 ? {} : _ref$style,
-        rest = _objectWithoutProperties(_ref, _excluded$L);
+        rest = _objectWithoutProperties(_ref, _excluded$M);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledBubble, _extends({}, rest, {
       ref: innerRef,
@@ -1978,13 +1949,13 @@
   };
   Menu.displayName = "Menu";
 
-  var _excluded$K = ["title", "className", "leftElement", "rightElement"];
+  var _excluded$L = ["title", "className", "leftElement", "rightElement"];
   var MenuHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var title = _ref.title,
         className = _ref.className,
         leftElement = _ref.leftElement,
         rightElement = _ref.rightElement,
-        props = _objectWithoutProperties(_ref, _excluded$K);
+        props = _objectWithoutProperties(_ref, _excluded$L);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledMenuHeader, _extends({}, props, {
       className: classnames__default["default"]("c-menu-header", className),
@@ -2007,11 +1978,11 @@
   });
   MenuHeader.displayName = "MenuHeader";
 
-  var _excluded$J = ["children", "className"];
+  var _excluded$K = ["children", "className"];
   var MenuFooter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
         className = _ref.className,
-        props = _objectWithoutProperties(_ref, _excluded$J);
+        props = _objectWithoutProperties(_ref, _excluded$K);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledMenuFooter, _extends({}, props, {
       className: classnames__default["default"]("c-menu-footer", className),
@@ -2339,7 +2310,7 @@
       variant: "secondary",
       onClick: onLeftClickHandler,
       disabled: isBeforeMinDate
-    }, /*#__PURE__*/React__default["default"].createElement(CaretLeftIcon$1, null)) : null, /*#__PURE__*/React__default["default"].createElement(StyledDiv, {
+    }, /*#__PURE__*/React__default["default"].createElement(MenuNavIcon$1, null)) : null, /*#__PURE__*/React__default["default"].createElement(StyledDiv, {
       $isTargetable: step === "yearly" || !withDatePicker,
       $isRounded: step === "custom",
       style: dateStepperWidth(fromDate, toDate, step)
@@ -2373,7 +2344,11 @@
       variant: "secondary",
       onClick: onRightClickHandler,
       disabled: isAfterMaxDate
-    }, /*#__PURE__*/React__default["default"].createElement(CaretRightIcon$1, null)) : null);
+    }, /*#__PURE__*/React__default["default"].createElement(MenuNavIcon$1, {
+      style: {
+        transform: "rotate(180deg)"
+      }
+    })) : null);
   };
   DateStepper.displayName = "DateStepper";
 
@@ -2679,7 +2654,7 @@
   SortIcon.displayName = "SortIcon";
   var SortIcon$1 = SortIcon;
 
-  var _excluded$I = ["header", "rows", "className", "sortBy", "sortDirection", "onSortCallback", "theadClass", "noResultsCallback", "groupBy", "groupHead", "isCollapsible", "emptyValue"];
+  var _excluded$J = ["header", "rows", "className", "sortBy", "sortDirection", "onSortCallback", "theadClass", "noResultsCallback", "groupBy", "groupHead", "isCollapsible", "emptyValue"];
   exports.SortDirection = void 0;
 
   (function (SortDirection) {
@@ -2729,7 +2704,7 @@
     } : _ref$groupHead,
         isCollapsible = _ref.isCollapsible,
         emptyValue = _ref.emptyValue,
-        args = _objectWithoutProperties(_ref, _excluded$I);
+        args = _objectWithoutProperties(_ref, _excluded$J);
 
     var _useState = React.useState(sortDirection),
         _useState2 = _slicedToArray(_useState, 2),
@@ -3143,7 +3118,7 @@
   });
   StyledPaper.displayName = "StyledPaper";
 
-  var _excluded$H = ["children", "className", "type", "hover", "useOptimizedShadow"];
+  var _excluded$I = ["children", "className", "type", "hover", "useOptimizedShadow"];
 
   /**
    * This is a component description and should sit directly above your component
@@ -3157,7 +3132,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$H);
+        rest = _objectWithoutProperties(_ref, _excluded$I);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledPaper, _extends({
       className: classnames__default["default"](className, {
@@ -3211,7 +3186,7 @@
   });
   StyledCard.displayName = "StyledCard";
 
-  var _excluded$G = ["children", "className", "hoverable", "paperType"];
+  var _excluded$H = ["children", "className", "hoverable", "paperType"];
   var Card = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
         className = _ref.className,
@@ -3219,7 +3194,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$G);
+        rest = _objectWithoutProperties(_ref, _excluded$H);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledCard, _extends({}, rest, {
       type: paperType,
@@ -3301,21 +3276,36 @@
   });
   EntityCard.displayName = "EntityCard";
 
-  var _excluded$F = ["weight", "children"];
+  var _excluded$G = ["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$F);
+        props = _objectWithoutProperties(_ref, _excluded$G);
 
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       weight: weight,
       variant: "Title 1",
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Title1.displayName = "Title1";
 
+  var _excluded$F = ["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$F);
+
+    return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
+      weight: weight,
+      variant: "Title 2",
+      ref: ref
+    }, props), children);
+  });
+  Title2.displayName = "Title2";
+
   var _excluded$E = ["children"];
   var Header2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
@@ -3325,7 +3315,7 @@
       weight: "bold",
       variant: "Header 2",
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Header2.displayName = "Header2";
 
@@ -3338,7 +3328,7 @@
       weight: "bold",
       variant: "Header 3",
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Header3.displayName = "Header3";
 
@@ -3353,7 +3343,7 @@
       variant: "Body 1",
       weight: weight,
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Body1.displayName = "Body1";
 
@@ -3368,7 +3358,7 @@
       variant: "Caption 1",
       weight: weight,
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Caption1.displayName = "Caption1";
 
@@ -3383,7 +3373,7 @@
       variant: "Caption 2",
       weight: weight,
       ref: ref
-    }, props), " ", children, " ");
+    }, props), children);
   });
   Caption2.displayName = "Caption2";
 
@@ -5920,6 +5910,38 @@
   CancelCrossIcon.displayName = "CancelCrossIcon";
   var CancelCrossIcon$1 = CancelCrossIcon;
 
+  var CaretLeftIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
+    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
+      width: 18,
+      height: 18,
+      viewBox: "0 0 18 18",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "var(--color-theme-600)",
+      ref: svgRef
+    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
+      d: "M10 5v8L6 9l4-4z",
+      fillRule: "evenodd"
+    }));
+  });
+  CaretLeftIcon.displayName = "CaretLeftIcon";
+  var CaretLeftIcon$1 = CaretLeftIcon;
+
+  var CaretRightIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
+    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
+      width: 18,
+      height: 18,
+      viewBox: "0 0 18 18",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "var(--color-theme-600)",
+      ref: svgRef
+    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
+      d: "M8 5v8l4-4-4-4z",
+      fillRule: "evenodd"
+    }));
+  });
+  CaretRightIcon.displayName = "CaretRightIcon";
+  var CaretRightIcon$1 = CaretRightIcon;
+
   var ChatIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
     return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
       width: 24,
@@ -6112,38 +6134,6 @@
   CollapsIcon.displayName = "CollapsIcon";
   var CollapsIcon$1 = CollapsIcon;
 
-  var CommentIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
-    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
-      width: 12,
-      height: 12,
-      viewBox: "0 0 12 12",
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "var(--color-theme-600)",
-      ref: svgRef
-    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
-      d: "M2 0C1 0 0 1 0 2v10l2.667-2a5 5 0 013-1H10c1 0 2-1 2-2V2c0-1-1-2-2-2H2zm7.6 1A1.4 1.4 0 0111 2.4v4.2A1.4 1.4 0 019.6 8H5.009a4 4 0 00-2.391.794L1 10V2.4A1.4 1.4 0 012.4 1h7.2zM9 5H3v1h6V5zm0-2H3v1h6V3z",
-      fillRule: "nonzero"
-    }));
-  });
-  CommentIcon.displayName = "CommentIcon";
-  var CommentIcon$1 = CommentIcon;
-
-  var CommentsIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
-    return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
-      width: 12,
-      height: 12,
-      viewBox: "0 0 12 12",
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "var(--color-theme-600)",
-      ref: svgRef
-    }, props), /*#__PURE__*/React__default["default"].createElement("path", {
-      d: "M2 0C1 0 0 1 0 2v10l2.667-2a5 5 0 013-1H10c1 0 2-1 2-2V2c0-1-1-2-2-2H2zm7.6 8H5.009a4 4 0 00-2.391.794L1 10V2.4A1.4 1.4 0 012.4 1h7.2A1.4 1.4 0 0111 2.4v4.2A1.4 1.4 0 019.6 8z",
-      fillRule: "nonzero"
-    }));
-  });
-  CommentsIcon.displayName = "CommentsIcon";
-  var CommentsIcon$1 = CommentsIcon;
-
   var ComputerIcon = /*#__PURE__*/React__default["default"].forwardRef(function (props, svgRef) {
     return /*#__PURE__*/React__default["default"].createElement("svg", _extends({
       width: 24,
@@ -10374,8 +10364,6 @@
   exports.CollapseAllIcon = CollapseAllIcon$1;
   exports.CollapseExpandSingleIcon = CollapseExpandSingleIcon$1;
   exports.ComboBox = ComboBox;
-  exports.CommentIcon = CommentIcon$1;
-  exports.CommentsIcon = CommentsIcon$1;
   exports.CompleteCheckbox = CompleteCheckbox;
   exports.ComputerIcon = ComputerIcon$1;
   exports.ConfirmDialog = ConfirmDialog;
@@ -10544,6 +10532,7 @@
   exports.ThumbsDownIcon = ThumbsDownIcon$1;
   exports.ThumbsUpIcon = ThumbsUpIcon$1;
   exports.Title1 = Title1;
+  exports.Title2 = Title2;
   exports.Toggle = Toggle;
   exports.Tooltip = Tooltip;
   exports.TrashIcon = TrashIcon$1;