@uniformdev/design-system 19.42.1-alpha.7 → 19.45.1

package/dist/esm/index.js

@@ -1,6 +1,4 @@
-// ../../scripts/emotion-jsx-shim.js
-import { jsx } from "@emotion/react";
-import * as React from "react";
+import "./chunk-6NI3O2RY.js";
 
 // src/styles/Theme.tsx
 import { Fragment, jsx as jsx2, jsxs } from "@emotion/react/jsx-runtime";
@@ -1008,11 +1006,13 @@ var AddButton = ({
 };
 
 // src/components/AddListButton/AddListButton.tsx
-import { CgAdd, CgAddR, CgMathPlus } from "react-icons/cg";
+import { CgAdd } from "@react-icons/all-files/cg/CgAdd";
+import { CgAddR } from "@react-icons/all-files/cg/CgAddR";
+import { CgMathPlus } from "@react-icons/all-files/cg/CgMathPlus";
 
 // src/components/Icons/customIcons.tsx
-import { GenIcon } from "react-icons";
-import { MdSettings } from "react-icons/md";
+import { GenIcon } from "@react-icons/all-files";
+import { MdSettings } from "@react-icons/all-files/md/MdSettings";
 
 // src/components/Icons/Icon.tsx
 import React3 from "react";
@@ -1048,7 +1048,6 @@ var IconColorAccentLight = css8`
 `;
 
 // src/components/Icons/IconsProvider.tsx
-import { paramCase } from "param-case";
 import { createContext, useContext as useContext2, useEffect as useEffect3, useState as useState2 } from "react";
 import { jsx as jsx5 } from "@emotion/react/jsx-runtime";
 var IconContext = createContext({
@@ -1064,15 +1063,8 @@ function IconsProvider({ children }) {
   const [isLoading, setIsLoading] = useState2(true);
   const [iconsMap, setIconsMap] = useState2({});
   const initializeIconsMap = async () => {
-    const allCssGgIcons = await import("react-icons/cg");
-    const iconMap = Object.entries(allCssGgIcons).reduce((map, [key, icon]) => {
-      if (key === "default") {
-        return map;
-      }
-      const iconName = getIconNameFromCssGgComponentName(key);
-      return { ...map, [iconName]: icon };
-    }, {});
-    setIconsMap({ ...iconMap, ...customIcons });
+    const { importedIcons } = await import("./importedIcons-GRLD5JXK.js");
+    setIconsMap({ ...importedIcons, ...customIcons });
     setIsLoading(false);
   };
   useEffect3(() => {
@@ -1080,10 +1072,6 @@ function IconsProvider({ children }) {
   }, []);
   return /* @__PURE__ */ jsx5(IconContext.Provider, { value: { iconsMap, isLoading }, children });
 }
-function getIconNameFromCssGgComponentName(cssGgComponentName) {
-  var _a, _b;
-  return (_b = (_a = paramCase(cssGgComponentName.replace("Cg", "")).match(/[a-z]+|\d+/gi)) == null ? void 0 : _a.join("-")) != null ? _b : "";
-}
 
 // src/components/Icons/Icon.tsx
 import { jsx as jsx6 } from "@emotion/react/jsx-runtime";
@@ -1814,7 +1802,7 @@ var AddListButton = ({
 };
 
 // src/components/Alerts/InlineAlert.tsx
-import { CgClose } from "react-icons/cg";
+import { CgClose } from "@react-icons/all-files/cg/CgClose";
 
 // src/components/Typography/styles/Heading.styles.ts
 import { css as css10 } from "@emotion/react";
@@ -1978,8 +1966,8 @@ var Badge = ({
 };
 
 // src/components/Typography/Link.tsx
+import { CgExternal } from "@react-icons/all-files/cg/CgExternal";
 import * as React4 from "react";
-import { CgExternal } from "react-icons/cg";
 
 // src/components/Typography/styles/Link.styles.ts
 import { css as css12 } from "@emotion/react";
@@ -2197,7 +2185,7 @@ var IntegrationHeaderSection = ({
 };
 
 // src/components/Typography/PageHeaderSection.tsx
-import { CgChevronLeft } from "react-icons/cg";
+import { CgChevronLeft } from "@react-icons/all-files/cg/CgChevronLeft";
 
 // src/components/Typography/styles/PageHeaderSection.styles.ts
 import { css as css15 } from "@emotion/react";
@@ -11008,7 +10996,7 @@ var AvatarGroup = ({
 };
 
 // src/components/Banner/Banner.tsx
-import { CgClose as CgClose2 } from "react-icons/cg";
+import { CgClose as CgClose2 } from "@react-icons/all-files/cg/CgClose";
 
 // src/components/Banner/Banner.styles.ts
 import { css as css21 } from "@emotion/react";
@@ -11334,7 +11322,7 @@ var Button = React6.forwardRef(
 );
 
 // src/components/ButtonWithMenu/ButtonWithMenu.tsx
-import { CgChevronDown } from "react-icons/cg";
+import { CgChevronDown } from "@react-icons/all-files/cg/CgChevronDown";
 
 // src/components/Menu/Menu.tsx
 import * as React8 from "react";
@@ -11514,21 +11502,31 @@ var Menu = ({
   menuItemsContainerCssClasses,
   children,
   forceVisible,
-  disableAutoSeparatorManagement
+  disableAutoSeparatorManagement,
+  withoutPortal = false
 }) => {
   const menuState = useMenuState({ placement, visible: forceVisible });
+  const [isRendered, setIsRendered] = React8.useState(false);
   React8.useEffect(() => {
     if (forceVisible !== void 0) {
       menuState.setVisible(forceVisible);
     }
-  });
+  }, [forceVisible, menuState]);
+  React8.useEffect(() => {
+    if (menuState.visible) {
+      setIsRendered(true);
+    }
+  }, [menuState.visible, setIsRendered]);
+  const Wrapper = withoutPortal ? React8.Fragment : Portal;
   return /* @__PURE__ */ jsxs15(MenuContext.Provider, { value: menuState, children: [
     /* @__PURE__ */ jsx25(MenuButton, { ...menuState, ref: menuTrigger.ref, ...menuTrigger.props, children: (triggerProps) => React8.cloneElement(menuTrigger, triggerProps) }),
-    /* @__PURE__ */ jsx25(Portal, { children: /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx25(Wrapper, { children: /* @__PURE__ */ jsx25(
       BaseMenu,
       {
         ...menuState,
+        focusable: false,
         "aria-label": menuLabel,
+        ...!isRendered ? { unstable_popoverStyles: { position: "absolute", opacity: "0" } } : void 0,
         css: [
           menu,
           typeof menuItemsContainerCssClasses === "object" ? menuItemsContainerCssClasses : void 0
@@ -12031,7 +12029,7 @@ var Callout = ({
 };
 
 // src/components/Card/Card.tsx
-import { CgMoreAlt } from "react-icons/cg";
+import { CgMoreAlt } from "@react-icons/all-files/cg/CgMoreAlt";
 
 // src/components/Card/Card.styles.ts
 import { css as css29 } from "@emotion/react";
@@ -12151,7 +12149,7 @@ var CardContainer2 = ({
 };
 
 // src/components/Card/LoadingCardSkeleton.tsx
-import { CgMoreAlt as CgMoreAlt2 } from "react-icons/cg";
+import { CgMoreAlt as CgMoreAlt2 } from "@react-icons/all-files/cg/CgMoreAlt";
 
 // src/components/Layout/styles/Container.styles.ts
 import { css as css31 } from "@emotion/react";
@@ -12345,7 +12343,7 @@ var LoadingCardSkeleton2 = () => {
 };
 
 // src/components/Chip/Chip.tsx
-import { CgClose as CgClose3 } from "react-icons/cg";
+import { CgClose as CgClose3 } from "@react-icons/all-files/cg/CgClose";
 
 // src/components/Chip/Chip.styles.ts
 import { css as css36 } from "@emotion/react";
@@ -12539,7 +12537,7 @@ var ChipActionButton = css36`
 `;
 
 // src/components/Chip/Chip.tsx
-import { Fragment as Fragment5, jsx as jsx37, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx37, jsxs as jsxs22 } from "@emotion/react/jsx-runtime";
 var chipTheme = {
   "accent-light": ChipThemeAccentLight,
   "accent-dark": ChipThemeAccentDark,
@@ -12562,7 +12560,7 @@ var Chip = ({
     md: ChipMedium
   };
   return /* @__PURE__ */ jsxs22("span", { css: [ChipContainer, chipSize[size], chipTheme[theme]], ...props, children: [
-    icon ? /* @__PURE__ */ jsxs22(Fragment5, { children: [
+    icon ? /* @__PURE__ */ jsxs22(Fragment6, { children: [
       /* @__PURE__ */ jsx37("span", { role: "presentation", css: [ChipIcon], children: /* @__PURE__ */ jsx37(Icon, { icon, iconColor: "currentColor", size: "1rem" }) }),
       /* @__PURE__ */ jsx37("span", { role: "separator", css: ChipSeparator })
     ] }) : null,
@@ -12771,8 +12769,9 @@ var DashedBox = ({
 };
 
 // src/components/DescriptionList/DescriptionList.tsx
+import { TbCheck } from "@react-icons/all-files/tb/TbCheck";
+import { TbMinus } from "@react-icons/all-files/tb/TbMinus";
 import React10 from "react";
-import { TbCheck, TbMinus } from "react-icons/tb";
 
 // src/components/DescriptionList/DescriptionList.styles.ts
 import { css as css40 } from "@emotion/react";
@@ -12818,7 +12817,6 @@ import * as React11 from "react";
 // src/components/Details/Details.styles.ts
 import { css as css41 } from "@emotion/react";
 var details = css41`
-  cursor: pointer;
   &[open] {
     & > summary svg {
       rotate: 0deg;
@@ -12831,6 +12829,7 @@ var detailsContent = css41`
 `;
 var summary = css41`
   align-items: center;
+  cursor: pointer;
   display: grid;
   grid-template-columns: 1.25rem 1fr;
   gap: var(--spacing-sm);
@@ -12897,9 +12896,9 @@ var Details = ({
 };
 
 // src/components/Drawer/Drawer.tsx
-import React13, { createContext as createContext4, useContext as useContext5, useEffect as useEffect5, useRef as useRef3, useState as useState5 } from "react";
+import { CgChevronRight } from "@react-icons/all-files/cg/CgChevronRight";
+import React13, { createContext as createContext4, useContext as useContext5, useEffect as useEffect5, useRef as useRef3, useState as useState6 } from "react";
 import { createPortal } from "react-dom";
-import { CgChevronRight } from "react-icons/cg";
 
 // src/components/Drawer/Drawer.styles.ts
 import { css as css42, keyframes as keyframes2 } from "@emotion/react";
@@ -13009,7 +13008,7 @@ var drawerWrapperOverlayStyles = css42`
 `;
 
 // src/components/Drawer/DrawerProvider.tsx
-import { createContext as createContext3, useCallback, useContext as useContext4, useRef as useRef2, useState as useState4 } from "react";
+import { createContext as createContext3, useCallback, useContext as useContext4, useRef as useRef2, useState as useState5 } from "react";
 import { jsx as jsx43 } from "@emotion/react/jsx-runtime";
 var DrawerContext = createContext3({
   providerId: "",
@@ -13023,7 +13022,7 @@ function renderDrawerId(drawer) {
   return `${drawer.stackId ? `\u{1F95E} ${drawer.stackId} ` : ""}\u{1F194} ${drawer.id}${drawer.instanceKey ? ` \u{1F511} ${drawer.instanceKey}` : ""}`;
 }
 var DrawerProvider = ({ children }) => {
-  const [drawersRegistry, setDrawersRegistry] = useState4([]);
+  const [drawersRegistry, setDrawersRegistry] = useState5([]);
   const providerId = useRef2(crypto.randomUUID());
   useShortcut({
     handler: () => {
@@ -13144,7 +13143,7 @@ var DrawerInner = ({
 }) => {
   const { registerDrawer, unregisterDrawer, providerId } = useDrawer();
   const closeButtonRef = useRef3(null);
-  const [rendererElement, setRendererElement] = useState5(null);
+  const [rendererElement, setRendererElement] = useState6(null);
   useEffect5(() => {
     registerDrawer({
       drawer: {
@@ -13253,7 +13252,7 @@ var DrawerContent2 = ({ children, buttonGroup, noPadding = false, ...props }) =>
 
 // src/components/Drawer/DrawerRenderer.tsx
 import { useEffect as useEffect6, useMemo as useMemo2 } from "react";
-import { Fragment as Fragment6, jsx as jsx46, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx46, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
 var drawerWidth = {
   narrow: "29rem",
   medium: "43rem",
@@ -13342,7 +13341,7 @@ var DrawerWrapper = ({
     offsetInPx = Math.round(maxLayeringInPx * relativeLevel);
   }
   const calculatedWidth = `calc(${width} - ${offsetInPx}px)`;
-  return /* @__PURE__ */ jsxs28(Fragment6, { children: [
+  return /* @__PURE__ */ jsxs28(Fragment7, { children: [
     /* @__PURE__ */ jsx46("div", { css: drawerWrapperOverlayStyles, onClick: onOverlayClick }),
     /* @__PURE__ */ jsx46(
       "div",
@@ -13474,7 +13473,7 @@ var CheckboxWithInfo = forwardRef4(
 );
 
 // src/components/Input/ErrorMessage.tsx
-import { MdWarning } from "react-icons/md";
+import { MdWarning } from "@react-icons/all-files/md/MdWarning";
 
 // src/components/Input/styles/ErrorMessage.styles.ts
 import { css as css46 } from "@emotion/react";
@@ -13549,7 +13548,7 @@ var Fieldset = React15.forwardRef(
 );
 
 // src/components/Input/InfoMessage.tsx
-import { MdInfoOutline } from "react-icons/md";
+import { MdInfoOutline } from "@react-icons/all-files/md/MdInfoOutline";
 
 // src/components/Input/styles/InfoMessage.styles.tsx
 import { css as css48 } from "@emotion/react";
@@ -13594,7 +13593,7 @@ var Label = ({ children, className, testId, ...props }) => {
 };
 
 // src/components/Input/WarningMessage.tsx
-import { MdWarning as MdWarning2 } from "react-icons/md";
+import { MdWarning as MdWarning2 } from "@react-icons/all-files/md/MdWarning";
 
 // src/components/Input/styles/WarningMessage.styles.tsx
 import { css as css49 } from "@emotion/react";
@@ -13632,52 +13631,60 @@ var Input = React16.forwardRef(
     labelTestId,
     errorTestId,
     captionTestId,
+    classNameRoot,
     classNameContainer,
     classNameControl,
     classNameLabel,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxs34("div", { css: inputContainer, "data-testid": containerTestId ? containerTestId : "container-input-field", children: [
-      showLabel ? /* @__PURE__ */ jsx54(
-        Label,
-        {
-          htmlFor: id,
-          css: [labelText, typeof classNameLabel === "object" ? classNameLabel : void 0],
-          className: typeof classNameLabel === "string" ? classNameLabel : "",
-          testId: labelTestId,
-          children: label
-        }
-      ) : null,
-      /* @__PURE__ */ jsxs34(
-        "div",
-        {
-          css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
-          className: typeof classNameContainer === "string" ? classNameContainer : "",
-          children: [
-            /* @__PURE__ */ jsx54(
-              "input",
-              {
-                id,
-                css: [
-                  input("nowrap"),
-                  typeof classNameControl === "object" ? classNameControl : void 0,
-                  errorMessage ? inputError : void 0,
-                  icon ? inputWithIcon : ""
-                ],
-                "aria-label": !showLabel ? label : void 0,
-                className: typeof classNameControl === "string" ? classNameControl : "",
-                ...props,
-                ref
-              }
-            ),
-            icon ? /* @__PURE__ */ jsx54("div", { css: inputIcon, children: icon }) : null
-          ]
-        }
-      ),
-      caption ? /* @__PURE__ */ jsx54(Caption, { testId: captionTestId, children: caption }) : null,
-      errorMessage ? /* @__PURE__ */ jsx54(ErrorMessage, { message: errorMessage, testId: errorTestId }) : null,
-      warningMessage && !errorMessage ? /* @__PURE__ */ jsx54(WarningMessage, { message: warningMessage }) : null
-    ] });
+    return /* @__PURE__ */ jsxs34(
+      "div",
+      {
+        css: [inputContainer, typeof classNameRoot === "object" ? classNameRoot : void 0],
+        "data-testid": containerTestId ? containerTestId : "container-input-field",
+        children: [
+          showLabel ? /* @__PURE__ */ jsx54(
+            Label,
+            {
+              htmlFor: id,
+              css: [labelText, typeof classNameLabel === "object" ? classNameLabel : void 0],
+              className: typeof classNameLabel === "string" ? classNameLabel : "",
+              testId: labelTestId,
+              children: label
+            }
+          ) : null,
+          /* @__PURE__ */ jsxs34(
+            "div",
+            {
+              css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
+              className: typeof classNameContainer === "string" ? classNameContainer : "",
+              children: [
+                /* @__PURE__ */ jsx54(
+                  "input",
+                  {
+                    id,
+                    css: [
+                      input("nowrap"),
+                      typeof classNameControl === "object" ? classNameControl : void 0,
+                      errorMessage ? inputError : void 0,
+                      icon ? inputWithIcon : ""
+                    ],
+                    "aria-label": !showLabel ? label : void 0,
+                    className: typeof classNameControl === "string" ? classNameControl : "",
+                    ...props,
+                    ref
+                  }
+                ),
+                icon ? /* @__PURE__ */ jsx54("div", { css: inputIcon, children: icon }) : null
+              ]
+            }
+          ),
+          caption ? /* @__PURE__ */ jsx54(Caption, { testId: captionTestId, children: caption }) : null,
+          errorMessage ? /* @__PURE__ */ jsx54(ErrorMessage, { message: errorMessage, testId: errorTestId }) : null,
+          warningMessage && !errorMessage ? /* @__PURE__ */ jsx54(WarningMessage, { message: warningMessage }) : null
+        ]
+      }
+    );
   }
 );
 
@@ -13816,8 +13823,8 @@ function InputComboBox(props) {
 
 // src/components/Input/InputInlineSelect.tsx
 import { css as css51 } from "@emotion/react";
-import { useRef as useRef4, useState as useState6 } from "react";
-import { CgChevronDown as CgChevronDown2 } from "react-icons/cg";
+import { CgChevronDown as CgChevronDown2 } from "@react-icons/all-files/cg/CgChevronDown";
+import { useRef as useRef4, useState as useState7 } from "react";
 
 // src/components/Input/styles/InputInlineSelect.styles.ts
 import { css as css50 } from "@emotion/react";
@@ -13896,7 +13903,7 @@ var InputInlineSelect = ({
   ...props
 }) => {
   var _a;
-  const [menuVisible, setMenuVisible] = useState6(false);
+  const [menuVisible, setMenuVisible] = useState7(false);
   const divRef = useRef4(null);
   useOutsideClick(divRef, () => setMenuVisible(false));
   const selected = options.find((option) => option.value === value);
@@ -13956,7 +13963,8 @@ var InputInlineSelect = ({
 };
 
 // src/components/Input/InputKeywordSearch.tsx
-import { CgClose as CgClose4, CgSearch } from "react-icons/cg";
+import { CgClose as CgClose4 } from "@react-icons/all-files/cg/CgClose";
+import { CgSearch } from "@react-icons/all-files/cg/CgSearch";
 import { jsx as jsx57 } from "@emotion/react/jsx-runtime";
 var InputKeywordSearch = ({
   onSearchTextChanged,
@@ -14004,7 +14012,7 @@ var InputKeywordSearch = ({
 };
 
 // src/components/Input/InputSelect.tsx
-import { Fragment as Fragment7, jsx as jsx58, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx58, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
 var InputSelect = ({
   label,
   defaultOption,
@@ -14026,7 +14034,7 @@ var InputSelect = ({
       css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
       className: typeof classNameContainer === "string" ? classNameContainer : "",
       children: [
-        showLabel ? /* @__PURE__ */ jsx58(Fragment7, { children: /* @__PURE__ */ jsxs36(
+        showLabel ? /* @__PURE__ */ jsx58(Fragment8, { children: /* @__PURE__ */ jsxs36(
           Label,
           {
             htmlFor: props.id,
@@ -14120,7 +14128,7 @@ var Legend = ({ children }) => {
 };
 
 // src/components/Input/SuccessMessage.tsx
-import { CgCheckO } from "react-icons/cg";
+import { CgCheckO } from "@react-icons/all-files/cg/CgCheckO";
 
 // src/components/Input/styles/SuccessMessage.styles.ts
 import { css as css52 } from "@emotion/react";
@@ -14148,10 +14156,10 @@ var SuccessMessage = ({ message, testId, ...props }) => {
 
 // src/components/Input/Textarea.tsx
 import { forwardRef as forwardRef8 } from "react";
-import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx62, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
 var Textarea = forwardRef8(
   ({ label, icon, id, caption, showLabel = true, errorMessage, warningMessage, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs39(Fragment8, { children: [
+    return /* @__PURE__ */ jsxs39(Fragment9, { children: [
       showLabel ? /* @__PURE__ */ jsx62("label", { htmlFor: id, css: [labelText], children: label }) : null,
       /* @__PURE__ */ jsxs39("div", { css: [inputContainer], children: [
         /* @__PURE__ */ jsx62(
@@ -14180,7 +14188,8 @@ var Textarea = forwardRef8(
 
 // src/components/Tiles/CreateTeamIntegrationTile.tsx
 import { css as css54 } from "@emotion/react";
-import { CgAdd as CgAdd2, CgChevronRight as CgChevronRight2 } from "react-icons/cg";
+import { CgAdd as CgAdd2 } from "@react-icons/all-files/cg/CgAdd";
+import { CgChevronRight as CgChevronRight2 } from "@react-icons/all-files/cg/CgChevronRight";
 
 // src/components/Tiles/styles/IntegrationTile.styles.ts
 import { css as css53 } from "@emotion/react";
@@ -14360,7 +14369,9 @@ var CreateTeamIntegrationTile = ({
 };
 
 // src/components/Tiles/IntegrationBadges.tsx
-import { CgCheck, CgLock, CgSandClock } from "react-icons/cg";
+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 jsx64, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
 var IntegrationedAddedBadge = ({ text = "Added" }) => {
   return /* @__PURE__ */ jsxs41("span", { "data-testid": "integration-icon-installed", css: IntegrationAddedText, children: [
@@ -14437,8 +14448,8 @@ var EditTeamIntegrationTile = ({
 
 // src/components/Tiles/IntegrationComingSoon.tsx
 import { css as css55 } from "@emotion/react";
-import { useEffect as useEffect7, useState as useState7 } from "react";
-import { CgHeart } from "react-icons/cg";
+import { CgHeart } from "@react-icons/all-files/cg/CgHeart";
+import { useEffect as useEffect7, useState as useState8 } from "react";
 import { jsx as jsx67, jsxs as jsxs43 } from "@emotion/react/jsx-runtime";
 var IntegrationComingSoon = ({
   name,
@@ -14448,7 +14459,7 @@ var IntegrationComingSoon = ({
   timing = 1e3,
   ...props
 }) => {
-  const [upVote, setUpVote] = useState7(false);
+  const [upVote, setUpVote] = useState8(false);
   const handleUpVoteInteraction = () => {
     setUpVote((prev) => !prev);
     onUpVoteClick();
@@ -14549,10 +14560,10 @@ var IntegrationLoadingFrame = css56`
 `;
 
 // src/components/Tiles/IntegrationLoadingTile.tsx
-import { Fragment as Fragment9, jsx as jsx68, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx68, jsxs as jsxs44 } from "@emotion/react/jsx-runtime";
 var IntegrationLoadingTile = ({ count = 1 }) => {
   const componentCount = Array.from(Array(count).keys());
-  return /* @__PURE__ */ jsx68(Fragment9, { children: componentCount.map((i) => /* @__PURE__ */ jsxs44("div", { css: IntegrationLoadingTileContainer, children: [
+  return /* @__PURE__ */ jsx68(Fragment10, { children: componentCount.map((i) => /* @__PURE__ */ jsxs44("div", { css: IntegrationLoadingTileContainer, children: [
     /* @__PURE__ */ jsx68("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
     /* @__PURE__ */ jsx68("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
   ] }, i)) });
@@ -14774,7 +14785,7 @@ var IntegrationModalHeaderContentWrapper = css61`
 `;
 
 // src/components/IntegrationModalHeader/IntegrationModalHeader.tsx
-import { Fragment as Fragment10, jsx as jsx74, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx74, jsxs as jsxs47 } from "@emotion/react/jsx-runtime";
 var HexModalBackground = ({ ...props }) => {
   return /* @__PURE__ */ jsxs47(
     "svg",
@@ -14815,7 +14826,7 @@ var HexModalBackground = ({ ...props }) => {
   );
 };
 var IntegrationModalHeader = ({ icon, name, menu: menu2, children }) => {
-  return /* @__PURE__ */ jsxs47(Fragment10, { children: [
+  return /* @__PURE__ */ jsxs47(Fragment11, { children: [
     /* @__PURE__ */ jsx74(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
     /* @__PURE__ */ jsx74("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs47("div", { css: IntegrationModalHeaderTitleGroup, children: [
       icon ? /* @__PURE__ */ jsx74(IntegrationModalIcon, { icon, name: name || "" }) : null,
@@ -15027,7 +15038,7 @@ var ScrollableList = ({ label, children, ...props }) => {
 };
 
 // src/components/List/ScrollableListInputItem.tsx
-import { CgCheck as CgCheck2 } from "react-icons/cg";
+import { CgCheck as CgCheck2 } from "@react-icons/all-files/cg/CgCheck";
 
 // src/components/List/styles/ScrollableListItem.styles.ts
 import { css as css66 } from "@emotion/react";
@@ -15136,7 +15147,7 @@ var ScrollableListInputItem = ({
 };
 
 // src/components/List/ScrollableListItem.tsx
-import { CgCheck as CgCheck3 } from "react-icons/cg";
+import { CgCheck as CgCheck3 } from "@react-icons/all-files/cg/CgCheck";
 import { jsx as jsx80, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
 var ScrollableListItem = ({
   buttonText,
@@ -15348,8 +15359,8 @@ var LoadingIcon = ({ height, width, ...props }) => {
 };
 
 // src/components/Modal/Modal.tsx
+import { CgClose as CgClose5 } from "@react-icons/all-files/cg/CgClose";
 import React19 from "react";
-import { CgClose as CgClose5 } from "react-icons/cg";
 
 // src/components/Modal/Modal.styles.ts
 import { css as css69 } from "@emotion/react";
@@ -15437,6 +15448,7 @@ var Modal = React19.forwardRef(
               css: modalCloseButtonStyles,
               title: "Close dialog",
               buttonType: "ghost",
+              "data-testid": "close-dialog",
               children: /* @__PURE__ */ jsx83(Icon, { icon: CgClose5, iconColor: "gray", size: 24 })
             }
           )
@@ -15897,7 +15909,8 @@ var ParameterGroup = forwardRef9(
 import { forwardRef as forwardRef11, useDeferredValue } from "react";
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
-import { useCallback as useCallback3, useEffect as useEffect9, useState as useState8 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect9, useState as useState9 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
 
 // src/utils/url.ts
 var isValidUrl = (url, options = {}) => {
@@ -15975,9 +15988,9 @@ var previewModalImage = css74`
 `;
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
-import { Fragment as Fragment11, jsx as jsx88, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx88, jsxs as jsxs60 } from "@emotion/react/jsx-runtime";
 function ParameterImagePreview({ imageSrc }) {
-  const [showModal, setShowModal] = useState8(false);
+  const [showModal, setShowModal] = useState9(false);
   return imageSrc ? /* @__PURE__ */ jsxs60("div", { css: previewWrapper, children: [
     /* @__PURE__ */ jsx88(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
     /* @__PURE__ */ jsx88(
@@ -15993,20 +16006,23 @@ function ParameterImagePreview({ imageSrc }) {
   ] }) : null;
 }
 var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
-  return open ? /* @__PURE__ */ jsx88(
-    Modal,
-    {
-      header: "Image Preview",
-      onRequestClose,
-      withoutContentPadding: true,
-      buttonGroup: /* @__PURE__ */ jsx88(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
-      children: /* @__PURE__ */ jsx88("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx88(Image, { src: imageSrc, css: previewModalImage }) })
-    }
-  ) : null;
+  return open ? /* @__PURE__ */ jsx88(Fragment12, { children: createPortal2(
+    /* @__PURE__ */ jsx88(
+      Modal,
+      {
+        header: "Image Preview",
+        onRequestClose,
+        withoutContentPadding: true,
+        buttonGroup: /* @__PURE__ */ jsx88(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
+        children: /* @__PURE__ */ jsx88("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx88(Image, { src: imageSrc, css: previewModalImage }) })
+      }
+    ),
+    document.body
+  ) }) : null;
 };
 var Image = ({ src, className }) => {
-  const [loading, setLoading] = useState8(false);
-  const [loadErrorText, setLoadErrorText] = useState8("");
+  const [loading, setLoading] = useState9(false);
+  const [loadErrorText, setLoadErrorText] = useState9("");
   const errorText = "The text you provided is not a valid URL";
   const updateImageSrc = useCallback3(() => {
     let message = "";
@@ -16057,7 +16073,7 @@ var Image = ({ src, className }) => {
             "data-testid": "parameter-image-preview"
           }
         ) : null,
-        src && loadErrorText ? /* @__PURE__ */ jsxs60(Fragment11, { children: [
+        src && loadErrorText ? /* @__PURE__ */ jsxs60(Fragment12, { children: [
           /* @__PURE__ */ jsx88(BrokenImage, { css: [brokenImage, img, imgLoaded] }),
           /* @__PURE__ */ jsx88(ErrorMessage, { message: loadErrorText })
         ] }) : null
@@ -16099,7 +16115,7 @@ var BrokenImage = ({ ...props }) => {
 };
 
 // src/components/ParameterInputs/ParameterShell.tsx
-import { useState as useState9 } from "react";
+import { useState as useState10 } from "react";
 
 // src/components/ParameterInputs/ParameterLabel.tsx
 import { jsx as jsx89 } from "@emotion/react/jsx-runtime";
@@ -16219,7 +16235,7 @@ var ParameterShell = ({
   children,
   ...props
 }) => {
-  const [manualErrorMessage, setManualErrorMessage] = useState9(void 0);
+  const [manualErrorMessage, setManualErrorMessage] = useState10(void 0);
   const setErrorMessage = (message) => setManualErrorMessage(message);
   const errorMessaging = errorMessage || manualErrorMessage;
   return /* @__PURE__ */ jsxs61("div", { css: inputContainer2, ...props, children: [
@@ -16262,7 +16278,7 @@ var ParameterShellPlaceholder = ({ children }) => {
 var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx91(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx91("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx91("span", { hidden: true, children: "reset overridden value to default" }) }) });
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { Fragment as Fragment12, jsx as jsx92, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx92, jsxs as jsxs62 } from "@emotion/react/jsx-runtime";
 var ParameterImage = forwardRef11(
   ({ children, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
@@ -16276,7 +16292,7 @@ var ParameterImageInner = forwardRef11((props, ref) => {
   const { value } = props;
   const { id, label, hiddenLabel, errorMessage } = useParameterShell();
   const deferredValue = useDeferredValue(value);
-  return /* @__PURE__ */ jsxs62(Fragment12, { children: [
+  return /* @__PURE__ */ jsxs62(Fragment13, { children: [
     /* @__PURE__ */ jsx92(
       "input",
       {
@@ -16391,7 +16407,7 @@ var ParameterLinkInner = forwardRef13(
 );
 
 // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
-import { Fragment as Fragment13, jsx as jsx95, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx95, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
 var ParameterNameAndPublicIdInput = ({
   id,
   onBlur,
@@ -16417,7 +16433,7 @@ var ParameterNameAndPublicIdInput = ({
     navigator.clipboard.writeText(values[publicIdFieldName]);
   };
   autoFocus == null ? void 0 : autoFocus();
-  return /* @__PURE__ */ jsxs64(Fragment13, { children: [
+  return /* @__PURE__ */ jsxs64(Fragment14, { children: [
     /* @__PURE__ */ jsx95(
       ParameterInput,
       {
@@ -16815,13 +16831,17 @@ import {
   ElementNode as ElementNode2,
   FOCUS_COMMAND
 } from "lexical";
-import { useCallback as useCallback4, useEffect as useEffect11, useRef as useRef6, useState as useState10 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect11, useRef as useRef6, useState as useState11 } from "react";
 
 // src/components/Popover/Popover.styles.ts
 import { css as css77 } from "@emotion/react";
 var PopoverBtn = css77`
   border: none;
   background: none;
+`;
+var PopoverDefaulterTriggerBtn = css77`
+  border: none;
+  background: none;
   padding: var(--spacing-2xs);
   border-radius: var(--rounded-full);
 
@@ -16878,7 +16898,7 @@ var getSelectedNode = (selection) => {
 };
 
 // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
-import { Fragment as Fragment14, jsx as jsx96, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx96, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
 var isProjectMapLinkValue = (value) => {
   return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
     value.nodeId && value.path && value.projectMapId
@@ -17183,10 +17203,10 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
     return path;
   };
   const [editor] = useLexicalComposerContext2();
-  const [linkPopoverState, setLinkPopoverState] = useState10();
+  const [linkPopoverState, setLinkPopoverState] = useState11();
   const linkPopoverElRef = useRef6(null);
-  const [isEditorFocused, setIsEditorFocused] = useState10(false);
-  const [isLinkPopoverFocused, setIsLinkPopoverFocused] = useState10(false);
+  const [isEditorFocused, setIsEditorFocused] = useState11(false);
+  const [isLinkPopoverFocused, setIsLinkPopoverFocused] = useState11(false);
   useEffect11(() => {
     if (!isEditorFocused && !isLinkPopoverFocused) {
       setLinkPopoverState(void 0);
@@ -17321,7 +17341,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
       });
     });
   };
-  return /* @__PURE__ */ jsxs65(Fragment14, { children: [
+  return /* @__PURE__ */ jsxs65(Fragment15, { children: [
     /* @__PURE__ */ jsx96(
       NodeEventPlugin,
       {
@@ -17443,8 +17463,8 @@ import {
   FORMAT_TEXT_COMMAND,
   SELECTION_CHANGE_COMMAND
 } from "lexical";
-import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo3, useState as useState11 } from "react";
-import { Fragment as Fragment15, jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
+import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo3, useState as useState12 } from "react";
+import { Fragment as Fragment16, jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
 var toolbar = css79`
   background: var(--gray-50);
   border-radius: var(--rounded-base);
@@ -17681,7 +17701,7 @@ var RichTextToolbar = ({ config, customControls }) => {
           children: /* @__PURE__ */ jsx98(RichTextToolbarIcon, { icon: "link" })
         }
       ) }) : null,
-      visibleLists.size > 0 ? /* @__PURE__ */ jsxs66(Fragment15, { children: [
+      visibleLists.size > 0 ? /* @__PURE__ */ jsxs66(Fragment16, { children: [
         visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx98(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx98(
           "button",
           {
@@ -17754,7 +17774,7 @@ var useRichTextToolbarState = ({ config }) => {
   const enabledBuiltInFormatsWithoutIcon = enabledBuiltInFormats.filter(
     (format) => !FORMATS_WITH_ICON.has(format.type)
   );
-  const [activeFormats, setActiveFormats] = useState11([]);
+  const [activeFormats, setActiveFormats] = useState12([]);
   const visibleFormatsWithIcon = useMemo3(() => {
     const visibleFormats = /* @__PURE__ */ new Set();
     activeFormats.filter((type) => FORMATS_WITH_ICON.has(type)).forEach((type) => {
@@ -17775,7 +17795,7 @@ var useRichTextToolbarState = ({ config }) => {
     });
     return richTextBuiltInFormats.filter((format) => visibleFormats.has(format.type));
   }, [activeFormats, enabledBuiltInFormatsWithoutIcon]);
-  const [activeElement, setActiveElement] = useState11("paragraph");
+  const [activeElement, setActiveElement] = useState12("paragraph");
   const enabledTextualElements = enabledBuiltInElements.filter(
     (element) => TEXTUAL_ELEMENTS.includes(element.type)
   );
@@ -17790,7 +17810,7 @@ var useRichTextToolbarState = ({ config }) => {
       }
     );
   }, [activeElement, (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.builtIn, enabledTextualElements]);
-  const [isLink, setIsLink] = useState11(false);
+  const [isLink, setIsLink] = useState12(false);
   const linkElementVisible = useMemo3(() => {
     return enabledBuiltInElements.some((element) => element.type === "link") || isLink;
   }, [isLink, enabledBuiltInElements]);
@@ -17844,7 +17864,7 @@ var useRichTextToolbarState = ({ config }) => {
 };
 
 // src/components/ParameterInputs/ParameterRichText.tsx
-import { Fragment as Fragment16, jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
 var ParameterRichText = ({
   label,
   labelLeadingIcon,
@@ -17901,7 +17921,7 @@ var ParameterRichText = ({
             children
           }
         ),
-        menuItems ? /* @__PURE__ */ jsx99(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx99(Fragment16, { children: menuItems }) }) : null
+        menuItems ? /* @__PURE__ */ jsx99(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx99(Fragment17, { children: menuItems }) }) : null
       ]
     }
   );
@@ -18012,7 +18032,7 @@ var ParameterRichTextInner = ({
     },
     editable: !readOnly
   };
-  return /* @__PURE__ */ jsxs67(Fragment16, { children: [
+  return /* @__PURE__ */ jsxs67(Fragment17, { children: [
     /* @__PURE__ */ jsx99("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx99(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx99(
       RichText,
       {
@@ -18069,7 +18089,7 @@ var RichText = ({
       removeUpdateListener();
     };
   }, []);
-  return /* @__PURE__ */ jsxs67(Fragment16, { children: [
+  return /* @__PURE__ */ jsxs67(Fragment17, { children: [
     readOnly ? null : /* @__PURE__ */ jsx99(RichTextToolbar_default, { config, customControls }),
     /* @__PURE__ */ jsxs67("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
       /* @__PURE__ */ jsx99(
@@ -18095,7 +18115,7 @@ var RichText = ({
       /* @__PURE__ */ jsx99(ListIndentPlugin, { maxDepth: 4 }),
       /* @__PURE__ */ jsx99(DisableStylesPlugin, {}),
       /* @__PURE__ */ jsx99(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
-      /* @__PURE__ */ jsx99(Fragment16, { children })
+      /* @__PURE__ */ jsx99(Fragment17, { children })
     ] })
   ] });
 };
@@ -18176,7 +18196,7 @@ import {
   PopoverDisclosure,
   usePopoverState
 } from "reakit/Popover";
-import { Fragment as Fragment17, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx103, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
 var Popover2 = ({
   iconColor = "action",
   icon = "info",
@@ -18185,23 +18205,35 @@ var Popover2 = ({
   ariaLabel,
   placement = "bottom",
   testId,
+  trigger,
   children,
   ...otherProps
 }) => {
   const popover = usePopoverState({ placement });
-  return /* @__PURE__ */ jsxs70(Fragment17, { children: [
-    /* @__PURE__ */ jsxs70(PopoverDisclosure, { ...popover, css: PopoverBtn, title: buttonText, "data-testid": testId, children: [
-      /* @__PURE__ */ jsx103(Icon, { icon, iconColor, size: iconSize }),
-      /* @__PURE__ */ jsx103("span", { hidden: true, children: buttonText })
-    ] }),
+  return /* @__PURE__ */ jsxs70(Fragment18, { children: [
+    /* @__PURE__ */ jsx103(
+      PopoverDisclosure,
+      {
+        ...popover,
+        css: [PopoverBtn, trigger ? void 0 : PopoverDefaulterTriggerBtn],
+        title: buttonText,
+        "data-testid": testId,
+        children: trigger ? trigger : /* @__PURE__ */ jsxs70(Fragment18, { children: [
+          /* @__PURE__ */ jsx103(Icon, { icon, iconColor, size: iconSize }),
+          /* @__PURE__ */ jsx103("span", { hidden: true, children: buttonText })
+        ] })
+      }
+    ),
     /* @__PURE__ */ jsx103(ReakitPopover, { css: Popover, ...otherProps, ...popover, role: "tooltip", "aria-label": ariaLabel, children })
   ] });
 };
 
 // src/components/ProgressList/ProgressList.tsx
 import { css as css82 } from "@emotion/react";
+import { CgCheckO as CgCheckO2 } from "@react-icons/all-files/cg/CgCheckO";
+import { CgRadioCheck } from "@react-icons/all-files/cg/CgRadioCheck";
+import { CgRecord } from "@react-icons/all-files/cg/CgRecord";
 import { useMemo as useMemo4 } from "react";
-import { CgCheckO as CgCheckO2, CgRadioCheck, CgRecord } from "react-icons/cg";
 
 // src/components/ProgressList/styles/ProgressList.styles.ts
 import { css as css81 } from "@emotion/react";
@@ -18253,7 +18285,7 @@ var ProgressListItem = ({
   errorLevel = "danger",
   autoEllipsis = false
 }) => {
-  const Icon2 = useMemo4(() => {
+  const icon = useMemo4(() => {
     if (error) {
       return warningIcon;
     }
@@ -18292,7 +18324,7 @@ var ProgressListItem = ({
     return colorPerStatus[status];
   }, [status, error, errorLevel]);
   return /* @__PURE__ */ jsxs71("li", { css: [progressListItemStyles, statusStyles], children: [
-    /* @__PURE__ */ jsx104(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx104("div", { children: /* @__PURE__ */ jsx104(Icon2, { size: 20 }) }) }),
+    /* @__PURE__ */ jsx104(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx104("div", { children: /* @__PURE__ */ jsx104(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
     /* @__PURE__ */ jsxs71("div", { children: [
       children,
       /* @__PURE__ */ jsx104("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
@@ -18302,8 +18334,8 @@ var ProgressListItem = ({
 
 // src/components/SegmentedControl/SegmentedControl.tsx
 import { css as css84 } from "@emotion/react";
+import { CgCheck as CgCheck4 } from "@react-icons/all-files/cg/CgCheck";
 import { useCallback as useCallback6, useMemo as useMemo5 } from "react";
-import { CgCheck as CgCheck4 } from "react-icons/cg";
 
 // src/components/SegmentedControl/SegmentedControl.styles.ts
 import { css as css83 } from "@emotion/react";
@@ -18493,7 +18525,7 @@ var SegmentedControl = ({
                   ),
                   option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx105(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
                   /* @__PURE__ */ jsxs72("span", { css: segmentedControlLabelContentStyles, children: [
-                    !option.icon ? null : /* @__PURE__ */ jsx105(option.icon, { size: "1.5em" }),
+                    !option.icon ? null : /* @__PURE__ */ jsx105(Icon, { icon: option.icon, size: "1.5em", iconColor: "currentColor" }),
                     !text ? null : /* @__PURE__ */ jsx105("span", { css: segmentedControlLabelTextStyles, children: text })
                   ] })
                 ]
@@ -18635,14 +18667,14 @@ var SwitchText = css86`
 `;
 
 // src/components/Switch/Switch.tsx
-import { Fragment as Fragment18, jsx as jsx107, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx107, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
 var Switch = React23.forwardRef(
   ({ label, infoText, toggleText, children, ...inputProps }, ref) => {
     let additionalText = infoText;
     if (infoText && toggleText) {
       additionalText = inputProps.checked ? toggleText : infoText;
     }
-    return /* @__PURE__ */ jsxs73(Fragment18, { children: [
+    return /* @__PURE__ */ jsxs73(Fragment19, { children: [
       /* @__PURE__ */ jsxs73("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
         /* @__PURE__ */ jsx107("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
         /* @__PURE__ */ jsx107("span", { css: SwitchInputLabel, children: label })