@hyphen/hyphen-components 5.2.0 → 5.3.0

package/dist/hyphen-components.esm.js

@@ -16,15 +16,15 @@ import ReactModal from 'react-modal';
 import FocusLock from 'react-focus-lock';
 import { RemoveScroll } from 'react-remove-scroll';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import { getIn } from 'formik';
+import { getIn, useField, FieldArray } from 'formik';
 import Select, { components } from 'react-select';
 import AsyncCreatableSelect from 'react-select/async-creatable';
 import AsyncSelect from 'react-select/async';
 import CreatableSelect from 'react-select/creatable';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { v4 } from 'uuid';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
-import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function (n) {
@@ -42,7 +42,7 @@ function _objectWithoutPropertiesLoose(r, e) {
   if (null == r) return {};
   var t = {};
   for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (e.indexOf(n) >= 0) continue;
+    if (-1 !== e.indexOf(n)) continue;
     t[n] = r[n];
   }
   return t;
@@ -254,7 +254,7 @@ Component, props, getDefault) {
 
 var styles$A = {"box-transition":"Box-module_box-transition__eQx8C"};
 
-var _excluded$Q = ["as", "alignItems", "alignContent", "alignSelf", "background", "borderColor", "borderWidth", "children", "childGap", "className", "color", "columnGap", "cursor", "display", "direction", "flex", "fontFamily", "fontSize", "focus", "fontWeight", "gap", "height", "hover", "justifyContent", "margin", "maxHeight", "minHeight", "maxWidth", "minWidth", "overflow", "padding", "position", "radius", "rowGap", "shadow", "style", "textAlign", "wrap", "width", "zIndex"];
+var _excluded$R = ["as", "alignItems", "alignContent", "alignSelf", "background", "borderColor", "borderWidth", "children", "childGap", "className", "color", "columnGap", "cursor", "display", "direction", "flex", "fontFamily", "fontSize", "focus", "fontWeight", "gap", "height", "hover", "justifyContent", "margin", "maxHeight", "minHeight", "maxWidth", "minWidth", "overflow", "padding", "position", "radius", "rowGap", "shadow", "style", "textAlign", "wrap", "width", "zIndex"];
 /**
  * A `<Box>` is a layout component to build UIs with consistent padding and spacing between
  * elements.
@@ -341,7 +341,7 @@ var Box = /*#__PURE__*/forwardRef(function (_ref, ref) {
     width = _ref$width === void 0 ? undefined : _ref$width,
     _ref$zIndex = _ref.zIndex,
     zIndex = _ref$zIndex === void 0 ? undefined : _ref$zIndex,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$Q);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$R);
   var heightCss = getDimensionCss('h', height);
   var widthCss = getDimensionCss('w', width);
   var maxHeightCss = getDimensionCss('mh', maxHeight);
@@ -492,14 +492,14 @@ var Box = /*#__PURE__*/forwardRef(function (_ref, ref) {
 });
 var boxPropsKeys = ['as', 'alignItems', 'alignContent', 'alignSelf', 'background', 'borderColor', 'borderWidth', 'className', 'childGap', 'children', 'color', 'columnGap', 'cursor', 'direction', 'display', 'flex', 'focus', 'fontFamily', 'fontSize', 'fontWeight', 'gap', 'height', 'hover', 'justifyContent', 'margin', 'maxHeight', 'minHeight', 'maxWidth', 'minWidth', 'overflow', 'padding', 'position', 'radius', 'rowGap', 'shadow', 'style', 'textAlign', 'wrap', 'width', 'zIndex'];
 
-var _excluded$P = ["className", "name", "color", "size"];
+var _excluded$Q = ["className", "name", "color", "size"];
 var Icon = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$className = _ref.className,
     className = _ref$className === void 0 ? undefined : _ref$className,
     name = _ref.name,
     color = _ref.color,
     size = _ref.size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$P);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$Q);
   var IconComponent = icons[name];
   if (!IconComponent) console.error("Icon '" + name + "' not found"); // eslint-disable-line no-console
   var iconClasses = classNames(className, generateResponsiveClasses('font-color', color), generateResponsiveClasses('font-size', size));
@@ -538,7 +538,7 @@ var ALERT_ICONS_MAP = {
   }
 };
 
-var _excluded$O = ["className", "closeText", "hasIcon", "isCompact", "isClosable", "message", "onClose", "render", "title", "variant"];
+var _excluded$P = ["className", "closeText", "hasIcon", "isCompact", "isClosable", "message", "onClose", "render", "title", "variant"];
 var Alert = function Alert(_ref) {
   var _ref$className = _ref.className,
     className = _ref$className === void 0 ? '' : _ref$className,
@@ -560,7 +560,7 @@ var Alert = function Alert(_ref) {
     title = _ref$title === void 0 ? '' : _ref$title,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$O);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$P);
   var handleClose = function handleClose(event) {
     if (!onClose) return;
     onClose(event);
@@ -614,7 +614,7 @@ var Alert = function Alert(_ref) {
 
 var styles$y = {"badge":"Badge-module_badge__ZbEBU","size-sm":"Badge-module_size-sm__rL8a6","size-md":"Badge-module_size-md__kf6IH","size-lg":"Badge-module_size-lg__of6XJ","inverse":"Badge-module_inverse__qZCFA","purple":"Badge-module_purple__rX-xW","green":"Badge-module_green__W03uU","red":"Badge-module_red__fl2jg","blue":"Badge-module_blue__C7kyV","yellow":"Badge-module_yellow__gGZ6R","light-grey":"Badge-module_light-grey__Wtrhx","dark-grey":"Badge-module_dark-grey__X-807","hyphen":"Badge-module_hyphen__9pe7x","size-sm-tablet":"Badge-module_size-sm-tablet__6xMVk","size-md-tablet":"Badge-module_size-md-tablet__4w-7I","size-lg-tablet":"Badge-module_size-lg-tablet__8xyRF","size-sm-desktop":"Badge-module_size-sm-desktop__Ayf5L","size-md-desktop":"Badge-module_size-md-desktop__XSq7m","size-lg-desktop":"Badge-module_size-lg-desktop__Baw3S","size-sm-hd":"Badge-module_size-sm-hd__Da6Au","size-md-hd":"Badge-module_size-md-hd__-VNMk","size-lg-hd":"Badge-module_size-lg-hd__6MOwL"};
 
-var _excluded$N = ["className", "message", "variant", "size"];
+var _excluded$O = ["className", "message", "variant", "size"];
 var Badge = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _classNames;
   var _ref$className = _ref.className,
@@ -625,7 +625,7 @@ var Badge = /*#__PURE__*/forwardRef(function (_ref, ref) {
     variant = _ref$variant === void 0 ? 'light-grey' : _ref$variant,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'md' : _ref$size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$N);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$O);
   var responsiveClasses = generateResponsiveClasses('size', size).map(function (c) {
     return styles$y[c];
   });
@@ -732,7 +732,7 @@ var Spinner = function Spinner(_ref) {
 
 var styles$w = {"button":"Button-module_button__18Bed","size-sm":"Button-module_size-sm__6Xrjw","size-md":"Button-module_size-md__BkuGu","size-lg":"Button-module_size-lg__JVYWV","primary":"Button-module_primary__st6yY","secondary":"Button-module_secondary__j-3rj","tertiary":"Button-module_tertiary__Nd7xM","danger":"Button-module_danger__Hxs5n","size-sm-tablet":"Button-module_size-sm-tablet__9XaSx","size-md-tablet":"Button-module_size-md-tablet__YQxaI","size-lg-tablet":"Button-module_size-lg-tablet__h3l97","size-sm-desktop":"Button-module_size-sm-desktop__8tTsg","size-md-desktop":"Button-module_size-md-desktop__OCdDi","size-lg-desktop":"Button-module_size-lg-desktop__uFc4f","size-sm-hd":"Button-module_size-sm-hd__INFfD","size-md-hd":"Button-module_size-md-hd__8e2mW","size-lg-hd":"Button-module_size-lg-hd__DH60l","loading":"Button-module_loading__QfItr","label":"Button-module_label__1PsXG","full-width":"Button-module_full-width__qDri6","spinner-wrapper":"Button-module_spinner-wrapper__rALNw"};
 
-var _excluded$M = ["asChild", "children", "className", "fullWidth", "iconPrefix", "iconSuffix", "isDisabled", "isLoading", "onClick", "onBlur", "onFocus", "shadow", "size", "type", "variant"];
+var _excluded$N = ["asChild", "children", "className", "fullWidth", "iconPrefix", "iconSuffix", "isDisabled", "isLoading", "onClick", "onBlur", "onFocus", "shadow", "size", "type", "variant"];
 var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _classNames;
   var asChild = _ref.asChild,
@@ -753,7 +753,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
     type = _ref$type === void 0 ? 'button' : _ref$type,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$M);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$N);
   var disabled = isLoading || isDisabled;
   var responsiveClasses = generateResponsiveClasses('size', size).map(function (c) {
     return styles$w[c];
@@ -796,7 +796,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
 });
 Button.displayName = 'Button';
 
-var _excluded$L = ["background", "borderColor", "borderWidth", "children", "display", "padding"];
+var _excluded$M = ["background", "borderColor", "borderWidth", "children", "display", "padding"];
 var CardFooter = function CardFooter(_ref) {
   var _ref$background = _ref.background,
     background = _ref$background === void 0 ? 'secondary' : _ref$background,
@@ -810,7 +810,7 @@ var CardFooter = function CardFooter(_ref) {
     display = _ref$display === void 0 ? 'block' : _ref$display,
     _ref$padding = _ref.padding,
     padding = _ref$padding === void 0 ? '2xl' : _ref$padding,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$L);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$M);
   return React__default.createElement(Box, _extends({
     display: display,
     padding: padding,
@@ -831,7 +831,7 @@ var HEADING_DEFAULT_SIZE_MAP = {
 
 var styles$v = {"heading":"Heading-module_heading__zKyv7"};
 
-var _excluded$K = ["as", "children", "className", "color", "size"];
+var _excluded$L = ["as", "children", "className", "color", "size"];
 var Heading = function Heading(_ref) {
   var _classNames;
   var _ref$as = _ref.as,
@@ -840,7 +840,7 @@ var Heading = function Heading(_ref) {
     className = _ref.className,
     color = _ref.color,
     size = _ref.size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$K);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$L);
   var element = getElementType(Heading, {
     as: as
   });
@@ -851,12 +851,12 @@ var Heading = function Heading(_ref) {
   }, restProps), children);
 };
 
-var _excluded$J = ["children", "title", "description"];
+var _excluded$K = ["children", "title", "description"];
 var CardHeader = function CardHeader(_ref) {
   var children = _ref.children,
     title = _ref.title,
     description = _ref.description,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$J);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$K);
   return React__default.createElement(Box, _extends({
     padding: "2xl",
     direction: "row",
@@ -879,7 +879,7 @@ var CardHeader = function CardHeader(_ref) {
 
 var styles$u = {"card-section-border":"Card-module_card-section-border__OefDX"};
 
-var _excluded$I = ["background", "borderColor", "borderWidth", "children", "childGap", "gap", "className", "display", "padding", "subdued", "title"];
+var _excluded$J = ["background", "borderColor", "borderWidth", "children", "childGap", "gap", "className", "display", "padding", "subdued", "title"];
 var CardSection = function CardSection(_ref) {
   var _classNames;
   var _ref$background = _ref.background,
@@ -904,7 +904,7 @@ var CardSection = function CardSection(_ref) {
     subdued = _ref$subdued === void 0 ? undefined : _ref$subdued,
     _ref$title = _ref.title,
     title = _ref$title === void 0 ? undefined : _ref$title,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$I);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$J);
   var renderTitle = typeof title === 'string' ? React__default.createElement(Box, {
     className: "m-bottom-md"
   }, React__default.createElement(Box, {
@@ -927,7 +927,7 @@ var CardSection = function CardSection(_ref) {
   }, children));
 };
 
-var _excluded$H = ["children", "subdued", "overflow", "display", "width"];
+var _excluded$I = ["children", "subdued", "overflow", "display", "width"];
 var CardBaseComponent = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     subdued = _ref.subdued,
@@ -937,7 +937,7 @@ var CardBaseComponent = /*#__PURE__*/React__default.forwardRef(function (_ref, r
     display = _ref$display === void 0 ? 'block' : _ref$display,
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? '100' : _ref$width,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$H);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$I);
   return React__default.createElement(Box, _extends({
     background: subdued ? 'secondary' : 'primary',
     borderWidth: "sm",
@@ -960,7 +960,7 @@ var Card = /*#__PURE__*/function () {
   return Card;
 }();
 
-var _excluded$G = ["className", "error", "isChecked", "isDisabled", "isIndeterminate"];
+var _excluded$H = ["className", "error", "isChecked", "isDisabled", "isIndeterminate"];
 var CheckboxIcon = function CheckboxIcon(_ref) {
   var _ref$className = _ref.className,
     className = _ref$className === void 0 ? undefined : _ref$className,
@@ -972,7 +972,7 @@ var CheckboxIcon = function CheckboxIcon(_ref) {
     isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
     _ref$isIndeterminate = _ref.isIndeterminate,
     isIndeterminate = _ref$isIndeterminate === void 0 ? false : _ref$isIndeterminate,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$G);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$H);
   var color = 'base';
   var name = 'checkbox-btn';
   if (isChecked) name = 'checkbox-btn-checked';else name = 'checkbox-btn';
@@ -997,7 +997,7 @@ var CheckboxIcon = function CheckboxIcon(_ref) {
 
 var styles$t = {"checkbox":"Checkbox-module_checkbox__dY-7P","size-sm":"Checkbox-module_size-sm__mJkMQ","size-md":"Checkbox-module_size-md__I2s8g","size-lg":"Checkbox-module_size-lg__rFFnb","hidden":"Checkbox-module_hidden__2y7Zr","size-sm-tablet":"Checkbox-module_size-sm-tablet__GhQUW","size-md-tablet":"Checkbox-module_size-md-tablet__XRHf4","size-lg-tablet":"Checkbox-module_size-lg-tablet__quoAJ","size-sm-desktop":"Checkbox-module_size-sm-desktop__fqeEc","size-md-desktop":"Checkbox-module_size-md-desktop__9a278","size-lg-desktop":"Checkbox-module_size-lg-desktop__WQnv0","size-sm-hd":"Checkbox-module_size-sm-hd__X3yIF","size-md-hd":"Checkbox-module_size-md-hd__6T0dF","size-lg-hd":"Checkbox-module_size-lg-hd__UXCt1"};
 
-var _excluded$F = ["className", "display", "id", "isChecked", "label", "labelledby", "onChange", "error", "isDisabled", "isHidden", "isIndeterminate", "isRequired", "onBlur", "onFocus", "size", "value"];
+var _excluded$G = ["className", "display", "id", "isChecked", "label", "labelledby", "onChange", "error", "isDisabled", "isHidden", "isIndeterminate", "isRequired", "onBlur", "onFocus", "size", "value"];
 var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref2;
   var _ref$className = _ref.className,
@@ -1027,7 +1027,7 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     size = _ref$size === void 0 ? 'md' : _ref$size,
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? undefined : _ref$value,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$F);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$G);
   var inputRef = React__default.useRef(null);
   React__default.useEffect(function () {
     if (inputRef != null && inputRef.current) {
@@ -1116,7 +1116,7 @@ var HelpText = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, children);
 });
 
-var _excluded$E = ["children", "inputId", "className", "display", "helpText", "isDisabled", "isFieldRequired", "isRadioInputLabel", "requiredIndicator", "margin", "padding", "size"];
+var _excluded$F = ["children", "inputId", "className", "display", "helpText", "isDisabled", "isFieldRequired", "isRadioInputLabel", "requiredIndicator", "margin", "padding", "size"];
 var FormLabel = function FormLabel(_ref) {
   var _classNames;
   var children = _ref.children,
@@ -1140,7 +1140,7 @@ var FormLabel = function FormLabel(_ref) {
     padding = _ref$padding === void 0 ? '0' : _ref$padding,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'md' : _ref$size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$E);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$F);
   var labelClasses = classNames('hyphen-components__variables__form-control', styles$r.label, className, (_classNames = {}, _classNames[styles$r.sm] = size === 'sm', _classNames[styles$r.disabled] = isDisabled, _classNames[styles$r['radio-input-label']] = isRadioInputLabel, _classNames));
   return React__default.createElement(Box, _extends({
     as: "label",
@@ -1153,7 +1153,7 @@ var FormLabel = function FormLabel(_ref) {
   }, restProps), children, isFieldRequired && requiredIndicator && React__default.createElement("span", null, requiredIndicator), helpText && React__default.createElement(HelpText, null, helpText));
 };
 
-var _excluded$D = ["id", "isChecked", "label", "onChange", "className", "error", "hideLabel", "helpText", "isDisabled", "isIndeterminate", "isRequired", "onBlur", "onFocus", "requiredIndicator", "size"];
+var _excluded$E = ["id", "isChecked", "label", "onChange", "className", "error", "hideLabel", "helpText", "isDisabled", "isIndeterminate", "isRequired", "onBlur", "onFocus", "requiredIndicator", "size"];
 var labelMarginSizeMap = {
   sm: '2xs 0 0 0',
   md: 'xs 0 0 0',
@@ -1198,7 +1198,7 @@ var CheckboxInput = function CheckboxInput(_ref2) {
     requiredIndicator = _ref2$requiredIndicat === void 0 ? ' *' : _ref2$requiredIndicat,
     _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? 'md' : _ref2$size,
-    restProps = _objectWithoutPropertiesLoose(_ref2, _excluded$D);
+    restProps = _objectWithoutPropertiesLoose(_ref2, _excluded$E);
   var handleBlur = function handleBlur(event) {
     if (onBlur) onBlur(event);
   };
@@ -1246,7 +1246,7 @@ var CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
 
 var styles$p = {};
 
-var _excluded$C = ["children", "dayClassName", "maxDate", "minDate", "monthsShown", "openToDate", "startDate", "selected", "selectsRange", "showTwoColumnMonthYearPicker", "showFullMonthYearPicker", "showMonthYearPicker", "className", "formatWeekDay"];
+var _excluded$D = ["children", "dayClassName", "maxDate", "minDate", "monthsShown", "openToDate", "startDate", "selected", "selectsRange", "showTwoColumnMonthYearPicker", "showFullMonthYearPicker", "showMonthYearPicker", "className", "formatWeekDay"];
 var DatePicker = function DatePicker(_ref) {
   var _ref$children = _ref.children,
     children = _ref$children === void 0 ? null : _ref$children,
@@ -1278,7 +1278,7 @@ var DatePicker = function DatePicker(_ref) {
     formatWeekDay = _ref$formatWeekDay === void 0 ? function (formattedDate) {
       return formattedDate[0];
     } : _ref$formatWeekDay,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$C);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$D);
   var datePickerClasses = classNames(styles$p['react-datepicker'], className);
   return React__default.createElement(ReactDatePicker, _extends({
     inline: true,
@@ -1298,7 +1298,7 @@ var DatePicker = function DatePicker(_ref) {
   }, restProps), children);
 };
 
-var _excluded$B = ["label", "hideLabel", "children", "error", "id", "isRequired", "helpText", "isDisabled", "requiredIndicator", "width"];
+var _excluded$C = ["label", "hideLabel", "children", "error", "id", "isRequired", "helpText", "isDisabled", "requiredIndicator", "width"];
 var FormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var label = _ref.label,
     hideLabel = _ref.hideLabel,
@@ -1311,7 +1311,7 @@ var FormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     requiredIndicator = _ref.requiredIndicator,
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? '100' : _ref$width,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$B);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$C);
   var labelProps = {
     inputId: id,
     helpText: helpText,
@@ -1339,7 +1339,7 @@ function getAutoCompleteValue(value) {
 
 var styles$o = {"text-input-wrapper":"TextInput-module_text-input-wrapper__HCnQD","size-sm":"TextInput-module_size-sm__qWJn7","prefix":"TextInput-module_prefix__-wFO9","suffix":"TextInput-module_suffix__327yL","clear-button":"TextInput-module_clear-button__LUJpO","is-clearable":"TextInput-module_is-clearable__ExAY3","size-md":"TextInput-module_size-md__UFPtt","size-lg":"TextInput-module_size-lg__Hjfez","disabled":"TextInput-module_disabled__lrifj","size-sm-tablet":"TextInput-module_size-sm-tablet__neC5C","size-md-tablet":"TextInput-module_size-md-tablet__u29oc","size-lg-tablet":"TextInput-module_size-lg-tablet__3PUB3","size-sm-desktop":"TextInput-module_size-sm-desktop__kA12V","size-md-desktop":"TextInput-module_size-md-desktop__yLJGr","size-lg-desktop":"TextInput-module_size-lg-desktop__A1pcS","size-sm-hd":"TextInput-module_size-sm-hd__f7Thr","size-md-hd":"TextInput-module_size-md-hd__Tsnqc","size-lg-hd":"TextInput-module_size-lg-hd__XLMos","error":"TextInput-module_error__p6zZq","text-input-label":"TextInput-module_text-input-label__3PlSG"};
 
-var _excluded$A = ["id", "label", "onChange", "value", "autoComplete", "autoFocus", "error", "helpText", "hideLabel", "inputProps", "isDisabled", "isRequired", "maxLength", "name", "onBlur", "onClear", "onFocus", "prefix", "placeholder", "requiredIndicator", "suffix", "size", "type"];
+var _excluded$B = ["id", "label", "onChange", "value", "autoComplete", "autoFocus", "error", "helpText", "hideLabel", "inputProps", "isDisabled", "isRequired", "maxLength", "name", "onBlur", "onClear", "onFocus", "prefix", "placeholder", "requiredIndicator", "suffix", "size", "type"];
 var TextInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref2;
   var id = _ref.id,
@@ -1383,7 +1383,7 @@ var TextInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
     size = _ref$size === void 0 ? 'md' : _ref$size,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'text' : _ref$type,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$A);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$B);
   var responsiveClasses = generateResponsiveClasses('size', size);
   var inputWrapperClasses = classNames.apply(void 0, ['hyphen-components__variables__form-control', styles$o['text-input-wrapper']].concat(responsiveClasses.map(function (c) {
     return styles$o[c];
@@ -1535,7 +1535,7 @@ var BREAKPOINTS = /*#__PURE__*/[].concat(Object.entries(designTokens.size.breakp
 var Z_INDEX_VALUES = designTokens.size['z-index'];
 // export const BOX_SHADOW_VALUES = designTokens.size['box-shadow'];
 
-var _excluded$z = ["className", "isOpen", "children", "content", "arrowColor", "contentContainerProps", "hasArrow", "offsetFromTarget", "onClickOutside", "placement", "withPortal", "portalTarget", "trapFocus"];
+var _excluded$A = ["className", "isOpen", "children", "content", "arrowColor", "contentContainerProps", "hasArrow", "offsetFromTarget", "onClickOutside", "placement", "withPortal", "portalTarget", "trapFocus"];
 var contentContainerDefaults = {
   background: 'primary',
   padding: 'sm',
@@ -1564,7 +1564,7 @@ var Popover = function Popover(_ref) {
     portalTarget = _ref.portalTarget,
     _ref$trapFocus = _ref.trapFocus,
     trapFocus = _ref$trapFocus === void 0 ? false : _ref$trapFocus,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$z);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$A);
   var triggerRef = useRef(null);
   var popperRef = useRef(null);
   var _useState = useState(null),
@@ -1670,7 +1670,7 @@ var Popover = function Popover(_ref) {
   withPortal && portalTarget ? createPortal(renderPopperContent(), portalTarget) : renderPopperContent()));
 };
 
-var _excluded$y = ["datePickerProps", "textInputProps", "dateFormat", "dateOptions", "popoverProps"];
+var _excluded$z = ["datePickerProps", "textInputProps", "dateFormat", "dateOptions", "popoverProps"];
 var defaultDatePickerProps = {
   selected: null,
   selectsRange: false
@@ -1690,7 +1690,7 @@ var DateInput = function DateInput(_ref) {
     dateOptions = _ref$dateOptions === void 0 ? undefined : _ref$dateOptions,
     _ref$popoverProps = _ref.popoverProps,
     popoverProps = _ref$popoverProps === void 0 ? _extends({}, defaultPopoverProps) : _ref$popoverProps,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$y);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$z);
   var mergedDatePickerProps = _extends({}, defaultDatePickerProps, datePickerProps);
   var mergedPopoverProps = _extends({}, defaultPopoverProps, popoverProps);
   var mergedTextInputProps = _extends({}, defaultTextInputProps, textInputProps);
@@ -1767,14 +1767,14 @@ var DateInput = function DateInput(_ref) {
 var ENTER = 13;
 var SPACE = 32;
 
-var _excluded$x = ["children", "display", "isDetailsOpen", "onToggle"];
+var _excluded$y = ["children", "display", "isDetailsOpen", "onToggle"];
 var DetailsSummary = function DetailsSummary(_ref) {
   var children = _ref.children,
     _ref$display = _ref.display,
     display = _ref$display === void 0 ? 'block' : _ref$display,
     isDetailsOpen = _ref.isDetailsOpen,
     onToggle = _ref.onToggle,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$x);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$y);
   var handleClick = function handleClick(event) {
     // Needed to avoid default `details` behavior on a click event and keep this as controlled component.
     event.preventDefault();
@@ -1812,14 +1812,14 @@ var DetailsSummary = function DetailsSummary(_ref) {
 
 var styles$m = {"details-reset":"Details-module_details-reset__HWtSD"};
 
-var _excluded$w = ["children", "className", "display", "isOpen"];
+var _excluded$x = ["children", "className", "display", "isOpen"];
 var DetailsBaseComponent = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     _ref$display = _ref.display,
     display = _ref$display === void 0 ? 'block' : _ref$display,
     isOpen = _ref.isOpen,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$w);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$x);
   var detailsClasses = classNames(className, styles$m['details-reset'], styles$m.details);
   return React__default.createElement(Box, _extends({
     as: "details",
@@ -1839,7 +1839,7 @@ var Details = /*#__PURE__*/function () {
 
 var styles$l = {"drawer":"Drawer-module_drawer__IKoOm","hide-overlay-right":"Drawer-module_hide-overlay-right__FANA9","hide-overlay-left":"Drawer-module_hide-overlay-left__xZFa3","hide-overlay-bottom":"Drawer-module_hide-overlay-bottom__11EB1","hide-overlay-top":"Drawer-module_hide-overlay-top__kEsV5","drawer-content":"Drawer-module_drawer-content__zZ9xR","left":"Drawer-module_left__pwTcW","right":"Drawer-module_right__EzGpI","bottom":"Drawer-module_bottom__r3Q5Z","top":"Drawer-module_top__xQejO"};
 
-var _excluded$v = ["defaultIsOpen", "open", "onOpenChange", "className", "children"],
+var _excluded$w = ["defaultIsOpen", "open", "onOpenChange", "className", "children"],
   _excluded2$3 = ["asChild", "onClick"],
   _excluded3$2 = ["className"],
   _excluded4$2 = ["className", "onClick", "onClose"],
@@ -1859,7 +1859,7 @@ var DrawerProvider = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setOpenProp = _ref.onOpenChange,
     className = _ref.className,
     children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$v);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$w);
   var _useState = useState(openProp != null ? openProp : defaultIsOpen),
     _open = _useState[0],
     _setOpen = _useState[1];
@@ -2083,7 +2083,7 @@ var DrawerContent = /*#__PURE__*/React__default.forwardRef(function (_ref7, ref)
   }, props));
 });
 
-var _excluded$u = ["className", "inset"],
+var _excluded$v = ["className", "inset"],
   _excluded2$2 = ["className", "sideOffset"],
   _excluded3$1 = ["className", "inset"],
   _excluded4$1 = ["className"],
@@ -2099,7 +2099,7 @@ var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
 var DropdownMenuItem = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     inset = _ref.inset,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$u);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$v);
   return React__default.createElement(DropdownMenuPrimitive.Item, _extends({
     ref: ref,
     className: classNames('font-size-sm position-relative cursor-default display-flex br-sm align-items-center p-sm g-sm outline-none', inset && 'p-left-md', !props.disabled && 'hover:background-color-secondary focus:background-color-secondary', props.disabled && 'cursor-not-allowed font-color-disabled', className)
@@ -2179,7 +2179,7 @@ var DropdownMenuSubContent = /*#__PURE__*/React__default.forwardRef(function (_r
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
 
-var _excluded$t = ["field", "form", "onChange", "id", "label"];
+var _excluded$u = ["field", "form", "onChange", "id", "label"];
 var FormikCheckboxInput = function FormikCheckboxInput(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2192,7 +2192,7 @@ var FormikCheckboxInput = function FormikCheckboxInput(_ref) {
     onChange = _ref.onChange,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$t);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$u);
   return React__default.createElement(CheckboxInput, _extends({}, props, {
     id: id,
     label: label,
@@ -2203,7 +2203,7 @@ var FormikCheckboxInput = function FormikCheckboxInput(_ref) {
   }));
 };
 
-var _excluded$s = ["className", "isSelected", "isDisabled", "error"];
+var _excluded$t = ["className", "isSelected", "isDisabled", "error"];
 var RadioInputIcon = function RadioInputIcon(_ref) {
   var _ref$className = _ref.className,
     className = _ref$className === void 0 ? undefined : _ref$className,
@@ -2213,7 +2213,7 @@ var RadioInputIcon = function RadioInputIcon(_ref) {
     isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
     _ref$error = _ref.error,
     error = _ref$error === void 0 ? null : _ref$error,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$s);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$t);
   var color = 'secondary';
   var name = 'radio-btn-unchecked';
   if (isSelected && isDisabled) {
@@ -2306,7 +2306,7 @@ var RadioInput = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
 
 var styles$j = {"radio-group":"RadioGroup-module_radio-group__FWPcT","fieldset":"RadioGroup-module_fieldset__PEUXI","legend":"RadioGroup-module_legend__tcfV7","description":"RadioGroup-module_description__8fzM-"};
 
-var _excluded$r = ["name", "onChange", "options", "className", "description", "direction", "error", "isDisabled", "isRequired", "onBlur", "onFocus", "requiredIndicator", "size", "title", "value"];
+var _excluded$s = ["name", "onChange", "options", "className", "description", "direction", "error", "isDisabled", "isRequired", "onBlur", "onFocus", "requiredIndicator", "size", "title", "value"];
 var RadioGroup = function RadioGroup(_ref) {
   var _classNames;
   var name = _ref.name,
@@ -2336,7 +2336,7 @@ var RadioGroup = function RadioGroup(_ref) {
     title = _ref$title === void 0 ? undefined : _ref$title,
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? undefined : _ref$value,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$r);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$s);
   var groupClasses = classNames('hyphen-components__variables__form-control', className, (_classNames = {}, _classNames[styles$j.loading] = error, _classNames));
   return React__default.createElement("div", _extends({
     className: classNames(styles$j['radio-group'], groupClasses)
@@ -2366,7 +2366,7 @@ var RadioGroup = function RadioGroup(_ref) {
   }))), error && typeof error !== 'boolean' && React__default.createElement(InputValidationMessage, null, error));
 };
 
-var _excluded$q = ["field", "form", "onChange", "options"];
+var _excluded$r = ["field", "form", "onChange", "options"];
 var FormikRadioGroup = function FormikRadioGroup(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2378,7 +2378,7 @@ var FormikRadioGroup = function FormikRadioGroup(_ref) {
     errors = _ref$form.errors,
     onChange = _ref.onChange,
     options = _ref.options,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$q);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$r);
   return React__default.createElement(RadioGroup, _extends({}, props, {
     options: options,
     name: name,
@@ -2391,7 +2391,7 @@ var FormikRadioGroup = function FormikRadioGroup(_ref) {
 
 var styles$i = {"react-select-icon":"SelectInput-module_react-select-icon__PvocB","size-sm":"SelectInput-module_size-sm__PKB-J","size-md":"SelectInput-module_size-md__n9Fj8","size-lg":"SelectInput-module_size-lg__LQ-uG","error":"SelectInput-module_error__Avf98","size-sm-tablet":"SelectInput-module_size-sm-tablet__2Dg01","size-md-tablet":"SelectInput-module_size-md-tablet__-iOSg","size-lg-tablet":"SelectInput-module_size-lg-tablet__9xmuJ","size-sm-desktop":"SelectInput-module_size-sm-desktop__tOWI4","size-md-desktop":"SelectInput-module_size-md-desktop__vo-UC","size-lg-desktop":"SelectInput-module_size-lg-desktop__nxQdj","size-sm-hd":"SelectInput-module_size-sm-hd__qamTH","size-md-hd":"SelectInput-module_size-md-hd__Cf8hk","size-lg-hd":"SelectInput-module_size-lg-hd__E4-mZ","disabled":"SelectInput-module_disabled__4ezAy","select-input-label":"SelectInput-module_select-input-label__eqEYa"};
 
-var _excluded$p = ["id", "label", "onChange", "options", "value", "autoFocus", "className", "error", "helpText", "hideLabel", "isClearable", "isAsync", "isCreatable", "isDisabled", "isMulti", "isRequired", "menuPortalTarget", "name", "onFocus", "onBlur", "placeholder", "requiredIndicator", "size"];
+var _excluded$q = ["id", "label", "onChange", "options", "value", "autoFocus", "className", "error", "helpText", "hideLabel", "isClearable", "isAsync", "isCreatable", "isDisabled", "isMulti", "isRequired", "menuPortalTarget", "name", "onFocus", "onBlur", "placeholder", "requiredIndicator", "size"];
 function SelectInput(props) {
   var _ref, _classNames;
   var id = props.id,
@@ -2434,7 +2434,7 @@ function SelectInput(props) {
     requiredIndicator = _props$requiredIndica === void 0 ? ' *' : _props$requiredIndica,
     _props$size = props.size,
     size = _props$size === void 0 ? 'md' : _props$size,
-    restProps = _objectWithoutPropertiesLoose(props, _excluded$p);
+    restProps = _objectWithoutPropertiesLoose(props, _excluded$q);
   var handleChange = function handleChange(values) {
     var simulatedEventPayloadType = {
       target: {
@@ -2507,7 +2507,7 @@ function SelectInput(props) {
   })), error && typeof error !== 'boolean' && React__default.createElement(InputValidationMessage, null, error));
 }
 
-var _excluded$o = ["field", "form", "onChange", "id", "label", "options", "error"];
+var _excluded$p = ["field", "form", "onChange", "id", "label", "options", "error"];
 var FormikSelectInput = function FormikSelectInput(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2522,7 +2522,7 @@ var FormikSelectInput = function FormikSelectInput(_ref) {
     label = _ref.label,
     options = _ref.options,
     errorProp = _ref.error,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$o);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$p);
   var errorMessage;
   var error = errorProp != null ? errorProp : getIn(touched, name) && getIn(errors, name);
   if (typeof error === 'string') {
@@ -2650,7 +2650,7 @@ var SelectInputInset = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, label, isRequired && requiredIndicator && React__default.createElement("span", null, requiredIndicator))), helpText && React__default.createElement(HelpText, null, helpText), error && error !== true && React__default.createElement(InputValidationMessage, null, error));
 });
 
-var _excluded$n = ["field", "form", "onChange", "id", "label", "options"];
+var _excluded$o = ["field", "form", "onChange", "id", "label", "options"];
 var FormikSelectInputInset = function FormikSelectInputInset(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2664,7 +2664,7 @@ var FormikSelectInputInset = function FormikSelectInputInset(_ref) {
     id = _ref.id,
     label = _ref.label,
     options = _ref.options,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$n);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$o);
   return React__default.createElement(SelectInputInset, _extends({}, props, {
     id: id,
     label: label,
@@ -2762,7 +2762,7 @@ var TextareaInputInset = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, label, isRequired && requiredIndicator && React__default.createElement("span", null, requiredIndicator))), helpText && React__default.createElement(HelpText, null, helpText), error && error !== true && React__default.createElement(InputValidationMessage, null, error));
 });
 
-var _excluded$m = ["field", "form", "onChange", "id", "label"];
+var _excluded$n = ["field", "form", "onChange", "id", "label"];
 var FormikTextareaInputInset = function FormikTextareaInputInset(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2775,7 +2775,7 @@ var FormikTextareaInputInset = function FormikTextareaInputInset(_ref) {
     onChange = _ref.onChange,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$m);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$n);
   return React__default.createElement(TextareaInputInset, _extends({}, props, {
     id: id,
     label: label,
@@ -2902,7 +2902,7 @@ var TextInputInset = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, suffix)), helpText && React__default.createElement(HelpText, null, helpText), error && error !== true && React__default.createElement(InputValidationMessage, null, error));
 });
 
-var _excluded$l = ["field", "form", "onChange", "id", "label"];
+var _excluded$m = ["field", "form", "onChange", "id", "label"];
 var FormikTextInputInset = function FormikTextInputInset(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -2915,7 +2915,7 @@ var FormikTextInputInset = function FormikTextInputInset(_ref) {
     onChange = _ref.onChange,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$l);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$m);
   return React__default.createElement(TextInputInset, _extends({}, props, {
     id: id,
     label: label,
@@ -2929,7 +2929,7 @@ var FormikTextInputInset = function FormikTextInputInset(_ref) {
 
 var styles$e = {"select-input-native-wrapper":"SelectInputNative-module_select-input-native-wrapper__-vvFm","disabled":"SelectInputNative-module_disabled__gKmV4","size-sm":"SelectInputNative-module_size-sm__7Ql4z","size-md":"SelectInputNative-module_size-md__ofleh","size-lg":"SelectInputNative-module_size-lg__ewS-6","size-sm-tablet":"SelectInputNative-module_size-sm-tablet__3wbFA","size-md-tablet":"SelectInputNative-module_size-md-tablet__nLo2t","size-lg-tablet":"SelectInputNative-module_size-lg-tablet__fLu2T","size-sm-desktop":"SelectInputNative-module_size-sm-desktop__aUL7D","size-md-desktop":"SelectInputNative-module_size-md-desktop__s1uoc","size-lg-desktop":"SelectInputNative-module_size-lg-desktop__Ri2Ka","size-sm-hd":"SelectInputNative-module_size-sm-hd__RVm4G","size-md-hd":"SelectInputNative-module_size-md-hd__m4Rqf","size-lg-hd":"SelectInputNative-module_size-lg-hd__V6i8b","error":"SelectInputNative-module_error__RBOZT","text-input-label":"SelectInputNative-module_text-input-label__-YjDc"};
 
-var _excluded$k = ["autoFocus", "label", "hideLabel", "helpText", "error", "id", "isDisabled", "isRequired", "name", "value", "options", "onChange", "placeholder", "requiredIndicator", "size"];
+var _excluded$l = ["autoFocus", "label", "hideLabel", "helpText", "error", "id", "isDisabled", "isRequired", "name", "value", "options", "onChange", "placeholder", "requiredIndicator", "size"];
 var SelectInputNative = function SelectInputNative(_ref) {
   var _ref2;
   var _ref$autoFocus = _ref.autoFocus,
@@ -2951,7 +2951,7 @@ var SelectInputNative = function SelectInputNative(_ref) {
     requiredIndicator = _ref$requiredIndicato === void 0 ? ' *' : _ref$requiredIndicato,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'md' : _ref$size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$k);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$l);
   var placeholderOption = {
     value: '',
     label: placeholder
@@ -2997,7 +2997,7 @@ var SelectInputNative = function SelectInputNative(_ref) {
   }))));
 };
 
-var _excluded$j = ["field", "form", "onChange", "options", "id", "label"];
+var _excluded$k = ["field", "form", "onChange", "options", "id", "label"];
 var FormikSelectInputNative = function FormikSelectInputNative(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3011,7 +3011,7 @@ var FormikSelectInputNative = function FormikSelectInputNative(_ref) {
     options = _ref.options,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$j);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$k);
   return React__default.createElement(SelectInputNative, _extends({}, props, {
     options: options,
     id: id,
@@ -3024,7 +3024,7 @@ var FormikSelectInputNative = function FormikSelectInputNative(_ref) {
   }));
 };
 
-var _excluded$i = ["field", "form", "onChange", "id", "label"];
+var _excluded$j = ["field", "form", "onChange", "id", "label"];
 var FormikTextInput = function FormikTextInput(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3037,7 +3037,7 @@ var FormikTextInput = function FormikTextInput(_ref) {
     onChange = _ref.onChange,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$i);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$j);
   return React__default.createElement(TextInput, _extends({}, props, {
     id: id,
     label: label,
@@ -3051,7 +3051,7 @@ var FormikTextInput = function FormikTextInput(_ref) {
 
 var styles$d = {"textarea-input-wrapper":"TextareaInput-module_textarea-input-wrapper__mJBZN","size-sm":"TextareaInput-module_size-sm__-YCcV","size-md":"TextareaInput-module_size-md__uPOvN","size-lg":"TextareaInput-module_size-lg__P5SYv","size-sm-tablet":"TextareaInput-module_size-sm-tablet__rYP2T","size-md-tablet":"TextareaInput-module_size-md-tablet__D1PYq","size-lg-tablet":"TextareaInput-module_size-lg-tablet__N-UED","size-sm-desktop":"TextareaInput-module_size-sm-desktop__Z-Zdg","size-md-desktop":"TextareaInput-module_size-md-desktop__W3jIm","size-lg-desktop":"TextareaInput-module_size-lg-desktop__XLwk0","size-sm-hd":"TextareaInput-module_size-sm-hd__KP21d","size-md-hd":"TextareaInput-module_size-md-hd__3me0R","size-lg-hd":"TextareaInput-module_size-lg-hd__BcgC-","error":"TextareaInput-module_error__JpCpt","textarea-input-label":"TextareaInput-module_textarea-input-label__1zb77","textarea-resize-both":"TextareaInput-module_textarea-resize-both__Gn3Zh","textarea-resize-horizontal":"TextareaInput-module_textarea-resize-horizontal__0aRED","textarea-resize-vertical":"TextareaInput-module_textarea-resize-vertical__DbKar","textarea-resize-none":"TextareaInput-module_textarea-resize-none__l6dRF"};
 
-var _excluded$h = ["id", "label", "onChange", "value", "autoComplete", "autoFocus", "className", "error", "helpText", "hideLabel", "isDisabled", "isRequired", "maxLength", "name", "onBlur", "onFocus", "placeholder", "requiredIndicator", "resize", "rows", "size"];
+var _excluded$i = ["id", "label", "onChange", "value", "autoComplete", "autoFocus", "className", "error", "helpText", "hideLabel", "isDisabled", "isRequired", "maxLength", "name", "onBlur", "onFocus", "placeholder", "requiredIndicator", "resize", "rows", "size"];
 var TextareaInput = function TextareaInput(_ref) {
   var _ref2;
   var id = _ref.id,
@@ -3091,7 +3091,7 @@ var TextareaInput = function TextareaInput(_ref) {
     rows = _ref$rows === void 0 ? 3 : _ref$rows,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'md' : _ref$size,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$h);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$i);
   var responsiveClasses = generateResponsiveClasses('size', size);
   var inputWrapperClasses = classNames.apply(void 0, ['hyphen-components__variables__form-control', styles$d['textarea-input-wrapper']].concat(responsiveClasses.map(function (c) {
     return styles$d[c];
@@ -3135,7 +3135,7 @@ var TextareaInput = function TextareaInput(_ref) {
   }, inputProps))), error && error !== true && React__default.createElement(InputValidationMessage, null, error));
 };
 
-var _excluded$g = ["field", "form", "onChange", "id", "label"];
+var _excluded$h = ["field", "form", "onChange", "id", "label"];
 var FormikTextareaInput = function FormikTextareaInput(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3148,7 +3148,7 @@ var FormikTextareaInput = function FormikTextareaInput(_ref) {
     onChange = _ref.onChange,
     id = _ref.id,
     label = _ref.label,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$g);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$h);
   return React__default.createElement(TextareaInput, _extends({}, props, {
     id: id,
     label: label,
@@ -3160,7 +3160,7 @@ var FormikTextareaInput = function FormikTextareaInput(_ref) {
   }));
 };
 
-var _excluded$f = ["id", "name", "label", "onChange", "value", "dateDisplayOptions", "endTime", "interval", "locales", "placeholder", "startTime"];
+var _excluded$g = ["id", "name", "label", "onChange", "value", "dateDisplayOptions", "endTime", "interval", "locales", "placeholder", "startTime"];
 var TimePicker = function TimePicker(_ref) {
   var id = _ref.id,
     name = _ref.name,
@@ -3182,7 +3182,7 @@ var TimePicker = function TimePicker(_ref) {
     placeholder = _ref$placeholder === void 0 ? 'HH:MM' : _ref$placeholder,
     _ref$startTime = _ref.startTime,
     startTime = _ref$startTime === void 0 ? undefined : _ref$startTime,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$f);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$g);
   var generateTimes = function generateTimes() {
     var first = new Date();
     first.setHours((startTime == null ? void 0 : startTime.hour) || 0, (startTime == null ? void 0 : startTime.minute) || 0, 0, 0);
@@ -3210,7 +3210,7 @@ var TimePicker = function TimePicker(_ref) {
   }));
 };
 
-var _excluded$e = ["field", "form", "options", "onChange"];
+var _excluded$f = ["field", "form", "options", "onChange"];
 var FormikTimePicker = function FormikTimePicker(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3222,7 +3222,7 @@ var FormikTimePicker = function FormikTimePicker(_ref) {
     errors = _ref$form.errors,
     options = _ref.options,
     onChange = _ref.onChange,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$f);
   return React__default.createElement(TimePicker, _extends({}, props, {
     name: name,
     onBlur: onBlur,
@@ -3233,7 +3233,7 @@ var FormikTimePicker = function FormikTimePicker(_ref) {
   }));
 };
 
-var _excluded$d = ["id", "name", "label", "onChange", "value", "dateDisplayOptions", "endTime", "interval", "locales", "placeholder", "startTime"];
+var _excluded$e = ["id", "name", "label", "onChange", "value", "dateDisplayOptions", "endTime", "interval", "locales", "placeholder", "startTime"];
 var TimePickerNative = function TimePickerNative(_ref) {
   var id = _ref.id,
     name = _ref.name,
@@ -3255,7 +3255,7 @@ var TimePickerNative = function TimePickerNative(_ref) {
     placeholder = _ref$placeholder === void 0 ? 'HH:MM' : _ref$placeholder,
     _ref$startTime = _ref.startTime,
     startTime = _ref$startTime === void 0 ? undefined : _ref$startTime,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$d);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$e);
   var generateTimes = function generateTimes() {
     var first = new Date();
     first.setHours((startTime == null ? void 0 : startTime.hour) || 0, (startTime == null ? void 0 : startTime.minute) || 0, 0, 0);
@@ -3284,7 +3284,7 @@ var TimePickerNative = function TimePickerNative(_ref) {
   }));
 };
 
-var _excluded$c = ["field", "form", "onChange"];
+var _excluded$d = ["field", "form", "onChange"];
 var FormikTimePickerNative = function FormikTimePickerNative(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3295,7 +3295,7 @@ var FormikTimePickerNative = function FormikTimePickerNative(_ref) {
     touched = _ref$form.touched,
     errors = _ref$form.errors,
     onChange = _ref.onChange,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
   return React__default.createElement(TimePickerNative, _extends({}, props, {
     name: name,
     onBlur: onBlur,
@@ -3397,7 +3397,7 @@ var Switch = function Switch(_ref) {
   }, helpText)))), error && error !== true && React__default.createElement(InputValidationMessage, null, error));
 };
 
-var _excluded$b = ["field", "form"];
+var _excluded$c = ["field", "form"];
 var FormikSwitch = function FormikSwitch(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3407,7 +3407,7 @@ var FormikSwitch = function FormikSwitch(_ref) {
     _ref$form = _ref.form,
     touched = _ref$form.touched,
     errors = _ref$form.errors,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
   return React__default.createElement(Switch, _extends({
     error: getIn(touched, name) && getIn(errors, name),
     isChecked: value,
@@ -3418,7 +3418,7 @@ var FormikSwitch = function FormikSwitch(_ref) {
 
 var styles$b = {"item":"ToggleGroup-module_item__dIBO0","outline":"ToggleGroup-module_outline__d5OlO"};
 
-var _excluded$a = ["className", "variant", "children", "gap", "error"],
+var _excluded$b = ["className", "variant", "children", "gap", "error"],
   _excluded2$1 = ["className", "children", "value", "variant"];
 var ToggleGroupContext = /*#__PURE__*/createContext({
   variant: 'default'
@@ -3431,7 +3431,7 @@ var ToggleGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _ref$gap = _ref.gap,
     gap = _ref$gap === void 0 ? 'xs' : _ref$gap,
     error = _ref.error,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$a);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$b);
   return React__default.createElement("div", null, React__default.createElement(ToggleGroupPrimitive.Root, _extends({
     ref: ref,
     className: classNames('display-flex align-items-center justify-content-start', className, cssShorthandToClasses('g', gap))
@@ -3458,7 +3458,7 @@ var ToggleGroupItem = /*#__PURE__*/forwardRef(function (_ref2, ref) {
 });
 ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
-var _excluded$9 = ["field", "form", "options", "helpText", "label", "children"];
+var _excluded$a = ["field", "form", "options", "helpText", "label", "children"];
 var FormikToggleGroup = function FormikToggleGroup(_ref) {
   var _ref$field = _ref.field,
     name = _ref$field.name,
@@ -3472,7 +3472,7 @@ var FormikToggleGroup = function FormikToggleGroup(_ref) {
     helpText = _ref.helpText,
     label = _ref.label,
     children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$a);
   return React__default.createElement(Box, {
     gap: "sm"
   }, (label || helpText) && React__default.createElement("div", null, label && React__default.createElement(Box, {
@@ -3496,6 +3496,47 @@ var FormikToggleGroup = function FormikToggleGroup(_ref) {
   })));
 };
 
+var _excluded$9 = ["name", "options", "helpText", "label", "children", "variant"];
+var FormikToggleGroupMulti = function FormikToggleGroupMulti(_ref) {
+  var name = _ref.name,
+    options = _ref.options,
+    helpText = _ref.helpText,
+    label = _ref.label,
+    children = _ref.children,
+    variant = _ref.variant,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+  var _useField = useField(name),
+    field = _useField[0],
+    meta = _useField[1],
+    helpers = _useField[2];
+  return React__default.createElement(Box, {
+    gap: "sm"
+  }, (label || helpText) && React__default.createElement("div", null, label && React__default.createElement(Box, {
+    fontSize: "sm"
+  }, label), helpText && React__default.createElement(HelpText, null, helpText)), React__default.createElement(FieldArray, {
+    name: name
+  }, function () {
+    return React__default.createElement(ToggleGroup, _extends({}, props, {
+      name: name,
+      onValueChange: function onValueChange(selectedValues) {
+        helpers.setValue(selectedValues);
+        helpers.setTouched(true);
+      },
+      value: field.value,
+      error: meta.error,
+      type: "multiple",
+      variant: variant
+    }), children ? children : options.map(function (option) {
+      return React__default.createElement(ToggleGroupItem, {
+        key: option.id,
+        id: option.id,
+        value: option.value,
+        disabled: !!option.disabled
+      }, option.label);
+    }));
+  }));
+};
+
 var _excluded$8 = ["children", "padding", "direction", "alignItems", "justifyContent", "gap", "style"];
 var ModalFooter = function ModalFooter(_ref) {
   var children = _ref.children,
@@ -3934,9 +3975,29 @@ function useIsMobile() {
   return !!isMobile;
 }
 
-var styles$8 = {"rail":"Sidebar-module_rail__nWu0Q"};
+var styles$8 = {"rail":"Sidebar-module_rail__nWu0Q","group-data-":"Sidebar-module_group-data-__GTJmR"};
 
-var _excluded$4 = ["defaultOpen", "open", "onOpenChange", "className", "style", "children"],
+var styles$7 = {"TooltipContent":"Tooltip-module_TooltipContent__wLEZU","tooltip-slideUpAndFade":"Tooltip-module_tooltip-slideUpAndFade__Y05jp","tooltip-slideRightAndFade":"Tooltip-module_tooltip-slideRightAndFade__K04p9","tooltip-slideDownAndFade":"Tooltip-module_tooltip-slideDownAndFade__1wMd-","tooltip-slideLeftAndFade":"Tooltip-module_tooltip-slideLeftAndFade__iQ1fp"};
+
+var _excluded$4 = ["className", "sideOffset"];
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipPortal = TooltipPrimitive.Portal;
+var TooltipContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    _ref$sideOffset = _ref.sideOffset,
+    sideOffset = _ref$sideOffset === void 0 ? 4 : _ref$sideOffset,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+  return React.createElement(TooltipPrimitive.Content, _extends({
+    ref: ref,
+    sideOffset: sideOffset,
+    className: classNames(styles$7.TooltipContent, 'background-color-tooltip font-color-tooltip font-size-xs z-index-popover overflow-hidden br-sm p-h-sm p-v-xs shadow-sm', className)
+  }, props));
+});
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+var _excluded$3 = ["defaultOpen", "open", "onOpenChange", "className", "style", "children"],
   _excluded2 = ["side", "collapsible", "className", "children"],
   _excluded3 = ["className", "onClick"],
   _excluded4 = ["className"],
@@ -3945,18 +4006,18 @@ var _excluded$4 = ["defaultOpen", "open", "onOpenChange", "className", "style",
   _excluded7 = ["className"],
   _excluded8 = ["className"],
   _excluded9 = ["className"],
-  _excluded10 = ["asChild", "isActive", "icon", "className"],
+  _excluded0 = ["asChild", "isActive", "icon", "tooltip", "className"],
+  _excluded1 = ["className"],
+  _excluded10 = ["className"],
   _excluded11 = ["className"],
-  _excluded12 = ["className"],
-  _excluded13 = ["className"],
-  _excluded14 = ["asChild", "isActive", "className"],
-  _excluded15 = ["className", "asChild"],
-  _excluded16 = ["className"],
-  _excluded17 = ["className"];
-var SIDEBAR_COOKIE_NAME = 'sidebar:state';
+  _excluded12 = ["asChild", "isActive", "className"],
+  _excluded13 = ["className", "asChild"],
+  _excluded14 = ["className"],
+  _excluded15 = ["className"];
+var SIDEBAR_COOKIE_NAME = 'sidebar_expanded';
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = '16rem';
-var SIDEBAR_WIDTH_ICON = '3rem';
+var SIDEBAR_WIDTH_ICON = '44px';
 var SIDEBAR_KEYBOARD_SHORTCUT = '[';
 var SidebarContext = /*#__PURE__*/React__default.createContext(null);
 function useSidebar() {
@@ -3974,7 +4035,7 @@ var SidebarProvider = /*#__PURE__*/forwardRef(function (_ref, ref) {
     className = _ref.className,
     style = _ref.style,
     children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
   var isMobile = useIsMobile();
   var _useState = useState(function () {
       return isMobile ? false : openProp != null ? openProp : defaultOpen;
@@ -4042,6 +4103,8 @@ var SidebarProvider = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]);
   return React__default.createElement(SidebarContext.Provider, {
     value: contextValue
+  }, React__default.createElement(TooltipProvider, {
+    delayDuration: 0
   }, React__default.createElement("div", _extends({
     style: _extends({
       '--sidebar-width': SIDEBAR_WIDTH,
@@ -4050,7 +4113,7 @@ var SidebarProvider = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }, style),
     className: classNames('display-flex w-100 background-color-secondary', className),
     ref: ref
-  }, props), children));
+  }, props), children)));
 });
 SidebarProvider.displayName = 'SidebarProvider';
 var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
@@ -4081,7 +4144,7 @@ var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
   }
   if (collapsible === 'none') {
     return React__default.createElement("div", _extends({
-      className: classNames('display-flex h-100 font-size-xs flex-direction-column background-color-secondary font-color-base', className),
+      className: classNames('group display-flex h-100 font-size-xs flex-direction-column background-color-secondary font-color-base', className),
       style: {
         width: 'var(--sidebar-width)'
       },
@@ -4100,7 +4163,8 @@ var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
     position: "relative",
     "data-state": state,
     "data-collapsible": collapsible,
-    "data-side": side
+    "data-side": side,
+    className: "group"
   }, React__default.createElement("div", {
     style: {
       animationTimingFunction: 'var(--sidebar-transition-timing, linear)',
@@ -4108,14 +4172,14 @@ var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
       transitionDuration: 'var(--sidebar-transition-duration, 200ms)',
       animationDuration: 'var(--sidebar-transition-duration, 200ms)',
       transitionProperty: 'width',
-      width: state === 'collapsed' ? '0' : 'var(--sidebar-width)',
+      width: state === 'collapsed' && collapsible === 'icon' ? 'var(--sidebar-width-icon)' : state === 'collapsed' ? '0' : 'var(--sidebar-width)',
       height: '100svh'
     },
     className: classNames('position-relative', className)
   }), React__default.createElement("div", _extends({
     className: classNames('position-absolute display-none display-flex-desktop ', className),
     style: {
-      left: state === 'expanded' ? '0' : 'calc(var(--sidebar-width)*-1)',
+      left: state === 'expanded' || collapsible === 'icon' ? '0' : 'calc(var(--sidebar-width)*-1)',
       top: '0',
       bottom: '0',
       zIndex: 'var(--size-z-index-drawer)',
@@ -4124,7 +4188,7 @@ var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
       transitionDuration: 'var(--sidebar-transition-duration, 200ms)',
       animationDuration: 'var(--sidebar-transition-duration, 200ms)',
       transitionProperty: 'left, right, width',
-      width: 'var(--sidebar-width)',
+      width: state === 'collapsed' && collapsible === 'icon' ? 'var(--sidebar-width-icon)' : 'var(--sidebar-width)',
       height: '100svh'
     }
   }, props), React__default.createElement("div", {
@@ -4169,7 +4233,7 @@ var SidebarHeader = /*#__PURE__*/React__default.forwardRef(function (_ref5, ref)
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "header",
-    className: classNames('display-flex g-sm p-v-md p-h-md p-right-0-desktop', className)
+    className: classNames('display-flex g-sm p-v-md p-h-md p-right-0-desktop overflow-hidden', className)
   }, props));
 });
 SidebarHeader.displayName = 'SidebarHeader';
@@ -4179,7 +4243,7 @@ var SidebarFooter = /*#__PURE__*/React__default.forwardRef(function (_ref6, ref)
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "footer",
-    className: classNames('display-flex g-sm  p-v-md p-h-md p-right-0-desktop', className)
+    className: classNames('display-flex g-sm  p-v-md p-h-md p-right-0-desktop overflow-hidden', className)
   }, props));
 });
 SidebarFooter.displayName = 'SidebarFooter';
@@ -4189,7 +4253,11 @@ var SidebarContent = /*#__PURE__*/React__default.forwardRef(function (_ref7, ref
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "content",
-    className: classNames('display-flex flex-direction-column g-xl minh-0 flex-auto overflow-auto', className)
+    className: classNames('display-flex flex-direction-column g-xl minh-0 flex-auto', className),
+    style: {
+      overflowX: 'hidden',
+      overflowY: 'auto'
+    }
   }, props));
 });
 SidebarContent.displayName = 'SidebarContent';
@@ -4212,18 +4280,25 @@ var SidebarMenuItem = /*#__PURE__*/React__default.forwardRef(function (_ref9, re
   return React__default.createElement("li", _extends({
     ref: ref,
     "data-sidebar": "menu-item",
-    className: classNames('font-size-sm position-relative', className)
+    className: classNames('font-size-sm position-relative', className),
+    style: {
+      whiteSpace: 'nowrap'
+    }
   }, props));
 });
 SidebarMenuItem.displayName = 'SidebarMenuItem';
-var SidebarMenuButton = /*#__PURE__*/React__default.forwardRef(function (_ref10, ref) {
-  var _ref10$asChild = _ref10.asChild,
-    asChild = _ref10$asChild === void 0 ? false : _ref10$asChild,
-    _ref10$isActive = _ref10.isActive,
-    isActive = _ref10$isActive === void 0 ? false : _ref10$isActive,
-    className = _ref10.className,
-    props = _objectWithoutPropertiesLoose(_ref10, _excluded10);
+var SidebarMenuButton = /*#__PURE__*/React__default.forwardRef(function (_ref0, ref) {
+  var _ref0$asChild = _ref0.asChild,
+    asChild = _ref0$asChild === void 0 ? false : _ref0$asChild,
+    _ref0$isActive = _ref0.isActive,
+    isActive = _ref0$isActive === void 0 ? false : _ref0$isActive,
+    tooltip = _ref0.tooltip,
+    className = _ref0.className,
+    props = _objectWithoutPropertiesLoose(_ref0, _excluded0);
   var Comp = asChild ? Slot : 'button';
+  var _useSidebar3 = useSidebar(),
+    isMobile = _useSidebar3.isMobile,
+    state = _useSidebar3.state;
   var button = React__default.createElement(Comp, _extends({
     ref: ref,
     "data-sidebar": "menu-button",
@@ -4233,32 +4308,46 @@ var SidebarMenuButton = /*#__PURE__*/React__default.forwardRef(function (_ref10,
       'background-color-transparent': !isActive
     }, className)
   }, props), props.children);
-  return button;
+  if (!tooltip) {
+    return button;
+  }
+  if (typeof tooltip === 'string') {
+    tooltip = {
+      children: tooltip
+    };
+  }
+  return React__default.createElement(Tooltip, null, React__default.createElement(TooltipTrigger, {
+    asChild: true
+  }, button), React__default.createElement(TooltipContent, _extends({
+    side: "right",
+    align: "center",
+    hidden: state !== 'collapsed' || isMobile
+  }, tooltip)));
 });
 SidebarMenuButton.displayName = 'SidebarMenuButton';
-var SidebarGroup = /*#__PURE__*/React__default.forwardRef(function (_ref11, ref) {
-  var className = _ref11.className,
-    props = _objectWithoutPropertiesLoose(_ref11, _excluded11);
+var SidebarGroup = /*#__PURE__*/React__default.forwardRef(function (_ref1, ref) {
+  var className = _ref1.className,
+    props = _objectWithoutPropertiesLoose(_ref1, _excluded1);
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "group",
-    className: classNames('position-relative p-h-md p-right-0-desktop display-flex w-100 minw-0 flex-direction-column', className)
+    className: classNames('position-relative p-h-md p-right-0-desktop display-flex w-100 minw-0 flex-direction-column ', className)
   }, props));
 });
 SidebarGroup.displayName = 'SidebarGroup';
-var SidebarGroupLabel = /*#__PURE__*/React__default.forwardRef(function (_ref12, ref) {
-  var className = _ref12.className,
-    props = _objectWithoutPropertiesLoose(_ref12, _excluded12);
+var SidebarGroupLabel = /*#__PURE__*/React__default.forwardRef(function (_ref10, ref) {
+  var className = _ref10.className,
+    props = _objectWithoutPropertiesLoose(_ref10, _excluded10);
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "group-label",
-    className: classNames('display-flex h-3xl align-items-center br-sm p-h-sm font-color-secondary font-size-xs font-weight-medium outline-none', className)
+    className: classNames('group-data-collapsible-icon-hidden display-flex h-3xl align-items-center br-sm p-h-sm font-color-secondary font-size-xs font-weight-medium outline-none', className)
   }, props));
 });
 SidebarGroupLabel.displayName = 'SidebarGroupLabel';
-var SidebarMenuSub = /*#__PURE__*/React__default.forwardRef(function (_ref13, ref) {
-  var className = _ref13.className,
-    props = _objectWithoutPropertiesLoose(_ref13, _excluded13);
+var SidebarMenuSub = /*#__PURE__*/React__default.forwardRef(function (_ref11, ref) {
+  var className = _ref11.className,
+    props = _objectWithoutPropertiesLoose(_ref11, _excluded11);
   return React__default.createElement("ul", _extends({
     ref: ref,
     "data-sidebar": "menu-sub",
@@ -4269,19 +4358,19 @@ var SidebarMenuSub = /*#__PURE__*/React__default.forwardRef(function (_ref13, re
   }, props));
 });
 SidebarMenuSub.displayName = 'SidebarMenuSub';
-var SidebarMenuSubItem = /*#__PURE__*/React__default.forwardRef(function (_ref14, ref) {
-  var props = _extends({}, (_objectDestructuringEmpty(_ref14), _ref14));
+var SidebarMenuSubItem = /*#__PURE__*/React__default.forwardRef(function (_ref12, ref) {
+  var props = _extends({}, (_objectDestructuringEmpty(_ref12), _ref12));
   return React__default.createElement("li", _extends({
     ref: ref
   }, props));
 });
 SidebarMenuSubItem.displayName = 'SidebarMenuSubItem';
-var SidebarMenuSubButton = /*#__PURE__*/React__default.forwardRef(function (_ref15, ref) {
-  var _ref15$asChild = _ref15.asChild,
-    asChild = _ref15$asChild === void 0 ? false : _ref15$asChild,
-    isActive = _ref15.isActive,
-    className = _ref15.className,
-    props = _objectWithoutPropertiesLoose(_ref15, _excluded14);
+var SidebarMenuSubButton = /*#__PURE__*/React__default.forwardRef(function (_ref13, ref) {
+  var _ref13$asChild = _ref13.asChild,
+    asChild = _ref13$asChild === void 0 ? false : _ref13$asChild,
+    isActive = _ref13.isActive,
+    className = _ref13.className,
+    props = _objectWithoutPropertiesLoose(_ref13, _excluded12);
   var Comp = asChild ? Slot : 'a';
   return React__default.createElement(Comp, _extends({
     ref: ref,
@@ -4294,11 +4383,11 @@ var SidebarMenuSubButton = /*#__PURE__*/React__default.forwardRef(function (_ref
   }, props));
 });
 SidebarMenuSubButton.displayName = 'SidebarMenuSubButton';
-var SidebarMenuAction = /*#__PURE__*/React__default.forwardRef(function (_ref16, ref) {
-  var className = _ref16.className,
-    _ref16$asChild = _ref16.asChild,
-    asChild = _ref16$asChild === void 0 ? false : _ref16$asChild,
-    props = _objectWithoutPropertiesLoose(_ref16, _excluded15);
+var SidebarMenuAction = /*#__PURE__*/React__default.forwardRef(function (_ref14, ref) {
+  var className = _ref14.className,
+    _ref14$asChild = _ref14.asChild,
+    asChild = _ref14$asChild === void 0 ? false : _ref14$asChild,
+    props = _objectWithoutPropertiesLoose(_ref14, _excluded13);
   var Comp = asChild ? Slot : 'button';
   return React__default.createElement(Comp, _extends({
     ref: ref,
@@ -4311,12 +4400,12 @@ var SidebarMenuAction = /*#__PURE__*/React__default.forwardRef(function (_ref16,
   }, props));
 });
 SidebarMenuAction.displayName = 'SidebarMenuAction';
-var SidebarRail = /*#__PURE__*/React__default.forwardRef(function (_ref17, ref) {
-  var className = _ref17.className,
-    props = _objectWithoutPropertiesLoose(_ref17, _excluded16);
-  var _useSidebar3 = useSidebar(),
-    open = _useSidebar3.open,
-    toggleSidebar = _useSidebar3.toggleSidebar;
+var SidebarRail = /*#__PURE__*/React__default.forwardRef(function (_ref15, ref) {
+  var className = _ref15.className,
+    props = _objectWithoutPropertiesLoose(_ref15, _excluded14);
+  var _useSidebar4 = useSidebar(),
+    open = _useSidebar4.open,
+    toggleSidebar = _useSidebar4.toggleSidebar;
   var caretIcon = open ? 'caret-sm-left' : 'caret-sm-right';
   return React__default.createElement("button", _extends({
     ref: ref,
@@ -4356,13 +4445,13 @@ var SidebarRail = /*#__PURE__*/React__default.forwardRef(function (_ref17, ref)
   })));
 });
 SidebarRail.displayName = 'SidebarRail';
-var SidebarMenuBadge = /*#__PURE__*/React__default.forwardRef(function (_ref18, ref) {
-  var className = _ref18.className,
-    props = _objectWithoutPropertiesLoose(_ref18, _excluded17);
+var SidebarMenuBadge = /*#__PURE__*/React__default.forwardRef(function (_ref16, ref) {
+  var className = _ref16.className,
+    props = _objectWithoutPropertiesLoose(_ref16, _excluded15);
   return React__default.createElement("div", _extends({
     ref: ref,
     "data-sidebar": "menu-badge",
-    className: classNames('position-absolute font-size-xs cursor-default lh-none p-xs font-color-base minw-0 align-items-center bw-0 br-sm outline-none background-color-transparent', className),
+    className: classNames('group-data-collapsible-icon-hidden position-absolute font-size-xs cursor-default lh-none p-xs font-color-base minw-0 align-items-center bw-0 br-sm outline-none background-color-transparent', className),
     style: {
       top: 'var(--size-spacing-sm)',
       right: 'var(--size-spacing-xs)'
@@ -4371,13 +4460,13 @@ var SidebarMenuBadge = /*#__PURE__*/React__default.forwardRef(function (_ref18,
 });
 SidebarMenuBadge.displayName = 'SidebarMenuBadge';
 
-var styles$7 = {"container":"Table-module_container__BsXT7","loading-mask":"Table-module_loading-mask__qoRPG","scroll-container":"Table-module_scroll-container__5WV5T","table":"Table-module_table__-ZPCW","auto":"Table-module_auto__1R8wm","fixed":"Table-module_fixed__T-EXg","borderless":"Table-module_borderless__BbsqE","scrollable":"Table-module_scrollable__Apjbs","scrollable-x":"Table-module_scrollable-x__mguJX","scrollable-y":"Table-module_scrollable-y__292qB","table-bordered":"Table-module_table-bordered__wM9u-","full-height":"Table-module_full-height__MlrSg"};
+var styles$6 = {"container":"Table-module_container__BsXT7","loading-mask":"Table-module_loading-mask__qoRPG","scroll-container":"Table-module_scroll-container__5WV5T","table":"Table-module_table__-ZPCW","auto":"Table-module_auto__1R8wm","fixed":"Table-module_fixed__T-EXg","borderless":"Table-module_borderless__BbsqE","scrollable":"Table-module_scrollable__Apjbs","scrollable-x":"Table-module_scrollable-x__mguJX","scrollable-y":"Table-module_scrollable-y__292qB","table-bordered":"Table-module_table-bordered__wM9u-","full-height":"Table-module_full-height__MlrSg"};
 
-var styles$6 = {"table-body":"TableBody-module_table-body__Y5WbD","striped":"TableBody-module_striped__5MlEr","hover":"TableBody-module_hover__2CRgY"};
+var styles$5 = {"table-body":"TableBody-module_table-body__Y5WbD","striped":"TableBody-module_striped__5MlEr","hover":"TableBody-module_hover__2CRgY"};
 
-var styles$5 = {"table-row":"TableRow-module_table-row__-Y9FQ","hoverable":"TableRow-module_hoverable__53-l9"};
+var styles$4 = {"table-row":"TableRow-module_table-row__-Y9FQ","hoverable":"TableRow-module_hoverable__53-l9"};
 
-var styles$4 = {"table-cell":"TableBodyCell-module_table-cell__pKl29","borderless":"TableBodyCell-module_borderless__qwKQA","compact":"TableBodyCell-module_compact__zfdBf","truncated":"TableBodyCell-module_truncated__4YtPF","sticky-column-left":"TableBodyCell-module_sticky-column-left__tKIGW","sticky-column-right":"TableBodyCell-module_sticky-column-right__680hS","sticky-column":"TableBodyCell-module_sticky-column__QpEbV","align-right":"TableBodyCell-module_align-right__j-VqN","align-center":"TableBodyCell-module_align-center__saqzC"};
+var styles$3 = {"table-cell":"TableBodyCell-module_table-cell__pKl29","borderless":"TableBodyCell-module_borderless__qwKQA","compact":"TableBodyCell-module_compact__zfdBf","truncated":"TableBodyCell-module_truncated__4YtPF","sticky-column-left":"TableBodyCell-module_sticky-column-left__tKIGW","sticky-column-right":"TableBodyCell-module_sticky-column-right__680hS","sticky-column":"TableBodyCell-module_sticky-column__QpEbV","align-right":"TableBodyCell-module_align-right__j-VqN","align-center":"TableBodyCell-module_align-center__saqzC"};
 
 var TableBodyCell = function TableBodyCell(_ref) {
   var _classNames;
@@ -4400,7 +4489,7 @@ var TableBodyCell = function TableBodyCell(_ref) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? undefined : _ref$width;
   var columnIsSticky = sticky === 'left' || sticky === 'right';
-  var tableCellClasses = classNames(styles$4['table-cell'], (_classNames = {}, _classNames[styles$4.truncated] = truncateOverflow, _classNames[styles$4.compact] = isCompact, _classNames[styles$4.borderless] = isBorderless, _classNames[styles$4['sticky-column']] = columnIsSticky, _classNames[styles$4['sticky-column-left']] = sticky === 'left', _classNames[styles$4['sticky-column-right']] = sticky === 'right', _classNames[styles$4['align-right']] = align === 'right', _classNames[styles$4['align-center']] = align === 'center', _classNames), className);
+  var tableCellClasses = classNames(styles$3['table-cell'], (_classNames = {}, _classNames[styles$3.truncated] = truncateOverflow, _classNames[styles$3.compact] = isCompact, _classNames[styles$3.borderless] = isBorderless, _classNames[styles$3['sticky-column']] = columnIsSticky, _classNames[styles$3['sticky-column-left']] = sticky === 'left', _classNames[styles$3['sticky-column-right']] = sticky === 'right', _classNames[styles$3['align-right']] = align === 'right', _classNames[styles$3['align-center']] = align === 'center', _classNames), className);
   return React__default.createElement(Box, {
     as: columnIsSticky ? 'th' : 'td',
     className: tableCellClasses,
@@ -4414,7 +4503,7 @@ var TableBodyCell = function TableBodyCell(_ref) {
   }, children === null || typeof children === 'undefined' || children === '' ? emptyCellPlaceholder : children);
 };
 
-var styles$3 = {"table-header-cell":"TableHeaderCell-module_table-header-cell__aufSm","sortable":"TableHeaderCell-module_sortable__qjrkY","borderless":"TableHeaderCell-module_borderless__uos2k","truncated":"TableHeaderCell-module_truncated__wmNfw","compact":"TableHeaderCell-module_compact__ujtrZ","sticky-header":"TableHeaderCell-module_sticky-header__PEP9t","sticky-column-left":"TableHeaderCell-module_sticky-column-left__t8qIz","sticky-column-right":"TableHeaderCell-module_sticky-column-right__6D8-X","sticky-column":"TableHeaderCell-module_sticky-column__g9ybV","align-right":"TableHeaderCell-module_align-right__Qw0YQ","align-center":"TableHeaderCell-module_align-center__1RmCS","heading":"TableHeaderCell-module_heading__fEcYT","sort-icon":"TableHeaderCell-module_sort-icon__SHgic"};
+var styles$2 = {"table-header-cell":"TableHeaderCell-module_table-header-cell__aufSm","sortable":"TableHeaderCell-module_sortable__qjrkY","borderless":"TableHeaderCell-module_borderless__uos2k","truncated":"TableHeaderCell-module_truncated__wmNfw","compact":"TableHeaderCell-module_compact__ujtrZ","sticky-header":"TableHeaderCell-module_sticky-header__PEP9t","sticky-column-left":"TableHeaderCell-module_sticky-column-left__t8qIz","sticky-column-right":"TableHeaderCell-module_sticky-column-right__6D8-X","sticky-column":"TableHeaderCell-module_sticky-column__g9ybV","align-right":"TableHeaderCell-module_align-right__Qw0YQ","align-center":"TableHeaderCell-module_align-center__1RmCS","heading":"TableHeaderCell-module_heading__fEcYT","sort-icon":"TableHeaderCell-module_sort-icon__SHgic"};
 
 // eslint-disable-line import/prefer-default-export
 var TableHeaderCell = function TableHeaderCell(_ref) {
@@ -4473,7 +4562,7 @@ var TableHeaderCell = function TableHeaderCell(_ref) {
       });
     };
     return React__default.createElement("span", {
-      className: styles$3['sort-icon']
+      className: styles$2['sort-icon']
     }, renderArrows());
   };
   var handleKeyPress = function handleKeyPress(event) {
@@ -4494,7 +4583,7 @@ var TableHeaderCell = function TableHeaderCell(_ref) {
     });
     onSort(eventWithKey);
   };
-  var tableHeaderClasses = classNames(styles$3['table-header-cell'], (_classNames = {}, _classNames[styles$3.sortable] = isSortable, _classNames[styles$3.compact] = isCompact, _classNames[styles$3.truncated] = truncateOverflow, _classNames[styles$3.borderless] = isBorderless, _classNames[styles$3['sticky-header']] = hasStickyHeader, _classNames[styles$3['sticky-column']] = sticky === 'left' || sticky === 'right', _classNames[styles$3['sticky-column-left']] = sticky === 'left', _classNames[styles$3['sticky-column-right']] = sticky === 'right', _classNames[styles$3['align-right']] = align === 'right', _classNames[styles$3['align-center']] = align === 'center', _classNames), className);
+  var tableHeaderClasses = classNames(styles$2['table-header-cell'], (_classNames = {}, _classNames[styles$2.sortable] = isSortable, _classNames[styles$2.compact] = isCompact, _classNames[styles$2.truncated] = truncateOverflow, _classNames[styles$2.borderless] = isBorderless, _classNames[styles$2['sticky-header']] = hasStickyHeader, _classNames[styles$2['sticky-column']] = sticky === 'left' || sticky === 'right', _classNames[styles$2['sticky-column-left']] = sticky === 'left', _classNames[styles$2['sticky-column-right']] = sticky === 'right', _classNames[styles$2['align-right']] = align === 'right', _classNames[styles$2['align-center']] = align === 'center', _classNames), className);
   return React__default.createElement(Box, {
     as: "th",
     display: "table-cell",
@@ -4506,7 +4595,7 @@ var TableHeaderCell = function TableHeaderCell(_ref) {
     onKeyDown: handleKeyPress,
     scope: "col"
   }, React__default.createElement("div", {
-    className: styles$3.heading
+    className: styles$2.heading
   }, column.heading, isSortable && renderIcon()));
 };
 
@@ -4539,7 +4628,7 @@ var TableRow = function TableRow(_ref) {
     rowIndex = _ref$rowIndex === void 0 ? undefined : _ref$rowIndex,
     _ref$truncateOverflow = _ref.truncateOverflow,
     truncateOverflow = _ref$truncateOverflow === void 0 ? false : _ref$truncateOverflow;
-  var tableRowClasses = classNames(styles$5['table-row'], (_classNames = {}, _classNames[styles$5.hoverable] = isHoverable, _classNames), className);
+  var tableRowClasses = classNames(styles$4['table-row'], (_classNames = {}, _classNames[styles$4.hoverable] = isHoverable, _classNames), className);
   var renderCellContent = function renderCellContent(column) {
     if (column.render) {
       var cellValue = column.dataKey && row ? row[column.dataKey] : undefined;
@@ -4608,7 +4697,7 @@ var TableBody = function TableBody(_ref) {
     isStriped = _ref$isStriped === void 0 ? false : _ref$isStriped,
     _ref$truncateOverflow = _ref.truncateOverflow,
     truncateOverflow = _ref$truncateOverflow === void 0 ? false : _ref$truncateOverflow;
-  var tableBodyClasses = classNames(styles$6['table-body'], (_classNames = {}, _classNames[styles$6.striped] = isStriped, _classNames[styles$6.hover] = hoverableRows, _classNames), className);
+  var tableBodyClasses = classNames(styles$5['table-body'], (_classNames = {}, _classNames[styles$5.striped] = isStriped, _classNames[styles$5.hover] = hoverableRows, _classNames), className);
   return React__default.createElement("tbody", {
     className: tableBodyClasses
   }, rows.map(function (row, rowIndex) {
@@ -4693,13 +4782,13 @@ var Table = function Table(_ref) {
     useFixedTableLayout = _ref$useFixedTableLay === void 0 ? false : _ref$useFixedTableLay,
     _ref$truncateOverflow = _ref.truncateOverflow,
     truncateOverflow = _ref$truncateOverflow === void 0 ? false : _ref$truncateOverflow;
-  var containerClasses = classNames(styles$7.container, (_classNames = {}, _classNames[styles$7['full-height']] = !!(isScrollable != null && isScrollable.y), _classNames));
-  var scrollContainerClasses = classNames(styles$7['scroll-container'], (_classNames2 = {}, _classNames2[styles$7.scrollable] = !!(isScrollable != null && isScrollable.x) || !!(isScrollable != null && isScrollable.y), _classNames2[styles$7['scrollable-x']] = !!(isScrollable != null && isScrollable.x), _classNames2[styles$7['scrollable-y']] = !!(isScrollable != null && isScrollable.y), _classNames2), className);
-  var tableClasses = classNames(styles$7.table, (_classNames3 = {}, _classNames3[styles$7.fixed] = useFixedTableLayout, _classNames3[styles$7.striped] = isStriped, _classNames3[styles$7.borderless] = isBorderless, _classNames3[styles$7.compact] = isCompact, _classNames3));
+  var containerClasses = classNames(styles$6.container, (_classNames = {}, _classNames[styles$6['full-height']] = !!(isScrollable != null && isScrollable.y), _classNames));
+  var scrollContainerClasses = classNames(styles$6['scroll-container'], (_classNames2 = {}, _classNames2[styles$6.scrollable] = !!(isScrollable != null && isScrollable.x) || !!(isScrollable != null && isScrollable.y), _classNames2[styles$6['scrollable-x']] = !!(isScrollable != null && isScrollable.x), _classNames2[styles$6['scrollable-y']] = !!(isScrollable != null && isScrollable.y), _classNames2), className);
+  var tableClasses = classNames(styles$6.table, (_classNames3 = {}, _classNames3[styles$6.fixed] = useFixedTableLayout, _classNames3[styles$6.striped] = isStriped, _classNames3[styles$6.borderless] = isBorderless, _classNames3[styles$6.compact] = isCompact, _classNames3));
   return React__default.createElement("div", {
     className: containerClasses
   }, isLoading && React__default.createElement("div", {
-    className: styles$7['loading-mask']
+    className: styles$6['loading-mask']
   }, React__default.createElement(Spinner, {
     size: "xl"
   })), React__default.createElement("div", {
@@ -4730,7 +4819,7 @@ var Table = function Table(_ref) {
   }))));
 };
 
-var _excluded$3 = ["children", "defaultTheme", "storageKey"];
+var _excluded$2 = ["children", "defaultTheme", "storageKey"];
 var initialState = {
   theme: 'system',
   setTheme: function setTheme() {
@@ -4744,7 +4833,7 @@ function ThemeProvider(_ref) {
     defaultTheme = _ref$defaultTheme === void 0 ? 'system' : _ref$defaultTheme,
     _ref$storageKey = _ref.storageKey,
     storageKey = _ref$storageKey === void 0 ? 'hyphen-ui-theme' : _ref$storageKey,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   var _useState = useState(function () {
       return localStorage.getItem(storageKey) || defaultTheme;
     }),
@@ -4774,13 +4863,13 @@ function ThemeProvider(_ref) {
   }), children);
 }
 
-var styles$2 = {"toast-notification":"ToastNotification-module_toast-notification__2xiTW","toast-error":"ToastNotification-module_toast-error__4ArAY","toast-dismiss":"ToastNotification-module_toast-dismiss__xxmkb","toast-notification-enter-top":"ToastNotification-module_toast-notification-enter-top__ZZDCr","toast-notification-exit-top":"ToastNotification-module_toast-notification-exit-top__fOIkZ","toast-notification-enter-bottom":"ToastNotification-module_toast-notification-enter-bottom__So3w7","toast-notification-exit-bottom":"ToastNotification-module_toast-notification-exit-bottom__DDthi","toast-notification-exit-left":"ToastNotification-module_toast-notification-exit-left__Fh1hC","toast-notification-exit-right":"ToastNotification-module_toast-notification-exit-right__C1jQ9","toast-notification-fade-in":"ToastNotification-module_toast-notification-fade-in__JlSGi","toast-notification-fade-out":"ToastNotification-module_toast-notification-fade-out__r6q4Q"};
+var styles$1 = {"toast-notification":"ToastNotification-module_toast-notification__2xiTW","toast-error":"ToastNotification-module_toast-error__4ArAY","toast-dismiss":"ToastNotification-module_toast-dismiss__xxmkb","toast-notification-enter-top":"ToastNotification-module_toast-notification-enter-top__ZZDCr","toast-notification-exit-top":"ToastNotification-module_toast-notification-exit-top__fOIkZ","toast-notification-enter-bottom":"ToastNotification-module_toast-notification-enter-bottom__So3w7","toast-notification-exit-bottom":"ToastNotification-module_toast-notification-exit-bottom__DDthi","toast-notification-exit-left":"ToastNotification-module_toast-notification-exit-left__Fh1hC","toast-notification-exit-right":"ToastNotification-module_toast-notification-exit-right__C1jQ9","toast-notification-fade-in":"ToastNotification-module_toast-notification-fade-in__JlSGi","toast-notification-fade-out":"ToastNotification-module_toast-notification-fade-out__r6q4Q"};
 
 var getAnimationClass = function getAnimationClass(position, visible) {
   var verticalPosition = position.includes('top') ? 'top' : 'bottom';
   var horizontalPosition = position.includes('left') ? 'left' : 'right';
   var isCentered = position.includes('center');
-  var _ref = prefersReducedMotion() ? [styles$2['toast-notification-fade-in'], styles$2['toast-notification-fade-out']] : [styles$2["toast-notification-enter-" + verticalPosition], styles$2["toast-notification-exit-" + (isCentered ? verticalPosition : horizontalPosition)]],
+  var _ref = prefersReducedMotion() ? [styles$1['toast-notification-fade-in'], styles$1['toast-notification-fade-out']] : [styles$1["toast-notification-enter-" + verticalPosition], styles$1["toast-notification-exit-" + (isCentered ? verticalPosition : horizontalPosition)]],
     enter = _ref[0],
     exit = _ref[1];
   return visible ? enter : exit;
@@ -4814,7 +4903,7 @@ var renderDismissIcon = function renderDismissIcon(toast, onDismiss) {
   return React__default.createElement(Box, {
     as: "button",
     borderWidth: "0",
-    className: styles$2['toast-dismiss'],
+    className: styles$1['toast-dismiss'],
     padding: "0 0 0 sm",
     alignItems: "center",
     justifyContent: "center",
@@ -4845,9 +4934,9 @@ var ToastNotification = /*#__PURE__*/React__default.memo(function (_ref2) {
     }
   }, toast.ariaProps), resolveValue(toast.message, toast));
   var animationClass = toast != null && toast.height ? getAnimationClass(toast.position || position, toast.visible) : undefined;
-  var classes = classNames(toast.className, styles$2['toast-notification'], animationClass, (_classNames = {
+  var classes = classNames(toast.className, styles$1['toast-notification'], animationClass, (_classNames = {
     'toast-notification--not-visible': !toast.visible
-  }, _classNames[styles$2['toast-error']] = toast.type === 'error', _classNames));
+  }, _classNames[styles$1['toast-error']] = toast.type === 'error', _classNames));
   return React__default.createElement(Box, {
     alignItems: "center",
     maxWidth: "300px",
@@ -5220,7 +5309,7 @@ var useToasts = function useToasts(toastOptions) {
   };
 };
 
-var _excluded$2 = ["children", "containerStyle", "containerClassName", "gutter", "position", "reverseOrder", "toastOptions"];
+var _excluded$1 = ["children", "containerStyle", "containerClassName", "gutter", "position", "reverseOrder", "toastOptions"];
 var createRectRef = function createRectRef(onRect) {
   return function (el) {
     if (el) {
@@ -5281,7 +5370,7 @@ var ToastContainer = function ToastContainer(_ref) {
     _ref$reverseOrder = _ref.reverseOrder,
     reverseOrder = _ref$reverseOrder === void 0 ? false : _ref$reverseOrder,
     toastOptions = _ref.toastOptions,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$1);
   var _useToasts = useToasts(toastOptions),
     toasts = _useToasts.toasts,
     handlers = _useToasts.handlers;
@@ -5319,41 +5408,21 @@ var ToastContainer = function ToastContainer(_ref) {
   }));
 };
 
-var styles$1 = {"item":"Toggle-module_item__NQ7iu","outline":"Toggle-module_outline__tR6T1"};
+var styles = {"item":"Toggle-module_item__NQ7iu","outline":"Toggle-module_outline__tR6T1"};
 
-var _excluded$1 = ["className", "variant", "children"];
+var _excluded = ["className", "variant", "children"];
 var Toggle = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
     children = _ref.children,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
   return React__default.createElement(TogglePrimitive.Root, _extends({
     ref: ref,
-    className: classNames('br-sm display-flex g-sm p-sm', styles$1.item, variant === 'outline' && styles$1.outline, className)
+    className: classNames('br-sm display-flex g-sm p-sm', styles.item, variant === 'outline' && styles.outline, className)
   }, props), children);
 });
 
-var styles = {"TooltipContent":"Tooltip-module_TooltipContent__wLEZU","tooltip-slideUpAndFade":"Tooltip-module_tooltip-slideUpAndFade__Y05jp","tooltip-slideRightAndFade":"Tooltip-module_tooltip-slideRightAndFade__K04p9","tooltip-slideDownAndFade":"Tooltip-module_tooltip-slideDownAndFade__1wMd-","tooltip-slideLeftAndFade":"Tooltip-module_tooltip-slideLeftAndFade__iQ1fp"};
-
-var _excluded = ["className", "sideOffset"];
-var TooltipProvider = TooltipPrimitive.Provider;
-var Tooltip = TooltipPrimitive.Root;
-var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipPortal = TooltipPrimitive.Portal;
-var TooltipContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    _ref$sideOffset = _ref.sideOffset,
-    sideOffset = _ref$sideOffset === void 0 ? 4 : _ref$sideOffset,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded);
-  return React.createElement(TooltipPrimitive.Content, _extends({
-    ref: ref,
-    sideOffset: sideOffset,
-    className: classNames(styles.TooltipContent, 'background-color-tooltip font-color-tooltip font-size-xs z-index-popover overflow-hidden br-sm p-h-sm p-v-xs shadow-sm', className)
-  }, props));
-});
-TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-
 var useWindowSize = function useWindowSize() {
   var _React$useContext = React__default.useContext(ResponsiveContext),
     innerWidth = _React$useContext.innerWidth,
@@ -5453,5 +5522,5 @@ var useTheme = function useTheme() {
   return context;
 };
 
-export { Alert, Badge, Box, Button, Card, CardBaseComponent, Checkbox, CheckboxInput, Collapsible, CollapsibleContent, CollapsibleTrigger, DateInput, DatePicker, Details, DetailsBaseComponent, DetailsSummary, Drawer, DrawerCloseButton, DrawerContent, DrawerHeader, DrawerProvider, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FormControl, FormLabel, FormikCheckboxInput, FormikRadioGroup, FormikSelectInput, FormikSelectInputInset, FormikSelectInputNative, FormikSwitch, FormikTextInput, FormikTextInputInset, FormikTextareaInput, FormikTextareaInputInset, FormikTimePicker, FormikTimePickerNative, FormikToggleGroup, Heading, Icon, Modal, ModalBaseComponent, Pagination, Popover, RadioGroup, RangeInput, ResponsiveContext, ResponsiveProvider, SelectInput, SelectInputInset, SelectInputNative, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarTrigger, Spinner, Switch, Table, TextInput, TextInputInset, TextareaInput, TextareaInputInset, ThemeProvider, ThemeProviderContext, TimePicker, TimePickerNative, ToastContainer, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, boxPropsKeys, createRectRef, toast, useBreakpoint, useDrawer, useIsMobile, useIsomorphicLayoutEffect, useOpenClose, useSidebar, useTheme, useToasts, useWindowSize };
+export { Alert, Badge, Box, Button, Card, CardBaseComponent, Checkbox, CheckboxInput, Collapsible, CollapsibleContent, CollapsibleTrigger, DateInput, DatePicker, Details, DetailsBaseComponent, DetailsSummary, Drawer, DrawerCloseButton, DrawerContent, DrawerHeader, DrawerProvider, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FormControl, FormLabel, FormikCheckboxInput, FormikRadioGroup, FormikSelectInput, FormikSelectInputInset, FormikSelectInputNative, FormikSwitch, FormikTextInput, FormikTextInputInset, FormikTextareaInput, FormikTextareaInputInset, FormikTimePicker, FormikTimePickerNative, FormikToggleGroup, FormikToggleGroupMulti, Heading, Icon, Modal, ModalBaseComponent, Pagination, Popover, RadioGroup, RangeInput, ResponsiveContext, ResponsiveProvider, SelectInput, SelectInputInset, SelectInputNative, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarTrigger, Spinner, Switch, Table, TextInput, TextInputInset, TextareaInput, TextareaInputInset, ThemeProvider, ThemeProviderContext, TimePicker, TimePickerNative, ToastContainer, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, boxPropsKeys, createRectRef, toast, useBreakpoint, useDrawer, useIsMobile, useIsomorphicLayoutEffect, useOpenClose, useSidebar, useTheme, useToasts, useWindowSize };
 //# sourceMappingURL=hyphen-components.esm.js.map