@uniformdev/design-system 19.145.0 → 19.146.1-alpha.3

package/dist/esm/index.js

@@ -99,6 +99,16 @@ var Theme = ({ disableReset = false, disableGlobalReset = false }) => {
           --typography-inactive: var(--gray-300);
           --typography-inverted: var(--white);
 
+          /* chart colours */
+          --charting-chart-1: #ffa600;
+          --charting-chart-2: #c444b2;
+          --charting-chart-3: #ff5368;
+          --charting-chart-4: #f53d90;
+          --charting-chart-5: #ff7b3d;
+
+          /* utility colours */
+          --utility-success: #4ade80;
+          --utility-danger: #f87171;
 
           /* off brand */
           --input-border: rgba(31, 43, 52, 0.5);
@@ -2540,6 +2550,31 @@ var filterAdd = GenIcon({
     }
   ]
 });
+var refreshIcon = GenIcon({
+  tag: "svg",
+  attr: {
+    role: "img",
+    viewBox: "0 0 12 12"
+  },
+  child: [
+    {
+      tag: "path",
+      attr: {
+        d: "M8.27759 6C8.30628 6.15156 8.32129 6.30795 8.32129 6.46785C8.32129 7.84856 7.202 8.96785 5.82129 8.96785C5.27787 8.96785 4.77494 8.79447 4.36482 8.5H5.66057V7.5H2.66057V10.5H3.66057V9.22145C4.25557 9.689 5.00587 9.96785 5.82129 9.96785C7.75429 9.96785 9.32129 8.40085 9.32129 6.46785C9.32129 6.30921 9.31074 6.15304 9.29029 6H8.27759Z",
+        fill: "currentColor"
+      },
+      child: []
+    },
+    {
+      tag: "path",
+      attr: {
+        d: "M8.16064 2H9.16064V5H6.16064V4L7.4564 4C7.04627 3.70553 6.54334 3.53215 5.99992 3.53215C4.61921 3.53215 3.49992 4.65144 3.49992 6.03215C3.49992 6.19205 3.51493 6.34844 3.54363 6.5H2.53092C2.51048 6.34696 2.49992 6.19079 2.49992 6.03215C2.49992 4.09915 4.06693 2.53215 5.99992 2.53215C6.81535 2.53215 7.56564 2.811 8.16064 3.27855V2Z",
+        fill: "currentColor"
+      },
+      child: []
+    }
+  ]
+});
 var clipboardCopy = GenIcon({
   tag: "svg",
   attr: { viewBox: "0 0 24 24", role: "img" },
@@ -2685,7 +2720,8 @@ var customIcons = {
   "list-view-long": listViewLong,
   "filter-add": filterAdd,
   "clipboard-copy": clipboardCopy,
-  "clipboard-paste": clipboardPaste
+  "clipboard-paste": clipboardPaste,
+  refresh: refreshIcon
 };
 
 // src/components/Icons/systemIcons.tsx
@@ -12578,6 +12614,18 @@ function renderWithIcon(children, icon) {
   ] });
 }
 
+// src/components/Menu/MenuTrigger.tsx
+import { forwardRef as forwardRef5 } from "react";
+import { jsx as jsx34 } from "@emotion/react/jsx-runtime";
+var MenuButton2 = forwardRef5(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34("button", { ref, type: "button", ...props, children });
+});
+var MenuThreeDots = forwardRef5(
+  ({ buttonTitle = "More options", ...props }, ref) => {
+    return /* @__PURE__ */ jsx34(MenuButton2, { ref, "aria-label": buttonTitle, ...props, children: /* @__PURE__ */ jsx34(Icon, { icon: "more-alt", iconColor: "currentColor" }) });
+  }
+);
+
 // src/components/ButtonWithMenu/ButtonWithMenu.styles.ts
 import { css as css32 } from "@emotion/react";
 var buttonSizeBase = css32`
@@ -12736,7 +12784,7 @@ var wholeButtonWithMenuIconOffset = css32`
 `;
 
 // src/components/ButtonWithMenu/ButtonWithMenu.tsx
-import { Fragment as Fragment5, jsx as jsx34, jsxs as jsxs20 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx35, jsxs as jsxs20 } from "@emotion/react/jsx-runtime";
 var ButtonWithMenu = ({
   onButtonClick,
   buttonType = "secondary",
@@ -12770,12 +12818,12 @@ var ButtonWithMenu = ({
     sm: buttonSizeSmall,
     lg: buttonSizeLarge
   };
-  const clickableButton = /* @__PURE__ */ jsx34("div", { css: ButtonWithMenuIcon, "data-testid": "multioptions-button-call-menu", children: /* @__PURE__ */ jsx34(Icon, { icon: CgChevronDown, iconColor: "currentColor" }) });
-  const dropdownButton = /* @__PURE__ */ jsx34("div", { css: ButtonWithMenuIcon, "data-testid": "multioptions-button-call-menu", children: /* @__PURE__ */ jsxs20(HorizontalRhythm, { justify: "center", children: [
-    /* @__PURE__ */ jsx34(Icon, { icon: CgMathPlus2, iconColor: "currentColor", css: wholeButtonWithMenuIconOffset }),
-    /* @__PURE__ */ jsx34("span", { css: { marginRight: "var(--spacing-xs)", fontSize: "var(--fs-sm)" }, children: buttonText })
+  const clickableButton = /* @__PURE__ */ jsx35("div", { css: ButtonWithMenuIcon, "data-testid": "multioptions-button-call-menu", children: /* @__PURE__ */ jsx35(Icon, { icon: CgChevronDown, iconColor: "currentColor" }) });
+  const dropdownButton = /* @__PURE__ */ jsx35("div", { css: ButtonWithMenuIcon, "data-testid": "multioptions-button-call-menu", children: /* @__PURE__ */ jsxs20(HorizontalRhythm, { justify: "center", children: [
+    /* @__PURE__ */ jsx35(Icon, { icon: CgMathPlus2, iconColor: "currentColor", css: wholeButtonWithMenuIconOffset }),
+    /* @__PURE__ */ jsx35("span", { css: { marginRight: "var(--spacing-xs)", fontSize: "var(--fs-sm)" }, children: buttonText })
   ] }) });
-  return /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsx35(
     "div",
     {
       css: [
@@ -12795,12 +12843,12 @@ var ButtonWithMenu = ({
             "data-testid": "multioptions-button-main",
             ...buttonProps,
             children: [
-              icon ? /* @__PURE__ */ jsx34(Icon, { icon, iconColor: "currentColor", css: buttonWithMenuIconOffset }) : null,
+              icon ? /* @__PURE__ */ jsx35(Icon, { icon, iconColor: "currentColor", css: buttonWithMenuIconOffset }) : null,
               buttonText
             ]
           }
         ),
-        disabled2 ? clickableButton : /* @__PURE__ */ jsx34(
+        disabled2 ? clickableButton : /* @__PURE__ */ jsx35(
           Menu,
           {
             menuLabel: "buttonMenu",
@@ -12811,7 +12859,7 @@ var ButtonWithMenu = ({
             children
           }
         )
-      ] }) : /* @__PURE__ */ jsx34(Fragment5, { children: disabled2 ? dropdownButton : /* @__PURE__ */ jsx34(
+      ] }) : /* @__PURE__ */ jsx35(Fragment5, { children: disabled2 ? dropdownButton : /* @__PURE__ */ jsx35(
         Menu,
         {
           menuLabel: "buttonMenu",
@@ -12910,7 +12958,7 @@ var actions = css33`
 `;
 
 // src/components/Calendar/Calendar.tsx
-import { jsx as jsx35, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs21 } from "@emotion/react/jsx-runtime";
 function tryParseDate(isoDate) {
   try {
     return isoDate ? parseDate(isoDate) : void 0;
@@ -12962,25 +13010,25 @@ var Calendar = ({
         isInvalid,
         children: [
           /* @__PURE__ */ jsxs21("header", { css: header, children: [
-            /* @__PURE__ */ jsx35(Heading2, { css: [h6, headerTitle] }),
-            /* @__PURE__ */ jsx35(
+            /* @__PURE__ */ jsx36(Heading2, { css: [h6, headerTitle] }),
+            /* @__PURE__ */ jsx36(
               AriaButton,
               {
                 css: [button, buttonTertiaryOutline, headerNavButton],
                 slot: "previous",
-                children: /* @__PURE__ */ jsx35(Icon, { icon: "arrow-up", size: 16, color: "currentColor" })
+                children: /* @__PURE__ */ jsx36(Icon, { icon: "arrow-up", size: 16, color: "currentColor" })
               }
             ),
-            /* @__PURE__ */ jsx35(
+            /* @__PURE__ */ jsx36(
               AriaButton,
               {
                 css: [button, buttonTertiaryOutline, headerNavButton],
                 slot: "next",
-                children: /* @__PURE__ */ jsx35(Icon, { icon: "arrow-down", size: 16, color: "currentColor" })
+                children: /* @__PURE__ */ jsx36(Icon, { icon: "arrow-down", size: 16, color: "currentColor" })
               }
             )
           ] }),
-          /* @__PURE__ */ jsx35(CalendarGrid, { children: (date) => /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36(CalendarGrid, { children: (date) => /* @__PURE__ */ jsx36(
             CalendarCell,
             {
               css: [
@@ -12995,7 +13043,7 @@ var Calendar = ({
         ]
       }
     ),
-    /* @__PURE__ */ jsx35("div", { css: actions, children: /* @__PURE__ */ jsx35(Button, { onClick: gotoToday, buttonType: "ghost", children: "Today" }) })
+    /* @__PURE__ */ jsx36("div", { css: actions, children: /* @__PURE__ */ jsx36(Button, { onClick: gotoToday, buttonType: "ghost", children: "Today" }) })
   ] });
 };
 
@@ -13046,7 +13094,7 @@ var CardMenu = css34`
 `;
 
 // src/components/Card/Card.tsx
-import { jsx as jsx36, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
 var Card = ({
   title: title2,
   menuItems,
@@ -13058,12 +13106,12 @@ var Card = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxs22(Tag, { css: CardContainer, ...props, children: [
-    title2 ? /* @__PURE__ */ jsx36(CardTitle2, { title: title2, titleWithMarginBottom }) : null,
-    menuItems ? /* @__PURE__ */ jsx36(
+    title2 ? /* @__PURE__ */ jsx37(CardTitle2, { title: title2, titleWithMarginBottom }) : null,
+    menuItems ? /* @__PURE__ */ jsx37(
       Menu,
       {
         menuLabel: "More options",
-        menuTrigger: /* @__PURE__ */ jsx36(
+        menuTrigger: /* @__PURE__ */ jsx37(
           "button",
           {
             "aria-label": "More options",
@@ -13071,7 +13119,7 @@ var Card = ({
             disabled: disabled2,
             css: CardMenu,
             "data-testid": menuButtonTestId != null ? menuButtonTestId : "button-more",
-            children: /* @__PURE__ */ jsx36(Icon, { icon: CgMoreAlt, iconColor: "currentColor", size: 32 })
+            children: /* @__PURE__ */ jsx37(Icon, { icon: CgMoreAlt, iconColor: "currentColor", size: 32 })
           }
         ),
         children: menuItems
@@ -13108,7 +13156,7 @@ var CardContainerInner = ({ padding, withLastColumn }) => css35`
 `;
 
 // src/components/Card/CardContainer.tsx
-import { jsx as jsx37 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx38 } from "@emotion/react/jsx-runtime";
 var CardContainer2 = ({
   bgColor = "white",
   padding = true,
@@ -13116,7 +13164,7 @@ var CardContainer2 = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx37("div", { css: CardContainerWrapper(bgColor), ...props, children: /* @__PURE__ */ jsx37("div", { css: CardContainerInner({ padding, withLastColumn }), children }) });
+  return /* @__PURE__ */ jsx38("div", { css: CardContainerWrapper(bgColor), ...props, children: /* @__PURE__ */ jsx38("div", { css: CardContainerInner({ padding, withLastColumn }), children }) });
 };
 
 // src/components/Card/LoadingCardSkeleton.tsx
@@ -13154,12 +13202,12 @@ var LoadingMenuIcon = css36`
 `;
 
 // src/components/Card/LoadingCardSkeleton.tsx
-import { jsx as jsx38, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
 var LoadingCardSkeleton2 = () => {
   return /* @__PURE__ */ jsxs23(VerticalRhythm, { css: LoadingCardSkeleton, children: [
-    /* @__PURE__ */ jsx38("span", { css: [LoadingText, LoadingTitle] }),
-    /* @__PURE__ */ jsx38("span", { css: [LoadingText, LoadingTimeStamp] }),
-    /* @__PURE__ */ jsx38(Icon, { css: LoadingMenuIcon, icon: CgMoreAlt2, iconColor: "currentColor", size: 32 })
+    /* @__PURE__ */ jsx39("span", { css: [LoadingText, LoadingTitle] }),
+    /* @__PURE__ */ jsx39("span", { css: [LoadingText, LoadingTimeStamp] }),
+    /* @__PURE__ */ jsx39(Icon, { css: LoadingMenuIcon, icon: CgMoreAlt2, iconColor: "currentColor", size: 32 })
   ] });
 };
 
@@ -13358,7 +13406,7 @@ var ChipActionButton = css37`
 `;
 
 // src/components/Chip/Chip.tsx
-import { Fragment as Fragment6, jsx as jsx39, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx40, jsxs as jsxs24 } from "@emotion/react/jsx-runtime";
 var chipTheme = {
   "accent-light": ChipThemeAccentLight,
   "accent-dark": ChipThemeAccentDark,
@@ -13382,15 +13430,15 @@ var Chip = ({
   };
   return /* @__PURE__ */ jsxs24("span", { css: [ChipContainer, chipSize[size], chipTheme[theme]], ...props, children: [
     icon ? /* @__PURE__ */ jsxs24(Fragment6, { children: [
-      /* @__PURE__ */ jsx39("span", { role: "presentation", css: [ChipIcon], children: /* @__PURE__ */ jsx39(Icon, { icon, iconColor: "currentColor", size: "1rem" }) }),
-      /* @__PURE__ */ jsx39("span", { role: "separator", css: ChipSeparator })
+      /* @__PURE__ */ jsx40("span", { role: "presentation", css: [ChipIcon], children: /* @__PURE__ */ jsx40(Icon, { icon, iconColor: "currentColor", size: "1rem" }) }),
+      /* @__PURE__ */ jsx40("span", { role: "separator", css: ChipSeparator })
     ] }) : null,
-    /* @__PURE__ */ jsx39("span", { css: ChipText, children: text }),
+    /* @__PURE__ */ jsx40("span", { css: ChipText, children: text }),
     chipAction
   ] });
 };
 var DismissibleChipAction = ({ onDismiss, ...props }) => {
-  return /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx40(
     "button",
     {
       css: ChipActionButton,
@@ -13398,7 +13446,7 @@ var DismissibleChipAction = ({ onDismiss, ...props }) => {
       "aria-labelledby": "dismissible-chip",
       onClick: onDismiss,
       ...props,
-      children: /* @__PURE__ */ jsx39(Icon, { icon: CgClose3, iconColor: "currentColor", size: "0.85rem" })
+      children: /* @__PURE__ */ jsx40(Icon, { icon: CgClose3, iconColor: "currentColor", size: "0.85rem" })
     }
   );
 };
@@ -13478,7 +13526,7 @@ var MultilineChipContainer = css38`
 `;
 
 // src/components/Chip/MultilineChip.tsx
-import { jsx as jsx40 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx41 } from "@emotion/react/jsx-runtime";
 var MultilineChip = ({ children, onClick, ...props }) => {
   const handleKeyboardEvent = (e) => {
     if (e.key === "Enter" || e.key === " ") {
@@ -13492,7 +13540,7 @@ var MultilineChip = ({ children, onClick, ...props }) => {
     onKeyDown: handleKeyboardEvent,
     tabIndex: 0
   } : {};
-  return /* @__PURE__ */ jsx40("span", { css: MultilineChipContainer, "data-testid": "chip-value", ...props, ...buttonProps, children });
+  return /* @__PURE__ */ jsx41("span", { css: MultilineChipContainer, "data-testid": "chip-value", ...props, ...buttonProps, children });
 };
 
 // src/components/Counter/Counter.styles.ts
@@ -13530,17 +13578,17 @@ var counterIcon = css39`
 `;
 
 // src/components/Counter/Counter.tsx
-import { jsx as jsx41, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs25 } from "@emotion/react/jsx-runtime";
 var Counter = ({ count, bgColor = "transparent", ...props }) => {
   if (typeof count === "undefined") {
     return null;
   }
   const isTripleDigits = count > 99 ? /* @__PURE__ */ jsxs25("span", { css: counterTripleValue, title: `${count}`, children: [
     "99",
-    /* @__PURE__ */ jsx41(Icon, { icon: "math-plus", iconColor: "currentColor", size: "0.5rem", css: counterIcon })
+    /* @__PURE__ */ jsx42(Icon, { icon: "math-plus", iconColor: "currentColor", size: "0.5rem", css: counterIcon })
   ] }) : count;
-  const formatCount = count === 0 ? /* @__PURE__ */ jsx41("span", { css: counterZeroValue, title: `${count}` }) : isTripleDigits;
-  return /* @__PURE__ */ jsx41("div", { css: counterContainer(bgColor), ...props, children: formatCount });
+  const formatCount = count === 0 ? /* @__PURE__ */ jsx42("span", { css: counterZeroValue, title: `${count}` }) : isTripleDigits;
+  return /* @__PURE__ */ jsx42("div", { css: counterContainer(bgColor), ...props, children: formatCount });
 };
 
 // src/components/DashedBox/DashedBox.styles.ts
@@ -13578,7 +13626,7 @@ var DashedBoxContainer = ({ textAlign, boxHeight, bgColor }) => css40`
 `;
 
 // src/components/DashedBox/DashedBox.tsx
-import { jsx as jsx42 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx43 } from "@emotion/react/jsx-runtime";
 var DashedBox = ({
   bgColor = "transparent",
   textAlign = "center",
@@ -13586,7 +13634,7 @@ var DashedBox = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx42("div", { css: DashedBoxContainer({ bgColor, boxHeight, textAlign }), ...props, children });
+  return /* @__PURE__ */ jsx43("div", { css: DashedBoxContainer({ bgColor, boxHeight, textAlign }), ...props, children });
 };
 
 // src/components/DateTimePicker/DateTimePicker.tsx
@@ -13605,13 +13653,13 @@ var CaptionText = (dynamicSize) => css41`
 `;
 
 // src/components/Input/Caption.tsx
-import { jsx as jsx43 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx44 } from "@emotion/react/jsx-runtime";
 var Caption = ({ children, testId, dynamicSize = false, ...props }) => {
-  return /* @__PURE__ */ jsx43("small", { css: CaptionText(dynamicSize), "data-testid": testId, ...props, children });
+  return /* @__PURE__ */ jsx44("small", { css: CaptionText(dynamicSize), "data-testid": testId, ...props, children });
 };
 
 // src/components/Input/CheckboxWithInfo.tsx
-import { forwardRef as forwardRef5 } from "react";
+import { forwardRef as forwardRef6 } from "react";
 
 // src/components/Input/styles/CheckboxWithInfo.styles.ts
 import { css as css42 } from "@emotion/react";
@@ -13686,21 +13734,21 @@ var InfoDialogMessage = css42`
 `;
 
 // src/components/Input/CheckboxWithInfo.tsx
-import { jsx as jsx44, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
 var InfoDialog = ({ message }) => {
   return /* @__PURE__ */ jsxs26("div", { "data-testid": "info-dialog", css: InfoDialogContainer, children: [
-    /* @__PURE__ */ jsx44(Icon, { icon: "info", iconColor: "action", size: "0.9rem" }),
-    /* @__PURE__ */ jsx44("div", { role: "paragraph", css: InfoDialogMessage, className: "info-message", children: message })
+    /* @__PURE__ */ jsx45(Icon, { icon: "info", iconColor: "action", size: "0.9rem" }),
+    /* @__PURE__ */ jsx45("div", { role: "paragraph", css: InfoDialogMessage, className: "info-message", children: message })
   ] });
 };
-var CheckboxWithInfo = forwardRef5(
+var CheckboxWithInfo = forwardRef6(
   ({ label, name, info, ...props }, ref) => {
     return /* @__PURE__ */ jsxs26("div", { css: CheckboxWithInfoContainer, children: [
       /* @__PURE__ */ jsxs26("label", { css: CheckboxWithInfoLabel, children: [
-        /* @__PURE__ */ jsx44("input", { type: "checkbox", name, ref, css: CheckboxWithInfoInput, ...props }),
-        /* @__PURE__ */ jsx44("span", { children: label })
+        /* @__PURE__ */ jsx45("input", { type: "checkbox", name, ref, css: CheckboxWithInfoInput, ...props }),
+        /* @__PURE__ */ jsx45("span", { children: label })
       ] }),
-      info ? /* @__PURE__ */ jsx44(InfoDialog, { message: info }) : null
+      info ? /* @__PURE__ */ jsx45(InfoDialog, { message: info }) : null
     ] });
   }
 );
@@ -13728,11 +13776,11 @@ var errorMessageTextTruncatedStyles = css43`
 `;
 
 // src/components/Input/ErrorMessage.tsx
-import { jsx as jsx45, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
 var ErrorMessage = ({ message, testId, truncated = false, ...otherProps }) => {
   return message ? /* @__PURE__ */ jsxs27("span", { role: "alert", css: errorMessageStyles, "data-testid": testId, ...otherProps, title: message, children: [
-    /* @__PURE__ */ jsx45("span", { children: /* @__PURE__ */ jsx45(Icon, { icon: MdWarning, size: "1rem", iconColor: "currentColor" }) }),
-    /* @__PURE__ */ jsx45("span", { css: [errorMessageTextStyles, truncated ? errorMessageTextTruncatedStyles : null], children: message })
+    /* @__PURE__ */ jsx46("span", { children: /* @__PURE__ */ jsx46(Icon, { icon: MdWarning, size: "1rem", iconColor: "currentColor" }) }),
+    /* @__PURE__ */ jsx46("span", { css: [errorMessageTextStyles, truncated ? errorMessageTextTruncatedStyles : null], children: message })
   ] }) : null;
 };
 
@@ -13755,10 +13803,10 @@ var InfoIcon2 = css44`
 `;
 
 // src/components/Input/InfoMessage.tsx
-import { jsx as jsx46, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
 var InfoMessage = ({ message, testId, ...props }) => {
   return message ? /* @__PURE__ */ jsxs28("span", { role: "status", css: InfoText, "data-testid": testId, ...props, children: [
-    /* @__PURE__ */ jsx46("span", { children: /* @__PURE__ */ jsx46(Icon, { css: InfoIcon2, icon: MdInfoOutline, size: "1rem", iconColor: "currentColor" }) }),
+    /* @__PURE__ */ jsx47("span", { children: /* @__PURE__ */ jsx47(Icon, { css: InfoIcon2, icon: MdInfoOutline, size: "1rem", iconColor: "currentColor" }) }),
     message
   ] }) : null;
 };
@@ -13779,16 +13827,16 @@ var WarningIcon = css45`
 `;
 
 // src/components/Input/WarningMessage.tsx
-import { jsx as jsx47, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
 var WarningMessage = ({ message, testId, ...props }) => {
   return message ? /* @__PURE__ */ jsxs29("span", { role: "status", css: WarningText, "data-testid": testId != null ? testId : "message-text", ...props, children: [
-    /* @__PURE__ */ jsx47("span", { children: /* @__PURE__ */ jsx47(Icon, { css: WarningIcon, icon: MdWarning2, size: "1rem", iconColor: "currentColor" }) }),
+    /* @__PURE__ */ jsx48("span", { children: /* @__PURE__ */ jsx48(Icon, { css: WarningIcon, icon: MdWarning2, size: "1rem", iconColor: "currentColor" }) }),
     message
   ] }) : null;
 };
 
 // src/components/Input/FieldMessage.tsx
-import { jsx as jsx48 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx49 } from "@emotion/react/jsx-runtime";
 var FieldMessage = ({
   helperMessage,
   warningMessage,
@@ -13798,16 +13846,16 @@ var FieldMessage = ({
   helperMessageTestId
 }) => {
   if (errorMessage) {
-    return /* @__PURE__ */ jsx48(ErrorMessage, { message: errorMessage, testId: errorTestId });
+    return /* @__PURE__ */ jsx49(ErrorMessage, { message: errorMessage, testId: errorTestId });
   }
   if (warningMessage) {
-    return /* @__PURE__ */ jsx48(WarningMessage, { message: warningMessage });
+    return /* @__PURE__ */ jsx49(WarningMessage, { message: warningMessage });
   }
   if (infoMessage) {
-    return /* @__PURE__ */ jsx48(InfoMessage, { message: infoMessage });
+    return /* @__PURE__ */ jsx49(InfoMessage, { message: infoMessage });
   }
   if (helperMessage) {
-    return /* @__PURE__ */ jsx48(Caption, { testId: helperMessageTestId, children: helperMessage });
+    return /* @__PURE__ */ jsx49(Caption, { testId: helperMessageTestId, children: helperMessage });
   }
   return null;
 };
@@ -13856,12 +13904,12 @@ var fieldsetBody = css46`
 `;
 
 // src/components/Input/Fieldset.tsx
-import { jsx as jsx49, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
 var Fieldset = React10.forwardRef(
   ({ legend, disabled: disabled2, children, invert, ...props }, ref) => {
     return /* @__PURE__ */ jsxs30("fieldset", { css: fieldsetContainer(Boolean(invert)), ref, disabled: disabled2, ...props, children: [
       legend,
-      /* @__PURE__ */ jsx49("div", { css: fieldsetBody, children })
+      /* @__PURE__ */ jsx50("div", { css: fieldsetBody, children })
     ] });
   }
 );
@@ -13870,9 +13918,9 @@ var Fieldset = React10.forwardRef(
 import * as React11 from "react";
 
 // src/components/Input/Label.tsx
-import { jsx as jsx50 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx51 } from "@emotion/react/jsx-runtime";
 var Label = ({ children, className, testId, ...props }) => {
-  return /* @__PURE__ */ jsx50(
+  return /* @__PURE__ */ jsx51(
     "label",
     {
       css: [labelText, typeof className === "object" ? className : void 0],
@@ -13885,7 +13933,7 @@ var Label = ({ children, className, testId, ...props }) => {
 };
 
 // src/components/Input/Input.tsx
-import { jsx as jsx51, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
 var Input = React11.forwardRef(
   ({
     label,
@@ -13911,7 +13959,7 @@ var Input = React11.forwardRef(
         css: [inputContainer, typeof classNameRoot === "object" ? classNameRoot : void 0],
         "data-testid": containerTestId ? containerTestId : "input-container",
         children: [
-          showLabel ? /* @__PURE__ */ jsx51(
+          showLabel ? /* @__PURE__ */ jsx52(
             Label,
             {
               htmlFor: id,
@@ -13927,7 +13975,7 @@ var Input = React11.forwardRef(
               css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
               className: typeof classNameContainer === "string" ? classNameContainer : "",
               children: [
-                /* @__PURE__ */ jsx51(
+                /* @__PURE__ */ jsx52(
                   "input",
                   {
                     id,
@@ -13943,11 +13991,11 @@ var Input = React11.forwardRef(
                     ref
                   }
                 ),
-                icon ? /* @__PURE__ */ jsx51("div", { css: inputIcon, children: icon }) : null
+                icon ? /* @__PURE__ */ jsx52("div", { css: inputIcon, children: icon }) : null
               ]
             }
           ),
-          /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsx52(
             FieldMessage,
             {
               helperMessage: caption,
@@ -13965,10 +14013,10 @@ var Input = React11.forwardRef(
 
 // src/components/Input/InputComboBox.tsx
 import Select from "react-select";
-import { jsx as jsx52 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx53 } from "@emotion/react/jsx-runtime";
 function InputComboBox(props) {
   var _a;
-  return /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsx53(
     Select,
     {
       ...props,
@@ -14182,7 +14230,7 @@ var inlineSelectMenuClosed = css47`
 `;
 
 // src/components/Input/InputInlineSelect.tsx
-import { jsx as jsx53, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
 var InputInlineSelect = ({
   classNameContainer,
   options,
@@ -14220,18 +14268,18 @@ var InputInlineSelect = ({
             disabled: disabled2,
             ...props,
             children: [
-              /* @__PURE__ */ jsx53("span", { children: (_a = selected == null ? void 0 : selected.label) != null ? _a : value }),
-              disabled2 ? null : /* @__PURE__ */ jsx53(Icon, { icon: CgChevronDown2, iconColor: "currentColor", size: 24 })
+              /* @__PURE__ */ jsx54("span", { children: (_a = selected == null ? void 0 : selected.label) != null ? _a : value }),
+              disabled2 ? null : /* @__PURE__ */ jsx54(Icon, { icon: CgChevronDown2, iconColor: "currentColor", size: 24 })
             ]
           }
         ),
-        /* @__PURE__ */ jsx53(
+        /* @__PURE__ */ jsx54(
           "div",
           {
             id: `and-or-${props.id}`,
             css: [inlineSelectMenu, menuVisible ? void 0 : inlineSelectMenuClosed],
             "aria-hidden": !menuVisible,
-            children: options.map((opt) => /* @__PURE__ */ jsx53(
+            children: options.map((opt) => /* @__PURE__ */ jsx54(
               "button",
               {
                 type: "button",
@@ -14254,10 +14302,10 @@ var InputInlineSelect = ({
 // src/components/Input/InputKeywordSearch.tsx
 import { CgClose as CgClose4 } from "@react-icons/all-files/cg/CgClose";
 import { CgSearch } from "@react-icons/all-files/cg/CgSearch";
-import { forwardRef as forwardRef8, useState as useState5 } from "react";
+import { forwardRef as forwardRef9, useState as useState5 } from "react";
 import { useDebounce } from "react-use";
-import { jsx as jsx54 } from "@emotion/react/jsx-runtime";
-var InputKeywordSearch = forwardRef8(
+import { jsx as jsx55 } from "@emotion/react/jsx-runtime";
+var InputKeywordSearch = forwardRef9(
   ({
     onSearchTextChanged,
     disabled: disabled2 = false,
@@ -14281,7 +14329,7 @@ var InputKeywordSearch = forwardRef8(
     const handleClear = () => {
       onClear ? onClear() : onSearchTextChanged("");
     };
-    return /* @__PURE__ */ jsx54(
+    return /* @__PURE__ */ jsx55(
       Input,
       {
         ref,
@@ -14290,16 +14338,16 @@ var InputKeywordSearch = forwardRef8(
         placeholder,
         showLabel: false,
         value,
-        icon: value ? /* @__PURE__ */ jsx54(
+        icon: value ? /* @__PURE__ */ jsx55(
           "button",
           {
             css: inputSearchCloseBtn,
             onClick: handleClear,
             type: "button",
             "data-testid": "keyword-search-clear-button",
-            children: /* @__PURE__ */ jsx54(Icon, { icon: CgClose4, iconColor: "red", size: "1rem" })
+            children: /* @__PURE__ */ jsx55(Icon, { icon: CgClose4, iconColor: "red", size: "1rem" })
           }
-        ) : /* @__PURE__ */ jsx54(Icon, { icon: CgSearch, iconColor: "gray", size: "1rem" }),
+        ) : /* @__PURE__ */ jsx55(Icon, { icon: CgSearch, iconColor: "gray", size: "1rem" }),
         onChange: handleSearchTextChanged,
         onKeyPress: preventSubmitOnField,
         disabled: disabled2,
@@ -14326,13 +14374,13 @@ var DebouncedInputKeywordSearch = ({
 }) => {
   const [searchText, setSearchText] = useState5(defaultValue != null ? defaultValue : "");
   useDebounce(() => onSearchTextChanged(searchText), delay, [searchText]);
-  return /* @__PURE__ */ jsx54(InputKeywordSearch, { ...props, value: searchText, onSearchTextChanged: setSearchText });
+  return /* @__PURE__ */ jsx55(InputKeywordSearch, { ...props, value: searchText, onSearchTextChanged: setSearchText });
 };
 
 // src/components/Input/InputSelect.tsx
-import { forwardRef as forwardRef9 } from "react";
-import { Fragment as Fragment7, jsx as jsx55, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
-var InputSelect = forwardRef9(
+import { forwardRef as forwardRef10 } from "react";
+import { Fragment as Fragment7, jsx as jsx56, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
+var InputSelect = forwardRef10(
   ({
     label,
     defaultOption,
@@ -14354,7 +14402,7 @@ var InputSelect = forwardRef9(
         css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
         className: typeof classNameContainer === "string" ? classNameContainer : "",
         children: [
-          showLabel ? /* @__PURE__ */ jsx55(Fragment7, { children: /* @__PURE__ */ jsxs33(
+          showLabel ? /* @__PURE__ */ jsx56(Fragment7, { children: /* @__PURE__ */ jsxs33(
             Label,
             {
               htmlFor: props.id,
@@ -14382,12 +14430,12 @@ var InputSelect = forwardRef9(
               className: typeof classNameControl === "string" ? classNameControl : "",
               ...props,
               children: [
-                defaultOption ? /* @__PURE__ */ jsx55("option", { value: "", children: defaultOption }) : null,
-                options.map((opt, index) => /* @__PURE__ */ jsx55("option", { value: opt.label, ...opt }, index))
+                defaultOption ? /* @__PURE__ */ jsx56("option", { value: "", children: defaultOption }) : null,
+                options.map((opt, index) => /* @__PURE__ */ jsx56("option", { value: opt.label, ...opt }, index))
               ]
             }
           ),
-          /* @__PURE__ */ jsx55(FieldMessage, { helperMessage: caption, errorMessage, warningMessage })
+          /* @__PURE__ */ jsx56(FieldMessage, { helperMessage: caption, errorMessage, warningMessage })
         ]
       }
     );
@@ -14452,7 +14500,7 @@ var dateSegment = css49`
 `;
 
 // src/components/Input/InputTime.tsx
-import { jsx as jsx56, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
 function tryParseTime(isoTime) {
   try {
     return isoTime ? parseTime(isoTime) : void 0;
@@ -14481,7 +14529,7 @@ var InputTime = React12.forwardRef(
     onChange,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsx56(
+    return /* @__PURE__ */ jsx57(
       "div",
       {
         css: [inputContainer],
@@ -14507,8 +14555,8 @@ var InputTime = React12.forwardRef(
             ),
             ...props,
             children: [
-              showLabel ? /* @__PURE__ */ jsx56(AriaLabel, { elementType: "label", css: [labelText], "data-testid": labelTestId, children: label }) : null,
-              /* @__PURE__ */ jsx56("div", { css: [inputContainer], children: /* @__PURE__ */ jsx56(
+              showLabel ? /* @__PURE__ */ jsx57(AriaLabel, { elementType: "label", css: [labelText], "data-testid": labelTestId, children: label }) : null,
+              /* @__PURE__ */ jsx57("div", { css: [inputContainer], children: /* @__PURE__ */ jsx57(
                 DateInput,
                 {
                   css: [
@@ -14517,12 +14565,12 @@ var InputTime = React12.forwardRef(
                     errorMessage ? inputError : void 0
                   ],
                   children: (segment) => {
-                    return /* @__PURE__ */ jsx56(DateSegment, { segment, css: dateSegment });
+                    return /* @__PURE__ */ jsx57(DateSegment, { segment, css: dateSegment });
                   }
                 }
               ) }),
               belowInputSlot,
-              /* @__PURE__ */ jsx56(
+              /* @__PURE__ */ jsx57(
                 FieldMessage,
                 {
                   helperMessage: caption,
@@ -14543,7 +14591,7 @@ InputTime.displayName = "InputTime";
 
 // src/components/Input/InputToggle.tsx
 import * as React13 from "react";
-import { jsx as jsx57, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
 var InputToggle = React13.forwardRef(
   ({
     label,
@@ -14569,7 +14617,7 @@ var InputToggle = React13.forwardRef(
         css: [inputToggleLabel, disabled2 ? inputDisabled : void 0],
         "data-testid": testId ? testId : "input-toggle",
         children: [
-          /* @__PURE__ */ jsx57(
+          /* @__PURE__ */ jsx58(
             "input",
             {
               ref,
@@ -14581,8 +14629,8 @@ var InputToggle = React13.forwardRef(
               ...props
             }
           ),
-          /* @__PURE__ */ jsx57("span", { css: [inlineLabel, fontWeightStyles[fontWeight]], children: label }),
-          caption || errorMessage ? /* @__PURE__ */ jsx57("span", { css: inputToggleMessageContainer, children: /* @__PURE__ */ jsx57(
+          /* @__PURE__ */ jsx58("span", { css: [inlineLabel, fontWeightStyles[fontWeight]], children: label }),
+          caption || errorMessage ? /* @__PURE__ */ jsx58("span", { css: inputToggleMessageContainer, children: /* @__PURE__ */ jsx58(
             FieldMessage,
             {
               helperMessage: caption,
@@ -14597,9 +14645,9 @@ var InputToggle = React13.forwardRef(
 );
 
 // src/components/Input/Legend.tsx
-import { jsx as jsx58 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx59 } from "@emotion/react/jsx-runtime";
 var Legend = ({ children }) => {
-  return /* @__PURE__ */ jsx58("legend", { css: fieldsetLegend, children });
+  return /* @__PURE__ */ jsx59("legend", { css: fieldsetLegend, children });
 };
 
 // src/components/Input/SuccessMessage.tsx
@@ -14621,23 +14669,23 @@ var SuccessIcon2 = css50`
 `;
 
 // src/components/Input/SuccessMessage.tsx
-import { jsx as jsx59, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
 var SuccessMessage = ({ message, testId, ...props }) => {
   return message ? /* @__PURE__ */ jsxs36("span", { role: "status", css: SuccessText, "data-testid": testId, ...props, children: [
-    /* @__PURE__ */ jsx59("span", { children: /* @__PURE__ */ jsx59(Icon, { css: SuccessIcon2, icon: CgCheckO, size: "1rem", iconColor: "currentColor" }) }),
+    /* @__PURE__ */ jsx60("span", { children: /* @__PURE__ */ jsx60(Icon, { css: SuccessIcon2, icon: CgCheckO, size: "1rem", iconColor: "currentColor" }) }),
     message
   ] }) : null;
 };
 
 // src/components/Input/Textarea.tsx
-import { forwardRef as forwardRef12 } from "react";
-import { Fragment as Fragment8, jsx as jsx60, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
-var Textarea = forwardRef12(
+import { forwardRef as forwardRef13 } from "react";
+import { Fragment as Fragment8, jsx as jsx61, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
+var Textarea = forwardRef13(
   ({ label, icon, id, caption, showLabel = true, errorMessage, warningMessage, ...props }, ref) => {
     return /* @__PURE__ */ jsxs37(Fragment8, { children: [
-      showLabel ? /* @__PURE__ */ jsx60("label", { htmlFor: id, css: [labelText], children: label }) : null,
+      showLabel ? /* @__PURE__ */ jsx61("label", { htmlFor: id, css: [labelText], children: label }) : null,
       /* @__PURE__ */ jsxs37("div", { css: [inputContainer], children: [
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx61(
           "textarea",
           {
             ref,
@@ -14652,9 +14700,9 @@ var Textarea = forwardRef12(
             ...props
           }
         ),
-        icon ? /* @__PURE__ */ jsx60("div", { css: inputIcon, children: icon }) : null
+        icon ? /* @__PURE__ */ jsx61("div", { css: inputIcon, children: icon }) : null
       ] }),
-      /* @__PURE__ */ jsx60(FieldMessage, { helperMessage: caption, errorMessage, warningMessage })
+      /* @__PURE__ */ jsx61(FieldMessage, { helperMessage: caption, errorMessage, warningMessage })
     ] });
   }
 );
@@ -14739,7 +14787,7 @@ var tzSection = css52`
 `;
 
 // src/components/DateTimePicker/DateTimePickerSummary.tsx
-import { jsx as jsx61, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
 function DateTimePickerSummary({
   value,
   placeholder
@@ -14777,10 +14825,10 @@ function DateTimePickerSummary({
   const datePart = (value == null ? void 0 : value.datetime) ? dateFormat.format(new Date(value.datetime)) : null;
   const timePart = (value == null ? void 0 : value.datetime) ? timeFormat.format(new Date(value.datetime)) : null;
   return datePart ? /* @__PURE__ */ jsxs38("span", { children: [
-    /* @__PURE__ */ jsx61("em", { css: inputLabelFocal, children: datePart }),
+    /* @__PURE__ */ jsx62("em", { css: inputLabelFocal, children: datePart }),
     !!timePart && `, ${timePart}`,
     !!(value == null ? void 0 : value.timeZone) && timeZoneWasValid && ` in ${value == null ? void 0 : value.timeZone}`
-  ] }) : /* @__PURE__ */ jsx61("span", { children: placeholder });
+  ] }) : /* @__PURE__ */ jsx62("span", { children: placeholder });
 }
 
 // src/components/DateTimePicker/internalUtils.ts
@@ -14834,7 +14882,7 @@ var DateTimePickerVariant = /* @__PURE__ */ ((DateTimePickerVariant2) => {
 })(DateTimePickerVariant || {});
 
 // src/components/DateTimePicker/DateTimePicker.tsx
-import { jsx as jsx62, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
 var timeZoneOptions = typeof Intl !== "undefined" && typeof Intl.supportedValuesOf === "function" ? Intl.supportedValuesOf("timeZone") : ["Etc/UTC"];
 var TIMEZONE_OPTIONS = timeZoneOptions.map((v) => {
   let tz = v;
@@ -14937,8 +14985,8 @@ var DateTimePicker = ({
     }),
     [handleClearClick, handleDateChange, handleTimeChange]
   );
-  return /* @__PURE__ */ jsx62(DateTimePickerContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs39("div", { "data-testid": testId, "data-variant": variant, ...props, children: [
-    showLabel ? /* @__PURE__ */ jsx62(Label, { css: [labelText], "data-testid": `${testId}-label`, children: label }) : null,
+  return /* @__PURE__ */ jsx63(DateTimePickerContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs39("div", { "data-testid": testId, "data-variant": variant, ...props, children: [
+    showLabel ? /* @__PURE__ */ jsx63(Label, { css: [labelText], "data-testid": `${testId}-label`, children: label }) : null,
     /* @__PURE__ */ jsxs39("div", { css: inputContainer, children: [
       /* @__PURE__ */ jsxs39(
         "div",
@@ -14947,7 +14995,7 @@ var DateTimePicker = ({
           "data-disabled": disabled2,
           "data-focus": popover2.visible,
           children: [
-            /* @__PURE__ */ jsx62(
+            /* @__PURE__ */ jsx63(
               PopoverDisclosure,
               {
                 ...popover2,
@@ -14956,10 +15004,10 @@ var DateTimePicker = ({
                 buttonType: "ghostUnimportant",
                 disabled: disabled2,
                 "data-testid": `${testId}-trigger`,
-                children: /* @__PURE__ */ jsx62(DateTimePickerSummary, { value, placeholder })
+                children: /* @__PURE__ */ jsx63(DateTimePickerSummary, { value, placeholder })
               }
             ),
-            !disabled2 && Boolean(value == null ? void 0 : value.datetime) && /* @__PURE__ */ jsx62(
+            !disabled2 && Boolean(value == null ? void 0 : value.datetime) && /* @__PURE__ */ jsx63(
               Button,
               {
                 css: trigger,
@@ -14969,12 +15017,12 @@ var DateTimePicker = ({
                 children: "clear"
               }
             ),
-            /* @__PURE__ */ jsx62(Button, { css: trigger, buttonType: "ghost", disabled: disabled2, onClick: popover2.show, children: /* @__PURE__ */ jsx62(Icon, { icon: "calendar", iconColor: "currentColor" }) })
+            /* @__PURE__ */ jsx63(Button, { css: trigger, buttonType: "ghost", disabled: disabled2, onClick: popover2.show, children: /* @__PURE__ */ jsx63(Icon, { icon: "calendar", iconColor: "currentColor" }) })
           ]
         }
       ),
       /* @__PURE__ */ jsxs39(Popover2, { ...popover2, css: [Popover, popover], "aria-label": "Pick a date", children: [
-        /* @__PURE__ */ jsx62("div", { css: calendarSection, children: /* @__PURE__ */ jsx62(
+        /* @__PURE__ */ jsx63("div", { css: calendarSection, children: /* @__PURE__ */ jsx63(
           Calendar,
           {
             value: draftDate == null ? void 0 : draftDate.toString(),
@@ -14985,7 +15033,7 @@ var DateTimePicker = ({
             "data-testid": `${testId}-calendar`
           }
         ) }),
-        variant !== "date" /* Date */ && /* @__PURE__ */ jsx62("div", { css: timeSection, children: /* @__PURE__ */ jsx62(
+        variant !== "date" /* Date */ && /* @__PURE__ */ jsx63("div", { css: timeSection, children: /* @__PURE__ */ jsx63(
           InputTime,
           {
             label: "Time",
@@ -14995,8 +15043,8 @@ var DateTimePicker = ({
           }
         ) }),
         /* @__PURE__ */ jsxs39("div", { css: tzSection, children: [
-          /* @__PURE__ */ jsx62(Label, { css: labelText, children: "Timezone" }),
-          /* @__PURE__ */ jsx62(
+          /* @__PURE__ */ jsx63(Label, { css: labelText, children: "Timezone" }),
+          /* @__PURE__ */ jsx63(
             InputComboBox,
             {
               value: draftTimeZone,
@@ -15006,12 +15054,12 @@ var DateTimePicker = ({
           )
         ] }),
         /* @__PURE__ */ jsxs39(HorizontalRhythm, { gap: "0", children: [
-          /* @__PURE__ */ jsx62(Button, { buttonType: "secondary", onClick: handleSelectClick, children: "Select" }),
-          /* @__PURE__ */ jsx62(Button, { buttonType: "ghostDestructive", onClick: popover2.hide, children: "cancel" })
+          /* @__PURE__ */ jsx63(Button, { buttonType: "secondary", onClick: handleSelectClick, children: "Select" }),
+          /* @__PURE__ */ jsx63(Button, { buttonType: "ghostDestructive", onClick: popover2.hide, children: "cancel" })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsx62(
+    /* @__PURE__ */ jsx63(
       FieldMessage,
       {
         helperMessage: caption,
@@ -15057,21 +15105,21 @@ var descriptionListValueStyles = css53`
 `;
 
 // src/components/DescriptionList/DescriptionList.tsx
-import { jsx as jsx63, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
 var DescriptionList = React14.forwardRef(
   ({ items, variant = "horizontal", ...listProps }, ref) => {
     if (!(items == null ? void 0 : items.length)) {
       return null;
     }
-    return /* @__PURE__ */ jsx63(
+    return /* @__PURE__ */ jsx64(
       "dl",
       {
         ref,
         css: variant === "vertical" ? descriptionListVertical : descriptionListHorizontal,
         ...listProps,
         children: items == null ? void 0 : items.map(({ label, value }) => /* @__PURE__ */ jsxs40(React14.Fragment, { children: [
-          /* @__PURE__ */ jsx63("dt", { css: descriptionListLabelStyles, children: label }),
-          /* @__PURE__ */ jsx63("dd", { css: descriptionListValueStyles, children: typeof value === "boolean" ? /* @__PURE__ */ jsx63(DescriptionListValueBoolean, { value }) : value })
+          /* @__PURE__ */ jsx64("dt", { css: descriptionListLabelStyles, children: label }),
+          /* @__PURE__ */ jsx64("dd", { css: descriptionListValueStyles, children: typeof value === "boolean" ? /* @__PURE__ */ jsx64(DescriptionListValueBoolean, { value }) : value })
         ] }, label))
       }
     );
@@ -15081,7 +15129,7 @@ DescriptionList.displayName = "DescriptionList";
 var DescriptionListValueBoolean = ({ value }) => {
   const Icon2 = value ? TbCheck : TbMinus;
   const color = value ? "var(--accent-dark)" : "var(--gray-500)";
-  return /* @__PURE__ */ jsx63(Icon2, { style: { color }, strokeWidth: 3 });
+  return /* @__PURE__ */ jsx64(Icon2, { style: { color }, strokeWidth: 3 });
 };
 
 // src/components/Details/Details.tsx
@@ -15133,7 +15181,7 @@ var summaryIconVisiblyHidden = css54`
 `;
 
 // src/components/Details/Details.tsx
-import { jsx as jsx64, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
 var Details = ({
   summary: summary2,
   children,
@@ -15163,7 +15211,7 @@ var Details = ({
       ...props,
       children: [
         /* @__PURE__ */ jsxs41("summary", { "data-testid": "summary", css: [summary, isCompact ? summaryCompact : null], children: [
-          /* @__PURE__ */ jsx64(
+          /* @__PURE__ */ jsx65(
             Icon,
             {
               css: [!children ? summaryIconVisiblyHidden : void 0, summaryIcon],
@@ -15174,7 +15222,7 @@ var Details = ({
           ),
           summary2
         ] }),
-        memoizedIsOpen ? /* @__PURE__ */ jsx64(
+        memoizedIsOpen ? /* @__PURE__ */ jsx65(
           "div",
           {
             "data-testid": "details-content",
@@ -15301,7 +15349,7 @@ var drawerWrapperOverlayStyles = css55`
 
 // src/components/Drawer/DrawerProvider.tsx
 import { createContext as createContext3, useCallback as useCallback4, useContext as useContext4, useRef as useRef3, useState as useState8 } from "react";
-import { jsx as jsx65 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx66 } from "@emotion/react/jsx-runtime";
 var DrawerContext = createContext3({
   providerId: "",
   drawersRegistry: [],
@@ -15394,7 +15442,7 @@ var DrawerProvider = ({ children }) => {
     },
     [drawerTakeoverStackId]
   );
-  return /* @__PURE__ */ jsx65(
+  return /* @__PURE__ */ jsx66(
     DrawerContext.Provider,
     {
       value: {
@@ -15428,7 +15476,7 @@ function isEqualDrawerInstance(a, b) {
 }
 
 // src/components/Drawer/Drawer.tsx
-import { jsx as jsx66, jsxs as jsxs42 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs42 } from "@emotion/react/jsx-runtime";
 var defaultSackId = "_default";
 var CurrentDrawerContext = createContext4({});
 var useCurrentDrawer = () => {
@@ -15441,9 +15489,9 @@ var Drawer = React17.forwardRef(
     const { drawerTakeoverStackId } = useDrawer();
     const drawerRendererProps = { width: drawerProps.width, minWidth, maxWidth, position, leftAligned };
     const resolvedStickyStackIdRef = useRef4((_a = drawerTakeoverStackId != null ? drawerTakeoverStackId : drawerProps.stackId) != null ? _a : inheritedStackId);
-    return resolvedStickyStackIdRef.current ? /* @__PURE__ */ jsx66(DrawerInner, { ref, ...drawerProps, stackId: resolvedStickyStackIdRef.current }) : /* @__PURE__ */ jsxs42(DrawerProvider, { children: [
-      /* @__PURE__ */ jsx66(DrawerInner, { ref, ...drawerProps }),
-      /* @__PURE__ */ jsx66(DrawerRenderer, { stackId: defaultSackId, ...drawerRendererProps })
+    return resolvedStickyStackIdRef.current ? /* @__PURE__ */ jsx67(DrawerInner, { ref, ...drawerProps, stackId: resolvedStickyStackIdRef.current }) : /* @__PURE__ */ jsxs42(DrawerProvider, { children: [
+      /* @__PURE__ */ jsx67(DrawerInner, { ref, ...drawerProps }),
+      /* @__PURE__ */ jsx67(DrawerRenderer, { stackId: defaultSackId, ...drawerRendererProps })
     ] });
   }
 );
@@ -15488,7 +15536,7 @@ var DrawerInner = ({
     return null;
   }
   const headerId = `dialog-header-${providerId}-${stackId}-${id}`;
-  return /* @__PURE__ */ jsx66(CurrentDrawerContext.Provider, { value: { id, stackId, leftAligned }, children: createPortal(
+  return /* @__PURE__ */ jsx67(CurrentDrawerContext.Provider, { value: { id, stackId, leftAligned }, children: createPortal(
     /* @__PURE__ */ jsxs42(
       "div",
       {
@@ -15501,8 +15549,8 @@ var DrawerInner = ({
         "data-testid": testId,
         children: [
           /* @__PURE__ */ jsxs42("div", { css: headerWrapperStyles, children: [
-            header2 ? /* @__PURE__ */ jsx66("div", { id: headerId, css: drawerHeaderStyles, "data-testid": "header", children: header2 }) : null,
-            /* @__PURE__ */ jsx66(
+            header2 ? /* @__PURE__ */ jsx67("div", { id: headerId, css: drawerHeaderStyles, "data-testid": "header", children: header2 }) : null,
+            /* @__PURE__ */ jsx67(
               Button,
               {
                 ref: closeButtonRef,
@@ -15512,7 +15560,7 @@ var DrawerInner = ({
                 title: "Close dialog",
                 buttonType: "ghost",
                 "data-testid": "close-button",
-                children: /* @__PURE__ */ jsx66(
+                children: /* @__PURE__ */ jsx67(
                   Icon,
                   {
                     icon: CgChevronRight,
@@ -15524,7 +15572,7 @@ var DrawerInner = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsx66("div", { css: drawerInnerStyles, children })
+          /* @__PURE__ */ jsx67("div", { css: drawerInnerStyles, children })
         ]
       }
     ),
@@ -15561,17 +15609,17 @@ var DrawerContentBtnGroup = css56`
 `;
 
 // src/components/Drawer/DrawerContent.tsx
-import { jsx as jsx67, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
 var DrawerContent2 = ({ children, buttonGroup, noPadding = false, ...props }) => {
   return /* @__PURE__ */ jsxs43("div", { css: DrawerContent, ...props, children: [
-    /* @__PURE__ */ jsx67("div", { css: [DrawerContentInner, noPadding ? { padding: 0 } : null], children }),
-    buttonGroup ? /* @__PURE__ */ jsx67("div", { css: DrawerContentBtnGroup, children: buttonGroup }) : null
+    /* @__PURE__ */ jsx68("div", { css: [DrawerContentInner, noPadding ? { padding: 0 } : null], children }),
+    buttonGroup ? /* @__PURE__ */ jsx68("div", { css: DrawerContentBtnGroup, children: buttonGroup }) : null
   ] });
 };
 
 // src/components/Drawer/DrawerRenderer.tsx
 import { useEffect as useEffect6, useMemo as useMemo3 } from "react";
-import { Fragment as Fragment9, jsx as jsx68, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx69, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
 var drawerWidth = {
   narrow: "29rem",
   medium: "43rem",
@@ -15612,7 +15660,7 @@ var DrawerRenderer = ({
   if (drawersToRender.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx68(
+  return /* @__PURE__ */ jsx69(
     "div",
     {
       css: [
@@ -15621,7 +15669,7 @@ var DrawerRenderer = ({
         position === "sticky" ? { height: "100%", marginTop: "-100%" } : void 0
       ],
       ...otherProps,
-      children: drawersToRender.map(({ id, stackId: stackId2, onRequestClose }, index) => /* @__PURE__ */ jsx68(
+      children: drawersToRender.map(({ id, stackId: stackId2, onRequestClose }, index) => /* @__PURE__ */ jsx69(
         DrawerWrapper,
         {
           index,
@@ -15631,7 +15679,7 @@ var DrawerRenderer = ({
           maxWidth,
           onOverlayClick: onRequestClose,
           leftAligned,
-          children: /* @__PURE__ */ jsx68(
+          children: /* @__PURE__ */ jsx69(
             "div",
             {
               ...getDrawerAttributes({ providerId, stackId: stackId2, id }),
@@ -15661,8 +15709,8 @@ var DrawerWrapper = ({
   }
   const calculatedWidth = `calc(${width} - ${offsetInPx}px)`;
   return /* @__PURE__ */ jsxs44(Fragment9, { children: [
-    /* @__PURE__ */ jsx68("div", { css: drawerWrapperOverlayStyles, onClick: onOverlayClick }),
-    /* @__PURE__ */ jsx68(
+    /* @__PURE__ */ jsx69("div", { css: drawerWrapperOverlayStyles, onClick: onOverlayClick }),
+    /* @__PURE__ */ jsx69(
       "div",
       {
         css: [drawerWrapperStyles, leftAligned ? drawerWrapperLeftAlignedStyles : null],
@@ -15682,7 +15730,7 @@ var getDrawerAttributes = ({
 
 // src/components/Drawer/TakeoverDrawerRenderer.tsx
 import { useEffect as useEffect7 } from "react";
-import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
 var TAKEOVER_STACK_ID = "takeover-stack";
 var TakeoverDrawerRenderer = (props) => {
   const { registerTakeoverStackId, unregisterTakeoverStackId } = useDrawer();
@@ -15692,11 +15740,11 @@ var TakeoverDrawerRenderer = (props) => {
       unregisterTakeoverStackId(TAKEOVER_STACK_ID);
     };
   }, [registerTakeoverStackId, unregisterTakeoverStackId]);
-  return /* @__PURE__ */ jsx69(DrawerRenderer, { ...props, stackId: TAKEOVER_STACK_ID });
+  return /* @__PURE__ */ jsx70(DrawerRenderer, { ...props, stackId: TAKEOVER_STACK_ID });
 };
 
 // src/components/IconButton/IconButton.tsx
-import { forwardRef as forwardRef13 } from "react";
+import { forwardRef as forwardRef14 } from "react";
 
 // src/components/IconButton/IconButton.styles.ts
 import { css as css57 } from "@emotion/react";
@@ -15726,10 +15774,10 @@ var variants = {
 };
 
 // src/components/IconButton/IconButton.tsx
-import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
-var IconButton = forwardRef13(
+import { jsx as jsx71 } from "@emotion/react/jsx-runtime";
+var IconButton = forwardRef14(
   ({ children, size = "md", variant = "square", ...props }, ref) => {
-    return /* @__PURE__ */ jsx70(Button, { ref, css: [iconButton, variants[variant], sizes[size]], ...props, children });
+    return /* @__PURE__ */ jsx71(Button, { ref, css: [iconButton, variants[variant], sizes[size]], ...props, children });
   }
 );
 IconButton.displayName = "IconButton";
@@ -15789,7 +15837,7 @@ var variantFillImageImg = css58`
 `;
 
 // src/components/Image/ImageBroken.tsx
-import { jsx as jsx71, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
 var ImageBroken = ({ width, height, ...props }) => {
   return /* @__PURE__ */ jsxs45(
     "svg",
@@ -15804,11 +15852,11 @@ var ImageBroken = ({ width, height, ...props }) => {
       "data-testid": "broken-image",
       ...props,
       children: [
-        /* @__PURE__ */ jsx71("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
-        /* @__PURE__ */ jsx71("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
+        /* @__PURE__ */ jsx72("rect", { width: "214", height: "214", fill: "#F9FAFB" }),
+        /* @__PURE__ */ jsx72("rect", { width: "214", height: "214", fill: "url(#pattern0)" }),
         /* @__PURE__ */ jsxs45("defs", { children: [
-          /* @__PURE__ */ jsx71("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx71("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
-          /* @__PURE__ */ jsx71(
+          /* @__PURE__ */ jsx72("pattern", { id: "pattern0", patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx72("use", { xlinkHref: "#image0_761_4353", transform: "scale(0.0025)" }) }),
+          /* @__PURE__ */ jsx72(
             "image",
             {
               id: "image0_761_4353",
@@ -15824,7 +15872,7 @@ var ImageBroken = ({ width, height, ...props }) => {
 };
 
 // src/components/Image/Image.tsx
-import { jsx as jsx72, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs46 } from "@emotion/react/jsx-runtime";
 var MIN_LOADING_MS = 100;
 function Image({
   alt,
@@ -15884,7 +15932,7 @@ function Image({
         variant === "fill-container" ? variantFillImageWrapper : null
       ],
       children: [
-        src && !loadErrorText ? /* @__PURE__ */ jsx72(
+        src && !loadErrorText ? /* @__PURE__ */ jsx73(
           "img",
           {
             ...imgAttribs,
@@ -15912,14 +15960,14 @@ function Image({
               ...variant === "fill-container" ? {} : { width, height }
             },
             children: [
-              /* @__PURE__ */ jsx72(
+              /* @__PURE__ */ jsx73(
                 ImageBroken,
                 {
                   css: [brokenImage, img, imgLoaded],
                   "data-testid": "broken-image"
                 }
               ),
-              /* @__PURE__ */ jsx72(ErrorMessage, { message: loadErrorText, css: brokenImageMessage, truncated: true })
+              /* @__PURE__ */ jsx73(ErrorMessage, { message: loadErrorText, css: brokenImageMessage, truncated: true })
             ]
           }
         ) : null
@@ -16063,7 +16111,7 @@ var IntegrationTileFloatingButtonMessage = (clicked) => css59`
 `;
 
 // src/components/Tiles/CreateTeamIntegrationTile.tsx
-import { jsx as jsx73, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
 var CreateTeamIntegrationTile = ({
   title: title2 = "Create a custom integration for your team",
   buttonText = "Add Integration",
@@ -16072,7 +16120,7 @@ var CreateTeamIntegrationTile = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxs47("div", { css: [IntegrationTileContainer, IntegrationTileBtnDashedBorder], ...props, children: [
-    /* @__PURE__ */ jsx73("span", { css: IntegrationTileTitle, title: title2, children: title2 }),
+    /* @__PURE__ */ jsx74("span", { css: IntegrationTileTitle, title: title2, children: title2 }),
     /* @__PURE__ */ jsxs47(
       Button,
       {
@@ -16083,7 +16131,7 @@ var CreateTeamIntegrationTile = ({
         css: IntegrationTitleFakeButton,
         children: [
           buttonText,
-          asDeepLink ? /* @__PURE__ */ jsx73(
+          asDeepLink ? /* @__PURE__ */ jsx74(
             Icon,
             {
               icon: CgChevronRight2,
@@ -16093,7 +16141,7 @@ var CreateTeamIntegrationTile = ({
               order: 1;
             `
             }
-          ) : /* @__PURE__ */ jsx73(
+          ) : /* @__PURE__ */ jsx74(
             Icon,
             {
               icon: CgAdd2,
@@ -16114,31 +16162,31 @@ var CreateTeamIntegrationTile = ({
 import { CgCheck } from "@react-icons/all-files/cg/CgCheck";
 import { CgLock } from "@react-icons/all-files/cg/CgLock";
 import { CgSandClock } from "@react-icons/all-files/cg/CgSandClock";
-import { jsx as jsx74, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx75, jsxs as jsxs48 } from "@emotion/react/jsx-runtime";
 var IntegrationedAddedBadge = ({ text = "Added" }) => {
   return /* @__PURE__ */ jsxs48("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
-    /* @__PURE__ */ jsx74(Icon, { icon: CgCheck, iconColor: "currentColor" }),
+    /* @__PURE__ */ jsx75(Icon, { icon: CgCheck, iconColor: "currentColor" }),
     text
   ] });
 };
 var IntegrationCustomBadge = ({ text = "Custom" }) => {
-  return /* @__PURE__ */ jsx74("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
+  return /* @__PURE__ */ jsx75("span", { "data-testid": "integration-is-private", css: IntegrationCustomBadgeText("gray"), children: text });
 };
 var IntegrationPremiumBadge = ({ text = "Premium" }) => {
   return /* @__PURE__ */ jsxs48("span", { css: IntegrationCustomBadgeText("blue"), children: [
-    /* @__PURE__ */ jsx74(Icon, { icon: CgLock, iconColor: "currentColor", size: 12 }),
+    /* @__PURE__ */ jsx75(Icon, { icon: CgLock, iconColor: "currentColor", size: 12 }),
     text
   ] });
 };
 var IntegrationComingSoonBadge = ({ text = "Coming soon" }) => {
   return /* @__PURE__ */ jsxs48("span", { css: IntegrationCustomBadgeText("blue"), children: [
-    /* @__PURE__ */ jsx74(Icon, { icon: CgSandClock, iconColor: "currentColor", size: 12 }),
+    /* @__PURE__ */ jsx75(Icon, { icon: CgSandClock, iconColor: "currentColor", size: 12 }),
     text
   ] });
 };
 
 // src/components/Tiles/ResolveIcon.tsx
-import { jsx as jsx75 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx76 } from "@emotion/react/jsx-runtime";
 var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
   const CompIcon = icon && typeof icon !== "string" ? icon : null;
   const mapClassName = {
@@ -16146,13 +16194,13 @@ var ResolveIcon = ({ icon, name, styleType = "logo", ...props }) => {
     logo: IntegrationTitleLogo
   };
   if (icon) {
-    return CompIcon ? /* @__PURE__ */ jsx75(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ jsx75("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
+    return CompIcon ? /* @__PURE__ */ jsx76(CompIcon, { css: mapClassName[styleType], ...props }) : /* @__PURE__ */ jsx76("img", { src: icon, alt: name, css: mapClassName[styleType], ...props });
   }
   return null;
 };
 
 // src/components/Tiles/EditTeamIntegrationTile.tsx
-import { jsx as jsx76, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs49 } from "@emotion/react/jsx-runtime";
 var EditTeamIntegrationTile = ({
   id,
   icon,
@@ -16168,10 +16216,10 @@ var EditTeamIntegrationTile = ({
       "data-testid": "configure-integration-container",
       "integration-id": `${id.toLocaleLowerCase()}`,
       children: [
-        /* @__PURE__ */ jsx76(ResolveIcon, { icon, name, "data-testid": "integration-logo" }),
-        /* @__PURE__ */ jsx76("span", { css: IntegrationTileName, "data-testid": "integration-card-name", children: name }),
-        !isPublic ? /* @__PURE__ */ jsx76(IntegrationCustomBadge, {}) : null,
-        canEdit ? /* @__PURE__ */ jsx76(
+        /* @__PURE__ */ jsx77(ResolveIcon, { icon, name, "data-testid": "integration-logo" }),
+        /* @__PURE__ */ jsx77("span", { css: IntegrationTileName, "data-testid": "integration-card-name", children: name }),
+        !isPublic ? /* @__PURE__ */ jsx77(IntegrationCustomBadge, {}) : null,
+        canEdit ? /* @__PURE__ */ jsx77(
           Button,
           {
             buttonType: "unimportant",
@@ -16192,7 +16240,7 @@ var EditTeamIntegrationTile = ({
 import { css as css61 } from "@emotion/react";
 import { CgHeart } from "@react-icons/all-files/cg/CgHeart";
 import { useEffect as useEffect9, useState as useState11 } from "react";
-import { jsx as jsx77, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx78, jsxs as jsxs50 } from "@emotion/react/jsx-runtime";
 var IntegrationComingSoon = ({
   name,
   icon,
@@ -16221,9 +16269,9 @@ var IntegrationComingSoon = ({
       "data-testid": `coming-soon-${id.toLowerCase()}-integration`,
       ...props,
       children: [
-        /* @__PURE__ */ jsx77(IntegrationComingSoonBadge, {}),
-        /* @__PURE__ */ jsx77(ResolveIcon, { icon, name }),
-        /* @__PURE__ */ jsx77("span", { css: IntegrationTileName, title: name, children: name }),
+        /* @__PURE__ */ jsx78(IntegrationComingSoonBadge, {}),
+        /* @__PURE__ */ jsx78(ResolveIcon, { icon, name }),
+        /* @__PURE__ */ jsx78("span", { css: IntegrationTileName, title: name, children: name }),
         /* @__PURE__ */ jsxs50(
           Button,
           {
@@ -16234,8 +16282,8 @@ var IntegrationComingSoon = ({
             role: "link",
             css: [IntegrationTileFloatingButton, IntegrationTileFloatingButtonMessage(upVote)],
             children: [
-              /* @__PURE__ */ jsx77("strong", { children: "+1" }),
-              /* @__PURE__ */ jsx77(
+              /* @__PURE__ */ jsx78("strong", { children: "+1" }),
+              /* @__PURE__ */ jsx78(
                 "span",
                 {
                   css: css61`
@@ -16246,7 +16294,7 @@ var IntegrationComingSoon = ({
                 }
               ),
               /* @__PURE__ */ jsxs50("span", { "aria-hidden": !upVote, children: [
-                /* @__PURE__ */ jsx77(Icon, { icon: CgHeart, iconColor: "currentColor", size: 18 }),
+                /* @__PURE__ */ jsx78(Icon, { icon: CgHeart, iconColor: "currentColor", size: 18 }),
                 "Thanks!"
               ] })
             ]
@@ -16302,12 +16350,12 @@ var IntegrationLoadingFrame = css62`
 `;
 
 // src/components/Tiles/IntegrationLoadingTile.tsx
-import { Fragment as Fragment10, jsx as jsx78, jsxs as jsxs51 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx79, jsxs as jsxs51 } from "@emotion/react/jsx-runtime";
 var IntegrationLoadingTile = ({ count = 1 }) => {
   const componentCount = Array.from(Array(count).keys());
-  return /* @__PURE__ */ jsx78(Fragment10, { children: componentCount.map((i) => /* @__PURE__ */ jsxs51("div", { css: IntegrationLoadingTileContainer, children: [
-    /* @__PURE__ */ jsx78("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
-    /* @__PURE__ */ jsx78("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
+  return /* @__PURE__ */ jsx79(Fragment10, { children: componentCount.map((i) => /* @__PURE__ */ jsxs51("div", { css: IntegrationLoadingTileContainer, children: [
+    /* @__PURE__ */ jsx79("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
+    /* @__PURE__ */ jsx79("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
   ] }, i)) });
 };
 
@@ -16327,7 +16375,7 @@ var IntegrationModalImage = css63`
 `;
 
 // src/components/Tiles/IntegrationModalIcon.tsx
-import { jsx as jsx79, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx80, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
 var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
   const CompIcon = icon && typeof icon !== "string" ? icon : null;
   let iconSrc = void 0;
@@ -16345,7 +16393,7 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
   }
   return /* @__PURE__ */ jsxs52("div", { css: IntegrationModalIconContainer, children: [
     /* @__PURE__ */ jsxs52("svg", { width: "49", height: "57", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "img", children: [
-      /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsx80(
         "path",
         {
           d: "m24.367 1.813 22.786 13.322V41.78L24.367 55.102 1.581 41.78V15.135L24.367 1.814Z",
@@ -16354,12 +16402,12 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
           strokeWidth: "2"
         }
       ),
-      /* @__PURE__ */ jsx79("defs", { children: /* @__PURE__ */ jsxs52("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
-        /* @__PURE__ */ jsx79("stop", { stopColor: "#1768B2" }),
-        /* @__PURE__ */ jsx79("stop", { offset: "1", stopColor: "#B3EFE4" })
+      /* @__PURE__ */ jsx80("defs", { children: /* @__PURE__ */ jsxs52("linearGradient", { id: "a", x1: "41.353", y1: "49.107", x2: "8.048", y2: "4.478", gradientUnits: "userSpaceOnUse", children: [
+        /* @__PURE__ */ jsx80("stop", { stopColor: "#1768B2" }),
+        /* @__PURE__ */ jsx80("stop", { offset: "1", stopColor: "#B3EFE4" })
       ] }) })
     ] }),
-    CompIcon ? /* @__PURE__ */ jsx79(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ jsx79(
+    CompIcon ? /* @__PURE__ */ jsx80(CompIcon, { role: "img", css: IntegrationModalImage, ...imgProps }) : iconSrc ? /* @__PURE__ */ jsx80(
       "img",
       {
         src: iconSrc,
@@ -16373,7 +16421,7 @@ var IntegrationModalIcon = ({ icon, name, ...imgProps }) => {
 };
 
 // src/components/Tiles/IntegrationTile.tsx
-import { jsx as jsx80, jsxs as jsxs53 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx81, jsxs as jsxs53 } from "@emotion/react/jsx-runtime";
 var IntegrationTile = ({
   id,
   icon,
@@ -16395,12 +16443,12 @@ var IntegrationTile = ({
       "aria-label": name,
       ...btnProps,
       children: [
-        /* @__PURE__ */ jsx80(ResolveIcon, { icon, name }),
-        /* @__PURE__ */ jsx80("span", { css: IntegrationTileName, title: name, children: name }),
-        isInstalled ? /* @__PURE__ */ jsx80(IntegrationedAddedBadge, {}) : null,
-        requiedEntitlement && isPublic ? /* @__PURE__ */ jsx80(IntegrationPremiumBadge, {}) : null,
-        !isPublic ? /* @__PURE__ */ jsx80(IntegrationCustomBadge, {}) : null,
-        authorIcon ? /* @__PURE__ */ jsx80(ResolveIcon, { icon: authorIcon, name }) : null
+        /* @__PURE__ */ jsx81(ResolveIcon, { icon, name }),
+        /* @__PURE__ */ jsx81("span", { css: IntegrationTileName, title: name, children: name }),
+        isInstalled ? /* @__PURE__ */ jsx81(IntegrationedAddedBadge, {}) : null,
+        requiedEntitlement && isPublic ? /* @__PURE__ */ jsx81(IntegrationPremiumBadge, {}) : null,
+        !isPublic ? /* @__PURE__ */ jsx81(IntegrationCustomBadge, {}) : null,
+        authorIcon ? /* @__PURE__ */ jsx81(ResolveIcon, { icon: authorIcon, name }) : null
       ]
     }
   );
@@ -16437,9 +16485,9 @@ var TileIsSelected = css64`
 `;
 
 // src/components/Tiles/Tile.tsx
-import { jsx as jsx81 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
 var Tile2 = ({ children, disabled: disabled2, isSelected, ...props }) => {
-  return /* @__PURE__ */ jsx81(
+  return /* @__PURE__ */ jsx82(
     "button",
     {
       type: "button",
@@ -16471,7 +16519,7 @@ var TileContainerInner = (gap, templateColumns) => css65`
 `;
 
 // src/components/Tiles/TileContainer.tsx
-import { jsx as jsx82 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx83 } from "@emotion/react/jsx-runtime";
 var TileContainer = ({
   bgColor = "var(--brand-secondary-2)",
   containerPadding = "base",
@@ -16480,7 +16528,7 @@ var TileContainer = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx82("div", { css: TileContainerWrapper(bgColor, containerPadding), ...props, children: /* @__PURE__ */ jsx82("div", { css: TileContainerInner(gap, gridTemplateColumns), children }) });
+  return /* @__PURE__ */ jsx83("div", { css: TileContainerWrapper(bgColor, containerPadding), ...props, children: /* @__PURE__ */ jsx83("div", { css: TileContainerInner(gap, gridTemplateColumns), children }) });
 };
 
 // src/components/Tiles/styles/TileText.styles.ts
@@ -16495,10 +16543,10 @@ var TileText = css66`
 `;
 
 // src/components/Tiles/TileText.tsx
-import { jsx as jsx83 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx84 } from "@emotion/react/jsx-runtime";
 var TileText2 = ({ as = "heading", children, ...props }) => {
   const isHeading = as === "heading";
-  return /* @__PURE__ */ jsx83(
+  return /* @__PURE__ */ jsx84(
     "span",
     {
       role: isHeading ? "heading" : void 0,
@@ -16547,7 +16595,7 @@ var IntegrationModalHeaderContentWrapper = css67`
 `;
 
 // src/components/IntegrationModalHeader/IntegrationModalHeader.tsx
-import { Fragment as Fragment11, jsx as jsx84, jsxs as jsxs54 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx85, jsxs as jsxs54 } from "@emotion/react/jsx-runtime";
 var HexModalBackground = ({ ...props }) => {
   return /* @__PURE__ */ jsxs54(
     "svg",
@@ -16559,7 +16607,7 @@ var HexModalBackground = ({ ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx84(
+        /* @__PURE__ */ jsx85(
           "path",
           {
             fillRule: "evenodd",
@@ -16568,7 +16616,7 @@ var HexModalBackground = ({ ...props }) => {
             fill: "url(#paint0_linear_196_2737)"
           }
         ),
-        /* @__PURE__ */ jsx84("defs", { children: /* @__PURE__ */ jsxs54(
+        /* @__PURE__ */ jsx85("defs", { children: /* @__PURE__ */ jsxs54(
           "linearGradient",
           {
             id: "paint0_linear_196_2737",
@@ -16578,8 +16626,8 @@ var HexModalBackground = ({ ...props }) => {
             y2: "-95.2742",
             gradientUnits: "userSpaceOnUse",
             children: [
-              /* @__PURE__ */ jsx84("stop", { stopColor: "#81DCDE" }),
-              /* @__PURE__ */ jsx84("stop", { offset: "1", stopColor: "#428ED4" })
+              /* @__PURE__ */ jsx85("stop", { stopColor: "#81DCDE" }),
+              /* @__PURE__ */ jsx85("stop", { offset: "1", stopColor: "#428ED4" })
             ]
           }
         ) })
@@ -16589,22 +16637,22 @@ var HexModalBackground = ({ ...props }) => {
 };
 var IntegrationModalHeader = ({ icon, name, menu, children }) => {
   return /* @__PURE__ */ jsxs54(Fragment11, { children: [
-    /* @__PURE__ */ jsx84(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
-    /* @__PURE__ */ jsx84("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs54("div", { css: IntegrationModalHeaderTitleGroup, children: [
-      icon ? /* @__PURE__ */ jsx84(IntegrationModalIcon, { icon, name: name || "" }) : null,
-      /* @__PURE__ */ jsx84(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-testid": "integration-modal-title", children: name || "Create Team Integration" }),
+    /* @__PURE__ */ jsx85(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
+    /* @__PURE__ */ jsx85("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs54("div", { css: IntegrationModalHeaderTitleGroup, children: [
+      icon ? /* @__PURE__ */ jsx85(IntegrationModalIcon, { icon, name: name || "" }) : null,
+      /* @__PURE__ */ jsx85(Heading, { level: 3, css: IntegrationModalHeaderTitle, "data-testid": "integration-modal-title", children: name || "Create Team Integration" }),
       menu ? /* @__PURE__ */ jsxs54("div", { css: IntegrationModalHeaderMenuPlacement, children: [
         menu,
         " "
       ] }) : null
     ] }) }),
-    /* @__PURE__ */ jsx84("div", { css: IntegrationModalHeaderContentWrapper, children })
+    /* @__PURE__ */ jsx85("div", { css: IntegrationModalHeaderContentWrapper, children })
   ] });
 };
 
 // src/components/JsonEditor/JsonEditor.tsx
 import MonacoEditor from "@monaco-editor/react";
-import { jsx as jsx85 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx86 } from "@emotion/react/jsx-runtime";
 var minEditorHeightPx = 150;
 var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
   let effectiveHeight = height;
@@ -16614,7 +16662,7 @@ var JsonEditor = ({ defaultValue, onChange, jsonSchema, height, readOnly }) => {
   if (typeof effectiveHeight === "number" && effectiveHeight < minEditorHeightPx) {
     effectiveHeight = minEditorHeightPx;
   }
-  return /* @__PURE__ */ jsx85(
+  return /* @__PURE__ */ jsx86(
     MonacoEditor,
     {
       height: effectiveHeight,
@@ -16683,7 +16731,7 @@ var LimitsBarTextColor = (statusColor) => css68`
 `;
 
 // src/components/LimitsBar/LimitsBar.tsx
-import { jsx as jsx86, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx87, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
 var LimitsBar = ({ current, max, label }) => {
   const maxPercentage = 100;
   const progressBarValue = Math.ceil(current / max * maxPercentage);
@@ -16696,14 +16744,14 @@ var LimitsBar = ({ current, max, label }) => {
   const statusColor = progressBarValue === 100 ? colorMap.danger : progressBarValue >= 75 ? colorMap.warn : colorMap.base;
   return /* @__PURE__ */ jsxs55("div", { css: LimitsBarContainer, children: [
     /* @__PURE__ */ jsxs55("div", { css: LimitsBarLabelContainer, children: [
-      /* @__PURE__ */ jsx86("span", { css: LimitsBarLabel, children: label }),
+      /* @__PURE__ */ jsx87("span", { css: LimitsBarLabel, children: label }),
       /* @__PURE__ */ jsxs55("span", { css: [LimitsBarLabel, LimitsBarTextColor(statusColor)], children: [
         current,
         " of ",
         max
       ] })
     ] }),
-    /* @__PURE__ */ jsx86(
+    /* @__PURE__ */ jsx87(
       "div",
       {
         role: "progressbar",
@@ -16712,7 +16760,7 @@ var LimitsBar = ({ current, max, label }) => {
         "aria-valuemax": max,
         "aria-valuetext": `${current} of ${max}`,
         css: LimitsBarProgressBar,
-        children: /* @__PURE__ */ jsx86(
+        children: /* @__PURE__ */ jsx87(
           "span",
           {
             role: "presentation",
@@ -16744,10 +16792,10 @@ var LinkListTitle = css69`
 `;
 
 // src/components/LinkList/LinkList.tsx
-import { jsx as jsx87, jsxs as jsxs56 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx88, jsxs as jsxs56 } from "@emotion/react/jsx-runtime";
 var LinkList = ({ title: title2, padding = "var(--spacing-md)", children, ...props }) => {
   return /* @__PURE__ */ jsxs56("div", { css: LinkListContainer(padding), ...props, children: [
-    /* @__PURE__ */ jsx87(Heading, { level: 3, css: LinkListTitle, children: title2 }),
+    /* @__PURE__ */ jsx88(Heading, { level: 3, css: LinkListTitle, children: title2 }),
     children
   ] });
 };
@@ -16783,10 +16831,10 @@ var ScrollableListInner = css70`
 `;
 
 // src/components/List/ScrollableList.tsx
-import { jsx as jsx88, jsxs as jsxs57 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx89, jsxs as jsxs57 } from "@emotion/react/jsx-runtime";
 var ScrollableList = ({ label, children, ...props }) => {
   return /* @__PURE__ */ jsxs57("div", { css: [ScrollableListContainer, scrollbarStyles], ...props, children: [
-    label ? /* @__PURE__ */ jsx88(
+    label ? /* @__PURE__ */ jsx89(
       "span",
       {
         css: css71`
@@ -16795,7 +16843,7 @@ var ScrollableList = ({ label, children, ...props }) => {
         children: label
       }
     ) : null,
-    /* @__PURE__ */ jsx88("div", { css: [ScrollableListInner, scrollbarStyles], children })
+    /* @__PURE__ */ jsx89("div", { css: [ScrollableListInner, scrollbarStyles], children })
   ] });
 };
 
@@ -16867,7 +16915,7 @@ var ScrollableListIconVisible = css72`
 `;
 
 // src/components/List/ScrollableListInputItem.tsx
-import { jsx as jsx89, jsxs as jsxs58 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs58 } from "@emotion/react/jsx-runtime";
 var ScrollableListInputItem = ({
   label,
   icon,
@@ -16877,7 +16925,7 @@ var ScrollableListInputItem = ({
   labelTestId,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx89(
+  return /* @__PURE__ */ jsx90(
     "div",
     {
       css: [
@@ -16891,8 +16939,8 @@ var ScrollableListInputItem = ({
           icon,
           label
         ] }),
-        /* @__PURE__ */ jsx89("div", { css: ScrollableListHiddenInput, children }),
-        /* @__PURE__ */ jsx89(
+        /* @__PURE__ */ jsx90("div", { css: ScrollableListHiddenInput, children }),
+        /* @__PURE__ */ jsx90(
           Icon,
           {
             icon: CgCheck2,
@@ -16910,7 +16958,7 @@ var ScrollableListInputItem = ({
 
 // src/components/List/ScrollableListItem.tsx
 import { CgCheck as CgCheck3 } from "@react-icons/all-files/cg/CgCheck";
-import { jsx as jsx90, jsxs as jsxs59 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx91, jsxs as jsxs59 } from "@emotion/react/jsx-runtime";
 var ScrollableListItem = ({
   buttonText,
   icon,
@@ -16918,7 +16966,7 @@ var ScrollableListItem = ({
   disableShadow,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx90(
+  return /* @__PURE__ */ jsx91(
     "div",
     {
       css: [
@@ -16929,9 +16977,9 @@ var ScrollableListItem = ({
       children: /* @__PURE__ */ jsxs59("button", { css: ScrollableListItemBtn, type: "button", ...props, children: [
         /* @__PURE__ */ jsxs59(HorizontalRhythm, { gap: "xs", align: "center", children: [
           icon,
-          /* @__PURE__ */ jsx90("span", { children: buttonText })
+          /* @__PURE__ */ jsx91("span", { children: buttonText })
         ] }),
-        /* @__PURE__ */ jsx90(
+        /* @__PURE__ */ jsx91(
           Icon,
           {
             icon: CgCheck3,
@@ -16998,16 +17046,16 @@ function loadingDot(size) {
 }
 
 // src/components/LoadingIndicator/LoadingIndicator.tsx
-import { jsx as jsx91, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx92, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
 var LoadingIndicator = ({
   size = "lg",
   ...props
 }) => {
   const dotStyle = loadingDot(size);
   return /* @__PURE__ */ jsxs60("div", { role: "alert", css: loader, "data-testid": "loading-indicator", ...props, children: [
-    /* @__PURE__ */ jsx91("span", { css: dotStyle }),
-    /* @__PURE__ */ jsx91("span", { css: dotStyle }),
-    /* @__PURE__ */ jsx91("span", { css: dotStyle })
+    /* @__PURE__ */ jsx92("span", { css: dotStyle }),
+    /* @__PURE__ */ jsx92("span", { css: dotStyle }),
+    /* @__PURE__ */ jsx92("span", { css: dotStyle })
   ] });
 };
 
@@ -17047,7 +17095,7 @@ var loadingOverlayMessage = css74`
 `;
 
 // src/components/LoadingOverlay/LoadingOverlay.tsx
-import { jsx as jsx92, jsxs as jsxs61 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx93, jsxs as jsxs61 } from "@emotion/react/jsx-runtime";
 var LoadingOverlay = ({
   isActive,
   statusMessage,
@@ -17081,9 +17129,9 @@ var LoadingOverlay = ({
       "aria-hidden": !isActive,
       "aria-busy": isActive && !isPaused,
       children: [
-        /* @__PURE__ */ jsx92("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
-        /* @__PURE__ */ jsx92("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ jsxs61("div", { css: loadingOverlayBody, children: [
-          /* @__PURE__ */ jsx92(
+        /* @__PURE__ */ jsx93("div", { css: loadingOverlayBackground(overlayBackgroundColor) }),
+        /* @__PURE__ */ jsx93("div", { css: { position: "relative", maxWidth: "100%", margin: isTopAligned ? "0" : "auto" }, children: /* @__PURE__ */ jsxs61("div", { css: loadingOverlayBody, children: [
+          /* @__PURE__ */ jsx93(
             AnimationFile,
             {
               lottieRef,
@@ -17098,15 +17146,15 @@ var LoadingOverlay = ({
               }
             }
           ),
-          statusMessage ? /* @__PURE__ */ jsx92("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
-          /* @__PURE__ */ jsx92("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
+          statusMessage ? /* @__PURE__ */ jsx93("div", { css: loadingOverlayMessage, children: statusMessage }) : null,
+          /* @__PURE__ */ jsx93("div", { css: { width: "100%", marginTop: "var(--spacing-md)" }, children })
         ] }) })
       ]
     }
   );
 };
 var LoadingIcon = ({ height, width, ...props }) => {
-  return /* @__PURE__ */ jsx92(
+  return /* @__PURE__ */ jsx93(
     "svg",
     {
       viewBox: "0 0 38 38",
@@ -17116,9 +17164,9 @@ var LoadingIcon = ({ height, width, ...props }) => {
       stroke: "currentColor",
       ...props,
       "data-testid": "loading-icon",
-      children: /* @__PURE__ */ jsx92("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ jsxs61("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
-        /* @__PURE__ */ jsx92("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
-        /* @__PURE__ */ jsx92("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ jsx92(
+      children: /* @__PURE__ */ jsx93("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ jsxs61("g", { transform: "translate(1 1)", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsx93("circle", { strokeOpacity: ".25", cx: "18", cy: "18", r: "18" }),
+        /* @__PURE__ */ jsx93("path", { d: "M36 18c0-9.94-8.06-18-18-18", transform: "rotate(166.645 18 18)", children: /* @__PURE__ */ jsx93(
           "animateTransform",
           {
             attributeName: "transform",
@@ -17143,7 +17191,7 @@ import {
   PopoverDisclosure as PopoverDisclosure2,
   PopoverProvider
 } from "@ariakit/react";
-import { Fragment as Fragment12, jsx as jsx93, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx94, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
 var Popover3 = ({
   iconColor = "action",
   icon = "info",
@@ -17158,19 +17206,19 @@ var Popover3 = ({
   ...otherProps
 }) => {
   return /* @__PURE__ */ jsxs62(PopoverProvider, { placement, children: [
-    /* @__PURE__ */ jsx93(
+    /* @__PURE__ */ jsx94(
       PopoverDisclosure2,
       {
         css: [PopoverBtn, trigger2 ? void 0 : PopoverDefaulterTriggerBtn],
         title: buttonText,
         "data-testid": testId,
         children: trigger2 ? trigger2 : /* @__PURE__ */ jsxs62(Fragment12, { children: [
-          /* @__PURE__ */ jsx93(Icon, { icon, iconColor, size: iconSize }),
-          /* @__PURE__ */ jsx93("span", { hidden: true, children: buttonText })
+          /* @__PURE__ */ jsx94(Icon, { icon, iconColor, size: iconSize }),
+          /* @__PURE__ */ jsx94("span", { hidden: true, children: buttonText })
         ] })
       }
     ),
-    /* @__PURE__ */ jsx93(AriakitPopover, { unmountOnHide: true, css: Popover, ...otherProps, "aria-label": ariaLabel, children })
+    /* @__PURE__ */ jsx94(AriakitPopover, { unmountOnHide: true, css: Popover, ...otherProps, "aria-label": ariaLabel, children })
   ] });
 };
 
@@ -17259,7 +17307,7 @@ var menuButton = css75`
 `;
 
 // src/components/MediaCard/MediaCard.tsx
-import { jsx as jsx94, jsxs as jsxs63 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx95, jsxs as jsxs63 } from "@emotion/react/jsx-runtime";
 var MediaCard = ({
   title: title2,
   subtitle: subtitle2,
@@ -17276,12 +17324,12 @@ var MediaCard = ({
   }, []);
   const hasMenuItems = Array.isArray(menuItems) ? menuItems.length > 0 : Boolean(menuItems);
   return /* @__PURE__ */ jsxs63(Card, { css: cardBase, ...cardProps, onClick, "data-testid": "card-item", children: [
-    /* @__PURE__ */ jsx94("button", { tabIndex: -1, css: coverWrapper, type: buttonType, children: cover }),
-    /* @__PURE__ */ jsx94("div", { css: contentWrapper, children: /* @__PURE__ */ jsxs63(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
+    /* @__PURE__ */ jsx95("button", { tabIndex: -1, css: coverWrapper, type: buttonType, children: cover }),
+    /* @__PURE__ */ jsx95("div", { css: contentWrapper, children: /* @__PURE__ */ jsxs63(HorizontalRhythm, { gap: "sm", justify: "space-between", align: "center", css: { width: "100%" }, children: [
       /* @__PURE__ */ jsxs63(VerticalRhythm, { gap: "0", align: "flex-start", css: { flex: 1, minWidth: 0 }, children: [
         /* @__PURE__ */ jsxs63(HorizontalRhythm, { gap: "xs", align: "center", css: { maxWidth: "100%" }, children: [
-          /* @__PURE__ */ jsx94("button", { css: title, "data-testid": "card-title", children: title2 }),
-          !infoPopover ? null : /* @__PURE__ */ jsx94("div", { css: { display: "flex", cursor: "default" }, onClick: onStopPropogation, children: /* @__PURE__ */ jsx94(
+          /* @__PURE__ */ jsx95("button", { css: title, "data-testid": "card-title", children: title2 }),
+          !infoPopover ? null : /* @__PURE__ */ jsx95("div", { css: { display: "flex", cursor: "default" }, onClick: onStopPropogation, children: /* @__PURE__ */ jsx95(
             Popover3,
             {
               baseId: `info-of-${title2}`,
@@ -17290,31 +17338,31 @@ var MediaCard = ({
               iconColor: "default",
               tabIndex: 0,
               css: { display: "block", maxWidth: "20rem" },
-              children: /* @__PURE__ */ jsx94("div", { children: infoPopover })
+              children: /* @__PURE__ */ jsx95("div", { children: infoPopover })
             }
           ) })
         ] }),
-        subtitle2 ? /* @__PURE__ */ jsx94("button", { tabIndex: -1, css: subtitle, children: subtitle2 }) : null
+        subtitle2 ? /* @__PURE__ */ jsx95("button", { tabIndex: -1, css: subtitle, children: subtitle2 }) : null
       ] }),
-      sideSection2 ? /* @__PURE__ */ jsx94("div", { css: sideSection, onClick: onStopPropogation, children: sideSection2 }) : null,
-      hasMenuItems ? /* @__PURE__ */ jsx94(
+      sideSection2 ? /* @__PURE__ */ jsx95("div", { css: sideSection, onClick: onStopPropogation, children: sideSection2 }) : null,
+      hasMenuItems ? /* @__PURE__ */ jsx95(
         VerticalRhythm,
         {
           css: menuSection,
           align: "center",
           justify: "center",
           onClick: onStopPropogation,
-          children: /* @__PURE__ */ jsx94(
+          children: /* @__PURE__ */ jsx95(
             Menu,
             {
-              menuTrigger: /* @__PURE__ */ jsx94(
+              menuTrigger: /* @__PURE__ */ jsx95(
                 "button",
                 {
                   type: "button",
                   "aria-label": "More options",
                   css: menuButton,
                   "data-testid": "button-more",
-                  children: /* @__PURE__ */ jsx94(Icon, { icon: "more-alt", iconColor: "gray", size: 16 })
+                  children: /* @__PURE__ */ jsx95(Icon, { icon: "more-alt", iconColor: "gray", size: 16 })
                 }
               ),
               menuLabel: `Menu of ${title2}`,
@@ -17415,7 +17463,7 @@ var modalDialogInnerStyles = css76`
 `;
 
 // src/components/Modal/Modal.tsx
-import { jsx as jsx95, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx96, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
 var defaultModalWidth = "75rem";
 var defaultModalHeight = "51rem";
 var Modal = React20.forwardRef(
@@ -17457,7 +17505,7 @@ var Modal = React20.forwardRef(
         (_a2 = dialogRef.current) == null ? void 0 : _a2.close();
       };
     }, []);
-    return /* @__PURE__ */ jsx95(
+    return /* @__PURE__ */ jsx96(
       "dialog",
       {
         ref: (element) => {
@@ -17486,8 +17534,8 @@ var Modal = React20.forwardRef(
             onClick: (e) => e.stopPropagation(),
             children: [
               /* @__PURE__ */ jsxs64("div", { css: modalHeaderStyles, children: [
-                !header2 ? null : /* @__PURE__ */ jsx95("div", { css: modalHeaderHeaderStyles, children: header2 }),
-                /* @__PURE__ */ jsx95(
+                !header2 ? null : /* @__PURE__ */ jsx96("div", { css: modalHeaderHeaderStyles, children: header2 }),
+                /* @__PURE__ */ jsx96(
                   Button,
                   {
                     type: "button",
@@ -17496,11 +17544,11 @@ var Modal = React20.forwardRef(
                     title: "Close dialog",
                     buttonType: "ghost",
                     "data-testid": "close-dialog",
-                    children: /* @__PURE__ */ jsx95(Icon, { icon: CgClose5, iconColor: "currentColor", size: 24 })
+                    children: /* @__PURE__ */ jsx96(Icon, { icon: CgClose5, iconColor: "currentColor", size: 24 })
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx95(
+              /* @__PURE__ */ jsx96(
                 "div",
                 {
                   css: [
@@ -17511,7 +17559,7 @@ var Modal = React20.forwardRef(
                   children
                 }
               ),
-              buttonGroup ? /* @__PURE__ */ jsx95(HorizontalRhythm, { children: buttonGroup }) : null
+              buttonGroup ? /* @__PURE__ */ jsx96(HorizontalRhythm, { children: buttonGroup }) : null
             ]
           }
         )
@@ -17522,11 +17570,11 @@ var Modal = React20.forwardRef(
 Modal.displayName = "Modal";
 
 // src/components/Modal/ModalDialog.tsx
-import { forwardRef as forwardRef14 } from "react";
-import { jsx as jsx96, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
-var ModalDialog = forwardRef14(
+import { forwardRef as forwardRef15 } from "react";
+import { jsx as jsx97, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
+var ModalDialog = forwardRef15(
   ({ header: header2, buttonGroup, modalSize = "lg", children, height = "auto", onRequestClose, ...props }, ref) => {
-    return /* @__PURE__ */ jsx96(
+    return /* @__PURE__ */ jsx97(
       Modal,
       {
         ...props,
@@ -17539,9 +17587,9 @@ var ModalDialog = forwardRef14(
         css: modalDialogInnerStyles,
         width: "",
         children: /* @__PURE__ */ jsxs65(VerticalRhythm, { css: modalDialogWrapper, children: [
-          /* @__PURE__ */ jsx96("div", { css: modalHeaderStyles, children: header2 }),
-          /* @__PURE__ */ jsx96("div", { children }),
-          /* @__PURE__ */ jsx96(HorizontalRhythm, { children: buttonGroup })
+          /* @__PURE__ */ jsx97("div", { css: modalHeaderStyles, children: header2 }),
+          /* @__PURE__ */ jsx97("div", { children }),
+          /* @__PURE__ */ jsx97(HorizontalRhythm, { children: buttonGroup })
         ] })
       }
     );
@@ -17581,7 +17629,7 @@ var page = css77`
 `;
 
 // src/components/Pagination/Pagination.tsx
-import { jsx as jsx97 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx98 } from "@emotion/react/jsx-runtime";
 function Pagination({
   limit,
   offset,
@@ -17596,12 +17644,12 @@ function Pagination({
   if (pageCount <= 1) {
     return null;
   }
-  return /* @__PURE__ */ jsx97(
+  return /* @__PURE__ */ jsx98(
     Paginate,
     {
       forcePage: currentPage,
-      previousLabel: /* @__PURE__ */ jsx97("div", { className: prevNextControls, children: "<" }),
-      nextLabel: /* @__PURE__ */ jsx97("div", { className: prevNextControls, children: ">" }),
+      previousLabel: /* @__PURE__ */ jsx98("div", { className: prevNextControls, children: "<" }),
+      nextLabel: /* @__PURE__ */ jsx98("div", { className: prevNextControls, children: ">" }),
       breakLabel: "...",
       pageCount,
       marginPagesDisplayed: 2,
@@ -17668,7 +17716,7 @@ var inputIconBtn = css78`
 `;
 
 // src/components/ParameterInputs/LabelLeadingIcon.tsx
-import { jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx99, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
 var LabelLeadingIcon = ({
   icon,
   iconColor,
@@ -17680,7 +17728,7 @@ var LabelLeadingIcon = ({
   ...props
 }) => {
   const titleFr = title2 != null ? title2 : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
-  return /* @__PURE__ */ jsx98(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs66(
+  return /* @__PURE__ */ jsx99(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs66(
     "button",
     {
       css: inputIconBtn,
@@ -17690,7 +17738,7 @@ var LabelLeadingIcon = ({
       ...props,
       "data-testid": "lock-button",
       children: [
-        /* @__PURE__ */ jsx98(
+        /* @__PURE__ */ jsx99(
           Icon,
           {
             icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
@@ -17993,7 +18041,7 @@ var linkParameterIcon = css79`
 `;
 
 // src/components/ParameterInputs/ParameterDataResource.tsx
-import { jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx100, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
 function ParameterDataResource({
   label,
   labelLeadingIcon,
@@ -18017,12 +18065,12 @@ function ParameterDataResource({
         disabled: disabled2,
         onClick: onConnectDatasource,
         children: [
-          /* @__PURE__ */ jsx99("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx99(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
+          /* @__PURE__ */ jsx100("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx100(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
           children
         ]
       }
     ),
-    caption ? /* @__PURE__ */ jsx99(Caption, { children: caption }) : null
+    caption ? /* @__PURE__ */ jsx100(Caption, { children: caption }) : null
   ] });
 }
 
@@ -18048,19 +18096,19 @@ var ParameterDrawerHeaderTitle = css80`
 `;
 
 // src/components/ParameterInputs/ParameterDrawerHeader.tsx
-import { jsx as jsx100, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx101, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
 var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
   return /* @__PURE__ */ jsxs68("div", { css: ParameterDrawerHeaderContainer, children: [
     /* @__PURE__ */ jsxs68("header", { css: ParameterDrawerHeaderTitleGroup, children: [
       iconBeforeTitle,
-      /* @__PURE__ */ jsx100(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
+      /* @__PURE__ */ jsx101(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
     ] }),
     children
   ] });
 };
 
 // src/components/ParameterInputs/ParameterGroup.tsx
-import { forwardRef as forwardRef15 } from "react";
+import { forwardRef as forwardRef16 } from "react";
 
 // src/components/ParameterInputs/styles/ParameterGroup.styles.ts
 import { css as css81 } from "@emotion/react";
@@ -18083,18 +18131,18 @@ var fieldsetLegend2 = css81`
 `;
 
 // src/components/ParameterInputs/ParameterGroup.tsx
-import { jsx as jsx101, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
-var ParameterGroup = forwardRef15(
+import { jsx as jsx102, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
+var ParameterGroup = forwardRef16(
   ({ legend, isDisabled, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs69("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
-      /* @__PURE__ */ jsx101("legend", { css: fieldsetLegend2, children: legend }),
+      /* @__PURE__ */ jsx102("legend", { css: fieldsetLegend2, children: legend }),
       children
     ] });
   }
 );
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { forwardRef as forwardRef17, useDeferredValue } from "react";
+import { forwardRef as forwardRef18, useDeferredValue } from "react";
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
 import { useState as useState12 } from "react";
@@ -18138,32 +18186,32 @@ var previewModalImage = css82`
 `;
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
-import { Fragment as Fragment13, jsx as jsx102, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
 function ParameterImagePreview({ imageSrc }) {
   const [showModal, setShowModal] = useState12(false);
   return imageSrc ? /* @__PURE__ */ jsxs70("div", { css: previewWrapper, children: [
-    /* @__PURE__ */ jsx102(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
-    /* @__PURE__ */ jsx102(
+    /* @__PURE__ */ jsx103(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
+    /* @__PURE__ */ jsx103(
       "button",
       {
         css: previewLink,
         onClick: () => {
           setShowModal(true);
         },
-        children: /* @__PURE__ */ jsx102(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
+        children: /* @__PURE__ */ jsx103(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
       }
     )
   ] }) : null;
 }
 var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
-  return open ? /* @__PURE__ */ jsx102(Fragment13, { children: createPortal2(
-    /* @__PURE__ */ jsx102(
+  return open ? /* @__PURE__ */ jsx103(Fragment13, { children: createPortal2(
+    /* @__PURE__ */ jsx103(
       Modal,
       {
         header: "Image Preview",
         onRequestClose,
-        buttonGroup: /* @__PURE__ */ jsx102(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
-        children: /* @__PURE__ */ jsx102("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx102(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
+        buttonGroup: /* @__PURE__ */ jsx103(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
+        children: /* @__PURE__ */ jsx103("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx103(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
       }
     ),
     document.body
@@ -18175,21 +18223,21 @@ import { css as css84 } from "@emotion/react";
 import { useState as useState13 } from "react";
 
 // src/components/ParameterInputs/ParameterLabel.tsx
-import { jsx as jsx103 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx104 } from "@emotion/react/jsx-runtime";
 var ParameterLabel = ({ id, asSpan, children, ...props }) => {
-  return !asSpan ? /* @__PURE__ */ jsx103("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx103("span", { "aria-labelledby": id, css: labelText2, children });
+  return !asSpan ? /* @__PURE__ */ jsx104("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx104("span", { "aria-labelledby": id, css: labelText2, children });
 };
 
 // src/components/ParameterInputs/ParameterMenuButton.tsx
-import { forwardRef as forwardRef16 } from "react";
-import { jsx as jsx104 } from "@emotion/react/jsx-runtime";
-var ParameterMenuButton = forwardRef16(
+import { forwardRef as forwardRef17 } from "react";
+import { jsx as jsx105 } from "@emotion/react/jsx-runtime";
+var ParameterMenuButton = forwardRef17(
   ({ label, children }, ref) => {
-    return /* @__PURE__ */ jsx104(
+    return /* @__PURE__ */ jsx105(
       Menu,
       {
         menuLabel: `${label} menu`,
-        menuTrigger: /* @__PURE__ */ jsx104(
+        menuTrigger: /* @__PURE__ */ jsx105(
           "button",
           {
             className: "parameter-menu",
@@ -18197,7 +18245,7 @@ var ParameterMenuButton = forwardRef16(
             type: "button",
             "aria-label": `${label} options`,
             ref,
-            children: /* @__PURE__ */ jsx104(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
+            children: /* @__PURE__ */ jsx105(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
           }
         ),
         children
@@ -18233,7 +18281,7 @@ var overrideMarker = css83`
 `;
 
 // src/components/ParameterInputs/ParameterShell.tsx
-import { jsx as jsx105, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx106, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
 var extractParameterProps = (props) => {
   const {
     id,
@@ -18308,7 +18356,7 @@ var ParameterShell = ({
       labelTrailingIcon != null ? labelTrailingIcon : null
     ] }),
     /* @__PURE__ */ jsxs71("div", { css: inputWrapper, children: [
-      actionItems ? /* @__PURE__ */ jsx105(
+      actionItems ? /* @__PURE__ */ jsx106(
         "div",
         {
           css: [
@@ -18321,8 +18369,8 @@ var ParameterShell = ({
           children: actionItems
         }
       ) : null,
-      menuItems ? /* @__PURE__ */ jsx105(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
-      /* @__PURE__ */ jsx105(
+      menuItems ? /* @__PURE__ */ jsx106(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
+      /* @__PURE__ */ jsx106(
         ParameterShellContext.Provider,
         {
           value: {
@@ -18332,14 +18380,14 @@ var ParameterShell = ({
             errorMessage: errorMessaging,
             handleManuallySetErrorMessage: (message) => setErrorMessage(message)
           },
-          children: isParameterGroup ? /* @__PURE__ */ jsx105("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs71(ParameterShellPlaceholder, { children: [
+          children: isParameterGroup ? /* @__PURE__ */ jsx106("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs71(ParameterShellPlaceholder, { children: [
             children,
-            hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx105(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
+            hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx106(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
           ] })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx105(
+    /* @__PURE__ */ jsx106(
       FieldMessage,
       {
         helperMessageTestId: captionTestId,
@@ -18353,27 +18401,27 @@ var ParameterShell = ({
   ] });
 };
 var ParameterShellPlaceholder = ({ children }) => {
-  return /* @__PURE__ */ jsx105("div", { css: emptyParameterShell, children });
+  return /* @__PURE__ */ jsx106("div", { css: emptyParameterShell, children });
 };
-var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx105(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx105("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx105("span", { hidden: true, children: "reset overridden value to default" }) }) });
+var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx106(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx106("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx106("span", { hidden: true, children: "reset overridden value to default" }) }) });
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { Fragment as Fragment14, jsx as jsx106, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
-var ParameterImage = forwardRef17(
+import { Fragment as Fragment14, jsx as jsx107, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
+var ParameterImage = forwardRef18(
   ({ children, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
     return /* @__PURE__ */ jsxs72(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
-      /* @__PURE__ */ jsx106(ParameterImageInner, { ref, ...innerProps }),
+      /* @__PURE__ */ jsx107(ParameterImageInner, { ref, ...innerProps }),
       children
     ] });
   }
 );
-var ParameterImageInner = forwardRef17((props, ref) => {
+var ParameterImageInner = forwardRef18((props, ref) => {
   const { value } = props;
   const { id, label, hiddenLabel, errorMessage } = useParameterShell();
   const deferredValue = useDeferredValue(value);
   return /* @__PURE__ */ jsxs72(Fragment14, { children: [
-    /* @__PURE__ */ jsx106(
+    /* @__PURE__ */ jsx107(
       "input",
       {
         css: input3,
@@ -18385,21 +18433,21 @@ var ParameterImageInner = forwardRef17((props, ref) => {
         ...props
       }
     ),
-    errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx106(ParameterImagePreview, { imageSrc: deferredValue })
+    errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx107(ParameterImagePreview, { imageSrc: deferredValue })
   ] });
 });
 
 // src/components/ParameterInputs/ParameterInput.tsx
-import { forwardRef as forwardRef18 } from "react";
-import { jsx as jsx107 } from "@emotion/react/jsx-runtime";
-var ParameterInput = forwardRef18((props, ref) => {
+import { forwardRef as forwardRef19 } from "react";
+import { jsx as jsx108 } from "@emotion/react/jsx-runtime";
+var ParameterInput = forwardRef19((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx107(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx107(ParameterInputInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx108(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx108(ParameterInputInner, { ref, ...innerProps }) });
 });
-var ParameterInputInner = forwardRef18(
+var ParameterInputInner = forwardRef19(
   ({ ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
-    return /* @__PURE__ */ jsx107(
+    return /* @__PURE__ */ jsx108(
       "input",
       {
         css: input3,
@@ -18415,19 +18463,19 @@ var ParameterInputInner = forwardRef18(
 );
 
 // src/components/ParameterInputs/ParameterLink.tsx
-import { forwardRef as forwardRef19 } from "react";
-import { jsx as jsx108, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
-var ParameterLink = forwardRef19(
+import { forwardRef as forwardRef20 } from "react";
+import { jsx as jsx109, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
+var ParameterLink = forwardRef20(
   ({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsx108(
+    return /* @__PURE__ */ jsx109(
       ParameterShell,
       {
         "data-testid": "link-parameter-editor",
         ...shellProps,
         label: innerProps.value ? shellProps.label : "",
         title: !innerProps.value ? shellProps.label : void 0,
-        children: /* @__PURE__ */ jsx108(
+        children: /* @__PURE__ */ jsx109(
           ParameterLinkInner,
           {
             onConnectLink,
@@ -18440,13 +18488,13 @@ var ParameterLink = forwardRef19(
     );
   }
 );
-var ParameterLinkInner = forwardRef19(
+var ParameterLinkInner = forwardRef20(
   ({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
     if (!props.value)
-      return /* @__PURE__ */ jsx108("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
+      return /* @__PURE__ */ jsx109("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
     return /* @__PURE__ */ jsxs73("div", { css: inputWrapper, children: [
-      /* @__PURE__ */ jsx108(
+      /* @__PURE__ */ jsx109(
         "input",
         {
           type: "text",
@@ -18459,7 +18507,7 @@ var ParameterLinkInner = forwardRef19(
         }
       ),
       /* @__PURE__ */ jsxs73("div", { css: linkParameterControls, children: [
-        /* @__PURE__ */ jsx108(
+        /* @__PURE__ */ jsx109(
           "button",
           {
             type: "button",
@@ -18470,7 +18518,7 @@ var ParameterLinkInner = forwardRef19(
             children: "edit"
           }
         ),
-        externalLink ? /* @__PURE__ */ jsx108(
+        externalLink ? /* @__PURE__ */ jsx109(
           "a",
           {
             href: externalLink,
@@ -18478,7 +18526,7 @@ var ParameterLinkInner = forwardRef19(
             title: "Open link in new tab",
             target: "_blank",
             rel: "noopener noreferrer",
-            children: /* @__PURE__ */ jsx108(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
+            children: /* @__PURE__ */ jsx109(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
           }
         ) : null
       ] })
@@ -18487,15 +18535,15 @@ var ParameterLinkInner = forwardRef19(
 );
 
 // src/components/ParameterInputs/ParameterMultiSelect.tsx
-import { jsx as jsx109 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx110 } from "@emotion/react/jsx-runtime";
 var ParameterMultiSelect = ({ disabled: disabled2 = false, ...props }) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx109(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx109(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
+  return /* @__PURE__ */ jsx110(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx110(ParameterMultiSelectInner, { isDisabled: disabled2, ...innerProps }) });
 };
 var ParameterMultiSelectInner = (props) => {
   var _a;
   const { id, label } = useParameterShell();
-  return /* @__PURE__ */ jsx109(
+  return /* @__PURE__ */ jsx110(
     InputComboBox,
     {
       ...props,
@@ -18539,7 +18587,7 @@ var ParameterMultiSelectInner = (props) => {
 };
 
 // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
-import { Fragment as Fragment15, jsx as jsx110, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx111, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
 var ParameterNameAndPublicIdInput = ({
   id,
   onBlur,
@@ -18566,7 +18614,7 @@ var ParameterNameAndPublicIdInput = ({
   };
   autoFocus == null ? void 0 : autoFocus();
   return /* @__PURE__ */ jsxs74(Fragment15, { children: [
-    /* @__PURE__ */ jsx110(
+    /* @__PURE__ */ jsx111(
       ParameterInput,
       {
         id: nameIdField,
@@ -18585,7 +18633,7 @@ var ParameterNameAndPublicIdInput = ({
         value: values[nameIdField]
       }
     ),
-    /* @__PURE__ */ jsx110(
+    /* @__PURE__ */ jsx111(
       ParameterInput,
       {
         id: publicIdFieldName,
@@ -18599,11 +18647,11 @@ var ParameterNameAndPublicIdInput = ({
         caption: !publicIdError ? publicIdCaption : void 0,
         placeholder: publicIdPlaceholderText,
         errorMessage: publicIdError,
-        menuItems: /* @__PURE__ */ jsx110(
+        menuItems: /* @__PURE__ */ jsx111(
           MenuItem,
           {
             disabled: !values[publicIdFieldName],
-            icon: /* @__PURE__ */ jsx110(Icon, { icon: "path-trim", iconColor: "currentColor" }),
+            icon: /* @__PURE__ */ jsx111(Icon, { icon: "path-trim", iconColor: "currentColor" }),
             onClick: handleCopyPidFieldValue,
             children: "Copy"
           }
@@ -18611,7 +18659,7 @@ var ParameterNameAndPublicIdInput = ({
         value: values[publicIdFieldName]
       }
     ),
-    (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx110(Callout, { type: "caution", children: warnOverLength.message }) : null
+    (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx111(Callout, { type: "caution", children: warnOverLength.message }) : null
   ] });
 };
 
@@ -19001,7 +19049,7 @@ var getSelectedNode = (selection) => {
 };
 
 // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
-import { Fragment as Fragment16, jsx as jsx111, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx112, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
 var isProjectMapLinkValue = (value) => {
   return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
     value.nodeId && value.path && value.projectMapId
@@ -19445,7 +19493,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
     });
   };
   return /* @__PURE__ */ jsxs75(Fragment16, { children: [
-    /* @__PURE__ */ jsx111(
+    /* @__PURE__ */ jsx112(
       NodeEventPlugin,
       {
         nodeType: LinkNode,
@@ -19455,7 +19503,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
         }
       }
     ),
-    linkPopoverState ? /* @__PURE__ */ jsx111(
+    linkPopoverState ? /* @__PURE__ */ jsx112(
       "div",
       {
         css: linkPopover,
@@ -19465,7 +19513,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
         },
         ref: linkPopoverElRef,
         children: /* @__PURE__ */ jsxs75("div", { css: linkPopoverContainer, children: [
-          linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx111(
+          linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx112(
             "a",
             {
               href: parsePath(
@@ -19477,7 +19525,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
               children: parsePath(linkPopoverState.node.__link.path)
             }
           ),
-          /* @__PURE__ */ jsx111(
+          /* @__PURE__ */ jsx112(
             Button,
             {
               size: "xs",
@@ -19485,7 +19533,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
                 onEditLinkNode(linkPopoverState.node);
               },
               buttonType: "ghost",
-              children: /* @__PURE__ */ jsx111(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
+              children: /* @__PURE__ */ jsx112(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
             }
           )
         ] })
@@ -19510,7 +19558,7 @@ import {
   INDENT_CONTENT_COMMAND
 } from "lexical";
 import { useEffect as useEffect14 } from "react";
-import { jsx as jsx112 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx113 } from "@emotion/react/jsx-runtime";
 function isIndentPermitted(maxDepth) {
   const selection = $getSelection2();
   if (!$isRangeSelection2(selection)) {
@@ -19540,7 +19588,7 @@ function ListIndentPlugin({ maxDepth }) {
       COMMAND_PRIORITY_CRITICAL
     );
   }, [editor, maxDepth]);
-  return /* @__PURE__ */ jsx112(TabIndentationPlugin, {});
+  return /* @__PURE__ */ jsx113(TabIndentationPlugin, {});
 }
 
 // src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
@@ -19567,7 +19615,7 @@ import {
   SELECTION_CHANGE_COMMAND
 } from "lexical";
 import { useCallback as useCallback9, useEffect as useEffect15, useMemo as useMemo4, useState as useState15 } from "react";
-import { Fragment as Fragment17, jsx as jsx113, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx114, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
 var toolbar = css87`
   background: var(--gray-50);
   border-radius: var(--rounded-base);
@@ -19619,7 +19667,7 @@ var toolbarChevron = css87`
   margin-left: var(--spacing-xs);
 `;
 var RichTextToolbarIcon = ({ icon }) => {
-  return /* @__PURE__ */ jsx113(Icon, { icon, css: toolbarIcon, size: "1rem" });
+  return /* @__PURE__ */ jsx114(Icon, { icon, css: toolbarIcon, size: "1rem" });
 };
 var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
   ["bold", "format-bold"],
@@ -19736,7 +19784,7 @@ var RichTextToolbar = ({ config, customControls }) => {
         menuTrigger: /* @__PURE__ */ jsxs76("button", { css: richTextToolbarButton, title: "Text styles", children: [
           visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
           " ",
-          /* @__PURE__ */ jsx113(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
+          /* @__PURE__ */ jsx114(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
         placement: "bottom-start",
         children: [
@@ -19746,7 +19794,7 @@ var RichTextToolbar = ({ config, customControls }) => {
               type: "paragraph"
             },
             ...visibleTextualElements
-          ].map((element) => /* @__PURE__ */ jsx113(
+          ].map((element) => /* @__PURE__ */ jsx114(
             MenuItem,
             {
               onClick: () => {
@@ -19756,12 +19804,12 @@ var RichTextToolbar = ({ config, customControls }) => {
             },
             element.type
           )),
-          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx113(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
+          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx114(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
         ]
       }
     ),
     visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs76("div", { css: toolbarGroup, children: [
-      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx113(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx113(
+      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx114(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx114(
         "button",
         {
           onClick: () => {
@@ -19771,16 +19819,16 @@ var RichTextToolbar = ({ config, customControls }) => {
             richTextToolbarButton,
             activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
           ],
-          children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
+          children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
         }
       ) }, format.type)),
-      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx113(
+      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx114(
         Menu,
         {
           menuLabel: "Alternative text styles",
-          menuTrigger: /* @__PURE__ */ jsx113("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx113(Icon, { icon: "more-alt", css: toolbarIcon }) }),
+          menuTrigger: /* @__PURE__ */ jsx114("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx114(Icon, { icon: "more-alt", css: toolbarIcon }) }),
           placement: "bottom-start",
-          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx113(
+          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx114(
             MenuItem,
             {
               onClick: () => {
@@ -19794,18 +19842,18 @@ var RichTextToolbar = ({ config, customControls }) => {
       ) : null
     ] }) : null,
     visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs76("div", { css: toolbarGroup, children: [
-      linkElementVisible ? /* @__PURE__ */ jsx113(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx113(
+      linkElementVisible ? /* @__PURE__ */ jsx114(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx114(
         "button",
         {
           onClick: () => {
             isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
           },
           css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: "link" })
+          children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: "link" })
         }
       ) }) : null,
       visibleLists.size > 0 ? /* @__PURE__ */ jsxs76(Fragment17, { children: [
-        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx113(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx113(
+        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx114(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx114(
           "button",
           {
             onClick: () => {
@@ -19815,10 +19863,10 @@ var RichTextToolbar = ({ config, customControls }) => {
               richTextToolbarButton,
               activeElement === "unorderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: "layout-list" })
+            children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: "layout-list" })
           }
         ) }) : null,
-        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx113(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx113(
+        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx114(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx114(
           "button",
           {
             onClick: () => {
@@ -19828,32 +19876,32 @@ var RichTextToolbar = ({ config, customControls }) => {
               richTextToolbarButton,
               activeElement === "orderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: "layout-list-numbered" })
+            children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: "layout-list-numbered" })
           }
         ) }) : null
       ] }) : null,
-      quoteElementVisible ? /* @__PURE__ */ jsx113(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx113(
+      quoteElementVisible ? /* @__PURE__ */ jsx114(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx114(
         "button",
         {
           onClick: () => {
             activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
           },
           css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: "quote" })
+          children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: "quote" })
         }
       ) }) : null,
-      codeElementVisible ? /* @__PURE__ */ jsx113(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx113(
+      codeElementVisible ? /* @__PURE__ */ jsx114(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx114(
         "button",
         {
           onClick: () => {
             activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
           },
           css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx113(RichTextToolbarIcon, { icon: "code-slash" })
+          children: /* @__PURE__ */ jsx114(RichTextToolbarIcon, { icon: "code-slash" })
         }
       ) }) : null
     ] }) : null,
-    customControls ? /* @__PURE__ */ jsx113("div", { css: toolbarGroup, children: customControls }) : null
+    customControls ? /* @__PURE__ */ jsx114("div", { css: toolbarGroup, children: customControls }) : null
   ] });
 };
 var RichTextToolbar_default = RichTextToolbar;
@@ -19967,7 +20015,7 @@ var useRichTextToolbarState = ({ config }) => {
 };
 
 // src/components/ParameterInputs/ParameterRichText.tsx
-import { Fragment as Fragment18, jsx as jsx114, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx115, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
 var ParameterRichText = ({
   label,
   labelLeadingIcon,
@@ -20006,7 +20054,7 @@ var ParameterRichText = ({
       captionTestId,
       menuItems,
       children: [
-        /* @__PURE__ */ jsx114(
+        /* @__PURE__ */ jsx115(
           ParameterRichTextInner,
           {
             value,
@@ -20024,7 +20072,7 @@ var ParameterRichText = ({
             children
           }
         ),
-        menuItems ? /* @__PURE__ */ jsx114(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx114(Fragment18, { children: menuItems }) }) : null
+        menuItems ? /* @__PURE__ */ jsx115(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx115(Fragment18, { children: menuItems }) }) : null
       ]
     }
   );
@@ -20136,7 +20184,7 @@ var ParameterRichTextInner = ({
     editable: !readOnly
   };
   return /* @__PURE__ */ jsxs77(Fragment18, { children: [
-    /* @__PURE__ */ jsx114("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx114(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx114(
+    /* @__PURE__ */ jsx115("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx115(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx115(
       RichText,
       {
         onChange,
@@ -20196,19 +20244,19 @@ var RichText = ({
     editor.setEditable(!readOnly);
   }, [editor, readOnly]);
   return /* @__PURE__ */ jsxs77(Fragment18, { children: [
-    readOnly ? null : /* @__PURE__ */ jsx114(RichTextToolbar_default, { config, customControls }),
+    readOnly ? null : /* @__PURE__ */ jsx115(RichTextToolbar_default, { config, customControls }),
     /* @__PURE__ */ jsxs77("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
-      /* @__PURE__ */ jsx114(
+      /* @__PURE__ */ jsx115(
         RichTextPlugin,
         {
-          contentEditable: /* @__PURE__ */ jsx114(ContentEditable, { css: editorInput, className: editorInputClassName }),
-          placeholder: /* @__PURE__ */ jsx114("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
+          contentEditable: /* @__PURE__ */ jsx115(ContentEditable, { css: editorInput, className: editorInputClassName }),
+          placeholder: /* @__PURE__ */ jsx115("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
           ErrorBoundary: LexicalErrorBoundary
         }
       ),
-      /* @__PURE__ */ jsx114(ListPlugin, {}),
-      readOnly ? null : /* @__PURE__ */ jsx114(HistoryPlugin, {}),
-      /* @__PURE__ */ jsx114(
+      /* @__PURE__ */ jsx115(ListPlugin, {}),
+      readOnly ? null : /* @__PURE__ */ jsx115(HistoryPlugin, {}),
+      /* @__PURE__ */ jsx115(
         LinkNodePlugin,
         {
           onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
@@ -20218,24 +20266,24 @@ var RichText = ({
           } : void 0
         }
       ),
-      /* @__PURE__ */ jsx114(ListIndentPlugin, { maxDepth: 4 }),
-      /* @__PURE__ */ jsx114(DisableStylesPlugin, {}),
-      /* @__PURE__ */ jsx114(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
-      /* @__PURE__ */ jsx114(Fragment18, { children })
+      /* @__PURE__ */ jsx115(ListIndentPlugin, { maxDepth: 4 }),
+      /* @__PURE__ */ jsx115(DisableStylesPlugin, {}),
+      /* @__PURE__ */ jsx115(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
+      /* @__PURE__ */ jsx115(Fragment18, { children })
     ] })
   ] });
 };
 
 // src/components/ParameterInputs/ParameterSelect.tsx
-import { forwardRef as forwardRef20 } from "react";
-import { jsx as jsx115, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
-var ParameterSelect = forwardRef20(
+import { forwardRef as forwardRef21 } from "react";
+import { jsx as jsx116, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
+var ParameterSelect = forwardRef21(
   ({ defaultOption, options, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsx115(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx115(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
+    return /* @__PURE__ */ jsx116(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx116(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
   }
 );
-var ParameterSelectInner = forwardRef20(
+var ParameterSelectInner = forwardRef21(
   ({ defaultOption, options, ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
     return /* @__PURE__ */ jsxs78(
@@ -20247,10 +20295,10 @@ var ParameterSelectInner = forwardRef20(
         ref,
         ...props,
         children: [
-          defaultOption ? /* @__PURE__ */ jsx115("option", { value: "", children: defaultOption }) : null,
+          defaultOption ? /* @__PURE__ */ jsx116("option", { value: "", children: defaultOption }) : null,
           options.map((option) => {
             var _a;
-            return /* @__PURE__ */ jsx115("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
+            return /* @__PURE__ */ jsx116("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
           })
         ]
       }
@@ -20259,15 +20307,15 @@ var ParameterSelectInner = forwardRef20(
 );
 
 // src/components/ParameterInputs/ParameterTextarea.tsx
-import { forwardRef as forwardRef21 } from "react";
-import { jsx as jsx116 } from "@emotion/react/jsx-runtime";
-var ParameterTextarea = forwardRef21((props, ref) => {
+import { forwardRef as forwardRef22 } from "react";
+import { jsx as jsx117 } from "@emotion/react/jsx-runtime";
+var ParameterTextarea = forwardRef22((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx116(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx116(ParameterTextareaInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx117(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx117(ParameterTextareaInner, { ref, ...innerProps }) });
 });
-var ParameterTextareaInner = forwardRef21(({ ...props }, ref) => {
+var ParameterTextareaInner = forwardRef22(({ ...props }, ref) => {
   const { id, label, hiddenLabel } = useParameterShell();
-  return /* @__PURE__ */ jsx116(
+  return /* @__PURE__ */ jsx117(
     "textarea",
     {
       css: [input3, textarea2],
@@ -20280,18 +20328,18 @@ var ParameterTextareaInner = forwardRef21(({ ...props }, ref) => {
 });
 
 // src/components/ParameterInputs/ParameterToggle.tsx
-import { forwardRef as forwardRef22 } from "react";
-import { jsx as jsx117, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
-var ParameterToggle = forwardRef22((props, ref) => {
+import { forwardRef as forwardRef23 } from "react";
+import { jsx as jsx118, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
+var ParameterToggle = forwardRef23((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx117(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx117(ParameterToggleInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx118(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx118(ParameterToggleInner, { ref, ...innerProps }) });
 });
-var ParameterToggleInner = forwardRef22(
+var ParameterToggleInner = forwardRef23(
   ({ children, ...props }, ref) => {
     const { id, label } = useParameterShell();
     return /* @__PURE__ */ jsxs79("label", { css: inputToggleLabel2, children: [
-      /* @__PURE__ */ jsx117("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
-      /* @__PURE__ */ jsx117("span", { css: inlineLabel2, children: label }),
+      /* @__PURE__ */ jsx118("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
+      /* @__PURE__ */ jsx118("span", { css: inlineLabel2, children: label }),
       children
     ] });
   }
@@ -20352,7 +20400,7 @@ var bar = css89`
 `;
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { jsx as jsx118 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx119 } from "@emotion/react/jsx-runtime";
 function ProgressBar({
   current,
   max,
@@ -20362,7 +20410,7 @@ function ProgressBar({
 }) {
   const valueNow = Math.min(current, max);
   const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
-  return /* @__PURE__ */ jsx118(
+  return /* @__PURE__ */ jsx119(
     "div",
     {
       css: container3,
@@ -20373,7 +20421,7 @@ function ProgressBar({
       "aria-valuemax": max,
       "aria-valuenow": valueNow,
       ...props,
-      children: /* @__PURE__ */ jsx118(
+      children: /* @__PURE__ */ jsx119(
         "div",
         {
           css: [
@@ -20413,7 +20461,7 @@ var progressListItemStyles = css90`
 `;
 
 // src/components/ProgressList/ProgressList.tsx
-import { jsx as jsx119, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx120, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
 var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
   const itemsWithStatus = useMemo5(() => {
     const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
@@ -20427,8 +20475,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
       return { ...item, status };
     });
   }, [items, inProgressId]);
-  return /* @__PURE__ */ jsx119("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
-    return /* @__PURE__ */ jsx119(
+  return /* @__PURE__ */ jsx120("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
+    return /* @__PURE__ */ jsx120(
       ProgressListItem,
       {
         status,
@@ -20487,10 +20535,10 @@ var ProgressListItem = ({
     return colorPerStatus[status];
   }, [status, error, errorLevel]);
   return /* @__PURE__ */ jsxs80("li", { css: [progressListItemStyles, statusStyles], children: [
-    /* @__PURE__ */ jsx119(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx119("div", { children: /* @__PURE__ */ jsx119(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
+    /* @__PURE__ */ jsx120(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx120("div", { children: /* @__PURE__ */ jsx120(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
     /* @__PURE__ */ jsxs80("div", { children: [
       children,
-      /* @__PURE__ */ jsx119("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
+      /* @__PURE__ */ jsx120("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
     ] })
   ] });
 };
@@ -20622,7 +20670,7 @@ var segmentedControlLabelContentStyles = css92`
 var segmentedControlLabelTextStyles = css92``;
 
 // src/components/SegmentedControl/SegmentedControl.tsx
-import { jsx as jsx120, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx121, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
 var SegmentedControl = ({
   name,
   options,
@@ -20656,7 +20704,7 @@ var SegmentedControl = ({
   const isIconOnly = useMemo6(() => {
     return options.every((option) => option && option.icon && !option.label);
   }, [options]);
-  return /* @__PURE__ */ jsx120(
+  return /* @__PURE__ */ jsx121(
     "div",
     {
       css: [segmentedControlStyles, orientation === "vertical" ? segmentedControlVerticalStyles : void 0],
@@ -20669,7 +20717,7 @@ var SegmentedControl = ({
         }
         const text = option.label ? option.label : option.icon ? null : String(option.value);
         const isDisabled = disabled2 || option.disabled;
-        return /* @__PURE__ */ jsx120(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx120(
+        return /* @__PURE__ */ jsx121(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx121(
           "div",
           {
             css: segmentedControlItemStyles,
@@ -20683,7 +20731,7 @@ var SegmentedControl = ({
                   isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
                 ],
                 children: [
-                  /* @__PURE__ */ jsx120(
+                  /* @__PURE__ */ jsx121(
                     "input",
                     {
                       css: segmentedControlInputStyles,
@@ -20695,10 +20743,10 @@ var SegmentedControl = ({
                       disabled: isDisabled
                     }
                   ),
-                  option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx120(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
+                  option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx121(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
                   /* @__PURE__ */ jsxs81("span", { css: segmentedControlLabelContentStyles, children: [
-                    !option.icon ? null : /* @__PURE__ */ jsx120(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
-                    !text || hideOptionText ? null : /* @__PURE__ */ jsx120("span", { css: segmentedControlLabelTextStyles, children: text })
+                    !option.icon ? null : /* @__PURE__ */ jsx121(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
+                    !text || hideOptionText ? null : /* @__PURE__ */ jsx121("span", { css: segmentedControlLabelTextStyles, children: text })
                   ] })
                 ]
               }
@@ -20722,7 +20770,7 @@ var skeletonStyles = css94`
 `;
 
 // src/components/Skeleton/Skeleton.tsx
-import { jsx as jsx121 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx122 } from "@emotion/react/jsx-runtime";
 var Skeleton = ({
   width = "100%",
   height = "1.25rem",
@@ -20730,7 +20778,7 @@ var Skeleton = ({
   circle = false,
   children,
   ...otherProps
-}) => /* @__PURE__ */ jsx121(
+}) => /* @__PURE__ */ jsx122(
   "div",
   {
     css: [
@@ -20837,7 +20885,7 @@ var SwitchText = css95`
 `;
 
 // src/components/Switch/Switch.tsx
-import { Fragment as Fragment19, jsx as jsx122, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx123, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
 var Switch = React24.forwardRef(
   ({ label, infoText, toggleText, children, ...inputProps }, ref) => {
     let additionalText = infoText;
@@ -20846,10 +20894,10 @@ var Switch = React24.forwardRef(
     }
     return /* @__PURE__ */ jsxs82(Fragment19, { children: [
       /* @__PURE__ */ jsxs82("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
-        /* @__PURE__ */ jsx122("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
-        /* @__PURE__ */ jsx122("span", { css: SwitchInputLabel, children: label })
+        /* @__PURE__ */ jsx123("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
+        /* @__PURE__ */ jsx123("span", { css: SwitchInputLabel, children: label })
       ] }),
-      additionalText ? /* @__PURE__ */ jsx122("p", { css: SwitchText, children: additionalText }) : null,
+      additionalText ? /* @__PURE__ */ jsx123("p", { css: SwitchText, children: additionalText }) : null,
       children
     ] });
   }
@@ -20886,40 +20934,40 @@ var tableCellHead = css96`
 `;
 
 // src/components/Table/Table.tsx
-import { jsx as jsx123 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx124 } from "@emotion/react/jsx-runtime";
 var Table = React25.forwardRef(
   ({ children, cellPadding, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("table", { ref, css: table({ cellPadding }), ...otherProps, children });
+    return /* @__PURE__ */ jsx124("table", { ref, css: table({ cellPadding }), ...otherProps, children });
   }
 );
 var TableHead = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("thead", { ref, css: tableHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("thead", { ref, css: tableHead, ...otherProps, children });
   }
 );
 var TableBody = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("tbody", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("tbody", { ref, ...otherProps, children });
   }
 );
 var TableFoot = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("tfoot", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("tfoot", { ref, ...otherProps, children });
   }
 );
 var TableRow = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("tr", { ref, css: tableRow, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("tr", { ref, css: tableRow, ...otherProps, children });
   }
 );
 var TableCellHead = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("th", { ref, css: tableCellHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("th", { ref, css: tableCellHead, ...otherProps, children });
   }
 );
 var TableCellData = React25.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx123("td", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx124("td", { ref, ...otherProps, children });
   }
 );
 
@@ -20959,7 +21007,7 @@ var tabButtonGroupStyles = css97`
 `;
 
 // src/components/Tabs/Tabs.tsx
-import { jsx as jsx124 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx125 } from "@emotion/react/jsx-runtime";
 var useCurrentTab = () => {
   const context = useAriakitTabStore();
   if (!context) {
@@ -20997,23 +21045,23 @@ var Tabs = ({
       tab.setSelectedId(selected);
     }
   }, [selected, tab]);
-  return /* @__PURE__ */ jsx124(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
+  return /* @__PURE__ */ jsx125(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
 };
 var TabButtonGroup = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx124(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
+  return /* @__PURE__ */ jsx125(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
 };
 var TabButton = ({
   children,
   id,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx124(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
+  return /* @__PURE__ */ jsx125(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
 };
 var TabContent = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx124(AriakitTabPanel, { ...props, children });
+  return /* @__PURE__ */ jsx125(AriakitTabPanel, { ...props, children });
 };
 
 // src/components/Toast/Toast.tsx
@@ -21244,9 +21292,9 @@ var toastContainerStyles = css98`
 `;
 
 // src/components/Toast/Toast.tsx
-import { jsx as jsx125 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx126 } from "@emotion/react/jsx-runtime";
 var ToastContainer = ({ limit = 4 }) => {
-  return /* @__PURE__ */ jsx125(
+  return /* @__PURE__ */ jsx126(
     ToastifyContainer,
     {
       css: toastContainerStyles,
@@ -21339,7 +21387,7 @@ var StatusDeleted = css99`
 `;
 
 // src/components/Validation/StatusBullet.tsx
-import { jsx as jsx126 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx127 } from "@emotion/react/jsx-runtime";
 var StatusBullet = ({
   status,
   hideText = false,
@@ -21359,7 +21407,7 @@ var StatusBullet = ({
     Deleted: StatusDeleted
   };
   const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
-  return /* @__PURE__ */ jsx126(
+  return /* @__PURE__ */ jsx127(
     "span",
     {
       role: "status",
@@ -21447,10 +21495,12 @@ export {
   LoadingOverlay,
   MediaCard,
   Menu,
+  MenuButton2 as MenuButton,
   MenuGroup,
   MenuItem,
   MenuItemInner,
   MenuItemSeparator,
+  MenuThreeDots,
   Modal,
   ModalDialog,
   MultilineChip,