@clickhouse/click-ui 0.0.191 → 0.0.192

package/dist/click-ui.umd.js

@@ -1,6 +1,6 @@
 (function(global2, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("styled-components"), require("react"), require("react-dom")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "styled-components", "react", "react-dom"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2["click-ui"] = {}, global2.jsxRuntime, global2.styled, global2.React, global2.ReactDOM));
-})(this, function(exports2, jsxRuntime, styledComponents, React, ReactDOM) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("styled-components"), require("react"), require("react-dom"), require("dayjs")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "styled-components", "react", "react-dom", "dayjs"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2["click-ui"] = {}, global2.jsxRuntime, global2.styled, global2.React, global2.ReactDOM, global2.dayjs));
+})(this, function(exports2, jsxRuntime, styledComponents, React, ReactDOM, dayjs) {
   "use strict";var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => {
@@ -9672,6 +9672,110 @@ var __publicField = (obj, key, value) => {
   }) => theme2.click.button.basic.size.icon.all, ({
     theme: theme2
   }) => theme2.click.button.basic.size.icon.all);
+  const Header$4 = styledComponents.styled.div.withConfig({
+    componentId: "sc-1qnbjoa-0"
+  })(["max-width:100%;gap:inherit;"]);
+  const Description = styledComponents.styled.div.withConfig({
+    componentId: "sc-1qnbjoa-1"
+  })(["display:flex;flex-direction:column;align-self:start;gap:", ";flex:1;width:100%;"], ({
+    theme: theme2
+  }) => theme2.click.card.horizontal.space.gap);
+  const Wrapper$a = styledComponents.styled.div.withConfig({
+    componentId: "sc-1qnbjoa-2"
+  })(["display:inline-flex;width:100%;max-width:100%;align-items:center;justify-content:flex-start;", ""], ({
+    theme: theme2,
+    $color,
+    $isSelected,
+    $disabled
+  }) => `
+    background: ${theme2.click.card.horizontal[$color].color.background.default};
+    color: ${theme2.click.card.horizontal[$color].color.title.default};
+    border-radius: ${theme2.click.card.horizontal.radii.all};
+    border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "default"]};
+    padding: ${theme2.click.card.horizontal.space.y} ${theme2.click.card.horizontal.space.x};
+    gap: ${theme2.click.card.horizontal.space.gap};
+    font: ${theme2.click.card.horizontal.typography.title.default};
+    ${Description} {
+      color: ${theme2.click.card.horizontal[$color].color.description.default};
+      font: ${theme2.click.card.horizontal.typography.description.default};
+    }
+    &:hover{
+      background-color: ${theme2.click.card.horizontal[$color].color.background.hover};
+      color: ${theme2.click.card.horizontal[$color].color.title.hover};
+      border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "hover"]};
+      cursor: pointer;
+      font: ${theme2.click.card.horizontal.typography.title.hover};
+      ${Description} {
+        color: ${theme2.click.card.horizontal[$color].color.description.hover};
+        font: ${theme2.click.card.horizontal.typography.description.hover};
+      }
+    }
+
+    &:active, &:focus, &:focus-within {
+      background-color: ${theme2.click.card.horizontal[$color].color.background.active};
+      color: ${theme2.click.card.horizontal[$color].color.title.active};
+      border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke.active};
+      ${Description} {
+        color: ${theme2.click.card.horizontal[$color].color.description.active};
+        font: ${theme2.click.card.horizontal.typography.description.active};
+      }
+    }
+    ${$disabled ? `
+          pointer-events: none;
+          &,
+          &:hover,
+          &:active, &:focus, &:focus-within {
+            background-color: ${theme2.click.card.horizontal[$color].color.background.disabled};
+            color: ${theme2.click.card.horizontal[$color].color.title.disabled};
+            border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "disabled"]};
+            cursor: not-allowed;
+            ${Description} {
+              color: ${theme2.click.card.horizontal[$color].color.description.disabled};
+              font: ${theme2.click.card.horizontal.typography.description.disabled};
+            }
+          },
+          &:active, &:focus, &:focus-within {
+            border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke.active};
+          }
+        ` : ""}
+  `);
+  const CardIcon$1 = styledComponents.styled(SvgImage).withConfig({
+    componentId: "sc-1qnbjoa-3"
+  })(["", ""], ({
+    theme: theme2
+  }) => `
+      height: ${theme2.click.card.horizontal.icon.size.all};
+      width: ${theme2.click.card.horizontal.icon.size.all};
+  `);
+  const ContentWrapper = styledComponents.styled.div.withConfig({
+    componentId: "sc-1qnbjoa-4"
+  })(["display:flex;flex-direction:column;width:100%;"]);
+  const CardHorizontal = ({
+    title,
+    icon,
+    description,
+    disabled = false,
+    isSelected,
+    children,
+    color = "default",
+    badgeText,
+    badgeState,
+    badgeIcon,
+    badgeIconDir,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$a, { $disabled: disabled, $isSelected: isSelected, $color: color, tabIndex: 0, ...props, children: [
+      icon && /* @__PURE__ */ jsxRuntime.jsx(CardIcon$1, { name: icon, "aria-hidden": true }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ContentWrapper, { children: [
+        title && /* @__PURE__ */ jsxRuntime.jsxs(Header$4, { as: Container, isResponsive: false, gap: "xs", justifyContent: "space-between", fillWidth: true, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Container, { orientation: "horizontal", gap: "xs", isResponsive: false, fillWidth: false, grow: "1", children: title }),
+          badgeText && /* @__PURE__ */ jsxRuntime.jsx(Container, { isResponsive: false, justifyContent: "end", fillWidth: false, "data-testid": "horizontal-card-badge", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { text: badgeText, size: "md", state: badgeState, icon: badgeIcon, iconDir: badgeIconDir }) })
+        ] }),
+        description && /* @__PURE__ */ jsxRuntime.jsx(Description, { children: description }),
+        children && /* @__PURE__ */ jsxRuntime.jsx(Description, { children })
+      ] })
+    ] });
+  };
   const Title$2 = React.forwardRef(({
     align,
     size: size2,
@@ -9725,111 +9829,6 @@ var __publicField = (obj, key, value) => {
   }) => $fillWidth && "width: 100%");
   _Text.displayName = "Text";
   const Text = React.forwardRef(_Text);
-  const Header$4 = styledComponents.styled.div.withConfig({
-    componentId: "sc-1drx130-0"
-  })(["display:flex;justify-content:space-between;align-items:center;"]);
-  const HeaderLeft = styledComponents.styled.div.withConfig({
-    componentId: "sc-1drx130-1"
-  })(["display:flex;align-items:center;gap:", ";h3,svg{color:", ";}"], ({
-    theme: theme2
-  }) => theme2.click.card.secondary.space.gap, ({
-    $disabled,
-    theme: theme2
-  }) => $disabled == true ? theme2.click.global.color.text.muted : theme2.click.global.color.text.default);
-  const Content$3 = styledComponents.styled.div.withConfig({
-    componentId: "sc-1drx130-2"
-  })(["display:flex;flex-direction:column;flex:1;"]);
-  const CustomIcon$1 = styledComponents.styled.img.withConfig({
-    componentId: "sc-1drx130-3"
-  })(["height:", ";width:", ";"], ({
-    theme: theme2
-  }) => theme2.click.image.lg.size.height, ({
-    theme: theme2
-  }) => theme2.click.image.lg.size.width);
-  const InfoLink = styledComponents.styled.a.withConfig({
-    componentId: "sc-1drx130-4"
-  })(["display:flex;align-items:center;color:", ";gap:", ";text-decoration:none;"], ({
-    theme: theme2
-  }) => theme2.click.card.secondary.color.link.default, ({
-    theme: theme2
-  }) => theme2.click.card.secondary.space.link.gap);
-  const LinkIconContainer = styledComponents.styled(SvgImage).withConfig({
-    componentId: "sc-1drx130-5"
-  })(["color:", ";height:", ";width:", ";"], ({
-    theme: theme2
-  }) => theme2.click.card.secondary.color.link.default, ({
-    theme: theme2
-  }) => theme2.click.image.md.size.height, ({
-    theme: theme2
-  }) => theme2.click.image.md.size.width);
-  const LinkText = styledComponents.styled(Text).withConfig({
-    componentId: "sc-1drx130-6"
-  })([""]);
-  const LinkIcon = styledComponents.styled(LinkIconContainer).withConfig({
-    componentId: "sc-1drx130-7"
-  })([""]);
-  const Wrapper$a = styledComponents.styled.div.withConfig({
-    componentId: "sc-1drx130-8"
-  })(["background-color:", ";border-radius:", ";border:", ";max-width:420px;min-width:320px;display:flex;flex-direction:column;padding:", ";gap:", ";box-shadow:", ";&:hover,:focus{background-color:", ";cursor:pointer;", ",", "{color:", ';}}&[aria-disabled="true"],&[aria-disabled="true"]:hover,&[aria-disabled="true"]:focus,&[aria-disabled="true"]:active{pointer-events:none;', "}"], ({
-    theme: theme2
-  }) => theme2.click.card.secondary.color.background.default, ({
-    theme: theme2
-  }) => theme2.click.card.secondary.radii.all, ({
-    theme: theme2
-  }) => `1px solid ${theme2.click.card.secondary.color.stroke.default}`, ({
-    theme: theme2
-  }) => theme2.click.card.secondary.space.all, ({
-    theme: theme2
-  }) => theme2.click.card.secondary.space.gap, ({
-    $hasShadow,
-    theme: theme2
-  }) => $hasShadow ? theme2.shadow[1] : "none", ({
-    theme: theme2
-  }) => theme2.click.card.secondary.color.background.hover, LinkText, LinkIcon, ({
-    theme: theme2
-  }) => theme2.click.card.secondary.color.link.hover, ({
-    theme: theme2
-  }) => `
-      background-color: ${theme2.click.card.secondary.color.background.disabled};
-      color: ${theme2.click.card.secondary.color.title.disabled};
-      border: 1px solid ${theme2.click.card.secondary.color.stroke.disabled};
-      cursor: not-allowed;
-
-      ${LinkText},
-      ${LinkIcon} {
-        color: ${theme2.click.card.secondary.color.link.disabled};
-      }
-    `);
-  const CardSecondary = ({
-    title,
-    icon,
-    iconUrl,
-    badgeState,
-    badgeText = "",
-    hasShadow = false,
-    disabled = false,
-    description,
-    infoUrl,
-    infoText,
-    infoIcon = "chevron-right",
-    infoIconSize = "md",
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$a, { "aria-disabled": disabled, tabIndex: 0, $hasShadow: hasShadow, ...props, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Header$4, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(HeaderLeft, { $disabled: disabled, children: [
-          iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(CustomIcon$1, { src: iconUrl, alt: "card icon", "aria-hidden": true }) : icon && /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: icon, "aria-hidden": true, size: "lg" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Title$2, { type: "h3", children: title })
-        ] }),
-        badgeText && /* @__PURE__ */ jsxRuntime.jsx(Badge, { text: badgeText, state: disabled == true ? "disabled" : badgeState })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(Content$3, { children: /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", children: description }) }),
-      (infoUrl || infoText) && /* @__PURE__ */ jsxRuntime.jsxs(InfoLink, { href: disabled ? void 0 : infoUrl, as: disabled || !infoUrl || infoUrl.length === 0 ? "div" : "a", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(LinkText, { children: infoText }),
-        /* @__PURE__ */ jsxRuntime.jsx(LinkIcon, { size: infoIconSize, name: infoIcon })
-      ] })
-    ] });
-  };
   const _Container = ({
     component,
     alignItems,
@@ -9991,7 +9990,7 @@ var __publicField = (obj, key, value) => {
     $size = "md",
     theme: theme2
   }) => theme2.click.card.primary.size.icon[$size].all);
-  const Content$2 = styledComponents.styled.div.withConfig({
+  const Content$3 = styledComponents.styled.div.withConfig({
     componentId: "sc-2dguvi-2"
   })(["width:100%;display:flex;flex-direction:column;align-self:", ";gap:", ";flex:1;"], ({
     $alignContent = "center"
@@ -10035,7 +10034,7 @@ var __publicField = (obj, key, value) => {
         iconUrl ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: iconUrl, alt: "card icon", "aria-hidden": true }) : icon && /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: icon, "aria-hidden": true }),
         title && /* @__PURE__ */ jsxRuntime.jsx(Title$2, { type: "h3", children: title })
       ] }),
-      (description || children) && /* @__PURE__ */ jsxRuntime.jsxs(Content$2, { $size: size2, $alignContent: alignContent, children: [
+      (description || children) && /* @__PURE__ */ jsxRuntime.jsxs(Content$3, { $size: size2, $alignContent: alignContent, children: [
         description && /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", align: convertCardAlignToTextAlign(alignContent ?? "start"), children: description }),
         children
       ] }),
@@ -10044,110 +10043,6 @@ var __publicField = (obj, key, value) => {
     ] });
   };
   const CardPrimary = withTopBadge(Card);
-  const Header$2 = styledComponents.styled.div.withConfig({
-    componentId: "sc-1qnbjoa-0"
-  })(["max-width:100%;gap:inherit;"]);
-  const Description = styledComponents.styled.div.withConfig({
-    componentId: "sc-1qnbjoa-1"
-  })(["display:flex;flex-direction:column;align-self:start;gap:", ";flex:1;width:100%;"], ({
-    theme: theme2
-  }) => theme2.click.card.horizontal.space.gap);
-  const Wrapper$7 = styledComponents.styled.div.withConfig({
-    componentId: "sc-1qnbjoa-2"
-  })(["display:inline-flex;width:100%;max-width:100%;align-items:center;justify-content:flex-start;", ""], ({
-    theme: theme2,
-    $color,
-    $isSelected,
-    $disabled
-  }) => `
-    background: ${theme2.click.card.horizontal[$color].color.background.default};
-    color: ${theme2.click.card.horizontal[$color].color.title.default};
-    border-radius: ${theme2.click.card.horizontal.radii.all};
-    border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "default"]};
-    padding: ${theme2.click.card.horizontal.space.y} ${theme2.click.card.horizontal.space.x};
-    gap: ${theme2.click.card.horizontal.space.gap};
-    font: ${theme2.click.card.horizontal.typography.title.default};
-    ${Description} {
-      color: ${theme2.click.card.horizontal[$color].color.description.default};
-      font: ${theme2.click.card.horizontal.typography.description.default};
-    }
-    &:hover{
-      background-color: ${theme2.click.card.horizontal[$color].color.background.hover};
-      color: ${theme2.click.card.horizontal[$color].color.title.hover};
-      border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "hover"]};
-      cursor: pointer;
-      font: ${theme2.click.card.horizontal.typography.title.hover};
-      ${Description} {
-        color: ${theme2.click.card.horizontal[$color].color.description.hover};
-        font: ${theme2.click.card.horizontal.typography.description.hover};
-      }
-    }
-
-    &:active, &:focus, &:focus-within {
-      background-color: ${theme2.click.card.horizontal[$color].color.background.active};
-      color: ${theme2.click.card.horizontal[$color].color.title.active};
-      border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke.active};
-      ${Description} {
-        color: ${theme2.click.card.horizontal[$color].color.description.active};
-        font: ${theme2.click.card.horizontal.typography.description.active};
-      }
-    }
-    ${$disabled ? `
-          pointer-events: none;
-          &,
-          &:hover,
-          &:active, &:focus, &:focus-within {
-            background-color: ${theme2.click.card.horizontal[$color].color.background.disabled};
-            color: ${theme2.click.card.horizontal[$color].color.title.disabled};
-            border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke[$isSelected ? "active" : "disabled"]};
-            cursor: not-allowed;
-            ${Description} {
-              color: ${theme2.click.card.horizontal[$color].color.description.disabled};
-              font: ${theme2.click.card.horizontal.typography.description.disabled};
-            }
-          },
-          &:active, &:focus, &:focus-within {
-            border: 1px solid ${theme2.click.card.horizontal[$color].color.stroke.active};
-          }
-        ` : ""}
-  `);
-  const CardIcon$1 = styledComponents.styled(SvgImage).withConfig({
-    componentId: "sc-1qnbjoa-3"
-  })(["", ""], ({
-    theme: theme2
-  }) => `
-      height: ${theme2.click.card.horizontal.icon.size.all};
-      width: ${theme2.click.card.horizontal.icon.size.all};
-  `);
-  const ContentWrapper = styledComponents.styled.div.withConfig({
-    componentId: "sc-1qnbjoa-4"
-  })(["display:flex;flex-direction:column;width:100%;"]);
-  const CardHorizontal = ({
-    title,
-    icon,
-    description,
-    disabled = false,
-    isSelected,
-    children,
-    color = "default",
-    badgeText,
-    badgeState,
-    badgeIcon,
-    badgeIconDir,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$7, { $disabled: disabled, $isSelected: isSelected, $color: color, tabIndex: 0, ...props, children: [
-      icon && /* @__PURE__ */ jsxRuntime.jsx(CardIcon$1, { name: icon, "aria-hidden": true }),
-      /* @__PURE__ */ jsxRuntime.jsxs(ContentWrapper, { children: [
-        title && /* @__PURE__ */ jsxRuntime.jsxs(Header$2, { as: Container, isResponsive: false, gap: "xs", justifyContent: "space-between", fillWidth: true, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Container, { orientation: "horizontal", gap: "xs", isResponsive: false, fillWidth: false, grow: "1", children: title }),
-          badgeText && /* @__PURE__ */ jsxRuntime.jsx(Container, { isResponsive: false, justifyContent: "end", fillWidth: false, "data-testid": "horizontal-card-badge", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { text: badgeText, size: "md", state: badgeState, icon: badgeIcon, iconDir: badgeIconDir }) })
-        ] }),
-        description && /* @__PURE__ */ jsxRuntime.jsx(Description, { children: description }),
-        children && /* @__PURE__ */ jsxRuntime.jsx(Description, { children })
-      ] })
-    ] });
-  };
   const Background = styledComponents.styled.div.withConfig({
     componentId: "sc-6jamj6-0"
   })(["", ""], ({
@@ -10163,7 +10058,7 @@ var __publicField = (obj, key, value) => {
       background: ${theme2.click.card.promotion.color.stroke.focus};
     }
   `);
-  const Wrapper$6 = styledComponents.styled.div.withConfig({
+  const Wrapper$7 = styledComponents.styled.div.withConfig({
     componentId: "sc-6jamj6-1"
   })(["display:flex;width:100%;align-items:center;justify-content:flex-start;cursor:pointer;", ""], ({
     theme: theme2
@@ -10204,12 +10099,117 @@ var __publicField = (obj, key, value) => {
     ...props
   }) => {
     const [isVisible, setIsVisible] = React.useState(true);
-    return isVisible ? /* @__PURE__ */ jsxRuntime.jsx(Background, { children: /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$6, { $dismissible: dismissible, ...props, children: [
+    return isVisible ? /* @__PURE__ */ jsxRuntime.jsx(Background, { children: /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$7, { $dismissible: dismissible, ...props, children: [
       /* @__PURE__ */ jsxRuntime.jsx(CardIcon, { name: icon, "aria-hidden": true }),
       /* @__PURE__ */ jsxRuntime.jsx(Text, { children: label }),
       dismissible && /* @__PURE__ */ jsxRuntime.jsx(DismissWrapper, { "data-testid": "click-alert-dismiss-button", onClick: () => setIsVisible(false), children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "cross", "aria-label": "close" }) })
     ] }) }) : null;
   };
+  const Header$2 = styledComponents.styled.div.withConfig({
+    componentId: "sc-1drx130-0"
+  })(["display:flex;justify-content:space-between;align-items:center;"]);
+  const HeaderLeft = styledComponents.styled.div.withConfig({
+    componentId: "sc-1drx130-1"
+  })(["display:flex;align-items:center;gap:", ";h3,svg{color:", ";}"], ({
+    theme: theme2
+  }) => theme2.click.card.secondary.space.gap, ({
+    $disabled,
+    theme: theme2
+  }) => $disabled == true ? theme2.click.global.color.text.muted : theme2.click.global.color.text.default);
+  const Content$2 = styledComponents.styled.div.withConfig({
+    componentId: "sc-1drx130-2"
+  })(["display:flex;flex-direction:column;flex:1;"]);
+  const CustomIcon$1 = styledComponents.styled.img.withConfig({
+    componentId: "sc-1drx130-3"
+  })(["height:", ";width:", ";"], ({
+    theme: theme2
+  }) => theme2.click.image.lg.size.height, ({
+    theme: theme2
+  }) => theme2.click.image.lg.size.width);
+  const InfoLink = styledComponents.styled.a.withConfig({
+    componentId: "sc-1drx130-4"
+  })(["display:flex;align-items:center;color:", ";gap:", ";text-decoration:none;"], ({
+    theme: theme2
+  }) => theme2.click.card.secondary.color.link.default, ({
+    theme: theme2
+  }) => theme2.click.card.secondary.space.link.gap);
+  const LinkIconContainer = styledComponents.styled(SvgImage).withConfig({
+    componentId: "sc-1drx130-5"
+  })(["color:", ";height:", ";width:", ";"], ({
+    theme: theme2
+  }) => theme2.click.card.secondary.color.link.default, ({
+    theme: theme2
+  }) => theme2.click.image.md.size.height, ({
+    theme: theme2
+  }) => theme2.click.image.md.size.width);
+  const LinkText = styledComponents.styled(Text).withConfig({
+    componentId: "sc-1drx130-6"
+  })([""]);
+  const LinkIcon = styledComponents.styled(LinkIconContainer).withConfig({
+    componentId: "sc-1drx130-7"
+  })([""]);
+  const Wrapper$6 = styledComponents.styled.div.withConfig({
+    componentId: "sc-1drx130-8"
+  })(["background-color:", ";border-radius:", ";border:", ";max-width:420px;min-width:320px;display:flex;flex-direction:column;padding:", ";gap:", ";box-shadow:", ";&:hover,:focus{background-color:", ";cursor:pointer;", ",", "{color:", ';}}&[aria-disabled="true"],&[aria-disabled="true"]:hover,&[aria-disabled="true"]:focus,&[aria-disabled="true"]:active{pointer-events:none;', "}"], ({
+    theme: theme2
+  }) => theme2.click.card.secondary.color.background.default, ({
+    theme: theme2
+  }) => theme2.click.card.secondary.radii.all, ({
+    theme: theme2
+  }) => `1px solid ${theme2.click.card.secondary.color.stroke.default}`, ({
+    theme: theme2
+  }) => theme2.click.card.secondary.space.all, ({
+    theme: theme2
+  }) => theme2.click.card.secondary.space.gap, ({
+    $hasShadow,
+    theme: theme2
+  }) => $hasShadow ? theme2.shadow[1] : "none", ({
+    theme: theme2
+  }) => theme2.click.card.secondary.color.background.hover, LinkText, LinkIcon, ({
+    theme: theme2
+  }) => theme2.click.card.secondary.color.link.hover, ({
+    theme: theme2
+  }) => `
+      background-color: ${theme2.click.card.secondary.color.background.disabled};
+      color: ${theme2.click.card.secondary.color.title.disabled};
+      border: 1px solid ${theme2.click.card.secondary.color.stroke.disabled};
+      cursor: not-allowed;
+
+      ${LinkText},
+      ${LinkIcon} {
+        color: ${theme2.click.card.secondary.color.link.disabled};
+      }
+    `);
+  const CardSecondary = ({
+    title,
+    icon,
+    iconUrl,
+    badgeState,
+    badgeText = "",
+    hasShadow = false,
+    disabled = false,
+    description,
+    infoUrl,
+    infoText,
+    infoIcon = "chevron-right",
+    infoIconSize = "md",
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$6, { "aria-disabled": disabled, tabIndex: 0, $hasShadow: hasShadow, ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Header$2, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(HeaderLeft, { $disabled: disabled, children: [
+          iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(CustomIcon$1, { src: iconUrl, alt: "card icon", "aria-hidden": true }) : icon && /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: icon, "aria-hidden": true, size: "lg" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Title$2, { type: "h3", children: title })
+        ] }),
+        badgeText && /* @__PURE__ */ jsxRuntime.jsx(Badge, { text: badgeText, state: disabled == true ? "disabled" : badgeState })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Content$2, { children: /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", children: description }) }),
+      (infoUrl || infoText) && /* @__PURE__ */ jsxRuntime.jsxs(InfoLink, { href: disabled ? void 0 : infoUrl, as: disabled || !infoUrl || infoUrl.length === 0 ? "div" : "a", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(LinkText, { children: infoText }),
+        /* @__PURE__ */ jsxRuntime.jsx(LinkIcon, { size: infoIconSize, name: infoIcon })
+      ] })
+    ] });
+  };
   function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value) {
     const ref = React.useRef({
       value,
@@ -14594,6 +14594,1088 @@ var __publicField = (obj, key, value) => {
       }, showLineNumbers, wrapLines: wrap || wrapLines, wrapLongLines: wrap || wrapLines, children })
     ] });
   };
+  const ActionsWrapper = styledComponents.styled.div.withConfig({
+    componentId: "sc-6eozxy-0"
+  })(["display:flex;justify-content:flex-end;gap:", ";"], (props) => props.theme.click.dialog.space.gap);
+  const DialogContent$1 = styledComponents.styled.div.withConfig({
+    componentId: "sc-6eozxy-1"
+  })(["overflow:hidden;display:flex;flex-direction:column;"]);
+  const ConfirmationDialog = ({
+    children,
+    disabled,
+    loading,
+    message,
+    onCancel,
+    onConfirm,
+    open: open2,
+    primaryActionLabel = "Confirm",
+    primaryActionType = "primary",
+    secondaryActionLabel = "Cancel",
+    showClose,
+    title,
+    ...props
+  }) => {
+    if (children && message) {
+      throw new Error("You can't pass children and message props at the same time");
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: open2, onOpenChange: (open22) => {
+      !open22 && onCancel && onCancel();
+    }, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent$1, { as: Dialog.Content, title, showClose, ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Container, { overflow: "auto", grow: "1", orientation: "vertical", children: children ? children : /* @__PURE__ */ jsxRuntime.jsx(Text, { children: message }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Separator, { size: "xl" }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ActionsWrapper, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Dialog.Close, { label: secondaryActionLabel, "data-testid": "cancel-action-button" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Dialog.Close, { loading: !!loading, disabled: !!disabled || !!loading, type: primaryActionType, label: primaryActionLabel, onClick: () => {
+          if (onConfirm) {
+            onConfirm();
+          }
+        }, "data-testid": "confirm-action-button" })
+      ] })
+    ] }) });
+  };
+  const $1b0217ee4a91d156$var$CONTEXT_MENU_NAME = "ContextMenu";
+  const [$1b0217ee4a91d156$var$createContextMenuContext, $1b0217ee4a91d156$export$1059331f43ddcc82] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($1b0217ee4a91d156$var$CONTEXT_MENU_NAME, [
+    $6cc32821e9371a1c$export$4027731b685e72eb
+  ]);
+  const $1b0217ee4a91d156$var$useMenuScope = $6cc32821e9371a1c$export$4027731b685e72eb();
+  const [$1b0217ee4a91d156$var$ContextMenuProvider, $1b0217ee4a91d156$var$useContextMenuContext] = $1b0217ee4a91d156$var$createContextMenuContext($1b0217ee4a91d156$var$CONTEXT_MENU_NAME);
+  const $1b0217ee4a91d156$export$8dc6765e8be191c7 = (props) => {
+    const { __scopeContextMenu, children, onOpenChange, dir, modal = true } = props;
+    const [open1, setOpen] = React.useState(false);
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    const handleOpenChangeProp = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onOpenChange);
+    const handleOpenChange = React.useCallback((open2) => {
+      setOpen(open2);
+      handleOpenChangeProp(open2);
+    }, [
+      handleOpenChangeProp
+    ]);
+    return /* @__PURE__ */ React.createElement($1b0217ee4a91d156$var$ContextMenuProvider, {
+      scope: __scopeContextMenu,
+      open: open1,
+      onOpenChange: handleOpenChange,
+      modal
+    }, /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$be92b6f5f03c0fe9, _extends$1({}, menuScope, {
+      dir,
+      open: open1,
+      onOpenChange: handleOpenChange,
+      modal
+    }), children));
+  };
+  const $1b0217ee4a91d156$var$TRIGGER_NAME = "ContextMenuTrigger";
+  const $1b0217ee4a91d156$export$be6fc7b1d5b0beb9 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, disabled = false, ...triggerProps } = props;
+    const context = $1b0217ee4a91d156$var$useContextMenuContext($1b0217ee4a91d156$var$TRIGGER_NAME, __scopeContextMenu);
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    const pointRef = React.useRef({
+      x: 0,
+      y: 0
+    });
+    const virtualRef = React.useRef({
+      getBoundingClientRect: () => DOMRect.fromRect({
+        width: 0,
+        height: 0,
+        ...pointRef.current
+      })
+    });
+    const longPressTimerRef = React.useRef(0);
+    const clearLongPress = React.useCallback(
+      () => window.clearTimeout(longPressTimerRef.current),
+      []
+    );
+    const handleOpen = (event) => {
+      pointRef.current = {
+        x: event.clientX,
+        y: event.clientY
+      };
+      context.onOpenChange(true);
+    };
+    React.useEffect(
+      () => clearLongPress,
+      [
+        clearLongPress
+      ]
+    );
+    React.useEffect(
+      () => void (disabled && clearLongPress()),
+      [
+        disabled,
+        clearLongPress
+      ]
+    );
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$b688253958b8dfe7, _extends$1({}, menuScope, {
+      virtualRef
+    })), /* @__PURE__ */ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends$1({
+      "data-state": context.open ? "open" : "closed",
+      "data-disabled": disabled ? "" : void 0
+    }, triggerProps, {
+      ref: forwardedRef,
+      style: {
+        WebkitTouchCallout: "none",
+        ...props.style
+      },
+      onContextMenu: disabled ? props.onContextMenu : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onContextMenu, (event) => {
+        clearLongPress();
+        handleOpen(event);
+        event.preventDefault();
+      }),
+      onPointerDown: disabled ? props.onPointerDown : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDown, $1b0217ee4a91d156$var$whenTouchOrPen((event) => {
+        clearLongPress();
+        longPressTimerRef.current = window.setTimeout(
+          () => handleOpen(event),
+          700
+        );
+      })),
+      onPointerMove: disabled ? props.onPointerMove : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerMove, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress)),
+      onPointerCancel: disabled ? props.onPointerCancel : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerCancel, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress)),
+      onPointerUp: disabled ? props.onPointerUp : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerUp, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress))
+    })));
+  });
+  const $1b0217ee4a91d156$export$14afd0be83e45060 = (props) => {
+    const { __scopeContextMenu, ...portalProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$602eac185826482c, _extends$1({}, menuScope, portalProps));
+  };
+  const $1b0217ee4a91d156$var$CONTENT_NAME = "ContextMenuContent";
+  const $1b0217ee4a91d156$export$572205900c9369e = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...contentProps } = props;
+    const context = $1b0217ee4a91d156$var$useContextMenuContext($1b0217ee4a91d156$var$CONTENT_NAME, __scopeContextMenu);
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    const hasInteractedOutsideRef = React.useRef(false);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$7c6e2c02157bb7d2, _extends$1({}, menuScope, contentProps, {
+      ref: forwardedRef,
+      side: "right",
+      sideOffset: 2,
+      align: "start",
+      onCloseAutoFocus: (event) => {
+        var _props$onCloseAutoFoc;
+        (_props$onCloseAutoFoc = props.onCloseAutoFocus) === null || _props$onCloseAutoFoc === void 0 || _props$onCloseAutoFoc.call(props, event);
+        if (!event.defaultPrevented && hasInteractedOutsideRef.current)
+          event.preventDefault();
+        hasInteractedOutsideRef.current = false;
+      },
+      onInteractOutside: (event) => {
+        var _props$onInteractOuts;
+        (_props$onInteractOuts = props.onInteractOutside) === null || _props$onInteractOuts === void 0 || _props$onInteractOuts.call(props, event);
+        if (!event.defaultPrevented && !context.modal)
+          hasInteractedOutsideRef.current = true;
+      },
+      style: {
+        ...props.style,
+        "--radix-context-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
+        "--radix-context-menu-content-available-width": "var(--radix-popper-available-width)",
+        "--radix-context-menu-content-available-height": "var(--radix-popper-available-height)",
+        "--radix-context-menu-trigger-width": "var(--radix-popper-anchor-width)",
+        "--radix-context-menu-trigger-height": "var(--radix-popper-anchor-height)"
+      }
+    }));
+  });
+  const $1b0217ee4a91d156$export$9860523b0fcdd664 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...groupProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$eb2fcfdbd7ba97d4, _extends$1({}, menuScope, groupProps, {
+      ref: forwardedRef
+    }));
+  });
+  const $1b0217ee4a91d156$export$16a26dc176a49100 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...itemProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$6d08773d2e66f8f2, _extends$1({}, menuScope, itemProps, {
+      ref: forwardedRef
+    }));
+  });
+  const $1b0217ee4a91d156$export$f47d0a58228a61e2 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...arrowProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$21b07c8f274aebd5, _extends$1({}, menuScope, arrowProps, {
+      ref: forwardedRef
+    }));
+  });
+  const $1b0217ee4a91d156$export$5bc21d1c00c4b201 = (props) => {
+    const { __scopeContextMenu, children, onOpenChange, open: openProp, defaultOpen } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    const [open2, setOpen] = $71cd76cc60e0454e$export$6f32135080cb4c3({
+      prop: openProp,
+      defaultProp: defaultOpen,
+      onChange: onOpenChange
+    });
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$d7a01e11500dfb6f, _extends$1({}, menuScope, {
+      open: open2,
+      onOpenChange: setOpen
+    }), children);
+  };
+  const $1b0217ee4a91d156$export$30b2b5c64556d316 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...triggerItemProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$2ea8a7a591ac5eac, _extends$1({}, menuScope, triggerItemProps, {
+      ref: forwardedRef
+    }));
+  });
+  const $1b0217ee4a91d156$export$2c967063bd2dc512 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
+    const { __scopeContextMenu, ...subContentProps } = props;
+    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
+    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$6d4de93b380beddf, _extends$1({}, menuScope, subContentProps, {
+      ref: forwardedRef,
+      style: {
+        ...props.style,
+        "--radix-context-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
+        "--radix-context-menu-content-available-width": "var(--radix-popper-available-width)",
+        "--radix-context-menu-content-available-height": "var(--radix-popper-available-height)",
+        "--radix-context-menu-trigger-width": "var(--radix-popper-anchor-width)",
+        "--radix-context-menu-trigger-height": "var(--radix-popper-anchor-height)"
+      }
+    }));
+  });
+  function $1b0217ee4a91d156$var$whenTouchOrPen(handler) {
+    return (event) => event.pointerType !== "mouse" ? handler(event) : void 0;
+  }
+  const $1b0217ee4a91d156$export$be92b6f5f03c0fe9 = $1b0217ee4a91d156$export$8dc6765e8be191c7;
+  const $1b0217ee4a91d156$export$41fb9f06171c75f4 = $1b0217ee4a91d156$export$be6fc7b1d5b0beb9;
+  const $1b0217ee4a91d156$export$602eac185826482c = $1b0217ee4a91d156$export$14afd0be83e45060;
+  const $1b0217ee4a91d156$export$7c6e2c02157bb7d2 = $1b0217ee4a91d156$export$572205900c9369e;
+  const $1b0217ee4a91d156$export$eb2fcfdbd7ba97d4 = $1b0217ee4a91d156$export$9860523b0fcdd664;
+  const $1b0217ee4a91d156$export$6d08773d2e66f8f2 = $1b0217ee4a91d156$export$16a26dc176a49100;
+  const $1b0217ee4a91d156$export$21b07c8f274aebd5 = $1b0217ee4a91d156$export$f47d0a58228a61e2;
+  const $1b0217ee4a91d156$export$d7a01e11500dfb6f = $1b0217ee4a91d156$export$5bc21d1c00c4b201;
+  const $1b0217ee4a91d156$export$2ea8a7a591ac5eac = $1b0217ee4a91d156$export$30b2b5c64556d316;
+  const $1b0217ee4a91d156$export$6d4de93b380beddf = $1b0217ee4a91d156$export$2c967063bd2dc512;
+  const ContextMenu = (props) => /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$be92b6f5f03c0fe9, { ...props });
+  const ContextMenuTrigger$1 = React.forwardRef(({
+    disabled,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$41fb9f06171c75f4, { asChild: true, disabled, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, ...props }) });
+  });
+  ContextMenuTrigger$1.displayName = "ContextMenuTrigger";
+  ContextMenu.Trigger = ContextMenuTrigger$1;
+  const ContextMenuSubTrigger = ({
+    icon,
+    iconDir,
+    children,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(GenericMenuItem, { as: $1b0217ee4a91d156$export$2ea8a7a591ac5eac, ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(IconWrapper$3, { icon, iconDir, children }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "dropdown-arrow", children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "chevron-right" }) })
+    ] });
+  };
+  ContextMenuSubTrigger.displayName = "ContextMenuSubTrigger";
+  ContextMenu.SubTrigger = ContextMenuSubTrigger;
+  const RightMenuContent = styledComponents.styled(GenericMenuPanel).withConfig({
+    componentId: "sc-8z6kye-0"
+  })(["flex-direction:column;z-index:1;", ";"], ({
+    $showArrow
+  }) => $showArrow ? `
+      &[data-side="bottom"] {
+        margin-top: -1px;
+      }
+      &[data-side="top"] {
+        margin-bottom: -1px;
+      }
+      &[data-side="left"] {
+        margin-right: -1px;
+        .popover-arrow {
+          margin-right: 1rem;
+        }
+      }
+      }
+      &[data-side="right"] {
+        margin-left: -1px;
+        .popover-arrow {
+          margin-left: 1rem;
+        }
+      }
+  ` : "");
+  const ContextMenuContent = ({
+    sub,
+    children,
+    showArrow,
+    ...props
+  }) => {
+    const ContentElement = sub ? $1b0217ee4a91d156$export$6d4de93b380beddf : $1b0217ee4a91d156$export$7c6e2c02157bb7d2;
+    return /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$602eac185826482c, { children: /* @__PURE__ */ jsxRuntime.jsxs(RightMenuContent, { $type: "context-menu", $showArrow: showArrow, as: ContentElement, ...props, children: [
+      showArrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow$1, { asChild: true, as: $1b0217ee4a91d156$export$21b07c8f274aebd5, width: 20, height: 10, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverArrow, { className: "popover-arrow" }) }),
+      children
+    ] }) });
+  };
+  ContextMenuContent.displayName = "ContextMenuContent";
+  ContextMenu.Content = ContextMenuContent;
+  const RightMenuGroup = styledComponents.styled($1b0217ee4a91d156$export$eb2fcfdbd7ba97d4).withConfig({
+    componentId: "sc-8z6kye-1"
+  })(["width:100%;border-bottom:1px solid ", ";"], ({
+    theme: theme2
+  }) => theme2.click.genericMenu.item.color.stroke.default);
+  const ContextMenuGroup = (props) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(RightMenuGroup, { ...props });
+  };
+  ContextMenuGroup.displayName = "ContextMenuGroup";
+  ContextMenu.Group = ContextMenuGroup;
+  const RightMenuSub = styledComponents.styled($1b0217ee4a91d156$export$d7a01e11500dfb6f).withConfig({
+    componentId: "sc-8z6kye-2"
+  })(["border-bottom:1px solid ", ";"], ({
+    theme: theme2
+  }) => theme2.click.genericMenu.item.color.stroke.default);
+  const ContextMenuSub = ({
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(RightMenuSub, { ...props });
+  };
+  ContextMenuSub.displayName = "ContextMenuSub";
+  ContextMenu.Sub = ContextMenuSub;
+  const ContextMenuItem = ({
+    icon,
+    iconDir,
+    children,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(GenericMenuItem, { as: $1b0217ee4a91d156$export$6d08773d2e66f8f2, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(IconWrapper$3, { icon, iconDir, children }) });
+  };
+  ContextMenuItem.displayName = "ContextMenuItem";
+  ContextMenu.Item = ContextMenuItem;
+  var advancedFormat$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(e, t) {
+      module2.exports = t();
+    }(commonjsGlobal, function() {
+      return function(e, t) {
+        var r = t.prototype, n = r.format;
+        r.format = function(e2) {
+          var t2 = this, r2 = this.$locale();
+          if (!this.isValid())
+            return n.bind(this)(e2);
+          var s2 = this.$utils(), a = (e2 || "YYYY-MM-DDTHH:mm:ssZ").replace(/\[([^\]]+)]|Q|wo|ww|w|WW|W|zzz|z|gggg|GGGG|Do|X|x|k{1,2}|S/g, function(e3) {
+            switch (e3) {
+              case "Q":
+                return Math.ceil((t2.$M + 1) / 3);
+              case "Do":
+                return r2.ordinal(t2.$D);
+              case "gggg":
+                return t2.weekYear();
+              case "GGGG":
+                return t2.isoWeekYear();
+              case "wo":
+                return r2.ordinal(t2.week(), "W");
+              case "w":
+              case "ww":
+                return s2.s(t2.week(), "w" === e3 ? 1 : 2, "0");
+              case "W":
+              case "WW":
+                return s2.s(t2.isoWeek(), "W" === e3 ? 1 : 2, "0");
+              case "k":
+              case "kk":
+                return s2.s(String(0 === t2.$H ? 24 : t2.$H), "k" === e3 ? 1 : 2, "0");
+              case "X":
+                return Math.floor(t2.$d.getTime() / 1e3);
+              case "x":
+                return t2.$d.getTime();
+              case "z":
+                return "[" + t2.offsetName() + "]";
+              case "zzz":
+                return "[" + t2.offsetName("long") + "]";
+              default:
+                return e3;
+            }
+          });
+          return n.bind(this)(a);
+        };
+      };
+    });
+  })(advancedFormat$1);
+  var advancedFormatExports = advancedFormat$1.exports;
+  const advancedFormat = /* @__PURE__ */ getDefaultExportFromCjs(advancedFormatExports);
+  var duration$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(t, s2) {
+      module2.exports = s2();
+    }(commonjsGlobal, function() {
+      var t, s2, n = 1e3, i = 6e4, e = 36e5, r = 864e5, o = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, u = 31536e6, d = 2628e6, a = /^(-|\+)?P(?:([-+]?[0-9,.]*)Y)?(?:([-+]?[0-9,.]*)M)?(?:([-+]?[0-9,.]*)W)?(?:([-+]?[0-9,.]*)D)?(?:T(?:([-+]?[0-9,.]*)H)?(?:([-+]?[0-9,.]*)M)?(?:([-+]?[0-9,.]*)S)?)?$/, h = { years: u, months: d, days: r, hours: e, minutes: i, seconds: n, milliseconds: 1, weeks: 6048e5 }, c = function(t2) {
+        return t2 instanceof g;
+      }, f = function(t2, s3, n2) {
+        return new g(t2, n2, s3.$l);
+      }, m = function(t2) {
+        return s2.p(t2) + "s";
+      }, l2 = function(t2) {
+        return t2 < 0;
+      }, $ = function(t2) {
+        return l2(t2) ? Math.ceil(t2) : Math.floor(t2);
+      }, y = function(t2) {
+        return Math.abs(t2);
+      }, v = function(t2, s3) {
+        return t2 ? l2(t2) ? { negative: true, format: "" + y(t2) + s3 } : { negative: false, format: "" + t2 + s3 } : { negative: false, format: "" };
+      }, g = function() {
+        function l3(t2, s3, n2) {
+          var i2 = this;
+          if (this.$d = {}, this.$l = n2, void 0 === t2 && (this.$ms = 0, this.parseFromMilliseconds()), s3)
+            return f(t2 * h[m(s3)], this);
+          if ("number" == typeof t2)
+            return this.$ms = t2, this.parseFromMilliseconds(), this;
+          if ("object" == typeof t2)
+            return Object.keys(t2).forEach(function(s4) {
+              i2.$d[m(s4)] = t2[s4];
+            }), this.calMilliseconds(), this;
+          if ("string" == typeof t2) {
+            var e2 = t2.match(a);
+            if (e2) {
+              var r2 = e2.slice(2).map(function(t3) {
+                return null != t3 ? Number(t3) : 0;
+              });
+              return this.$d.years = r2[0], this.$d.months = r2[1], this.$d.weeks = r2[2], this.$d.days = r2[3], this.$d.hours = r2[4], this.$d.minutes = r2[5], this.$d.seconds = r2[6], this.calMilliseconds(), this;
+            }
+          }
+          return this;
+        }
+        var y2 = l3.prototype;
+        return y2.calMilliseconds = function() {
+          var t2 = this;
+          this.$ms = Object.keys(this.$d).reduce(function(s3, n2) {
+            return s3 + (t2.$d[n2] || 0) * h[n2];
+          }, 0);
+        }, y2.parseFromMilliseconds = function() {
+          var t2 = this.$ms;
+          this.$d.years = $(t2 / u), t2 %= u, this.$d.months = $(t2 / d), t2 %= d, this.$d.days = $(t2 / r), t2 %= r, this.$d.hours = $(t2 / e), t2 %= e, this.$d.minutes = $(t2 / i), t2 %= i, this.$d.seconds = $(t2 / n), t2 %= n, this.$d.milliseconds = t2;
+        }, y2.toISOString = function() {
+          var t2 = v(this.$d.years, "Y"), s3 = v(this.$d.months, "M"), n2 = +this.$d.days || 0;
+          this.$d.weeks && (n2 += 7 * this.$d.weeks);
+          var i2 = v(n2, "D"), e2 = v(this.$d.hours, "H"), r2 = v(this.$d.minutes, "M"), o2 = this.$d.seconds || 0;
+          this.$d.milliseconds && (o2 += this.$d.milliseconds / 1e3, o2 = Math.round(1e3 * o2) / 1e3);
+          var u2 = v(o2, "S"), d2 = t2.negative || s3.negative || i2.negative || e2.negative || r2.negative || u2.negative, a2 = e2.format || r2.format || u2.format ? "T" : "", h2 = (d2 ? "-" : "") + "P" + t2.format + s3.format + i2.format + a2 + e2.format + r2.format + u2.format;
+          return "P" === h2 || "-P" === h2 ? "P0D" : h2;
+        }, y2.toJSON = function() {
+          return this.toISOString();
+        }, y2.format = function(t2) {
+          var n2 = t2 || "YYYY-MM-DDTHH:mm:ss", i2 = { Y: this.$d.years, YY: s2.s(this.$d.years, 2, "0"), YYYY: s2.s(this.$d.years, 4, "0"), M: this.$d.months, MM: s2.s(this.$d.months, 2, "0"), D: this.$d.days, DD: s2.s(this.$d.days, 2, "0"), H: this.$d.hours, HH: s2.s(this.$d.hours, 2, "0"), m: this.$d.minutes, mm: s2.s(this.$d.minutes, 2, "0"), s: this.$d.seconds, ss: s2.s(this.$d.seconds, 2, "0"), SSS: s2.s(this.$d.milliseconds, 3, "0") };
+          return n2.replace(o, function(t3, s3) {
+            return s3 || String(i2[t3]);
+          });
+        }, y2.as = function(t2) {
+          return this.$ms / h[m(t2)];
+        }, y2.get = function(t2) {
+          var s3 = this.$ms, n2 = m(t2);
+          return "milliseconds" === n2 ? s3 %= 1e3 : s3 = "weeks" === n2 ? $(s3 / h[n2]) : this.$d[n2], s3 || 0;
+        }, y2.add = function(t2, s3, n2) {
+          var i2;
+          return i2 = s3 ? t2 * h[m(s3)] : c(t2) ? t2.$ms : f(t2, this).$ms, f(this.$ms + i2 * (n2 ? -1 : 1), this);
+        }, y2.subtract = function(t2, s3) {
+          return this.add(t2, s3, true);
+        }, y2.locale = function(t2) {
+          var s3 = this.clone();
+          return s3.$l = t2, s3;
+        }, y2.clone = function() {
+          return f(this.$ms, this);
+        }, y2.humanize = function(s3) {
+          return t().add(this.$ms, "ms").locale(this.$l).fromNow(!s3);
+        }, y2.valueOf = function() {
+          return this.asMilliseconds();
+        }, y2.milliseconds = function() {
+          return this.get("milliseconds");
+        }, y2.asMilliseconds = function() {
+          return this.as("milliseconds");
+        }, y2.seconds = function() {
+          return this.get("seconds");
+        }, y2.asSeconds = function() {
+          return this.as("seconds");
+        }, y2.minutes = function() {
+          return this.get("minutes");
+        }, y2.asMinutes = function() {
+          return this.as("minutes");
+        }, y2.hours = function() {
+          return this.get("hours");
+        }, y2.asHours = function() {
+          return this.as("hours");
+        }, y2.days = function() {
+          return this.get("days");
+        }, y2.asDays = function() {
+          return this.as("days");
+        }, y2.weeks = function() {
+          return this.get("weeks");
+        }, y2.asWeeks = function() {
+          return this.as("weeks");
+        }, y2.months = function() {
+          return this.get("months");
+        }, y2.asMonths = function() {
+          return this.as("months");
+        }, y2.years = function() {
+          return this.get("years");
+        }, y2.asYears = function() {
+          return this.as("years");
+        }, l3;
+      }(), p = function(t2, s3, n2) {
+        return t2.add(s3.years() * n2, "y").add(s3.months() * n2, "M").add(s3.days() * n2, "d").add(s3.hours() * n2, "h").add(s3.minutes() * n2, "m").add(s3.seconds() * n2, "s").add(s3.milliseconds() * n2, "ms");
+      };
+      return function(n2, i2, e2) {
+        t = e2, s2 = e2().$utils(), e2.duration = function(t2, s3) {
+          var n3 = e2.locale();
+          return f(t2, { $l: n3 }, s3);
+        }, e2.isDuration = c;
+        var r2 = i2.prototype.add, o2 = i2.prototype.subtract;
+        i2.prototype.add = function(t2, s3) {
+          return c(t2) ? p(this, t2, 1) : r2.bind(this)(t2, s3);
+        }, i2.prototype.subtract = function(t2, s3) {
+          return c(t2) ? p(this, t2, -1) : o2.bind(this)(t2, s3);
+        };
+      };
+    });
+  })(duration$1);
+  var durationExports = duration$1.exports;
+  const duration = /* @__PURE__ */ getDefaultExportFromCjs(durationExports);
+  var localizedFormat$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(e, t) {
+      module2.exports = t();
+    }(commonjsGlobal, function() {
+      var e = { LTS: "h:mm:ss A", LT: "h:mm A", L: "MM/DD/YYYY", LL: "MMMM D, YYYY", LLL: "MMMM D, YYYY h:mm A", LLLL: "dddd, MMMM D, YYYY h:mm A" };
+      return function(t, o, n) {
+        var r = o.prototype, i = r.format;
+        n.en.formats = e, r.format = function(t2) {
+          void 0 === t2 && (t2 = "YYYY-MM-DDTHH:mm:ssZ");
+          var o2 = this.$locale().formats, n2 = function(t3, o3) {
+            return t3.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g, function(t4, n3, r2) {
+              var i2 = r2 && r2.toUpperCase();
+              return n3 || o3[r2] || e[r2] || o3[i2].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, function(e2, t5, o4) {
+                return t5 || o4.slice(1);
+              });
+            });
+          }(t2, void 0 === o2 ? {} : o2);
+          return i.call(this, n2);
+        };
+      };
+    });
+  })(localizedFormat$1);
+  var localizedFormatExports = localizedFormat$1.exports;
+  const localizedFormat = /* @__PURE__ */ getDefaultExportFromCjs(localizedFormatExports);
+  var relativeTime$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(r, e) {
+      module2.exports = e();
+    }(commonjsGlobal, function() {
+      return function(r, e, t) {
+        r = r || {};
+        var n = e.prototype, o = { future: "in %s", past: "%s ago", s: "a few seconds", m: "a minute", mm: "%d minutes", h: "an hour", hh: "%d hours", d: "a day", dd: "%d days", M: "a month", MM: "%d months", y: "a year", yy: "%d years" };
+        function i(r2, e2, t2, o2) {
+          return n.fromToBase(r2, e2, t2, o2);
+        }
+        t.en.relativeTime = o, n.fromToBase = function(e2, n2, i2, d2, u) {
+          for (var f, a, s2, l2 = i2.$locale().relativeTime || o, h = r.thresholds || [{ l: "s", r: 44, d: "second" }, { l: "m", r: 89 }, { l: "mm", r: 44, d: "minute" }, { l: "h", r: 89 }, { l: "hh", r: 21, d: "hour" }, { l: "d", r: 35 }, { l: "dd", r: 25, d: "day" }, { l: "M", r: 45 }, { l: "MM", r: 10, d: "month" }, { l: "y", r: 17 }, { l: "yy", d: "year" }], m = h.length, c = 0; c < m; c += 1) {
+            var y = h[c];
+            y.d && (f = d2 ? t(e2).diff(i2, y.d, true) : i2.diff(e2, y.d, true));
+            var p = (r.rounding || Math.round)(Math.abs(f));
+            if (s2 = f > 0, p <= y.r || !y.r) {
+              p <= 1 && c > 0 && (y = h[c - 1]);
+              var v = l2[y.l];
+              u && (p = u("" + p)), a = "string" == typeof v ? v.replace("%d", p) : v(p, n2, y.l, s2);
+              break;
+            }
+          }
+          if (n2)
+            return a;
+          var M = s2 ? l2.future : l2.past;
+          return "function" == typeof M ? M(a) : M.replace("%s", a);
+        }, n.to = function(r2, e2) {
+          return i(r2, e2, this, true);
+        }, n.from = function(r2, e2) {
+          return i(r2, e2, this);
+        };
+        var d = function(r2) {
+          return r2.$u ? t.utc() : t();
+        };
+        n.toNow = function(r2) {
+          return this.to(d(this), r2);
+        }, n.fromNow = function(r2) {
+          return this.from(d(this), r2);
+        };
+      };
+    });
+  })(relativeTime$1);
+  var relativeTimeExports = relativeTime$1.exports;
+  const relativeTime = /* @__PURE__ */ getDefaultExportFromCjs(relativeTimeExports);
+  var timezone$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(t, e) {
+      module2.exports = e();
+    }(commonjsGlobal, function() {
+      var t = { year: 0, month: 1, day: 2, hour: 3, minute: 4, second: 5 }, e = {};
+      return function(n, i, o) {
+        var r, a = function(t2, n2, i2) {
+          void 0 === i2 && (i2 = {});
+          var o2 = new Date(t2), r2 = function(t3, n3) {
+            void 0 === n3 && (n3 = {});
+            var i3 = n3.timeZoneName || "short", o3 = t3 + "|" + i3, r3 = e[o3];
+            return r3 || (r3 = new Intl.DateTimeFormat("en-US", { hour12: false, timeZone: t3, year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit", timeZoneName: i3 }), e[o3] = r3), r3;
+          }(n2, i2);
+          return r2.formatToParts(o2);
+        }, u = function(e2, n2) {
+          for (var i2 = a(e2, n2), r2 = [], u2 = 0; u2 < i2.length; u2 += 1) {
+            var f2 = i2[u2], s3 = f2.type, m = f2.value, c = t[s3];
+            c >= 0 && (r2[c] = parseInt(m, 10));
+          }
+          var d = r2[3], l2 = 24 === d ? 0 : d, h = r2[0] + "-" + r2[1] + "-" + r2[2] + " " + l2 + ":" + r2[4] + ":" + r2[5] + ":000", v = +e2;
+          return (o.utc(h).valueOf() - (v -= v % 1e3)) / 6e4;
+        }, f = i.prototype;
+        f.tz = function(t2, e2) {
+          void 0 === t2 && (t2 = r);
+          var n2, i2 = this.utcOffset(), a2 = this.toDate(), u2 = a2.toLocaleString("en-US", { timeZone: t2 }), f2 = Math.round((a2 - new Date(u2)) / 1e3 / 60), s3 = 15 * -Math.round(a2.getTimezoneOffset() / 15) - f2;
+          if (!Number(s3))
+            n2 = this.utcOffset(0, e2);
+          else if (n2 = o(u2, { locale: this.$L }).$set("millisecond", this.$ms).utcOffset(s3, true), e2) {
+            var m = n2.utcOffset();
+            n2 = n2.add(i2 - m, "minute");
+          }
+          return n2.$x.$timezone = t2, n2;
+        }, f.offsetName = function(t2) {
+          var e2 = this.$x.$timezone || o.tz.guess(), n2 = a(this.valueOf(), e2, { timeZoneName: t2 }).find(function(t3) {
+            return "timezonename" === t3.type.toLowerCase();
+          });
+          return n2 && n2.value;
+        };
+        var s2 = f.startOf;
+        f.startOf = function(t2, e2) {
+          if (!this.$x || !this.$x.$timezone)
+            return s2.call(this, t2, e2);
+          var n2 = o(this.format("YYYY-MM-DD HH:mm:ss:SSS"), { locale: this.$L });
+          return s2.call(n2, t2, e2).tz(this.$x.$timezone, true);
+        }, o.tz = function(t2, e2, n2) {
+          var i2 = n2 && e2, a2 = n2 || e2 || r, f2 = u(+o(), a2);
+          if ("string" != typeof t2)
+            return o(t2).tz(a2);
+          var s3 = function(t3, e3, n3) {
+            var i3 = t3 - 60 * e3 * 1e3, o2 = u(i3, n3);
+            if (e3 === o2)
+              return [i3, e3];
+            var r2 = u(i3 -= 60 * (o2 - e3) * 1e3, n3);
+            return o2 === r2 ? [i3, o2] : [t3 - 60 * Math.min(o2, r2) * 1e3, Math.max(o2, r2)];
+          }(o.utc(t2, i2).valueOf(), f2, a2), m = s3[0], c = s3[1], d = o(m).utcOffset(c);
+          return d.$x.$timezone = a2, d;
+        }, o.tz.guess = function() {
+          return Intl.DateTimeFormat().resolvedOptions().timeZone;
+        }, o.tz.setDefault = function(t2) {
+          r = t2;
+        };
+      };
+    });
+  })(timezone$1);
+  var timezoneExports = timezone$1.exports;
+  const timezone = /* @__PURE__ */ getDefaultExportFromCjs(timezoneExports);
+  var updateLocale$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(e, n) {
+      module2.exports = n();
+    }(commonjsGlobal, function() {
+      return function(e, n, t) {
+        t.updateLocale = function(e2, n2) {
+          var o = t.Ls[e2];
+          if (o)
+            return (n2 ? Object.keys(n2) : []).forEach(function(e3) {
+              o[e3] = n2[e3];
+            }), o;
+        };
+      };
+    });
+  })(updateLocale$1);
+  var updateLocaleExports = updateLocale$1.exports;
+  const updateLocale = /* @__PURE__ */ getDefaultExportFromCjs(updateLocaleExports);
+  var utc$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(t, i) {
+      module2.exports = i();
+    }(commonjsGlobal, function() {
+      var t = "minute", i = /[+-]\d\d(?::?\d\d)?/g, e = /([+-]|\d\d)/g;
+      return function(s2, f, n) {
+        var u = f.prototype;
+        n.utc = function(t2) {
+          var i2 = { date: t2, utc: true, args: arguments };
+          return new f(i2);
+        }, u.utc = function(i2) {
+          var e2 = n(this.toDate(), { locale: this.$L, utc: true });
+          return i2 ? e2.add(this.utcOffset(), t) : e2;
+        }, u.local = function() {
+          return n(this.toDate(), { locale: this.$L, utc: false });
+        };
+        var o = u.parse;
+        u.parse = function(t2) {
+          t2.utc && (this.$u = true), this.$utils().u(t2.$offset) || (this.$offset = t2.$offset), o.call(this, t2);
+        };
+        var r = u.init;
+        u.init = function() {
+          if (this.$u) {
+            var t2 = this.$d;
+            this.$y = t2.getUTCFullYear(), this.$M = t2.getUTCMonth(), this.$D = t2.getUTCDate(), this.$W = t2.getUTCDay(), this.$H = t2.getUTCHours(), this.$m = t2.getUTCMinutes(), this.$s = t2.getUTCSeconds(), this.$ms = t2.getUTCMilliseconds();
+          } else
+            r.call(this);
+        };
+        var a = u.utcOffset;
+        u.utcOffset = function(s3, f2) {
+          var n2 = this.$utils().u;
+          if (n2(s3))
+            return this.$u ? 0 : n2(this.$offset) ? a.call(this) : this.$offset;
+          if ("string" == typeof s3 && (s3 = function(t2) {
+            void 0 === t2 && (t2 = "");
+            var s4 = t2.match(i);
+            if (!s4)
+              return null;
+            var f3 = ("" + s4[0]).match(e) || ["-", 0, 0], n3 = f3[0], u3 = 60 * +f3[1] + +f3[2];
+            return 0 === u3 ? 0 : "+" === n3 ? u3 : -u3;
+          }(s3), null === s3))
+            return this;
+          var u2 = Math.abs(s3) <= 16 ? 60 * s3 : s3, o2 = this;
+          if (f2)
+            return o2.$offset = u2, o2.$u = 0 === s3, o2;
+          if (0 !== s3) {
+            var r2 = this.$u ? this.toDate().getTimezoneOffset() : -1 * this.utcOffset();
+            (o2 = this.local().add(u2 + r2, t)).$offset = u2, o2.$x.$localOffset = r2;
+          } else
+            o2 = this.utc();
+          return o2;
+        };
+        var h = u.format;
+        u.format = function(t2) {
+          var i2 = t2 || (this.$u ? "YYYY-MM-DDTHH:mm:ss[Z]" : "");
+          return h.call(this, i2);
+        }, u.valueOf = function() {
+          var t2 = this.$utils().u(this.$offset) ? 0 : this.$offset + (this.$x.$localOffset || this.$d.getTimezoneOffset());
+          return this.$d.valueOf() - 6e4 * t2;
+        }, u.isUTC = function() {
+          return !!this.$u;
+        }, u.toISOString = function() {
+          return this.toDate().toISOString();
+        }, u.toString = function() {
+          return this.toDate().toUTCString();
+        };
+        var l2 = u.toDate;
+        u.toDate = function(t2) {
+          return "s" === t2 && this.$offset ? n(this.format("YYYY-MM-DD HH:mm:ss:SSS")).toDate() : l2.call(this);
+        };
+        var c = u.diff;
+        u.diff = function(t2, i2, e2) {
+          if (t2 && this.$u === t2.$u)
+            return c.call(this, t2, i2, e2);
+          var s3 = this.local(), f2 = n(t2).local();
+          return c.call(s3, f2, i2, e2);
+        };
+      };
+    });
+  })(utc$1);
+  var utcExports = utc$1.exports;
+  const utc = /* @__PURE__ */ getDefaultExportFromCjs(utcExports);
+  const Popover = ({
+    children,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, { ...props, children });
+  };
+  const Trigger$4 = styledComponents.styled($cb5cc270b50c6fcd$export$41fb9f06171c75f4).withConfig({
+    componentId: "sc-1dii14g-0"
+  })(["background:inherit;border:none;color:inherit;cursor:pointer;font:inherit;width:fit-content;"]);
+  const PopoverTrigger = ({
+    anchor,
+    children,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Trigger$4, { asChild: true, ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children }) }),
+      anchor && /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$b688253958b8dfe7, { asChild: true, children: anchor })
+    ] });
+  };
+  PopoverTrigger.displayName = "PopoverTrigger";
+  Popover.Trigger = PopoverTrigger;
+  const MenuPanel = styledComponents.styled(GenericMenuPanel).withConfig({
+    componentId: "sc-1dii14g-1"
+  })(["display:block;padding:", " ", ";background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";", ";"], ({
+    theme: theme2
+  }) => theme2.click.popover.space.y, ({
+    theme: theme2
+  }) => theme2.click.popover.space.x, ({
+    theme: theme2
+  }) => theme2.click.popover.color.panel.background.default, ({
+    theme: theme2
+  }) => theme2.click.popover.color.panel.stroke.default, ({
+    theme: theme2
+  }) => theme2.click.popover.radii.all, ({
+    theme: theme2
+  }) => theme2.click.popover.shadow.default, ({
+    $showClose
+  }) => $showClose ? "padding-top: 1rem;" : "");
+  const CloseButton$1 = styledComponents.styled(EmptyButton$1).withConfig({
+    componentId: "sc-1dii14g-2"
+  })(["position:absolute;top:", ";right:", ";width:", ";height:", ";"], ({
+    theme: theme2
+  }) => theme2.click.popover.space.y, ({
+    theme: theme2
+  }) => theme2.click.popover.space.x, ({
+    theme: theme2
+  }) => theme2.click.popover.icon.size.width, ({
+    theme: theme2
+  }) => theme2.click.popover.icon.size.height);
+  const PopoverContent = ({
+    children,
+    showArrow,
+    showClose,
+    forceMount,
+    container,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$602eac185826482c, { forceMount, container, children: /* @__PURE__ */ jsxRuntime.jsxs(MenuPanel, { as: $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, $type: "popover", $showClose: showClose, $showArrow: showArrow, sideOffset: 4, ...props, children: [
+      showClose && /* @__PURE__ */ jsxRuntime.jsx(CloseButton$1, { as: $cb5cc270b50c6fcd$export$f39c2d165cd861fe, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "cross" }) }),
+      showArrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow$1, { asChild: true, as: $cb5cc270b50c6fcd$export$21b07c8f274aebd5, width: 20, height: 10, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverArrow, {}) }),
+      children
+    ] }) });
+  };
+  PopoverContent.displayName = "PopoverContent";
+  Popover.Content = PopoverContent;
+  const linkStyles = styledComponents.css(["font:", ";color:", ";margin:0;text-decoration:none;display:inline-flex;gap:", ";margin-right:", ";align-items:center;&:hover,&:focus{color:", ";transition:", ";text-decoration:underline;cursor:pointer;}&:visited{color:", ";}"], ({
+    $size,
+    $weight = "normal",
+    theme: theme2
+  }) => theme2.typography.styles.product.text[$weight][$size], ({
+    theme: theme2
+  }) => theme2.click.global.color.text.link.default, ({
+    $size,
+    theme: theme2
+  }) => $size === "xs" || $size === "sm" ? theme2.click.link.space.sm.gap : theme2.click.link.space.md.gap, ({
+    $size,
+    theme: theme2
+  }) => $size === "xs" || $size === "sm" ? theme2.click.link.space.sm.gap : theme2.click.link.space.md.gap, ({
+    theme: theme2
+  }) => theme2.click.global.color.text.link.hover, ({
+    theme: theme2
+  }) => theme2.transition.default, ({
+    theme: theme2
+  }) => theme2.click.global.color.text.link.default);
+  const GridContainer$1 = ({
+    alignItems = "stretch",
+    alignContent = "stretch",
+    children,
+    columnGap,
+    gap,
+    gridAutoColumns,
+    gridAutoFlow,
+    gridAutoRows,
+    gridTemplateAreas,
+    gridTemplateColumns,
+    gridTemplateRows,
+    gridTemplate,
+    inline = false,
+    isResponsive = true,
+    justifyContent = "stretch",
+    justifyItems = "stretch",
+    rowGap,
+    height,
+    maxHeight,
+    minHeight,
+    fillWidth = true,
+    maxWidth,
+    minWidth,
+    overflow,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(Wrapper$4, { $alignItems: alignItems, $alignContent: alignContent, $columnGap: columnGap, $gap: gap, $gridAutoColumns: gridAutoColumns, $gridAutoFlow: gridAutoFlow, $gridAutoRows: gridAutoRows, $gridTemplateAreas: gridTemplateAreas, $gridTemplateColumns: gridTemplateColumns, $gridTemplateRows: gridTemplateRows, $gridTemplate: gridTemplate, $inline: inline, $isResponsive: isResponsive, $justifyContent: justifyContent, $justifyItems: justifyItems, $rowGap: rowGap, $height: height, $maxHeight: maxHeight, $minHeight: minHeight, $fillWidth: fillWidth, $maxWidth: maxWidth, $minWidth: minWidth, $overflow: overflow, "data-testid": "grid-container", ...props, children });
+  };
+  const Wrapper$4 = styledComponents.styled.div.withConfig({
+    componentId: "sc-r57kdn-0"
+  })(["align-items:", ";align-content:", ";display:", ";", ";", ";", ";", ";", ";", ";", ";justify-content:", ";justify-items:", ";", " ", " ", " ", " @media (max-width:", "){grid-template-columns:", ";}"], ({
+    $alignItems = "stretch"
+  }) => $alignItems, ({
+    $alignContent = "stretch"
+  }) => $alignContent, ({
+    $inline
+  }) => $inline === true ? "inline-grid" : "grid", ({
+    $gridAutoColumns
+  }) => $gridAutoColumns && `grid-auto-columns: ${$gridAutoColumns}`, ({
+    $gridAutoFlow
+  }) => $gridAutoFlow && `grid-auto-flow: ${$gridAutoFlow}`, ({
+    $gridAutoRows
+  }) => $gridAutoRows && `grid-auto-rows: ${$gridAutoRows}`, ({
+    $gridTemplateAreas
+  }) => $gridTemplateAreas && `grid-template-area: ${$gridTemplateAreas}`, ({
+    $gridTemplateColumns
+  }) => $gridTemplateColumns && `grid-template-columns: ${$gridTemplateColumns}`, ({
+    $gridTemplateRows
+  }) => $gridTemplateRows && `grid-template-rows: ${$gridTemplateRows}`, ({
+    $gridTemplate
+  }) => $gridTemplate && `grid-template:  ${$gridTemplate}`, ({
+    $justifyContent = "stretch"
+  }) => $justifyContent, ({
+    $justifyItems = "stretch"
+  }) => $justifyItems, ({
+    theme: theme2,
+    $gap,
+    $columnGap,
+    $rowGap
+  }) => `
+    gap: ${$gap ? theme2.click.gridContainer.gap[$gap] : "inherit"};
+    ${$columnGap && `column-gap: ${theme2.click.gridContainer.gap[$columnGap]}`};
+    ${$rowGap && `row-gap: ${theme2.click.gridContainer.gap[$rowGap]}`};
+  `, ({
+    $fillWidth,
+    $maxWidth,
+    $minWidth
+  }) => `
+    width: ${$fillWidth ? "100%" : "auto"};
+    ${typeof $maxWidth === "string" && `max-width: ${$maxWidth}`};
+    ${typeof $minWidth === "string" && `min-width: ${$minWidth}`};
+  `, ({
+    $height,
+    $maxHeight,
+    $minHeight
+  }) => `
+    ${typeof $height === "string" && `height: ${$height}`};
+    ${typeof $maxHeight === "string" && `max-height: ${$maxHeight}`};
+    ${typeof $minHeight === "string" && `min-height: ${$minHeight}`};
+  `, ({
+    $overflow
+  }) => `
+    ${typeof $overflow === "string" && `overflow: ${$overflow}`};
+  `, ({
+    theme: theme2
+  }) => theme2.breakpoint.sizes.md, ({
+    $isResponsive = true
+  }) => $isResponsive === true ? "1fr" : ({
+    $gridTemplateColumns
+  }) => $gridTemplateColumns || "auto");
+  dayjs.extend(advancedFormat);
+  dayjs.extend(duration);
+  dayjs.extend(localizedFormat);
+  dayjs.extend(updateLocale);
+  dayjs.extend(utc);
+  const thresholds = [{
+    l: "s",
+    r: 1,
+    d: "second"
+  }, {
+    l: "ss",
+    r: 56,
+    d: "second"
+  }, {
+    l: "m",
+    r: 90,
+    d: "second"
+  }, {
+    l: "mm",
+    r: 55,
+    d: "minute"
+  }, {
+    l: "h",
+    r: 90,
+    d: "minute"
+  }, {
+    l: "hh",
+    r: 22,
+    d: "hour"
+  }, {
+    l: "d",
+    r: 40,
+    d: "hour"
+  }, {
+    l: "dd",
+    r: 31,
+    d: "day"
+  }, {
+    l: "M",
+    r: 45,
+    d: "day"
+  }, {
+    l: "MM",
+    r: 11,
+    d: "month"
+  }, {
+    l: "y",
+    r: 17,
+    d: "month"
+  }, {
+    l: "yy",
+    r: 2,
+    d: "year"
+  }];
+  dayjs.extend(relativeTime, {
+    thresholds
+  });
+  dayjs.updateLocale("en", {
+    relativeTime: {
+      future: "In %s",
+      past: "%s ago",
+      s: "a few seconds",
+      ss: "%d seconds",
+      m: "1 minute",
+      mm: "%d minutes",
+      h: "1 hour",
+      hh: "%d hours",
+      d: "1 day",
+      dd: "%d days",
+      w: "1 week",
+      ww: "%d weeks",
+      M: "1 month",
+      MM: "%d months",
+      y: "1 year",
+      yy: "%d years"
+    }
+  });
+  const UnderlinedTrigger = styledComponents.styled(Popover.Trigger).withConfig({
+    componentId: "sc-17qquw8-0"
+  })(["", ""], linkStyles);
+  const formatDateDetails = (date, timezone2) => {
+    const isCurrentYear = dayjs().year() === date.year();
+    const formatForCurrentYear = "MMM D, h:mm a";
+    const formatForPastYear = "MMM D, YYYY, h:mm a";
+    if (isCurrentYear) {
+      if (timezone2) {
+        const dateWithTimezone = date.tz(timezone2);
+        return dateWithTimezone.format(formatForCurrentYear).replace("am", "a.m.").replace("pm", "p.m.");
+      }
+      return date.format(formatForCurrentYear).replace("am", "a.m.").replace("pm", "p.m.");
+    }
+    if (timezone2) {
+      const dateWithTimezone = date.tz(timezone2);
+      return dateWithTimezone.format(formatForPastYear).replace("am", "a.m.").replace("pm", "p.m.");
+    }
+    return date.format(formatForPastYear).replace("am", "a.m.").replace("pm", "p.m.");
+  };
+  const formatTimezone = (date, timezone2) => {
+    var _a;
+    return ((_a = new Intl.DateTimeFormat(void 0, {
+      timeZone: timezone2,
+      timeZoneName: "short"
+    }).formatToParts(date.toDate()).find((part) => part.type === "timeZoneName")) == null ? void 0 : _a.value) ?? date.format("z");
+  };
+  const DateDetails = ({
+    date,
+    side = "top",
+    systemTimeZone = "America/New_York"
+  }) => {
+    const dayjsDate = dayjs(date);
+    let systemTime;
+    if (systemTimeZone) {
+      dayjs.extend(timezone);
+      try {
+        systemTime = dayjsDate.tz(systemTimeZone);
+      } catch {
+        systemTime = dayjsDate.tz("America/New_York");
+      }
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(UnderlinedTrigger, { $size: "sm", $weight: "medium", children: /* @__PURE__ */ jsxRuntime.jsx(Text, { size: "sm", children: dayjs.utc(date).fromNow() }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Popover.Content, { side, showArrow: true, children: /* @__PURE__ */ jsxRuntime.jsxs(GridContainer$1, { columnGap: "xl", gridTemplateColumns: "repeat(2, auto)", gap: "sm", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", size: "sm", children: "Local" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Container, { justifyContent: "end", children: /* @__PURE__ */ jsxRuntime.jsxs(Text, { size: "sm", children: [
+          formatDateDetails(dayjsDate),
+          " (",
+          formatTimezone(dayjsDate, dayjs.tz.guess()),
+          ")"
+        ] }) }),
+        systemTime && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", size: "sm", children: "System" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Container, { justifyContent: "end", children: /* @__PURE__ */ jsxRuntime.jsxs(Text, { size: "sm", children: [
+            formatDateDetails(systemTime, systemTimeZone),
+            " (",
+            formatTimezone(systemTime, systemTimeZone),
+            ")"
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", size: "sm", children: "UTC" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Container, { justifyContent: "end", children: /* @__PURE__ */ jsxRuntime.jsx(Text, { size: "sm", children: formatDateDetails(dayjsDate.utc(), "UTC") }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "muted", size: "sm", children: "Unix" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Container, { justifyContent: "end", children: /* @__PURE__ */ jsxRuntime.jsx(Text, { size: "sm", children: Math.round(date.getTime() / 1e3) }) })
+      ] }) })
+    ] });
+  };
   const constructFromSymbol = Symbol.for("constructDateFrom");
   function constructFrom(date, value) {
     if (typeof date === "function")
@@ -14997,7 +16079,7 @@ var __publicField = (obj, key, value) => {
       [calendar, getBody, getHeaders, setNext, setPrev, viewType]
     );
   }
-  const Wrapper$4 = styledComponents.styled.div.withConfig({
+  const Wrapper$3 = styledComponents.styled.div.withConfig({
     componentId: "sc-1pvd2nj-0"
   })(["width:inherit;display:flex;align-items:center;justify-content:space-between;align-items:center;span:first-of-type{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}", ""], ({
     theme: theme2,
@@ -15109,7 +16191,7 @@ var __publicField = (obj, key, value) => {
   }) => {
     return /* @__PURE__ */ jsxRuntime.jsxs(FormRoot, { $orientation: orientation, $dir: dir, $addLabelPadding: true, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(FormElementContainer, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Wrapper$4, { $error: !!error2, $resize: resize, "data-resize": resize, className: disabled ? `disabled ${className}` : className, children }),
+        /* @__PURE__ */ jsxRuntime.jsx(Wrapper$3, { $error: !!error2, $resize: resize, "data-resize": resize, className: disabled ? `disabled ${className}` : className, children }),
         !!error2 && error2 !== true && /* @__PURE__ */ jsxRuntime.jsx(Error$1, { children: error2 })
       ] }),
       label && /* @__PURE__ */ jsxRuntime.jsx(StyledLabel, { htmlFor: id, disabled, error: !!error2, $labelColor: labelColor, children: label })
@@ -15633,14 +16715,14 @@ var __publicField = (obj, key, value) => {
   }) => {
     return /* @__PURE__ */ jsxRuntime.jsx($5d3850c4d0b4e6c7$export$be92b6f5f03c0fe9, { ...props, children });
   };
-  const Trigger$4 = styledComponents.styled($5d3850c4d0b4e6c7$export$41fb9f06171c75f4).withConfig({
+  const Trigger$3 = styledComponents.styled($5d3850c4d0b4e6c7$export$41fb9f06171c75f4).withConfig({
     componentId: "sc-1wr6otn-0"
   })(["width:fit-content;background:transparent;border:none;cursor:pointer;"]);
   const DialogTrigger = ({
     children,
     ...props
   }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(Trigger$4, { ...props, children });
+    return /* @__PURE__ */ jsxRuntime.jsx(Trigger$3, { ...props, children });
   };
   DialogTrigger.displayName = "DialogTrigger";
   Dialog.Trigger = DialogTrigger;
@@ -15699,10 +16781,10 @@ var __publicField = (obj, key, value) => {
   })(["font:", ";padding:0;margin:0;"], ({
     theme: theme2
   }) => theme2.click.dialog.typography.title.default);
-  const CloseButton$1 = ({
+  const CloseButton = ({
     onClose
   }) => /* @__PURE__ */ jsxRuntime.jsx($5d3850c4d0b4e6c7$export$f39c2d165cd861fe, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CrossButton, { onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "cross", size: "lg" }) }) });
-  const DialogContent$1 = ({
+  const DialogContent = ({
     title,
     children,
     showClose,
@@ -15717,68 +16799,29 @@ var __publicField = (obj, key, value) => {
       /* @__PURE__ */ jsxRuntime.jsxs(ContentArea, { ...props, children: [
         /* @__PURE__ */ jsxRuntime.jsxs(TitleArea, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(Title$1, { children: title }),
-          showClose && /* @__PURE__ */ jsxRuntime.jsx(CloseButton$1, { onClose })
+          showClose && /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { onClose })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(Spacer, { size: "sm" }),
         children
       ] })
     ] });
   };
-  DialogContent$1.displayName = "DialogContent";
-  Dialog.Content = DialogContent$1;
-  const ActionsWrapper = styledComponents.styled.div.withConfig({
-    componentId: "sc-6eozxy-0"
-  })(["display:flex;justify-content:flex-end;gap:", ";"], (props) => props.theme.click.dialog.space.gap);
-  const DialogContent = styledComponents.styled.div.withConfig({
-    componentId: "sc-6eozxy-1"
-  })(["overflow:hidden;display:flex;flex-direction:column;"]);
-  const ConfirmationDialog = ({
-    children,
-    disabled,
-    loading,
-    message,
-    onCancel,
-    onConfirm,
-    open: open2,
-    primaryActionLabel = "Confirm",
-    primaryActionType = "primary",
-    secondaryActionLabel = "Cancel",
-    showClose,
-    title,
-    ...props
-  }) => {
-    if (children && message) {
-      throw new Error("You can't pass children and message props at the same time");
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: open2, onOpenChange: (open22) => {
-      !open22 && onCancel && onCancel();
-    }, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { as: Dialog.Content, title, showClose, ...props, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Container, { overflow: "auto", grow: "1", orientation: "vertical", children: children ? children : /* @__PURE__ */ jsxRuntime.jsx(Text, { children: message }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(Separator, { size: "xl" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(ActionsWrapper, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Dialog.Close, { label: secondaryActionLabel, "data-testid": "cancel-action-button" }),
-        /* @__PURE__ */ jsxRuntime.jsx(Dialog.Close, { loading: !!loading, disabled: !!disabled || !!loading, type: primaryActionType, label: primaryActionLabel, onClick: () => {
-          if (onConfirm) {
-            onConfirm();
-          }
-        }, "data-testid": "confirm-action-button" })
-      ] })
-    ] }) });
-  };
+  DialogContent.displayName = "DialogContent";
+  Dialog.Content = DialogContent;
   const Flyout = ({
     modal = false,
     ...props
   }) => {
     return /* @__PURE__ */ jsxRuntime.jsx($5d3850c4d0b4e6c7$export$3ddf2d174ce01153, { modal, ...props });
   };
-  const Trigger$3 = ({
+  const Trigger$2 = ({
     children,
     ...props
   }) => {
     return /* @__PURE__ */ jsxRuntime.jsx($5d3850c4d0b4e6c7$export$2e1e1122cf0cba88, { asChild: true, ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children }) });
   };
-  Trigger$3.displayName = "Flyout.Trigger";
-  Flyout.Trigger = Trigger$3;
+  Trigger$2.displayName = "Flyout.Trigger";
+  Flyout.Trigger = Trigger$2;
   const animationWidth = () => styledComponents.keyframes({
     from: {
       width: 0
@@ -16006,97 +17049,6 @@ var __publicField = (obj, key, value) => {
     ] }),
     label && /* @__PURE__ */ jsxRuntime.jsx(Label$1, { htmlFor: id, error: !!error2, children: label })
   ] });
-  const GridContainer$1 = ({
-    alignItems = "stretch",
-    alignContent = "stretch",
-    children,
-    columnGap,
-    gap,
-    gridAutoColumns,
-    gridAutoFlow,
-    gridAutoRows,
-    gridTemplateAreas,
-    gridTemplateColumns,
-    gridTemplateRows,
-    gridTemplate,
-    inline = false,
-    isResponsive = true,
-    justifyContent = "stretch",
-    justifyItems = "stretch",
-    rowGap,
-    height,
-    maxHeight,
-    minHeight,
-    fillWidth = true,
-    maxWidth,
-    minWidth,
-    overflow,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(Wrapper$3, { $alignItems: alignItems, $alignContent: alignContent, $columnGap: columnGap, $gap: gap, $gridAutoColumns: gridAutoColumns, $gridAutoFlow: gridAutoFlow, $gridAutoRows: gridAutoRows, $gridTemplateAreas: gridTemplateAreas, $gridTemplateColumns: gridTemplateColumns, $gridTemplateRows: gridTemplateRows, $gridTemplate: gridTemplate, $inline: inline, $isResponsive: isResponsive, $justifyContent: justifyContent, $justifyItems: justifyItems, $rowGap: rowGap, $height: height, $maxHeight: maxHeight, $minHeight: minHeight, $fillWidth: fillWidth, $maxWidth: maxWidth, $minWidth: minWidth, $overflow: overflow, "data-testid": "grid-container", ...props, children });
-  };
-  const Wrapper$3 = styledComponents.styled.div.withConfig({
-    componentId: "sc-r57kdn-0"
-  })(["align-items:", ";align-content:", ";display:", ";", ";", ";", ";", ";", ";", ";", ";justify-content:", ";justify-items:", ";", " ", " ", " ", " @media (max-width:", "){grid-template-columns:", ";}"], ({
-    $alignItems = "stretch"
-  }) => $alignItems, ({
-    $alignContent = "stretch"
-  }) => $alignContent, ({
-    $inline
-  }) => $inline === true ? "inline-grid" : "grid", ({
-    $gridAutoColumns
-  }) => $gridAutoColumns && `grid-auto-columns: ${$gridAutoColumns}`, ({
-    $gridAutoFlow
-  }) => $gridAutoFlow && `grid-auto-flow: ${$gridAutoFlow}`, ({
-    $gridAutoRows
-  }) => $gridAutoRows && `grid-auto-rows: ${$gridAutoRows}`, ({
-    $gridTemplateAreas
-  }) => $gridTemplateAreas && `grid-template-area: ${$gridTemplateAreas}`, ({
-    $gridTemplateColumns
-  }) => $gridTemplateColumns && `grid-template-columns: ${$gridTemplateColumns}`, ({
-    $gridTemplateRows
-  }) => $gridTemplateRows && `grid-template-rows: ${$gridTemplateRows}`, ({
-    $gridTemplate
-  }) => $gridTemplate && `grid-template:  ${$gridTemplate}`, ({
-    $justifyContent = "stretch"
-  }) => $justifyContent, ({
-    $justifyItems = "stretch"
-  }) => $justifyItems, ({
-    theme: theme2,
-    $gap,
-    $columnGap,
-    $rowGap
-  }) => `
-    gap: ${$gap ? theme2.click.gridContainer.gap[$gap] : "inherit"};
-    ${$columnGap && `column-gap: ${theme2.click.gridContainer.gap[$columnGap]}`};
-    ${$rowGap && `row-gap: ${theme2.click.gridContainer.gap[$rowGap]}`};
-  `, ({
-    $fillWidth,
-    $maxWidth,
-    $minWidth
-  }) => `
-    width: ${$fillWidth ? "100%" : "auto"};
-    ${typeof $maxWidth === "string" && `max-width: ${$maxWidth}`};
-    ${typeof $minWidth === "string" && `min-width: ${$minWidth}`};
-  `, ({
-    $height,
-    $maxHeight,
-    $minHeight
-  }) => `
-    ${typeof $height === "string" && `height: ${$height}`};
-    ${typeof $maxHeight === "string" && `max-height: ${$maxHeight}`};
-    ${typeof $minHeight === "string" && `min-height: ${$minHeight}`};
-  `, ({
-    $overflow
-  }) => `
-    ${typeof $overflow === "string" && `overflow: ${$overflow}`};
-  `, ({
-    theme: theme2
-  }) => theme2.breakpoint.sizes.md, ({
-    $isResponsive = true
-  }) => $isResponsive === true ? "1fr" : ({
-    $gridTemplateColumns
-  }) => $gridTemplateColumns || "auto");
   const InlineContainer = styledComponents.styled.span.withConfig({
     componentId: "sc-ugg5k0-0"
   })(["", ""], ({
@@ -16110,305 +17062,6 @@ var __publicField = (obj, key, value) => {
     padding: 0 ${theme2.click.codeInline.space.x};
   `);
   const InlineCodeBlock = (props) => /* @__PURE__ */ jsxRuntime.jsx(InlineContainer, { ...props });
-  const $1b0217ee4a91d156$var$CONTEXT_MENU_NAME = "ContextMenu";
-  const [$1b0217ee4a91d156$var$createContextMenuContext, $1b0217ee4a91d156$export$1059331f43ddcc82] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($1b0217ee4a91d156$var$CONTEXT_MENU_NAME, [
-    $6cc32821e9371a1c$export$4027731b685e72eb
-  ]);
-  const $1b0217ee4a91d156$var$useMenuScope = $6cc32821e9371a1c$export$4027731b685e72eb();
-  const [$1b0217ee4a91d156$var$ContextMenuProvider, $1b0217ee4a91d156$var$useContextMenuContext] = $1b0217ee4a91d156$var$createContextMenuContext($1b0217ee4a91d156$var$CONTEXT_MENU_NAME);
-  const $1b0217ee4a91d156$export$8dc6765e8be191c7 = (props) => {
-    const { __scopeContextMenu, children, onOpenChange, dir, modal = true } = props;
-    const [open1, setOpen] = React.useState(false);
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    const handleOpenChangeProp = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onOpenChange);
-    const handleOpenChange = React.useCallback((open2) => {
-      setOpen(open2);
-      handleOpenChangeProp(open2);
-    }, [
-      handleOpenChangeProp
-    ]);
-    return /* @__PURE__ */ React.createElement($1b0217ee4a91d156$var$ContextMenuProvider, {
-      scope: __scopeContextMenu,
-      open: open1,
-      onOpenChange: handleOpenChange,
-      modal
-    }, /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$be92b6f5f03c0fe9, _extends$1({}, menuScope, {
-      dir,
-      open: open1,
-      onOpenChange: handleOpenChange,
-      modal
-    }), children));
-  };
-  const $1b0217ee4a91d156$var$TRIGGER_NAME = "ContextMenuTrigger";
-  const $1b0217ee4a91d156$export$be6fc7b1d5b0beb9 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, disabled = false, ...triggerProps } = props;
-    const context = $1b0217ee4a91d156$var$useContextMenuContext($1b0217ee4a91d156$var$TRIGGER_NAME, __scopeContextMenu);
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    const pointRef = React.useRef({
-      x: 0,
-      y: 0
-    });
-    const virtualRef = React.useRef({
-      getBoundingClientRect: () => DOMRect.fromRect({
-        width: 0,
-        height: 0,
-        ...pointRef.current
-      })
-    });
-    const longPressTimerRef = React.useRef(0);
-    const clearLongPress = React.useCallback(
-      () => window.clearTimeout(longPressTimerRef.current),
-      []
-    );
-    const handleOpen = (event) => {
-      pointRef.current = {
-        x: event.clientX,
-        y: event.clientY
-      };
-      context.onOpenChange(true);
-    };
-    React.useEffect(
-      () => clearLongPress,
-      [
-        clearLongPress
-      ]
-    );
-    React.useEffect(
-      () => void (disabled && clearLongPress()),
-      [
-        disabled,
-        clearLongPress
-      ]
-    );
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$b688253958b8dfe7, _extends$1({}, menuScope, {
-      virtualRef
-    })), /* @__PURE__ */ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends$1({
-      "data-state": context.open ? "open" : "closed",
-      "data-disabled": disabled ? "" : void 0
-    }, triggerProps, {
-      ref: forwardedRef,
-      style: {
-        WebkitTouchCallout: "none",
-        ...props.style
-      },
-      onContextMenu: disabled ? props.onContextMenu : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onContextMenu, (event) => {
-        clearLongPress();
-        handleOpen(event);
-        event.preventDefault();
-      }),
-      onPointerDown: disabled ? props.onPointerDown : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDown, $1b0217ee4a91d156$var$whenTouchOrPen((event) => {
-        clearLongPress();
-        longPressTimerRef.current = window.setTimeout(
-          () => handleOpen(event),
-          700
-        );
-      })),
-      onPointerMove: disabled ? props.onPointerMove : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerMove, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress)),
-      onPointerCancel: disabled ? props.onPointerCancel : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerCancel, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress)),
-      onPointerUp: disabled ? props.onPointerUp : $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerUp, $1b0217ee4a91d156$var$whenTouchOrPen(clearLongPress))
-    })));
-  });
-  const $1b0217ee4a91d156$export$14afd0be83e45060 = (props) => {
-    const { __scopeContextMenu, ...portalProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$602eac185826482c, _extends$1({}, menuScope, portalProps));
-  };
-  const $1b0217ee4a91d156$var$CONTENT_NAME = "ContextMenuContent";
-  const $1b0217ee4a91d156$export$572205900c9369e = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...contentProps } = props;
-    const context = $1b0217ee4a91d156$var$useContextMenuContext($1b0217ee4a91d156$var$CONTENT_NAME, __scopeContextMenu);
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    const hasInteractedOutsideRef = React.useRef(false);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$7c6e2c02157bb7d2, _extends$1({}, menuScope, contentProps, {
-      ref: forwardedRef,
-      side: "right",
-      sideOffset: 2,
-      align: "start",
-      onCloseAutoFocus: (event) => {
-        var _props$onCloseAutoFoc;
-        (_props$onCloseAutoFoc = props.onCloseAutoFocus) === null || _props$onCloseAutoFoc === void 0 || _props$onCloseAutoFoc.call(props, event);
-        if (!event.defaultPrevented && hasInteractedOutsideRef.current)
-          event.preventDefault();
-        hasInteractedOutsideRef.current = false;
-      },
-      onInteractOutside: (event) => {
-        var _props$onInteractOuts;
-        (_props$onInteractOuts = props.onInteractOutside) === null || _props$onInteractOuts === void 0 || _props$onInteractOuts.call(props, event);
-        if (!event.defaultPrevented && !context.modal)
-          hasInteractedOutsideRef.current = true;
-      },
-      style: {
-        ...props.style,
-        "--radix-context-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
-        "--radix-context-menu-content-available-width": "var(--radix-popper-available-width)",
-        "--radix-context-menu-content-available-height": "var(--radix-popper-available-height)",
-        "--radix-context-menu-trigger-width": "var(--radix-popper-anchor-width)",
-        "--radix-context-menu-trigger-height": "var(--radix-popper-anchor-height)"
-      }
-    }));
-  });
-  const $1b0217ee4a91d156$export$9860523b0fcdd664 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...groupProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$eb2fcfdbd7ba97d4, _extends$1({}, menuScope, groupProps, {
-      ref: forwardedRef
-    }));
-  });
-  const $1b0217ee4a91d156$export$16a26dc176a49100 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...itemProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$6d08773d2e66f8f2, _extends$1({}, menuScope, itemProps, {
-      ref: forwardedRef
-    }));
-  });
-  const $1b0217ee4a91d156$export$f47d0a58228a61e2 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...arrowProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$21b07c8f274aebd5, _extends$1({}, menuScope, arrowProps, {
-      ref: forwardedRef
-    }));
-  });
-  const $1b0217ee4a91d156$export$5bc21d1c00c4b201 = (props) => {
-    const { __scopeContextMenu, children, onOpenChange, open: openProp, defaultOpen } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    const [open2, setOpen] = $71cd76cc60e0454e$export$6f32135080cb4c3({
-      prop: openProp,
-      defaultProp: defaultOpen,
-      onChange: onOpenChange
-    });
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$d7a01e11500dfb6f, _extends$1({}, menuScope, {
-      open: open2,
-      onOpenChange: setOpen
-    }), children);
-  };
-  const $1b0217ee4a91d156$export$30b2b5c64556d316 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...triggerItemProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$2ea8a7a591ac5eac, _extends$1({}, menuScope, triggerItemProps, {
-      ref: forwardedRef
-    }));
-  });
-  const $1b0217ee4a91d156$export$2c967063bd2dc512 = /* @__PURE__ */ React.forwardRef((props, forwardedRef) => {
-    const { __scopeContextMenu, ...subContentProps } = props;
-    const menuScope = $1b0217ee4a91d156$var$useMenuScope(__scopeContextMenu);
-    return /* @__PURE__ */ React.createElement($6cc32821e9371a1c$export$6d4de93b380beddf, _extends$1({}, menuScope, subContentProps, {
-      ref: forwardedRef,
-      style: {
-        ...props.style,
-        "--radix-context-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
-        "--radix-context-menu-content-available-width": "var(--radix-popper-available-width)",
-        "--radix-context-menu-content-available-height": "var(--radix-popper-available-height)",
-        "--radix-context-menu-trigger-width": "var(--radix-popper-anchor-width)",
-        "--radix-context-menu-trigger-height": "var(--radix-popper-anchor-height)"
-      }
-    }));
-  });
-  function $1b0217ee4a91d156$var$whenTouchOrPen(handler) {
-    return (event) => event.pointerType !== "mouse" ? handler(event) : void 0;
-  }
-  const $1b0217ee4a91d156$export$be92b6f5f03c0fe9 = $1b0217ee4a91d156$export$8dc6765e8be191c7;
-  const $1b0217ee4a91d156$export$41fb9f06171c75f4 = $1b0217ee4a91d156$export$be6fc7b1d5b0beb9;
-  const $1b0217ee4a91d156$export$602eac185826482c = $1b0217ee4a91d156$export$14afd0be83e45060;
-  const $1b0217ee4a91d156$export$7c6e2c02157bb7d2 = $1b0217ee4a91d156$export$572205900c9369e;
-  const $1b0217ee4a91d156$export$eb2fcfdbd7ba97d4 = $1b0217ee4a91d156$export$9860523b0fcdd664;
-  const $1b0217ee4a91d156$export$6d08773d2e66f8f2 = $1b0217ee4a91d156$export$16a26dc176a49100;
-  const $1b0217ee4a91d156$export$21b07c8f274aebd5 = $1b0217ee4a91d156$export$f47d0a58228a61e2;
-  const $1b0217ee4a91d156$export$d7a01e11500dfb6f = $1b0217ee4a91d156$export$5bc21d1c00c4b201;
-  const $1b0217ee4a91d156$export$2ea8a7a591ac5eac = $1b0217ee4a91d156$export$30b2b5c64556d316;
-  const $1b0217ee4a91d156$export$6d4de93b380beddf = $1b0217ee4a91d156$export$2c967063bd2dc512;
-  const ContextMenu = (props) => /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$be92b6f5f03c0fe9, { ...props });
-  const ContextMenuTrigger$1 = React.forwardRef(({
-    disabled,
-    ...props
-  }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$41fb9f06171c75f4, { asChild: true, disabled, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, ...props }) });
-  });
-  ContextMenuTrigger$1.displayName = "ContextMenuTrigger";
-  ContextMenu.Trigger = ContextMenuTrigger$1;
-  const ContextMenuSubTrigger = ({
-    icon,
-    iconDir,
-    children,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(GenericMenuItem, { as: $1b0217ee4a91d156$export$2ea8a7a591ac5eac, ...props, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(IconWrapper$3, { icon, iconDir, children }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "dropdown-arrow", children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "chevron-right" }) })
-    ] });
-  };
-  ContextMenuSubTrigger.displayName = "ContextMenuSubTrigger";
-  ContextMenu.SubTrigger = ContextMenuSubTrigger;
-  const RightMenuContent = styledComponents.styled(GenericMenuPanel).withConfig({
-    componentId: "sc-8z6kye-0"
-  })(["flex-direction:column;z-index:1;", ";"], ({
-    $showArrow
-  }) => $showArrow ? `
-      &[data-side="bottom"] {
-        margin-top: -1px;
-      }
-      &[data-side="top"] {
-        margin-bottom: -1px;
-      }
-      &[data-side="left"] {
-        margin-right: -1px;
-        .popover-arrow {
-          margin-right: 1rem;
-        }
-      }
-      }
-      &[data-side="right"] {
-        margin-left: -1px;
-        .popover-arrow {
-          margin-left: 1rem;
-        }
-      }
-  ` : "");
-  const ContextMenuContent = ({
-    sub,
-    children,
-    showArrow,
-    ...props
-  }) => {
-    const ContentElement = sub ? $1b0217ee4a91d156$export$6d4de93b380beddf : $1b0217ee4a91d156$export$7c6e2c02157bb7d2;
-    return /* @__PURE__ */ jsxRuntime.jsx($1b0217ee4a91d156$export$602eac185826482c, { children: /* @__PURE__ */ jsxRuntime.jsxs(RightMenuContent, { $type: "context-menu", $showArrow: showArrow, as: ContentElement, ...props, children: [
-      showArrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow$1, { asChild: true, as: $1b0217ee4a91d156$export$21b07c8f274aebd5, width: 20, height: 10, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverArrow, { className: "popover-arrow" }) }),
-      children
-    ] }) });
-  };
-  ContextMenuContent.displayName = "ContextMenuContent";
-  ContextMenu.Content = ContextMenuContent;
-  const RightMenuGroup = styledComponents.styled($1b0217ee4a91d156$export$eb2fcfdbd7ba97d4).withConfig({
-    componentId: "sc-8z6kye-1"
-  })(["width:100%;border-bottom:1px solid ", ";"], ({
-    theme: theme2
-  }) => theme2.click.genericMenu.item.color.stroke.default);
-  const ContextMenuGroup = (props) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(RightMenuGroup, { ...props });
-  };
-  ContextMenuGroup.displayName = "ContextMenuGroup";
-  ContextMenu.Group = ContextMenuGroup;
-  const RightMenuSub = styledComponents.styled($1b0217ee4a91d156$export$d7a01e11500dfb6f).withConfig({
-    componentId: "sc-8z6kye-2"
-  })(["border-bottom:1px solid ", ";"], ({
-    theme: theme2
-  }) => theme2.click.genericMenu.item.color.stroke.default);
-  const ContextMenuSub = ({
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(RightMenuSub, { ...props });
-  };
-  ContextMenuSub.displayName = "ContextMenuSub";
-  ContextMenu.Sub = ContextMenuSub;
-  const ContextMenuItem = ({
-    icon,
-    iconDir,
-    children,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(GenericMenuItem, { as: $1b0217ee4a91d156$export$6d08773d2e66f8f2, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(IconWrapper$3, { icon, iconDir, children }) });
-  };
-  ContextMenuItem.displayName = "ContextMenuItem";
-  ContextMenu.Item = ContextMenuItem;
   function _inheritsLoose(subClass, superClass) {
     subClass.prototype = Object.create(superClass.prototype);
     subClass.prototype.constructor = subClass;
@@ -33419,14 +34072,14 @@ var __publicField = (obj, key, value) => {
   }) => {
     return /* @__PURE__ */ jsxRuntime.jsx($cef8881cdc69808e$export$be92b6f5f03c0fe9, { ...props, children });
   };
-  const Trigger$2 = styledComponents.styled($cef8881cdc69808e$export$41fb9f06171c75f4).withConfig({
+  const Trigger$1 = styledComponents.styled($cef8881cdc69808e$export$41fb9f06171c75f4).withConfig({
     componentId: "sc-1ect7b6-0"
   })(["width:fit-content;"]);
   const HoverCardTrigger = ({
     children,
     ...props
   }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(Trigger$2, { ...props, children });
+    return /* @__PURE__ */ jsxRuntime.jsx(Trigger$1, { ...props, children });
   };
   HoverCardTrigger.displayName = "HoverCardTrigger";
   HoverCard.Trigger = HoverCardTrigger;
@@ -33444,25 +34097,6 @@ var __publicField = (obj, key, value) => {
   };
   HoverCardContent.displayName = "HoverCardContent";
   HoverCard.Content = HoverCardContent;
-  const linkStyles = styledComponents.css(["font:", ";color:", ";margin:0;text-decoration:none;display:inline-flex;gap:", ";margin-right:", ";align-items:center;&:hover,&:focus{color:", ";transition:", ";text-decoration:underline;cursor:pointer;}&:visited{color:", ";}"], ({
-    $size,
-    $weight = "normal",
-    theme: theme2
-  }) => theme2.typography.styles.product.text[$weight][$size], ({
-    theme: theme2
-  }) => theme2.click.global.color.text.link.default, ({
-    $size,
-    theme: theme2
-  }) => $size === "xs" || $size === "sm" ? theme2.click.link.space.sm.gap : theme2.click.link.space.md.gap, ({
-    $size,
-    theme: theme2
-  }) => $size === "xs" || $size === "sm" ? theme2.click.link.space.sm.gap : theme2.click.link.space.md.gap, ({
-    theme: theme2
-  }) => theme2.click.global.color.text.link.hover, ({
-    theme: theme2
-  }) => theme2.transition.default, ({
-    theme: theme2
-  }) => theme2.click.global.color.text.link.default);
   const CuiLink = styledComponents.styled.a.withConfig({
     componentId: "sc-1bwz77u-0"
   })(["", ""], linkStyles);
@@ -33533,71 +34167,6 @@ var __publicField = (obj, key, value) => {
       /* @__PURE__ */ jsxRuntime.jsx(IconButton, { disabled, onClick: togglePasswordViewer, $show: value.length > 0, children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: viewPassword ? "eye-closed" : "eye", size: "md" }) })
     ] });
   });
-  const Popover = ({
-    children,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, { ...props, children });
-  };
-  const Trigger$1 = styledComponents.styled($cb5cc270b50c6fcd$export$41fb9f06171c75f4).withConfig({
-    componentId: "sc-1dii14g-0"
-  })(["width:fit-content;font:inherit;color:inherit;background:inherit;border:none;"]);
-  const PopoverTrigger = ({
-    anchor,
-    children,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Trigger$1, { asChild: true, ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children }) }),
-      anchor && /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$b688253958b8dfe7, { asChild: true, children: anchor })
-    ] });
-  };
-  PopoverTrigger.displayName = "PopoverTrigger";
-  Popover.Trigger = PopoverTrigger;
-  const MenuPanel = styledComponents.styled(GenericMenuPanel).withConfig({
-    componentId: "sc-1dii14g-1"
-  })(["display:block;padding:", " ", ";background-color:", ";border:1px solid ", ";border-radius:", ";box-shadow:", ";", ";"], ({
-    theme: theme2
-  }) => theme2.click.popover.space.y, ({
-    theme: theme2
-  }) => theme2.click.popover.space.x, ({
-    theme: theme2
-  }) => theme2.click.popover.color.panel.background.default, ({
-    theme: theme2
-  }) => theme2.click.popover.color.panel.stroke.default, ({
-    theme: theme2
-  }) => theme2.click.popover.radii.all, ({
-    theme: theme2
-  }) => theme2.click.popover.shadow.default, ({
-    $showClose
-  }) => $showClose ? "padding-top: 1rem;" : "");
-  const CloseButton = styledComponents.styled(EmptyButton$1).withConfig({
-    componentId: "sc-1dii14g-2"
-  })(["position:absolute;top:", ";right:", ";width:", ";height:", ";"], ({
-    theme: theme2
-  }) => theme2.click.popover.space.y, ({
-    theme: theme2
-  }) => theme2.click.popover.space.x, ({
-    theme: theme2
-  }) => theme2.click.popover.icon.size.width, ({
-    theme: theme2
-  }) => theme2.click.popover.icon.size.height);
-  const PopoverContent = ({
-    children,
-    showArrow,
-    showClose,
-    forceMount,
-    container,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsxRuntime.jsx($cb5cc270b50c6fcd$export$602eac185826482c, { forceMount, container, children: /* @__PURE__ */ jsxRuntime.jsxs(MenuPanel, { as: $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, $type: "popover", $showClose: showClose, $showArrow: showArrow, sideOffset: 4, ...props, children: [
-      showClose && /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { as: $cb5cc270b50c6fcd$export$f39c2d165cd861fe, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(SvgImage, { name: "cross" }) }),
-      showArrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow$1, { asChild: true, as: $cb5cc270b50c6fcd$export$21b07c8f274aebd5, width: 20, height: 10, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverArrow, {}) }),
-      children
-    ] }) });
-  };
-  PopoverContent.displayName = "PopoverContent";
-  Popover.Content = PopoverContent;
   const CustomSelect = styledComponents.styled.div.withConfig({
     componentId: "sc-dicnqe-0"
   })(["width:150px;"]);
@@ -34896,8 +35465,8 @@ var __publicField = (obj, key, value) => {
         }
         animationStates = [];
       },
-      animate: function animate(target, currentRect, toRect, duration) {
-        if (duration) {
+      animate: function animate(target, currentRect, toRect, duration2) {
+        if (duration2) {
           css(target, "transition", "");
           css(target, "transform", "");
           var elMatrix = matrix(this.el), scaleX = elMatrix && elMatrix.a, scaleY = elMatrix && elMatrix.d, translateX = (currentRect.left - toRect.left) / (scaleX || 1), translateY = (currentRect.top - toRect.top) / (scaleY || 1);
@@ -34905,7 +35474,7 @@ var __publicField = (obj, key, value) => {
           target.animatingY = !!translateY;
           css(target, "transform", "translate3d(" + translateX + "px," + translateY + "px,0)");
           this.forRepaintDummy = repaint(target);
-          css(target, "transition", "transform " + duration + "ms" + (this.options.easing ? " " + this.options.easing : ""));
+          css(target, "transition", "transform " + duration2 + "ms" + (this.options.easing ? " " + this.options.easing : ""));
           css(target, "transform", "translate3d(0,0,0)");
           typeof target.animated === "number" && clearTimeout(target.animated);
           target.animated = setTimeout(function() {
@@ -34914,7 +35483,7 @@ var __publicField = (obj, key, value) => {
             target.animated = false;
             target.animatingX = false;
             target.animatingY = false;
-          }, duration);
+          }, duration2);
         }
       }
     };
@@ -40282,7 +40851,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
   ]);
   const [$054eb8030ebde76e$var$ToastProviderProvider, $054eb8030ebde76e$var$useToastProviderContext] = $054eb8030ebde76e$var$createToastContext($054eb8030ebde76e$var$PROVIDER_NAME);
   const $054eb8030ebde76e$export$f5d03d415824e0e = (props) => {
-    const { __scopeToast, label = "Notification", duration = 5e3, swipeDirection = "right", swipeThreshold = 50, children } = props;
+    const { __scopeToast, label = "Notification", duration: duration2 = 5e3, swipeDirection = "right", swipeThreshold = 50, children } = props;
     const [viewport, setViewport] = React.useState(null);
     const [toastCount, setToastCount] = React.useState(0);
     const isFocusedToastEscapeKeyDownRef = React.useRef(false);
@@ -40292,7 +40861,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
     }, /* @__PURE__ */ React.createElement($054eb8030ebde76e$var$ToastProviderProvider, {
       scope: __scopeToast,
       label,
-      duration,
+      duration: duration2,
       swipeDirection,
       swipeThreshold,
       toastCount,
@@ -40579,12 +41148,12 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
         (_context$viewport2 = context.viewport) === null || _context$viewport2 === void 0 || _context$viewport2.focus();
       onClose();
     });
-    const startTimer = React.useCallback((duration) => {
-      if (!duration || duration === Infinity)
+    const startTimer = React.useCallback((duration2) => {
+      if (!duration2 || duration2 === Infinity)
         return;
       window.clearTimeout(closeTimerRef.current);
       closeTimerStartTimeRef.current = (/* @__PURE__ */ new Date()).getTime();
-      closeTimerRef.current = window.setTimeout(handleClose, duration);
+      closeTimerRef.current = window.setTimeout(handleClose, duration2);
     }, [
       handleClose
     ]);
@@ -41043,7 +41612,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
     title,
     description,
     actions = [],
-    duration,
+    duration: duration2,
     onClose
   }) => {
     let iconName = "";
@@ -41054,7 +41623,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
     } else if (type && ["danger", "warning"].includes(type)) {
       iconName = "warning";
     }
-    return /* @__PURE__ */ jsxRuntime.jsxs(ToastRoot, { onOpenChange: onClose, duration, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(ToastRoot, { onOpenChange: onClose, duration: duration2, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(ToastHeader, { children: [
         iconName.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(ToastIcon, { name: iconName, $type: type }),
         /* @__PURE__ */ jsxRuntime.jsx(Title, { children: title }),
@@ -50415,6 +50984,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
   exports2.Container = Container;
   exports2.ContextMenu = ContextMenu;
   exports2.DangerAlert = DangerAlert;
+  exports2.DateDetails = DateDetails;
   exports2.DatePicker = DatePicker;
   exports2.Dialog = Dialog;
   exports2.Dropdown = Dropdown;