@mieweb/ui 0.8.0-dev.22 → 0.8.0-dev.24
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/Animated-Cs-naa2g.d.cts +175 -0
- package/dist/Animated-Cs-naa2g.d.ts +175 -0
- package/dist/brands/index.cjs +7 -7
- package/dist/brands/index.js +2 -2
- package/dist/{chunk-YIOZQEMV.cjs → chunk-3LHICE4I.cjs} +3 -3
- package/dist/{chunk-YIOZQEMV.cjs.map → chunk-3LHICE4I.cjs.map} +1 -1
- package/dist/{chunk-DWRIU4MW.js → chunk-3RB35GYK.js} +3 -3
- package/dist/{chunk-DWRIU4MW.js.map → chunk-3RB35GYK.js.map} +1 -1
- package/dist/{chunk-BT7SXNZU.cjs → chunk-4SM3I7WE.cjs} +3 -3
- package/dist/{chunk-BT7SXNZU.cjs.map → chunk-4SM3I7WE.cjs.map} +1 -1
- package/dist/{chunk-JWB4UA4J.cjs → chunk-5BVFVXHN.cjs} +197 -147
- package/dist/chunk-5BVFVXHN.cjs.map +1 -0
- package/dist/{chunk-62FT5JRH.js → chunk-5H7SAEQO.js} +4 -4
- package/dist/{chunk-62FT5JRH.js.map → chunk-5H7SAEQO.js.map} +1 -1
- package/dist/{chunk-KRYJJMYN.js → chunk-6SAYPXHX.js} +3 -3
- package/dist/{chunk-KRYJJMYN.js.map → chunk-6SAYPXHX.js.map} +1 -1
- package/dist/{chunk-KTJETOOH.cjs → chunk-6XDPJWSC.cjs} +36 -36
- package/dist/{chunk-KTJETOOH.cjs.map → chunk-6XDPJWSC.cjs.map} +1 -1
- package/dist/{chunk-WUKXQZZR.cjs → chunk-7KN6J7XV.cjs} +8 -8
- package/dist/{chunk-WUKXQZZR.cjs.map → chunk-7KN6J7XV.cjs.map} +1 -1
- package/dist/chunk-BN75TLUN.cjs +163 -0
- package/dist/chunk-BN75TLUN.cjs.map +1 -0
- package/dist/{chunk-WWJIW2IH.cjs → chunk-BVMABVC4.cjs} +3 -3
- package/dist/{chunk-WWJIW2IH.cjs.map → chunk-BVMABVC4.cjs.map} +1 -1
- package/dist/{chunk-RS5VA6QU.cjs → chunk-C3DUS2VE.cjs} +3 -3
- package/dist/{chunk-RS5VA6QU.cjs.map → chunk-C3DUS2VE.cjs.map} +1 -1
- package/dist/{chunk-VIE7UI2R.cjs → chunk-CXDMZT45.cjs} +4 -2
- package/dist/chunk-CXDMZT45.cjs.map +1 -0
- package/dist/{chunk-TXRQQMG5.js → chunk-CYMZ2QS5.js} +2 -2
- package/dist/{chunk-TXRQQMG5.js.map → chunk-CYMZ2QS5.js.map} +1 -1
- package/dist/{chunk-KY2CZK5F.js → chunk-D25WH7MH.js} +2 -2
- package/dist/{chunk-KY2CZK5F.js.map → chunk-D25WH7MH.js.map} +1 -1
- package/dist/{chunk-ATOWMVZH.js → chunk-DFYMIRMW.js} +3 -3
- package/dist/{chunk-ATOWMVZH.js.map → chunk-DFYMIRMW.js.map} +1 -1
- package/dist/{chunk-PDS7OM73.js → chunk-DGRXAIWK.js} +4 -2
- package/dist/chunk-DGRXAIWK.js.map +1 -0
- package/dist/{chunk-JHR4PNUA.cjs → chunk-FQBTGS3E.cjs} +5 -5
- package/dist/{chunk-JHR4PNUA.cjs.map → chunk-FQBTGS3E.cjs.map} +1 -1
- package/dist/{chunk-W3N5XENB.cjs → chunk-FUFBRKOG.cjs} +24 -24
- package/dist/{chunk-W3N5XENB.cjs.map → chunk-FUFBRKOG.cjs.map} +1 -1
- package/dist/{chunk-UEDTZYGI.cjs → chunk-H4AVMUOC.cjs} +3 -3
- package/dist/{chunk-UEDTZYGI.cjs.map → chunk-H4AVMUOC.cjs.map} +1 -1
- package/dist/{chunk-X5ZPYYMS.js → chunk-I3DQXUSC.js} +3 -3
- package/dist/{chunk-X5ZPYYMS.js.map → chunk-I3DQXUSC.js.map} +1 -1
- package/dist/{chunk-LZVPVY5P.js → chunk-KU3XRHWA.js} +3 -3
- package/dist/{chunk-LZVPVY5P.js.map → chunk-KU3XRHWA.js.map} +1 -1
- package/dist/{chunk-P2VTQ5AR.cjs → chunk-L52N6BEN.cjs} +39 -23
- package/dist/chunk-L52N6BEN.cjs.map +1 -0
- package/dist/{chunk-SRMTRD7F.js → chunk-L5W7TJQ5.js} +3 -3
- package/dist/{chunk-SRMTRD7F.js.map → chunk-L5W7TJQ5.js.map} +1 -1
- package/dist/{chunk-Z5KFXHDP.cjs → chunk-MM7QKUE3.cjs} +5 -5
- package/dist/{chunk-Z5KFXHDP.cjs.map → chunk-MM7QKUE3.cjs.map} +1 -1
- package/dist/{chunk-FJ7YPVKV.js → chunk-MUIDWFYJ.js} +3 -3
- package/dist/{chunk-FJ7YPVKV.js.map → chunk-MUIDWFYJ.js.map} +1 -1
- package/dist/{chunk-L2LH4CEN.js → chunk-MXQ7J4BB.js} +3 -3
- package/dist/{chunk-L2LH4CEN.js.map → chunk-MXQ7J4BB.js.map} +1 -1
- package/dist/{chunk-R4E6DMZS.js → chunk-O6GJ4IYS.js} +195 -147
- package/dist/chunk-O6GJ4IYS.js.map +1 -0
- package/dist/{chunk-MX46D4UJ.cjs → chunk-O7XHHTTP.cjs} +2 -2
- package/dist/{chunk-MX46D4UJ.cjs.map → chunk-O7XHHTTP.cjs.map} +1 -1
- package/dist/{chunk-7IBZA7G6.js → chunk-OAZUDUGX.js} +4 -4
- package/dist/{chunk-7IBZA7G6.js.map → chunk-OAZUDUGX.js.map} +1 -1
- package/dist/{chunk-NFKX6QJP.cjs → chunk-OCV33S5Q.cjs} +3 -3
- package/dist/{chunk-NFKX6QJP.cjs.map → chunk-OCV33S5Q.cjs.map} +1 -1
- package/dist/{chunk-334BUQMR.js → chunk-ODYQYLO2.js} +7 -7
- package/dist/{chunk-334BUQMR.js.map → chunk-ODYQYLO2.js.map} +1 -1
- package/dist/{chunk-FK2WTX7D.js → chunk-OHDIJOGG.js} +3 -3
- package/dist/{chunk-FK2WTX7D.js.map → chunk-OHDIJOGG.js.map} +1 -1
- package/dist/{chunk-GQVL2JKQ.cjs → chunk-OHKO5THF.cjs} +3 -3
- package/dist/{chunk-GQVL2JKQ.cjs.map → chunk-OHKO5THF.cjs.map} +1 -1
- package/dist/{chunk-LMBXJZLG.js → chunk-ON4JULCA.js} +3 -3
- package/dist/{chunk-LMBXJZLG.js.map → chunk-ON4JULCA.js.map} +1 -1
- package/dist/{chunk-57DPXKUV.js → chunk-ONNY7UO4.js} +4 -4
- package/dist/{chunk-57DPXKUV.js.map → chunk-ONNY7UO4.js.map} +1 -1
- package/dist/{chunk-KFEN2SRZ.js → chunk-PHK4XBO5.js} +3 -3
- package/dist/{chunk-KFEN2SRZ.js.map → chunk-PHK4XBO5.js.map} +1 -1
- package/dist/{chunk-XMCIXHGH.js → chunk-Q7G56ZIO.js} +39 -23
- package/dist/chunk-Q7G56ZIO.js.map +1 -0
- package/dist/{chunk-T5BBZQ66.js → chunk-QAKASRE6.js} +3 -3
- package/dist/{chunk-T5BBZQ66.js.map → chunk-QAKASRE6.js.map} +1 -1
- package/dist/{chunk-UBOVDAD7.js → chunk-QAQOCS2J.js} +3 -3
- package/dist/{chunk-UBOVDAD7.js.map → chunk-QAQOCS2J.js.map} +1 -1
- package/dist/{chunk-GLEIVJQB.cjs → chunk-QKAYRHWP.cjs} +9 -9
- package/dist/{chunk-GLEIVJQB.cjs.map → chunk-QKAYRHWP.cjs.map} +1 -1
- package/dist/{chunk-JWTCEWQ4.cjs → chunk-SNEQXSC5.cjs} +2 -2
- package/dist/{chunk-JWTCEWQ4.cjs.map → chunk-SNEQXSC5.cjs.map} +1 -1
- package/dist/{chunk-ZSGEGISB.cjs → chunk-SRA2L3SQ.cjs} +4 -4
- package/dist/{chunk-ZSGEGISB.cjs.map → chunk-SRA2L3SQ.cjs.map} +1 -1
- package/dist/{chunk-3SHLOF4V.cjs → chunk-VTR2KGLY.cjs} +9 -9
- package/dist/{chunk-3SHLOF4V.cjs.map → chunk-VTR2KGLY.cjs.map} +1 -1
- package/dist/chunk-WYMO3IIK.js +136 -0
- package/dist/chunk-WYMO3IIK.js.map +1 -0
- package/dist/{chunk-CFI3TQMA.cjs → chunk-X5QRRMGB.cjs} +3 -3
- package/dist/{chunk-CFI3TQMA.cjs.map → chunk-X5QRRMGB.cjs.map} +1 -1
- package/dist/{chunk-SH6B4MG5.js → chunk-XBXDUAIM.js} +4 -4
- package/dist/{chunk-SH6B4MG5.js.map → chunk-XBXDUAIM.js.map} +1 -1
- package/dist/{chunk-K5GQPTTA.cjs → chunk-XEEVDZDK.cjs} +3 -3
- package/dist/{chunk-K5GQPTTA.cjs.map → chunk-XEEVDZDK.cjs.map} +1 -1
- package/dist/{chunk-GXODR6V4.js → chunk-XOIIUO6O.js} +3 -3
- package/dist/{chunk-GXODR6V4.js.map → chunk-XOIIUO6O.js.map} +1 -1
- package/dist/{chunk-AHHFFXJR.cjs → chunk-XTHMC76F.cjs} +3 -3
- package/dist/{chunk-AHHFFXJR.cjs.map → chunk-XTHMC76F.cjs.map} +1 -1
- package/dist/{chunk-64SSWBJN.cjs → chunk-YJP6DUFO.cjs} +6 -6
- package/dist/{chunk-64SSWBJN.cjs.map → chunk-YJP6DUFO.cjs.map} +1 -1
- package/dist/components/Alert/index.d.cts +1 -1
- package/dist/components/Alert/index.d.ts +1 -1
- package/dist/components/AlertDialog/index.cjs +5 -4
- package/dist/components/AlertDialog/index.js +4 -3
- package/dist/components/Autocomplete/index.cjs +3 -3
- package/dist/components/Autocomplete/index.js +2 -2
- package/dist/components/Badge/index.d.cts +1 -1
- package/dist/components/Badge/index.d.ts +1 -1
- package/dist/components/Card/index.d.cts +2 -2
- package/dist/components/Card/index.d.ts +2 -2
- package/dist/components/CountryCodeDropdown/index.cjs +5 -5
- package/dist/components/CountryCodeDropdown/index.js +2 -2
- package/dist/components/CustomizableDashboard/index.cjs +10 -10
- package/dist/components/CustomizableDashboard/index.js +3 -3
- package/dist/components/DateInput/index.cjs +4 -4
- package/dist/components/DateInput/index.js +3 -3
- package/dist/components/Dropdown/index.cjs +9 -9
- package/dist/components/Dropdown/index.js +2 -2
- package/dist/components/GlossaryTooltip/index.cjs +3 -3
- package/dist/components/GlossaryTooltip/index.js +2 -2
- package/dist/components/KeyboardShortcutsOverlay/index.cjs +6 -5
- package/dist/components/KeyboardShortcutsOverlay/index.js +4 -3
- package/dist/components/Markdown/index.cjs +10 -10
- package/dist/components/Markdown/index.js +2 -2
- package/dist/components/MediaEditor/index.cjs +11 -10
- package/dist/components/MediaEditor/index.js +6 -5
- package/dist/components/MediaPlayer/index.cjs +1 -1
- package/dist/components/MediaPlayer/index.js +1 -1
- package/dist/components/Modal/index.cjs +11 -10
- package/dist/components/Modal/index.d.cts +1 -1
- package/dist/components/Modal/index.d.ts +1 -1
- package/dist/components/Modal/index.js +3 -2
- package/dist/components/Pagination/index.d.cts +1 -1
- package/dist/components/Pagination/index.d.ts +1 -1
- package/dist/components/PhoneInput/index.cjs +4 -4
- package/dist/components/PhoneInput/index.js +2 -2
- package/dist/components/Progress/index.d.cts +1 -1
- package/dist/components/Progress/index.d.ts +1 -1
- package/dist/components/RecordButton/index.d.cts +1 -1
- package/dist/components/RecordButton/index.d.ts +1 -1
- package/dist/components/RichTextEditor/index.cjs +7 -7
- package/dist/components/RichTextEditor/index.js +4 -4
- package/dist/components/SectionSpyNav/index.cjs +3 -3
- package/dist/components/SectionSpyNav/index.js +2 -2
- package/dist/components/Select/index.cjs +4 -4
- package/dist/components/Select/index.js +2 -2
- package/dist/components/Sheet/index.cjs +11 -11
- package/dist/components/Sheet/index.js +2 -2
- package/dist/components/Slider/index.d.cts +2 -2
- package/dist/components/Slider/index.d.ts +2 -2
- package/dist/components/SourceTip/index.cjs +3 -3
- package/dist/components/SourceTip/index.js +2 -2
- package/dist/components/SuperChat/index.cjs +10 -10
- package/dist/components/SuperChat/index.js +4 -4
- package/dist/components/SuperChat/plugins/index.cjs +4 -4
- package/dist/components/SuperChat/plugins/index.js +3 -3
- package/dist/components/Text/index.d.cts +1 -1
- package/dist/components/Text/index.d.ts +1 -1
- package/dist/components/ThemeProvider/index.cjs +9 -9
- package/dist/components/ThemeProvider/index.d.cts +1 -1
- package/dist/components/ThemeProvider/index.d.ts +1 -1
- package/dist/components/ThemeProvider/index.js +3 -3
- package/dist/components/Toggle/index.d.cts +1 -1
- package/dist/components/Toggle/index.d.ts +1 -1
- package/dist/components/Tooltip/index.cjs +3 -3
- package/dist/components/Tooltip/index.js +2 -2
- package/dist/esheet.cjs +12 -11
- package/dist/esheet.cjs.map +1 -1
- package/dist/esheet.js +9 -8
- package/dist/esheet.js.map +1 -1
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.js +1 -1
- package/dist/index.cjs +722 -620
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +38 -24
- package/dist/index.d.ts +38 -24
- package/dist/index.js +216 -129
- package/dist/index.js.map +1 -1
- package/dist/motion.cjs +87 -0
- package/dist/motion.cjs.map +1 -0
- package/dist/motion.d.cts +52 -0
- package/dist/motion.d.ts +52 -0
- package/dist/motion.js +50 -0
- package/dist/motion.js.map +1 -0
- package/dist/styles.css +1 -1
- package/dist/tailwind-preset.cjs +4 -4
- package/dist/tailwind-preset.js +1 -1
- package/package.json +16 -1
- package/dist/chunk-JWB4UA4J.cjs.map +0 -1
- package/dist/chunk-P2VTQ5AR.cjs.map +0 -1
- package/dist/chunk-PDS7OM73.js.map +0 -1
- package/dist/chunk-R4E6DMZS.js.map +0 -1
- package/dist/chunk-VIE7UI2R.cjs.map +0 -1
- package/dist/chunk-XMCIXHGH.js.map +0 -1
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var chunkBN75TLUN_cjs = require('./chunk-BN75TLUN.cjs');
|
|
4
|
+
var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
|
|
3
5
|
var chunkNNEFAUHV_cjs = require('./chunk-NNEFAUHV.cjs');
|
|
4
6
|
var chunkFHY3K6PL_cjs = require('./chunk-FHY3K6PL.cjs');
|
|
5
|
-
var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
|
|
6
7
|
var chunkSCV7C55E_cjs = require('./chunk-SCV7C55E.cjs');
|
|
7
8
|
var React = require('react');
|
|
8
9
|
var classVarianceAuthority = require('class-variance-authority');
|
|
@@ -32,17 +33,14 @@ var scrollLockState = {
|
|
|
32
33
|
count: 0,
|
|
33
34
|
originalOverflow: null};
|
|
34
35
|
var modalOverlayVariants = classVarianceAuthority.cva(
|
|
35
|
-
[
|
|
36
|
-
"fixed inset-0",
|
|
37
|
-
"bg-black/50 backdrop-blur-sm",
|
|
38
|
-
"data-[state=open]:animate-in data-[state=open]:fade-in-0",
|
|
39
|
-
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0"
|
|
40
|
-
],
|
|
36
|
+
["fixed inset-0", "bg-black/50 backdrop-blur-sm"],
|
|
41
37
|
{
|
|
42
38
|
variants: {},
|
|
43
39
|
defaultVariants: {}
|
|
44
40
|
}
|
|
45
41
|
);
|
|
42
|
+
var MODAL_OVERLAY_FALLBACK_ANIMATION = "animate-in fade-in-0";
|
|
43
|
+
var MODAL_CONTENT_FALLBACK_ANIMATION = "duration-200 animate-in fade-in-0 zoom-in-95";
|
|
46
44
|
var modalContentVariants = classVarianceAuthority.cva(
|
|
47
45
|
[
|
|
48
46
|
"relative w-full bg-card text-card-foreground",
|
|
@@ -56,10 +54,7 @@ var modalContentVariants = classVarianceAuthority.cva(
|
|
|
56
54
|
// If a <form> is used as a direct child (wrapping ModalBody + ModalFooter),
|
|
57
55
|
// make it participate in the flex column layout so overflow constraints work.
|
|
58
56
|
"[&>form]:flex [&>form]:flex-col [&>form]:flex-1 [&>form]:min-h-0",
|
|
59
|
-
"focus:outline-none"
|
|
60
|
-
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
61
|
-
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
62
|
-
"duration-200"
|
|
57
|
+
"focus:outline-none"
|
|
63
58
|
],
|
|
64
59
|
{
|
|
65
60
|
variants: {
|
|
@@ -94,7 +89,23 @@ function Modal({
|
|
|
94
89
|
}) {
|
|
95
90
|
const generatedId = React__namespace.useId();
|
|
96
91
|
const modalId = id || generatedId;
|
|
97
|
-
const
|
|
92
|
+
const runtime = chunkBN75TLUN_cjs.useMotionRuntime();
|
|
93
|
+
const animatesExit = Boolean(runtime?.enabled);
|
|
94
|
+
const [isExiting, setIsExiting] = React__namespace.useState(false);
|
|
95
|
+
const [prevOpen, setPrevOpen] = React__namespace.useState(open);
|
|
96
|
+
if (prevOpen !== open) {
|
|
97
|
+
setPrevOpen(open);
|
|
98
|
+
if (!open && animatesExit) {
|
|
99
|
+
setIsExiting(true);
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
React__namespace.useEffect(() => {
|
|
103
|
+
if (!animatesExit && isExiting) {
|
|
104
|
+
setIsExiting(false);
|
|
105
|
+
}
|
|
106
|
+
}, [animatesExit, isExiting]);
|
|
107
|
+
const isGuarded = open || isExiting;
|
|
108
|
+
const focusTrapRef = chunkNNEFAUHV_cjs.useFocusTrap(isGuarded);
|
|
98
109
|
chunkFHY3K6PL_cjs.useEscapeKey(() => {
|
|
99
110
|
if (closeOnEscape && open) {
|
|
100
111
|
onOpenChange(false);
|
|
@@ -109,7 +120,7 @@ function Modal({
|
|
|
109
120
|
[closeOnOverlayClick, onOpenChange]
|
|
110
121
|
);
|
|
111
122
|
React__namespace.useEffect(() => {
|
|
112
|
-
if (!
|
|
123
|
+
if (!isGuarded || chunkSCV7C55E_cjs.isStorybookDocsMode()) {
|
|
113
124
|
return void 0;
|
|
114
125
|
}
|
|
115
126
|
scrollLockState.count++;
|
|
@@ -124,18 +135,20 @@ function Modal({
|
|
|
124
135
|
scrollLockState.originalOverflow = null;
|
|
125
136
|
}
|
|
126
137
|
};
|
|
127
|
-
}, [
|
|
128
|
-
if (!open) return null;
|
|
138
|
+
}, [isGuarded]);
|
|
129
139
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
130
140
|
ModalContext.Provider,
|
|
131
141
|
{
|
|
132
142
|
value: { onClose: () => onOpenChange(false), modalId },
|
|
133
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed inset-0 z-50", children: [
|
|
143
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(chunkBN75TLUN_cjs.AnimatedPresence, { onExitComplete: () => setIsExiting(false), children: open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed inset-0 z-50", children: [
|
|
134
144
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
135
|
-
|
|
145
|
+
chunkBN75TLUN_cjs.Animated,
|
|
136
146
|
{
|
|
147
|
+
preset: "overlay",
|
|
148
|
+
mode: "presence",
|
|
137
149
|
className: chunkS5RVSXDV_cjs.cn(modalOverlayVariants()),
|
|
138
|
-
|
|
150
|
+
fallbackClassName: MODAL_OVERLAY_FALLBACK_ANIMATION,
|
|
151
|
+
"data-state": "open",
|
|
139
152
|
"aria-hidden": "true"
|
|
140
153
|
}
|
|
141
154
|
),
|
|
@@ -145,9 +158,11 @@ function Modal({
|
|
|
145
158
|
className: "flex min-h-full items-center justify-center p-0 sm:p-4",
|
|
146
159
|
onClick: handleOverlayClick,
|
|
147
160
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
148
|
-
|
|
161
|
+
chunkBN75TLUN_cjs.Animated,
|
|
149
162
|
{
|
|
150
163
|
ref: focusTrapRef,
|
|
164
|
+
preset: "modalContent",
|
|
165
|
+
mode: "presence",
|
|
151
166
|
role: "dialog",
|
|
152
167
|
"aria-modal": "true",
|
|
153
168
|
"aria-label": ariaLabel,
|
|
@@ -155,16 +170,17 @@ function Modal({
|
|
|
155
170
|
"aria-describedby": ariaDescribedBy,
|
|
156
171
|
id: modalId,
|
|
157
172
|
tabIndex: -1,
|
|
158
|
-
"data-state":
|
|
173
|
+
"data-state": "open",
|
|
159
174
|
"data-slot": "modal",
|
|
160
175
|
className: chunkS5RVSXDV_cjs.cn(modalContentVariants({ size }), className),
|
|
176
|
+
fallbackClassName: MODAL_CONTENT_FALLBACK_ANIMATION,
|
|
161
177
|
onClick: (e) => e.stopPropagation(),
|
|
162
178
|
children
|
|
163
179
|
}
|
|
164
180
|
)
|
|
165
181
|
}
|
|
166
182
|
) })
|
|
167
|
-
] })
|
|
183
|
+
] }, "modal-root") })
|
|
168
184
|
}
|
|
169
185
|
);
|
|
170
186
|
}
|
|
@@ -307,5 +323,5 @@ exports.ModalHeader = ModalHeader;
|
|
|
307
323
|
exports.ModalTitle = ModalTitle;
|
|
308
324
|
exports.modalContentVariants = modalContentVariants;
|
|
309
325
|
exports.modalOverlayVariants = modalOverlayVariants;
|
|
310
|
-
//# sourceMappingURL=chunk-
|
|
311
|
-
//# sourceMappingURL=chunk-
|
|
326
|
+
//# sourceMappingURL=chunk-L52N6BEN.cjs.map
|
|
327
|
+
//# sourceMappingURL=chunk-L52N6BEN.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Modal/Modal.tsx"],"names":["cva","React","useMotionRuntime","useFocusTrap","useEscapeKey","isStorybookDocsMode","jsx","AnimatedPresence","jsxs","Animated","cn"],"mappings":"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","file":"chunk-L52N6BEN.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { isStorybookDocsMode } from '../../utils/environment';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { Animated, AnimatedPresence, useMotionRuntime } from '../../motion';\n\n/**\n * Modal scroll lock state manager.\n * Uses a singleton pattern with ref-like storage to track open modals\n * and manage body scroll locking across multiple modal instances.\n * Includes reset capability for testing environments.\n */\nconst scrollLockState = {\n count: 0,\n originalOverflow: null as string | null,\n reset() {\n this.count = 0;\n this.originalOverflow = null;\n },\n};\n\n// Export for testing environments\nexport const __resetScrollLockState = () => scrollLockState.reset();\n\nconst modalOverlayVariants = cva(\n ['fixed inset-0', 'bg-black/50 backdrop-blur-sm'],\n {\n variants: {},\n defaultVariants: {},\n }\n);\n\n/**\n * Entry keyframes for the CSS path only.\n *\n * Kept out of the `cva` base so they never run alongside the motion runtime —\n * both drive opacity and transform, and applied together they fight.\n *\n * Entry only: there is no CSS exit. The component unmounts the moment `open`\n * flips to false, so `data-state` is hardcoded `\"open\"` and closed keyframes\n * would be unreachable dead code. That missing exit is the clearest thing the\n * motion opt-in buys back.\n */\nconst MODAL_OVERLAY_FALLBACK_ANIMATION = 'animate-in fade-in-0';\n\nconst MODAL_CONTENT_FALLBACK_ANIMATION =\n 'duration-200 animate-in fade-in-0 zoom-in-95';\n\nconst modalContentVariants = cva(\n [\n 'relative w-full bg-card text-card-foreground',\n 'border border-border shadow-lg',\n // Full-screen on mobile, rounded on larger screens\n 'rounded-none sm:rounded-xl',\n 'flex flex-col',\n // Full viewport height on mobile, constrained on larger screens\n 'max-h-dvh sm:max-h-[calc(100dvh-2rem)]',\n 'min-h-dvh sm:min-h-0',\n // If a <form> is used as a direct child (wrapping ModalBody + ModalFooter),\n // make it participate in the flex column layout so overflow constraints work.\n '[&>form]:flex [&>form]:flex-col [&>form]:flex-1 [&>form]:min-h-0',\n 'focus:outline-none',\n ],\n {\n variants: {\n size: {\n sm: 'sm:max-w-sm',\n md: 'sm:max-w-md',\n lg: 'sm:max-w-lg',\n xl: 'sm:max-w-xl',\n '2xl': 'sm:max-w-2xl',\n '3xl': 'sm:max-w-3xl',\n '4xl': 'sm:max-w-4xl',\n full: 'max-w-[calc(100vw-2rem)]',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n }\n);\n\nexport interface ModalProps extends VariantProps<typeof modalContentVariants> {\n /** Whether the modal is open */\n open: boolean;\n /** Callback when the modal should close */\n onOpenChange: (open: boolean) => void;\n /** Modal content */\n children: React.ReactNode;\n /** Whether to close when clicking the overlay */\n closeOnOverlayClick?: boolean;\n /** Whether to close when pressing Escape */\n closeOnEscape?: boolean;\n /** Additional class name for the modal content */\n className?: string;\n /** ID for the modal, used for accessibility */\n id?: string;\n /** Accessible label for the modal */\n 'aria-label'?: string;\n /** ID of the element that labels the modal */\n 'aria-labelledby'?: string;\n /** ID of the element that describes the modal */\n 'aria-describedby'?: string;\n}\n\n/**\n * An accessible modal/dialog component.\n *\n * @example\n * ```tsx\n * <Modal open={isOpen} onOpenChange={setIsOpen} size=\"lg\">\n * <ModalHeader>\n * <ModalTitle>Confirm Action</ModalTitle>\n * <ModalClose />\n * </ModalHeader>\n * <ModalBody>\n * Are you sure you want to continue?\n * </ModalBody>\n * <ModalFooter>\n * <Button variant=\"secondary\" onClick={() => setIsOpen(false)}>Cancel</Button>\n * <Button onClick={handleConfirm}>Confirm</Button>\n * </ModalFooter>\n * </Modal>\n * ```\n */\nfunction Modal({\n open,\n onOpenChange,\n children,\n size,\n closeOnOverlayClick = true,\n closeOnEscape = true,\n className,\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n}: ModalProps) {\n const generatedId = React.useId();\n const modalId = id || generatedId;\n\n /*\n * The dialog outlives `open`.\n *\n * With a motion runtime, `AnimatedPresence` keeps the subtree on screen until\n * its exit animation finishes. Guards keyed on `open` alone would therefore\n * release while a `role=\"dialog\" aria-modal=\"true\"` element is still visible:\n * Tab could reach the page behind it and body scrolling would resume under\n * it. `isGuarded` stays true until presence reports the exit is done.\n *\n * Only tracked when a runtime is actually animating. Without one the subtree\n * unmounts on the same frame, and `onExitComplete` would never fire to clear\n * the flag.\n */\n const runtime = useMotionRuntime();\n const animatesExit = Boolean(runtime?.enabled);\n const [isExiting, setIsExiting] = React.useState(false);\n const [prevOpen, setPrevOpen] = React.useState(open);\n\n // Derived synchronously during render (React's \"adjust state when props\n // change\" pattern), not in an effect. An effect runs after commit, which\n // would leave one committed frame with the dialog still on screen but\n // `isGuarded` false — the focus trap would tear down, restore focus, then\n // re-arm and yank focus into the closing dialog, with the scroll lock\n // flickering alongside. Setting state during render re-renders before\n // commit, so the guards never observe the gap.\n if (prevOpen !== open) {\n setPrevOpen(open);\n if (!open && animatesExit) {\n setIsExiting(true);\n }\n }\n\n // If the runtime disappears or is disabled mid-exit, `onExitComplete` will\n // never fire — the subtree is already gone. Without this reset the guards\n // (and the body scroll lock with them) would be held forever.\n React.useEffect(() => {\n if (!animatesExit && isExiting) {\n setIsExiting(false);\n }\n }, [animatesExit, isExiting]);\n\n const isGuarded = open || isExiting;\n\n // Focus trap. Typed as `HTMLElement` because the content element is supplied\n // by `Animated`, which is element-agnostic.\n const focusTrapRef = useFocusTrap<HTMLElement>(isGuarded);\n\n // Handle escape key\n useEscapeKey(() => {\n if (closeOnEscape && open) {\n onOpenChange(false);\n }\n }, open);\n\n // Handle overlay click\n const handleOverlayClick = React.useCallback(\n (e: React.MouseEvent) => {\n if (closeOnOverlayClick && e.target === e.currentTarget) {\n onOpenChange(false);\n }\n },\n [closeOnOverlayClick, onOpenChange]\n );\n\n // Prevent body scroll while the modal is on screen (handles multiple modals).\n // Keyed on `isGuarded`, not `open`, so scrolling does not resume underneath a\n // dialog that is still animating out.\n // Skip scroll lock in Storybook docs mode where multiple stories render inline\n React.useEffect(() => {\n // Skip scroll lock entirely in Storybook docs mode\n if (!isGuarded || isStorybookDocsMode()) {\n return undefined;\n }\n\n scrollLockState.count++;\n // Only capture and set overflow when first modal opens\n if (scrollLockState.count === 1) {\n scrollLockState.originalOverflow = document.body.style.overflow;\n document.body.style.overflow = 'hidden';\n }\n\n return () => {\n scrollLockState.count--;\n // Only restore overflow when last modal closes\n if (\n scrollLockState.count === 0 &&\n scrollLockState.originalOverflow !== null\n ) {\n document.body.style.overflow = scrollLockState.originalOverflow;\n scrollLockState.originalOverflow = null;\n }\n };\n }, [isGuarded]);\n\n return (\n <ModalContext.Provider\n value={{ onClose: () => onOpenChange(false), modalId }}\n >\n {/*\n The `open` check lives inside `AnimatedPresence` rather than as an early\n `return null` above. On the CSS path this is identical — the tree\n unmounts immediately. With a motion runtime the subtree is held on\n screen until the overlay and content finish their exit animations.\n */}\n <AnimatedPresence onExitComplete={() => setIsExiting(false)}>\n {open && (\n <div key=\"modal-root\" className=\"fixed inset-0 z-50\">\n {/* Overlay backdrop */}\n <Animated\n preset=\"overlay\"\n mode=\"presence\"\n className={cn(modalOverlayVariants())}\n fallbackClassName={MODAL_OVERLAY_FALLBACK_ANIMATION}\n data-state=\"open\"\n aria-hidden=\"true\"\n />\n {/* Scrollable centering container — click outside to close */}\n <div className=\"fixed inset-0 overflow-y-auto\">\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n <div\n className=\"flex min-h-full items-center justify-center p-0 sm:p-4\"\n onClick={handleOverlayClick}\n >\n {/* Content */}\n <Animated\n ref={focusTrapRef}\n preset=\"modalContent\"\n mode=\"presence\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy || `${modalId}-title`}\n aria-describedby={ariaDescribedBy}\n id={modalId}\n tabIndex={-1}\n data-state=\"open\"\n data-slot=\"modal\"\n className={cn(modalContentVariants({ size }), className)}\n fallbackClassName={MODAL_CONTENT_FALLBACK_ANIMATION}\n onClick={(e) => e.stopPropagation()}\n >\n {children}\n </Animated>\n </div>\n </div>\n </div>\n )}\n </AnimatedPresence>\n </ModalContext.Provider>\n );\n}\n\nModal.displayName = 'Modal';\n\n// ============================================================================\n// Modal Context\n// ============================================================================\n\ninterface ModalContextValue {\n onClose: () => void;\n modalId: string;\n}\n\nconst ModalContext = React.createContext<ModalContextValue | undefined>(\n undefined\n);\n\nfunction useModalContext() {\n const context = React.useContext(ModalContext);\n if (!context) {\n throw new Error('Modal components must be used within a Modal');\n }\n return context;\n}\n\n// ============================================================================\n// Modal Header\n// ============================================================================\n\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Header section of a Modal.\n */\nconst ModalHeader = React.forwardRef<HTMLDivElement, ModalHeaderProps>(\n ({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"modal-header\"\n className={cn(\n 'flex shrink-0 items-center justify-between',\n 'border-border border-b px-6 py-4',\n className\n )}\n {...props}\n />\n )\n);\n\nModalHeader.displayName = 'ModalHeader';\n\n// ============================================================================\n// Modal Title\n// ============================================================================\n\nexport type ModalTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\n\n/**\n * Title for a Modal.\n */\nconst ModalTitle = React.forwardRef<HTMLHeadingElement, ModalTitleProps>(\n ({ className, children, ...props }, ref) => {\n const { modalId } = useModalContext();\n return (\n <h2\n ref={ref}\n id={`${modalId}-title`}\n data-slot=\"modal-title\"\n className={cn(\n 'text-lg leading-none font-semibold tracking-tight',\n className\n )}\n {...props}\n >\n {children}\n </h2>\n );\n }\n);\n\nModalTitle.displayName = 'ModalTitle';\n\n// ============================================================================\n// Modal Close Button\n// ============================================================================\n\nexport type ModalCloseProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Close button for a Modal.\n */\nconst ModalClose = React.forwardRef<HTMLButtonElement, ModalCloseProps>(\n ({ className, children, onClick, ...props }, ref) => {\n const { onClose } = useModalContext();\n\n const handleClick = React.useCallback(\n (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n if (!e.defaultPrevented) {\n onClose();\n }\n },\n [onClick, onClose]\n );\n\n return (\n <button\n ref={ref}\n type=\"button\"\n onClick={handleClick}\n data-slot=\"modal-close\"\n className={cn(\n 'inline-flex h-8 w-8 items-center justify-center rounded-lg',\n 'text-muted-foreground hover:text-foreground',\n 'hover:bg-muted transition-colors',\n 'focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none',\n className\n )}\n aria-label=\"Close\"\n {...props}\n >\n {children || <CloseIcon />}\n </button>\n );\n }\n);\n\nModalClose.displayName = 'ModalClose';\n\n// ============================================================================\n// Modal Body\n// ============================================================================\n\nexport type ModalBodyProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Main content area of a Modal.\n */\nconst ModalBody = React.forwardRef<HTMLDivElement, ModalBodyProps>(\n ({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"modal-body\"\n className={cn('min-h-0 flex-1 overflow-y-auto px-6 py-4', className)}\n {...props}\n />\n )\n);\n\nModalBody.displayName = 'ModalBody';\n\n// ============================================================================\n// Modal Footer\n// ============================================================================\n\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Footer section of a Modal, typically for action buttons.\n */\nconst ModalFooter = React.forwardRef<HTMLDivElement, ModalFooterProps>(\n ({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"modal-footer\"\n className={cn(\n 'flex shrink-0 items-center justify-end gap-3',\n 'border-border border-t px-6 py-4',\n className\n )}\n {...props}\n />\n )\n);\n\nModalFooter.displayName = 'ModalFooter';\n\n// ============================================================================\n// Close Icon\n// ============================================================================\n\nfunction CloseIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n );\n}\n\nexport {\n Modal,\n ModalHeader,\n ModalTitle,\n ModalClose,\n ModalBody,\n ModalFooter,\n modalContentVariants,\n modalOverlayVariants,\n};\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
import { cn } from './chunk-TQONQSJO.js';
|
|
1
2
|
import { useEscapeKey } from './chunk-T4ME7QCT.js';
|
|
2
3
|
import { useAnchoredPosition } from './chunk-WSNMQQ4P.js';
|
|
3
|
-
import { cn } from './chunk-TQONQSJO.js';
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { createPortal } from 'react-dom';
|
|
6
6
|
import { X, Diamond, ArrowRight } from 'lucide-react';
|
|
@@ -271,5 +271,5 @@ function GlossaryTooltip({
|
|
|
271
271
|
}
|
|
272
272
|
|
|
273
273
|
export { GlossaryTooltip };
|
|
274
|
-
//# sourceMappingURL=chunk-
|
|
275
|
-
//# sourceMappingURL=chunk-
|
|
274
|
+
//# sourceMappingURL=chunk-L5W7TJQ5.js.map
|
|
275
|
+
//# sourceMappingURL=chunk-L5W7TJQ5.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/GlossaryTooltip/GlossaryTooltip.tsx"],"names":[],"mappings":"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","file":"chunk-SRMTRD7F.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { ArrowRight, Diamond, X } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { useAnchoredPosition } from '../../hooks/useAnchoredPosition';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** Authoritative source link shown in the card footer. */\nexport interface GlossarySource {\n label: string;\n url: string;\n}\n\n/** Sibling term shown as a lateral \"hop\" chip. */\nexport interface GlossaryRelatedTerm {\n term: string;\n href?: string;\n}\n\nexport interface GlossaryTooltipProps {\n /** Visible, in-flow trigger text (may be a plural or abbreviation match). */\n children: React.ReactNode;\n /** Canonical term name, shown as the card heading. */\n term: string;\n definition: string;\n /** Human-readable category label, shown as a badge in the header. */\n category?: string;\n /** Optional single key fact, shown with a diamond marker. */\n keyFact?: string;\n /** Optional authoritative source link, shown in the footer. */\n source?: GlossarySource;\n /** Optional sibling terms, shown as chips. */\n related?: GlossaryRelatedTerm[];\n /**\n * Full glossary page for the term. When set, the trigger is a real link —\n * desktop clicks navigate while hover previews; touch taps pin the card.\n */\n href?: string;\n /** Truncation limit for the in-card definition (default 190 chars). */\n maxDefinitionLength?: number;\n /** Dashed underline marking the term as hoverable (default true). */\n underline?: boolean;\n className?: string;\n}\n\nconst HIDE_GRACE_MS = 180;\n\n// =============================================================================\n// GlossaryTooltip\n// =============================================================================\n\n/**\n * A rich \"what does this term mean?\" hover card: category badge, canonical\n * term, truncated definition, optional key fact, source link, and related\n * term chips. The provenance sibling is `SourceTip` (\"what backs this\n * claim?\") — the two share the same interaction grammar.\n *\n * Trigger and card are phrasing content (`span`/`a`/`button` only), so it is\n * valid inside `<p>` prose. The card portals to `body` with fixed\n * positioning, flipping and clamping to stay in the viewport. On touch, a\n * tap pins the card instead of navigating; Escape or an outside tap closes.\n *\n * @example\n * ```tsx\n * <GlossaryTooltip\n * term=\"OSHA recordable\"\n * definition=\"A work-related injury or illness that meets OSHA reporting criteria…\"\n * category=\"Compliance\"\n * href=\"/glossary/osha-recordable\"\n * >\n * OSHA recordables\n * </GlossaryTooltip>\n * ```\n */\nexport function GlossaryTooltip({\n children,\n term,\n definition,\n category,\n keyFact,\n source,\n related,\n href,\n maxDefinitionLength = 190,\n underline = true,\n className,\n}: GlossaryTooltipProps) {\n const [open, setOpen] = React.useState(false);\n const [pinned, setPinned] = React.useState(false);\n const timer = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n // True while close() restores focus to the trigger, so the trigger's\n // focus-show doesn't immediately reopen a card the user just dismissed.\n const suppressFocusShow = React.useRef(false);\n\n const { anchorRef, floatingRef, style } = useAnchoredPosition<\n HTMLSpanElement,\n HTMLSpanElement\n >({\n open,\n placement: 'top',\n offset: 10,\n viewportPadding: 8,\n allowFlip: true,\n });\n\n const clearHideTimer = () => {\n if (timer.current) {\n clearTimeout(timer.current);\n timer.current = null;\n }\n };\n\n const show = React.useCallback(() => {\n clearHideTimer();\n setOpen(true);\n }, []);\n\n const scheduleHide = React.useCallback(() => {\n if (pinned) return;\n clearHideTimer();\n timer.current = setTimeout(() => setOpen(false), HIDE_GRACE_MS);\n }, [pinned]);\n\n const close = React.useCallback(() => {\n clearHideTimer();\n setPinned(false);\n setOpen(false);\n // Return focus to the trigger if it was inside the card.\n if (floatingRef.current?.contains(document.activeElement)) {\n suppressFocusShow.current = true;\n (anchorRef.current?.querySelector('a,button') as HTMLElement)?.focus();\n }\n }, [anchorRef, floatingRef]);\n\n React.useEffect(() => () => clearHideTimer(), []);\n\n // A pinned card is a non-modal dialog: move focus into it so its links\n // and close button are reachable by keyboard.\n React.useEffect(() => {\n if (pinned) floatingRef.current?.focus();\n }, [pinned, floatingRef]);\n\n useEscapeKey(close, open);\n\n // Pinned cards close on an outside tap; hover cards close on their own.\n React.useEffect(() => {\n if (!open || !pinned) return;\n const onPointer = (e: Event) => {\n const t = e.target as Node;\n if (anchorRef.current?.contains(t) || floatingRef.current?.contains(t))\n return;\n close();\n };\n document.addEventListener('mousedown', onPointer);\n document.addEventListener('touchstart', onPointer);\n return () => {\n document.removeEventListener('mousedown', onPointer);\n document.removeEventListener('touchstart', onPointer);\n };\n }, [open, pinned, close, anchorRef, floatingRef]);\n\n const togglePin = React.useCallback(() => {\n if (pinned) close();\n else {\n setPinned(true);\n show();\n }\n }, [pinned, close, show]);\n\n // Linked terms: desktop clicks navigate, coarse pointers pin instead.\n // Unlinked (button) terms: any click toggles the pin — hover previews,\n // click holds the card open.\n const onTriggerClick = (e: React.MouseEvent) => {\n const coarse =\n typeof window !== 'undefined' &&\n window.matchMedia('(hover: none)').matches;\n if (href) {\n if (!coarse) return;\n e.preventDefault();\n }\n togglePin();\n };\n\n const onTriggerKeyDown = (e: React.KeyboardEvent) => {\n if (href) return; // links keep native Enter navigation\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n togglePin();\n }\n };\n\n // Focus lives on the dialog container once pinned, so Enter/Space there\n // (not on a link or the close button inside) must also unpin.\n const onDialogKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>) => {\n if (e.target !== e.currentTarget) return;\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n close();\n }\n };\n\n const onTriggerFocus = () => {\n if (suppressFocusShow.current) {\n suppressFocusShow.current = false;\n return;\n }\n show();\n };\n\n const onBlurCapture = (e: React.FocusEvent<HTMLSpanElement>) => {\n const next = e.relatedTarget as Node | null;\n if (\n next &&\n (anchorRef.current?.contains(next) || floatingRef.current?.contains(next))\n )\n return;\n scheduleHide();\n };\n\n const limit = Math.max(1, maxDefinitionLength);\n const short =\n definition.length > limit\n ? `${definition.slice(0, limit - 1).trimEnd()}…`\n : definition;\n\n const triggerClasses = cn(\n 'cursor-help',\n underline &&\n 'decoration-primary-400/70 underline decoration-dashed underline-offset-4',\n className\n );\n\n const triggerProps = {\n onClick: onTriggerClick,\n className: cn(\n triggerClasses,\n href && 'text-primary-800 dark:text-primary-400 font-medium'\n ),\n };\n\n return (\n <span\n ref={anchorRef}\n className=\"relative inline\"\n onMouseEnter={show}\n onMouseLeave={scheduleHide}\n onFocus={onTriggerFocus}\n onBlur={onBlurCapture}\n >\n {href ? (\n <a\n href={href}\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n {...triggerProps}\n >\n {children}\n </a>\n ) : (\n <button\n type=\"button\"\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n aria-label={`${term} — show definition`}\n onKeyDown={onTriggerKeyDown}\n {...triggerProps}\n className={cn(\n 'inline appearance-none border-0 bg-transparent p-0 text-inherit [font:inherit]',\n triggerProps.className\n )}\n >\n {children}\n </button>\n )}\n {open &&\n createPortal(\n /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- keyboard dismissal on a focused non-modal dialog container is the WAI-ARIA pattern; links inside keep their own semantics */\n <span\n ref={floatingRef}\n role=\"dialog\"\n aria-label={term}\n tabIndex={-1}\n onMouseEnter={show}\n onMouseLeave={scheduleHide}\n onBlurCapture={onBlurCapture}\n onKeyDown={onDialogKeyDown}\n className=\"focus-visible:ring-ring z-50 block w-80 rounded-lg outline-none focus-visible:ring-2\"\n style={style}\n >\n <span className=\"border-border bg-card block overflow-hidden rounded-lg border text-start font-normal tracking-normal normal-case shadow-xl ring-1 ring-black/5 dark:ring-white/10\">\n <span className=\"from-primary-700 to-primary-600 block bg-gradient-to-br px-3.5 py-2.5\">\n <span className=\"flex items-start justify-between gap-2\">\n <span className=\"block min-w-0\">\n {category && (\n <span className=\"mb-1 inline-flex rounded-full bg-white/15 px-2 py-0.5 text-[10px] font-bold tracking-wide text-white uppercase\">\n {category}\n </span>\n )}\n <span className=\"block text-sm leading-snug font-semibold text-white\">\n {term}\n </span>\n </span>\n {pinned && (\n <button\n type=\"button\"\n onClick={close}\n aria-label=\"Close definition\"\n className=\"shrink-0 rounded p-0.5 text-white/70 hover:bg-white/10 hover:text-white\"\n >\n <X aria-hidden=\"true\" className=\"h-3.5 w-3.5\" />\n </button>\n )}\n </span>\n </span>\n\n <span className=\"block px-3.5 py-2.5\">\n <span className=\"text-muted-foreground block text-[13px] leading-relaxed\">\n {short}\n </span>\n {keyFact && (\n <span className=\"mt-2 flex items-start gap-1.5\">\n <Diamond\n aria-hidden=\"true\"\n className=\"text-primary-500 mt-0.5 h-3 w-3 shrink-0\"\n />\n <span className=\"text-foreground min-w-0 text-xs leading-relaxed font-medium\">\n {keyFact}\n </span>\n </span>\n )}\n </span>\n\n {(source || (related && related.length > 0) || href) && (\n <span className=\"border-border bg-muted/50 block border-t px-3.5 py-2\">\n {related && related.length > 0 && (\n <span className=\"mb-1.5 flex flex-wrap gap-1\">\n {related.map((r) =>\n r.href ? (\n <a\n key={r.term}\n href={r.href}\n className=\"border-border bg-card text-foreground hover:border-primary-400 hover:text-primary-800 dark:hover:text-primary-400 rounded-full border px-2 py-0.5 text-[11px] font-medium\"\n >\n {r.term}\n </a>\n ) : (\n <span\n key={r.term}\n className=\"border-border bg-card text-muted-foreground rounded-full border px-2 py-0.5 text-[11px] font-medium\"\n >\n {r.term}\n </span>\n )\n )}\n </span>\n )}\n <span className=\"flex items-center justify-between gap-2\">\n {source ? (\n <a\n href={source.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary-800 hover:text-primary-700 dark:text-primary-400 dark:hover:text-primary-300 min-w-0 truncate text-[11px] font-semibold\"\n >\n {source.label}\n </a>\n ) : (\n <span />\n )}\n {href && (\n <a\n href={href}\n className=\"text-muted-foreground hover:text-foreground inline-flex shrink-0 items-center gap-0.5 text-[11px] font-medium\"\n >\n Full definition\n <ArrowRight\n aria-hidden=\"true\"\n className=\"h-3 w-3 rtl:-scale-x-100\"\n />\n </a>\n )}\n </span>\n </span>\n )}\n </span>\n </span>,\n document.body\n )}\n </span>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/GlossaryTooltip/GlossaryTooltip.tsx"],"names":[],"mappings":"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","file":"chunk-L5W7TJQ5.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { ArrowRight, Diamond, X } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { useAnchoredPosition } from '../../hooks/useAnchoredPosition';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** Authoritative source link shown in the card footer. */\nexport interface GlossarySource {\n label: string;\n url: string;\n}\n\n/** Sibling term shown as a lateral \"hop\" chip. */\nexport interface GlossaryRelatedTerm {\n term: string;\n href?: string;\n}\n\nexport interface GlossaryTooltipProps {\n /** Visible, in-flow trigger text (may be a plural or abbreviation match). */\n children: React.ReactNode;\n /** Canonical term name, shown as the card heading. */\n term: string;\n definition: string;\n /** Human-readable category label, shown as a badge in the header. */\n category?: string;\n /** Optional single key fact, shown with a diamond marker. */\n keyFact?: string;\n /** Optional authoritative source link, shown in the footer. */\n source?: GlossarySource;\n /** Optional sibling terms, shown as chips. */\n related?: GlossaryRelatedTerm[];\n /**\n * Full glossary page for the term. When set, the trigger is a real link —\n * desktop clicks navigate while hover previews; touch taps pin the card.\n */\n href?: string;\n /** Truncation limit for the in-card definition (default 190 chars). */\n maxDefinitionLength?: number;\n /** Dashed underline marking the term as hoverable (default true). */\n underline?: boolean;\n className?: string;\n}\n\nconst HIDE_GRACE_MS = 180;\n\n// =============================================================================\n// GlossaryTooltip\n// =============================================================================\n\n/**\n * A rich \"what does this term mean?\" hover card: category badge, canonical\n * term, truncated definition, optional key fact, source link, and related\n * term chips. The provenance sibling is `SourceTip` (\"what backs this\n * claim?\") — the two share the same interaction grammar.\n *\n * Trigger and card are phrasing content (`span`/`a`/`button` only), so it is\n * valid inside `<p>` prose. The card portals to `body` with fixed\n * positioning, flipping and clamping to stay in the viewport. On touch, a\n * tap pins the card instead of navigating; Escape or an outside tap closes.\n *\n * @example\n * ```tsx\n * <GlossaryTooltip\n * term=\"OSHA recordable\"\n * definition=\"A work-related injury or illness that meets OSHA reporting criteria…\"\n * category=\"Compliance\"\n * href=\"/glossary/osha-recordable\"\n * >\n * OSHA recordables\n * </GlossaryTooltip>\n * ```\n */\nexport function GlossaryTooltip({\n children,\n term,\n definition,\n category,\n keyFact,\n source,\n related,\n href,\n maxDefinitionLength = 190,\n underline = true,\n className,\n}: GlossaryTooltipProps) {\n const [open, setOpen] = React.useState(false);\n const [pinned, setPinned] = React.useState(false);\n const timer = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n // True while close() restores focus to the trigger, so the trigger's\n // focus-show doesn't immediately reopen a card the user just dismissed.\n const suppressFocusShow = React.useRef(false);\n\n const { anchorRef, floatingRef, style } = useAnchoredPosition<\n HTMLSpanElement,\n HTMLSpanElement\n >({\n open,\n placement: 'top',\n offset: 10,\n viewportPadding: 8,\n allowFlip: true,\n });\n\n const clearHideTimer = () => {\n if (timer.current) {\n clearTimeout(timer.current);\n timer.current = null;\n }\n };\n\n const show = React.useCallback(() => {\n clearHideTimer();\n setOpen(true);\n }, []);\n\n const scheduleHide = React.useCallback(() => {\n if (pinned) return;\n clearHideTimer();\n timer.current = setTimeout(() => setOpen(false), HIDE_GRACE_MS);\n }, [pinned]);\n\n const close = React.useCallback(() => {\n clearHideTimer();\n setPinned(false);\n setOpen(false);\n // Return focus to the trigger if it was inside the card.\n if (floatingRef.current?.contains(document.activeElement)) {\n suppressFocusShow.current = true;\n (anchorRef.current?.querySelector('a,button') as HTMLElement)?.focus();\n }\n }, [anchorRef, floatingRef]);\n\n React.useEffect(() => () => clearHideTimer(), []);\n\n // A pinned card is a non-modal dialog: move focus into it so its links\n // and close button are reachable by keyboard.\n React.useEffect(() => {\n if (pinned) floatingRef.current?.focus();\n }, [pinned, floatingRef]);\n\n useEscapeKey(close, open);\n\n // Pinned cards close on an outside tap; hover cards close on their own.\n React.useEffect(() => {\n if (!open || !pinned) return;\n const onPointer = (e: Event) => {\n const t = e.target as Node;\n if (anchorRef.current?.contains(t) || floatingRef.current?.contains(t))\n return;\n close();\n };\n document.addEventListener('mousedown', onPointer);\n document.addEventListener('touchstart', onPointer);\n return () => {\n document.removeEventListener('mousedown', onPointer);\n document.removeEventListener('touchstart', onPointer);\n };\n }, [open, pinned, close, anchorRef, floatingRef]);\n\n const togglePin = React.useCallback(() => {\n if (pinned) close();\n else {\n setPinned(true);\n show();\n }\n }, [pinned, close, show]);\n\n // Linked terms: desktop clicks navigate, coarse pointers pin instead.\n // Unlinked (button) terms: any click toggles the pin — hover previews,\n // click holds the card open.\n const onTriggerClick = (e: React.MouseEvent) => {\n const coarse =\n typeof window !== 'undefined' &&\n window.matchMedia('(hover: none)').matches;\n if (href) {\n if (!coarse) return;\n e.preventDefault();\n }\n togglePin();\n };\n\n const onTriggerKeyDown = (e: React.KeyboardEvent) => {\n if (href) return; // links keep native Enter navigation\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n togglePin();\n }\n };\n\n // Focus lives on the dialog container once pinned, so Enter/Space there\n // (not on a link or the close button inside) must also unpin.\n const onDialogKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>) => {\n if (e.target !== e.currentTarget) return;\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n close();\n }\n };\n\n const onTriggerFocus = () => {\n if (suppressFocusShow.current) {\n suppressFocusShow.current = false;\n return;\n }\n show();\n };\n\n const onBlurCapture = (e: React.FocusEvent<HTMLSpanElement>) => {\n const next = e.relatedTarget as Node | null;\n if (\n next &&\n (anchorRef.current?.contains(next) || floatingRef.current?.contains(next))\n )\n return;\n scheduleHide();\n };\n\n const limit = Math.max(1, maxDefinitionLength);\n const short =\n definition.length > limit\n ? `${definition.slice(0, limit - 1).trimEnd()}…`\n : definition;\n\n const triggerClasses = cn(\n 'cursor-help',\n underline &&\n 'decoration-primary-400/70 underline decoration-dashed underline-offset-4',\n className\n );\n\n const triggerProps = {\n onClick: onTriggerClick,\n className: cn(\n triggerClasses,\n href && 'text-primary-800 dark:text-primary-400 font-medium'\n ),\n };\n\n return (\n <span\n ref={anchorRef}\n className=\"relative inline\"\n onMouseEnter={show}\n onMouseLeave={scheduleHide}\n onFocus={onTriggerFocus}\n onBlur={onBlurCapture}\n >\n {href ? (\n <a\n href={href}\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n {...triggerProps}\n >\n {children}\n </a>\n ) : (\n <button\n type=\"button\"\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n aria-label={`${term} — show definition`}\n onKeyDown={onTriggerKeyDown}\n {...triggerProps}\n className={cn(\n 'inline appearance-none border-0 bg-transparent p-0 text-inherit [font:inherit]',\n triggerProps.className\n )}\n >\n {children}\n </button>\n )}\n {open &&\n createPortal(\n /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- keyboard dismissal on a focused non-modal dialog container is the WAI-ARIA pattern; links inside keep their own semantics */\n <span\n ref={floatingRef}\n role=\"dialog\"\n aria-label={term}\n tabIndex={-1}\n onMouseEnter={show}\n onMouseLeave={scheduleHide}\n onBlurCapture={onBlurCapture}\n onKeyDown={onDialogKeyDown}\n className=\"focus-visible:ring-ring z-50 block w-80 rounded-lg outline-none focus-visible:ring-2\"\n style={style}\n >\n <span className=\"border-border bg-card block overflow-hidden rounded-lg border text-start font-normal tracking-normal normal-case shadow-xl ring-1 ring-black/5 dark:ring-white/10\">\n <span className=\"from-primary-700 to-primary-600 block bg-gradient-to-br px-3.5 py-2.5\">\n <span className=\"flex items-start justify-between gap-2\">\n <span className=\"block min-w-0\">\n {category && (\n <span className=\"mb-1 inline-flex rounded-full bg-white/15 px-2 py-0.5 text-[10px] font-bold tracking-wide text-white uppercase\">\n {category}\n </span>\n )}\n <span className=\"block text-sm leading-snug font-semibold text-white\">\n {term}\n </span>\n </span>\n {pinned && (\n <button\n type=\"button\"\n onClick={close}\n aria-label=\"Close definition\"\n className=\"shrink-0 rounded p-0.5 text-white/70 hover:bg-white/10 hover:text-white\"\n >\n <X aria-hidden=\"true\" className=\"h-3.5 w-3.5\" />\n </button>\n )}\n </span>\n </span>\n\n <span className=\"block px-3.5 py-2.5\">\n <span className=\"text-muted-foreground block text-[13px] leading-relaxed\">\n {short}\n </span>\n {keyFact && (\n <span className=\"mt-2 flex items-start gap-1.5\">\n <Diamond\n aria-hidden=\"true\"\n className=\"text-primary-500 mt-0.5 h-3 w-3 shrink-0\"\n />\n <span className=\"text-foreground min-w-0 text-xs leading-relaxed font-medium\">\n {keyFact}\n </span>\n </span>\n )}\n </span>\n\n {(source || (related && related.length > 0) || href) && (\n <span className=\"border-border bg-muted/50 block border-t px-3.5 py-2\">\n {related && related.length > 0 && (\n <span className=\"mb-1.5 flex flex-wrap gap-1\">\n {related.map((r) =>\n r.href ? (\n <a\n key={r.term}\n href={r.href}\n className=\"border-border bg-card text-foreground hover:border-primary-400 hover:text-primary-800 dark:hover:text-primary-400 rounded-full border px-2 py-0.5 text-[11px] font-medium\"\n >\n {r.term}\n </a>\n ) : (\n <span\n key={r.term}\n className=\"border-border bg-card text-muted-foreground rounded-full border px-2 py-0.5 text-[11px] font-medium\"\n >\n {r.term}\n </span>\n )\n )}\n </span>\n )}\n <span className=\"flex items-center justify-between gap-2\">\n {source ? (\n <a\n href={source.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary-800 hover:text-primary-700 dark:text-primary-400 dark:hover:text-primary-300 min-w-0 truncate text-[11px] font-semibold\"\n >\n {source.label}\n </a>\n ) : (\n <span />\n )}\n {href && (\n <a\n href={href}\n className=\"text-muted-foreground hover:text-foreground inline-flex shrink-0 items-center gap-0.5 text-[11px] font-medium\"\n >\n Full definition\n <ArrowRight\n aria-hidden=\"true\"\n className=\"h-3 w-3 rtl:-scale-x-100\"\n />\n </a>\n )}\n </span>\n </span>\n )}\n </span>\n </span>,\n document.body\n )}\n </span>\n );\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var chunk2O7D6F67_cjs = require('./chunk-2O7D6F67.cjs');
|
|
3
|
+
var chunkBVMABVC4_cjs = require('./chunk-BVMABVC4.cjs');
|
|
5
4
|
var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
|
|
5
|
+
var chunk2O7D6F67_cjs = require('./chunk-2O7D6F67.cjs');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var jsxRuntime = require('react/jsx-runtime');
|
|
8
8
|
var classVarianceAuthority = require('class-variance-authority');
|
|
@@ -222,7 +222,7 @@ var ThemeToggle = React__namespace.forwardRef(
|
|
|
222
222
|
);
|
|
223
223
|
if (showTooltip) {
|
|
224
224
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
225
|
-
|
|
225
|
+
chunkBVMABVC4_cjs.Tooltip,
|
|
226
226
|
{
|
|
227
227
|
content: label,
|
|
228
228
|
placement: tooltipPlacement,
|
|
@@ -242,5 +242,5 @@ exports.ThemeToggle = ThemeToggle;
|
|
|
242
242
|
exports.themeToggleIconVariants = themeToggleIconVariants;
|
|
243
243
|
exports.themeToggleVariants = themeToggleVariants;
|
|
244
244
|
exports.useThemeContext = useThemeContext;
|
|
245
|
-
//# sourceMappingURL=chunk-
|
|
246
|
-
//# sourceMappingURL=chunk-
|
|
245
|
+
//# sourceMappingURL=chunk-MM7QKUE3.cjs.map
|
|
246
|
+
//# sourceMappingURL=chunk-MM7QKUE3.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/ThemeProvider/ThemeProvider.tsx","../src/components/ThemeProvider/ThemeToggle.tsx"],"names":["React","useTheme","jsx","cva","React2","cn","Tooltip"],"mappings":"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","file":"chunk-Z5KFXHDP.cjs","sourcesContent":["import * as React from 'react';\nimport { useTheme, type Theme, type ResolvedTheme } from '../../hooks/useTheme';\n\nexport interface ThemeProviderContextValue {\n theme: Theme;\n setTheme: (theme: Theme) => void;\n resolvedTheme: ResolvedTheme;\n}\n\nconst ThemeProviderContext = React.createContext<\n ThemeProviderContextValue | undefined\n>(undefined);\n\nexport interface ThemeProviderProps {\n children: React.ReactNode;\n /** Default theme to use on first load */\n defaultTheme?: Theme;\n /** Storage key for persisting theme */\n storageKey?: string;\n}\n\n/**\n * Provider component that wraps your app to enable theme switching.\n *\n * @example\n * ```tsx\n * function App() {\n * return (\n * <ThemeProvider defaultTheme=\"system\">\n * <YourApp />\n * </ThemeProvider>\n * );\n * }\n * ```\n */\nfunction ThemeProvider({\n children,\n defaultTheme: _defaultTheme = 'system',\n}: ThemeProviderProps) {\n const { theme, setTheme, resolvedTheme } = useTheme();\n\n const value = React.useMemo(\n () => ({ theme, setTheme, resolvedTheme }),\n [theme, setTheme, resolvedTheme]\n );\n\n return (\n <ThemeProviderContext.Provider value={value}>\n {children}\n </ThemeProviderContext.Provider>\n );\n}\n\nThemeProvider.displayName = 'ThemeProvider';\n\n/**\n * Hook to access the theme context.\n *\n * @example\n * ```tsx\n * function ThemeToggle() {\n * const { theme, setTheme, resolvedTheme } = useThemeContext();\n * return (\n * <button onClick={() => setTheme(resolvedTheme === 'dark' ? 'light' : 'dark')}>\n * Toggle theme\n * </button>\n * );\n * }\n * ```\n */\nfunction useThemeContext(): ThemeProviderContextValue {\n const context = React.useContext(ThemeProviderContext);\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider');\n }\n return context;\n}\n\nexport { ThemeProvider, ThemeProviderContext, useThemeContext };\n","import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { useTheme, type Theme } from '../../hooks/useTheme';\nimport { Tooltip } from '../Tooltip';\n\n// ============================================================================\n// Theme Toggle Variants\n// ============================================================================\n\nconst themeToggleVariants = cva(\n [\n 'inline-flex items-center justify-center',\n 'rounded-md border transition-colors',\n 'focus:outline-none focus:ring-2 focus:ring-primary-500/40',\n ],\n {\n variants: {\n size: {\n sm: 'h-7 w-7',\n md: 'h-8 w-8',\n lg: 'h-9 w-9',\n },\n variant: {\n default: [\n 'border-neutral-300 bg-white text-neutral-600 shadow-sm',\n 'hover:bg-neutral-100',\n 'dark:border-neutral-600 dark:bg-neutral-800 dark:text-neutral-300 dark:hover:bg-neutral-700',\n ],\n ghost: [\n 'border-transparent bg-transparent text-neutral-600',\n 'hover:bg-neutral-100',\n 'dark:text-neutral-300 dark:hover:bg-neutral-700',\n ],\n },\n },\n defaultVariants: {\n size: 'md',\n variant: 'default',\n },\n }\n);\n\nconst themeToggleIconVariants = cva('', {\n variants: {\n size: {\n sm: 'h-3.5 w-3.5',\n md: 'h-4 w-4',\n lg: 'h-5 w-5',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\n// ============================================================================\n// Icon Components\n// ============================================================================\n\ninterface IconProps {\n className?: string;\n}\n\nconst SunIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z\"\n />\n </svg>\n);\n\nconst MoonIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z\"\n />\n </svg>\n);\n\nconst SystemIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n />\n </svg>\n);\n\n// ============================================================================\n// Three-way cycle (single source of truth)\n// ============================================================================\n\n/** The three-way cycle order: light → dark → system → light. Click handler,\n * tooltip label, and default icon are all derived from this one map. */\nconst THREE_WAY_NEXT: Record<Theme, Theme> = {\n light: 'dark',\n dark: 'system',\n system: 'light',\n};\n\nconst THEME_LABELS: Record<Theme, string> = {\n light: 'Switch to light mode',\n dark: 'Switch to dark mode',\n system: 'Switch to system theme',\n};\n\n// ============================================================================\n// ThemeToggle Component\n// ============================================================================\n\nexport interface ThemeToggleProps\n extends\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>,\n VariantProps<typeof themeToggleVariants> {\n /**\n * What themes to cycle through.\n * - 'two-way': Toggle between light and dark only\n * - 'three-way': Cycle through light → dark → system\n * @default 'two-way'\n */\n mode?: 'two-way' | 'three-way';\n /**\n * Whether to show a tooltip with the current/next theme\n * @default true\n */\n showTooltip?: boolean;\n /**\n * Tooltip placement\n * @default 'bottom'\n */\n tooltipPlacement?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * Delay before showing tooltip in ms\n * @default 140\n */\n tooltipDelay?: number;\n /**\n * Custom icon for light theme\n */\n lightIcon?: React.ReactNode;\n /**\n * Custom icon for dark theme\n */\n darkIcon?: React.ReactNode;\n /**\n * Custom icon for system theme (only used in three-way mode)\n */\n systemIcon?: React.ReactNode;\n}\n\n/**\n * An accessible theme toggle button that switches between light/dark modes.\n *\n * Uses the mieweb-ui useTheme hook for state management and persists\n * the user's preference to localStorage.\n *\n * @example\n * ```tsx\n * // Simple two-way toggle (light/dark)\n * <ThemeToggle />\n *\n * // Three-way cycle (light → dark → system)\n * <ThemeToggle mode=\"three-way\" />\n *\n * // With custom styling\n * <ThemeToggle size=\"lg\" variant=\"ghost\" />\n *\n * // Without tooltip\n * <ThemeToggle showTooltip={false} />\n * ```\n */\nconst ThemeToggle = React.forwardRef<HTMLButtonElement, ThemeToggleProps>(\n (\n {\n className,\n size,\n variant,\n mode = 'two-way',\n showTooltip = true,\n tooltipPlacement = 'bottom',\n tooltipDelay = 140,\n lightIcon,\n darkIcon,\n systemIcon,\n ...props\n },\n ref\n ) => {\n const { theme, setTheme, resolvedTheme } = useTheme();\n\n const handleClick = React.useCallback(() => {\n if (mode === 'two-way') {\n // Simple toggle between light and dark\n setTheme(resolvedTheme === 'dark' ? 'light' : 'dark');\n } else {\n setTheme(THREE_WAY_NEXT[theme]);\n }\n }, [mode, theme, resolvedTheme, setTheme]);\n\n const getLabel = () => {\n if (mode === 'two-way') {\n return resolvedTheme === 'dark'\n ? 'Switch to light mode'\n : 'Switch to dark mode';\n }\n // Three-way mode - name the next stop in the cycle\n return THEME_LABELS[THREE_WAY_NEXT[theme]];\n };\n\n const getCurrentIcon = () => {\n const iconClass = themeToggleIconVariants({ size });\n if (mode === 'three-way') {\n // The DEFAULT icon previews the next theme in the cycle, matching the\n // tooltip (previously dark showed a sun while the click gave system,\n // and system showed the current state instead of the next). The\n // lightIcon/darkIcon/systemIcon overrides are keyed by the CURRENT\n // theme — they replace the icon shown while in that theme.\n const override = {\n light: lightIcon,\n dark: darkIcon,\n system: systemIcon,\n }[theme];\n if (override) return override;\n const defaultIcons: Record<Theme, React.ReactNode> = {\n light: <SunIcon className={iconClass} />,\n dark: <MoonIcon className={iconClass} />,\n system: <SystemIcon className={iconClass} />,\n };\n return defaultIcons[THREE_WAY_NEXT[theme]];\n }\n\n // Two-way keeps the classic convention: sun while dark (\"click for\n // light\"), moon while light (\"click for dark\").\n if (resolvedTheme === 'dark') {\n return darkIcon || <SunIcon className={iconClass} />;\n }\n\n return lightIcon || <MoonIcon className={iconClass} />;\n };\n\n const label = getLabel();\n\n const button = (\n <button\n ref={ref}\n type=\"button\"\n aria-label={label}\n onClick={handleClick}\n className={cn(themeToggleVariants({ size, variant }), className)}\n {...props}\n >\n {getCurrentIcon()}\n </button>\n );\n\n if (showTooltip) {\n return (\n <Tooltip\n content={label}\n placement={tooltipPlacement}\n delay={tooltipDelay}\n >\n {button}\n </Tooltip>\n );\n }\n\n return button;\n }\n);\n\nThemeToggle.displayName = 'ThemeToggle';\n\nexport { ThemeToggle, themeToggleVariants, themeToggleIconVariants };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/ThemeProvider/ThemeProvider.tsx","../src/components/ThemeProvider/ThemeToggle.tsx"],"names":["React","useTheme","jsx","cva","React2","cn","Tooltip"],"mappings":"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","file":"chunk-MM7QKUE3.cjs","sourcesContent":["import * as React from 'react';\nimport { useTheme, type Theme, type ResolvedTheme } from '../../hooks/useTheme';\n\nexport interface ThemeProviderContextValue {\n theme: Theme;\n setTheme: (theme: Theme) => void;\n resolvedTheme: ResolvedTheme;\n}\n\nconst ThemeProviderContext = React.createContext<\n ThemeProviderContextValue | undefined\n>(undefined);\n\nexport interface ThemeProviderProps {\n children: React.ReactNode;\n /** Default theme to use on first load */\n defaultTheme?: Theme;\n /** Storage key for persisting theme */\n storageKey?: string;\n}\n\n/**\n * Provider component that wraps your app to enable theme switching.\n *\n * @example\n * ```tsx\n * function App() {\n * return (\n * <ThemeProvider defaultTheme=\"system\">\n * <YourApp />\n * </ThemeProvider>\n * );\n * }\n * ```\n */\nfunction ThemeProvider({\n children,\n defaultTheme: _defaultTheme = 'system',\n}: ThemeProviderProps) {\n const { theme, setTheme, resolvedTheme } = useTheme();\n\n const value = React.useMemo(\n () => ({ theme, setTheme, resolvedTheme }),\n [theme, setTheme, resolvedTheme]\n );\n\n return (\n <ThemeProviderContext.Provider value={value}>\n {children}\n </ThemeProviderContext.Provider>\n );\n}\n\nThemeProvider.displayName = 'ThemeProvider';\n\n/**\n * Hook to access the theme context.\n *\n * @example\n * ```tsx\n * function ThemeToggle() {\n * const { theme, setTheme, resolvedTheme } = useThemeContext();\n * return (\n * <button onClick={() => setTheme(resolvedTheme === 'dark' ? 'light' : 'dark')}>\n * Toggle theme\n * </button>\n * );\n * }\n * ```\n */\nfunction useThemeContext(): ThemeProviderContextValue {\n const context = React.useContext(ThemeProviderContext);\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider');\n }\n return context;\n}\n\nexport { ThemeProvider, ThemeProviderContext, useThemeContext };\n","import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { useTheme, type Theme } from '../../hooks/useTheme';\nimport { Tooltip } from '../Tooltip';\n\n// ============================================================================\n// Theme Toggle Variants\n// ============================================================================\n\nconst themeToggleVariants = cva(\n [\n 'inline-flex items-center justify-center',\n 'rounded-md border transition-colors',\n 'focus:outline-none focus:ring-2 focus:ring-primary-500/40',\n ],\n {\n variants: {\n size: {\n sm: 'h-7 w-7',\n md: 'h-8 w-8',\n lg: 'h-9 w-9',\n },\n variant: {\n default: [\n 'border-neutral-300 bg-white text-neutral-600 shadow-sm',\n 'hover:bg-neutral-100',\n 'dark:border-neutral-600 dark:bg-neutral-800 dark:text-neutral-300 dark:hover:bg-neutral-700',\n ],\n ghost: [\n 'border-transparent bg-transparent text-neutral-600',\n 'hover:bg-neutral-100',\n 'dark:text-neutral-300 dark:hover:bg-neutral-700',\n ],\n },\n },\n defaultVariants: {\n size: 'md',\n variant: 'default',\n },\n }\n);\n\nconst themeToggleIconVariants = cva('', {\n variants: {\n size: {\n sm: 'h-3.5 w-3.5',\n md: 'h-4 w-4',\n lg: 'h-5 w-5',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\n// ============================================================================\n// Icon Components\n// ============================================================================\n\ninterface IconProps {\n className?: string;\n}\n\nconst SunIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z\"\n />\n </svg>\n);\n\nconst MoonIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z\"\n />\n </svg>\n);\n\nconst SystemIcon: React.FC<IconProps> = ({ className }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n />\n </svg>\n);\n\n// ============================================================================\n// Three-way cycle (single source of truth)\n// ============================================================================\n\n/** The three-way cycle order: light → dark → system → light. Click handler,\n * tooltip label, and default icon are all derived from this one map. */\nconst THREE_WAY_NEXT: Record<Theme, Theme> = {\n light: 'dark',\n dark: 'system',\n system: 'light',\n};\n\nconst THEME_LABELS: Record<Theme, string> = {\n light: 'Switch to light mode',\n dark: 'Switch to dark mode',\n system: 'Switch to system theme',\n};\n\n// ============================================================================\n// ThemeToggle Component\n// ============================================================================\n\nexport interface ThemeToggleProps\n extends\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>,\n VariantProps<typeof themeToggleVariants> {\n /**\n * What themes to cycle through.\n * - 'two-way': Toggle between light and dark only\n * - 'three-way': Cycle through light → dark → system\n * @default 'two-way'\n */\n mode?: 'two-way' | 'three-way';\n /**\n * Whether to show a tooltip with the current/next theme\n * @default true\n */\n showTooltip?: boolean;\n /**\n * Tooltip placement\n * @default 'bottom'\n */\n tooltipPlacement?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * Delay before showing tooltip in ms\n * @default 140\n */\n tooltipDelay?: number;\n /**\n * Custom icon for light theme\n */\n lightIcon?: React.ReactNode;\n /**\n * Custom icon for dark theme\n */\n darkIcon?: React.ReactNode;\n /**\n * Custom icon for system theme (only used in three-way mode)\n */\n systemIcon?: React.ReactNode;\n}\n\n/**\n * An accessible theme toggle button that switches between light/dark modes.\n *\n * Uses the mieweb-ui useTheme hook for state management and persists\n * the user's preference to localStorage.\n *\n * @example\n * ```tsx\n * // Simple two-way toggle (light/dark)\n * <ThemeToggle />\n *\n * // Three-way cycle (light → dark → system)\n * <ThemeToggle mode=\"three-way\" />\n *\n * // With custom styling\n * <ThemeToggle size=\"lg\" variant=\"ghost\" />\n *\n * // Without tooltip\n * <ThemeToggle showTooltip={false} />\n * ```\n */\nconst ThemeToggle = React.forwardRef<HTMLButtonElement, ThemeToggleProps>(\n (\n {\n className,\n size,\n variant,\n mode = 'two-way',\n showTooltip = true,\n tooltipPlacement = 'bottom',\n tooltipDelay = 140,\n lightIcon,\n darkIcon,\n systemIcon,\n ...props\n },\n ref\n ) => {\n const { theme, setTheme, resolvedTheme } = useTheme();\n\n const handleClick = React.useCallback(() => {\n if (mode === 'two-way') {\n // Simple toggle between light and dark\n setTheme(resolvedTheme === 'dark' ? 'light' : 'dark');\n } else {\n setTheme(THREE_WAY_NEXT[theme]);\n }\n }, [mode, theme, resolvedTheme, setTheme]);\n\n const getLabel = () => {\n if (mode === 'two-way') {\n return resolvedTheme === 'dark'\n ? 'Switch to light mode'\n : 'Switch to dark mode';\n }\n // Three-way mode - name the next stop in the cycle\n return THEME_LABELS[THREE_WAY_NEXT[theme]];\n };\n\n const getCurrentIcon = () => {\n const iconClass = themeToggleIconVariants({ size });\n if (mode === 'three-way') {\n // The DEFAULT icon previews the next theme in the cycle, matching the\n // tooltip (previously dark showed a sun while the click gave system,\n // and system showed the current state instead of the next). The\n // lightIcon/darkIcon/systemIcon overrides are keyed by the CURRENT\n // theme — they replace the icon shown while in that theme.\n const override = {\n light: lightIcon,\n dark: darkIcon,\n system: systemIcon,\n }[theme];\n if (override) return override;\n const defaultIcons: Record<Theme, React.ReactNode> = {\n light: <SunIcon className={iconClass} />,\n dark: <MoonIcon className={iconClass} />,\n system: <SystemIcon className={iconClass} />,\n };\n return defaultIcons[THREE_WAY_NEXT[theme]];\n }\n\n // Two-way keeps the classic convention: sun while dark (\"click for\n // light\"), moon while light (\"click for dark\").\n if (resolvedTheme === 'dark') {\n return darkIcon || <SunIcon className={iconClass} />;\n }\n\n return lightIcon || <MoonIcon className={iconClass} />;\n };\n\n const label = getLabel();\n\n const button = (\n <button\n ref={ref}\n type=\"button\"\n aria-label={label}\n onClick={handleClick}\n className={cn(themeToggleVariants({ size, variant }), className)}\n {...props}\n >\n {getCurrentIcon()}\n </button>\n );\n\n if (showTooltip) {\n return (\n <Tooltip\n content={label}\n placement={tooltipPlacement}\n delay={tooltipDelay}\n >\n {button}\n </Tooltip>\n );\n }\n\n return button;\n }\n);\n\nThemeToggle.displayName = 'ThemeToggle';\n\nexport { ThemeToggle, themeToggleVariants, themeToggleIconVariants };\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { usePrefersReducedMotion } from './chunk-HB7C7NB5.js';
|
|
2
1
|
import { cn } from './chunk-TQONQSJO.js';
|
|
2
|
+
import { usePrefersReducedMotion } from './chunk-HB7C7NB5.js';
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { createPortal } from 'react-dom';
|
|
5
5
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
@@ -304,5 +304,5 @@ function Tooltip({
|
|
|
304
304
|
Tooltip.displayName = "Tooltip";
|
|
305
305
|
|
|
306
306
|
export { Tooltip };
|
|
307
|
-
//# sourceMappingURL=chunk-
|
|
308
|
-
//# sourceMappingURL=chunk-
|
|
307
|
+
//# sourceMappingURL=chunk-MUIDWFYJ.js.map
|
|
308
|
+
//# sourceMappingURL=chunk-MUIDWFYJ.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"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","file":"chunk-FJ7YPVKV.js","sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cn } from '../../utils/cn';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /** The content to display in the tooltip */\n content: React.ReactNode;\n /** The element that triggers the tooltip */\n children: React.ReactElement<{\n onFocus?: () => void;\n onBlur?: () => void;\n 'aria-describedby'?: string;\n }>;\n /** Preferred placement of the tooltip relative to the trigger. Will flip if not enough space. */\n placement?: TooltipPlacement;\n /** Delay in ms before showing the tooltip */\n delay?: number;\n /** Whether the tooltip is disabled */\n disabled?: boolean;\n /** Controlled open state */\n open?: boolean;\n /** Callback when open state changes */\n onOpenChange?: (open: boolean) => void;\n /** Additional class name for the tooltip content */\n className?: string;\n /** Maximum width of the tooltip in pixels. Set to 'none' for no limit. Default: 250 */\n maxWidth?: number | 'none';\n /** Offset from the trigger element in pixels. Default: 8 */\n offset?: number;\n}\n\nconst DEFAULT_OFFSET = 8;\nconst VIEWPORT_PADDING = 8;\n\n/**\n * An accessible tooltip component that displays on hover/focus.\n * Features smart positioning that automatically flips to avoid going off-screen.\n *\n * @example\n * ```tsx\n * <Tooltip content=\"This is a tooltip\">\n * <Button>Hover me</Button>\n * </Tooltip>\n * ```\n *\n * @example\n * ```tsx\n * // With multi-line content\n * <Tooltip content=\"This is a longer description that will wrap nicely\" maxWidth={200}>\n * <Button>Info</Button>\n * </Tooltip>\n * ```\n */\nfunction Tooltip({\n content,\n children,\n placement: preferredPlacement = 'top',\n delay = 200,\n disabled = false,\n open: controlledOpen,\n onOpenChange,\n className,\n maxWidth = 250,\n offset = DEFAULT_OFFSET,\n}: TooltipProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);\n const [position, setPosition] = React.useState<{\n top: number;\n left: number;\n actualPlacement: TooltipPlacement;\n arrowOffset: number;\n } | null>(null);\n const [isDarkMode, setIsDarkMode] = React.useState(false);\n\n const showTimeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n null\n );\n const hideTimeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n null\n );\n const isHoveringRef = React.useRef(false);\n const wrapperRef = React.useRef<HTMLDivElement>(null);\n const tooltipRef = React.useRef<HTMLDivElement>(null);\n const tooltipId = React.useId();\n const prefersReducedMotion = usePrefersReducedMotion();\n\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (value: boolean) => {\n if (!isControlled) {\n setUncontrolledOpen(value);\n }\n onOpenChange?.(value);\n },\n [isControlled, onOpenChange]\n );\n\n const clearTimeouts = React.useCallback(() => {\n if (showTimeoutRef.current) {\n clearTimeout(showTimeoutRef.current);\n showTimeoutRef.current = null;\n }\n if (hideTimeoutRef.current) {\n clearTimeout(hideTimeoutRef.current);\n hideTimeoutRef.current = null;\n }\n }, []);\n\n // Calculate optimal position for tooltip\n const calculatePosition = React.useCallback(() => {\n if (!wrapperRef.current || !tooltipRef.current) return;\n\n const triggerRect = wrapperRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n // Helper to check if placement fits\n const fitsPlacement = (p: TooltipPlacement): boolean => {\n switch (p) {\n case 'top':\n return (\n triggerRect.top - tooltipRect.height - offset >= VIEWPORT_PADDING\n );\n case 'bottom':\n return (\n triggerRect.bottom + tooltipRect.height + offset <=\n viewportHeight - VIEWPORT_PADDING\n );\n case 'left':\n return (\n triggerRect.left - tooltipRect.width - offset >= VIEWPORT_PADDING\n );\n case 'right':\n return (\n triggerRect.right + tooltipRect.width + offset <=\n viewportWidth - VIEWPORT_PADDING\n );\n }\n };\n\n // Determine actual placement (flip if preferred doesn't fit)\n let actualPlacement = preferredPlacement;\n if (!fitsPlacement(preferredPlacement)) {\n const opposites: Record<TooltipPlacement, TooltipPlacement> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n const opposite = opposites[preferredPlacement];\n if (fitsPlacement(opposite)) {\n actualPlacement = opposite;\n } else {\n // Try perpendicular placements\n const perpendicular: TooltipPlacement[] =\n preferredPlacement === 'top' || preferredPlacement === 'bottom'\n ? ['right', 'left']\n : ['bottom', 'top'];\n for (const p of perpendicular) {\n if (fitsPlacement(p)) {\n actualPlacement = p;\n break;\n }\n }\n }\n }\n\n // Calculate base position\n let top = 0;\n let left = 0;\n const triggerCenterX = triggerRect.left + triggerRect.width / 2;\n const triggerCenterY = triggerRect.top + triggerRect.height / 2;\n\n switch (actualPlacement) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - offset;\n left = triggerCenterX - tooltipRect.width / 2;\n break;\n case 'bottom':\n top = triggerRect.bottom + offset;\n left = triggerCenterX - tooltipRect.width / 2;\n break;\n case 'left':\n top = triggerCenterY - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - offset;\n break;\n case 'right':\n top = triggerCenterY - tooltipRect.height / 2;\n left = triggerRect.right + offset;\n break;\n }\n\n // Calculate arrow offset for when tooltip is constrained\n let arrowOffset = 0;\n const idealLeft = left;\n\n // Constrain to viewport (horizontal)\n if (left < VIEWPORT_PADDING) {\n left = VIEWPORT_PADDING;\n } else if (left + tooltipRect.width > viewportWidth - VIEWPORT_PADDING) {\n left = viewportWidth - tooltipRect.width - VIEWPORT_PADDING;\n }\n\n // Calculate arrow offset based on how much we shifted\n if (actualPlacement === 'top' || actualPlacement === 'bottom') {\n arrowOffset = idealLeft - left;\n }\n\n // Constrain to viewport (vertical)\n if (top < VIEWPORT_PADDING) {\n top = VIEWPORT_PADDING;\n } else if (top + tooltipRect.height > viewportHeight - VIEWPORT_PADDING) {\n top = viewportHeight - tooltipRect.height - VIEWPORT_PADDING;\n }\n\n setPosition({ top, left, actualPlacement, arrowOffset });\n }, [preferredPlacement, offset]);\n\n // Detect dark mode from document\n React.useEffect(() => {\n if (typeof document === 'undefined') return;\n\n const checkDarkMode = () => {\n setIsDarkMode(document.documentElement.classList.contains('dark'));\n };\n\n checkDarkMode();\n\n // Watch for class changes on document\n const observer = new window.MutationObserver(checkDarkMode);\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class'],\n });\n\n return () => observer.disconnect();\n }, []);\n\n // Recalculate position when open or on scroll/resize\n React.useEffect(() => {\n if (!isOpen) {\n setPosition(null);\n return;\n }\n\n // Initial calculation after render\n const rafId = window.requestAnimationFrame(() => {\n calculatePosition();\n });\n\n // Recalculate on scroll/resize\n const handleUpdate = () => calculatePosition();\n window.addEventListener('scroll', handleUpdate, true);\n window.addEventListener('resize', handleUpdate);\n\n return () => {\n window.cancelAnimationFrame(rafId);\n window.removeEventListener('scroll', handleUpdate, true);\n window.removeEventListener('resize', handleUpdate);\n };\n }, [isOpen, calculatePosition]);\n\n const handleMouseEnter = React.useCallback(() => {\n if (disabled) return;\n isHoveringRef.current = true;\n clearTimeouts();\n showTimeoutRef.current = setTimeout(() => {\n if (isHoveringRef.current) {\n setOpen(true);\n }\n }, delay);\n }, [disabled, delay, setOpen, clearTimeouts]);\n\n const handleMouseLeave = React.useCallback(() => {\n isHoveringRef.current = false;\n clearTimeouts();\n hideTimeoutRef.current = setTimeout(() => {\n if (!isHoveringRef.current) {\n setOpen(false);\n }\n }, 100);\n }, [setOpen, clearTimeouts]);\n\n const handleFocus = React.useCallback(() => {\n if (disabled) return;\n clearTimeouts();\n setOpen(true);\n }, [disabled, setOpen, clearTimeouts]);\n\n const handleBlur = React.useCallback(() => {\n clearTimeouts();\n setOpen(false);\n }, [setOpen, clearTimeouts]);\n\n // Cleanup timeouts on unmount\n React.useEffect(() => {\n return () => {\n clearTimeouts();\n };\n }, [clearTimeouts]);\n\n // Clone the child to add aria attributes and focus handlers\n const trigger = React.cloneElement(children, {\n onFocus: handleFocus,\n onBlur: handleBlur,\n 'aria-describedby': isOpen ? tooltipId : undefined,\n });\n\n // Arrow styles based on actual placement - using inline styles for border triangle\n // Arrow color matches tooltip background (neutral-900 in light mode, neutral-100 in dark mode)\n const getArrowStyle = (isDark: boolean): React.CSSProperties => {\n if (!position) return {};\n const { actualPlacement, arrowOffset } = position;\n\n const baseStyle: React.CSSProperties = {\n position: 'absolute',\n width: 0,\n height: 0,\n borderStyle: 'solid',\n // Must use content-box for CSS border triangle to work (Tailwind sets border-box globally)\n boxSizing: 'content-box',\n };\n\n const arrowSize = 5;\n // Match tooltip background colors: bg-neutral-900 (#171717) / dark:bg-neutral-100 (#f5f5f5)\n const arrowColor = isDark ? '#f5f5f5' : '#171717';\n\n // Use arrowSize for positioning to create slight overlap with tooltip body\n const arrowOffset2 = arrowSize;\n\n switch (actualPlacement) {\n case 'top':\n return {\n ...baseStyle,\n bottom: -arrowOffset2,\n left: `calc(50% + ${arrowOffset}px)`,\n transform: 'translateX(-50%)',\n borderWidth: `${arrowSize}px ${arrowSize}px 0 ${arrowSize}px`,\n borderColor: `${arrowColor} transparent transparent transparent`,\n };\n case 'bottom':\n return {\n ...baseStyle,\n top: -arrowOffset2,\n left: `calc(50% + ${arrowOffset}px)`,\n transform: 'translateX(-50%)',\n borderWidth: `0 ${arrowSize}px ${arrowSize}px ${arrowSize}px`,\n borderColor: `transparent transparent ${arrowColor} transparent`,\n };\n case 'left':\n return {\n ...baseStyle,\n right: -arrowOffset2,\n top: '50%',\n transform: 'translateY(-50%)',\n borderWidth: `${arrowSize}px 0 ${arrowSize}px ${arrowSize}px`,\n borderColor: `transparent transparent transparent ${arrowColor}`,\n };\n case 'right':\n return {\n ...baseStyle,\n left: -arrowOffset2,\n top: '50%',\n transform: 'translateY(-50%)',\n borderWidth: `${arrowSize}px ${arrowSize}px ${arrowSize}px 0`,\n borderColor: `transparent ${arrowColor} transparent transparent`,\n };\n }\n };\n\n return (\n <div\n ref={wrapperRef}\n className=\"relative inline-flex\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {trigger}\n {isOpen &&\n !disabled &&\n typeof document !== 'undefined' &&\n createPortal(\n <div\n ref={tooltipRef}\n id={tooltipId}\n role=\"tooltip\"\n data-slot=\"tooltip\"\n aria-hidden={!isOpen}\n style={{\n position: 'fixed',\n top: position?.top ?? -9999,\n left: position?.left ?? -9999,\n maxWidth: maxWidth === 'none' ? undefined : maxWidth,\n visibility: position ? 'visible' : 'hidden',\n // Use inline styles to ensure they work in portals (rendered outside React tree)\n backgroundColor: isDarkMode ? '#f5f5f5' : '#171717', // neutral-100 / neutral-900\n color: isDarkMode ? '#171717' : '#ffffff', // neutral-900 / white\n fontFamily:\n 'var(--mieweb-font-sans, ui-sans-serif, system-ui, sans-serif)',\n }}\n className={cn(\n 'pointer-events-none z-[9999] px-3 py-1.5 text-xs',\n 'rounded-md shadow-md',\n 'leading-normal font-semibold',\n !prefersReducedMotion && position && 'animate-fade-in',\n className\n )}\n >\n {content}\n {position && (\n <span style={getArrowStyle(isDarkMode)} aria-hidden=\"true\" />\n )}\n </div>,\n document.body\n )}\n </div>\n );\n}\n\nTooltip.displayName = 'Tooltip';\n\nexport { Tooltip };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"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","file":"chunk-MUIDWFYJ.js","sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cn } from '../../utils/cn';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /** The content to display in the tooltip */\n content: React.ReactNode;\n /** The element that triggers the tooltip */\n children: React.ReactElement<{\n onFocus?: () => void;\n onBlur?: () => void;\n 'aria-describedby'?: string;\n }>;\n /** Preferred placement of the tooltip relative to the trigger. Will flip if not enough space. */\n placement?: TooltipPlacement;\n /** Delay in ms before showing the tooltip */\n delay?: number;\n /** Whether the tooltip is disabled */\n disabled?: boolean;\n /** Controlled open state */\n open?: boolean;\n /** Callback when open state changes */\n onOpenChange?: (open: boolean) => void;\n /** Additional class name for the tooltip content */\n className?: string;\n /** Maximum width of the tooltip in pixels. Set to 'none' for no limit. Default: 250 */\n maxWidth?: number | 'none';\n /** Offset from the trigger element in pixels. Default: 8 */\n offset?: number;\n}\n\nconst DEFAULT_OFFSET = 8;\nconst VIEWPORT_PADDING = 8;\n\n/**\n * An accessible tooltip component that displays on hover/focus.\n * Features smart positioning that automatically flips to avoid going off-screen.\n *\n * @example\n * ```tsx\n * <Tooltip content=\"This is a tooltip\">\n * <Button>Hover me</Button>\n * </Tooltip>\n * ```\n *\n * @example\n * ```tsx\n * // With multi-line content\n * <Tooltip content=\"This is a longer description that will wrap nicely\" maxWidth={200}>\n * <Button>Info</Button>\n * </Tooltip>\n * ```\n */\nfunction Tooltip({\n content,\n children,\n placement: preferredPlacement = 'top',\n delay = 200,\n disabled = false,\n open: controlledOpen,\n onOpenChange,\n className,\n maxWidth = 250,\n offset = DEFAULT_OFFSET,\n}: TooltipProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);\n const [position, setPosition] = React.useState<{\n top: number;\n left: number;\n actualPlacement: TooltipPlacement;\n arrowOffset: number;\n } | null>(null);\n const [isDarkMode, setIsDarkMode] = React.useState(false);\n\n const showTimeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n null\n );\n const hideTimeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n null\n );\n const isHoveringRef = React.useRef(false);\n const wrapperRef = React.useRef<HTMLDivElement>(null);\n const tooltipRef = React.useRef<HTMLDivElement>(null);\n const tooltipId = React.useId();\n const prefersReducedMotion = usePrefersReducedMotion();\n\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (value: boolean) => {\n if (!isControlled) {\n setUncontrolledOpen(value);\n }\n onOpenChange?.(value);\n },\n [isControlled, onOpenChange]\n );\n\n const clearTimeouts = React.useCallback(() => {\n if (showTimeoutRef.current) {\n clearTimeout(showTimeoutRef.current);\n showTimeoutRef.current = null;\n }\n if (hideTimeoutRef.current) {\n clearTimeout(hideTimeoutRef.current);\n hideTimeoutRef.current = null;\n }\n }, []);\n\n // Calculate optimal position for tooltip\n const calculatePosition = React.useCallback(() => {\n if (!wrapperRef.current || !tooltipRef.current) return;\n\n const triggerRect = wrapperRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n // Helper to check if placement fits\n const fitsPlacement = (p: TooltipPlacement): boolean => {\n switch (p) {\n case 'top':\n return (\n triggerRect.top - tooltipRect.height - offset >= VIEWPORT_PADDING\n );\n case 'bottom':\n return (\n triggerRect.bottom + tooltipRect.height + offset <=\n viewportHeight - VIEWPORT_PADDING\n );\n case 'left':\n return (\n triggerRect.left - tooltipRect.width - offset >= VIEWPORT_PADDING\n );\n case 'right':\n return (\n triggerRect.right + tooltipRect.width + offset <=\n viewportWidth - VIEWPORT_PADDING\n );\n }\n };\n\n // Determine actual placement (flip if preferred doesn't fit)\n let actualPlacement = preferredPlacement;\n if (!fitsPlacement(preferredPlacement)) {\n const opposites: Record<TooltipPlacement, TooltipPlacement> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n const opposite = opposites[preferredPlacement];\n if (fitsPlacement(opposite)) {\n actualPlacement = opposite;\n } else {\n // Try perpendicular placements\n const perpendicular: TooltipPlacement[] =\n preferredPlacement === 'top' || preferredPlacement === 'bottom'\n ? ['right', 'left']\n : ['bottom', 'top'];\n for (const p of perpendicular) {\n if (fitsPlacement(p)) {\n actualPlacement = p;\n break;\n }\n }\n }\n }\n\n // Calculate base position\n let top = 0;\n let left = 0;\n const triggerCenterX = triggerRect.left + triggerRect.width / 2;\n const triggerCenterY = triggerRect.top + triggerRect.height / 2;\n\n switch (actualPlacement) {\n case 'top':\n top = triggerRect.top - tooltipRect.height - offset;\n left = triggerCenterX - tooltipRect.width / 2;\n break;\n case 'bottom':\n top = triggerRect.bottom + offset;\n left = triggerCenterX - tooltipRect.width / 2;\n break;\n case 'left':\n top = triggerCenterY - tooltipRect.height / 2;\n left = triggerRect.left - tooltipRect.width - offset;\n break;\n case 'right':\n top = triggerCenterY - tooltipRect.height / 2;\n left = triggerRect.right + offset;\n break;\n }\n\n // Calculate arrow offset for when tooltip is constrained\n let arrowOffset = 0;\n const idealLeft = left;\n\n // Constrain to viewport (horizontal)\n if (left < VIEWPORT_PADDING) {\n left = VIEWPORT_PADDING;\n } else if (left + tooltipRect.width > viewportWidth - VIEWPORT_PADDING) {\n left = viewportWidth - tooltipRect.width - VIEWPORT_PADDING;\n }\n\n // Calculate arrow offset based on how much we shifted\n if (actualPlacement === 'top' || actualPlacement === 'bottom') {\n arrowOffset = idealLeft - left;\n }\n\n // Constrain to viewport (vertical)\n if (top < VIEWPORT_PADDING) {\n top = VIEWPORT_PADDING;\n } else if (top + tooltipRect.height > viewportHeight - VIEWPORT_PADDING) {\n top = viewportHeight - tooltipRect.height - VIEWPORT_PADDING;\n }\n\n setPosition({ top, left, actualPlacement, arrowOffset });\n }, [preferredPlacement, offset]);\n\n // Detect dark mode from document\n React.useEffect(() => {\n if (typeof document === 'undefined') return;\n\n const checkDarkMode = () => {\n setIsDarkMode(document.documentElement.classList.contains('dark'));\n };\n\n checkDarkMode();\n\n // Watch for class changes on document\n const observer = new window.MutationObserver(checkDarkMode);\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class'],\n });\n\n return () => observer.disconnect();\n }, []);\n\n // Recalculate position when open or on scroll/resize\n React.useEffect(() => {\n if (!isOpen) {\n setPosition(null);\n return;\n }\n\n // Initial calculation after render\n const rafId = window.requestAnimationFrame(() => {\n calculatePosition();\n });\n\n // Recalculate on scroll/resize\n const handleUpdate = () => calculatePosition();\n window.addEventListener('scroll', handleUpdate, true);\n window.addEventListener('resize', handleUpdate);\n\n return () => {\n window.cancelAnimationFrame(rafId);\n window.removeEventListener('scroll', handleUpdate, true);\n window.removeEventListener('resize', handleUpdate);\n };\n }, [isOpen, calculatePosition]);\n\n const handleMouseEnter = React.useCallback(() => {\n if (disabled) return;\n isHoveringRef.current = true;\n clearTimeouts();\n showTimeoutRef.current = setTimeout(() => {\n if (isHoveringRef.current) {\n setOpen(true);\n }\n }, delay);\n }, [disabled, delay, setOpen, clearTimeouts]);\n\n const handleMouseLeave = React.useCallback(() => {\n isHoveringRef.current = false;\n clearTimeouts();\n hideTimeoutRef.current = setTimeout(() => {\n if (!isHoveringRef.current) {\n setOpen(false);\n }\n }, 100);\n }, [setOpen, clearTimeouts]);\n\n const handleFocus = React.useCallback(() => {\n if (disabled) return;\n clearTimeouts();\n setOpen(true);\n }, [disabled, setOpen, clearTimeouts]);\n\n const handleBlur = React.useCallback(() => {\n clearTimeouts();\n setOpen(false);\n }, [setOpen, clearTimeouts]);\n\n // Cleanup timeouts on unmount\n React.useEffect(() => {\n return () => {\n clearTimeouts();\n };\n }, [clearTimeouts]);\n\n // Clone the child to add aria attributes and focus handlers\n const trigger = React.cloneElement(children, {\n onFocus: handleFocus,\n onBlur: handleBlur,\n 'aria-describedby': isOpen ? tooltipId : undefined,\n });\n\n // Arrow styles based on actual placement - using inline styles for border triangle\n // Arrow color matches tooltip background (neutral-900 in light mode, neutral-100 in dark mode)\n const getArrowStyle = (isDark: boolean): React.CSSProperties => {\n if (!position) return {};\n const { actualPlacement, arrowOffset } = position;\n\n const baseStyle: React.CSSProperties = {\n position: 'absolute',\n width: 0,\n height: 0,\n borderStyle: 'solid',\n // Must use content-box for CSS border triangle to work (Tailwind sets border-box globally)\n boxSizing: 'content-box',\n };\n\n const arrowSize = 5;\n // Match tooltip background colors: bg-neutral-900 (#171717) / dark:bg-neutral-100 (#f5f5f5)\n const arrowColor = isDark ? '#f5f5f5' : '#171717';\n\n // Use arrowSize for positioning to create slight overlap with tooltip body\n const arrowOffset2 = arrowSize;\n\n switch (actualPlacement) {\n case 'top':\n return {\n ...baseStyle,\n bottom: -arrowOffset2,\n left: `calc(50% + ${arrowOffset}px)`,\n transform: 'translateX(-50%)',\n borderWidth: `${arrowSize}px ${arrowSize}px 0 ${arrowSize}px`,\n borderColor: `${arrowColor} transparent transparent transparent`,\n };\n case 'bottom':\n return {\n ...baseStyle,\n top: -arrowOffset2,\n left: `calc(50% + ${arrowOffset}px)`,\n transform: 'translateX(-50%)',\n borderWidth: `0 ${arrowSize}px ${arrowSize}px ${arrowSize}px`,\n borderColor: `transparent transparent ${arrowColor} transparent`,\n };\n case 'left':\n return {\n ...baseStyle,\n right: -arrowOffset2,\n top: '50%',\n transform: 'translateY(-50%)',\n borderWidth: `${arrowSize}px 0 ${arrowSize}px ${arrowSize}px`,\n borderColor: `transparent transparent transparent ${arrowColor}`,\n };\n case 'right':\n return {\n ...baseStyle,\n left: -arrowOffset2,\n top: '50%',\n transform: 'translateY(-50%)',\n borderWidth: `${arrowSize}px ${arrowSize}px ${arrowSize}px 0`,\n borderColor: `transparent ${arrowColor} transparent transparent`,\n };\n }\n };\n\n return (\n <div\n ref={wrapperRef}\n className=\"relative inline-flex\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {trigger}\n {isOpen &&\n !disabled &&\n typeof document !== 'undefined' &&\n createPortal(\n <div\n ref={tooltipRef}\n id={tooltipId}\n role=\"tooltip\"\n data-slot=\"tooltip\"\n aria-hidden={!isOpen}\n style={{\n position: 'fixed',\n top: position?.top ?? -9999,\n left: position?.left ?? -9999,\n maxWidth: maxWidth === 'none' ? undefined : maxWidth,\n visibility: position ? 'visible' : 'hidden',\n // Use inline styles to ensure they work in portals (rendered outside React tree)\n backgroundColor: isDarkMode ? '#f5f5f5' : '#171717', // neutral-100 / neutral-900\n color: isDarkMode ? '#171717' : '#ffffff', // neutral-900 / white\n fontFamily:\n 'var(--mieweb-font-sans, ui-sans-serif, system-ui, sans-serif)',\n }}\n className={cn(\n 'pointer-events-none z-[9999] px-3 py-1.5 text-xs',\n 'rounded-md shadow-md',\n 'leading-normal font-semibold',\n !prefersReducedMotion && position && 'animate-fade-in',\n className\n )}\n >\n {content}\n {position && (\n <span style={getArrowStyle(isDarkMode)} aria-hidden=\"true\" />\n )}\n </div>,\n document.body\n )}\n </div>\n );\n}\n\nTooltip.displayName = 'Tooltip';\n\nexport { Tooltip };\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { DragDropZone, MessageComposer } from './chunk-
|
|
1
|
+
import { DragDropZone, MessageComposer } from './chunk-O6GJ4IYS.js';
|
|
2
2
|
import { cn } from './chunk-TQONQSJO.js';
|
|
3
3
|
import * as React5 from 'react';
|
|
4
4
|
import { cva } from 'class-variance-authority';
|
|
@@ -1966,5 +1966,5 @@ function useReadReceipts(options) {
|
|
|
1966
1966
|
}
|
|
1967
1967
|
|
|
1968
1968
|
export { AttachmentPreview, ConversationHeader, ConversationListItem, ConversationListSkeleton, DateSeparator, EmptyState, LightboxModal, LoadMoreButton, MessageBubble, MessageList, MessageStatusIcon, MessageThread, MessagingSplitView, ReadReceiptIndicator, SkeletonMessage, TypingIndicator, bubbleVariants, formatDateLabel, formatFileSize, formatLastSeen, getConversationSubtitle, getConversationTitle, groupMessagesByDate, headerVariants, isSameSenderGroup, useMessageScroll, useMessages, useReadReceipts, useTypingIndicator };
|
|
1969
|
-
//# sourceMappingURL=chunk-
|
|
1970
|
-
//# sourceMappingURL=chunk-
|
|
1969
|
+
//# sourceMappingURL=chunk-MXQ7J4BB.js.map
|
|
1970
|
+
//# sourceMappingURL=chunk-MXQ7J4BB.js.map
|