@liveblocks/react-lexical 2.16.0-toolbars1 → 2.16.0-toolbars2
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/index.d.mts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/toolbar/floating-toolbar.js +250 -225
- package/dist/toolbar/floating-toolbar.js.map +1 -1
- package/dist/toolbar/floating-toolbar.mjs +251 -226
- package/dist/toolbar/floating-toolbar.mjs.map +1 -1
- package/dist/toolbar/shared.js +39 -0
- package/dist/toolbar/shared.js.map +1 -0
- package/dist/toolbar/shared.mjs +36 -0
- package/dist/toolbar/shared.mjs.map +1 -0
- package/dist/toolbar/toolbar.js +26 -24
- package/dist/toolbar/toolbar.js.map +1 -1
- package/dist/toolbar/toolbar.mjs +24 -22
- package/dist/toolbar/toolbar.mjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.mjs +1 -1
- package/package.json +6 -6
- package/dist/toolbar/floating-toolbar-context.js +0 -8
- package/dist/toolbar/floating-toolbar-context.js.map +0 -1
- package/dist/toolbar/floating-toolbar-context.mjs +0 -6
- package/dist/toolbar/floating-toolbar-context.mjs.map +0 -1
package/dist/index.d.mts
CHANGED
|
@@ -226,7 +226,9 @@ interface FloatingToolbarProps extends Omit<ComponentProps<"div">, "children"> {
|
|
|
226
226
|
before?: ToolbarSlot;
|
|
227
227
|
after?: ToolbarSlot;
|
|
228
228
|
}
|
|
229
|
-
declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement
|
|
229
|
+
declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
|
|
230
|
+
External: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
231
|
+
};
|
|
230
232
|
|
|
231
233
|
interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
|
|
232
234
|
version: HistoryVersion;
|
package/dist/index.d.ts
CHANGED
|
@@ -226,7 +226,9 @@ interface FloatingToolbarProps extends Omit<ComponentProps<"div">, "children"> {
|
|
|
226
226
|
before?: ToolbarSlot;
|
|
227
227
|
after?: ToolbarSlot;
|
|
228
228
|
}
|
|
229
|
-
declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement
|
|
229
|
+
declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
|
|
230
|
+
External: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
231
|
+
};
|
|
230
232
|
|
|
231
233
|
interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
|
|
232
234
|
version: HistoryVersion;
|
|
@@ -11,7 +11,7 @@ var classnames = require('../classnames.js');
|
|
|
11
11
|
var floatingComposer = require('../comments/floating-composer.js');
|
|
12
12
|
var createDomRange = require('../create-dom-range.js');
|
|
13
13
|
var isCommandRegistered = require('../is-command-registered.js');
|
|
14
|
-
var
|
|
14
|
+
var shared = require('./shared.js');
|
|
15
15
|
var toolbar = require('./toolbar.js');
|
|
16
16
|
|
|
17
17
|
const FLOATING_TOOLBAR_COLLISION_PADDING = 10;
|
|
@@ -36,246 +36,271 @@ function DefaultFloatingToolbarContent() {
|
|
|
36
36
|
]
|
|
37
37
|
});
|
|
38
38
|
}
|
|
39
|
-
const FloatingToolbar =
|
|
40
|
-
(
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
const handleFocus2 = () => {
|
|
71
|
-
setFocused(true);
|
|
72
|
-
};
|
|
73
|
-
const handleBlur2 = (event) => {
|
|
74
|
-
if (event.relatedTarget && toolbarRef.current?.contains(event.relatedTarget)) {
|
|
75
|
-
return;
|
|
76
|
-
}
|
|
77
|
-
if (event.relatedTarget === editor.getRootElement()) {
|
|
39
|
+
const FloatingToolbar = Object.assign(
|
|
40
|
+
react.forwardRef(
|
|
41
|
+
({
|
|
42
|
+
children = DefaultFloatingToolbarContent,
|
|
43
|
+
before,
|
|
44
|
+
after,
|
|
45
|
+
position = "top",
|
|
46
|
+
offset: sideOffset = 6,
|
|
47
|
+
onPointerDown,
|
|
48
|
+
onFocus,
|
|
49
|
+
onBlur,
|
|
50
|
+
className,
|
|
51
|
+
...props
|
|
52
|
+
}, forwardedRef) => {
|
|
53
|
+
const toolbarRef = react.useRef(null);
|
|
54
|
+
const externalIds = _private.useInitial(() => /* @__PURE__ */ new Set());
|
|
55
|
+
const [isPointerDown, setPointerDown] = react.useState(false);
|
|
56
|
+
const [editor] = LexicalComposerContext.useLexicalComposerContext();
|
|
57
|
+
const [isFocused, setFocused] = react.useState(false);
|
|
58
|
+
const [isManuallyClosed, setManuallyClosed] = react.useState(false);
|
|
59
|
+
const isEditable = editor.isEditable();
|
|
60
|
+
const [hasSelectionRange, setHasSelectionRange] = react.useState(false);
|
|
61
|
+
const isOpen = isFocused && !isPointerDown && hasSelectionRange && !isManuallyClosed;
|
|
62
|
+
const [delayedIsOpen, setDelayedIsOpen] = react.useState(isOpen);
|
|
63
|
+
const delayedIsOpenTimeoutRef = react.useRef();
|
|
64
|
+
react.useEffect(() => {
|
|
65
|
+
setManuallyClosed(false);
|
|
66
|
+
}, [isFocused, hasSelectionRange, editor]);
|
|
67
|
+
react.useEffect(() => {
|
|
68
|
+
const root = editor.getRootElement();
|
|
69
|
+
if (!root) {
|
|
78
70
|
return;
|
|
79
71
|
}
|
|
80
|
-
|
|
81
|
-
};
|
|
82
|
-
root.addEventListener("focus", handleFocus2);
|
|
83
|
-
root.addEventListener("blur", handleBlur2);
|
|
84
|
-
return () => {
|
|
85
|
-
root.removeEventListener("focus", handleFocus2);
|
|
86
|
-
root.removeEventListener("blur", handleBlur2);
|
|
87
|
-
};
|
|
88
|
-
}, [editor]);
|
|
89
|
-
const handleFocus = react.useCallback(
|
|
90
|
-
(event) => {
|
|
91
|
-
onFocus?.(event);
|
|
92
|
-
if (!event.isDefaultPrevented()) {
|
|
72
|
+
const handleFocus2 = () => {
|
|
93
73
|
setFocused(true);
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
[onFocus]
|
|
97
|
-
);
|
|
98
|
-
const handleBlur = react.useCallback(
|
|
99
|
-
(event) => {
|
|
100
|
-
onBlur?.(event);
|
|
101
|
-
if (!event.isDefaultPrevented()) {
|
|
74
|
+
};
|
|
75
|
+
const handleBlur2 = (event) => {
|
|
102
76
|
if (event.relatedTarget && toolbarRef.current?.contains(event.relatedTarget)) {
|
|
103
77
|
return;
|
|
104
78
|
}
|
|
105
|
-
if (event.relatedTarget === editor
|
|
79
|
+
if (event.relatedTarget === editor.getRootElement()) {
|
|
106
80
|
return;
|
|
107
81
|
}
|
|
82
|
+
for (const externalId of externalIds) {
|
|
83
|
+
if (document.getElementById(externalId)?.contains(event.relatedTarget)) {
|
|
84
|
+
return;
|
|
85
|
+
}
|
|
86
|
+
}
|
|
108
87
|
setFocused(false);
|
|
88
|
+
};
|
|
89
|
+
root.addEventListener("focus", handleFocus2);
|
|
90
|
+
root.addEventListener("blur", handleBlur2);
|
|
91
|
+
return () => {
|
|
92
|
+
root.removeEventListener("focus", handleFocus2);
|
|
93
|
+
root.removeEventListener("blur", handleBlur2);
|
|
94
|
+
};
|
|
95
|
+
}, [editor, externalIds]);
|
|
96
|
+
const handleFocus = react.useCallback(
|
|
97
|
+
(event) => {
|
|
98
|
+
onFocus?.(event);
|
|
99
|
+
if (!event.isDefaultPrevented()) {
|
|
100
|
+
setFocused(true);
|
|
101
|
+
}
|
|
102
|
+
},
|
|
103
|
+
[onFocus]
|
|
104
|
+
);
|
|
105
|
+
const handleBlur = react.useCallback(
|
|
106
|
+
(event) => {
|
|
107
|
+
onBlur?.(event);
|
|
108
|
+
if (!event.isDefaultPrevented()) {
|
|
109
|
+
if (event.relatedTarget && toolbarRef.current?.contains(event.relatedTarget)) {
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
if (event.relatedTarget === editor?.getRootElement()) {
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
for (const externalId of externalIds) {
|
|
116
|
+
if (document.getElementById(externalId)?.contains(event.relatedTarget)) {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
setFocused(false);
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
[onBlur, editor, externalIds]
|
|
124
|
+
);
|
|
125
|
+
react.useEffect(() => {
|
|
126
|
+
if (isOpen) {
|
|
127
|
+
delayedIsOpenTimeoutRef.current = window.setTimeout(() => {
|
|
128
|
+
setDelayedIsOpen(true);
|
|
129
|
+
}, FLOATING_TOOLBAR_OPEN_DELAY);
|
|
130
|
+
} else {
|
|
131
|
+
setDelayedIsOpen(false);
|
|
109
132
|
}
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
reactDom.shift({
|
|
137
|
-
...detectOverflowOptions,
|
|
138
|
-
limiter: reactDom.limitShift()
|
|
139
|
-
}),
|
|
140
|
-
reactDom.offset(sideOffset),
|
|
141
|
-
reactDom.size(detectOverflowOptions)
|
|
142
|
-
],
|
|
143
|
-
whileElementsMounted: (...args) => {
|
|
144
|
-
return reactDom.autoUpdate(...args, {
|
|
145
|
-
animationFrame: true
|
|
146
|
-
});
|
|
147
|
-
}
|
|
148
|
-
};
|
|
149
|
-
}, [position, sideOffset]);
|
|
150
|
-
const {
|
|
151
|
-
refs: { setReference, setFloating },
|
|
152
|
-
strategy,
|
|
153
|
-
x,
|
|
154
|
-
y,
|
|
155
|
-
isPositioned
|
|
156
|
-
} = reactDom.useFloating({
|
|
157
|
-
...floatingOptions,
|
|
158
|
-
open: delayedIsOpen
|
|
159
|
-
});
|
|
160
|
-
const mergedRefs = _private.useRefs(forwardedRef, toolbarRef, setFloating);
|
|
161
|
-
const handlePointerDown = react.useCallback(
|
|
162
|
-
(event) => {
|
|
163
|
-
onPointerDown?.(event);
|
|
164
|
-
event.stopPropagation();
|
|
165
|
-
if (event.target === toolbarRef.current) {
|
|
166
|
-
event.preventDefault();
|
|
167
|
-
}
|
|
168
|
-
},
|
|
169
|
-
[onPointerDown]
|
|
170
|
-
);
|
|
171
|
-
react.useEffect(() => {
|
|
172
|
-
if (!editor || !isEditable) {
|
|
173
|
-
return;
|
|
174
|
-
}
|
|
175
|
-
const handlePointerDown2 = () => {
|
|
176
|
-
setPointerDown(true);
|
|
177
|
-
};
|
|
178
|
-
const handlePointerUp = () => {
|
|
179
|
-
setPointerDown(false);
|
|
180
|
-
};
|
|
181
|
-
document.addEventListener("pointerdown", handlePointerDown2);
|
|
182
|
-
document.addEventListener("pointercancel", handlePointerUp);
|
|
183
|
-
document.addEventListener("pointerup", handlePointerUp);
|
|
184
|
-
return () => {
|
|
185
|
-
document.removeEventListener("pointerdown", handlePointerDown2);
|
|
186
|
-
document.removeEventListener("pointercancel", handlePointerUp);
|
|
187
|
-
document.removeEventListener("pointerup", handlePointerUp);
|
|
188
|
-
};
|
|
189
|
-
}, [editor, isEditable]);
|
|
190
|
-
react.useEffect(() => {
|
|
191
|
-
const unregister = editor.registerUpdateListener(({ tags }) => {
|
|
192
|
-
return editor.getEditorState().read(() => {
|
|
193
|
-
if (tags.has("collaboration"))
|
|
194
|
-
return;
|
|
195
|
-
setManuallyClosed(false);
|
|
196
|
-
const selection = lexical.$getSelection();
|
|
197
|
-
if (!lexical.$isRangeSelection(selection) || selection.isCollapsed()) {
|
|
198
|
-
setHasSelectionRange(false);
|
|
199
|
-
setReference(null);
|
|
200
|
-
return;
|
|
133
|
+
return () => {
|
|
134
|
+
window.clearTimeout(delayedIsOpenTimeoutRef.current);
|
|
135
|
+
};
|
|
136
|
+
}, [isOpen]);
|
|
137
|
+
const floatingOptions = react.useMemo(() => {
|
|
138
|
+
const detectOverflowOptions = {
|
|
139
|
+
padding: FLOATING_TOOLBAR_COLLISION_PADDING
|
|
140
|
+
};
|
|
141
|
+
return {
|
|
142
|
+
strategy: "fixed",
|
|
143
|
+
placement: position,
|
|
144
|
+
middleware: [
|
|
145
|
+
reactDom.inline(detectOverflowOptions),
|
|
146
|
+
reactDom.flip({ ...detectOverflowOptions, crossAxis: false }),
|
|
147
|
+
reactDom.hide(detectOverflowOptions),
|
|
148
|
+
reactDom.shift({
|
|
149
|
+
...detectOverflowOptions,
|
|
150
|
+
limiter: reactDom.limitShift()
|
|
151
|
+
}),
|
|
152
|
+
reactDom.offset(sideOffset),
|
|
153
|
+
reactDom.size(detectOverflowOptions)
|
|
154
|
+
],
|
|
155
|
+
whileElementsMounted: (...args) => {
|
|
156
|
+
return reactDom.autoUpdate(...args, {
|
|
157
|
+
animationFrame: true
|
|
158
|
+
});
|
|
201
159
|
}
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
160
|
+
};
|
|
161
|
+
}, [position, sideOffset]);
|
|
162
|
+
const {
|
|
163
|
+
refs: { setReference, setFloating },
|
|
164
|
+
strategy,
|
|
165
|
+
x,
|
|
166
|
+
y,
|
|
167
|
+
isPositioned
|
|
168
|
+
} = reactDom.useFloating({
|
|
169
|
+
...floatingOptions,
|
|
170
|
+
open: delayedIsOpen
|
|
213
171
|
});
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
172
|
+
const mergedRefs = _private.useRefs(forwardedRef, toolbarRef, setFloating);
|
|
173
|
+
const handlePointerDown = react.useCallback(
|
|
174
|
+
(event) => {
|
|
175
|
+
onPointerDown?.(event);
|
|
176
|
+
event.stopPropagation();
|
|
177
|
+
if (event.target === toolbarRef.current) {
|
|
178
|
+
event.preventDefault();
|
|
179
|
+
}
|
|
180
|
+
},
|
|
181
|
+
[onPointerDown]
|
|
182
|
+
);
|
|
183
|
+
react.useEffect(() => {
|
|
184
|
+
if (!editor || !isEditable) {
|
|
223
185
|
return;
|
|
224
186
|
}
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
187
|
+
const handlePointerDown2 = () => {
|
|
188
|
+
setPointerDown(true);
|
|
189
|
+
};
|
|
190
|
+
const handlePointerUp = () => {
|
|
191
|
+
setPointerDown(false);
|
|
192
|
+
};
|
|
193
|
+
document.addEventListener("pointerdown", handlePointerDown2);
|
|
194
|
+
document.addEventListener("pointercancel", handlePointerUp);
|
|
195
|
+
document.addEventListener("pointerup", handlePointerUp);
|
|
196
|
+
return () => {
|
|
197
|
+
document.removeEventListener("pointerdown", handlePointerDown2);
|
|
198
|
+
document.removeEventListener("pointercancel", handlePointerUp);
|
|
199
|
+
document.removeEventListener("pointerup", handlePointerUp);
|
|
200
|
+
};
|
|
201
|
+
}, [editor, isEditable]);
|
|
202
|
+
react.useEffect(() => {
|
|
203
|
+
const unregister = editor.registerUpdateListener(({ tags }) => {
|
|
204
|
+
return editor.getEditorState().read(() => {
|
|
205
|
+
if (tags.has("collaboration"))
|
|
206
|
+
return;
|
|
207
|
+
setManuallyClosed(false);
|
|
208
|
+
const selection = lexical.$getSelection();
|
|
209
|
+
if (!lexical.$isRangeSelection(selection) || selection.isCollapsed()) {
|
|
210
|
+
setHasSelectionRange(false);
|
|
211
|
+
setReference(null);
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
214
|
+
const { anchor, focus } = selection;
|
|
215
|
+
const range = createDomRange.createDOMRange(
|
|
216
|
+
editor,
|
|
217
|
+
anchor.getNode(),
|
|
218
|
+
anchor.offset,
|
|
219
|
+
focus.getNode(),
|
|
220
|
+
focus.offset
|
|
221
|
+
);
|
|
222
|
+
setHasSelectionRange(true);
|
|
223
|
+
setReference(range);
|
|
224
|
+
});
|
|
225
|
+
});
|
|
226
|
+
return unregister;
|
|
227
|
+
}, [editor, setReference]);
|
|
228
|
+
react.useEffect(() => {
|
|
229
|
+
const root = editor.getRootElement();
|
|
230
|
+
if (!root || !delayedIsOpen) {
|
|
231
|
+
return;
|
|
230
232
|
}
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
toolbar
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
233
|
+
const handleKeyDown = (event) => {
|
|
234
|
+
if (event.target !== root && event.defaultPrevented) {
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
if (event.key === "Escape") {
|
|
238
|
+
event.preventDefault();
|
|
239
|
+
event.stopPropagation();
|
|
240
|
+
editor.focus();
|
|
241
|
+
setManuallyClosed(true);
|
|
242
|
+
}
|
|
243
|
+
};
|
|
244
|
+
root.addEventListener("keydown", handleKeyDown);
|
|
245
|
+
return () => {
|
|
246
|
+
root.removeEventListener("keydown", handleKeyDown);
|
|
247
|
+
};
|
|
248
|
+
}, [editor, delayedIsOpen]);
|
|
249
|
+
const close = react.useCallback(() => {
|
|
250
|
+
editor.focus();
|
|
251
|
+
setManuallyClosed(true);
|
|
252
|
+
}, [editor, setManuallyClosed]);
|
|
253
|
+
const registerExternal = react.useCallback(
|
|
254
|
+
(id) => {
|
|
255
|
+
externalIds.add(id);
|
|
256
|
+
return () => {
|
|
257
|
+
externalIds.delete(id);
|
|
258
|
+
};
|
|
259
|
+
},
|
|
260
|
+
[externalIds]
|
|
261
|
+
);
|
|
262
|
+
if (!delayedIsOpen) {
|
|
263
|
+
return null;
|
|
264
|
+
}
|
|
265
|
+
const slotProps = { editor };
|
|
266
|
+
return reactDom$1.createPortal(
|
|
267
|
+
/* @__PURE__ */ jsxRuntime.jsx(_private.TooltipProvider, {
|
|
268
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(shared.FloatingToolbarContext.Provider, {
|
|
269
|
+
value: { close, registerExternal },
|
|
270
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
271
|
+
role: "toolbar",
|
|
272
|
+
"aria-label": "Floating toolbar",
|
|
273
|
+
"aria-orientation": "horizontal",
|
|
274
|
+
className: classnames.classNames(
|
|
275
|
+
"lb-root lb-portal lb-elevation lb-lexical-floating-toolbar lb-lexical-toolbar",
|
|
276
|
+
className
|
|
277
|
+
),
|
|
278
|
+
ref: mergedRefs,
|
|
279
|
+
style: {
|
|
280
|
+
position: strategy,
|
|
281
|
+
top: 0,
|
|
282
|
+
left: 0,
|
|
283
|
+
transform: isPositioned ? `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)` : "translate3d(0, -200%, 0)",
|
|
284
|
+
minWidth: "max-content"
|
|
285
|
+
},
|
|
286
|
+
onPointerDown: handlePointerDown,
|
|
287
|
+
onFocus: handleFocus,
|
|
288
|
+
onBlur: handleBlur,
|
|
289
|
+
...props,
|
|
290
|
+
children: [
|
|
291
|
+
toolbar.applyToolbarSlot(before, slotProps),
|
|
292
|
+
toolbar.applyToolbarSlot(children, slotProps),
|
|
293
|
+
toolbar.applyToolbarSlot(after, slotProps)
|
|
294
|
+
]
|
|
295
|
+
})
|
|
274
296
|
})
|
|
275
|
-
})
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
297
|
+
}),
|
|
298
|
+
document.body
|
|
299
|
+
);
|
|
300
|
+
}
|
|
301
|
+
),
|
|
302
|
+
{
|
|
303
|
+
External: shared.FloatingToolbarExternal
|
|
279
304
|
}
|
|
280
305
|
);
|
|
281
306
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"floating-toolbar.js","sources":["../../src/toolbar/floating-toolbar.tsx"],"sourcesContent":["import {\n autoUpdate,\n type DetectOverflowOptions,\n flip,\n hide,\n inline,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n type UseFloatingOptions,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { TooltipProvider, useRefs } from \"@liveblocks/react-ui/_private\";\nimport { $getSelection, $isRangeSelection, FORMAT_TEXT_COMMAND } from \"lexical\";\nimport type {\n ComponentProps,\n FocusEvent as ReactFocusEvent,\n PointerEvent as ReactPointerEvent,\n} from \"react\";\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { classNames } from \"../classnames\";\nimport { OPEN_FLOATING_COMPOSER_COMMAND } from \"../comments/floating-composer\";\nimport { createDOMRange } from \"../create-dom-range\";\nimport { useIsCommandRegistered } from \"../is-command-registered\";\nimport type { FloatingPosition } from \"../types\";\nimport { FloatingToolbarContext } from \"./floating-toolbar-context\";\nimport {\n applyToolbarSlot,\n Toolbar,\n type ToolbarSlot,\n type ToolbarSlotProps,\n} from \"./toolbar\";\n\nexport interface FloatingToolbarProps\n extends Omit<ComponentProps<\"div\">, \"children\"> {\n position?: FloatingPosition;\n offset?: number;\n children?: ToolbarSlot;\n before?: ToolbarSlot;\n after?: ToolbarSlot;\n}\n\nexport const FLOATING_TOOLBAR_COLLISION_PADDING = 10;\nconst FLOATING_TOOLBAR_OPEN_DELAY = 50;\n\nfunction DefaultFloatingToolbarContent() {\n const supportsTextFormat = useIsCommandRegistered(FORMAT_TEXT_COMMAND);\n const supportsThread = useIsCommandRegistered(OPEN_FLOATING_COMPOSER_COMMAND);\n\n return (\n <>\n {supportsTextFormat ? (\n <>\n <Toolbar.BlockSelector />\n <Toolbar.SectionInline />\n </>\n ) : null}\n {supportsThread ? (\n <>\n <Toolbar.Separator />\n <Toolbar.SectionCollaboration />\n </>\n ) : null}\n </>\n );\n}\n\nexport const FloatingToolbar = forwardRef<HTMLDivElement, FloatingToolbarProps>(\n (\n {\n children = DefaultFloatingToolbarContent,\n before,\n after,\n position = \"top\",\n offset: sideOffset = 6,\n onPointerDown,\n onFocus,\n onBlur,\n className,\n ...props\n },\n forwardedRef\n ) => {\n const toolbarRef = useRef<HTMLDivElement>(null);\n const [isPointerDown, setPointerDown] = useState(false);\n const [editor] = useLexicalComposerContext();\n const [isFocused, setFocused] = useState(false);\n const [isManuallyClosed, setManuallyClosed] = useState(false);\n const isEditable = editor.isEditable();\n const [hasSelectionRange, setHasSelectionRange] = useState(false);\n\n const isOpen =\n isFocused && !isPointerDown && hasSelectionRange && !isManuallyClosed;\n const [delayedIsOpen, setDelayedIsOpen] = useState(isOpen);\n const delayedIsOpenTimeoutRef = useRef<number>();\n\n // Reset the manually closed state when there's another change\n useEffect(() => {\n setManuallyClosed(false);\n }, [isFocused, hasSelectionRange, editor]);\n\n // Don't close when the focus moves from the editor to the toolbar\n useEffect(() => {\n const root = editor.getRootElement();\n\n if (!root) {\n return;\n }\n\n const handleFocus = () => {\n setFocused(true);\n };\n\n const handleBlur = (event: FocusEvent) => {\n if (\n event.relatedTarget &&\n toolbarRef.current?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n\n if (event.relatedTarget === editor.getRootElement()) {\n return;\n }\n\n setFocused(false);\n };\n\n root.addEventListener(\"focus\", handleFocus);\n root.addEventListener(\"blur\", handleBlur);\n\n return () => {\n root.removeEventListener(\"focus\", handleFocus);\n root.removeEventListener(\"blur\", handleBlur);\n };\n }, [editor]);\n\n const handleFocus = useCallback(\n (event: ReactFocusEvent<HTMLDivElement>) => {\n onFocus?.(event);\n\n if (!event.isDefaultPrevented()) {\n setFocused(true);\n }\n },\n [onFocus]\n );\n\n // Close the toolbar when the it loses focus to something else than the editor\n const handleBlur = useCallback(\n (event: ReactFocusEvent<HTMLDivElement>) => {\n onBlur?.(event);\n\n if (!event.isDefaultPrevented()) {\n if (\n event.relatedTarget &&\n toolbarRef.current?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n\n if (event.relatedTarget === editor?.getRootElement()) {\n return;\n }\n\n setFocused(false);\n }\n },\n [onBlur, editor]\n );\n\n // Delay the opening of the toolbar to avoid flickering issues\n useEffect(() => {\n if (isOpen) {\n delayedIsOpenTimeoutRef.current = window.setTimeout(() => {\n setDelayedIsOpen(true);\n }, FLOATING_TOOLBAR_OPEN_DELAY);\n } else {\n setDelayedIsOpen(false);\n }\n\n return () => {\n window.clearTimeout(delayedIsOpenTimeoutRef.current);\n };\n }, [isOpen]);\n\n const floatingOptions: UseFloatingOptions = useMemo(() => {\n const detectOverflowOptions: DetectOverflowOptions = {\n padding: FLOATING_TOOLBAR_COLLISION_PADDING,\n };\n\n return {\n strategy: \"fixed\",\n placement: position,\n middleware: [\n inline(detectOverflowOptions),\n flip({ ...detectOverflowOptions, crossAxis: false }),\n hide(detectOverflowOptions),\n shift({\n ...detectOverflowOptions,\n limiter: limitShift(),\n }),\n offset(sideOffset),\n size(detectOverflowOptions),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n };\n }, [position, sideOffset]);\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n isPositioned,\n } = useFloating({\n ...floatingOptions,\n open: delayedIsOpen,\n });\n const mergedRefs = useRefs(forwardedRef, toolbarRef, setFloating);\n\n const handlePointerDown = useCallback(\n (event: ReactPointerEvent<HTMLDivElement>) => {\n onPointerDown?.(event);\n\n event.stopPropagation();\n\n // Prevent the toolbar from closing when clicking on the toolbar itself\n if (event.target === toolbarRef.current) {\n event.preventDefault();\n }\n },\n [onPointerDown]\n );\n\n useEffect(() => {\n if (!editor || !isEditable) {\n return;\n }\n\n const handlePointerDown = () => {\n setPointerDown(true);\n };\n const handlePointerUp = () => {\n setPointerDown(false);\n };\n\n document.addEventListener(\"pointerdown\", handlePointerDown);\n document.addEventListener(\"pointercancel\", handlePointerUp);\n document.addEventListener(\"pointerup\", handlePointerUp);\n\n return () => {\n document.removeEventListener(\"pointerdown\", handlePointerDown);\n document.removeEventListener(\"pointercancel\", handlePointerUp);\n document.removeEventListener(\"pointerup\", handlePointerUp);\n };\n }, [editor, isEditable]);\n\n useEffect(() => {\n const unregister = editor.registerUpdateListener(({ tags }) => {\n return editor.getEditorState().read(() => {\n // Ignore selection updates related to collaboration\n if (tags.has(\"collaboration\")) return;\n\n setManuallyClosed(false);\n\n const selection = $getSelection();\n if (!$isRangeSelection(selection) || selection.isCollapsed()) {\n setHasSelectionRange(false);\n setReference(null);\n return;\n }\n\n const { anchor, focus } = selection;\n\n const range = createDOMRange(\n editor,\n anchor.getNode(),\n anchor.offset,\n focus.getNode(),\n focus.offset\n );\n\n setHasSelectionRange(true);\n setReference(range);\n });\n });\n\n return unregister;\n }, [editor, setReference]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n\n if (!root || !delayedIsOpen) {\n return;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.target !== root && event.defaultPrevented) {\n return;\n }\n\n if (event.key === \"Escape\") {\n event.preventDefault();\n event.stopPropagation();\n\n editor.focus();\n setManuallyClosed(true);\n }\n };\n\n root.addEventListener(\"keydown\", handleKeyDown);\n\n return () => {\n root.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, [editor, delayedIsOpen]);\n\n const close = useCallback(() => {\n editor.focus();\n setManuallyClosed(true);\n }, [editor, setManuallyClosed]);\n\n if (!delayedIsOpen) {\n return null;\n }\n\n const slotProps: ToolbarSlotProps = { editor };\n\n return createPortal(\n <TooltipProvider>\n <FloatingToolbarContext.Provider value={{ close }}>\n <div\n role=\"toolbar\"\n aria-label=\"Floating toolbar\"\n aria-orientation=\"horizontal\"\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-lexical-floating-toolbar lb-lexical-toolbar\",\n className\n )}\n ref={mergedRefs}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: isPositioned\n ? `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`\n : \"translate3d(0, -200%, 0)\",\n minWidth: \"max-content\",\n }}\n onPointerDown={handlePointerDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n >\n {applyToolbarSlot(before, slotProps)}\n {applyToolbarSlot(children, slotProps)}\n {applyToolbarSlot(after, slotProps)}\n </div>\n </FloatingToolbarContext.Provider>\n </TooltipProvider>,\n document.body\n );\n }\n);\n"],"names":["useIsCommandRegistered","FORMAT_TEXT_COMMAND","OPEN_FLOATING_COMPOSER_COMMAND","jsxs","Fragment","jsx","Toolbar","forwardRef","useRef","useState","useLexicalComposerContext","useEffect","handleFocus","handleBlur","useCallback","useMemo","inline","flip","hide","shift","limitShift","offset","size","autoUpdate","useFloating","useRefs","handlePointerDown","$getSelection","$isRangeSelection","createDOMRange","createPortal","TooltipProvider","FloatingToolbarContext","classNames","applyToolbarSlot"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"floating-toolbar.js","sources":["../../src/toolbar/floating-toolbar.tsx"],"sourcesContent":["import {\n autoUpdate,\n type DetectOverflowOptions,\n flip,\n hide,\n inline,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n type UseFloatingOptions,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n TooltipProvider,\n useInitial,\n useRefs,\n} from \"@liveblocks/react-ui/_private\";\nimport { $getSelection, $isRangeSelection, FORMAT_TEXT_COMMAND } from \"lexical\";\nimport type {\n ComponentProps,\n FocusEvent as ReactFocusEvent,\n PointerEvent as ReactPointerEvent,\n} from \"react\";\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { classNames } from \"../classnames\";\nimport { OPEN_FLOATING_COMPOSER_COMMAND } from \"../comments/floating-composer\";\nimport { createDOMRange } from \"../create-dom-range\";\nimport { useIsCommandRegistered } from \"../is-command-registered\";\nimport type { FloatingPosition } from \"../types\";\nimport { FloatingToolbarContext, FloatingToolbarExternal } from \"./shared\";\nimport {\n applyToolbarSlot,\n Toolbar,\n type ToolbarSlot,\n type ToolbarSlotProps,\n} from \"./toolbar\";\n\nexport interface FloatingToolbarProps\n extends Omit<ComponentProps<\"div\">, \"children\"> {\n position?: FloatingPosition;\n offset?: number;\n children?: ToolbarSlot;\n before?: ToolbarSlot;\n after?: ToolbarSlot;\n}\n\nexport const FLOATING_TOOLBAR_COLLISION_PADDING = 10;\nconst FLOATING_TOOLBAR_OPEN_DELAY = 50;\n\nfunction DefaultFloatingToolbarContent() {\n const supportsTextFormat = useIsCommandRegistered(FORMAT_TEXT_COMMAND);\n const supportsThread = useIsCommandRegistered(OPEN_FLOATING_COMPOSER_COMMAND);\n\n return (\n <>\n {supportsTextFormat ? (\n <>\n <Toolbar.BlockSelector />\n <Toolbar.SectionInline />\n </>\n ) : null}\n {supportsThread ? (\n <>\n <Toolbar.Separator />\n <Toolbar.SectionCollaboration />\n </>\n ) : null}\n </>\n );\n}\n\nexport const FloatingToolbar = Object.assign(\n forwardRef<HTMLDivElement, FloatingToolbarProps>(\n (\n {\n children = DefaultFloatingToolbarContent,\n before,\n after,\n position = \"top\",\n offset: sideOffset = 6,\n onPointerDown,\n onFocus,\n onBlur,\n className,\n ...props\n },\n forwardedRef\n ) => {\n const toolbarRef = useRef<HTMLDivElement>(null);\n const externalIds = useInitial<Set<string>>(() => new Set());\n const [isPointerDown, setPointerDown] = useState(false);\n const [editor] = useLexicalComposerContext();\n const [isFocused, setFocused] = useState(false);\n const [isManuallyClosed, setManuallyClosed] = useState(false);\n const isEditable = editor.isEditable();\n const [hasSelectionRange, setHasSelectionRange] = useState(false);\n\n const isOpen =\n isFocused && !isPointerDown && hasSelectionRange && !isManuallyClosed;\n const [delayedIsOpen, setDelayedIsOpen] = useState(isOpen);\n const delayedIsOpenTimeoutRef = useRef<number>();\n\n // Reset the manually closed state when there's another change\n useEffect(() => {\n setManuallyClosed(false);\n }, [isFocused, hasSelectionRange, editor]);\n\n // Don't close when the focus moves from the editor to the toolbar\n useEffect(() => {\n const root = editor.getRootElement();\n\n if (!root) {\n return;\n }\n\n const handleFocus = () => {\n setFocused(true);\n };\n\n const handleBlur = (event: FocusEvent) => {\n if (\n event.relatedTarget &&\n toolbarRef.current?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n\n if (event.relatedTarget === editor.getRootElement()) {\n return;\n }\n\n for (const externalId of externalIds) {\n if (\n document\n .getElementById(externalId)\n ?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n }\n\n setFocused(false);\n };\n\n root.addEventListener(\"focus\", handleFocus);\n root.addEventListener(\"blur\", handleBlur);\n\n return () => {\n root.removeEventListener(\"focus\", handleFocus);\n root.removeEventListener(\"blur\", handleBlur);\n };\n }, [editor, externalIds]);\n\n const handleFocus = useCallback(\n (event: ReactFocusEvent<HTMLDivElement>) => {\n onFocus?.(event);\n\n if (!event.isDefaultPrevented()) {\n setFocused(true);\n }\n },\n [onFocus]\n );\n\n // Close the toolbar when the it loses focus to something else than the editor\n const handleBlur = useCallback(\n (event: ReactFocusEvent<HTMLDivElement>) => {\n onBlur?.(event);\n\n if (!event.isDefaultPrevented()) {\n if (\n event.relatedTarget &&\n toolbarRef.current?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n\n if (event.relatedTarget === editor?.getRootElement()) {\n return;\n }\n\n for (const externalId of externalIds) {\n if (\n document\n .getElementById(externalId)\n ?.contains(event.relatedTarget as Node)\n ) {\n return;\n }\n }\n\n setFocused(false);\n }\n },\n [onBlur, editor, externalIds]\n );\n\n // Delay the opening of the toolbar to avoid flickering issues\n useEffect(() => {\n if (isOpen) {\n delayedIsOpenTimeoutRef.current = window.setTimeout(() => {\n setDelayedIsOpen(true);\n }, FLOATING_TOOLBAR_OPEN_DELAY);\n } else {\n setDelayedIsOpen(false);\n }\n\n return () => {\n window.clearTimeout(delayedIsOpenTimeoutRef.current);\n };\n }, [isOpen]);\n\n const floatingOptions: UseFloatingOptions = useMemo(() => {\n const detectOverflowOptions: DetectOverflowOptions = {\n padding: FLOATING_TOOLBAR_COLLISION_PADDING,\n };\n\n return {\n strategy: \"fixed\",\n placement: position,\n middleware: [\n inline(detectOverflowOptions),\n flip({ ...detectOverflowOptions, crossAxis: false }),\n hide(detectOverflowOptions),\n shift({\n ...detectOverflowOptions,\n limiter: limitShift(),\n }),\n offset(sideOffset),\n size(detectOverflowOptions),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n };\n }, [position, sideOffset]);\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n isPositioned,\n } = useFloating({\n ...floatingOptions,\n open: delayedIsOpen,\n });\n const mergedRefs = useRefs(forwardedRef, toolbarRef, setFloating);\n\n const handlePointerDown = useCallback(\n (event: ReactPointerEvent<HTMLDivElement>) => {\n onPointerDown?.(event);\n\n event.stopPropagation();\n\n // Prevent the toolbar from closing when clicking on the toolbar itself\n if (event.target === toolbarRef.current) {\n event.preventDefault();\n }\n },\n [onPointerDown]\n );\n\n useEffect(() => {\n if (!editor || !isEditable) {\n return;\n }\n\n const handlePointerDown = () => {\n setPointerDown(true);\n };\n const handlePointerUp = () => {\n setPointerDown(false);\n };\n\n document.addEventListener(\"pointerdown\", handlePointerDown);\n document.addEventListener(\"pointercancel\", handlePointerUp);\n document.addEventListener(\"pointerup\", handlePointerUp);\n\n return () => {\n document.removeEventListener(\"pointerdown\", handlePointerDown);\n document.removeEventListener(\"pointercancel\", handlePointerUp);\n document.removeEventListener(\"pointerup\", handlePointerUp);\n };\n }, [editor, isEditable]);\n\n useEffect(() => {\n const unregister = editor.registerUpdateListener(({ tags }) => {\n return editor.getEditorState().read(() => {\n // Ignore selection updates related to collaboration\n if (tags.has(\"collaboration\")) return;\n\n setManuallyClosed(false);\n\n const selection = $getSelection();\n if (!$isRangeSelection(selection) || selection.isCollapsed()) {\n setHasSelectionRange(false);\n setReference(null);\n return;\n }\n\n const { anchor, focus } = selection;\n\n const range = createDOMRange(\n editor,\n anchor.getNode(),\n anchor.offset,\n focus.getNode(),\n focus.offset\n );\n\n setHasSelectionRange(true);\n setReference(range);\n });\n });\n\n return unregister;\n }, [editor, setReference]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n\n if (!root || !delayedIsOpen) {\n return;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.target !== root && event.defaultPrevented) {\n return;\n }\n\n if (event.key === \"Escape\") {\n event.preventDefault();\n event.stopPropagation();\n\n editor.focus();\n setManuallyClosed(true);\n }\n };\n\n root.addEventListener(\"keydown\", handleKeyDown);\n\n return () => {\n root.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, [editor, delayedIsOpen]);\n\n const close = useCallback(() => {\n editor.focus();\n setManuallyClosed(true);\n }, [editor, setManuallyClosed]);\n\n const registerExternal = useCallback(\n (id: string) => {\n externalIds.add(id);\n\n return () => {\n externalIds.delete(id);\n };\n },\n [externalIds]\n );\n\n if (!delayedIsOpen) {\n return null;\n }\n\n const slotProps: ToolbarSlotProps = { editor };\n\n return createPortal(\n <TooltipProvider>\n <FloatingToolbarContext.Provider value={{ close, registerExternal }}>\n <div\n role=\"toolbar\"\n aria-label=\"Floating toolbar\"\n aria-orientation=\"horizontal\"\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-lexical-floating-toolbar lb-lexical-toolbar\",\n className\n )}\n ref={mergedRefs}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: isPositioned\n ? `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`\n : \"translate3d(0, -200%, 0)\",\n minWidth: \"max-content\",\n }}\n onPointerDown={handlePointerDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n >\n {applyToolbarSlot(before, slotProps)}\n {applyToolbarSlot(children, slotProps)}\n {applyToolbarSlot(after, slotProps)}\n </div>\n </FloatingToolbarContext.Provider>\n </TooltipProvider>,\n document.body\n );\n }\n ),\n {\n External: FloatingToolbarExternal,\n }\n);\n"],"names":["useIsCommandRegistered","FORMAT_TEXT_COMMAND","OPEN_FLOATING_COMPOSER_COMMAND","jsxs","Fragment","jsx","Toolbar","forwardRef","useRef","useInitial","useState","useLexicalComposerContext","useEffect","handleFocus","handleBlur","useCallback","useMemo","inline","flip","hide","shift","limitShift","offset","size","autoUpdate","useFloating","useRefs","handlePointerDown","$getSelection","$isRangeSelection","createDOMRange","createPortal","TooltipProvider","FloatingToolbarContext","classNames","applyToolbarSlot","FloatingToolbarExternal"],"mappings":"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"}
|