@hyphen/hyphen-components 7.10.0 → 8.0.1

package/dist/hyphen-components.cjs.development.js

@@ -93,7 +93,6 @@ __export(src_exports, {
   FormikTextareaInput: () => FormikTextareaInput,
   FormikTextareaInputInset: () => FormikTextareaInputInset,
   FormikTimePicker: () => FormikTimePicker,
-  FormikTimePickerNative: () => FormikTimePickerNative,
   FormikToggleGroup: () => FormikToggleGroup,
   FormikToggleGroupMulti: () => FormikToggleGroupMulti,
   HEADING_SIZE_OPTIONS: () => HEADING_SIZE_OPTIONS,
@@ -146,7 +145,6 @@ __export(src_exports, {
   ThemeProvider: () => ThemeProvider,
   ThemeProviderContext: () => ThemeProviderContext,
   TimePicker: () => TimePicker,
-  TimePickerNative: () => TimePickerNative,
   ToastContainer: () => ToastContainer,
   Toggle: () => Toggle,
   ToggleGroup: () => ToggleGroup,
@@ -731,7 +729,7 @@ var Icon = (0, import_react2.forwardRef)(
 Icon.displayName = "Icon";
 
 // src/components/Alert/Alert.module.scss
-var Alert_module_default = { "alert": "alert__9XZ4A", "close-icon": "close-icon__NDL4K", "alert-heading": "alert-heading__XCRu3", "alert__default": "alert__default__3qStp", "alert__info": "alert__info__BOSxI", "alert__success": "alert__success__NPujz", "alert__warning": "alert__warning__sS3f7", "alert__danger": "alert__danger__6ZwUi", "alert__icon__default": "alert__icon__default__kvFlP", "alert__icon__info": "alert__icon__info__YcT5d", "alert__icon__success": "alert__icon__success__hzZYf", "alert__icon__warning": "alert__icon__warning__ACoYh", "alert__icon__danger": "alert__icon__danger__Piw3b" };
+var Alert_module_default = { "alert": "alert__9XZ4A", "close-icon": "close-icon__NDL4K", "alert-heading": "alert-heading__XCRu3", "alert__default": "alert__default__3qStp", "alert__info": "alert__info__BOSxI", "alert__success": "alert__success__NPujz", "alert__warning": "alert__warning__sS3f7", "alert__danger": "alert__danger__6ZwUi" };
 
 // src/components/Alert/Alert.constants.ts
 var ALERT_ICONS_MAP = {
@@ -748,7 +746,6 @@ var AlertComponent = ({
   className = "",
   hasIcon = false,
   isCompact = false,
-  message = "",
   onClose = void 0,
   render = void 0,
   title = "",
@@ -774,7 +771,7 @@ var AlertComponent = ({
   );
   const alertIcon = (0, import_react4.useMemo)(() => {
     if (!hasIcon) return null;
-    return /* @__PURE__ */ import_react4.default.createElement(Box, { fontSize: "md", className: Alert_module_default[`alert__icon__${variant}`] }, /* @__PURE__ */ import_react4.default.createElement(
+    return /* @__PURE__ */ import_react4.default.createElement(Box, { fontSize: "md" }, /* @__PURE__ */ import_react4.default.createElement(
       Icon,
       {
         name: ALERT_ICONS_MAP[variant].icon,
@@ -784,30 +781,22 @@ var AlertComponent = ({
   }, [hasIcon, variant]);
   const closeIcon = (0, import_react4.useMemo)(() => {
     if (!onClose) return null;
-    return /* @__PURE__ */ import_react4.default.createElement(
-      Box,
+    return /* @__PURE__ */ import_react4.default.createElement(Box, { margin: "0 0 0 auto", className: Alert_module_default["close-icon"] }, /* @__PURE__ */ import_react4.default.createElement(
+      "button",
       {
-        margin: "0 0 0 auto",
-        color: "secondary",
-        className: Alert_module_default["close-icon"]
+        type: "button",
+        onClick: handleClose,
+        onKeyUp: handleCloseKeyPress,
+        "aria-label": "dismiss"
       },
-      /* @__PURE__ */ import_react4.default.createElement(
-        "button",
-        {
-          type: "button",
-          onClick: handleClose,
-          onKeyUp: handleCloseKeyPress,
-          "aria-label": "dismiss"
-        },
-        /* @__PURE__ */ import_react4.default.createElement(Icon, { name: "remove", "data-testid": "alert-close-icon-test-id" })
-      )
-    );
+      /* @__PURE__ */ import_react4.default.createElement(Icon, { name: "remove", "data-testid": "alert-close-icon-test-id" })
+    ));
   }, [onClose, handleClose, handleCloseKeyPress]);
   const content = (0, import_react4.useMemo)(() => {
     if (render) {
       return render();
     }
-    return /* @__PURE__ */ import_react4.default.createElement(Box, { display: "block", childGap: message && title ? "2xs" : void 0 }, title && /* @__PURE__ */ import_react4.default.createElement(
+    return /* @__PURE__ */ import_react4.default.createElement(Box, { display: "block", childGap: children && title ? "2xs" : void 0 }, title && /* @__PURE__ */ import_react4.default.createElement(
       Box,
       {
         as: "h4",
@@ -816,8 +805,8 @@ var AlertComponent = ({
         className: Alert_module_default["alert-heading"]
       },
       title
-    ), children ?? (message && (typeof message === "string" ? /* @__PURE__ */ import_react4.default.createElement("p", null, message) : message)));
-  }, [render, message, title, children]);
+    ), children);
+  }, [render, title, children]);
   return /* @__PURE__ */ import_react4.default.createElement(
     Box,
     {
@@ -847,14 +836,25 @@ var import_react5 = __toESM(require("react"));
 var import_classnames4 = __toESM(require("classnames"));
 
 // src/components/Badge/Badge.module.scss
-var Badge_module_default = { "badge": "badge__wbyII", "size-sm": "size-sm__v5iQ5", "size-md": "size-md__t0Qz1", "size-lg": "size-lg__HQPfE", "inverse": "inverse__gQfNV", "default": "default__DFAbi", "secondary": "secondary__ZPoaQ", "danger": "danger__ImdGy", "outline": "outline__jrc2I", "purple": "purple__81ewe", "green": "green__ZMiGE", "red": "red__XGDtA", "blue": "blue__2kZV5", "yellow": "yellow__BQ41f", "light-grey": "light-grey__sXLPP", "dark-grey": "dark-grey__OKyFH", "orange": "orange__6Hwzb", "hyphen": "hyphen__nvWRN", "size-sm-tablet": "size-sm-tablet__IkjZY", "size-md-tablet": "size-md-tablet__kMUva", "size-lg-tablet": "size-lg-tablet__ldE4r", "size-sm-desktop": "size-sm-desktop__alYyy", "size-md-desktop": "size-md-desktop__AvaSK", "size-lg-desktop": "size-lg-desktop__5graA", "size-sm-hd": "size-sm-hd__74Pms", "size-md-hd": "size-md-hd__cEiUq", "size-lg-hd": "size-lg-hd__Qi3ic" };
+var Badge_module_default = { "badge": "badge__wbyII", "size-sm": "size-sm__v5iQ5", "label": "label__pDVHA", "size-md": "size-md__t0Qz1", "size-lg": "size-lg__HQPfE", "color-grey": "color-grey__expYg", "color-blue": "color-blue__W6WO3", "color-green": "color-green__Tb6Do", "color-yellow": "color-yellow__rs3OW", "color-red": "color-red__yD5FI", "color-purple": "color-purple__JH5Qe", "color-orange": "color-orange__Q7DOt", "color-brand": "color-brand__Ri3JN", "solid": "solid__A3Y54", "soft": "soft__Bj0sP", "surface": "surface__IcVyX", "outline": "outline__jrc2I", "radius-none": "radius-none__h6tIW", "radius-sm": "radius-sm__Ioju2", "radius-md": "radius-md__gmDDk", "radius-lg": "radius-lg__08R9C", "radius-full": "radius-full__arYCj", "size-sm-tablet": "size-sm-tablet__IkjZY", "size-md-tablet": "size-md-tablet__kMUva", "size-lg-tablet": "size-lg-tablet__ldE4r", "size-sm-desktop": "size-sm-desktop__alYyy", "size-md-desktop": "size-md-desktop__AvaSK", "size-lg-desktop": "size-lg-desktop__5graA", "size-sm-hd": "size-sm-hd__74Pms", "size-md-hd": "size-md-hd__cEiUq", "size-lg-hd": "size-lg-hd__Qi3ic" };
 
 // src/components/Badge/Badge.tsx
+var BADGE_COLOR_ALIASES = {
+  danger: "red",
+  success: "green",
+  warning: "yellow",
+  info: "blue"
+};
+var renderBadgeChildren = (children) => import_react5.Children.map(
+  children,
+  (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ import_react5.default.createElement("span", { className: Badge_module_default.label }, child) : child
+);
 var Badge = (0, import_react5.forwardRef)(
   ({
     className = "",
-    message = "",
-    variant = "default",
+    color = "grey",
+    radius = "full",
+    variant = "soft",
     size = "md",
     children,
     ...restProps
@@ -862,13 +862,14 @@ var Badge = (0, import_react5.forwardRef)(
     const responsiveClasses = generateResponsiveClasses("size", size).map(
       (c) => Badge_module_default[c]
     );
+    const hue = BADGE_COLOR_ALIASES[color] ?? color;
     const badgeClasses = (0, import_classnames4.default)(
       Badge_module_default.badge,
       className,
       responsiveClasses,
-      {
-        [Badge_module_default[variant]]: variant
-      }
+      Badge_module_default[variant],
+      Badge_module_default[`color-${hue}`],
+      Badge_module_default[`radius-${radius}`]
     );
     return /* @__PURE__ */ import_react5.default.createElement(
       Box,
@@ -880,7 +881,7 @@ var Badge = (0, import_react5.forwardRef)(
         direction: "row",
         ...restProps
       },
-      children || message
+      renderBadgeChildren(children)
     );
   }
 );
@@ -2096,7 +2097,7 @@ var DropdownMenuItem = import_react24.default.forwardRef(({ className, inset, ..
     }
   );
 });
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+DropdownMenuItem.displayName = "DropdownMenuItem";
 var DropdownMenuContent = import_react24.default.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ import_react24.default.createElement(DropdownMenuPrimitive.Portal, null, /* @__PURE__ */ import_react24.default.createElement(
   DropdownMenuPrimitive.Content,
   {
@@ -2112,7 +2113,7 @@ var DropdownMenuContent = import_react24.default.forwardRef(({ className, sideOf
     ...props
   }
 )));
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+DropdownMenuContent.displayName = "DropdownMenuContent";
 var DropdownMenuLabel = import_react24.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ import_react24.default.createElement(
   DropdownMenuPrimitive.Label,
   {
@@ -2125,7 +2126,7 @@ var DropdownMenuLabel = import_react24.default.forwardRef(({ className, inset, .
     ...props
   }
 ));
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+DropdownMenuLabel.displayName = "DropdownMenuLabel";
 var DropdownMenuSeparator = import_react24.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react24.default.createElement(
   DropdownMenuPrimitive.Separator,
   {
@@ -2141,7 +2142,7 @@ var DropdownMenuSeparator = import_react24.default.forwardRef(({ className, ...p
     ...props
   }
 ));
-DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
 var DropdownMenuShortcut = ({
   className,
   ...props
@@ -2173,7 +2174,7 @@ var DropdownMenuSubTrigger = import_react24.default.forwardRef(({ className, ins
   children,
   /* @__PURE__ */ import_react24.default.createElement(Icon, { name: "caret-sm-right", className: "m-left-auto" })
 ));
-DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+DropdownMenuSubTrigger.displayName = "DropdownMenuSubTrigger";
 var DropdownMenuSubContent = import_react24.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react24.default.createElement(
   DropdownMenuPrimitive.SubContent,
   {
@@ -2185,7 +2186,7 @@ var DropdownMenuSubContent = import_react24.default.forwardRef(({ className, ...
     ...props
   }
 ));
-DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+DropdownMenuSubContent.displayName = "DropdownMenuSubContent";
 
 // src/components/FormControl/FormControl.tsx
 var import_react25 = __toESM(require("react"));
@@ -3594,21 +3595,32 @@ var TimePicker = ({
         value: currentTime.toISOString(),
         label: currentTime.toLocaleTimeString(locales, dateDisplayOptions)
       });
-      currentTime.setSeconds(first.getSeconds() + interval);
+      currentTime.setSeconds(currentTime.getSeconds() + interval);
     }
     return timeOptions;
   };
+  const options = generateTimes();
+  let valueDate;
+  if (typeof value === "string") {
+    valueDate = new Date(value);
+  } else if (typeof value === "number") {
+    valueDate = new Date(value);
+  }
+  const matchingOption = valueDate && !Number.isNaN(valueDate.getTime()) ? options.find(({ value: optionValue }) => {
+    const optionDate = new Date(optionValue);
+    return optionDate.getHours() === valueDate.getHours() && optionDate.getMinutes() === valueDate.getMinutes() && optionDate.getSeconds() === valueDate.getSeconds();
+  }) : void 0;
   return /* @__PURE__ */ import_react46.default.createElement(
-    SelectInput,
+    SelectInputNative,
     {
       ...restProps,
       id,
       name,
       label,
       onChange,
-      options: generateTimes(),
+      options,
       placeholder,
-      value
+      value: matchingOption?.value ?? value
     }
   );
 };
@@ -3617,7 +3629,6 @@ var TimePicker = ({
 var FormikTimePicker = ({
   field: { name, onBlur, onChange: formikOnChange, value },
   form: { touched, errors },
-  options,
   onChange,
   ...props
 }) => /* @__PURE__ */ import_react47.default.createElement(
@@ -3628,92 +3639,16 @@ var FormikTimePicker = ({
     onBlur,
     onChange: onChange ?? formikOnChange,
     value,
-    error: (0, import_formik10.getIn)(touched, name) && (0, import_formik10.getIn)(errors, name),
-    options
+    error: (0, import_formik10.getIn)(touched, name) && (0, import_formik10.getIn)(errors, name)
   }
 );
 
-// src/components/Formik/FormikTimePickerNative/FormikTimePickerNative.tsx
+// src/components/Formik/FormikSwitch/FormikSwitch.tsx
 var import_react49 = __toESM(require("react"));
 var import_formik11 = require("formik");
 
-// src/components/TimePickerNative/TimePickerNative.tsx
-var import_react48 = __toESM(require("react"));
-var TimePickerNative = ({
-  id,
-  name,
-  label,
-  onChange,
-  value,
-  dateDisplayOptions = { hour: "2-digit", minute: "2-digit" },
-  endTime = void 0,
-  interval = 900,
-  locales = "en-US",
-  placeholder = "HH:MM",
-  startTime = void 0,
-  ...restProps
-}) => {
-  const generateTimes = () => {
-    const first = /* @__PURE__ */ new Date();
-    first.setHours(startTime?.hour || 0, startTime?.minute || 0, 0, 0);
-    const last = /* @__PURE__ */ new Date();
-    last.setHours(
-      endTime?.hour || first.getHours() + 24,
-      endTime?.minute || 0,
-      0,
-      0
-    );
-    const timeOptions = [];
-    const currentTime = new Date(first);
-    while (currentTime < last) {
-      timeOptions.push({
-        value: currentTime.toISOString(),
-        label: currentTime.toLocaleTimeString(locales, dateDisplayOptions)
-      });
-      currentTime.setSeconds(first.getSeconds() + interval);
-    }
-    return timeOptions;
-  };
-  const options = generateTimes();
-  return /* @__PURE__ */ import_react48.default.createElement(
-    SelectInputNative,
-    {
-      ...restProps,
-      id,
-      name,
-      label,
-      onChange,
-      options,
-      placeholder,
-      value
-    }
-  );
-};
-
-// src/components/Formik/FormikTimePickerNative/FormikTimePickerNative.tsx
-var FormikTimePickerNative = ({
-  field: { name, onBlur, onChange: formikOnChange, value },
-  form: { touched, errors },
-  onChange,
-  ...props
-}) => /* @__PURE__ */ import_react49.default.createElement(
-  TimePickerNative,
-  {
-    ...props,
-    name,
-    onBlur,
-    onChange: onChange ?? formikOnChange,
-    value,
-    error: (0, import_formik11.getIn)(touched, name) && (0, import_formik11.getIn)(errors, name)
-  }
-);
-
-// src/components/Formik/FormikSwitch/FormikSwitch.tsx
-var import_react51 = __toESM(require("react"));
-var import_formik12 = require("formik");
-
 // src/components/Switch/Switch.tsx
-var import_react50 = __toESM(require("react"));
+var import_react48 = __toESM(require("react"));
 var import_classnames27 = __toESM(require("classnames"));
 
 // src/components/Switch/Switch.module.scss
@@ -3786,22 +3721,22 @@ var Switch = ({
     requiredIndicator,
     size
   };
-  return /* @__PURE__ */ import_react50.default.createElement(Box, { className }, /* @__PURE__ */ import_react50.default.createElement(Box, { className: wrapperClasses }, /* @__PURE__ */ import_react50.default.createElement(FormLabel, { ...labelProps }, /* @__PURE__ */ import_react50.default.createElement("input", { ...inputProps }), /* @__PURE__ */ import_react50.default.createElement(
+  return /* @__PURE__ */ import_react48.default.createElement(Box, { className }, /* @__PURE__ */ import_react48.default.createElement(Box, { className: wrapperClasses }, /* @__PURE__ */ import_react48.default.createElement(FormLabel, { ...labelProps }, /* @__PURE__ */ import_react48.default.createElement("input", { ...inputProps }), /* @__PURE__ */ import_react48.default.createElement(
     "span",
     {
       "aria-hidden": "true",
       className: trackClasses,
       "data-testid": "switchTrack"
     },
-    /* @__PURE__ */ import_react50.default.createElement("span", { className: thumbClasses, "data-testid": "switchThumb" })
-  ), !hideLabel && /* @__PURE__ */ import_react50.default.createElement(
+    /* @__PURE__ */ import_react48.default.createElement("span", { className: thumbClasses, "data-testid": "switchThumb" })
+  ), !hideLabel && /* @__PURE__ */ import_react48.default.createElement(
     Box,
     {
       gap: "2xs",
       className: helpText && (size === "md" || size === "lg") ? "m-top-2xs" : ""
     },
-    label && /* @__PURE__ */ import_react50.default.createElement("div", null, label),
-    helpText && /* @__PURE__ */ import_react50.default.createElement(
+    label && /* @__PURE__ */ import_react48.default.createElement("div", null, label),
+    helpText && /* @__PURE__ */ import_react48.default.createElement(
       Box,
       {
         as: "p",
@@ -3812,7 +3747,7 @@ var Switch = ({
       },
       helpText
     )
-  ))), error && error !== true && /* @__PURE__ */ import_react50.default.createElement(InputValidationMessage, null, error));
+  ))), error && error !== true && /* @__PURE__ */ import_react48.default.createElement(InputValidationMessage, null, error));
 };
 
 // src/components/Formik/FormikSwitch/FormikSwitch.tsx
@@ -3827,10 +3762,10 @@ var FormikSwitch = ({
   },
   form: { touched, errors },
   ...props
-}) => /* @__PURE__ */ import_react51.default.createElement(
+}) => /* @__PURE__ */ import_react49.default.createElement(
   Switch,
   {
-    error: (0, import_formik12.getIn)(touched, name) && (0, import_formik12.getIn)(errors, name),
+    error: (0, import_formik11.getIn)(touched, name) && (0, import_formik11.getIn)(errors, name),
     isChecked: value,
     onBlur,
     onChange,
@@ -3839,11 +3774,11 @@ var FormikSwitch = ({
 );
 
 // src/components/Formik/FormikToggleGroup/FormikToggleGroup.tsx
-var import_react53 = __toESM(require("react"));
-var import_formik13 = require("formik");
+var import_react51 = __toESM(require("react"));
+var import_formik12 = require("formik");
 
 // src/components/ToggleGroup/ToggleGroup.tsx
-var import_react52 = __toESM(require("react"));
+var import_react50 = __toESM(require("react"));
 var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"));
 
 // src/components/ToggleGroup/ToggleGroup.module.scss
@@ -3851,11 +3786,11 @@ var ToggleGroup_module_default = { "item": "item__R2aaI", "outline": "outline__F
 
 // src/components/ToggleGroup/ToggleGroup.tsx
 var import_classnames28 = __toESM(require("classnames"));
-var ToggleGroupContext = (0, import_react52.createContext)({
+var ToggleGroupContext = (0, import_react50.createContext)({
   variant: "default"
 });
-var ToggleGroup = (0, import_react52.forwardRef)(
-  ({ className, variant = "default", children, gap = "xs", error, ...props }, ref) => /* @__PURE__ */ import_react52.default.createElement("div", null, /* @__PURE__ */ import_react52.default.createElement(
+var ToggleGroup = (0, import_react50.forwardRef)(
+  ({ className, variant = "default", children, gap = "xs", error, ...props }, ref) => /* @__PURE__ */ import_react50.default.createElement("div", null, /* @__PURE__ */ import_react50.default.createElement(
     ToggleGroupPrimitive.Root,
     {
       ref,
@@ -3866,14 +3801,14 @@ var ToggleGroup = (0, import_react52.forwardRef)(
       ),
       ...props
     },
-    /* @__PURE__ */ import_react52.default.createElement(ToggleGroupContext.Provider, { value: { variant } }, children)
-  ), error && /* @__PURE__ */ import_react52.default.createElement(InputValidationMessage, null, error))
+    /* @__PURE__ */ import_react50.default.createElement(ToggleGroupContext.Provider, { value: { variant } }, children)
+  ), error && /* @__PURE__ */ import_react50.default.createElement(InputValidationMessage, null, error))
 );
 ToggleGroup.displayName = "ToggleGroup";
-var ToggleGroupItem = (0, import_react52.forwardRef)(({ className, children, value, variant, ...props }, ref) => {
-  const { variant: contextVariant } = (0, import_react52.useContext)(ToggleGroupContext);
+var ToggleGroupItem = (0, import_react50.forwardRef)(({ className, children, value, variant, ...props }, ref) => {
+  const { variant: contextVariant } = (0, import_react50.useContext)(ToggleGroupContext);
   const appliedVariant = variant || contextVariant;
-  return /* @__PURE__ */ import_react52.default.createElement(
+  return /* @__PURE__ */ import_react50.default.createElement(
     ToggleGroupPrimitive.Item,
     {
       ref,
@@ -3901,7 +3836,7 @@ var FormikToggleGroup = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ import_react53.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react53.default.createElement("div", null, label && /* @__PURE__ */ import_react53.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react53.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react53.default.createElement(
+  return /* @__PURE__ */ import_react51.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react51.default.createElement("div", null, label && /* @__PURE__ */ import_react51.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react51.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react51.default.createElement(
     ToggleGroup,
     {
       ...props,
@@ -3909,10 +3844,10 @@ var FormikToggleGroup = ({
       onBlur,
       onValueChange: (value2) => setFieldValue(name, value2),
       value,
-      error: (0, import_formik13.getIn)(touched, name) && (0, import_formik13.getIn)(errors, name),
+      error: (0, import_formik12.getIn)(touched, name) && (0, import_formik12.getIn)(errors, name),
       type: "single"
     },
-    children ? children : options.map((option) => /* @__PURE__ */ import_react53.default.createElement(
+    children ? children : options.map((option) => /* @__PURE__ */ import_react51.default.createElement(
       ToggleGroupItem,
       {
         id: option.id,
@@ -3926,8 +3861,8 @@ var FormikToggleGroup = ({
 };
 
 // src/components/Formik/FormikToggleGroupMulti/FormikToggleGroupMulti.tsx
-var import_react54 = __toESM(require("react"));
-var import_formik14 = require("formik");
+var import_react52 = __toESM(require("react"));
+var import_formik13 = require("formik");
 var FormikToggleGroupMulti = ({
   name,
   options,
@@ -3938,8 +3873,8 @@ var FormikToggleGroupMulti = ({
   gap,
   ...props
 }) => {
-  const [field, meta, helpers] = (0, import_formik14.useField)(name);
-  return /* @__PURE__ */ import_react54.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react54.default.createElement("div", null, label && /* @__PURE__ */ import_react54.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react54.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react54.default.createElement(import_formik14.FieldArray, { name }, () => /* @__PURE__ */ import_react54.default.createElement(
+  const [field, meta, helpers] = (0, import_formik13.useField)(name);
+  return /* @__PURE__ */ import_react52.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react52.default.createElement("div", null, label && /* @__PURE__ */ import_react52.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react52.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react52.default.createElement(import_formik13.FieldArray, { name }, () => /* @__PURE__ */ import_react52.default.createElement(
     ToggleGroup,
     {
       ...props,
@@ -3954,7 +3889,7 @@ var FormikToggleGroupMulti = ({
       type: "multiple",
       variant
     },
-    children ? children : options.map((option) => /* @__PURE__ */ import_react54.default.createElement(
+    children ? children : options.map((option) => /* @__PURE__ */ import_react52.default.createElement(
       ToggleGroupItem,
       {
         key: option.id,
@@ -3968,14 +3903,14 @@ var FormikToggleGroupMulti = ({
 };
 
 // src/components/Modal/Modal.tsx
-var import_react58 = __toESM(require("react"));
+var import_react56 = __toESM(require("react"));
 var import_react_modal2 = __toESM(require("react-modal"));
 var import_react_focus_lock2 = __toESM(require("react-focus-lock"));
 var import_react_remove_scroll2 = require("react-remove-scroll");
 var import_classnames29 = __toESM(require("classnames"));
 
 // src/components/Modal/components/ModalFooter/ModalFooter.tsx
-var import_react55 = __toESM(require("react"));
+var import_react53 = __toESM(require("react"));
 var ModalFooter = ({
   children,
   padding,
@@ -3985,7 +3920,7 @@ var ModalFooter = ({
   gap = "md",
   style,
   ...restProps
-}) => /* @__PURE__ */ import_react55.default.createElement(
+}) => /* @__PURE__ */ import_react53.default.createElement(
   Box,
   {
     padding,
@@ -4003,7 +3938,7 @@ var ModalFooter = ({
 );
 
 // src/components/Modal/components/ModalHeader/ModalHeader.tsx
-var import_react56 = __toESM(require("react"));
+var import_react54 = __toESM(require("react"));
 var ModalHeader = ({
   id,
   onDismiss,
@@ -4015,7 +3950,7 @@ var ModalHeader = ({
   ...restProps
 }) => {
   const justifyContentValue = title || children ? "space-between" : "flex-end";
-  return /* @__PURE__ */ import_react56.default.createElement(
+  return /* @__PURE__ */ import_react54.default.createElement(
     Box,
     {
       direction,
@@ -4028,8 +3963,8 @@ var ModalHeader = ({
       },
       ...restProps
     },
-    (title || children) && /* @__PURE__ */ import_react56.default.createElement(Box, { gap: "2xs" }, title && /* @__PURE__ */ import_react56.default.createElement(Box, { as: "h4", fontSize: { base: "md", tablet: "lg" }, id }, title), children),
-    onDismiss && /* @__PURE__ */ import_react56.default.createElement(
+    (title || children) && /* @__PURE__ */ import_react54.default.createElement(Box, { gap: "2xs" }, title && /* @__PURE__ */ import_react54.default.createElement(Box, { as: "h4", fontSize: { base: "md", tablet: "lg" }, id }, title), children),
+    onDismiss && /* @__PURE__ */ import_react54.default.createElement(
       Button,
       {
         "aria-label": "close",
@@ -4044,14 +3979,14 @@ var ModalHeader = ({
 };
 
 // src/components/Modal/components/ModalBody/ModalBody.tsx
-var import_react57 = __toESM(require("react"));
+var import_react55 = __toESM(require("react"));
 var ModalBody = ({
   children,
   flex = "auto",
   overflow = "auto",
   height = "100",
   ...restProps
-}) => /* @__PURE__ */ import_react57.default.createElement(
+}) => /* @__PURE__ */ import_react55.default.createElement(
   Box,
   {
     flex,
@@ -4067,7 +4002,7 @@ var ModalBody = ({
 var Modal_module_default = { "modal-close": "modal-close__ZbvmC", "modal": "modal__hmSZ2", "modal-content": "modal-content__c1lVi" };
 
 // src/components/Modal/Modal.tsx
-var ModalBaseComponent = (0, import_react58.forwardRef)(
+var ModalBaseComponent = (0, import_react56.forwardRef)(
   ({
     ariaLabel,
     ariaLabelledBy,
@@ -4085,7 +4020,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
     style,
     ...restProps
   }, ref) => {
-    const activateFocusLock = (0, import_react58.useCallback)(() => {
+    const activateFocusLock = (0, import_react56.useCallback)(() => {
       setTimeout(() => {
         if (initialFocusRef && initialFocusRef.current) {
           initialFocusRef.current.focus();
@@ -4106,7 +4041,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
     );
     if (!isOpen) return null;
     const parentElement = containerRef?.current ? containerRef.current : void 0;
-    return /* @__PURE__ */ import_react58.default.createElement(
+    return /* @__PURE__ */ import_react56.default.createElement(
       import_react_focus_lock2.default,
       {
         autoFocus: true,
@@ -4115,7 +4050,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
         onActivation: activateFocusLock,
         crossFrame: true
       },
-      /* @__PURE__ */ import_react58.default.createElement(import_react_remove_scroll2.RemoveScroll, { allowPinchZoom, enabled: isOpen }, /* @__PURE__ */ import_react58.default.createElement(Box, { ref }, /* @__PURE__ */ import_react58.default.createElement(
+      /* @__PURE__ */ import_react56.default.createElement(import_react_remove_scroll2.RemoveScroll, { allowPinchZoom, enabled: isOpen }, /* @__PURE__ */ import_react56.default.createElement(Box, { ref }, /* @__PURE__ */ import_react56.default.createElement(
         import_react_modal2.default,
         {
           isOpen,
@@ -4127,7 +4062,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
           style: { content: { ...maxWidthCss.styles, ...style } },
           ...restProps
         },
-        /* @__PURE__ */ import_react58.default.createElement(
+        /* @__PURE__ */ import_react56.default.createElement(
           Box,
           {
             "aria-label": ariaLabel,
@@ -4153,7 +4088,7 @@ var Modal = (() => {
 })();
 
 // src/components/Pagination/Pagination.tsx
-var import_react59 = __toESM(require("react"));
+var import_react57 = __toESM(require("react"));
 var import_classnames30 = __toESM(require("classnames"));
 
 // src/components/Pagination/Pagination.utilities.ts
@@ -4207,30 +4142,30 @@ var Pagination = ({
   numberOfPagesDisplayed = 5,
   prevPageText = "Previous"
 }) => {
-  const pageTotal = (0, import_react59.useMemo)(() => {
+  const pageTotal = (0, import_react57.useMemo)(() => {
     if (itemsPerPage <= 0) return 1;
     return generatePageTotal(totalItemsCount, itemsPerPage);
   }, [totalItemsCount, itemsPerPage]);
   const validActivePage = Math.max(1, Math.min(activePage, pageTotal));
-  const activeListRange = (0, import_react59.useMemo)(
+  const activeListRange = (0, import_react57.useMemo)(
     () => generateActiveListRange(validActivePage, totalItemsCount, itemsPerPage),
     [validActivePage, totalItemsCount, itemsPerPage]
   );
-  const pages = (0, import_react59.useMemo)(
+  const pages = (0, import_react57.useMemo)(
     () => generatePages(pageTotal, validActivePage, numberOfPagesDisplayed),
     [pageTotal, validActivePage, numberOfPagesDisplayed]
   );
-  const paginationClassNames = (0, import_react59.useMemo)(
+  const paginationClassNames = (0, import_react57.useMemo)(
     () => (0, import_classnames30.default)(className),
     [className]
   );
-  const activeListRangeText = (0, import_react59.useMemo)(() => {
+  const activeListRangeText = (0, import_react57.useMemo)(() => {
     if (totalItemsCount === 0) {
       return "No items to display";
     }
     return `Showing ${activeListRange.first}-${activeListRange.last} of ${totalItemsCount}`;
   }, [activeListRange, totalItemsCount]);
-  return /* @__PURE__ */ import_react59.default.createElement(
+  return /* @__PURE__ */ import_react57.default.createElement(
     Box,
     {
       as: "nav",
@@ -4239,7 +4174,7 @@ var Pagination = ({
       justifyContent: "space-between",
       className: paginationClassNames
     },
-    /* @__PURE__ */ import_react59.default.createElement(
+    /* @__PURE__ */ import_react57.default.createElement(
       Box,
       {
         direction: "row",
@@ -4247,7 +4182,7 @@ var Pagination = ({
         flex: { base: "auto", tablet: "none" },
         gap: isCompact ? "xs" : "sm"
       },
-      /* @__PURE__ */ import_react59.default.createElement(
+      /* @__PURE__ */ import_react57.default.createElement(
         Button,
         {
           variant: "secondary",
@@ -4257,8 +4192,8 @@ var Pagination = ({
         },
         prevPageText
       ),
-      arePagesVisible && /* @__PURE__ */ import_react59.default.createElement(Box, { direction: "row", gap: "2xs" }, pages.map(({ pageNumber, isPage }, index) => {
-        return isPage ? /* @__PURE__ */ import_react59.default.createElement(
+      arePagesVisible && /* @__PURE__ */ import_react57.default.createElement(Box, { direction: "row", gap: "2xs" }, pages.map(({ pageNumber, isPage }, index) => {
+        return isPage ? /* @__PURE__ */ import_react57.default.createElement(
           Button,
           {
             key: pageNumber,
@@ -4271,7 +4206,7 @@ var Pagination = ({
             className
           },
           pageNumber
-        ) : /* @__PURE__ */ import_react59.default.createElement(
+        ) : /* @__PURE__ */ import_react57.default.createElement(
           Box,
           {
             key: `ellipsis-${index}`,
@@ -4285,7 +4220,7 @@ var Pagination = ({
           "..."
         );
       })),
-      /* @__PURE__ */ import_react59.default.createElement(
+      /* @__PURE__ */ import_react57.default.createElement(
         Button,
         {
           variant: "secondary",
@@ -4296,7 +4231,7 @@ var Pagination = ({
         nextPageText
       )
     ),
-    /* @__PURE__ */ import_react59.default.createElement(
+    /* @__PURE__ */ import_react57.default.createElement(
       Box,
       {
         as: "p",
@@ -4312,7 +4247,7 @@ var Pagination = ({
 };
 
 // src/components/Popover/Popover.tsx
-var import_react60 = __toESM(require("react"));
+var import_react58 = __toESM(require("react"));
 var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"));
 var import_classnames31 = __toESM(require("classnames"));
 
@@ -4324,8 +4259,8 @@ var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
 var PopoverPortal = PopoverPrimitive.Portal;
-var PopoverContent = (0, import_react60.forwardRef)(({ className, align = "center", sideOffset = 4, ...props }, ref) => {
-  return /* @__PURE__ */ import_react60.default.createElement(
+var PopoverContent = (0, import_react58.forwardRef)(({ className, align = "center", sideOffset = 4, ...props }, ref) => {
+  return /* @__PURE__ */ import_react58.default.createElement(
     PopoverPrimitive.Content,
     {
       ref,
@@ -4339,7 +4274,7 @@ var PopoverContent = (0, import_react60.forwardRef)(({ className, align = "cente
 PopoverContent.displayName = "PopoverContent";
 
 // src/components/RangeInput/RangeInput.tsx
-var import_react61 = __toESM(require("react"));
+var import_react59 = __toESM(require("react"));
 var import_classnames32 = __toESM(require("classnames"));
 
 // src/components/RangeInput/RangeInput.module.scss
@@ -4356,7 +4291,7 @@ var RangeInput = ({
   ...restProps
 }) => {
   const currentProgress = value > 0 ? value / max * 100 : 0;
-  return /* @__PURE__ */ import_react61.default.createElement(
+  return /* @__PURE__ */ import_react59.default.createElement(
     "input",
     {
       ...restProps,
@@ -4381,24 +4316,24 @@ var RangeInput = ({
 };
 
 // src/components/ResponsiveProvider/ResponsiveProvider.tsx
-var import_react63 = __toESM(require("react"));
+var import_react61 = __toESM(require("react"));
 
 // src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts
-var import_react62 = require("react");
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react62.useLayoutEffect : import_react62.useEffect;
+var import_react60 = require("react");
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react60.useLayoutEffect : import_react60.useEffect;
 
 // src/components/ResponsiveProvider/ResponsiveProvider.tsx
-var ResponsiveContext = (0, import_react63.createContext)({
+var ResponsiveContext = (0, import_react61.createContext)({
   isCreated: false
 });
 var ResponsiveProvider = ({
   children = null,
   throttle = 50
 }) => {
-  const [innerWidth, setInnerWidth] = (0, import_react63.useState)(0);
-  const [innerHeight, setInnerHeight] = (0, import_react63.useState)(0);
-  const [outerWidth, setOuterWidth] = (0, import_react63.useState)(0);
-  const [outerHeight, setOuterHeight] = (0, import_react63.useState)(0);
+  const [innerWidth, setInnerWidth] = (0, import_react61.useState)(0);
+  const [innerHeight, setInnerHeight] = (0, import_react61.useState)(0);
+  const [outerWidth, setOuterWidth] = (0, import_react61.useState)(0);
+  const [outerHeight, setOuterHeight] = (0, import_react61.useState)(0);
   const handleWindowResize = () => {
     setInnerWidth(window?.innerWidth ?? 0);
     setInnerHeight(window?.innerHeight ?? 0);
@@ -4420,7 +4355,7 @@ var ResponsiveProvider = ({
       };
     }
   }, [throttle]);
-  return /* @__PURE__ */ import_react63.default.createElement(
+  return /* @__PURE__ */ import_react61.default.createElement(
     ResponsiveContext.Provider,
     {
       value: {
@@ -4436,19 +4371,19 @@ var ResponsiveProvider = ({
 };
 
 // src/components/Sidebar/Sidebar.tsx
-var import_react64 = __toESM(require("react"));
+var import_react62 = __toESM(require("react"));
 var import_react_slot3 = require("@radix-ui/react-slot");
 var import_classnames34 = __toESM(require("classnames"));
 
 // src/hooks/useIsMobile/useIsMobile.tsx
-var React58 = __toESM(require("react"));
+var React56 = __toESM(require("react"));
 var desktopBreakpoint = BREAKPOINTS.find((b) => b.name === "desktop");
 var MOBILE_BREAKPOINT = desktopBreakpoint ? desktopBreakpoint.minWidth : 0;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React58.useState(
+  const [isMobile, setIsMobile] = React56.useState(
     void 0
   );
-  React58.useEffect(() => {
+  React56.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -4464,7 +4399,7 @@ function useIsMobile() {
 var Sidebar_module_default = { "rail": "rail__OwBtB", "group-data-": "group-data-__af4bi" };
 
 // src/components/Tooltip/Tooltip.tsx
-var React59 = __toESM(require("react"));
+var React57 = __toESM(require("react"));
 var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
 
 // src/components/Tooltip/Tooltip.module.scss
@@ -4476,7 +4411,7 @@ var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
 var TooltipPortal = TooltipPrimitive.Portal;
-var TooltipContent = React59.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React59.createElement(
+var TooltipContent = React57.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React57.createElement(
   TooltipPrimitive.Content,
   {
     ref,
@@ -4497,14 +4432,14 @@ var SIDEBAR_RIGHT_WIDTH = "24rem";
 var SIDEBAR_WIDTH_ICON = "44px";
 var SIDEBAR_KEYBOARD_SHORTCUT_LEFT = "[";
 var SIDEBAR_KEYBOARD_SHORTCUT_RIGHT = "]";
-var SidebarIsMobileContext = import_react64.default.createContext(null);
-var SidebarLeftContext = import_react64.default.createContext(
+var SidebarIsMobileContext = import_react62.default.createContext(null);
+var SidebarLeftContext = import_react62.default.createContext(
   null
 );
-var SidebarRightContext = import_react64.default.createContext(
+var SidebarRightContext = import_react62.default.createContext(
   null
 );
-var SidebarSideContext = import_react64.default.createContext("left");
+var SidebarSideContext = import_react62.default.createContext("left");
 var resolveSideValue = (value, side, fallback) => {
   if (typeof value === "boolean") {
     return value;
@@ -4557,21 +4492,21 @@ var useSidebarSideState = ({
   );
   const controlledOpen = resolveControlledOpen(openProp, side);
   const isControlled = typeof controlledOpen === "boolean";
-  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react64.useState)(
+  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react62.useState)(
     controlledOpen ?? initialDefaultOpen
   );
-  const [openMobile, setOpenMobile] = (0, import_react64.useState)(
+  const [openMobile, setOpenMobile] = (0, import_react62.useState)(
     () => isMobile ? false : controlledOpen ?? initialDefaultOpen
   );
   const open = controlledOpen ?? uncontrolledOpen;
-  (0, import_react64.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     if (isMobile) {
       setOpenMobile(false);
     } else {
       setUncontrolledOpen(controlledOpen ?? initialDefaultOpen);
     }
   }, [isMobile, controlledOpen, initialDefaultOpen]);
-  const setOpen = (0, import_react64.useCallback)(
+  const setOpen = (0, import_react62.useCallback)(
     (value) => {
       const newOpenState = typeof value === "function" ? value(open) : value;
       if (newOpenState === open) {
@@ -4586,7 +4521,7 @@ var useSidebarSideState = ({
     },
     [open, isControlled, onOpenChange, side, storageKey]
   );
-  const toggleSidebar = (0, import_react64.useCallback)(() => {
+  const toggleSidebar = (0, import_react62.useCallback)(() => {
     lastToggledSideRef.current = side;
     if (isMobile) {
       setOpenMobile((value) => !value);
@@ -4595,7 +4530,7 @@ var useSidebarSideState = ({
     }
   }, [isMobile, setOpen, side, setOpenMobile, lastToggledSideRef]);
   const state = open ? "expanded" : "collapsed";
-  return (0, import_react64.useMemo)(
+  return (0, import_react62.useMemo)(
     () => ({
       state,
       open,
@@ -4608,13 +4543,13 @@ var useSidebarSideState = ({
   );
 };
 function useSidebar(sideOverride) {
-  const isMobile = import_react64.default.useContext(SidebarIsMobileContext);
+  const isMobile = import_react62.default.useContext(SidebarIsMobileContext);
   if (typeof isMobile !== "boolean") {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
-  const contextSide = import_react64.default.useContext(SidebarSideContext);
+  const contextSide = import_react62.default.useContext(SidebarSideContext);
   const side = sideOverride ?? contextSide;
-  const sideContext = import_react64.default.useContext(
+  const sideContext = import_react62.default.useContext(
     side === "left" ? SidebarLeftContext : SidebarRightContext
   );
   if (!sideContext) {
@@ -4626,7 +4561,7 @@ function useSidebar(sideOverride) {
     side
   };
 }
-var SidebarProvider = (0, import_react64.forwardRef)(
+var SidebarProvider = (0, import_react62.forwardRef)(
   ({
     defaultOpen = true,
     open: openProp,
@@ -4638,9 +4573,9 @@ var SidebarProvider = (0, import_react64.forwardRef)(
     ...props
   }, ref) => {
     const isMobile = useIsMobile();
-    const lastToggledSideRef = import_react64.default.useRef("left");
-    const leftToggleRef = import_react64.default.useRef(null);
-    const rightToggleRef = import_react64.default.useRef(null);
+    const lastToggledSideRef = import_react62.default.useRef("left");
+    const leftToggleRef = import_react62.default.useRef(null);
+    const rightToggleRef = import_react62.default.useRef(null);
     const leftState = useSidebarSideState({
       side: "left",
       isMobile,
@@ -4659,13 +4594,13 @@ var SidebarProvider = (0, import_react64.forwardRef)(
       storageKey,
       lastToggledSideRef
     });
-    (0, import_react64.useEffect)(() => {
+    (0, import_react62.useEffect)(() => {
       leftToggleRef.current = leftState.toggleSidebar;
     }, [leftState.toggleSidebar]);
-    (0, import_react64.useEffect)(() => {
+    (0, import_react62.useEffect)(() => {
       rightToggleRef.current = rightState.toggleSidebar;
     }, [rightState.toggleSidebar]);
-    (0, import_react64.useEffect)(() => {
+    (0, import_react62.useEffect)(() => {
       const handleKeyDown = (event) => {
         const target = event.target;
         if (target && (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT" || target.isContentEditable)) {
@@ -4682,7 +4617,7 @@ var SidebarProvider = (0, import_react64.forwardRef)(
       window.addEventListener("keydown", handleKeyDown);
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, []);
-    return /* @__PURE__ */ import_react64.default.createElement(SidebarIsMobileContext.Provider, { value: isMobile }, /* @__PURE__ */ import_react64.default.createElement(SidebarLeftContext.Provider, { value: leftState }, /* @__PURE__ */ import_react64.default.createElement(SidebarRightContext.Provider, { value: rightState }, /* @__PURE__ */ import_react64.default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ import_react64.default.createElement(
+    return /* @__PURE__ */ import_react62.default.createElement(SidebarIsMobileContext.Provider, { value: isMobile }, /* @__PURE__ */ import_react62.default.createElement(SidebarLeftContext.Provider, { value: leftState }, /* @__PURE__ */ import_react62.default.createElement(SidebarRightContext.Provider, { value: rightState }, /* @__PURE__ */ import_react62.default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ import_react62.default.createElement(
       "div",
       {
         style: {
@@ -4703,23 +4638,23 @@ var SidebarProvider = (0, import_react64.forwardRef)(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = import_react64.default.forwardRef(
+var Sidebar = import_react62.default.forwardRef(
   ({ side = "left", collapsible = "offcanvas", className, children, ...props }, ref) => {
     const { isMobile, state, openMobile, setOpenMobile } = useSidebar(side);
     const sidebarWidth = side === "right" ? SIDEBAR_RIGHT_WIDTH : SIDEBAR_WIDTH;
     if (isMobile) {
-      return /* @__PURE__ */ import_react64.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react64.default.createElement(
+      return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
         Drawer,
         {
           isOpen: openMobile,
           onDismiss: () => setOpenMobile(false),
           placement: side
         },
-        /* @__PURE__ */ import_react64.default.createElement(Box, { "data-sidebar": "sidebar", "data-mobile": "true", height: "100" }, children)
+        /* @__PURE__ */ import_react62.default.createElement(Box, { "data-sidebar": "sidebar", "data-mobile": "true", height: "100" }, children)
       ));
     }
     if (collapsible === "none") {
-      return /* @__PURE__ */ import_react64.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react64.default.createElement(
+      return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
         "div",
         {
           className: (0, import_classnames34.default)(
@@ -4736,7 +4671,7 @@ var Sidebar = import_react64.default.forwardRef(
         children
       ));
     }
-    return /* @__PURE__ */ import_react64.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react64.default.createElement(
+    return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
       Box,
       {
         ref,
@@ -4753,7 +4688,7 @@ var Sidebar = import_react64.default.forwardRef(
         "data-side": side,
         className: "group"
       },
-      /* @__PURE__ */ import_react64.default.createElement(
+      /* @__PURE__ */ import_react62.default.createElement(
         "div",
         {
           style: {
@@ -4768,7 +4703,7 @@ var Sidebar = import_react64.default.forwardRef(
           className: (0, import_classnames34.default)("position-relative", className)
         }
       ),
-      /* @__PURE__ */ import_react64.default.createElement(
+      /* @__PURE__ */ import_react62.default.createElement(
         "div",
         {
           className: (0, import_classnames34.default)(
@@ -4790,7 +4725,7 @@ var Sidebar = import_react64.default.forwardRef(
           },
           ...props
         },
-        /* @__PURE__ */ import_react64.default.createElement(
+        /* @__PURE__ */ import_react62.default.createElement(
           "div",
           {
             "data-sidebar": "sidebar",
@@ -4808,9 +4743,9 @@ var Sidebar = import_react64.default.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = import_react64.default.forwardRef(({ className, onClick, side, iconName = "dock-left", ...props }, ref) => {
+var SidebarTrigger = import_react62.default.forwardRef(({ className, onClick, side, iconName = "dock-left", ...props }, ref) => {
   const { toggleSidebar, side: contextSide } = useSidebar(side);
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     Button,
     {
       ref,
@@ -4835,8 +4770,8 @@ var SidebarTrigger = import_react64.default.forwardRef(({ className, onClick, si
   );
 });
 SidebarTrigger.displayName = "SidebarTrigger";
-var SidebarInset = import_react64.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+var SidebarInset = import_react62.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ import_react62.default.createElement(
     "main",
     {
       ref,
@@ -4849,10 +4784,10 @@ var SidebarInset = import_react64.default.forwardRef(({ className, ...props }, r
   );
 });
 SidebarInset.displayName = "SidebarInset";
-var SidebarHeader = import_react64.default.forwardRef(({ className, ...props }, ref) => {
+var SidebarHeader = import_react62.default.forwardRef(({ className, ...props }, ref) => {
   const { state } = useSidebar();
   const isCollapsed = state === "collapsed";
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       ref,
@@ -4867,8 +4802,8 @@ var SidebarHeader = import_react64.default.forwardRef(({ className, ...props },
   );
 });
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = import_react64.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+var SidebarFooter = import_react62.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       ref,
@@ -4882,8 +4817,8 @@ var SidebarFooter = import_react64.default.forwardRef(({ className, ...props },
   );
 });
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarContent = import_react64.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+var SidebarContent = import_react62.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       ref,
@@ -4898,7 +4833,7 @@ var SidebarContent = import_react64.default.forwardRef(({ className, ...props },
   );
 });
 SidebarContent.displayName = "SidebarContent";
-var SidebarMenu = import_react64.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react64.default.createElement(
+var SidebarMenu = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
   "ul",
   {
     ref,
@@ -4914,7 +4849,7 @@ var SidebarMenu = import_react64.default.forwardRef(({ className, ...props }, re
   }
 ));
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = import_react64.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react64.default.createElement(
+var SidebarMenuItem = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
   "li",
   {
     ref,
@@ -4925,11 +4860,11 @@ var SidebarMenuItem = import_react64.default.forwardRef(({ className, ...props }
   }
 ));
 SidebarMenuItem.displayName = "SidebarMenuItem";
-var SidebarMenuButton = import_react64.default.forwardRef(
+var SidebarMenuButton = import_react62.default.forwardRef(
   ({ asChild = false, isActive = false, tooltip, className, ...props }, ref) => {
     const Comp = asChild ? import_react_slot3.Slot : "button";
     const { isMobile, state, side } = useSidebar();
-    const button = /* @__PURE__ */ import_react64.default.createElement(
+    const button = /* @__PURE__ */ import_react62.default.createElement(
       Comp,
       {
         ref,
@@ -4955,7 +4890,7 @@ var SidebarMenuButton = import_react64.default.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ import_react64.default.createElement(Tooltip, null, /* @__PURE__ */ import_react64.default.createElement(TooltipTrigger, { asChild: true }, button), /* @__PURE__ */ import_react64.default.createElement(
+    return /* @__PURE__ */ import_react62.default.createElement(Tooltip, null, /* @__PURE__ */ import_react62.default.createElement(TooltipTrigger, { asChild: true }, button), /* @__PURE__ */ import_react62.default.createElement(
       TooltipContent,
       {
         side: side === "right" ? "left" : "right",
@@ -4967,8 +4902,8 @@ var SidebarMenuButton = import_react64.default.forwardRef(
   }
 );
 SidebarMenuButton.displayName = "SidebarMenuButton";
-var SidebarGroup = import_react64.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+var SidebarGroup = import_react62.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       ref,
@@ -4982,8 +4917,8 @@ var SidebarGroup = import_react64.default.forwardRef(({ className, ...props }, r
   );
 });
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupLabel = import_react64.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+var SidebarGroupLabel = import_react62.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       ref,
@@ -4997,7 +4932,7 @@ var SidebarGroupLabel = import_react64.default.forwardRef(({ className, ...props
   );
 });
 SidebarGroupLabel.displayName = "SidebarGroupLabel";
-var SidebarMenuSub = import_react64.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react64.default.createElement(
+var SidebarMenuSub = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
   "ul",
   {
     ref,
@@ -5013,11 +4948,11 @@ var SidebarMenuSub = import_react64.default.forwardRef(({ className, ...props },
   }
 ));
 SidebarMenuSub.displayName = "SidebarMenuSub";
-var SidebarMenuSubItem = import_react64.default.forwardRef(({ ...props }, ref) => /* @__PURE__ */ import_react64.default.createElement("li", { ref, ...props }));
+var SidebarMenuSubItem = import_react62.default.forwardRef(({ ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement("li", { ref, ...props }));
 SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
-var SidebarMenuSubButton = import_react64.default.forwardRef(({ asChild = false, isActive, className, ...props }, ref) => {
+var SidebarMenuSubButton = import_react62.default.forwardRef(({ asChild = false, isActive, className, ...props }, ref) => {
   const Comp = asChild ? import_react_slot3.Slot : "a";
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     Comp,
     {
       ref,
@@ -5036,9 +4971,9 @@ var SidebarMenuSubButton = import_react64.default.forwardRef(({ asChild = false,
   );
 });
 SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
-var SidebarMenuAction = import_react64.default.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarMenuAction = import_react62.default.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot3.Slot : "button";
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     Comp,
     {
       ref,
@@ -5056,11 +4991,11 @@ var SidebarMenuAction = import_react64.default.forwardRef(({ className, asChild
   );
 });
 SidebarMenuAction.displayName = "SidebarMenuAction";
-var SidebarRail = import_react64.default.forwardRef(({ className, ...props }, ref) => {
+var SidebarRail = import_react62.default.forwardRef(({ className, ...props }, ref) => {
   const { open, toggleSidebar, side } = useSidebar();
   const shortcutLabel = side === "left" ? SIDEBAR_KEYBOARD_SHORTCUT_LEFT : SIDEBAR_KEYBOARD_SHORTCUT_RIGHT;
   const caretIcon = open ? side === "right" ? "caret-sm-right" : "caret-sm-left" : side === "right" ? "caret-sm-left" : "caret-sm-right";
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     "button",
     {
       ref,
@@ -5088,7 +5023,7 @@ var SidebarRail = import_react64.default.forwardRef(({ className, ...props }, re
       type: "button",
       ...props
     },
-    /* @__PURE__ */ import_react64.default.createElement(
+    /* @__PURE__ */ import_react62.default.createElement(
       Box,
       {
         radius: "xl",
@@ -5111,12 +5046,12 @@ var SidebarRail = import_react64.default.forwardRef(({ className, ...props }, re
           className
         )
       },
-      /* @__PURE__ */ import_react64.default.createElement(Icon, { name: caretIcon })
+      /* @__PURE__ */ import_react62.default.createElement(Icon, { name: caretIcon })
     )
   );
 });
 SidebarRail.displayName = "SidebarRail";
-var SidebarMenuBadge = import_react64.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react64.default.createElement(
+var SidebarMenuBadge = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
   "div",
   {
     ref,
@@ -5135,28 +5070,28 @@ var SidebarMenuBadge = import_react64.default.forwardRef(({ className, ...props
 SidebarMenuBadge.displayName = "SidebarMenuBadge";
 
 // src/components/Table/Table.tsx
-var import_react70 = __toESM(require("react"));
+var import_react68 = __toESM(require("react"));
 var import_classnames40 = __toESM(require("classnames"));
 
 // src/components/Table/Table.module.scss
 var Table_module_default = { "container": "container__zReWp", "loading-mask": "loading-mask__gwG6j", "scroll-container": "scroll-container__79zJk", "table": "table__ojslm", "auto": "auto__bXEGP", "fixed": "fixed__zPdl3", "borderless": "borderless__AlDGM", "scrollable": "scrollable__HSxT1", "scrollable-x": "scrollable-x__aKmx8", "scrollable-y": "scrollable-y__8nNit", "table-bordered": "table-bordered__oTd6P", "full-height": "full-height__YPJfE" };
 
 // src/components/Table/TableBody/TableBody.tsx
-var import_react68 = __toESM(require("react"));
+var import_react66 = __toESM(require("react"));
 var import_classnames38 = __toESM(require("classnames"));
 
 // src/components/Table/TableBody/TableBody.module.scss
 var TableBody_module_default = { "table-body": "table-body__cX0OQ", "striped": "striped__1Epqn", "hover": "hover__I3QF4" };
 
 // src/components/Table/common/TableRow/TableRow.tsx
-var import_react67 = __toESM(require("react"));
+var import_react65 = __toESM(require("react"));
 var import_classnames37 = __toESM(require("classnames"));
 
 // src/components/Table/common/TableRow/TableRow.module.scss
 var TableRow_module_default = { "table-row": "table-row__BdHbx", "hoverable": "hoverable__Bdemq" };
 
 // src/components/Table/TableBody/TableBodyCell/TableBodyCell.tsx
-var import_react65 = __toESM(require("react"));
+var import_react63 = __toESM(require("react"));
 var import_classnames35 = __toESM(require("classnames"));
 
 // src/components/Table/TableBody/TableBodyCell/TableBodyCell.module.scss
@@ -5189,7 +5124,7 @@ var TableBodyCell = ({
     },
     className
   );
-  return /* @__PURE__ */ import_react65.default.createElement(
+  return /* @__PURE__ */ import_react63.default.createElement(
     Box,
     {
       as: columnIsSticky ? "th" : "td",
@@ -5207,7 +5142,7 @@ var TableBodyCell = ({
 var TableBodyCell_default = TableBodyCell;
 
 // src/components/Table/TableHead/TableHeaderCell/TableHeaderCell.tsx
-var import_react66 = __toESM(require("react"));
+var import_react64 = __toESM(require("react"));
 var import_classnames36 = __toESM(require("classnames"));
 
 // src/components/Table/TableHead/TableHeaderCell/TableHeaderCell.module.scss
@@ -5234,7 +5169,7 @@ var TableHeaderCell = ({
   const renderIcon = () => {
     const renderArrows = () => {
       if (getSortDirection() === "ascending") {
-        return /* @__PURE__ */ import_react66.default.createElement(
+        return /* @__PURE__ */ import_react64.default.createElement(
           Icon,
           {
             name: "caret-sm-up",
@@ -5243,7 +5178,7 @@ var TableHeaderCell = ({
         );
       }
       if (getSortDirection() === "descending") {
-        return /* @__PURE__ */ import_react66.default.createElement(
+        return /* @__PURE__ */ import_react64.default.createElement(
           Icon,
           {
             name: "caret-sm-down",
@@ -5251,7 +5186,7 @@ var TableHeaderCell = ({
           }
         );
       }
-      return /* @__PURE__ */ import_react66.default.createElement(
+      return /* @__PURE__ */ import_react64.default.createElement(
         Box,
         {
           display: "inline-block",
@@ -5262,7 +5197,7 @@ var TableHeaderCell = ({
         }
       );
     };
-    return /* @__PURE__ */ import_react66.default.createElement("span", { className: TableHeaderCell_module_default["sort-icon"] }, renderArrows());
+    return /* @__PURE__ */ import_react64.default.createElement("span", { className: TableHeaderCell_module_default["sort-icon"] }, renderArrows());
   };
   const handleKeyPress = (event) => {
     if (!onSort || !isSortable) return;
@@ -5294,7 +5229,7 @@ var TableHeaderCell = ({
     },
     className
   );
-  return /* @__PURE__ */ import_react66.default.createElement(
+  return /* @__PURE__ */ import_react64.default.createElement(
     Box,
     {
       as: "th",
@@ -5307,7 +5242,7 @@ var TableHeaderCell = ({
       onKeyDown: handleKeyPress,
       scope: "col"
     },
-    /* @__PURE__ */ import_react66.default.createElement("div", { className: TableHeaderCell_module_default.heading }, column.heading, isSortable && renderIcon())
+    /* @__PURE__ */ import_react64.default.createElement("div", { className: TableHeaderCell_module_default.heading }, column.heading, isSortable && renderIcon())
   );
 };
 
@@ -5349,8 +5284,8 @@ var TableRow = ({
     }
     return void 0;
   };
-  return /* @__PURE__ */ import_react67.default.createElement("tr", { className: tableRowClasses }, Object.values(columns).map(
-    (column, columnIndex) => isTableHead ? /* @__PURE__ */ import_react67.default.createElement(
+  return /* @__PURE__ */ import_react65.default.createElement("tr", { className: tableRowClasses }, Object.values(columns).map(
+    (column, columnIndex) => isTableHead ? /* @__PURE__ */ import_react65.default.createElement(
       TableHeaderCell,
       {
         column,
@@ -5368,7 +5303,7 @@ var TableRow = ({
         hasStickyHeader,
         sticky: column.sticky
       }
-    ) : /* @__PURE__ */ import_react67.default.createElement(
+    ) : /* @__PURE__ */ import_react65.default.createElement(
       TableBodyCell_default,
       {
         align: column.align || align,
@@ -5407,7 +5342,7 @@ var TableBody = ({
     },
     className
   );
-  return /* @__PURE__ */ import_react68.default.createElement("tbody", { className: tableBodyClasses }, rows.map((row, rowIndex) => /* @__PURE__ */ import_react68.default.createElement(
+  return /* @__PURE__ */ import_react66.default.createElement("tbody", { className: tableBodyClasses }, rows.map((row, rowIndex) => /* @__PURE__ */ import_react66.default.createElement(
     TableRow,
     {
       columns,
@@ -5424,7 +5359,7 @@ var TableBody = ({
 };
 
 // src/components/Table/TableHead/TableHead.tsx
-var import_react69 = __toESM(require("react"));
+var import_react67 = __toESM(require("react"));
 var import_classnames39 = __toESM(require("classnames"));
 var TableHead = ({
   columns,
@@ -5438,7 +5373,7 @@ var TableHead = ({
   truncateOverflow = false
 }) => {
   const tableHeadClasses = (0, import_classnames39.default)(className);
-  return /* @__PURE__ */ import_react69.default.createElement("thead", { className: tableHeadClasses }, /* @__PURE__ */ import_react69.default.createElement(
+  return /* @__PURE__ */ import_react67.default.createElement("thead", { className: tableHeadClasses }, /* @__PURE__ */ import_react67.default.createElement(
     TableRow,
     {
       columns,
@@ -5492,13 +5427,13 @@ var Table = ({
     [Table_module_default.borderless]: isBorderless,
     [Table_module_default.compact]: isCompact
   });
-  return /* @__PURE__ */ import_react70.default.createElement("div", { className: containerClasses }, isLoading && /* @__PURE__ */ import_react70.default.createElement("div", { className: Table_module_default["loading-mask"] }, /* @__PURE__ */ import_react70.default.createElement(Spinner, { size: "xl" })), /* @__PURE__ */ import_react70.default.createElement(
+  return /* @__PURE__ */ import_react68.default.createElement("div", { className: containerClasses }, isLoading && /* @__PURE__ */ import_react68.default.createElement("div", { className: Table_module_default["loading-mask"] }, /* @__PURE__ */ import_react68.default.createElement(Spinner, { size: "xl" })), /* @__PURE__ */ import_react68.default.createElement(
     "div",
     {
       className: scrollContainerClasses,
       "data-testid": "tableContainerDiv-testid"
     },
-    /* @__PURE__ */ import_react70.default.createElement("table", { className: tableClasses }, /* @__PURE__ */ import_react70.default.createElement(
+    /* @__PURE__ */ import_react68.default.createElement("table", { className: tableClasses }, /* @__PURE__ */ import_react68.default.createElement(
       TableHead,
       {
         columns,
@@ -5510,7 +5445,7 @@ var Table = ({
         truncateOverflow,
         hasStickyHeader
       }
-    ), /* @__PURE__ */ import_react70.default.createElement(
+    ), /* @__PURE__ */ import_react68.default.createElement(
       TableBody,
       {
         rows,
@@ -5529,22 +5464,22 @@ var Table = ({
 };
 
 // src/components/ThemeProvider/ThemeProvider.tsx
-var import_react71 = __toESM(require("react"));
+var import_react69 = __toESM(require("react"));
 var initialState = {
   theme: "system",
   setTheme: () => null
 };
-var ThemeProviderContext = (0, import_react71.createContext)(initialState);
+var ThemeProviderContext = (0, import_react69.createContext)(initialState);
 function ThemeProvider({
   children,
   defaultTheme = "system",
   storageKey = "hyphen-ui-theme",
   ...props
 }) {
-  const [theme, setTheme] = (0, import_react71.useState)(
+  const [theme, setTheme] = (0, import_react69.useState)(
     () => localStorage.getItem(storageKey) || defaultTheme
   );
-  (0, import_react71.useEffect)(() => {
+  (0, import_react69.useEffect)(() => {
     const root = window.document.documentElement;
     root.classList.remove("light", "dark");
     if (theme === "system") {
@@ -5563,14 +5498,14 @@ function ThemeProvider({
     },
     isDarkMode
   };
-  return /* @__PURE__ */ import_react71.default.createElement(ThemeProviderContext.Provider, { ...props, value }, children);
+  return /* @__PURE__ */ import_react69.default.createElement(ThemeProviderContext.Provider, { ...props, value }, children);
 }
 
 // src/components/Toast/ToastContainer.tsx
-var import_react75 = __toESM(require("react"));
+var import_react73 = __toESM(require("react"));
 
 // src/components/Toast/ToastNotification.tsx
-var import_react72 = __toESM(require("react"));
+var import_react70 = __toESM(require("react"));
 var import_classnames41 = __toESM(require("classnames"));
 
 // src/components/Toast/ToastNotification.module.scss
@@ -5603,12 +5538,12 @@ var renderToastIcon = (toast2) => {
     iconName = "c-warning";
     iconColor = "white";
   }
-  const icon = type !== "loading" ? /* @__PURE__ */ import_react72.default.createElement(Icon, { name: iconName, color: iconColor }) : /* @__PURE__ */ import_react72.default.createElement(Spinner, null);
-  return /* @__PURE__ */ import_react72.default.createElement(Box, { justifyContent: "center", height: "100" }, icon);
+  const icon = type !== "loading" ? /* @__PURE__ */ import_react70.default.createElement(Icon, { name: iconName, color: iconColor }) : /* @__PURE__ */ import_react70.default.createElement(Spinner, null);
+  return /* @__PURE__ */ import_react70.default.createElement(Box, { justifyContent: "center", height: "100" }, icon);
 };
 var renderDismissIcon = (toast2, onDismiss) => {
   if (!toast2.canDismiss) return;
-  return /* @__PURE__ */ import_react72.default.createElement(
+  return /* @__PURE__ */ import_react70.default.createElement(
     Box,
     {
       as: "button",
@@ -5623,12 +5558,12 @@ var renderDismissIcon = (toast2, onDismiss) => {
       onClick: onDismiss,
       "aria-label": "dismiss notification"
     },
-    /* @__PURE__ */ import_react72.default.createElement(Icon, { name: "remove" })
+    /* @__PURE__ */ import_react70.default.createElement(Icon, { name: "remove" })
   );
 };
-var ToastNotification = import_react72.default.memo(
+var ToastNotification = import_react70.default.memo(
   ({ toast: toast2, position = "top-center", style, children, onDismiss }) => {
-    const message = /* @__PURE__ */ import_react72.default.createElement(
+    const message = /* @__PURE__ */ import_react70.default.createElement(
       Box,
       {
         direction: "row",
@@ -5650,7 +5585,7 @@ var ToastNotification = import_react72.default.memo(
         [ToastNotification_module_default["toast-error"]]: toast2.type === "error"
       }
     );
-    return /* @__PURE__ */ import_react72.default.createElement(
+    return /* @__PURE__ */ import_react70.default.createElement(
       Box,
       {
         alignItems: "center",
@@ -5667,16 +5602,16 @@ var ToastNotification = import_react72.default.memo(
       },
       typeof children === "function" ? children({
         message
-      }) : /* @__PURE__ */ import_react72.default.createElement(import_react72.default.Fragment, null, renderToastIcon(toast2), message, renderDismissIcon(toast2, onDismiss))
+      }) : /* @__PURE__ */ import_react70.default.createElement(import_react70.default.Fragment, null, renderToastIcon(toast2), message, renderDismissIcon(toast2, onDismiss))
     );
   }
 );
 
 // src/components/Toast/useToasts.ts
-var import_react74 = require("react");
+var import_react72 = require("react");
 
 // src/components/Toast/Toast.store.ts
-var import_react73 = require("react");
+var import_react71 = require("react");
 var TOAST_LIMIT = 20;
 var toastTimeouts = /* @__PURE__ */ new Map();
 var addToDismissedQueue = (toastId) => {
@@ -5812,8 +5747,8 @@ var defaultTimeouts = {
   custom: 4e3
 };
 var useToastStore = (toastOptions = {}) => {
-  const [state, setState] = (0, import_react73.useState)(memoryState);
-  (0, import_react73.useEffect)(() => {
+  const [state, setState] = (0, import_react71.useState)(memoryState);
+  (0, import_react71.useEffect)(() => {
     listeners.push(setState);
     return () => {
       const index = listeners.indexOf(setState);
@@ -5900,7 +5835,7 @@ toast.async = function(promise, messages, opts) {
 // src/components/Toast/useToasts.ts
 var useToasts = (toastOptions) => {
   const { toasts, pausedAt } = useToastStore(toastOptions);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react72.useEffect)(() => {
     if (pausedAt) {
       return;
     }
@@ -5922,7 +5857,7 @@ var useToasts = (toastOptions) => {
       timeouts.forEach((timeout) => timeout && clearTimeout(timeout));
     };
   }, [toasts, pausedAt]);
-  const handlers = (0, import_react74.useMemo)(
+  const handlers = (0, import_react72.useMemo)(
     () => ({
       startPause: () => {
         dispatch({
@@ -6004,7 +5939,7 @@ var renderNotification = (currentToast, children, containerPosition) => {
   if (children) {
     return children(currentToast);
   }
-  return /* @__PURE__ */ import_react75.default.createElement(
+  return /* @__PURE__ */ import_react73.default.createElement(
     ToastNotification,
     {
       toast: currentToast,
@@ -6024,7 +5959,7 @@ var ToastContainer = ({
   ...restProps
 }) => {
   const { toasts, handlers } = useToasts(toastOptions);
-  return /* @__PURE__ */ import_react75.default.createElement(
+  return /* @__PURE__ */ import_react73.default.createElement(
     Box,
     {
       style: {
@@ -6054,7 +5989,7 @@ var ToastContainer = ({
       const ref = t.height ? void 0 : createRectRef((rect) => {
         handlers.updateHeight(t.id, rect.height);
       });
-      return /* @__PURE__ */ import_react75.default.createElement(
+      return /* @__PURE__ */ import_react73.default.createElement(
         Box,
         {
           ref,
@@ -6072,7 +6007,7 @@ var ToastContainer = ({
 };
 
 // src/components/Toggle/Toggle.tsx
-var import_react76 = __toESM(require("react"));
+var import_react74 = __toESM(require("react"));
 var TogglePrimitive = __toESM(require("@radix-ui/react-toggle"));
 
 // src/components/Toggle/Toggle.module.scss
@@ -6080,7 +6015,7 @@ var Toggle_module_default = { "item": "item__PrPsJ", "outline": "outline__Lkabh"
 
 // src/components/Toggle/Toggle.tsx
 var import_classnames42 = __toESM(require("classnames"));
-var Toggle = (0, import_react76.forwardRef)(({ className, variant = "default", children, ...props }, ref) => /* @__PURE__ */ import_react76.default.createElement(
+var Toggle = (0, import_react74.forwardRef)(({ className, variant = "default", children, ...props }, ref) => /* @__PURE__ */ import_react74.default.createElement(
   TogglePrimitive.Root,
   {
     ref,
@@ -6097,12 +6032,12 @@ var Toggle = (0, import_react76.forwardRef)(({ className, variant = "default", c
 Toggle.displayName = "Toggle";
 
 // src/hooks/useBreakpoint/useBreakpoint.ts
-var import_react78 = require("react");
+var import_react76 = require("react");
 
 // src/hooks/useWindowSize/useWindowSize.ts
-var import_react77 = __toESM(require("react"));
+var import_react75 = __toESM(require("react"));
 var useWindowSize = () => {
-  const { innerWidth, innerHeight, outerHeight, outerWidth, isCreated } = import_react77.default.useContext(ResponsiveContext);
+  const { innerWidth, innerHeight, outerHeight, outerWidth, isCreated } = import_react75.default.useContext(ResponsiveContext);
   if (isCreated) {
     return {
       innerHeight,
@@ -6118,7 +6053,7 @@ var useWindowSize = () => {
 var defaultBreakpoint = { name: "base", minWidth: 0 };
 var useBreakpoint = () => {
   const windowSize = useWindowSize();
-  const [breakpoint, setBreakpoint] = (0, import_react78.useState)({
+  const [breakpoint, setBreakpoint] = (0, import_react76.useState)({
     ...defaultBreakpoint
   });
   useIsomorphicLayoutEffect(() => {
@@ -6145,7 +6080,7 @@ var useBreakpoint = () => {
 };
 
 // src/hooks/useOpenClose/useOpenClose.tsx
-var import_react79 = require("react");
+var import_react77 = require("react");
 var useOpenClose = (props = {}) => {
   const {
     defaultIsOpen,
@@ -6153,28 +6088,28 @@ var useOpenClose = (props = {}) => {
     onClose: onCloseProp,
     onOpen: onOpenProp
   } = props;
-  const openCallback = (0, import_react79.useCallback)(() => {
+  const openCallback = (0, import_react77.useCallback)(() => {
     onOpenProp?.();
   }, [onOpenProp]);
-  const closeCallback = (0, import_react79.useCallback)(() => {
+  const closeCallback = (0, import_react77.useCallback)(() => {
     onCloseProp?.();
   }, [onCloseProp]);
-  const [isOpenState, setIsOpen] = (0, import_react79.useState)(defaultIsOpen || false);
+  const [isOpenState, setIsOpen] = (0, import_react77.useState)(defaultIsOpen || false);
   const isOpen = isOpenProp !== void 0 ? isOpenProp : isOpenState;
   const isControlled = isOpenProp !== void 0;
-  const handleClose = (0, import_react79.useCallback)(() => {
+  const handleClose = (0, import_react77.useCallback)(() => {
     if (!isControlled) {
       setIsOpen(false);
     }
     closeCallback?.();
   }, [isControlled, closeCallback]);
-  const handleOpen = (0, import_react79.useCallback)(() => {
+  const handleOpen = (0, import_react77.useCallback)(() => {
     if (!isControlled) {
       setIsOpen(true);
     }
     openCallback?.();
   }, [isControlled, openCallback]);
-  const handleToggle = (0, import_react79.useCallback)(() => {
+  const handleToggle = (0, import_react77.useCallback)(() => {
     if (isOpen) {
       handleClose();
     } else {
@@ -6190,9 +6125,9 @@ var useOpenClose = (props = {}) => {
 };
 
 // src/hooks/useTheme/useTheme.ts
-var import_react80 = __toESM(require("react"));
+var import_react78 = __toESM(require("react"));
 var useTheme = () => {
-  const context = import_react80.default.useContext(ThemeProviderContext);
+  const context = import_react78.default.useContext(ThemeProviderContext);
   if (context === void 0)
     throw new Error(
       "useTheme must be used within a ThemeProvider. Be sure your App is wrapped in ThemeProvider."
@@ -6263,7 +6198,6 @@ var useTheme = () => {
   FormikTextareaInput,
   FormikTextareaInputInset,
   FormikTimePicker,
-  FormikTimePickerNative,
   FormikToggleGroup,
   FormikToggleGroupMulti,
   HEADING_SIZE_OPTIONS,
@@ -6316,7 +6250,6 @@ var useTheme = () => {
   ThemeProvider,
   ThemeProviderContext,
   TimePicker,
-  TimePickerNative,
   ToastContainer,
   Toggle,
   ToggleGroup,