@frontify/fondue 12.0.0-beta.124 → 12.0.0-beta.126
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.
- package/dist/components/Checkbox/Checkbox.es.js +30 -31
- package/dist/components/Checkbox/Checkbox.es.js.map +1 -1
- package/dist/components/TextInput/TextInput.es.js +61 -56
- package/dist/components/TextInput/TextInput.es.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.es.js +122 -116
- package/dist/components/Tooltip/Tooltip.es.js.map +1 -1
- package/dist/index.cjs.js +18 -18
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.umd.js +18 -18
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/utilities/validation.d.ts +2 -1
- package/dist/utilities/validation.es.js +8 -7
- package/dist/utilities/validation.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import { IconSize as
|
|
2
|
-
import { useLink as
|
|
1
|
+
import { IconSize as $ } from "../../foundation/Icon/IconSize.es.js";
|
|
2
|
+
import { useLink as me } from "@react-aria/link";
|
|
3
3
|
import { FOCUS_VISIBLE_STYLE as ce } from "../../utilities/focusStyle.es.js";
|
|
4
|
-
import { merge as
|
|
5
|
-
import t, { useState as
|
|
6
|
-
import { BrightHeader as be, brightHeaderArrowBackgroundColors as
|
|
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
7
|
import { usePopper as Ee } from "react-popper";
|
|
8
8
|
import { useMemoizedId as ge } from "../../hooks/useMemoizedId.es.js";
|
|
9
|
-
import { Button as
|
|
10
|
-
import { ButtonStyle as
|
|
11
|
-
const
|
|
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
|
+
const J = {
|
|
12
12
|
small: "tw-pt-3.5",
|
|
13
13
|
large: "tw-pt-4"
|
|
14
|
-
},
|
|
14
|
+
}, K = {
|
|
15
15
|
small: "tw-pb-3.5",
|
|
16
16
|
large: "tw-pb-4"
|
|
17
17
|
};
|
|
18
|
-
var Se = /* @__PURE__ */ ((e) => (e.Top = "Top", e.Right = "Right", e.Bottom = "Bottom", e.Left = "Left", e))(Se || {}),
|
|
19
|
-
const
|
|
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,197 +29,203 @@ const xe = {
|
|
|
29
29
|
["Right-Middle"]: "right",
|
|
30
30
|
["Bottom-Middle"]: "bottom",
|
|
31
31
|
["Left-Middle"]: "left"
|
|
32
|
-
},
|
|
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
|
|
37
|
+
return d([
|
|
38
38
|
"before:tw-border-t-0 before:tw-border-r-0 tw-left-[-5px]",
|
|
39
|
-
r &&
|
|
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
|
|
42
|
+
return d([
|
|
43
43
|
"before:tw-border-b-0 before:tw-border-r-0 tw-top-[-6px]",
|
|
44
|
-
r ?
|
|
44
|
+
r ? T[r] : "before:tw-dark before:tw-bg-base"
|
|
45
45
|
]);
|
|
46
46
|
case e.toString().includes("Left".toLowerCase()):
|
|
47
|
-
return
|
|
47
|
+
return d([
|
|
48
48
|
"before:tw-border-b-0 before:tw-border-l-0 tw-right-[-5px]",
|
|
49
|
-
r &&
|
|
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
|
-
},
|
|
54
|
+
}, xe = ({
|
|
55
55
|
content: e,
|
|
56
56
|
tooltipIcon: r,
|
|
57
|
-
heading:
|
|
58
|
-
headingIcon:
|
|
57
|
+
heading: n,
|
|
58
|
+
headingIcon: S,
|
|
59
59
|
linkUrl: c,
|
|
60
|
-
linkLabel:
|
|
61
|
-
brightHeader:
|
|
62
|
-
buttons:
|
|
63
|
-
children:
|
|
64
|
-
position:
|
|
60
|
+
linkLabel: Q,
|
|
61
|
+
brightHeader: p,
|
|
62
|
+
buttons: s,
|
|
63
|
+
children: W,
|
|
64
|
+
position: y = "Bottom",
|
|
65
65
|
alignment: B = "Middle",
|
|
66
|
-
withArrow:
|
|
67
|
-
flip:
|
|
66
|
+
withArrow: v,
|
|
67
|
+
flip: X = !0,
|
|
68
68
|
triggerElement: R,
|
|
69
|
-
hoverDelay:
|
|
69
|
+
hoverDelay: z = 200,
|
|
70
70
|
enterDelay: x = 0,
|
|
71
|
-
open:
|
|
72
|
-
disabled:
|
|
73
|
-
hidden:
|
|
71
|
+
open: M = !1,
|
|
72
|
+
disabled: Z = !1,
|
|
73
|
+
hidden: A = !1
|
|
74
74
|
}) => {
|
|
75
|
-
var
|
|
76
|
-
const [
|
|
75
|
+
var _;
|
|
76
|
+
const [L, P] = E(
|
|
77
77
|
null
|
|
78
|
-
),
|
|
79
|
-
() => c ||
|
|
80
|
-
[c,
|
|
81
|
-
),
|
|
82
|
-
placement:
|
|
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:
|
|
88
|
+
element: re
|
|
89
89
|
}
|
|
90
90
|
},
|
|
91
91
|
{
|
|
92
92
|
name: "offset",
|
|
93
93
|
options: {
|
|
94
|
-
offset: [0,
|
|
94
|
+
offset: [0, v ? 10 : 5]
|
|
95
95
|
}
|
|
96
96
|
},
|
|
97
97
|
{
|
|
98
98
|
name: "flip",
|
|
99
|
-
enabled:
|
|
99
|
+
enabled: X
|
|
100
100
|
}
|
|
101
101
|
]
|
|
102
|
-
}),
|
|
103
|
-
f.current && clearTimeout(f.current), f.current = setTimeout(() =>
|
|
104
|
-
}, [
|
|
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
105
|
if (f.current && clearTimeout(f.current), x) {
|
|
106
|
-
f.current = setTimeout(() =>
|
|
106
|
+
f.current = setTimeout(() => i(!0), x);
|
|
107
107
|
return;
|
|
108
108
|
}
|
|
109
|
-
|
|
110
|
-
}, [x]),
|
|
109
|
+
i(!0);
|
|
110
|
+
}, [x]), ie = g(
|
|
111
111
|
(o) => {
|
|
112
|
-
var
|
|
113
|
-
const
|
|
114
|
-
|
|
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
|
-
[
|
|
117
|
-
),
|
|
118
|
-
o.key === "Escape" && n(!1);
|
|
119
|
-
}, []), ie = E(
|
|
116
|
+
[F, L, h, u]
|
|
117
|
+
), de = g(
|
|
120
118
|
(o) => {
|
|
121
|
-
const { relatedTarget:
|
|
122
|
-
(!
|
|
119
|
+
const { relatedTarget: b } = o;
|
|
120
|
+
(!b || ![u, h].some((m) => m == null ? void 0 : m.contains(b))) && i(!1);
|
|
123
121
|
},
|
|
124
|
-
[
|
|
125
|
-
),
|
|
126
|
-
onMouseOver: (o) =>
|
|
127
|
-
onMouseLeave:
|
|
128
|
-
onFocus: () =>
|
|
129
|
-
onBlur:
|
|
130
|
-
onKeyDown: ne
|
|
122
|
+
[u, h]
|
|
123
|
+
), I = a ? {} : {
|
|
124
|
+
onMouseOver: (o) => ie(o.nativeEvent),
|
|
125
|
+
onMouseLeave: le,
|
|
126
|
+
onFocus: () => i(!0),
|
|
127
|
+
onBlur: de
|
|
131
128
|
};
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
}, [
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
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
|
|
140
146
|
})), /* @__PURE__ */ t.createElement(
|
|
141
147
|
"div",
|
|
142
148
|
{
|
|
143
|
-
ref:
|
|
144
|
-
"aria-hidden":
|
|
145
|
-
className:
|
|
149
|
+
ref: te,
|
|
150
|
+
"aria-hidden": a,
|
|
151
|
+
className: d([
|
|
146
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]",
|
|
147
|
-
!
|
|
153
|
+
!l && "tw-opacity-0 tw-h-0 tw-w-0 tw-overflow-hidden"
|
|
148
154
|
]),
|
|
149
155
|
"data-test-id": "tooltip",
|
|
150
156
|
role: "tooltip",
|
|
151
|
-
id:
|
|
152
|
-
style:
|
|
153
|
-
...
|
|
154
|
-
...
|
|
157
|
+
id: O,
|
|
158
|
+
style: w.styles.popper,
|
|
159
|
+
...w.attributes.popper,
|
|
160
|
+
...I
|
|
155
161
|
},
|
|
156
|
-
|
|
162
|
+
p && /* @__PURE__ */ t.createElement(be, { headerStyle: p }),
|
|
157
163
|
/* @__PURE__ */ t.createElement(
|
|
158
164
|
"div",
|
|
159
165
|
{
|
|
160
|
-
className:
|
|
166
|
+
className: d([
|
|
161
167
|
"tw-px-4 tw-dark tw-bg-base tw-rounded-md tw-relative tw-z-[120000]",
|
|
162
|
-
|
|
163
|
-
c ?
|
|
168
|
+
U ? J.small : J.large,
|
|
169
|
+
c ? K.small : K.large
|
|
164
170
|
])
|
|
165
171
|
},
|
|
166
|
-
|
|
167
|
-
/* @__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:
|
|
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)),
|
|
168
174
|
c && /* @__PURE__ */ t.createElement(
|
|
169
175
|
"a",
|
|
170
176
|
{
|
|
171
|
-
...
|
|
177
|
+
...H,
|
|
172
178
|
"data-test-id": "tooltip-link",
|
|
173
|
-
ref:
|
|
179
|
+
ref: N,
|
|
174
180
|
href: c,
|
|
175
181
|
target: "_blank",
|
|
176
182
|
rel: "noopener noreferrer",
|
|
177
|
-
className:
|
|
183
|
+
className: d(["tw-text-xs tw-text-black-40 tw-underline tw-mt-1", ce])
|
|
178
184
|
},
|
|
179
|
-
|
|
185
|
+
Q ?? "Click here to learn more."
|
|
180
186
|
),
|
|
181
|
-
|
|
182
|
-
|
|
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,
|
|
183
189
|
{
|
|
184
|
-
style:
|
|
185
|
-
emphasis:
|
|
186
|
-
size:
|
|
187
|
-
onClick:
|
|
188
|
-
disabled:
|
|
190
|
+
style: j.Default,
|
|
191
|
+
emphasis: q.Strong,
|
|
192
|
+
size: G.Small,
|
|
193
|
+
onClick: s[0].action,
|
|
194
|
+
disabled: a
|
|
189
195
|
},
|
|
190
|
-
|
|
191
|
-
),
|
|
192
|
-
|
|
196
|
+
s[0].label
|
|
197
|
+
), s.length === 2 && /* @__PURE__ */ t.createElement(
|
|
198
|
+
Y,
|
|
193
199
|
{
|
|
194
|
-
style:
|
|
195
|
-
emphasis:
|
|
196
|
-
size:
|
|
197
|
-
onClick:
|
|
198
|
-
disabled:
|
|
200
|
+
style: j.Default,
|
|
201
|
+
emphasis: q.Default,
|
|
202
|
+
size: G.Small,
|
|
203
|
+
onClick: s[1].action,
|
|
204
|
+
disabled: a
|
|
199
205
|
},
|
|
200
|
-
|
|
206
|
+
s[1].label
|
|
201
207
|
))
|
|
202
208
|
),
|
|
203
209
|
/* @__PURE__ */ t.createElement("div", { "aria-hidden": "true" }, /* @__PURE__ */ t.createElement(
|
|
204
210
|
"div",
|
|
205
211
|
{
|
|
206
212
|
"data-test-id": "popover-arrow",
|
|
207
|
-
"data-popper-arrow":
|
|
208
|
-
ref:
|
|
209
|
-
style:
|
|
210
|
-
className:
|
|
211
|
-
|
|
212
|
-
|
|
213
|
+
"data-popper-arrow": v,
|
|
214
|
+
ref: se,
|
|
215
|
+
style: w.styles.arrow,
|
|
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
|
|
213
219
|
])
|
|
214
220
|
}
|
|
215
221
|
)),
|
|
216
|
-
|
|
222
|
+
W
|
|
217
223
|
));
|
|
218
224
|
};
|
|
219
|
-
|
|
225
|
+
xe.displayName = "FondueTooltip";
|
|
220
226
|
export {
|
|
221
|
-
|
|
222
|
-
|
|
227
|
+
xe as Tooltip,
|
|
228
|
+
ve as TooltipAlignment,
|
|
223
229
|
Se as TooltipPosition
|
|
224
230
|
};
|
|
225
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 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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"}
|
|
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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"}
|