@frontify/fondue 12.0.0-beta.123 → 12.0.0-beta.125

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,13 +1,13 @@
1
- import { IconSize as V } from "../../foundation/Icon/IconSize.es.js";
2
- import { useLink as ne } from "@react-aria/link";
3
- import { FOCUS_VISIBLE_STYLE as fe } from "../../utilities/focusStyle.es.js";
4
- import { merge as n } from "../../utilities/merge.es.js";
5
- import t, { useState as c, useRef as Y, useMemo as we, useCallback as h, useEffect as me, useLayoutEffect as ie, cloneElement as x } from "react";
6
- import { BrightHeader as de, brightHeaderArrowBackgroundColors as B } from "./BrightHeader.es.js";
7
- import { usePopper as ce } from "react-popper";
8
- import { useMemoizedId as pe } from "../../hooks/useMemoizedId.es.js";
9
- import { Button as j } from "../Button/Button.es.js";
10
- import { ButtonStyle as q, ButtonEmphasis as D, ButtonSize as G } from "../Button/ButtonTypes.es.js";
1
+ import { IconSize as $ } from "../../foundation/Icon/IconSize.es.js";
2
+ import { useLink as me } from "@react-aria/link";
3
+ import { FOCUS_VISIBLE_STYLE as ce } from "../../utilities/focusStyle.es.js";
4
+ import { merge as d } from "../../utilities/merge.es.js";
5
+ import t, { useState as E, useRef as D, useMemo as pe, useCallback as g, useEffect as V, useLayoutEffect as ue, cloneElement as C } from "react";
6
+ import { BrightHeader as be, brightHeaderArrowBackgroundColors as T } from "./BrightHeader.es.js";
7
+ import { usePopper as Ee } from "react-popper";
8
+ import { useMemoizedId as ge } from "../../hooks/useMemoizedId.es.js";
9
+ import { Button as Y } from "../Button/Button.es.js";
10
+ import { ButtonStyle as j, ButtonEmphasis as q, ButtonSize as G } from "../Button/ButtonTypes.es.js";
11
11
  const J = {
12
12
  small: "tw-pt-3.5",
13
13
  large: "tw-pt-4"
@@ -15,8 +15,8 @@ const J = {
15
15
  small: "tw-pb-3.5",
16
16
  large: "tw-pb-4"
17
17
  };
18
- 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 || {});
19
- const Ee = {
18
+ var Se = /* @__PURE__ */ ((e) => (e.Top = "Top", e.Right = "Right", e.Bottom = "Bottom", e.Left = "Left", e))(Se || {}), ve = /* @__PURE__ */ ((e) => (e.Start = "Start", e.Middle = "Middle", e.End = "End", e))(ve || {});
19
+ const he = {
20
20
  ["Top-Start"]: "top-start",
21
21
  ["Top-End"]: "top-end",
22
22
  ["Bottom-Start"]: "bottom-start",
@@ -29,69 +29,69 @@ const Ee = {
29
29
  ["Right-Middle"]: "right",
30
30
  ["Bottom-Middle"]: "bottom",
31
31
  ["Left-Middle"]: "left"
32
- }, ge = (e, s, l) => {
32
+ }, ke = (e, r, n) => {
33
33
  switch (!0) {
34
34
  case e.toString().includes("Top".toLowerCase()):
35
35
  return "before:tw-border-t-0 before:tw-border-l-0 tw-bottom-[-6px] before:tw-dark before:tw-bg-base";
36
36
  case e.toString().includes("Right".toLowerCase()):
37
- return n([
37
+ return d([
38
38
  "before:tw-border-t-0 before:tw-border-r-0 tw-left-[-5px]",
39
- s && l === "Start" && e.toString().includes("Start".toLowerCase()) ? B[s] : "before:tw-dark before:tw-bg-base"
39
+ r && n === "Start" && e.toString().includes("Start".toLowerCase()) ? T[r] : "before:tw-dark before:tw-bg-base"
40
40
  ]);
41
41
  case e.toString().includes("Bottom".toLowerCase()):
42
- return n([
42
+ return d([
43
43
  "before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px]",
44
- s ? B[s] : "before:tw-dark before:tw-bg-base"
44
+ r ? T[r] : "before:tw-dark before:tw-bg-base"
45
45
  ]);
46
46
  case e.toString().includes("Left".toLowerCase()):
47
- return n([
47
+ return d([
48
48
  "before:tw-border-b-0 before:tw-border-l-0 tw-right-[-5px]",
49
- s && l === "Start" && e.toString().includes("Start".toLowerCase()) ? B[s] : "before:tw-dark before:tw-bg-base"
49
+ r && n === "Start" && e.toString().includes("Start".toLowerCase()) ? T[r] : "before:tw-dark before:tw-bg-base"
50
50
  ]);
51
51
  default:
52
52
  return "before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px] before:tw-dark before:tw-bg-base";
53
53
  }
54
- }, Se = ({
54
+ }, xe = ({
55
55
  content: e,
56
- tooltipIcon: s,
57
- heading: l,
58
- headingIcon: p,
59
- linkUrl: i,
56
+ tooltipIcon: r,
57
+ heading: n,
58
+ headingIcon: S,
59
+ linkUrl: c,
60
60
  linkLabel: Q,
61
- brightHeader: d,
62
- buttons: r,
61
+ brightHeader: p,
62
+ buttons: s,
63
63
  children: W,
64
- position: L = "Bottom",
65
- alignment: k = "Middle",
66
- withArrow: u,
64
+ position: y = "Bottom",
65
+ alignment: B = "Middle",
66
+ withArrow: v,
67
67
  flip: X = !0,
68
- triggerElement: T,
69
- hoverDelay: C = 200,
70
- enterDelay: b = 0,
68
+ triggerElement: R,
69
+ hoverDelay: z = 200,
70
+ enterDelay: x = 0,
71
71
  open: M = !1,
72
- disabled: E = !1,
73
- hidden: g = !1
72
+ disabled: Z = !1,
73
+ hidden: A = !1
74
74
  }) => {
75
- var I;
76
- const [S, Z] = c(
75
+ var _;
76
+ const [L, P] = E(
77
77
  null
78
- ), R = Y(null), { linkProps: A } = ne({}, R), P = we(
79
- () => i || d || r || l || p,
80
- [i, d, r, l, p]
81
- ), H = Ee[`${L}-${k}`], [f, U] = c(null), [y, ee] = c(null), [te, re] = c(null), z = pe(), w = ce(S, f, {
82
- placement: H,
78
+ ), N = D(null), a = A || Z, { linkProps: H } = me({ isDisabled: a }, N), U = pe(
79
+ () => c || p || s || n || S,
80
+ [c, p, s, n, S]
81
+ ), ee = he[`${y}-${B}`], [u, te] = E(null), [h, oe] = E(null), [re, se] = E(null), O = ge(), w = Ee(L, u, {
82
+ placement: ee,
83
83
  strategy: "fixed",
84
84
  modifiers: [
85
85
  {
86
86
  name: "arrow",
87
87
  options: {
88
- element: te
88
+ element: re
89
89
  }
90
90
  },
91
91
  {
92
92
  name: "offset",
93
93
  options: {
94
- offset: [0, u ? 10 : 5]
94
+ offset: [0, v ? 10 : 5]
95
95
  }
96
96
  },
97
97
  {
@@ -99,122 +99,133 @@ const Ee = {
99
99
  enabled: X
100
100
  }
101
101
  ]
102
- }), oe = ((I = w.state) == null ? void 0 : I.placement) ?? L, ae = ge(oe, d, k), [v, o] = c(!1), m = Y(null), N = h(() => {
103
- m.current && clearTimeout(m.current), m.current = setTimeout(() => o(!1), C);
104
- }, [C]), O = h(() => {
105
- if (m.current && clearTimeout(m.current), b) {
106
- m.current = setTimeout(() => o(!0), b);
102
+ }), ae = ((_ = w.state) == null ? void 0 : _.placement) ?? y, ne = ke(ae, p, B), [l, i] = E(!1), f = D(null), le = g(() => {
103
+ f.current && clearTimeout(f.current), f.current = setTimeout(() => i(!1), z);
104
+ }, [z]), F = g(() => {
105
+ if (f.current && clearTimeout(f.current), x) {
106
+ f.current = setTimeout(() => i(!0), x);
107
107
  return;
108
108
  }
109
- o(!0);
110
- }, [b]), F = h(
111
- (a) => {
112
- var $;
113
- const _ = a.path ?? (($ = a.composedPath) == null ? void 0 : $.call(a));
114
- _ && [S, y, f].some((le) => _.includes(le)) && O();
109
+ i(!0);
110
+ }, [x]), ie = g(
111
+ (o) => {
112
+ var m;
113
+ const b = o.path ?? ((m = o.composedPath) == null ? void 0 : m.call(o));
114
+ b && [L, h, u].some((fe) => b.includes(fe)) && F();
115
115
  },
116
- [O, S, y, f]
117
- ), se = {
118
- onMouseOver: (a) => F(a.nativeEvent),
119
- onMouseLeave: N,
120
- onFocus: () => o(!0),
121
- onBlur: (a) => {
122
- f != null && f.contains(a.relatedTarget) || o(!1);
123
- }
116
+ [F, L, h, u]
117
+ ), de = g(
118
+ (o) => {
119
+ const { relatedTarget: b } = o;
120
+ (!b || ![u, h].some((m) => m == null ? void 0 : m.contains(b))) && i(!1);
121
+ },
122
+ [u, h]
123
+ ), I = a ? {} : {
124
+ onMouseOver: (o) => ie(o.nativeEvent),
125
+ onMouseLeave: le,
126
+ onFocus: () => i(!0),
127
+ onBlur: de
124
128
  };
125
- return me(() => {
126
- o(M);
127
- }, [M]), ie(() => {
128
- typeof w.update == "function" && v && w.update();
129
- }, [v]), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("div", { ...se, ref: ee }, T && x(T, {
130
- ref: Z,
131
- "aria-describedby": z,
132
- "aria-disabled": !!(g || E)
129
+ V(() => {
130
+ i(a ? !1 : M);
131
+ }, [M, a]);
132
+ const k = g(
133
+ (o) => {
134
+ l && o.key === "Escape" && i(!1);
135
+ },
136
+ [l]
137
+ );
138
+ return ue(() => {
139
+ typeof w.update == "function" && l && w.update();
140
+ }, [l]), V(() => (l ? window.addEventListener("keydown", k) : window.removeEventListener("keydown", k), () => {
141
+ window.removeEventListener("keydown", k);
142
+ }), [k, l]), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("div", { ...I, ref: oe }, R && C(R, {
143
+ ref: P,
144
+ "aria-describedby": O,
145
+ "aria-disabled": a
133
146
  })), /* @__PURE__ */ t.createElement(
134
147
  "div",
135
148
  {
136
- ref: U,
137
- "aria-hidden": !!(g || E),
138
- className: n([
149
+ ref: te,
150
+ "aria-hidden": a,
151
+ className: d([
139
152
  "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]",
140
- (g || E) && "tw-hidden",
141
- !v && "tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden"
153
+ !l && "tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden"
142
154
  ]),
143
155
  "data-test-id": "tooltip",
144
156
  role: "tooltip",
145
- id: z,
157
+ id: O,
146
158
  style: w.styles.popper,
147
159
  ...w.attributes.popper,
148
- onFocus: () => o(!0),
149
- onMouseOver: (a) => F(a.nativeEvent),
150
- onMouseLeave: N
160
+ ...I
151
161
  },
152
- d && /* @__PURE__ */ t.createElement(de, { headerStyle: d }),
162
+ p && /* @__PURE__ */ t.createElement(be, { headerStyle: p }),
153
163
  /* @__PURE__ */ t.createElement(
154
164
  "div",
155
165
  {
156
- className: n([
166
+ className: d([
157
167
  "tw-px-4 tw-dark tw-bg-base tw-rounded-md tw-relative tw-z-[120000]",
158
- P ? J.small : J.large,
159
- i ? K.small : K.large
168
+ U ? J.small : J.large,
169
+ c ? K.small : K.large
160
170
  ])
161
171
  },
162
- l && /* @__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" }, x(p, { size: V.Size20 })), l),
163
- /* @__PURE__ */ t.createElement("div", { className: "tw-flex" }, s && /* @__PURE__ */ t.createElement("span", { className: "tw-shrink-0 tw-mr-1 tw-leading-4" }, x(s, { size: V.Size16 })), /* @__PURE__ */ t.createElement("span", { className: "tw-text-s tw-min-w-0 tw-break-words" }, e)),
164
- i && /* @__PURE__ */ t.createElement(
172
+ n && /* @__PURE__ */ t.createElement("h4", { className: "tw-flex tw-text-m tw-font-bold tw-mb-1" }, S && /* @__PURE__ */ t.createElement("span", { className: "tw-mr-1.5" }, C(S, { size: $.Size20 })), n),
173
+ /* @__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)),
174
+ c && /* @__PURE__ */ t.createElement(
165
175
  "a",
166
176
  {
167
- ...A,
177
+ ...H,
168
178
  "data-test-id": "tooltip-link",
169
- ref: R,
170
- href: i,
179
+ ref: N,
180
+ href: c,
171
181
  target: "_blank",
172
182
  rel: "noopener noreferrer",
173
- className: n(["tw-text-xs tw-text-black-40 tw-underline tw-mt-1", fe]),
174
- onBlur: () => r && r.length > 0 ? null : o(!1)
183
+ className: d(["tw-text-xs tw-text-black-40 tw-underline tw-mt-1", ce])
175
184
  },
176
185
  Q ?? "Click here to learn more."
177
186
  ),
178
- 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(
179
- j,
187
+ s && /* @__PURE__ */ t.createElement("div", { className: "tw-flex tw-flex-row-reverse tw-gap-x-1 tw-mt-4" }, s.length > 0 && /* @__PURE__ */ t.createElement(
188
+ Y,
180
189
  {
181
- style: q.Default,
182
- emphasis: D.Strong,
190
+ style: j.Default,
191
+ emphasis: q.Strong,
183
192
  size: G.Small,
184
- onClick: r[0].action
193
+ onClick: s[0].action,
194
+ disabled: a
185
195
  },
186
- r[0].label
187
- )), r.length === 2 && /* @__PURE__ */ t.createElement("div", { onBlur: () => o(!1) }, /* @__PURE__ */ t.createElement(
188
- j,
196
+ s[0].label
197
+ ), s.length === 2 && /* @__PURE__ */ t.createElement(
198
+ Y,
189
199
  {
190
- style: q.Default,
191
- emphasis: D.Default,
200
+ style: j.Default,
201
+ emphasis: q.Default,
192
202
  size: G.Small,
193
- onClick: r[1].action
203
+ onClick: s[1].action,
204
+ disabled: a
194
205
  },
195
- r[1].label
196
- )))
206
+ s[1].label
207
+ ))
197
208
  ),
198
209
  /* @__PURE__ */ t.createElement("div", { "aria-hidden": "true" }, /* @__PURE__ */ t.createElement(
199
210
  "div",
200
211
  {
201
212
  "data-test-id": "popover-arrow",
202
- "data-popper-arrow": u,
203
- ref: re,
213
+ "data-popper-arrow": v,
214
+ ref: se,
204
215
  style: w.styles.arrow,
205
- className: n([
206
- 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",
207
- u && ae
216
+ className: d([
217
+ v && "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",
218
+ v && ne
208
219
  ])
209
220
  }
210
221
  )),
211
222
  W
212
223
  ));
213
224
  };
214
- Se.displayName = "FondueTooltip";
225
+ xe.displayName = "FondueTooltip";
215
226
  export {
216
- Se as Tooltip,
217
- be as TooltipAlignment,
218
- ue as TooltipPosition
227
+ xe as Tooltip,
228
+ ve as TooltipAlignment,
229
+ Se as TooltipPosition
219
230
  };
220
231
  //# sourceMappingURL=Tooltip.es.js.map
@@ -1 +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-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 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-dark tw-bg-base tw-rounded-md tw-shadow-mid tw-text-text 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-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 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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"}
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-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 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 };\n\n useEffect(() => {\n setIsOpen(shouldPreventTooltipOpening ? false : open);\n }, [open, shouldPreventTooltipOpening]);\n\n const listenForEsc = useCallback(\n (event: KeyboardEvent) => {\n if (isOpen && event.key === 'Escape') {\n setIsOpen(false);\n }\n },\n [isOpen],\n );\n\n useLayoutEffect(() => {\n if (typeof popperInstance.update === 'function' && isOpen) {\n popperInstance.update();\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpen]);\n\n useEffect(() => {\n if (isOpen) {\n window.addEventListener('keydown', listenForEsc);\n } else {\n window.removeEventListener('keydown', listenForEsc);\n }\n\n return () => {\n window.removeEventListener('keydown', listenForEsc);\n };\n }, [listenForEsc, 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","handleCloseIfFocusedOutside","relatedTarget","element","openingEvents","useEffect","listenForEsc","useLayoutEffect","React","cloneElement","BrightHeader","IconSize","FOCUS_VISIBLE_STYLE","Button","ButtonStyle","ButtonEmphasis","ButtonSize"],"mappings":"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"}