@frontify/fondue 12.0.0-beta.122 → 12.0.0-beta.124

package/dist/components/Tooltip/BrightHeader.es.js

@@ -1,42 +1,42 @@
-import t, { cloneElement as r } from "react";
-import { merge as o } from "../../utilities/merge.es.js";
+import t, { cloneElement as o } from "react";
+import { merge as r } from "../../utilities/merge.es.js";
 import { IconSize as n } from "../../foundation/Icon/IconSize.es.js";
 import i from "../../foundation/Icon/Generated/IconExclamationMarkCircle.es.js";
 import a from "../../foundation/Icon/Generated/IconExclamationMarkTriangle.es.js";
 import m from "../../foundation/Icon/Generated/IconCheckMark.es.js";
-import c from "../../foundation/Icon/Generated/IconDocument.es.js";
-var l = /* @__PURE__ */ ((e) => (e.Information = "Information", e.Warning = "Warning", e.Tip = "Tip", e.Note = "Note", e))(l || {});
-const g = {
-  Information: "tw-bg-violet-60",
-  Warning: "tw-bg-red-60",
-  Tip: "tw-bg-green-60",
-  Note: "tw-bg-yellow-60"
-}, N = {
-  Information: "before:tw-bg-violet-60",
-  Warning: "before:tw-bg-red-60",
-  Tip: "before:tw-bg-green-60",
-  Note: "before:tw-bg-yellow-60"
-}, w = {
+import s from "../../foundation/Icon/Generated/IconDocument.es.js";
+var g = /* @__PURE__ */ ((e) => (e.Information = "Information", e.Warning = "Warning", e.Tip = "Tip", e.Note = "Note", e))(g || {});
+const c = {
+  Information: "tw-bg-box-selected-strong",
+  Warning: "tw-bg-box-negative-strong-pressed",
+  Tip: "tw-bg-box-positive-strong-pressed",
+  Note: "tw-bg-box-warning-strong"
+}, E = {
+  Information: "before:tw-bg-box-selected-strong",
+  Warning: "before:tw-bg-box-negative-strong-pressed",
+  Tip: "before:tw-bg-box-positive-strong-pressed",
+  Note: "before:tw-bg-box-warning-strong"
+}, b = {
   Information: /* @__PURE__ */ t.createElement(i, null),
   Warning: /* @__PURE__ */ t.createElement(a, null),
   Tip: /* @__PURE__ */ t.createElement(m, null),
-  Note: /* @__PURE__ */ t.createElement(c, null)
-}, f = ({ headerStyle: e }) => /* @__PURE__ */ t.createElement(
+  Note: /* @__PURE__ */ t.createElement(s, null)
+}, l = ({ headerStyle: e }) => /* @__PURE__ */ t.createElement(
   "div",
   {
     "data-test-id": "bright-header",
-    className: o([
-      "tw-h-9 tw-relative tw-z-[120000] tw-flex tw-justify-center tw-items-center tw-rounded-t-md tw-text-white",
-      g[e]
+    className: r([
+      "tw-h-9 tw-relative tw-z-[120000] tw-flex tw-justify-center tw-items-center tw-rounded-t-md tw-dark tw-text-text",
+      c[e]
     ])
   },
-  r(w[e], { size: n.Size20 })
+  o(b[e], { size: n.Size20 })
 );
-f.displayName = "FondueBrightHeader";
+l.displayName = "FondueBrightHeader";
 export {
-  f as BrightHeader,
-  l as BrightHeaderStyle,
-  N as brightHeaderArrowBackgroundColors,
-  g as brightHeaderBackgroundColors
+  l as BrightHeader,
+  g as BrightHeaderStyle,
+  E as brightHeaderArrowBackgroundColors,
+  c as brightHeaderBackgroundColors
 };
 //# sourceMappingURL=BrightHeader.es.js.map

package/dist/components/Tooltip/BrightHeader.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"BrightHeader.es.js","sources":["../../../src/components/Tooltip/BrightHeader.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, { FC, ReactElement, cloneElement } from 'react';\nimport { merge } from '@utilities/merge';\nimport {\n    IconCheckMark,\n    IconDocument,\n    IconExclamationMarkCircle,\n    IconExclamationMarkTriangle,\n} from '@foundation/Icon/Generated';\nimport { IconSize } from '@foundation/Icon/IconSize';\n\nexport enum BrightHeaderStyle {\n    Information = 'Information',\n    Warning = 'Warning',\n    Tip = 'Tip',\n    Note = 'Note',\n}\n\nexport const brightHeaderBackgroundColors: Record<BrightHeaderStyle, string> = {\n    [BrightHeaderStyle.Information]: 'tw-bg-violet-60',\n    [BrightHeaderStyle.Warning]: 'tw-bg-red-60',\n    [BrightHeaderStyle.Tip]: 'tw-bg-green-60',\n    [BrightHeaderStyle.Note]: 'tw-bg-yellow-60',\n};\n\nexport const brightHeaderArrowBackgroundColors: Record<BrightHeaderStyle, string> = {\n    [BrightHeaderStyle.Information]: 'before:tw-bg-violet-60',\n    [BrightHeaderStyle.Warning]: 'before:tw-bg-red-60',\n    [BrightHeaderStyle.Tip]: 'before:tw-bg-green-60',\n    [BrightHeaderStyle.Note]: 'before:tw-bg-yellow-60',\n};\n\nconst brightHeaderIcon: Record<BrightHeaderStyle, ReactElement> = {\n    [BrightHeaderStyle.Information]: <IconExclamationMarkCircle />,\n    [BrightHeaderStyle.Warning]: <IconExclamationMarkTriangle />,\n    [BrightHeaderStyle.Tip]: <IconCheckMark />,\n    [BrightHeaderStyle.Note]: <IconDocument />,\n};\n\ntype BrightHeaderProps = {\n    headerStyle: BrightHeaderStyle;\n};\n\nexport const BrightHeader: FC<BrightHeaderProps> = ({ headerStyle }) => {\n    return (\n        <div\n            data-test-id=\"bright-header\"\n            className={merge([\n                'tw-h-9 tw-relative tw-z-[120000] tw-flex tw-justify-center tw-items-center tw-rounded-t-md tw-text-white',\n                brightHeaderBackgroundColors[headerStyle],\n            ])}\n        >\n            {cloneElement(brightHeaderIcon[headerStyle], { size: IconSize.Size20 })}\n        </div>\n    );\n};\nBrightHeader.displayName = 'FondueBrightHeader';\n"],"names":["BrightHeaderStyle","brightHeaderBackgroundColors","brightHeaderArrowBackgroundColors","brightHeaderIcon","React","IconExclamationMarkCircle","IconExclamationMarkTriangle","IconCheckMark","IconDocument","BrightHeader","headerStyle","merge","cloneElement","IconSize"],"mappings":";;;;;;;AAYY,IAAAA,sBAAAA,OACRA,EAAA,cAAc,eACdA,EAAA,UAAU,WACVA,EAAA,MAAM,OACNA,EAAA,OAAO,QAJCA,IAAAA,KAAA,CAAA,CAAA;AAOL,MAAMC,IAAkE;AAAA,EAC1E,aAAgC;AAAA,EAChC,SAA4B;AAAA,EAC5B,KAAwB;AAAA,EACxB,MAAyB;AAC9B,GAEaC,IAAuE;AAAA,EAC/E,aAAgC;AAAA,EAChC,SAA4B;AAAA,EAC5B,KAAwB;AAAA,EACxB,MAAyB;AAC9B,GAEMC,IAA4D;AAAA,EAC7D,aAAgC,gBAAAC,EAAA,cAACC,GAA0B,IAAA;AAAA,EAC3D,SAA4B,gBAAAD,EAAA,cAACE,GAA4B,IAAA;AAAA,EACzD,KAAwB,gBAAAF,EAAA,cAACG,GAAc,IAAA;AAAA,EACvC,MAAyB,gBAAAH,EAAA,cAACI,GAAa,IAAA;AAC5C,GAMaC,IAAsC,CAAC,EAAE,aAAAC,QAE9C,gBAAAN,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAWO,EAAM;AAAA,MACb;AAAA,MACAV,EAA6BS,CAAW;AAAA,IAAA,CAC3C;AAAA,EAAA;AAAA,EAEAE,EAAaT,EAAiBO,CAAW,GAAG,EAAE,MAAMG,EAAS,QAAQ;AAAA;AAIlFJ,EAAa,cAAc;"}
+{"version":3,"file":"BrightHeader.es.js","sources":["../../../src/components/Tooltip/BrightHeader.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, { FC, ReactElement, cloneElement } from 'react';\nimport { merge } from '@utilities/merge';\nimport {\n    IconCheckMark,\n    IconDocument,\n    IconExclamationMarkCircle,\n    IconExclamationMarkTriangle,\n} from '@foundation/Icon/Generated';\nimport { IconSize } from '@foundation/Icon/IconSize';\n\nexport enum BrightHeaderStyle {\n    Information = 'Information',\n    Warning = 'Warning',\n    Tip = 'Tip',\n    Note = 'Note',\n}\n\nexport const brightHeaderBackgroundColors: Record<BrightHeaderStyle, string> = {\n    [BrightHeaderStyle.Information]: 'tw-bg-box-selected-strong',\n    [BrightHeaderStyle.Warning]: 'tw-bg-box-negative-strong-pressed',\n    [BrightHeaderStyle.Tip]: 'tw-bg-box-positive-strong-pressed',\n    [BrightHeaderStyle.Note]: 'tw-bg-box-warning-strong',\n};\n\nexport const brightHeaderArrowBackgroundColors: Record<BrightHeaderStyle, string> = {\n    [BrightHeaderStyle.Information]: 'before:tw-bg-box-selected-strong',\n    [BrightHeaderStyle.Warning]: 'before:tw-bg-box-negative-strong-pressed',\n    [BrightHeaderStyle.Tip]: 'before:tw-bg-box-positive-strong-pressed',\n    [BrightHeaderStyle.Note]: 'before:tw-bg-box-warning-strong',\n};\n\nconst brightHeaderIcon: Record<BrightHeaderStyle, ReactElement> = {\n    [BrightHeaderStyle.Information]: <IconExclamationMarkCircle />,\n    [BrightHeaderStyle.Warning]: <IconExclamationMarkTriangle />,\n    [BrightHeaderStyle.Tip]: <IconCheckMark />,\n    [BrightHeaderStyle.Note]: <IconDocument />,\n};\n\ntype BrightHeaderProps = {\n    headerStyle: BrightHeaderStyle;\n};\n\nexport const BrightHeader: FC<BrightHeaderProps> = ({ headerStyle }) => {\n    return (\n        <div\n            data-test-id=\"bright-header\"\n            className={merge([\n                'tw-h-9 tw-relative tw-z-[120000] tw-flex tw-justify-center tw-items-center tw-rounded-t-md tw-dark tw-text-text',\n                brightHeaderBackgroundColors[headerStyle],\n            ])}\n        >\n            {cloneElement(brightHeaderIcon[headerStyle], { size: IconSize.Size20 })}\n        </div>\n    );\n};\nBrightHeader.displayName = 'FondueBrightHeader';\n"],"names":["BrightHeaderStyle","brightHeaderBackgroundColors","brightHeaderArrowBackgroundColors","brightHeaderIcon","React","IconExclamationMarkCircle","IconExclamationMarkTriangle","IconCheckMark","IconDocument","BrightHeader","headerStyle","merge","cloneElement","IconSize"],"mappings":";;;;;;;AAYY,IAAAA,sBAAAA,OACRA,EAAA,cAAc,eACdA,EAAA,UAAU,WACVA,EAAA,MAAM,OACNA,EAAA,OAAO,QAJCA,IAAAA,KAAA,CAAA,CAAA;AAOL,MAAMC,IAAkE;AAAA,EAC1E,aAAgC;AAAA,EAChC,SAA4B;AAAA,EAC5B,KAAwB;AAAA,EACxB,MAAyB;AAC9B,GAEaC,IAAuE;AAAA,EAC/E,aAAgC;AAAA,EAChC,SAA4B;AAAA,EAC5B,KAAwB;AAAA,EACxB,MAAyB;AAC9B,GAEMC,IAA4D;AAAA,EAC7D,aAAgC,gBAAAC,EAAA,cAACC,GAA0B,IAAA;AAAA,EAC3D,SAA4B,gBAAAD,EAAA,cAACE,GAA4B,IAAA;AAAA,EACzD,KAAwB,gBAAAF,EAAA,cAACG,GAAc,IAAA;AAAA,EACvC,MAAyB,gBAAAH,EAAA,cAACI,GAAa,IAAA;AAC5C,GAMaC,IAAsC,CAAC,EAAE,aAAAC,QAE9C,gBAAAN,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAWO,EAAM;AAAA,MACb;AAAA,MACAV,EAA6BS,CAAW;AAAA,IAAA,CAC3C;AAAA,EAAA;AAAA,EAEAE,EAAaT,EAAiBO,CAAW,GAAG,EAAE,MAAMG,EAAS,QAAQ;AAAA;AAIlFJ,EAAa,cAAc;"}

package/dist/components/Tooltip/Tooltip.es.js

@@ -1,22 +1,22 @@
-import { IconSize as V } from "../../foundation/Icon/IconSize.es.js";
-import { useLink as ne } from "@react-aria/link";
-import { FOCUS_VISIBLE_STYLE as we } from "../../utilities/focusStyle.es.js";
-import { merge as n } from "../../utilities/merge.es.js";
-import t, { useState as d, useRef as Y, useMemo as ie, useCallback as k, useEffect as fe, useLayoutEffect as ce, cloneElement as v } from "react";
-import { BrightHeader as me, brightHeaderArrowBackgroundColors as x } from "./BrightHeader.es.js";
-import { usePopper as de } from "react-popper";
-import { useMemoizedId as pe } from "../../hooks/useMemoizedId.es.js";
-import { Button as j } from "../Button/Button.es.js";
-import { ButtonStyle as q, ButtonEmphasis as D, ButtonSize as G } from "../Button/ButtonTypes.es.js";
-const J = {
+import { IconSize as _ } from "../../foundation/Icon/IconSize.es.js";
+import { useLink as we } from "@react-aria/link";
+import { FOCUS_VISIBLE_STYLE as ce } from "../../utilities/focusStyle.es.js";
+import { merge as i } from "../../utilities/merge.es.js";
+import t, { useState as b, useRef as D, useMemo as me, useCallback as E, useEffect as pe, useLayoutEffect as ue, cloneElement as C } from "react";
+import { BrightHeader as be, brightHeaderArrowBackgroundColors as L } from "./BrightHeader.es.js";
+import { usePopper as Ee } from "react-popper";
+import { useMemoizedId as ge } from "../../hooks/useMemoizedId.es.js";
+import { Button as $ } from "../Button/Button.es.js";
+import { ButtonStyle as K, ButtonEmphasis as V, ButtonSize as Y } from "../Button/ButtonTypes.es.js";
+const j = {
   small: "tw-pt-3.5",
   large: "tw-pt-4"
-}, K = {
+}, q = {
   small: "tw-pb-3.5",
   large: "tw-pb-4"
 };
-var ue = /* @__PURE__ */ ((e) => (e.Top = "Top", e.Right = "Right", e.Bottom = "Bottom", e.Left = "Left", e))(ue || {}), be = /* @__PURE__ */ ((e) => (e.Start = "Start", e.Middle = "Middle", e.End = "End", e))(be || {});
-const ge = {
+var Se = /* @__PURE__ */ ((e) => (e.Top = "Top", e.Right = "Right", e.Bottom = "Bottom", e.Left = "Left", e))(Se || {}), he = /* @__PURE__ */ ((e) => (e.Start = "Start", e.Middle = "Middle", e.End = "End", e))(he || {});
+const xe = {
   ["Top-Start"]: "top-start",
   ["Top-End"]: "top-end",
   ["Bottom-Start"]: "bottom-start",
@@ -29,56 +29,56 @@ const ge = {
   ["Right-Middle"]: "right",
   ["Bottom-Middle"]: "bottom",
   ["Left-Middle"]: "left"
-}, Ee = (e, l, s) => {
+}, ve = (e, r, l) => {
   switch (!0) {
     case e.toString().includes("Top".toLowerCase()):
-      return "before:tw-border-t-0 before:tw-border-l-0 tw-bottom-[-6px] before:tw-bg-black-100 before:dark:tw-bg-white";
+      return "before:tw-border-t-0 before:tw-border-l-0 tw-bottom-[-6px] before:tw-dark before:tw-bg-base";
     case e.toString().includes("Right".toLowerCase()):
-      return n([
+      return i([
         "before:tw-border-t-0 before:tw-border-r-0 tw-left-[-5px]",
-        l && s === "Start" && e.toString().includes("Start".toLowerCase()) ? x[l] : "before:tw-bg-black-100 before:dark:tw-bg-white"
+        r && l === "Start" && e.toString().includes("Start".toLowerCase()) ? L[r] : "before:tw-dark before:tw-bg-base"
       ]);
     case e.toString().includes("Bottom".toLowerCase()):
-      return n([
+      return i([
         "before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px]",
-        l ? x[l] : "before:tw-bg-black-100 before:dark:tw-bg-white"
+        r ? L[r] : "before:tw-dark before:tw-bg-base"
       ]);
     case e.toString().includes("Left".toLowerCase()):
-      return n([
+      return i([
         "before:tw-border-b-0 before:tw-border-l-0 tw-right-[-5px]",
-        l && s === "Start" && e.toString().includes("Start".toLowerCase()) ? x[l] : "before:tw-bg-black-100 before:dark:tw-bg-white"
+        r && l === "Start" && e.toString().includes("Start".toLowerCase()) ? L[r] : "before:tw-dark before:tw-bg-base"
       ]);
     default:
-      return "before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px] before:tw-bg-black-100 before:dark:tw-bg-white";
+      return "before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px] before:tw-dark before:tw-bg-base";
   }
-}, Se = ({
+}, ke = ({
   content: e,
-  tooltipIcon: l,
-  heading: s,
-  headingIcon: p,
+  tooltipIcon: r,
+  heading: l,
+  headingIcon: g,
   linkUrl: c,
-  linkLabel: Q,
+  linkLabel: G,
   brightHeader: m,
-  buttons: r,
-  children: W,
-  position: B = "Bottom",
-  alignment: L = "Middle",
-  withArrow: u,
-  flip: X = !0,
-  triggerElement: T,
-  hoverDelay: C = 200,
-  enterDelay: b = 0,
-  open: M = !1,
-  disabled: g = !1,
-  hidden: E = !1
+  buttons: a,
+  children: J,
+  position: T = "Bottom",
+  alignment: B = "Middle",
+  withArrow: S,
+  flip: Q = !0,
+  triggerElement: R,
+  hoverDelay: y = 200,
+  enterDelay: x = 0,
+  open: z = !1,
+  disabled: W = !1,
+  hidden: X = !1
 }) => {
   var I;
-  const [S, Z] = d(
+  const [v, Z] = b(
     null
-  ), R = Y(null), { linkProps: A } = ne({}, R), P = ie(
-    () => c || m || r || s || p,
-    [c, m, r, s, p]
-  ), H = ge[`${B}-${L}`], [w, U] = d(null), [y, ee] = d(null), [te, re] = d(null), z = pe(), i = de(S, w, {
+  ), M = D(null), s = X || W, { linkProps: A } = we({ isDisabled: s }, M), P = me(
+    () => c || m || a || l || g,
+    [c, m, a, l, g]
+  ), H = xe[`${T}-${B}`], [p, U] = b(null), [h, ee] = b(null), [te, oe] = b(null), N = ge(), d = Ee(v, p, {
     placement: H,
     strategy: "fixed",
     modifiers: [
@@ -91,133 +91,135 @@ const ge = {
       {
         name: "offset",
         options: {
-          offset: [0, u ? 10 : 5]
+          offset: [0, S ? 10 : 5]
         }
       },
       {
         name: "flip",
-        enabled: X
+        enabled: Q
       }
     ]
-  }), oe = ((I = i.state) == null ? void 0 : I.placement) ?? B, ae = Ee(oe, m, L), [h, o] = d(!1), f = Y(null), N = k(() => {
-    f.current && clearTimeout(f.current), f.current = setTimeout(() => o(!1), C);
-  }, [C]), O = k(() => {
-    if (f.current && clearTimeout(f.current), b) {
-      f.current = setTimeout(() => o(!0), b);
+  }), re = ((I = d.state) == null ? void 0 : I.placement) ?? T, ae = ve(re, m, B), [k, n] = b(!1), f = D(null), se = E(() => {
+    f.current && clearTimeout(f.current), f.current = setTimeout(() => n(!1), y);
+  }, [y]), O = E(() => {
+    if (f.current && clearTimeout(f.current), x) {
+      f.current = setTimeout(() => n(!0), x);
       return;
     }
-    o(!0);
-  }, [b]), F = k(
-    (a) => {
-      var $;
-      const _ = a.path ?? (($ = a.composedPath) == null ? void 0 : $.call(a));
-      _ && [S, y, w].some((se) => _.includes(se)) && O();
+    n(!0);
+  }, [x]), le = E(
+    (o) => {
+      var w;
+      const u = o.path ?? ((w = o.composedPath) == null ? void 0 : w.call(o));
+      u && [v, h, p].some((fe) => u.includes(fe)) && O();
     },
-    [O, S, y, w]
-  ), le = {
-    onMouseOver: (a) => F(a.nativeEvent),
-    onMouseLeave: N,
-    onFocus: () => o(!0),
-    onBlur: (a) => {
-      w != null && w.contains(a.relatedTarget) || o(!1);
-    }
+    [O, v, h, p]
+  ), ne = E((o) => {
+    o.key === "Escape" && n(!1);
+  }, []), ie = E(
+    (o) => {
+      const { relatedTarget: u } = o;
+      (!u || ![p, h].some((w) => w == null ? void 0 : w.contains(u))) && n(!1);
+    },
+    [p, h]
+  ), F = s ? {} : {
+    onMouseOver: (o) => le(o.nativeEvent),
+    onMouseLeave: se,
+    onFocus: () => n(!0),
+    onBlur: ie,
+    onKeyDown: ne
   };
-  return fe(() => {
-    o(M);
-  }, [M]), ce(() => {
-    typeof i.update == "function" && h && i.update();
-  }, [h]), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("div", { ...le, ref: ee }, T && v(T, {
+  return pe(() => {
+    n(s ? !1 : z);
+  }, [z, s]), ue(() => {
+    typeof d.update == "function" && k && d.update();
+  }, [k]), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("div", { ...F, ref: ee }, R && C(R, {
     ref: Z,
-    "aria-describedby": z,
-    "aria-disabled": !!(E || g)
+    "aria-describedby": N,
+    "aria-disabled": s
   })), /* @__PURE__ */ t.createElement(
     "div",
     {
       ref: U,
-      "aria-hidden": !!(E || g),
-      className: n([
-        "tw-popper-container tw-inline-block tw-max-w-[200px] tw-bg-black-100 dark:tw-bg-white tw-rounded-md tw-shadow-mid tw-text-white dark:tw-text-black-100 tw-z-[120000]",
-        (E || g) && "tw-hidden",
-        !h && "tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden"
+      "aria-hidden": s,
+      className: i([
+        "tw-popper-container tw-inline-block tw-max-w-[200px] tw-dark tw-bg-base tw-rounded-md tw-shadow-mid tw-text-text tw-z-[120000]",
+        !k && "tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden"
       ]),
       "data-test-id": "tooltip",
       role: "tooltip",
-      id: z,
-      style: i.styles.popper,
-      ...i.attributes.popper,
-      onFocus: () => o(!0),
-      onMouseOver: (a) => F(a.nativeEvent),
-      onMouseLeave: N
+      id: N,
+      style: d.styles.popper,
+      ...d.attributes.popper,
+      ...F
     },
-    m && /* @__PURE__ */ t.createElement(me, { headerStyle: m }),
+    m && /* @__PURE__ */ t.createElement(be, { headerStyle: m }),
     /* @__PURE__ */ t.createElement(
       "div",
       {
-        className: n([
-          "tw-px-4 tw-bg-black-100 dark:tw-bg-white tw-rounded-md tw-relative tw-z-[120000]",
-          P ? J.small : J.large,
-          c ? K.small : K.large
+        className: i([
+          "tw-px-4 tw-dark tw-bg-base tw-rounded-md tw-relative tw-z-[120000]",
+          P ? j.small : j.large,
+          c ? q.small : q.large
         ])
       },
-      s && /* @__PURE__ */ t.createElement("h4", { className: "tw-flex tw-text-m tw-font-bold tw-mb-1" }, p && /* @__PURE__ */ t.createElement("span", { className: "tw-mr-1.5" }, v(p, { size: V.Size20 })), s),
-      /* @__PURE__ */ t.createElement("div", { className: "tw-flex" }, l && /* @__PURE__ */ t.createElement("span", { className: "tw-shrink-0 tw-mr-1 tw-leading-4" }, v(l, { size: V.Size16 })), /* @__PURE__ */ t.createElement("span", { className: "tw-text-s tw-min-w-0 tw-break-words" }, e)),
+      l && /* @__PURE__ */ t.createElement("h4", { className: "tw-flex tw-text-m tw-font-bold tw-mb-1" }, g && /* @__PURE__ */ t.createElement("span", { className: "tw-mr-1.5" }, C(g, { size: _.Size20 })), l),
+      /* @__PURE__ */ t.createElement("div", { className: "tw-flex" }, r && /* @__PURE__ */ t.createElement("span", { className: "tw-shrink-0 tw-mr-1 tw-leading-4" }, C(r, { size: _.Size16 })), /* @__PURE__ */ t.createElement("span", { className: "tw-text-s tw-min-w-0 tw-break-words" }, e)),
       c && /* @__PURE__ */ t.createElement(
         "a",
         {
           ...A,
           "data-test-id": "tooltip-link",
-          ref: R,
+          ref: M,
           href: c,
           target: "_blank",
           rel: "noopener noreferrer",
-          className: n([
-            "tw-text-xs tw-text-black-40 dark:tw-text-black-80 tw-underline tw-mt-1",
-            we
-          ]),
-          onBlur: () => r && r.length > 0 ? null : o(!1)
+          className: i(["tw-text-xs tw-text-black-40 tw-underline tw-mt-1", ce])
         },
-        Q ?? "Click here to learn more."
+        G ?? "Click here to learn more."
       ),
-      r && /* @__PURE__ */ t.createElement("div", { className: "tw-flex tw-flex-row-reverse tw-gap-x-1 tw-mt-4" }, r.length > 0 && /* @__PURE__ */ t.createElement("div", { onBlur: () => r && r.length < 2 ? o(!1) : null }, /* @__PURE__ */ t.createElement(
-        j,
+      a && /* @__PURE__ */ t.createElement("div", { className: "tw-flex tw-flex-row-reverse tw-gap-x-1 tw-mt-4" }, a.length > 0 && /* @__PURE__ */ t.createElement(
+        $,
         {
-          style: q.Default,
-          emphasis: D.Strong,
-          size: G.Small,
-          onClick: r[0].action
+          style: K.Default,
+          emphasis: V.Strong,
+          size: Y.Small,
+          onClick: a[0].action,
+          disabled: s
         },
-        r[0].label
-      )), r.length === 2 && /* @__PURE__ */ t.createElement("div", { onBlur: () => o(!1) }, /* @__PURE__ */ t.createElement(
-        j,
+        a[0].label
+      ), a.length === 2 && /* @__PURE__ */ t.createElement(
+        $,
         {
-          style: q.Default,
-          emphasis: D.Default,
-          size: G.Small,
-          onClick: r[1].action
+          style: K.Default,
+          emphasis: V.Default,
+          size: Y.Small,
+          onClick: a[1].action,
+          disabled: s
         },
-        r[1].label
-      )))
+        a[1].label
+      ))
     ),
     /* @__PURE__ */ t.createElement("div", { "aria-hidden": "true" }, /* @__PURE__ */ t.createElement(
       "div",
       {
         "data-test-id": "popover-arrow",
-        "data-popper-arrow": u,
-        ref: re,
-        style: i.styles.arrow,
-        className: n([
-          u && "tw-popper-arrow tw-z-[110000] tw-absolute tw-w-3 tw-h-3 tw-pointer-events-none before:tw-absolute before:tw-w-3 before:tw-h-3 before:tw-rotate-45 before:tw-border before:tw-border-line",
-          u && ae
+        "data-popper-arrow": S,
+        ref: oe,
+        style: d.styles.arrow,
+        className: i([
+          S && "tw-popper-arrow tw-z-[110000] tw-absolute tw-w-3 tw-h-3 tw-pointer-events-none before:tw-absolute before:tw-w-3 before:tw-h-3 before:tw-rotate-45 before:tw-border before:tw-border-line",
+          S && ae
         ])
       }
     )),
-    W
+    J
   ));
 };
-Se.displayName = "FondueTooltip";
+ke.displayName = "FondueTooltip";
 export {
-  Se as Tooltip,
-  be as TooltipAlignment,
-  ue as TooltipPosition
+  ke as Tooltip,
+  he as TooltipAlignment,
+  Se as TooltipPosition
 };
 //# sourceMappingURL=Tooltip.es.js.map

package/dist/components/Tooltip/Tooltip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.es.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle } from '@components/Button';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useLink } from '@react-aria/link';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, {\n    FocusEvent,\n    HTMLAttributes,\n    PropsWithChildren,\n    ReactChild,\n    ReactElement,\n    ReactNode,\n    cloneElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { BrightHeader, BrightHeaderStyle, brightHeaderArrowBackgroundColors } from './BrightHeader';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\n\nexport type TooltipButton = {\n    label: string;\n    action: () => void;\n};\n\nexport type TooltipProps = PropsWithChildren<{\n    triggerElement?: ReactElement;\n    content: ReactNode;\n    tooltipIcon?: ReactElement;\n    heading?: ReactNode;\n    headingIcon?: ReactElement;\n    linkUrl?: string;\n    linkLabel?: string;\n    brightHeader?: BrightHeaderStyle;\n    buttons?: [TooltipButton, TooltipButton] | [TooltipButton];\n    children?: ReactChild;\n    position?: TooltipPosition;\n    alignment?: TooltipAlignment;\n    flip?: boolean;\n    withArrow?: boolean;\n    hoverDelay?: number;\n    enterDelay?: number;\n    open?: boolean;\n    disabled?: boolean;\n    /** @deprecated use disabled since the tooltip is always present in the DOM now so hidden has no effect anymore */\n    hidden?: boolean;\n}>;\n\n/**\n * This is a temporary workaround because for some yet unknown reasons `tailwindcss` in clarify purges the `tw-pb-3.5` and `tw-pt-3.5` class.\n */\nconst paddingsTop = {\n    small: 'tw-pt-3.5',\n    large: 'tw-pt-4',\n};\n\nconst paddingsBottom = {\n    small: 'tw-pb-3.5',\n    large: 'tw-pb-4',\n};\n\nexport enum TooltipPosition {\n    Top = 'Top',\n    Right = 'Right',\n    Bottom = 'Bottom',\n    Left = 'Left',\n}\n\nexport enum TooltipAlignment {\n    Start = 'Start',\n    Middle = 'Middle',\n    End = 'End',\n}\n\nconst placementMap: Record<`${TooltipPosition}-${TooltipAlignment}`, Placement> = {\n    ['Top-Start']: 'top-start',\n    ['Top-End']: 'top-end',\n    ['Bottom-Start']: 'bottom-start',\n    ['Bottom-End']: 'bottom-end',\n    ['Left-Start']: 'left-start',\n    ['Left-End']: 'left-end',\n    ['Right-Start']: 'right-start',\n    ['Right-End']: 'right-end',\n    ['Top-Middle']: 'top',\n    ['Right-Middle']: 'right',\n    ['Bottom-Middle']: 'bottom',\n    ['Left-Middle']: 'left',\n};\n\nconst getArrowClasses = (currentPlacement: string, brightHeader: BrightHeaderStyle | undefined, alignment: string) => {\n    switch (true) {\n        case currentPlacement.toString().includes(TooltipPosition.Top.toLowerCase()):\n            return 'before:tw-border-t-0 before:tw-border-l-0 tw-bottom-[-6px] before:tw-bg-black-100 before:dark:tw-bg-white';\n        case currentPlacement.toString().includes(TooltipPosition.Right.toLowerCase()):\n            return merge([\n                'before:tw-border-t-0 before:tw-border-r-0 tw-left-[-5px]',\n                brightHeader &&\n                alignment === TooltipAlignment.Start &&\n                currentPlacement.toString().includes(TooltipAlignment.Start.toLowerCase())\n                    ? brightHeaderArrowBackgroundColors[brightHeader]\n                    : 'before:tw-bg-black-100 before:dark:tw-bg-white',\n            ]);\n        case currentPlacement.toString().includes(TooltipPosition.Bottom.toLowerCase()):\n            return merge([\n                'before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px]',\n                brightHeader\n                    ? brightHeaderArrowBackgroundColors[brightHeader]\n                    : 'before:tw-bg-black-100 before:dark:tw-bg-white',\n            ]);\n        case currentPlacement.toString().includes(TooltipPosition.Left.toLowerCase()):\n            return merge([\n                'before:tw-border-b-0 before:tw-border-l-0 tw-right-[-5px]',\n                brightHeader &&\n                alignment === TooltipAlignment.Start &&\n                currentPlacement.toString().includes(TooltipAlignment.Start.toLowerCase())\n                    ? brightHeaderArrowBackgroundColors[brightHeader]\n                    : 'before:tw-bg-black-100 before:dark:tw-bg-white',\n            ]);\n        default:\n            return 'before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px] before:tw-bg-black-100 before:dark:tw-bg-white';\n    }\n};\n\nexport const Tooltip = ({\n    content,\n    tooltipIcon,\n    heading,\n    headingIcon,\n    linkUrl,\n    linkLabel,\n    brightHeader,\n    buttons,\n    children,\n    position = TooltipPosition.Bottom,\n    alignment = TooltipAlignment.Middle,\n    withArrow,\n    flip = true,\n    triggerElement,\n    hoverDelay = 200,\n    enterDelay = 0,\n    open = false,\n    disabled = false,\n    hidden = false,\n}: TooltipProps) => {\n    const [triggerElementRef, setTriggerElementRef] = useState<HTMLElement | HTMLDivElement | HTMLButtonElement | null>(\n        null,\n    );\n    const linkRef = useRef<HTMLAnchorElement | null>(null);\n    const { linkProps } = useLink({}, linkRef);\n    const hasLargePaddingTop = useMemo(\n        () => linkUrl || brightHeader || buttons || heading || headingIcon,\n        [linkUrl, brightHeader, buttons, heading, headingIcon],\n    );\n\n    const placement = placementMap[`${position}-${alignment}`];\n    const [tooltipContainerRef, setTooltipContainerRef] = useState<HTMLDivElement | null>(null);\n    const [triggerElementContainerRef, setTriggerElementContainerRef] = useState<HTMLDivElement | null>(null);\n    const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n    const id = useMemoizedId();\n\n    const tooltipOffset = withArrow ? 10 : 5;\n    const popperInstance = usePopper(triggerElementRef, tooltipContainerRef, {\n        placement,\n        strategy: 'fixed',\n        modifiers: [\n            {\n                name: 'arrow',\n                options: {\n                    element: arrowElement,\n                },\n            },\n            {\n                name: 'offset',\n                options: {\n                    offset: [0, tooltipOffset],\n                },\n            },\n            {\n                name: 'flip',\n                enabled: flip,\n            },\n        ],\n    });\n\n    const currentPlacement = popperInstance.state?.placement ?? position;\n    const arrowStyling = getArrowClasses(currentPlacement, brightHeader, alignment);\n    const [isOpen, setIsOpen] = useState(false);\n    const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const handleHideTooltipOnHover = useCallback(() => {\n        if (timeoutRef.current) {\n            clearTimeout(timeoutRef.current);\n        }\n        timeoutRef.current = setTimeout(() => setIsOpen(false), hoverDelay);\n    }, [hoverDelay]);\n\n    const handleShowTooltipOnHover = useCallback(() => {\n        if (timeoutRef.current) {\n            clearTimeout(timeoutRef.current);\n        }\n\n        if (enterDelay) {\n            timeoutRef.current = setTimeout(() => setIsOpen(true), enterDelay);\n            return;\n        }\n\n        setIsOpen(true);\n    }, [enterDelay]);\n\n    const checkIfHovered = useCallback(\n        (event) => {\n            const hoveredElement = event.path ?? event.composedPath?.();\n            const hoverSources = [triggerElementRef, triggerElementContainerRef, tooltipContainerRef];\n\n            if (hoveredElement && hoverSources.some((el) => hoveredElement.includes(el))) {\n                handleShowTooltipOnHover();\n            }\n        },\n        [handleShowTooltipOnHover, triggerElementRef, triggerElementContainerRef, tooltipContainerRef],\n    );\n\n    const triggerProps: HTMLAttributes<HTMLElement> = {\n        onMouseOver: (event) => checkIfHovered(event.nativeEvent),\n        onMouseLeave: handleHideTooltipOnHover,\n        onFocus: () => setIsOpen(true),\n        onBlur: (event: FocusEvent) => {\n            if (!tooltipContainerRef?.contains(event.relatedTarget)) {\n                setIsOpen(false);\n            }\n        },\n    };\n\n    useEffect(() => {\n        setIsOpen(open);\n    }, [open]);\n\n    useLayoutEffect(() => {\n        if (typeof popperInstance.update === 'function' && isOpen) {\n            popperInstance.update();\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [isOpen]);\n\n    return (\n        <>\n            <div {...triggerProps} ref={setTriggerElementContainerRef}>\n                {triggerElement &&\n                    cloneElement(triggerElement, {\n                        ref: setTriggerElementRef,\n                        'aria-describedby': id,\n                        'aria-disabled': hidden || disabled ? true : false,\n                    })}\n            </div>\n            <div\n                ref={setTooltipContainerRef}\n                aria-hidden={hidden || disabled ? true : false}\n                className={merge([\n                    'tw-popper-container tw-inline-block tw-max-w-[200px] tw-bg-black-100 dark:tw-bg-white tw-rounded-md tw-shadow-mid tw-text-white dark:tw-text-black-100 tw-z-[120000]',\n                    (hidden || disabled) && 'tw-hidden',\n                    !isOpen && 'tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden',\n                ])}\n                data-test-id=\"tooltip\"\n                role=\"tooltip\"\n                id={id}\n                style={popperInstance.styles.popper}\n                {...popperInstance.attributes.popper}\n                onFocus={() => setIsOpen(true)}\n                onMouseOver={(event) => checkIfHovered(event.nativeEvent)}\n                onMouseLeave={handleHideTooltipOnHover}\n            >\n                {brightHeader && <BrightHeader headerStyle={brightHeader} />}\n                <div\n                    className={merge([\n                        'tw-px-4 tw-bg-black-100 dark:tw-bg-white tw-rounded-md tw-relative tw-z-[120000]',\n                        hasLargePaddingTop ? paddingsTop.small : paddingsTop.large,\n                        linkUrl ? paddingsBottom.small : paddingsBottom.large,\n                    ])}\n                >\n                    {heading && (\n                        <h4 className=\"tw-flex tw-text-m tw-font-bold tw-mb-1\">\n                            {headingIcon && (\n                                <span className=\"tw-mr-1.5\">\n                                    {cloneElement(headingIcon, { size: IconSize.Size20 })}\n                                </span>\n                            )}\n                            {heading}\n                        </h4>\n                    )}\n                    <div className=\"tw-flex\">\n                        {tooltipIcon && (\n                            <span className=\"tw-shrink-0 tw-mr-1 tw-leading-4\">\n                                {cloneElement(tooltipIcon, { size: IconSize.Size16 })}\n                            </span>\n                        )}\n                        <span className=\"tw-text-s tw-min-w-0 tw-break-words\">{content}</span>\n                    </div>\n                    {linkUrl && (\n                        <a\n                            {...linkProps}\n                            data-test-id=\"tooltip-link\"\n                            ref={linkRef}\n                            href={linkUrl}\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            className={merge([\n                                'tw-text-xs tw-text-black-40 dark:tw-text-black-80 tw-underline tw-mt-1',\n                                FOCUS_VISIBLE_STYLE,\n                            ])}\n                            onBlur={() => (buttons && buttons.length > 0 ? null : setIsOpen(false))}\n                        >\n                            {linkLabel ?? 'Click here to learn more.'}\n                        </a>\n                    )}\n                    {buttons && (\n                        <div className=\"tw-flex tw-flex-row-reverse tw-gap-x-1 tw-mt-4\">\n                            {buttons.length > 0 && (\n                                <div onBlur={() => (buttons && buttons.length < 2 ? setIsOpen(false) : null)}>\n                                    <Button\n                                        style={ButtonStyle.Default}\n                                        emphasis={ButtonEmphasis.Strong}\n                                        size={ButtonSize.Small}\n                                        onClick={buttons[0].action}\n                                    >\n                                        {buttons[0].label}\n                                    </Button>\n                                </div>\n                            )}\n                            {buttons.length === 2 && (\n                                <div onBlur={() => setIsOpen(false)}>\n                                    <Button\n                                        style={ButtonStyle.Default}\n                                        emphasis={ButtonEmphasis.Default}\n                                        size={ButtonSize.Small}\n                                        onClick={buttons[1].action}\n                                    >\n                                        {buttons[1].label}\n                                    </Button>\n                                </div>\n                            )}\n                        </div>\n                    )}\n                </div>\n                {/**\n                 * This container is needed for the arrow element to not be styled by popperJS\n                 * selectors for its immediate children .tw-popper-container > .tw-popper-arrow\n                 * */}\n                <div aria-hidden=\"true\">\n                    <div\n                        data-test-id=\"popover-arrow\"\n                        data-popper-arrow={withArrow}\n                        ref={setArrowElement}\n                        style={popperInstance.styles.arrow}\n                        className={merge([\n                            withArrow &&\n                                'tw-popper-arrow tw-z-[110000] tw-absolute tw-w-3 tw-h-3 tw-pointer-events-none before:tw-absolute before:tw-w-3 before:tw-h-3 before:tw-rotate-45 before:tw-border before:tw-border-line',\n                            withArrow && arrowStyling,\n                        ])}\n                    />\n                </div>\n                {children}\n            </div>\n        </>\n    );\n};\nTooltip.displayName = 'FondueTooltip';\n"],"names":["paddingsTop","paddingsBottom","TooltipPosition","TooltipAlignment","placementMap","getArrowClasses","currentPlacement","brightHeader","alignment","merge","brightHeaderArrowBackgroundColors","Tooltip","content","tooltipIcon","heading","headingIcon","linkUrl","linkLabel","buttons","children","position","withArrow","flip","triggerElement","hoverDelay","enterDelay","open","disabled","hidden","triggerElementRef","setTriggerElementRef","useState","linkRef","useRef","linkProps","useLink","hasLargePaddingTop","useMemo","placement","tooltipContainerRef","setTooltipContainerRef","triggerElementContainerRef","setTriggerElementContainerRef","arrowElement","setArrowElement","id","useMemoizedId","popperInstance","usePopper","_a","arrowStyling","isOpen","setIsOpen","timeoutRef","handleHideTooltipOnHover","useCallback","handleShowTooltipOnHover","checkIfHovered","event","hoveredElement","el","triggerProps","useEffect","useLayoutEffect","React","cloneElement","BrightHeader","IconSize","FOCUS_VISIBLE_STYLE","Button","ButtonStyle","ButtonEmphasis","ButtonSize"],"mappings":"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"}
+{"version":3,"file":"Tooltip.es.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle } from '@components/Button';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useLink } from '@react-aria/link';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, {\n    FocusEvent,\n    HTMLAttributes,\n    KeyboardEvent,\n    PropsWithChildren,\n    ReactChild,\n    ReactElement,\n    ReactNode,\n    cloneElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { BrightHeader, BrightHeaderStyle, brightHeaderArrowBackgroundColors } from './BrightHeader';\nimport { usePopper } from 'react-popper';\nimport { Placement } from '@popperjs/core';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\n\nexport type TooltipButton = {\n    label: string;\n    action: () => void;\n};\n\nexport type TooltipProps = PropsWithChildren<{\n    triggerElement?: ReactElement;\n    content: ReactNode;\n    tooltipIcon?: ReactElement;\n    heading?: ReactNode;\n    headingIcon?: ReactElement;\n    linkUrl?: string;\n    linkLabel?: string;\n    brightHeader?: BrightHeaderStyle;\n    buttons?: [TooltipButton, TooltipButton] | [TooltipButton];\n    children?: ReactChild;\n    position?: TooltipPosition;\n    alignment?: TooltipAlignment;\n    flip?: boolean;\n    withArrow?: boolean;\n    hoverDelay?: number;\n    enterDelay?: number;\n    open?: boolean;\n    disabled?: boolean;\n    /** @deprecated use disabled since the tooltip is always present in the DOM now so hidden has no effect anymore */\n    hidden?: boolean;\n}>;\n\n/**\n * This is a temporary workaround because for some yet unknown reasons `tailwindcss` in clarify purges the `tw-pb-3.5` and `tw-pt-3.5` class.\n */\nconst paddingsTop = {\n    small: 'tw-pt-3.5',\n    large: 'tw-pt-4',\n};\n\nconst paddingsBottom = {\n    small: 'tw-pb-3.5',\n    large: 'tw-pb-4',\n};\n\nexport enum TooltipPosition {\n    Top = 'Top',\n    Right = 'Right',\n    Bottom = 'Bottom',\n    Left = 'Left',\n}\n\nexport enum TooltipAlignment {\n    Start = 'Start',\n    Middle = 'Middle',\n    End = 'End',\n}\n\nconst placementMap: Record<`${TooltipPosition}-${TooltipAlignment}`, Placement> = {\n    ['Top-Start']: 'top-start',\n    ['Top-End']: 'top-end',\n    ['Bottom-Start']: 'bottom-start',\n    ['Bottom-End']: 'bottom-end',\n    ['Left-Start']: 'left-start',\n    ['Left-End']: 'left-end',\n    ['Right-Start']: 'right-start',\n    ['Right-End']: 'right-end',\n    ['Top-Middle']: 'top',\n    ['Right-Middle']: 'right',\n    ['Bottom-Middle']: 'bottom',\n    ['Left-Middle']: 'left',\n};\n\nconst getArrowClasses = (currentPlacement: string, brightHeader: BrightHeaderStyle | undefined, alignment: string) => {\n    switch (true) {\n        case currentPlacement.toString().includes(TooltipPosition.Top.toLowerCase()):\n            return 'before:tw-border-t-0 before:tw-border-l-0 tw-bottom-[-6px] before:tw-dark before:tw-bg-base';\n        case currentPlacement.toString().includes(TooltipPosition.Right.toLowerCase()):\n            return merge([\n                'before:tw-border-t-0 before:tw-border-r-0 tw-left-[-5px]',\n                brightHeader &&\n                alignment === TooltipAlignment.Start &&\n                currentPlacement.toString().includes(TooltipAlignment.Start.toLowerCase())\n                    ? brightHeaderArrowBackgroundColors[brightHeader]\n                    : 'before:tw-dark before:tw-bg-base',\n            ]);\n        case currentPlacement.toString().includes(TooltipPosition.Bottom.toLowerCase()):\n            return merge([\n                'before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px]',\n                brightHeader ? brightHeaderArrowBackgroundColors[brightHeader] : 'before:tw-dark before:tw-bg-base',\n            ]);\n        case currentPlacement.toString().includes(TooltipPosition.Left.toLowerCase()):\n            return merge([\n                'before:tw-border-b-0 before:tw-border-l-0 tw-right-[-5px]',\n                brightHeader &&\n                alignment === TooltipAlignment.Start &&\n                currentPlacement.toString().includes(TooltipAlignment.Start.toLowerCase())\n                    ? brightHeaderArrowBackgroundColors[brightHeader]\n                    : 'before:tw-dark before:tw-bg-base',\n            ]);\n        default:\n            return 'before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px] before:tw-dark before:tw-bg-base';\n    }\n};\n\nexport const Tooltip = ({\n    content,\n    tooltipIcon,\n    heading,\n    headingIcon,\n    linkUrl,\n    linkLabel,\n    brightHeader,\n    buttons,\n    children,\n    position = TooltipPosition.Bottom,\n    alignment = TooltipAlignment.Middle,\n    withArrow,\n    flip = true,\n    triggerElement,\n    hoverDelay = 200,\n    enterDelay = 0,\n    open = false,\n    disabled = false,\n    hidden = false,\n}: TooltipProps) => {\n    const [triggerElementRef, setTriggerElementRef] = useState<HTMLElement | HTMLDivElement | HTMLButtonElement | null>(\n        null,\n    );\n    const linkRef = useRef<HTMLAnchorElement | null>(null);\n\n    const shouldPreventTooltipOpening = hidden || disabled;\n    const { linkProps } = useLink({ isDisabled: shouldPreventTooltipOpening }, linkRef);\n    const hasLargePaddingTop = useMemo(\n        () => linkUrl || brightHeader || buttons || heading || headingIcon,\n        [linkUrl, brightHeader, buttons, heading, headingIcon],\n    );\n\n    const placement = placementMap[`${position}-${alignment}`];\n    const [tooltipContainerRef, setTooltipContainerRef] = useState<HTMLDivElement | null>(null);\n    const [triggerElementContainerRef, setTriggerElementContainerRef] = useState<HTMLDivElement | null>(null);\n    const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n    const id = useMemoizedId();\n\n    const tooltipOffset = withArrow ? 10 : 5;\n    const popperInstance = usePopper(triggerElementRef, tooltipContainerRef, {\n        placement,\n        strategy: 'fixed',\n        modifiers: [\n            {\n                name: 'arrow',\n                options: {\n                    element: arrowElement,\n                },\n            },\n            {\n                name: 'offset',\n                options: {\n                    offset: [0, tooltipOffset],\n                },\n            },\n            {\n                name: 'flip',\n                enabled: flip,\n            },\n        ],\n    });\n\n    const currentPlacement = popperInstance.state?.placement ?? position;\n    const arrowStyling = getArrowClasses(currentPlacement, brightHeader, alignment);\n    const [isOpen, setIsOpen] = useState(false);\n    const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const handleHideTooltipOnHover = useCallback(() => {\n        if (timeoutRef.current) {\n            clearTimeout(timeoutRef.current);\n        }\n        timeoutRef.current = setTimeout(() => setIsOpen(false), hoverDelay);\n    }, [hoverDelay]);\n\n    const handleShowTooltipOnHover = useCallback(() => {\n        if (timeoutRef.current) {\n            clearTimeout(timeoutRef.current);\n        }\n\n        if (enterDelay) {\n            timeoutRef.current = setTimeout(() => setIsOpen(true), enterDelay);\n            return;\n        }\n\n        setIsOpen(true);\n    }, [enterDelay]);\n\n    const checkIfHovered = useCallback(\n        (event) => {\n            const hoveredElement = event.path ?? event.composedPath?.();\n            const hoverSources = [triggerElementRef, triggerElementContainerRef, tooltipContainerRef];\n\n            if (hoveredElement && hoverSources.some((el) => hoveredElement.includes(el))) {\n                handleShowTooltipOnHover();\n            }\n        },\n        [handleShowTooltipOnHover, triggerElementRef, triggerElementContainerRef, tooltipContainerRef],\n    );\n\n    const handleCloseTooltipOnEscape = useCallback((event: KeyboardEvent<HTMLElement>) => {\n        if (event.key === 'Escape') {\n            setIsOpen(false);\n        }\n    }, []);\n\n    const handleCloseIfFocusedOutside = useCallback(\n        (event: FocusEvent<HTMLElement>) => {\n            const { relatedTarget } = event;\n            const elements = [tooltipContainerRef, triggerElementContainerRef];\n\n            if (!relatedTarget || !elements.some((element) => element?.contains(relatedTarget))) {\n                setIsOpen(false);\n            }\n        },\n        [tooltipContainerRef, triggerElementContainerRef],\n    );\n\n    const openingEvents: HTMLAttributes<HTMLElement> = shouldPreventTooltipOpening\n        ? {}\n        : {\n              onMouseOver: (event) => checkIfHovered(event.nativeEvent),\n              onMouseLeave: handleHideTooltipOnHover,\n              onFocus: () => setIsOpen(true),\n              onBlur: handleCloseIfFocusedOutside,\n              onKeyDown: handleCloseTooltipOnEscape,\n          };\n\n    useEffect(() => {\n        setIsOpen(shouldPreventTooltipOpening ? false : open);\n    }, [open, shouldPreventTooltipOpening]);\n\n    useLayoutEffect(() => {\n        if (typeof popperInstance.update === 'function' && isOpen) {\n            popperInstance.update();\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [isOpen]);\n\n    return (\n        <>\n            <div {...openingEvents} ref={setTriggerElementContainerRef}>\n                {triggerElement &&\n                    cloneElement(triggerElement, {\n                        ref: setTriggerElementRef,\n                        'aria-describedby': id,\n                        'aria-disabled': shouldPreventTooltipOpening,\n                    })}\n            </div>\n            <div\n                ref={setTooltipContainerRef}\n                aria-hidden={shouldPreventTooltipOpening}\n                className={merge([\n                    'tw-popper-container tw-inline-block tw-max-w-[200px] tw-dark tw-bg-base tw-rounded-md tw-shadow-mid tw-text-text tw-z-[120000]',\n                    !isOpen && 'tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden',\n                ])}\n                data-test-id=\"tooltip\"\n                role=\"tooltip\"\n                id={id}\n                style={popperInstance.styles.popper}\n                {...popperInstance.attributes.popper}\n                {...openingEvents}\n            >\n                {brightHeader && <BrightHeader headerStyle={brightHeader} />}\n                <div\n                    className={merge([\n                        'tw-px-4 tw-dark tw-bg-base tw-rounded-md tw-relative tw-z-[120000]',\n                        hasLargePaddingTop ? paddingsTop.small : paddingsTop.large,\n                        linkUrl ? paddingsBottom.small : paddingsBottom.large,\n                    ])}\n                >\n                    {heading && (\n                        <h4 className=\"tw-flex tw-text-m tw-font-bold tw-mb-1\">\n                            {headingIcon && (\n                                <span className=\"tw-mr-1.5\">\n                                    {cloneElement(headingIcon, { size: IconSize.Size20 })}\n                                </span>\n                            )}\n                            {heading}\n                        </h4>\n                    )}\n                    <div className=\"tw-flex\">\n                        {tooltipIcon && (\n                            <span className=\"tw-shrink-0 tw-mr-1 tw-leading-4\">\n                                {cloneElement(tooltipIcon, { size: IconSize.Size16 })}\n                            </span>\n                        )}\n                        <span className=\"tw-text-s tw-min-w-0 tw-break-words\">{content}</span>\n                    </div>\n                    {linkUrl && (\n                        <a\n                            {...linkProps}\n                            data-test-id=\"tooltip-link\"\n                            ref={linkRef}\n                            href={linkUrl}\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            className={merge(['tw-text-xs tw-text-black-40 tw-underline tw-mt-1', FOCUS_VISIBLE_STYLE])}\n                        >\n                            {linkLabel ?? 'Click here to learn more.'}\n                        </a>\n                    )}\n                    {buttons && (\n                        <div className=\"tw-flex tw-flex-row-reverse tw-gap-x-1 tw-mt-4\">\n                            {buttons.length > 0 && (\n                                <Button\n                                    style={ButtonStyle.Default}\n                                    emphasis={ButtonEmphasis.Strong}\n                                    size={ButtonSize.Small}\n                                    onClick={buttons[0].action}\n                                    disabled={shouldPreventTooltipOpening}\n                                >\n                                    {buttons[0].label}\n                                </Button>\n                            )}\n                            {buttons.length === 2 && (\n                                <Button\n                                    style={ButtonStyle.Default}\n                                    emphasis={ButtonEmphasis.Default}\n                                    size={ButtonSize.Small}\n                                    onClick={buttons[1].action}\n                                    disabled={shouldPreventTooltipOpening}\n                                >\n                                    {buttons[1].label}\n                                </Button>\n                            )}\n                        </div>\n                    )}\n                </div>\n                {/**\n                 * This container is needed for the arrow element to not be styled by popperJS\n                 * selectors for its immediate children .tw-popper-container > .tw-popper-arrow\n                 * */}\n                <div aria-hidden=\"true\">\n                    <div\n                        data-test-id=\"popover-arrow\"\n                        data-popper-arrow={withArrow}\n                        ref={setArrowElement}\n                        style={popperInstance.styles.arrow}\n                        className={merge([\n                            withArrow &&\n                                'tw-popper-arrow tw-z-[110000] tw-absolute tw-w-3 tw-h-3 tw-pointer-events-none before:tw-absolute before:tw-w-3 before:tw-h-3 before:tw-rotate-45 before:tw-border before:tw-border-line',\n                            withArrow && arrowStyling,\n                        ])}\n                    />\n                </div>\n                {children}\n            </div>\n        </>\n    );\n};\nTooltip.displayName = 'FondueTooltip';\n"],"names":["paddingsTop","paddingsBottom","TooltipPosition","TooltipAlignment","placementMap","getArrowClasses","currentPlacement","brightHeader","alignment","merge","brightHeaderArrowBackgroundColors","Tooltip","content","tooltipIcon","heading","headingIcon","linkUrl","linkLabel","buttons","children","position","withArrow","flip","triggerElement","hoverDelay","enterDelay","open","disabled","hidden","triggerElementRef","setTriggerElementRef","useState","linkRef","useRef","shouldPreventTooltipOpening","linkProps","useLink","hasLargePaddingTop","useMemo","placement","tooltipContainerRef","setTooltipContainerRef","triggerElementContainerRef","setTriggerElementContainerRef","arrowElement","setArrowElement","id","useMemoizedId","popperInstance","usePopper","_a","arrowStyling","isOpen","setIsOpen","timeoutRef","handleHideTooltipOnHover","useCallback","handleShowTooltipOnHover","checkIfHovered","event","hoveredElement","el","handleCloseTooltipOnEscape","handleCloseIfFocusedOutside","relatedTarget","element","openingEvents","useEffect","useLayoutEffect","React","cloneElement","BrightHeader","IconSize","FOCUS_VISIBLE_STYLE","Button","ButtonStyle","ButtonEmphasis","ButtonSize"],"mappings":"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"}