@dxc-technology/halstack-react 0.0.0-9559292 → 0.0.0-955a751

package/dist/index.js

@@ -1455,7 +1455,7 @@ var defaultTranslatedComponentLabels = {
     logoAlternativeText: "Logo"
   },
   applicationLayout: {
-    visibilityToggleTitle: "Toggle visibility sidenav"
+    visibilityToggleTitle: "Toggle sidenav visibility"
   },
   alert: {
     infoTitleText: "information",
@@ -7874,7 +7874,7 @@ var Chip_default = DxcChip;
 
 // src/layout/ApplicationLayout.tsx
 var import_react35 = require("react");
-var import_styled_components41 = __toESM(require("styled-components"));
+var import_styled_components42 = __toESM(require("styled-components"));
 
 // src/footer/Footer.tsx
 var import_react31 = require("react");
@@ -8233,15 +8233,126 @@ var Footer_default = DxcFooter;
 
 // src/header/Header.tsx
 var import_react32 = require("react");
+var import_styled_components39 = __toESM(require("styled-components"));
+
+// src/tooltip/Tooltip.tsx
+var Tooltip = __toESM(require("@radix-ui/react-tooltip"));
 var import_styled_components38 = __toESM(require("styled-components"));
 var import_jsx_runtime41 = require("react/jsx-runtime");
-var Dropdown = (props) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HeaderDropdown, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Dropdown_default, { ...props }) });
+var triangleIcon = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  "svg",
+  {
+    width: "12",
+    height: "6",
+    viewBox: "0 0 12 6",
+    xmlns: "http://www.w3.org/2000/svg",
+    preserveAspectRatio: "none",
+    display: "block",
+    children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+      "path",
+      {
+        d: "M0.351562 0L5.30131 4.94975C5.69184 5.34027 6.325 5.34027 6.71552 4.94975L11.6653 0H6.00842H0.351562Z",
+        fill: coreTokens_default.color_grey_800
+      }
+    )
+  }
+);
+var DxcTooltip = ({ position = "bottom", label, children }) => label ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Tooltip.Provider, { delayDuration: 300, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip.Root, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Tooltip.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTriggerContainer, { children }) }),
+  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(StyledTooltipContent, { side: position, sideOffset: 8, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContainer, { children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Tooltip.Arrow, { asChild: true, "aria-hidden": true, children: triangleIcon })
+  ] }) })
+] }) }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children });
+var TooltipTriggerContainer = import_styled_components38.default.div`
+  display: inline-flex;
+  position: relative;
+`;
+var StyledTooltipContent = (0, import_styled_components38.default)(Tooltip.Content)`
+  z-index: 2147483647;
+
+  animation-duration: 0.2s;
+  animation-timing-function: ease-out;
+
+  /* Additional optimization to prevent blurry text in certain browsers */
+  -webkit-font-smoothing: antialiased;
+  transform: translateZ(0) scale(1, 1);
+
+  &[data-side="top"] {
+    animation-name: slideUp;
+  }
+  &[data-side="bottom"] {
+    animation-name: slideDown;
+  }
+  &[data-side="left"] {
+    animation-name: slideLeft;
+  }
+  &[data-side="right"] {
+    animation-name: slideRight;
+  }
+  @keyframes slideDown {
+    from {
+      opacity: 0;
+      transform: translateY(-10px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+  @keyframes slideUp {
+    from {
+      opacity: 0;
+      transform: translateY(10px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+  @keyframes slideLeft {
+    from {
+      opacity: 0;
+      transform: translateX(10px);
+    }
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+  @keyframes slideRight {
+    from {
+      opacity: 0;
+      transform: translateX(-10px);
+    }
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+`;
+var TooltipContainer = import_styled_components38.default.div`
+  box-sizing: border-box;
+  padding: 8px 12px;
+  border-radius: 4px;
+  font-size: ${coreTokens_default.type_scale_01};
+  font-family: ${coreTokens_default.type_sans};
+  max-width: 242px;
+  color: ${coreTokens_default.color_white};
+  background-color: ${coreTokens_default.color_grey_800};
+  border-color: ${coreTokens_default.color_grey_800};
+`;
+var Tooltip_default = DxcTooltip;
+
+// src/header/Header.tsx
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var Dropdown = (props) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(HeaderDropdown, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Dropdown_default, { ...props }) });
 var getLogoElement = (themeInput, logoLabel) => {
   if (!themeInput)
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "73", height: "40", viewBox: "0 0 73 40", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("title", { children: "DXC Logo" }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("g", { transform: "translate(0)", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("g", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "73", height: "40", viewBox: "0 0 73 40", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("title", { children: "DXC Logo" }),
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("g", { transform: "translate(0)", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("g", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           "path",
           {
             d: "M91.613-28.177v2.514H90.231V-28.15l-2.415-3.82h1.616l1.5,2.532,1.526-2.532h1.571ZM83.9-25.555A3.15,3.15,0,0,1,80.6-28.8v-.018a3.231,3.231,0,0,1,3.294-3.262,3.442,3.442,0,0,1,2.469.865l-.87,1.054a2.311,2.311,0,0,0-1.643-.64,1.891,1.891,0,0,0-1.8,1.964v.018a1.886,1.886,0,0,0,1.9,2,2.2,2.2,0,0,0,1.3-.378v-.9H83.858v-1.2h2.729v2.738A4.071,4.071,0,0,1,83.9-25.555Zm-6.416-3.261a1.913,1.913,0,0,0-1.9-1.982A1.883,1.883,0,0,0,73.7-28.835v.018a1.913,1.913,0,0,0,1.9,1.982A1.883,1.883,0,0,0,77.486-28.8Zm-1.9,3.261a3.225,3.225,0,0,1-3.33-3.243v-.018A3.255,3.255,0,0,1,75.6-32.078a3.225,3.225,0,0,1,3.331,3.243v.018A3.255,3.255,0,0,1,75.583-25.555Zm-9.173-.108V-31.97h1.382v5.045h3.133v1.261Zm-3.433-3.153a1.913,1.913,0,0,0-1.9-1.982,1.883,1.883,0,0,0-1.886,1.964v.018a1.913,1.913,0,0,0,1.9,1.982A1.883,1.883,0,0,0,62.978-28.8Zm-1.9,3.261a3.225,3.225,0,0,1-3.33-3.243v-.018a3.255,3.255,0,0,1,3.348-3.262,3.225,3.225,0,0,1,3.331,3.243v.018A3.255,3.255,0,0,1,61.075-25.555Zm-6.508-.108-3.043-4.009v4.009H50.159V-31.97h1.275l2.944,3.883V-31.97h1.364v6.306Zm-8.246,0v-2.531h-2.55v2.531H42.389V-31.97h1.382v2.5h2.55v-2.5H47.7v6.306Zm-8.432.108A3.178,3.178,0,0,1,34.666-28.8v-.018a3.2,3.2,0,0,1,3.276-3.262,3.237,3.237,0,0,1,2.478.973l-.88,1.018a2.315,2.315,0,0,0-1.606-.712,1.866,1.866,0,0,0-1.822,1.964v.018a1.87,1.87,0,0,0,1.822,1.982,2.265,2.265,0,0,0,1.651-.739l.88.891A3.206,3.206,0,0,1,37.889-25.555Zm-9.805-.108V-31.97h4.739v1.235H29.458v1.279h2.962v1.234H29.458V-26.9h3.411v1.234ZM24.322-30.69v5.027H22.939V-30.69H21.028v-1.28h5.206v1.28H24.322",
@@ -8249,7 +8360,7 @@ var getLogoElement = (themeInput, logoLabel) => {
             fill: "#010101"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           "path",
           {
             d: "M75.836-76.712a8.975,8.975,0,0,1,2.246-3.9,8.393,8.393,0,0,1,6.058-2.457h9.824v-5.67H84.139a14.611,14.611,0,0,0-10.232,4.221,14.509,14.509,0,0,0-3.076,4.536,11.913,11.913,0,0,0-.973,3.271Zm0,4.325a8.978,8.978,0,0,0,2.246,3.9,8.394,8.394,0,0,0,6.058,2.457h9.824v5.67H84.139A14.611,14.611,0,0,1,73.907-64.58a14.506,14.506,0,0,1-3.076-4.536,11.91,11.91,0,0,1-.973-3.271ZM57.522-69.832l-7.5,9.473H42.581L53.818-74.55,42.581-88.739H50.02l7.5,9.472,7.5-9.472h7.439L61.225-74.55l11.237,14.19H65.023Zm-12.336-6.88a11.935,11.935,0,0,0-.973-3.271,14.515,14.515,0,0,0-3.076-4.536A14.612,14.612,0,0,0,30.9-88.739H21.081v5.67H30.9a8.394,8.394,0,0,1,6.058,2.457,8.978,8.978,0,0,1,2.246,3.9Zm0,4.325a11.932,11.932,0,0,1-.973,3.271,14.511,14.511,0,0,1-3.076,4.536A14.611,14.611,0,0,1,30.9-60.359H21.081v-5.67H30.9a8.4,8.4,0,0,0,6.058-2.457,8.981,8.981,0,0,0,2.246-3.9h5.978",
@@ -8259,11 +8370,11 @@ var getLogoElement = (themeInput, logoLabel) => {
         )
       ] }) })
     ] });
-  else if (typeof themeInput === "string") return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(LogoImg2, { alt: logoLabel, src: themeInput });
+  else if (typeof themeInput === "string") return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(LogoImg2, { alt: logoLabel, src: themeInput });
   else return themeInput;
 };
-var Content4 = ({ isResponsive, responsiveContent, handleMenu, content }) => {
-  return isResponsive ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(MenuContent, { children: responsiveContent(handleMenu) }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ContentContainer, { children: content });
+var Content5 = ({ isResponsive, responsiveContent, handleMenu, content }) => {
+  return isResponsive ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(MenuContent, { children: responsiveContent(handleMenu) }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ContentContainer, { children: content });
 };
 var DxcHeader = ({
   underlined = false,
@@ -8304,29 +8415,20 @@ var DxcHeader = ({
   (0, import_react32.useEffect)(() => {
     !isResponsive && setIsMenuVisible(false);
   }, [isResponsive]);
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_styled_components38.ThemeProvider, { theme: colorsTheme.header, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(HeaderContainer2, { underlined, margin, ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(LogoAnchor, { tabIndex: onClick ? tabIndex : -1, interactuable: onClick ? true : false, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(LogoContainer2, { children: headerLogo }) }),
-    isResponsive && responsiveContent && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Flex_default, { grow: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ChildContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(HamburgerTrigger, { tabIndex, onClick: handleMenu, "aria-label": "Show options", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Icon_default, { icon: "menu" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_styled_components39.ThemeProvider, { theme: colorsTheme.header, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(HeaderContainer2, { underlined, margin, ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(LogoAnchor, { tabIndex: onClick ? tabIndex : -1, interactuable: onClick ? true : false, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(LogoContainer2, { children: headerLogo }) }),
+    isResponsive && responsiveContent && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(Flex_default, { grow: 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ChildContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(HamburgerTrigger, { tabIndex, onClick: handleMenu, "aria-label": "Show options", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Icon_default, { icon: "menu" }),
         translatedLabels.header.hamburguerTitle
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(ResponsiveMenu, { hasVisibility: isMenuVisible, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Flex_default, { justifyContent: "space-between", alignItems: "center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ResponsiveLogoContainer, { children: headerResponsiveLogo }),
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-            CloseAction,
-            {
-              tabIndex,
-              onClick: handleMenu,
-              "aria-label": translatedLabels.header.closeIcon,
-              title: translatedLabels.header.closeIcon,
-              children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Icon_default, { icon: "close" })
-            }
-          )
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(ResponsiveMenu, { hasVisibility: isMenuVisible, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(Flex_default, { justifyContent: "space-between", alignItems: "center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ResponsiveLogoContainer, { children: headerResponsiveLogo }),
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Tooltip_default, { label: translatedLabels.header.closeIcon, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CloseAction, { tabIndex, onClick: handleMenu, "aria-label": translatedLabels.header.closeIcon, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Icon_default, { icon: "close" }) }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-          Content4,
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+          Content5,
           {
             isResponsive,
             responsiveContent,
@@ -8335,10 +8437,10 @@ var DxcHeader = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Overlay2, { onClick: handleMenu, hasVisibility: isMenuVisible })
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Overlay2, { onClick: handleMenu, hasVisibility: isMenuVisible })
     ] }),
-    !isResponsive && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-      Content4,
+    !isResponsive && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      Content5,
       {
         isResponsive,
         responsiveContent,
@@ -8349,7 +8451,7 @@ var DxcHeader = ({
   ] }) });
 };
 DxcHeader.Dropdown = Dropdown;
-var HeaderDropdown = import_styled_components38.default.div`
+var HeaderDropdown = import_styled_components39.default.div`
   display: flex;
   button {
     background-color: transparent;
@@ -8358,7 +8460,7 @@ var HeaderDropdown = import_styled_components38.default.div`
     }
   }
 `;
-var HeaderContainer2 = import_styled_components38.default.header`
+var HeaderContainer2 = import_styled_components39.default.header`
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
@@ -8370,26 +8472,26 @@ var HeaderContainer2 = import_styled_components38.default.header`
   background-color: ${(props) => props.theme.backgroundColor};
   border-bottom: ${(props) => props.underlined && `${props.theme.underlinedThickness} ${props.theme.underlinedStyle} ${props.theme.underlinedColor}`};
 `;
-var LogoAnchor = import_styled_components38.default.a`
+var LogoAnchor = import_styled_components39.default.a`
   ${(props) => props.interactuable ? "cursor: pointer" : "cursor: default; outline:none;"};
 `;
-var LogoImg2 = import_styled_components38.default.img`
+var LogoImg2 = import_styled_components39.default.img`
   max-height: ${(props) => props.theme.logoHeight};
   width: ${(props) => props.theme.logoWidth};
 `;
-var LogoContainer2 = import_styled_components38.default.div`
+var LogoContainer2 = import_styled_components39.default.div`
   max-height: ${(props) => props.theme.logoHeight};
   width: ${(props) => props.theme.logoWidth};
   vertical-align: middle;
 `;
-var ChildContainer = import_styled_components38.default.div`
+var ChildContainer = import_styled_components39.default.div`
   display: flex;
   align-items: center;
   justify-content: flex-end;
   flex-grow: 1;
   width: calc(100% - 186px);
 `;
-var ContentContainer = import_styled_components38.default.div`
+var ContentContainer = import_styled_components39.default.div`
   display: flex;
   align-items: center;
   flex-grow: 1;
@@ -8397,7 +8499,7 @@ var ContentContainer = import_styled_components38.default.div`
   width: calc(100% - 186px);
   color: ${(props) => props.theme.contentColor};
 `;
-var HamburgerTrigger = import_styled_components38.default.button`
+var HamburgerTrigger = import_styled_components39.default.button`
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -8426,7 +8528,7 @@ var HamburgerTrigger = import_styled_components38.default.button`
   font-weight: ${(props) => props.theme.hamburguerFontWeight};
   color: ${(props) => props.theme.hamburguerFontColor};
 `;
-var ResponsiveMenu = import_styled_components38.default.div`
+var ResponsiveMenu = import_styled_components39.default.div`
   display: flex;
   flex-direction: column;
   background-color: ${(props) => props.theme.menuBackgroundColor};
@@ -8452,12 +8554,12 @@ var ResponsiveMenu = import_styled_components38.default.div`
   transition-timing-function: ease-in-out;
   box-sizing: border-box;
 `;
-var ResponsiveLogoContainer = import_styled_components38.default.div`
+var ResponsiveLogoContainer = import_styled_components39.default.div`
   max-height: ${(props) => props.theme.logoHeight};
   width: ${(props) => props.theme.logoWidth};
   display: flex;
 `;
-var CloseAction = import_styled_components38.default.button`
+var CloseAction = import_styled_components39.default.button`
   display: flex;
   justify-content: center;
   align-content: center;
@@ -8477,14 +8579,14 @@ var CloseAction = import_styled_components38.default.button`
     width: 24px;
   }
 `;
-var MenuContent = import_styled_components38.default.div`
+var MenuContent = import_styled_components39.default.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   height: 100%;
   color: ${(props) => props.theme.contentColor};
 `;
-var Overlay2 = import_styled_components38.default.div`
+var Overlay2 = import_styled_components39.default.div`
   position: fixed;
   top: 0;
   left: 0;
@@ -8506,11 +8608,11 @@ var Header_default = DxcHeader;
 
 // src/sidenav/Sidenav.tsx
 var import_react34 = require("react");
-var import_styled_components40 = __toESM(require("styled-components"));
+var import_styled_components41 = __toESM(require("styled-components"));
 
 // src/bleed/Bleed.tsx
-var import_styled_components39 = __toESM(require("styled-components"));
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_styled_components40 = __toESM(require("styled-components"));
+var import_jsx_runtime43 = require("react/jsx-runtime");
 function Bleed({
   space,
   horizontal,
@@ -8521,7 +8623,7 @@ function Bleed({
   left,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
     StyledBleed,
     {
       space,
@@ -8538,7 +8640,7 @@ function Bleed({
 function getSpacingValue(spacingName) {
   return spacingName ? spacingName : "0rem";
 }
-var StyledBleed = import_styled_components39.default.div`
+var StyledBleed = import_styled_components40.default.div`
   ${({ space, horizontal, vertical, top, right, bottom, left }) => `
     margin: -${getSpacingValue(top || vertical || space)} -${getSpacingValue(
   right || horizontal || space
@@ -8556,40 +8658,40 @@ var useResponsiveSidenavVisibility = () => {
 };
 
 // src/sidenav/Sidenav.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var DxcSidenav = ({ title, children }) => {
   const colorsTheme = useTheme_default();
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_styled_components40.ThemeProvider, { theme: colorsTheme.sidenav, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(SidenavContainer, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_styled_components41.ThemeProvider, { theme: colorsTheme.sidenav, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(SidenavContainer, { children: [
     title,
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Flex_default, { direction: "column", gap: "1rem", children })
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Flex_default, { direction: "column", gap: "1rem", children })
   ] }) });
 };
-var Title = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Bleed, { horizontal: "1rem", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(SidenavTitle, { children }) });
-var Section = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Bleed, { horizontal: "1rem", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Flex_default, { direction: "column", children }) }),
-  /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Divider, {})
+var Title = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Bleed, { horizontal: "1rem", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SidenavTitle, { children }) });
+var Section = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Bleed, { horizontal: "1rem", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Flex_default, { direction: "column", children }) }),
+  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Divider, {})
 ] });
 var GroupContext = (0, import_react34.createContext)(null);
 var Group = ({ title, collapsable = false, icon, children }) => {
   const [collapsed, setCollapsed] = (0, import_react34.useState)(false);
   const [isSelected, changeIsSelected] = (0, import_react34.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(GroupContext.Provider, { value: changeIsSelected, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(SidenavGroup, { children: [
-    collapsable && title ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(GroupContext.Provider, { value: changeIsSelected, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(SidenavGroup, { children: [
+    collapsable && title ? /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       SidenavGroupTitleButton,
       {
         "aria-expanded": !collapsed,
         onClick: () => setCollapsed(!collapsed),
         selectedGroup: collapsed && isSelected,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Flex_default, { alignItems: "center", gap: "0.5rem", children: [
-            typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon_default, { icon }) : icon,
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Flex_default, { alignItems: "center", gap: "0.5rem", children: [
+            typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Icon_default, { icon }) : icon,
             title
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon_default, { icon: collapsed ? "expand_more" : "expand_less" })
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Icon_default, { icon: collapsed ? "expand_more" : "expand_less" })
         ]
       }
-    ) : title && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(SidenavGroupTitle, { children: [
-      typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon_default, { icon }) : icon,
+    ) : title && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(SidenavGroupTitle, { children: [
+      typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Icon_default, { icon }) : icon,
       title
     ] }),
     !collapsed && children
@@ -8606,7 +8708,7 @@ var Link = (0, import_react34.forwardRef)(
     (0, import_react34.useEffect)(() => {
       changeIsGroupSelected?.((isGroupSelected2) => !isGroupSelected2 ? selected : isGroupSelected2);
     }, [selected, changeIsGroupSelected]);
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       SidenavLink,
       {
         selected,
@@ -8617,17 +8719,17 @@ var Link = (0, import_react34.forwardRef)(
         onClick: handleClick,
         ...otherProps,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Flex_default, { alignItems: "center", gap: "0.5rem", children: [
-            typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon_default, { icon }) : icon,
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Flex_default, { alignItems: "center", gap: "0.5rem", children: [
+            typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Icon_default, { icon }) : icon,
             children
           ] }),
-          newWindow && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon_default, { icon: "open_in_new" })
+          newWindow && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Icon_default, { icon: "open_in_new" })
         ]
       }
     );
   }
 );
-var SidenavContainer = import_styled_components40.default.div`
+var SidenavContainer = import_styled_components41.default.div`
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
@@ -8652,7 +8754,7 @@ var SidenavContainer = import_styled_components40.default.div`
     border-radius: 3px;
   }
 `;
-var SidenavTitle = import_styled_components40.default.div`
+var SidenavTitle = import_styled_components41.default.div`
   display: flex;
   align-items: center;
   padding: 0.5rem 1.2rem;
@@ -8664,7 +8766,7 @@ var SidenavTitle = import_styled_components40.default.div`
   letter-spacing: ${(props) => props.theme.titleFontLetterSpacing};
   text-transform: ${(props) => props.theme.titleFontTextTransform};
 `;
-var Divider = import_styled_components40.default.div`
+var Divider = import_styled_components41.default.div`
   width: 100%;
   height: 1px;
   background-color: ${coreTokens_default.color_grey_400};
@@ -8673,12 +8775,12 @@ var Divider = import_styled_components40.default.div`
     display: none;
   }
 `;
-var SidenavGroup = import_styled_components40.default.div`
+var SidenavGroup = import_styled_components41.default.div`
   a {
     padding: 0.5rem 1.2rem 0.5rem 2.25rem;
   }
 `;
-var SidenavGroupTitle = import_styled_components40.default.span`
+var SidenavGroupTitle = import_styled_components41.default.span`
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -8696,7 +8798,7 @@ var SidenavGroupTitle = import_styled_components40.default.span`
     width: 16px;
   }
 `;
-var SidenavGroupTitleButton = import_styled_components40.default.button`
+var SidenavGroupTitleButton = import_styled_components41.default.button`
   all: unset;
   box-sizing: border-box;
   display: flex;
@@ -8731,7 +8833,7 @@ var SidenavGroupTitleButton = import_styled_components40.default.button`
     width: 16px;
   }
 `;
-var SidenavLink = import_styled_components40.default.a`
+var SidenavLink = import_styled_components41.default.a`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -8777,9 +8879,9 @@ DxcSidenav.Title = Title;
 var Sidenav_default = DxcSidenav;
 
 // src/layout/Icons.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var layoutIcons = {
-  facebookLogo: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  facebookLogo: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     "svg",
     {
       version: "1.1",
@@ -8789,7 +8891,7 @@ var layoutIcons = {
       height: "438.536px",
       viewBox: "0 0 438.536 438.536",
       fill: "#FFFFFF",
-      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
         "path",
         {
           d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123\n      C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126\n      h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225\n      C438.532,59.576,430.49,40.204,414.41,24.123z M373.155,225.548h-49.963V406.84h-74.802V225.548H210.99V163.02h37.401v-37.402\n      c0-26.838,6.283-47.107,18.843-60.813c12.559-13.706,33.304-20.555,62.242-20.555h49.963v62.526h-31.401\n      c-10.663,0-17.467,1.853-20.417,5.568c-2.949,3.711-4.428,10.23-4.428,19.558v31.119h56.534L373.155,225.548z"
@@ -8797,9 +8899,9 @@ var layoutIcons = {
       ) })
     }
   ),
-  xLogo: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("svg", { width: "256", height: "256", viewBox: "0 0 256 256", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("rect", { width: "256", height: "256", rx: "40", fill: "white" }),
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  xLogo: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("svg", { width: "256", height: "256", viewBox: "0 0 256 256", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("rect", { width: "256", height: "256", rx: "40", fill: "white" }),
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       "path",
       {
         d: "M140.192 118.205L187.848 64H176.556L135.158 111.056L102.117 64H64L113.975 135.163L64 192H75.2914L118.982 142.296L153.883 192H192L140.192 118.205ZM124.722 135.787L119.65 128.697L79.3634 72.3294H96.7094L129.232 117.837L134.282 124.927L176.551 184.076H159.205L124.722 135.787Z",
@@ -8807,7 +8909,7 @@ var layoutIcons = {
       }
     )
   ] }),
-  linkedinLogo: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  linkedinLogo: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     "svg",
     {
       version: "1.1",
@@ -8817,7 +8919,7 @@ var layoutIcons = {
       height: "438.536px",
       viewBox: "0 0 438.536 438.536",
       fill: "#FFFFFF",
-      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
         "path",
         {
           d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123\n        C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126\n        h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225\n        C438.532,59.576,430.49,40.204,414.41,24.123z M133.618,367.157H67.666V169.016h65.952V367.157z M127.626,132.332\n        c-6.851,6.567-15.893,9.851-27.124,9.851h-0.288c-10.848,0-19.648-3.284-26.407-9.851c-6.76-6.567-10.138-14.703-10.138-24.41\n        c0-9.897,3.476-18.083,10.421-24.556c6.95-6.471,15.942-9.708,26.98-9.708c11.039,0,19.89,3.237,26.553,9.708\n        c6.661,6.473,10.088,14.659,10.277,24.556C137.899,117.625,134.477,125.761,127.626,132.332z M370.873,367.157h-65.952v-105.92\n        c0-29.879-11.036-44.823-33.116-44.823c-8.374,0-15.42,2.331-21.128,6.995c-5.715,4.661-9.996,10.324-12.847,16.991\n        c-1.335,3.422-1.999,8.75-1.999,15.981v110.775h-65.952c0.571-119.529,0.571-185.579,0-198.142h65.952v27.974\n        c13.867-21.681,33.558-32.544,59.101-32.544c22.84,0,41.21,7.52,55.104,22.554c13.895,15.037,20.841,37.214,20.841,66.519v113.64\n        H370.873z"
@@ -8829,11 +8931,11 @@ var layoutIcons = {
 var Icons_default2 = layoutIcons;
 
 // src/layout/ApplicationLayout.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var year = (/* @__PURE__ */ new Date()).getFullYear();
-var Main = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children });
-var defaultHeader = () => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Header_default, { underlined: true });
-var defaultFooter = () => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+var Main = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children });
+var defaultHeader = () => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Header_default, { underlined: true });
+var defaultFooter = () => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
   Footer_default,
   {
     copyright: `\xA9 DXC Technology ${year}\u200B\u200B\u200B\u200B. All rights reserved.`,
@@ -8902,30 +9004,29 @@ var DxcApplicationLayout = ({
   (0, import_react35.useEffect)(() => {
     !isResponsive && setIsSidenavVisibleResponsive(false);
   }, [isResponsive]);
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
     ApplicationLayoutContainer,
     {
       hasSidenav: sidenav ? true : false,
       isSidenavVisible: isSidenavVisibleResponsive,
       ref,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(HeaderContainer3, { children: headerContent }),
-        sidenav && isResponsive && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(VisibilityToggle, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(HeaderContainer3, { children: headerContent }),
+        sidenav && isResponsive && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(VisibilityToggle, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Tooltip_default, { label: translatedLabels.applicationLayout.visibilityToggleTitle, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
           HamburgerTrigger2,
           {
             onClick: handleSidenavVisibility,
             "aria-label": visibilityToggleLabel ? void 0 : translatedLabels.applicationLayout.visibilityToggleTitle,
-            title: translatedLabels.applicationLayout.visibilityToggleTitle,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Icon_default, { icon: "Menu" }),
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Icon_default, { icon: "Menu" }),
               visibilityToggleLabel
             ]
           }
-        ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(BodyContainer, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(SidenavContextProvider, { value: setIsSidenavVisibleResponsive, children: sidenav && (isResponsive ? isSidenavVisibleResponsive : true) && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(SidenavContainer2, { children: sidenav }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(MainContainer2, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(MainContentContainer, { children: main }),
+        ) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(BodyContainer, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SidenavContextProvider, { value: setIsSidenavVisibleResponsive, children: sidenav && (isResponsive ? isSidenavVisibleResponsive : true) && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SidenavContainer2, { children: sidenav }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(MainContainer2, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(MainContentContainer, { children: main }),
             footerContent
           ] })
         ] })
@@ -8933,7 +9034,7 @@ var DxcApplicationLayout = ({
     }
   );
 };
-var ApplicationLayoutContainer = import_styled_components41.default.div`
+var ApplicationLayoutContainer = import_styled_components42.default.div`
   position: absolute;
   top: 64px;
   bottom: 0;
@@ -8947,14 +9048,14 @@ var ApplicationLayoutContainer = import_styled_components41.default.div`
     ${(props) => props.isSidenavVisible && "overflow: hidden;"}
   }
 `;
-var HeaderContainer3 = import_styled_components41.default.div`
+var HeaderContainer3 = import_styled_components42.default.div`
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 3;
 `;
-var VisibilityToggle = import_styled_components41.default.div`
+var VisibilityToggle = import_styled_components42.default.div`
   position: fixed;
   top: 64px;
   left: 0;
@@ -8968,7 +9069,7 @@ var VisibilityToggle = import_styled_components41.default.div`
   user-select: none;
   z-index: 2;
 `;
-var HamburgerTrigger2 = import_styled_components41.default.button`
+var HamburgerTrigger2 = import_styled_components42.default.button`
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
@@ -8997,12 +9098,12 @@ var HamburgerTrigger2 = import_styled_components41.default.button`
     font-size: 20px;
   }
 `;
-var BodyContainer = import_styled_components41.default.div`
+var BodyContainer = import_styled_components42.default.div`
   display: flex;
   flex-direction: row;
   flex: 1;
 `;
-var SidenavContainer2 = import_styled_components41.default.div`
+var SidenavContainer2 = import_styled_components42.default.div`
   position: sticky;
   top: 64px;
   display: flex;
@@ -9015,12 +9116,12 @@ var SidenavContainer2 = import_styled_components41.default.div`
     height: 100%;
   }
 `;
-var MainContainer2 = import_styled_components41.default.div`
+var MainContainer2 = import_styled_components42.default.div`
   display: flex;
   flex-direction: column;
   width: 100%;
 `;
-var MainContentContainer = import_styled_components41.default.main`
+var MainContentContainer = import_styled_components42.default.main`
   flex: 1;
   background-color: #fff;
 `;
@@ -9034,117 +9135,6 @@ var ApplicationLayout_default = DxcApplicationLayout;
 // src/toggle-group/ToggleGroup.tsx
 var import_react36 = require("react");
 var import_styled_components43 = __toESM(require("styled-components"));
-
-// src/tooltip/Tooltip.tsx
-var Tooltip = __toESM(require("@radix-ui/react-tooltip"));
-var import_styled_components42 = __toESM(require("styled-components"));
-var import_jsx_runtime46 = require("react/jsx-runtime");
-var triangleIcon = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
-  "svg",
-  {
-    width: "12",
-    height: "6",
-    viewBox: "0 0 12 6",
-    xmlns: "http://www.w3.org/2000/svg",
-    preserveAspectRatio: "none",
-    display: "block",
-    children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
-      "path",
-      {
-        d: "M0.351562 0L5.30131 4.94975C5.69184 5.34027 6.325 5.34027 6.71552 4.94975L11.6653 0H6.00842H0.351562Z",
-        fill: coreTokens_default.color_grey_800
-      }
-    )
-  }
-);
-var DxcTooltip = ({ position = "bottom", label, children }) => label ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Tooltip.Provider, { delayDuration: 300, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Tooltip.Root, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Tooltip.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TooltipTriggerContainer, { children }) }),
-  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(StyledTooltipContent, { side: position, sideOffset: 8, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TooltipContainer, { children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Tooltip.Arrow, { asChild: true, "aria-hidden": true, children: triangleIcon })
-  ] }) })
-] }) }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children });
-var TooltipTriggerContainer = import_styled_components42.default.div`
-  display: inline-flex;
-  position: relative;
-`;
-var StyledTooltipContent = (0, import_styled_components42.default)(Tooltip.Content)`
-  z-index: 2147483647;
-
-  animation-duration: 0.2s;
-  animation-timing-function: ease-out;
-
-  /* Additional optimization to prevent blurry text in certain browsers */
-  -webkit-font-smoothing: antialiased;
-  transform: translateZ(0) scale(1, 1);
-
-  &[data-side="top"] {
-    animation-name: slideUp;
-  }
-  &[data-side="bottom"] {
-    animation-name: slideDown;
-  }
-  &[data-side="left"] {
-    animation-name: slideLeft;
-  }
-  &[data-side="right"] {
-    animation-name: slideRight;
-  }
-  @keyframes slideDown {
-    from {
-      opacity: 0;
-      transform: translateY(-10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
-  }
-  @keyframes slideUp {
-    from {
-      opacity: 0;
-      transform: translateY(10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
-  }
-  @keyframes slideLeft {
-    from {
-      opacity: 0;
-      transform: translateX(10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateX(0);
-    }
-  }
-  @keyframes slideRight {
-    from {
-      opacity: 0;
-      transform: translateX(-10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateX(0);
-    }
-  }
-`;
-var TooltipContainer = import_styled_components42.default.div`
-  box-sizing: border-box;
-  padding: 8px 12px;
-  border-radius: 4px;
-  font-size: ${coreTokens_default.type_scale_01};
-  font-family: ${coreTokens_default.type_sans};
-  max-width: 242px;
-  color: ${coreTokens_default.color_white};
-  background-color: ${coreTokens_default.color_grey_800};
-  border-color: ${coreTokens_default.color_grey_800};
-`;
-var Tooltip_default = DxcTooltip;
-
-// src/toggle-group/ToggleGroup.tsx
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var DxcToggleGroup = ({
   label,