twenty-ui 1.0.0-alpha.1 → 2.41.0

package/dist/navigation-CqKtMuQI.js

@@ -0,0 +1,724 @@
+import { c as A, r as b, s as I } from "./theme-constants-DETwIS-a.js";
+import { t as Ie } from "./utilities-kvjM4sIB.js";
+import { n as re } from "./linkifyText-DVk8e0sw.js";
+import { t as P } from "./mergeClassNames-BHKm1BNi.js";
+import { J as be, Ot as E, Zr as $, wt as ne } from "./TablerIcons-Ctfi8z4q.js";
+import { t as ke } from "./handleClickableElementKeyDown-C8Uz61XJ.js";
+import { m as ge, s as U, t as ie, x as Ce } from "./data-display-ByvqdkPn.js";
+import { i as ye, n as pe, r as Me, t as C } from "./OverflowingTextWithTooltip-C21bgWKF.js";
+import { F as Se, a as we, f as oe } from "./input-DOIOurw8.js";
+import { d as Ne } from "./surfaces-B8zw9F5W.js";
+import { clsx as f } from "clsx";
+import { forwardRef as D } from "react";
+import { isBoolean as Le, isNonEmptyString as O, isString as R } from "@sniptt/guards";
+import { Fragment as L, jsx as e, jsxs as m } from "react/jsx-runtime";
+import { Link as le } from "react-router-dom";
+import { useDirection as ze } from "@base-ui/react/direction-provider";
+import { Tabs as N } from "@base-ui/react/tabs";
+var Be = "_root_5ahh0_1", Te = { root: Be }, xe = (t) => /* @__PURE__ */ e("a", {
+  className: f(Te.root, t.className),
+  href: t.href,
+  onClick: t.onClick,
+  target: t.target,
+  rel: t.rel,
+  children: t.children
+}), Ae = "_root_1d4p2_1", Re = { root: Ae }, _a = ({ href: t, children: a, onClick: i, maxWidth: n }) => /* @__PURE__ */ e("a", {
+  className: Re.root,
+  style: { "--contact-link-max-width": n ?? "100%" },
+  target: "_blank",
+  onClick: i,
+  href: re(t),
+  children: a
+}), je = "https://github.com/twentyhq/twenty", fa = ({ version: t }) => /* @__PURE__ */ m(xe, {
+  href: je,
+  target: "_blank",
+  rel: "noreferrer",
+  children: [/* @__PURE__ */ e(be, { size: b().icon.size.md }), t]
+}), Ia = "https://cal.com/team/twenty/talk-to-us", ba = "https://twenty.com/pricing", Pe = {
+  gray: "Gray",
+  tomato: "Tomato",
+  red: "Red",
+  ruby: "Ruby",
+  crimson: "Crimson",
+  pink: "Pink",
+  plum: "Plum",
+  purple: "Purple",
+  violet: "Violet",
+  iris: "Iris",
+  cyan: "Cyan",
+  turquoise: "Turquoise",
+  sky: "Sky",
+  blue: "Blue",
+  jade: "Jade",
+  green: "Green",
+  grass: "Grass",
+  mint: "Mint",
+  lime: "Lime",
+  bronze: "Bronze",
+  gold: "Gold",
+  brown: "Brown",
+  orange: "Orange",
+  amber: "Amber",
+  yellow: "Yellow"
+}, De = "_iconContainer_1ivx0_1", Oe = "_withBackground_1ivx0_9", Z = {
+  iconContainer: De,
+  withBackground: Oe
+}, H = ({ children: t, className: a, hasBackground: i = !0 }) => /* @__PURE__ */ e("div", {
+  className: f(Z.iconContainer, i && Z.withBackground, a),
+  children: t
+}), Ke = ({ Icon: t, iconThemeColor: a, withContainer: i = !1, withContainerBackground: n = !0 }) => {
+  const r = b();
+  if (!t) return null;
+  if (I(a)) return /* @__PURE__ */ e(ie, {
+    Icon: t,
+    color: a,
+    size: r.icon.size.md,
+    stroke: r.icon.stroke.sm
+  });
+  const o = /* @__PURE__ */ e(t, {
+    size: r.icon.size.md,
+    stroke: r.icon.stroke.sm
+  });
+  return i ? /* @__PURE__ */ e(H, {
+    hasBackground: n,
+    children: o
+  }) : o;
+}, Ge = "_iconSwapContainer_g9ywp_1", We = "_defaultIcon_g9ywp_8", $e = "_hoverIcon_g9ywp_13", G = {
+  iconSwapContainer: Ge,
+  defaultIcon: We,
+  hoverIcon: $e
+}, Ee = ({ LeftIcon: t, iconThemeColor: a, withIconContainer: i = !1, gripIconColor: n }) => {
+  const r = b();
+  if (!t) return null;
+  const o = /* @__PURE__ */ m("div", {
+    className: G.iconSwapContainer,
+    children: [/* @__PURE__ */ e("div", {
+      className: f(G.defaultIcon, "grip-swap-default-icon"),
+      children: I(a) ? /* @__PURE__ */ e(ie, {
+        Icon: t,
+        color: a,
+        size: r.icon.size.md,
+        stroke: r.icon.stroke.sm
+      }) : /* @__PURE__ */ e(t, {
+        size: r.icon.size.md,
+        stroke: r.icon.stroke.sm
+      })
+    }), /* @__PURE__ */ e("div", {
+      className: f(G.hoverIcon, "grip-swap-hover-icon"),
+      children: /* @__PURE__ */ e($, {
+        size: r.icon.size.md,
+        stroke: r.icon.stroke.sm,
+        color: n
+      })
+    })]
+  });
+  return i && !I(a) ? /* @__PURE__ */ e(H, { children: o }) : o;
+}, Ue = "_menuItemBase_1jkew_1", He = "_hoverableMenuItemBase_1jkew_54", Fe = "_menuItemLabel_1jkew_136", qe = "_menuItemLabelLight_1jkew_145", Ve = "_noIconFiller_1jkew_155", Je = "_menuItemLeftContent_1jkew_159", Ye = "_menuItemRightContent_1jkew_172", Ze = "_draggableItem_1jkew_183", Qe = "_menuItemIconCheckContainer_1jkew_189", Xe = "_menuItemContextualText_1jkew_196", et = "_rightMenuItemContextualText_1jkew_206", k = {
+  menuItemBase: Ue,
+  hoverableMenuItemBase: He,
+  menuItemLabel: Fe,
+  menuItemLabelLight: qe,
+  noIconFiller: Ve,
+  menuItemLeftContent: Je,
+  menuItemRightContent: Ye,
+  draggableItem: Ze,
+  menuItemIconCheckContainer: Qe,
+  menuItemContextualText: Xe,
+  rightMenuItemContextualText: et
+}, S = D(({ accent: t, isKeySelected: a, isHoverBackgroundDisabled: i, hovered: n, disabled: r, focused: o, className: l, children: s, ...c }, d) => /* @__PURE__ */ e("div", {
+  ref: d,
+  className: f(k.menuItemBase, l),
+  "data-accent": t,
+  "data-key-selected": a || void 0,
+  "data-hover-background-disabled": i || void 0,
+  "data-disabled": r || void 0,
+  "data-focused": o || void 0,
+  ...c,
+  children: s
+}));
+S.displayName = "StyledMenuItemBase";
+var y = (t, a) => {
+  const i = D(({ className: n, children: r, ...o }, l) => /* @__PURE__ */ e("div", {
+    ref: l,
+    className: f(t, n),
+    ...o,
+    children: r
+  }));
+  return i.displayName = a, i;
+}, z = y(k.menuItemLabel, "StyledMenuItemLabel"), j = y(k.menuItemLabelLight, "StyledMenuItemLabelLight"), ka = y(k.noIconFiller, "StyledNoIconFiller"), p = y(k.menuItemLeftContent, "StyledMenuItemLeftContent"), F = y(k.menuItemRightContent, "StyledMenuItemRightContent"), Q = y(k.draggableItem, "StyledDraggableItem"), q = D(({ accent: t, isKeySelected: a, isHoverBackgroundDisabled: i, hovered: n, disabled: r, focused: o, isIconDisplayedOnHoverOnly: l, cursor: s, className: c, children: d, ...h }, u) => /* @__PURE__ */ e("div", {
+  ref: u,
+  className: f(k.hoverableMenuItemBase, c),
+  "data-accent": t,
+  "data-key-selected": a || void 0,
+  "data-hover-background-disabled": i || void 0,
+  "data-disabled": r || void 0,
+  "data-focused": o || void 0,
+  "data-icon-displayed-on-hover-only": l || void 0,
+  "data-cursor": s,
+  ...h,
+  children: d
+}));
+q.displayName = "StyledHoverableMenuItemBase";
+var V = ({ size: t }) => /* @__PURE__ */ e("div", {
+  className: k.menuItemIconCheckContainer,
+  children: /* @__PURE__ */ e(ne, { size: t })
+}), tt = y(k.menuItemContextualText, "StyledMenuItemContextualText"), se = y(k.rightMenuItemContextualText, "StyledRightMenuItemContextualText"), at = "_mainText_d0zu3_1", rt = "_menuItemLabelRight_d0zu3_9", X = {
+  mainText: at,
+  menuItemLabelRight: rt
+}, M = ({ className: t, LeftComponent: a, LeftIcon: i, iconThemeColor: n, withIconContainer: r = !1, withIconContainerBackground: o = !0, text: l, contextualText: s, contextualTextPosition: c = "left", gripMode: d = "never", disabled: h = !1 }) => {
+  const u = b(), v = r ? A.font.color.tertiary : h ? A.font.color.extraLight : A.font.color.light;
+  return /* @__PURE__ */ m(p, {
+    className: t,
+    children: [
+      d === "always" && (r ? /* @__PURE__ */ e(H, {
+        hasBackground: o,
+        children: /* @__PURE__ */ e(Q, { children: /* @__PURE__ */ e($, {
+          size: u.icon.size.md,
+          stroke: u.icon.stroke.sm,
+          color: v
+        }) })
+      }) : /* @__PURE__ */ e(Q, { children: /* @__PURE__ */ e($, {
+        size: u.icon.size.md,
+        stroke: u.icon.stroke.sm,
+        color: v
+      }) })),
+      d === "onHover" ? /* @__PURE__ */ e(Ee, {
+        LeftIcon: i,
+        iconThemeColor: n,
+        withIconContainer: r,
+        gripIconColor: v
+      }) : /* @__PURE__ */ e(Ke, {
+        Icon: i,
+        iconThemeColor: n,
+        withContainer: r,
+        withContainerBackground: o
+      }),
+      a,
+      /* @__PURE__ */ m(z, { children: [R(l) ? /* @__PURE__ */ e("div", {
+        className: X.mainText,
+        children: /* @__PURE__ */ e(C, { text: l })
+      }) : l, c === "left" && /* @__PURE__ */ e(L, { children: R(s) ? O(s) && /* @__PURE__ */ e(tt, { children: /* @__PURE__ */ e(C, {
+        text: `· ${s}`,
+        tooltipContent: s
+      }) }) : s })] }),
+      c === "right" && /* @__PURE__ */ e("div", {
+        className: X.menuItemLabelRight,
+        children: /* @__PURE__ */ e(se, { children: R(s) ? /* @__PURE__ */ e(C, { text: s }) : s })
+      })
+    ]
+  });
+}, nt = "_subMenuIcon_j232v_1", it = "_subMenuIconOpened_j232v_9", ee = {
+  subMenuIcon: nt,
+  subMenuIconOpened: it
+}, ot = ({ accent: t = "default", className: a, withIconContainer: i = !1, withIconContainerBackground: n = !0, iconButtons: r, isIconDisplayedOnHoverOnly: o = !0, LeftIcon: l, iconThemeColor: s, LeftComponent: c, RightIcon: d, RightComponent: h, onClick: u, onMouseEnter: v, onMouseLeave: _, testId: w, text: de, contextualTextPosition: ce = "left", contextualText: me, hasSubMenu: ue = !1, disabled: T = !1, focused: he = !1, selected: ve = !1, hotKeys: Y, isSubMenuOpened: _e = !1 }) => {
+  const x = b(), fe = Array.isArray(r) && r.length > 0;
+  return /* @__PURE__ */ m(q, {
+    "data-testid": w ?? void 0,
+    onClick: T ? void 0 : (K) => {
+      u && (K.preventDefault(), K.stopPropagation(), u?.(K));
+    },
+    disabled: T,
+    className: a,
+    accent: t,
+    isIconDisplayedOnHoverOnly: o,
+    onMouseEnter: v,
+    onMouseLeave: _,
+    focused: he || ve,
+    children: [/* @__PURE__ */ e(M, {
+      LeftIcon: l ?? void 0,
+      iconThemeColor: s,
+      LeftComponent: c,
+      withIconContainer: i,
+      withIconContainerBackground: n,
+      text: de,
+      contextualText: me,
+      contextualTextPosition: ce,
+      disabled: T
+    }), /* @__PURE__ */ m(F, { children: [
+      r && /* @__PURE__ */ e("div", {
+        className: "hoverable-buttons",
+        children: fe && /* @__PURE__ */ e(oe, {
+          iconButtons: r,
+          size: "small"
+        })
+      }),
+      Y && /* @__PURE__ */ e(Ne, { hotKeys: Y }),
+      d && /* @__PURE__ */ e(d, {
+        size: x.icon.size.md,
+        stroke: x.icon.stroke.sm
+      }),
+      h,
+      ue && /* @__PURE__ */ e("div", {
+        className: f(ee.subMenuIcon, _e && ee.subMenuIconOpened),
+        style: { visibility: T ? "hidden" : "visible" },
+        children: /* @__PURE__ */ e(E, {
+          size: x.icon.size.sm,
+          color: x.font.color.light
+        })
+      })
+    ] })]
+  });
+}, ga = ({ accent: t = "default", className: a, iconButtons: i, isIconDisplayedOnHoverOnly: n = !0, isTooltipOpen: r, onClick: o, onMouseEnter: l, onMouseLeave: s, testId: c, avatar: d, hasSubMenu: h = !1, text: u, contextualText: v }) => /* @__PURE__ */ e(ot, {
+  accent: t,
+  className: a,
+  iconButtons: i,
+  isIconDisplayedOnHoverOnly: n,
+  isTooltipOpen: r,
+  LeftComponent: I(d) ? /* @__PURE__ */ e(Ce, {
+    name: d.name,
+    src: d.src,
+    colorSeed: d.colorSeed,
+    size: d.size,
+    shape: d.shape
+  }) : void 0,
+  onClick: o,
+  onMouseEnter: l,
+  onMouseLeave: s,
+  testId: c,
+  text: u,
+  contextualText: v,
+  hasSubMenu: h
+}), Ca = ({ LeftIcon: t, withIconContainer: a = !1, accent: i = "default", iconButtons: n, onClick: r, text: o, contextualText: l, isDragDisabled: s = !1, className: c, isIconDisplayedOnHoverOnly: d = !0, gripMode: h = "never" }) => {
+  const u = Array.isArray(n) && n.length > 0;
+  return /* @__PURE__ */ m(q, {
+    onClick: r,
+    accent: i,
+    className: c,
+    isIconDisplayedOnHoverOnly: d,
+    cursor: h !== "never" ? s ? "default" : "drag" : "default",
+    children: [/* @__PURE__ */ e(M, {
+      LeftIcon: t,
+      text: o,
+      contextualText: l,
+      withIconContainer: a,
+      disabled: s,
+      gripMode: h
+    }), u && /* @__PURE__ */ e(oe, {
+      className: "hoverable-buttons",
+      iconButtons: n
+    })]
+  });
+}, lt = "_container_gnyb3_1", st = { container: lt }, J = ({ selected: t, onSelectChange: a, ariaLabel: i }) => /* @__PURE__ */ e("div", {
+  className: st.container,
+  onClick: (n) => n.stopPropagation(),
+  children: /* @__PURE__ */ e(Se, {
+    checked: t,
+    onCheckedChange: (n) => a?.(n),
+    "aria-label": i
+  })
+}), dt = "_leftContentWithCheckboxContainer_18kjc_1", ct = { leftContentWithCheckboxContainer: dt }, ya = ({ color: t, LeftIcon: a, iconThemeColor: i, withIconContainer: n = !1, text: r, selected: o, isKeySelected: l, className: s, onSelectChange: c }) => /* @__PURE__ */ e(S, {
+  isKeySelected: l,
+  className: s,
+  onClick: () => {
+    c?.(!o);
+  },
+  children: /* @__PURE__ */ m("div", {
+    className: ct.leftContentWithCheckboxContainer,
+    children: [/* @__PURE__ */ e(J, {
+      selected: o,
+      onSelectChange: c,
+      ariaLabel: r
+    }), t ? /* @__PURE__ */ e(U, {
+      color: t,
+      startIcon: I(a) ? /* @__PURE__ */ e(a, {}) : void 0,
+      children: r
+    }) : /* @__PURE__ */ e(M, {
+      LeftIcon: a,
+      iconThemeColor: i,
+      text: r,
+      withIconContainer: n
+    })]
+  })
+}), mt = "_leftContentWithCheckboxContainer_ikfhb_1", ut = "_textContainer_ikfhb_9", te = {
+  leftContentWithCheckboxContainer: mt,
+  textContainer: ut
+}, pa = ({ avatar: t, text: a, selected: i, contextualText: n, className: r, isKeySelected: o, onSelectChange: l }) => /* @__PURE__ */ e(S, {
+  className: r,
+  onClick: () => {
+    l?.(!i);
+  },
+  isKeySelected: o,
+  children: /* @__PURE__ */ m("div", {
+    className: te.leftContentWithCheckboxContainer,
+    children: [/* @__PURE__ */ e(J, {
+      selected: i,
+      onSelectChange: l,
+      ariaLabel: a ?? n ?? "Select item"
+    }), /* @__PURE__ */ m(p, { children: [t, /* @__PURE__ */ m("div", {
+      className: te.textContainer,
+      children: [/* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(C, { text: a }) }), n && /* @__PURE__ */ m(L, { children: [/* @__PURE__ */ e(j, { children: "·" }), /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e(C, { text: n }) })] })]
+    })] })]
+  })
+}), Ma = ({ color: t, selected: a, className: i, onClick: n, isKeySelected: r, text: o, Icon: l }) => /* @__PURE__ */ e(S, {
+  isKeySelected: r,
+  onClick: n,
+  className: i,
+  children: /* @__PURE__ */ m(p, { children: [/* @__PURE__ */ e(J, {
+    selected: a,
+    onSelectChange: () => n?.(),
+    ariaLabel: o
+  }), /* @__PURE__ */ e(U, {
+    color: t,
+    startIcon: I(l) ? /* @__PURE__ */ e(l, {}) : void 0,
+    children: o
+  })] })
+}), Sa = ({ LeftIcon: t, withIconContainer: a = !1, text: i, className: n, onClick: r }) => {
+  const o = b();
+  return /* @__PURE__ */ m(S, {
+    onClick: r,
+    className: n,
+    children: [/* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(M, {
+      LeftIcon: t,
+      text: i,
+      withIconContainer: a
+    }) }), /* @__PURE__ */ e(E, {
+      size: o.icon.size.sm,
+      color: o.font.color.tertiary
+    })]
+  });
+}, ht = "_menuItemSelect_rqblm_1", vt = { menuItemSelect: ht }, B = D(({ disabled: t, focused: a, isKeySelected: i, className: n, children: r, ...o }, l) => /* @__PURE__ */ e("div", {
+  ref: l,
+  className: f(vt.menuItemSelect, n),
+  "data-disabled": t || void 0,
+  "data-focused": a || void 0,
+  "data-key-selected": i || void 0,
+  ...o,
+  children: r
+}));
+B.displayName = "StyledMenuItemSelect";
+var wa = ({ LeftComponent: t, LeftIcon: a, leftIconColor: i, withIconContainer: n = !1, text: r, selected: o, needIconCheck: l = !0, className: s, onClick: c, disabled: d, focused: h, hasSubMenu: u = !1, contextualText: v, contextualTextPosition: _ = "left" }) => {
+  const w = b();
+  return /* @__PURE__ */ m(B, {
+    onClick: c,
+    className: s,
+    disabled: d,
+    focused: h,
+    role: "option",
+    "aria-selected": o,
+    "aria-disabled": d,
+    children: [/* @__PURE__ */ e(M, {
+      LeftComponent: t,
+      LeftIcon: a,
+      iconThemeColor: i,
+      text: r,
+      contextualText: _ === "left" ? v : null,
+      withIconContainer: n
+    }), /* @__PURE__ */ m(F, { children: [
+      _ === "right" && /* @__PURE__ */ e(z, { children: R(v) ? /* @__PURE__ */ e(se, { children: /* @__PURE__ */ e(C, { text: v }) }) : v }),
+      o && l && /* @__PURE__ */ e(ne, { size: w.icon.size.md }),
+      u && /* @__PURE__ */ e(E, {
+        size: w.icon.size.sm,
+        color: w.font.color.tertiary
+      })
+    ] })]
+  });
+}, _t = "_textContainer_y4rc7_1", ft = { textContainer: _t }, Na = ({ avatar: t, text: a, contextualText: i, selected: n, className: r, onClick: o, disabled: l, focused: s, testId: c }) => {
+  const d = b();
+  return /* @__PURE__ */ m(B, {
+    onClick: o,
+    className: r,
+    disabled: l,
+    focused: s,
+    "data-testid": c,
+    role: "option",
+    "aria-selected": n,
+    "aria-disabled": l,
+    children: [/* @__PURE__ */ m(p, { children: [t, /* @__PURE__ */ m("div", {
+      className: ft.textContainer,
+      children: [/* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(C, { text: a }) }), i && /* @__PURE__ */ m(L, { children: [/* @__PURE__ */ e(j, { children: "·" }), /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e(C, { text: i }) })] })]
+    })] }), n && /* @__PURE__ */ e(V, { size: d.icon.size.md })]
+  });
+}, La = ({ color: t, selected: a, className: i, onClick: n, disabled: r, focused: o, variant: l = "default", colorLabels: s = Pe }) => {
+  const c = b();
+  return /* @__PURE__ */ m(B, {
+    onClick: n,
+    className: i,
+    disabled: r,
+    focused: o,
+    children: [/* @__PURE__ */ m(p, { children: [/* @__PURE__ */ e(ge, {
+      colorName: t,
+      variant: l
+    }), /* @__PURE__ */ e(z, { children: s[t] })] }), a && /* @__PURE__ */ e(V, { size: c.icon.size.md })]
+  });
+}, za = ({ color: t, selected: a, focused: i, isKeySelected: n, className: r, onClick: o, text: l, variant: s = "soft", LeftIcon: c }) => {
+  const d = b();
+  return /* @__PURE__ */ m(B, {
+    onClick: o,
+    className: r,
+    focused: i,
+    isKeySelected: n,
+    children: [/* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(U, {
+      borderStyle: "dashed",
+      variant: s,
+      color: t,
+      startIcon: I(c) ? /* @__PURE__ */ e(c, {}) : void 0,
+      children: l
+    }) }), a && /* @__PURE__ */ e(V, { size: d.icon.size.md })]
+  });
+}, It = "_suggestionMenuItem_1qyjt_1", bt = { suggestionMenuItem: It }, Ba = ({ LeftIcon: t, withIconContainer: a = !1, text: i, contextualText: n = void 0, contextualTextPosition: r = "left", className: o, selected: l, onClick: s }) => {
+  const c = (d) => {
+    s && (d.preventDefault(), d.stopPropagation(), s?.(d));
+  };
+  return /* @__PURE__ */ e("li", {
+    className: f(bt.suggestionMenuItem, o),
+    "data-selected": l || void 0,
+    role: I(s) ? "button" : void 0,
+    tabIndex: I(s) ? 0 : void 0,
+    onClick: c,
+    onKeyDown: ke,
+    children: /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(M, {
+      LeftIcon: t ?? void 0,
+      text: i,
+      contextualText: n,
+      contextualTextPosition: r,
+      withIconContainer: a
+    }) })
+  });
+}, kt = "_switchContainer_1l580_1", gt = { switchContainer: kt }, Ta = ({ focused: t, LeftIcon: a, withIconContainer: i = !1, text: n, checked: r, className: o, onCheckedChange: l, size: s = "md", disabled: c = !1 }) => /* @__PURE__ */ e(S, {
+  className: o,
+  focused: t,
+  disabled: c,
+  onClick: () => {
+    c || l?.(!r);
+  },
+  children: /* @__PURE__ */ m("div", {
+    className: gt.switchContainer,
+    children: [/* @__PURE__ */ e(M, {
+      LeftIcon: a,
+      text: n,
+      withIconContainer: i,
+      disabled: c
+    }), /* @__PURE__ */ e(F, {
+      onClick: (h) => h.stopPropagation(),
+      children: /* @__PURE__ */ e(we, {
+        checked: r,
+        onCheckedChange: c ? void 0 : l,
+        size: s,
+        disabled: c,
+        "aria-label": n
+      })
+    })]
+  })
+}), Ct = "_menuPicker_o8ra4_1", yt = "_iconContainer_o8ra4_41", pt = "_label_o8ra4_50", W = {
+  menuPicker: Ct,
+  iconContainer: yt,
+  label: pt
+}, xa = ({ id: t, icon: a, label: i, selected: n = !1, disabled: r = !1, showLabel: o = !0, onClick: l, className: s, testId: c, tooltipContent: d, tooltipDelay: h = Me.noDelay, tooltipOffset: u = 5 }) => {
+  const v = b();
+  return /* @__PURE__ */ m(L, { children: [/* @__PURE__ */ m("button", {
+    id: t,
+    disabled: r,
+    onClick: l,
+    className: f(W.menuPicker, s),
+    "data-testid": c,
+    "data-selected": n ? "" : void 0,
+    "aria-pressed": n,
+    "aria-disabled": r,
+    "aria-label": i,
+    children: [/* @__PURE__ */ e("div", {
+      className: W.iconContainer,
+      children: /* @__PURE__ */ e(a, {
+        size: v.icon.size.md,
+        stroke: v.icon.stroke.sm
+      })
+    }), I(i) && o && /* @__PURE__ */ e("div", {
+      className: W.label,
+      "data-selected": n ? "" : void 0,
+      "data-disabled": r ? "" : void 0,
+      children: i
+    })]
+  }), O(d) && /* @__PURE__ */ e(pe, {
+    anchorSelect: `#${t}`,
+    offset: u,
+    title: d,
+    place: ye.Bottom,
+    positionStrategy: "fixed",
+    delay: h,
+    noArrow: !0
+  })] });
+}, Mt = "_iconButton_19i33_1", St = { iconButton: Mt }, wt = ({ Icon: t, isActive: a, onClick: i, ariaLabel: n }) => {
+  const r = b();
+  return /* @__PURE__ */ e("button", {
+    type: "button",
+    className: St.iconButton,
+    "data-active": a ? "" : void 0,
+    "aria-label": n,
+    "aria-pressed": a,
+    onClick: i,
+    children: /* @__PURE__ */ e(t, {
+      color: A.grayScale.gray10,
+      size: r.icon.size.lg,
+      "aria-hidden": !0
+    })
+  });
+}, Nt = "_container_vsk1i_1", Lt = { container: Nt }, Aa = ({ activeItemName: t, isHidden: a = !1, items: i }) => /* @__PURE__ */ e("nav", {
+  className: Lt.container,
+  "data-hidden": a ? "" : void 0,
+  "aria-hidden": a,
+  children: i.map(({ Icon: n, name: r, label: o, onClick: l }) => /* @__PURE__ */ e(wt, {
+    Icon: n,
+    isActive: t === r,
+    onClick: l,
+    ariaLabel: o
+  }, r))
+}), zt = "_clickable_1d60u_1", Bt = { clickable: zt }, Ra = ({ className: t, href: a, children: i, onClick: n }) => /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", {
+  className: f(Bt.clickable, t),
+  children: /* @__PURE__ */ e(le, {
+    target: "_blank",
+    onClick: n,
+    to: a,
+    children: i
+  })
+}) }), Tt = "_root_os1x1_1", xt = { root: Tt }, At = ({ label: t, href: a, onClick: i, className: n }) => {
+  if (!O(t)) return /* @__PURE__ */ e(L, {});
+  const r = (o) => {
+    o.stopPropagation(), i?.(o);
+  };
+  return /* @__PURE__ */ e("a", {
+    href: re(a),
+    target: "_blank",
+    rel: "noreferrer",
+    onClick: r,
+    className: f(xt.root, n),
+    children: t
+  });
+}, ja = ({ label: t, href: a, onClick: i, type: n }) => /* @__PURE__ */ e(At, {
+  href: a,
+  onClick: i,
+  label: O(t) ? t : Ie({
+    type: n,
+    href: a
+  }) ?? a
+}), Rt = "_root_o0irp_1", jt = "_list_o0irp_10", Pt = "_tab_o0irp_37", Dt = "_content_o0irp_89", Ot = "_label_o0irp_102", Kt = "_startIcon_o0irp_108", Gt = "_badge_o0irp_109", Wt = "_panel_o0irp_124", $t = "_indicator_o0irp_133", g = {
+  root: Rt,
+  list: jt,
+  tab: Pt,
+  content: Dt,
+  label: Ot,
+  startIcon: Kt,
+  badge: Gt,
+  panel: Wt,
+  indicator: $t
+}, Et = ({ event: t, direction: a, loopFocus: i }) => {
+  if (t.altKey || t.ctrlKey || t.metaKey || t.shiftKey) return;
+  const n = t.currentTarget, r = Array.from(n.querySelectorAll('[role="tab"]')).filter((_) => _.closest('[role="tablist"]') === n), o = r.findIndex((_) => _ === t.target);
+  if (o === -1) return;
+  const l = a === "rtl" ? ["ArrowLeft", "ArrowRight"] : ["ArrowRight", "ArrowLeft"], [s, c] = n.getAttribute("aria-orientation") === "vertical" ? ["ArrowDown", "ArrowUp"] : l;
+  if (![
+    s,
+    c,
+    "Home",
+    "End"
+  ].includes(t.key)) return;
+  t.preventBaseUIHandler(), t.preventDefault();
+  const d = r.filter((_) => !_.hasAttribute("data-disabled") && !_.hasAttribute("disabled") && _.getAttribute("aria-disabled") !== "true" && !_.closest("[hidden], [inert]"));
+  if (t.key === "Home") {
+    d[0]?.focus();
+    return;
+  }
+  if (t.key === "End") {
+    d[d.length - 1]?.focus();
+    return;
+  }
+  const h = t.key === c, u = h ? [...d].reverse() : d, v = u.find((_) => h ? r.indexOf(_) < o : r.indexOf(_) > o);
+  if (I(v)) {
+    v.focus();
+    return;
+  }
+  i && u[0]?.focus();
+}, Ut = ({ className: t, children: a, onKeyDown: i, loopFocus: n = !0, ...r }) => {
+  const o = ze(), l = (s) => {
+    if (i?.(s), s.defaultPrevented) {
+      s.preventBaseUIHandler();
+      return;
+    }
+    s.baseUIHandlerPrevented || Et({
+      event: s,
+      direction: o,
+      loopFocus: n
+    });
+  };
+  return /* @__PURE__ */ m(N.List, {
+    ...r,
+    loopFocus: n,
+    onKeyDown: l,
+    className: P(g.list, t),
+    children: [a, /* @__PURE__ */ e(N.Indicator, { className: g.indicator })]
+  });
+}, Ht = ({ className: t, ...a }) => /* @__PURE__ */ e(N.Panel, {
+  ...a,
+  className: P(g.panel, t)
+}), Ft = ({ className: t, ...a }) => /* @__PURE__ */ e(N.Root, {
+  ...a,
+  className: P(g.root, t)
+}), ae = (t) => I(t) && !Le(t) && t !== "", qt = ({ className: t, children: a, startIcon: i, badge: n, size: r = "sm", ...o }) => /* @__PURE__ */ e(N.Tab, {
+  ...o,
+  className: P(g.tab, t),
+  "data-size": r,
+  children: /* @__PURE__ */ m("span", {
+    className: g.content,
+    children: [
+      ae(i) && /* @__PURE__ */ e("span", {
+        className: g.startIcon,
+        "aria-hidden": !0,
+        children: i
+      }),
+      /* @__PURE__ */ e("span", {
+        className: g.label,
+        children: a
+      }),
+      ae(n) && /* @__PURE__ */ e("span", {
+        className: g.badge,
+        children: n
+      })
+    ]
+  })
+}), Pa = {
+  Root: Ft,
+  List: Ut,
+  Tab: qt,
+  Panel: Ht
+}, Vt = "_undecoratedLink_1uam7_1", Jt = { undecoratedLink: Vt }, Da = ({ children: t, to: a, replace: i = !1, onClick: n, fullWidth: r = !1 }) => /* @__PURE__ */ e(le, {
+  to: a,
+  replace: i,
+  onClick: n,
+  className: Jt.undecoratedLink,
+  style: r ? { width: "100%" } : void 0,
+  children: t
+});
+export {
+  Ia as A,
+  M as C,
+  p as D,
+  z as E,
+  je as M,
+  _a as N,
+  Pe as O,
+  xe as P,
+  ot as S,
+  V as T,
+  Ma as _,
+  Ra as a,
+  Ca as b,
+  xa as c,
+  za as d,
+  La as f,
+  Sa as g,
+  B as h,
+  At as i,
+  fa as j,
+  ba as k,
+  Ta as l,
+  wa as m,
+  Pa as n,
+  Aa as o,
+  Na as p,
+  ja as r,
+  wt as s,
+  Da as t,
+  Ba as u,
+  pa as v,
+  q as w,
+  ga as x,
+  ya as y
+};