likec4 1.2.1 → 1.2.2
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/__app__/src/{view._viewId.react-legacy.lazy-Cxs6F284.js → ViewAsReact-CowYtE-c.mjs} +2 -26
- package/dist/__app__/src/{main-yVRq2dIl.js → main-DMmXFqbw.mjs} +2707 -1080
- package/dist/__app__/src/main.mjs +1 -0
- package/dist/__app__/src/style.css +1 -1
- package/dist/cli/index.mjs +2 -2
- package/package.json +15 -15
- package/react/index.d.ts +1 -0
- package/react/index.mjs +2 -2
- package/react/styles.d.ts +0 -1
- package/dist/__app__/src/main.js +0 -1
- package/dist/__app__/src/view._viewId.d2.lazy-CaQPy48H.js +0 -46
- package/dist/__app__/src/view._viewId.dot.lazy-6H3L1GpV.js +0 -49
- package/dist/__app__/src/view._viewId.mmd.lazy-By6xPESQ.js +0 -89
- package/dist/__app__/src/view_viewId_.css-LQsQcFpp.js +0 -1469
- /package/dist/__app__/src/{index-CgQjA8pD.js → index-CgQjA8pD.mjs} +0 -0
|
@@ -1,1469 +0,0 @@
|
|
|
1
|
-
import { q as React, j as jsxRuntimeExports, B as Box, t as CopyButton$1, T as Tooltip, A as ActionIcon, I as IconCheck, v as rem, w as IconCopy } from "./main-yVRq2dIl.js";
|
|
2
|
-
const {
|
|
3
|
-
createElement,
|
|
4
|
-
createContext,
|
|
5
|
-
createRef,
|
|
6
|
-
forwardRef,
|
|
7
|
-
useCallback,
|
|
8
|
-
useContext,
|
|
9
|
-
useEffect,
|
|
10
|
-
useImperativeHandle,
|
|
11
|
-
useLayoutEffect,
|
|
12
|
-
useMemo,
|
|
13
|
-
useRef,
|
|
14
|
-
useState
|
|
15
|
-
} = React, useId = React.useId, useLayoutEffect_do_not_use_directly = useLayoutEffect, PanelGroupContext = createContext(null);
|
|
16
|
-
PanelGroupContext.displayName = "PanelGroupContext";
|
|
17
|
-
const useIsomorphicLayoutEffect = useLayoutEffect_do_not_use_directly, wrappedUseId = typeof useId == "function" ? useId : () => null;
|
|
18
|
-
let counter = 0;
|
|
19
|
-
function useUniqueId(idFromParams = null) {
|
|
20
|
-
const idFromUseId = wrappedUseId(), idRef = useRef(idFromParams || idFromUseId || null);
|
|
21
|
-
return idRef.current === null && (idRef.current = "" + counter++), idFromParams ?? idRef.current;
|
|
22
|
-
}
|
|
23
|
-
function PanelWithForwardedRef({
|
|
24
|
-
children,
|
|
25
|
-
className: classNameFromProps = "",
|
|
26
|
-
collapsedSize,
|
|
27
|
-
collapsible,
|
|
28
|
-
defaultSize,
|
|
29
|
-
forwardedRef,
|
|
30
|
-
id: idFromProps,
|
|
31
|
-
maxSize,
|
|
32
|
-
minSize,
|
|
33
|
-
onCollapse,
|
|
34
|
-
onExpand,
|
|
35
|
-
onResize,
|
|
36
|
-
order,
|
|
37
|
-
style: styleFromProps,
|
|
38
|
-
tagName: Type = "div",
|
|
39
|
-
...rest
|
|
40
|
-
}) {
|
|
41
|
-
const context = useContext(PanelGroupContext);
|
|
42
|
-
if (context === null)
|
|
43
|
-
throw Error("Panel components must be rendered within a PanelGroup container");
|
|
44
|
-
const {
|
|
45
|
-
collapsePanel,
|
|
46
|
-
expandPanel,
|
|
47
|
-
getPanelSize,
|
|
48
|
-
getPanelStyle,
|
|
49
|
-
groupId,
|
|
50
|
-
isPanelCollapsed,
|
|
51
|
-
reevaluatePanelConstraints,
|
|
52
|
-
registerPanel,
|
|
53
|
-
resizePanel: resizePanel2,
|
|
54
|
-
unregisterPanel
|
|
55
|
-
} = context, panelId = useUniqueId(idFromProps), panelDataRef = useRef({
|
|
56
|
-
callbacks: {
|
|
57
|
-
onCollapse,
|
|
58
|
-
onExpand,
|
|
59
|
-
onResize
|
|
60
|
-
},
|
|
61
|
-
constraints: {
|
|
62
|
-
collapsedSize,
|
|
63
|
-
collapsible,
|
|
64
|
-
defaultSize,
|
|
65
|
-
maxSize,
|
|
66
|
-
minSize
|
|
67
|
-
},
|
|
68
|
-
id: panelId,
|
|
69
|
-
idIsFromProps: idFromProps !== void 0,
|
|
70
|
-
order
|
|
71
|
-
});
|
|
72
|
-
useRef({
|
|
73
|
-
didLogMissingDefaultSizeWarning: !1
|
|
74
|
-
}), useIsomorphicLayoutEffect(() => {
|
|
75
|
-
const {
|
|
76
|
-
callbacks,
|
|
77
|
-
constraints
|
|
78
|
-
} = panelDataRef.current, prevConstraints = {
|
|
79
|
-
...constraints
|
|
80
|
-
};
|
|
81
|
-
panelDataRef.current.id = panelId, panelDataRef.current.idIsFromProps = idFromProps !== void 0, panelDataRef.current.order = order, callbacks.onCollapse = onCollapse, callbacks.onExpand = onExpand, callbacks.onResize = onResize, constraints.collapsedSize = collapsedSize, constraints.collapsible = collapsible, constraints.defaultSize = defaultSize, constraints.maxSize = maxSize, constraints.minSize = minSize, (prevConstraints.collapsedSize !== constraints.collapsedSize || prevConstraints.collapsible !== constraints.collapsible || prevConstraints.maxSize !== constraints.maxSize || prevConstraints.minSize !== constraints.minSize) && reevaluatePanelConstraints(panelDataRef.current, prevConstraints);
|
|
82
|
-
}), useIsomorphicLayoutEffect(() => {
|
|
83
|
-
const panelData = panelDataRef.current;
|
|
84
|
-
return registerPanel(panelData), () => {
|
|
85
|
-
unregisterPanel(panelData);
|
|
86
|
-
};
|
|
87
|
-
}, [order, panelId, registerPanel, unregisterPanel]), useImperativeHandle(forwardedRef, () => ({
|
|
88
|
-
collapse: () => {
|
|
89
|
-
collapsePanel(panelDataRef.current);
|
|
90
|
-
},
|
|
91
|
-
expand: (minSize2) => {
|
|
92
|
-
expandPanel(panelDataRef.current, minSize2);
|
|
93
|
-
},
|
|
94
|
-
getId() {
|
|
95
|
-
return panelId;
|
|
96
|
-
},
|
|
97
|
-
getSize() {
|
|
98
|
-
return getPanelSize(panelDataRef.current);
|
|
99
|
-
},
|
|
100
|
-
isCollapsed() {
|
|
101
|
-
return isPanelCollapsed(panelDataRef.current);
|
|
102
|
-
},
|
|
103
|
-
isExpanded() {
|
|
104
|
-
return !isPanelCollapsed(panelDataRef.current);
|
|
105
|
-
},
|
|
106
|
-
resize: (size) => {
|
|
107
|
-
resizePanel2(panelDataRef.current, size);
|
|
108
|
-
}
|
|
109
|
-
}), [collapsePanel, expandPanel, getPanelSize, isPanelCollapsed, panelId, resizePanel2]);
|
|
110
|
-
const style = getPanelStyle(panelDataRef.current, defaultSize);
|
|
111
|
-
return createElement(Type, {
|
|
112
|
-
...rest,
|
|
113
|
-
children,
|
|
114
|
-
className: classNameFromProps,
|
|
115
|
-
id: idFromProps,
|
|
116
|
-
style: {
|
|
117
|
-
...style,
|
|
118
|
-
...styleFromProps
|
|
119
|
-
},
|
|
120
|
-
// CSS selectors
|
|
121
|
-
"data-panel": "",
|
|
122
|
-
"data-panel-collapsible": collapsible || void 0,
|
|
123
|
-
"data-panel-group-id": groupId,
|
|
124
|
-
"data-panel-id": panelId,
|
|
125
|
-
"data-panel-size": parseFloat("" + style.flexGrow).toFixed(1)
|
|
126
|
-
});
|
|
127
|
-
}
|
|
128
|
-
const Panel = forwardRef((props2, ref) => createElement(PanelWithForwardedRef, {
|
|
129
|
-
...props2,
|
|
130
|
-
forwardedRef: ref
|
|
131
|
-
}));
|
|
132
|
-
PanelWithForwardedRef.displayName = "Panel";
|
|
133
|
-
Panel.displayName = "forwardRef(Panel)";
|
|
134
|
-
let currentCursorStyle = null, styleElement = null;
|
|
135
|
-
function getCursorStyle(state, constraintFlags) {
|
|
136
|
-
if (constraintFlags) {
|
|
137
|
-
const horizontalMin = (constraintFlags & EXCEEDED_HORIZONTAL_MIN) !== 0, horizontalMax = (constraintFlags & EXCEEDED_HORIZONTAL_MAX) !== 0, verticalMin = (constraintFlags & EXCEEDED_VERTICAL_MIN) !== 0, verticalMax = (constraintFlags & EXCEEDED_VERTICAL_MAX) !== 0;
|
|
138
|
-
if (horizontalMin)
|
|
139
|
-
return verticalMin ? "se-resize" : verticalMax ? "ne-resize" : "e-resize";
|
|
140
|
-
if (horizontalMax)
|
|
141
|
-
return verticalMin ? "sw-resize" : verticalMax ? "nw-resize" : "w-resize";
|
|
142
|
-
if (verticalMin)
|
|
143
|
-
return "s-resize";
|
|
144
|
-
if (verticalMax)
|
|
145
|
-
return "n-resize";
|
|
146
|
-
}
|
|
147
|
-
switch (state) {
|
|
148
|
-
case "horizontal":
|
|
149
|
-
return "ew-resize";
|
|
150
|
-
case "intersection":
|
|
151
|
-
return "move";
|
|
152
|
-
case "vertical":
|
|
153
|
-
return "ns-resize";
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
function resetGlobalCursorStyle() {
|
|
157
|
-
styleElement !== null && (document.head.removeChild(styleElement), currentCursorStyle = null, styleElement = null);
|
|
158
|
-
}
|
|
159
|
-
function setGlobalCursorStyle(state, constraintFlags) {
|
|
160
|
-
const style = getCursorStyle(state, constraintFlags);
|
|
161
|
-
currentCursorStyle !== style && (currentCursorStyle = style, styleElement === null && (styleElement = document.createElement("style"), document.head.appendChild(styleElement)), styleElement.innerHTML = `*{cursor: ${style}!important;}`);
|
|
162
|
-
}
|
|
163
|
-
function isKeyDown(event) {
|
|
164
|
-
return event.type === "keydown";
|
|
165
|
-
}
|
|
166
|
-
function isPointerEvent(event) {
|
|
167
|
-
return event.type.startsWith("pointer");
|
|
168
|
-
}
|
|
169
|
-
function isMouseEvent(event) {
|
|
170
|
-
return event.type.startsWith("mouse");
|
|
171
|
-
}
|
|
172
|
-
function getResizeEventCoordinates(event) {
|
|
173
|
-
if (isPointerEvent(event)) {
|
|
174
|
-
if (event.isPrimary)
|
|
175
|
-
return {
|
|
176
|
-
x: event.clientX,
|
|
177
|
-
y: event.clientY
|
|
178
|
-
};
|
|
179
|
-
} else if (isMouseEvent(event))
|
|
180
|
-
return {
|
|
181
|
-
x: event.clientX,
|
|
182
|
-
y: event.clientY
|
|
183
|
-
};
|
|
184
|
-
return {
|
|
185
|
-
x: 1 / 0,
|
|
186
|
-
y: 1 / 0
|
|
187
|
-
};
|
|
188
|
-
}
|
|
189
|
-
function getInputType() {
|
|
190
|
-
if (typeof matchMedia == "function")
|
|
191
|
-
return matchMedia("(pointer:coarse)").matches ? "coarse" : "fine";
|
|
192
|
-
}
|
|
193
|
-
function intersects(rectOne, rectTwo, strict) {
|
|
194
|
-
return strict ? rectOne.x < rectTwo.x + rectTwo.width && rectOne.x + rectOne.width > rectTwo.x && rectOne.y < rectTwo.y + rectTwo.height && rectOne.y + rectOne.height > rectTwo.y : rectOne.x <= rectTwo.x + rectTwo.width && rectOne.x + rectOne.width >= rectTwo.x && rectOne.y <= rectTwo.y + rectTwo.height && rectOne.y + rectOne.height >= rectTwo.y;
|
|
195
|
-
}
|
|
196
|
-
function compare(a, b) {
|
|
197
|
-
if (a === b) throw new Error("Cannot compare node with itself");
|
|
198
|
-
const ancestors = {
|
|
199
|
-
a: get_ancestors(a),
|
|
200
|
-
b: get_ancestors(b)
|
|
201
|
-
};
|
|
202
|
-
let common_ancestor;
|
|
203
|
-
for (; ancestors.a.at(-1) === ancestors.b.at(-1); )
|
|
204
|
-
a = ancestors.a.pop(), b = ancestors.b.pop(), common_ancestor = a;
|
|
205
|
-
assert(common_ancestor, "Stacking order can only be calculated for elements with a common ancestor");
|
|
206
|
-
const z_indexes = {
|
|
207
|
-
a: get_z_index(find_stacking_context(ancestors.a)),
|
|
208
|
-
b: get_z_index(find_stacking_context(ancestors.b))
|
|
209
|
-
};
|
|
210
|
-
if (z_indexes.a === z_indexes.b) {
|
|
211
|
-
const children = common_ancestor.childNodes, furthest_ancestors = {
|
|
212
|
-
a: ancestors.a.at(-1),
|
|
213
|
-
b: ancestors.b.at(-1)
|
|
214
|
-
};
|
|
215
|
-
let i = children.length;
|
|
216
|
-
for (; i--; ) {
|
|
217
|
-
const child = children[i];
|
|
218
|
-
if (child === furthest_ancestors.a) return 1;
|
|
219
|
-
if (child === furthest_ancestors.b) return -1;
|
|
220
|
-
}
|
|
221
|
-
}
|
|
222
|
-
return Math.sign(z_indexes.a - z_indexes.b);
|
|
223
|
-
}
|
|
224
|
-
const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMode|filter|webkitFilter|isolation)\b/;
|
|
225
|
-
function is_flex_item(node) {
|
|
226
|
-
var _get_parent;
|
|
227
|
-
const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
|
|
228
|
-
return display === "flex" || display === "inline-flex";
|
|
229
|
-
}
|
|
230
|
-
function creates_stacking_context(node) {
|
|
231
|
-
const style = getComputedStyle(node);
|
|
232
|
-
return !!(style.position === "fixed" || style.zIndex !== "auto" && (style.position !== "static" || is_flex_item(node)) || +style.opacity < 1 || "transform" in style && style.transform !== "none" || "webkitTransform" in style && style.webkitTransform !== "none" || "mixBlendMode" in style && style.mixBlendMode !== "normal" || "filter" in style && style.filter !== "none" || "webkitFilter" in style && style.webkitFilter !== "none" || "isolation" in style && style.isolation === "isolate" || props.test(style.willChange) || style.webkitOverflowScrolling === "touch");
|
|
233
|
-
}
|
|
234
|
-
function find_stacking_context(nodes) {
|
|
235
|
-
let i = nodes.length;
|
|
236
|
-
for (; i--; ) {
|
|
237
|
-
const node = nodes[i];
|
|
238
|
-
if (assert(node, "Missing node"), creates_stacking_context(node)) return node;
|
|
239
|
-
}
|
|
240
|
-
return null;
|
|
241
|
-
}
|
|
242
|
-
function get_z_index(node) {
|
|
243
|
-
return node && Number(getComputedStyle(node).zIndex) || 0;
|
|
244
|
-
}
|
|
245
|
-
function get_ancestors(node) {
|
|
246
|
-
const ancestors = [];
|
|
247
|
-
for (; node; )
|
|
248
|
-
ancestors.push(node), node = get_parent(node);
|
|
249
|
-
return ancestors;
|
|
250
|
-
}
|
|
251
|
-
function get_parent(node) {
|
|
252
|
-
const {
|
|
253
|
-
parentNode
|
|
254
|
-
} = node;
|
|
255
|
-
return parentNode && parentNode instanceof ShadowRoot ? parentNode.host : parentNode;
|
|
256
|
-
}
|
|
257
|
-
const EXCEEDED_HORIZONTAL_MIN = 1, EXCEEDED_HORIZONTAL_MAX = 2, EXCEEDED_VERTICAL_MIN = 4, EXCEEDED_VERTICAL_MAX = 8, isCoarsePointer = getInputType() === "coarse";
|
|
258
|
-
let intersectingHandles = [], isPointerDown = !1, ownerDocumentCounts = /* @__PURE__ */ new Map(), panelConstraintFlags = /* @__PURE__ */ new Map();
|
|
259
|
-
const registeredResizeHandlers = /* @__PURE__ */ new Set();
|
|
260
|
-
function registerResizeHandle(resizeHandleId, element, direction, hitAreaMargins, setResizeHandlerState) {
|
|
261
|
-
var _ownerDocumentCounts$;
|
|
262
|
-
const {
|
|
263
|
-
ownerDocument
|
|
264
|
-
} = element, data = {
|
|
265
|
-
direction,
|
|
266
|
-
element,
|
|
267
|
-
hitAreaMargins,
|
|
268
|
-
setResizeHandlerState
|
|
269
|
-
}, count = (_ownerDocumentCounts$ = ownerDocumentCounts.get(ownerDocument)) !== null && _ownerDocumentCounts$ !== void 0 ? _ownerDocumentCounts$ : 0;
|
|
270
|
-
return ownerDocumentCounts.set(ownerDocument, count + 1), registeredResizeHandlers.add(data), updateListeners(), function() {
|
|
271
|
-
var _ownerDocumentCounts$2;
|
|
272
|
-
panelConstraintFlags.delete(resizeHandleId), registeredResizeHandlers.delete(data);
|
|
273
|
-
const count2 = (_ownerDocumentCounts$2 = ownerDocumentCounts.get(ownerDocument)) !== null && _ownerDocumentCounts$2 !== void 0 ? _ownerDocumentCounts$2 : 1;
|
|
274
|
-
ownerDocumentCounts.set(ownerDocument, count2 - 1), updateListeners(), count2 === 1 && ownerDocumentCounts.delete(ownerDocument);
|
|
275
|
-
};
|
|
276
|
-
}
|
|
277
|
-
function handlePointerDown(event) {
|
|
278
|
-
const {
|
|
279
|
-
target
|
|
280
|
-
} = event, {
|
|
281
|
-
x,
|
|
282
|
-
y
|
|
283
|
-
} = getResizeEventCoordinates(event);
|
|
284
|
-
isPointerDown = !0, recalculateIntersectingHandles({
|
|
285
|
-
target,
|
|
286
|
-
x,
|
|
287
|
-
y
|
|
288
|
-
}), updateListeners(), intersectingHandles.length > 0 && (updateResizeHandlerStates("down", event), event.preventDefault(), event.stopPropagation());
|
|
289
|
-
}
|
|
290
|
-
function handlePointerMove(event) {
|
|
291
|
-
const {
|
|
292
|
-
x,
|
|
293
|
-
y
|
|
294
|
-
} = getResizeEventCoordinates(event);
|
|
295
|
-
if (!isPointerDown) {
|
|
296
|
-
const {
|
|
297
|
-
target
|
|
298
|
-
} = event;
|
|
299
|
-
recalculateIntersectingHandles({
|
|
300
|
-
target,
|
|
301
|
-
x,
|
|
302
|
-
y
|
|
303
|
-
});
|
|
304
|
-
}
|
|
305
|
-
updateResizeHandlerStates("move", event), updateCursor(), intersectingHandles.length > 0 && event.preventDefault();
|
|
306
|
-
}
|
|
307
|
-
function handlePointerUp(event) {
|
|
308
|
-
const {
|
|
309
|
-
target
|
|
310
|
-
} = event, {
|
|
311
|
-
x,
|
|
312
|
-
y
|
|
313
|
-
} = getResizeEventCoordinates(event);
|
|
314
|
-
panelConstraintFlags.clear(), isPointerDown = !1, intersectingHandles.length > 0 && event.preventDefault(), updateResizeHandlerStates("up", event), recalculateIntersectingHandles({
|
|
315
|
-
target,
|
|
316
|
-
x,
|
|
317
|
-
y
|
|
318
|
-
}), updateCursor(), updateListeners();
|
|
319
|
-
}
|
|
320
|
-
function recalculateIntersectingHandles({
|
|
321
|
-
target,
|
|
322
|
-
x,
|
|
323
|
-
y
|
|
324
|
-
}) {
|
|
325
|
-
intersectingHandles.splice(0);
|
|
326
|
-
let targetElement = null;
|
|
327
|
-
target instanceof HTMLElement && (targetElement = target), registeredResizeHandlers.forEach((data) => {
|
|
328
|
-
const {
|
|
329
|
-
element: dragHandleElement,
|
|
330
|
-
hitAreaMargins
|
|
331
|
-
} = data, dragHandleRect = dragHandleElement.getBoundingClientRect(), {
|
|
332
|
-
bottom,
|
|
333
|
-
left,
|
|
334
|
-
right,
|
|
335
|
-
top
|
|
336
|
-
} = dragHandleRect, margin = isCoarsePointer ? hitAreaMargins.coarse : hitAreaMargins.fine;
|
|
337
|
-
if (x >= left - margin && x <= right + margin && y >= top - margin && y <= bottom + margin) {
|
|
338
|
-
if (targetElement !== null && dragHandleElement !== targetElement && !dragHandleElement.contains(targetElement) && !targetElement.contains(dragHandleElement) && // Calculating stacking order has a cost, so we should avoid it if possible
|
|
339
|
-
// That is why we only check potentially intersecting handles,
|
|
340
|
-
// and why we skip if the event target is within the handle's DOM
|
|
341
|
-
compare(targetElement, dragHandleElement) > 0) {
|
|
342
|
-
let currentElement = targetElement, didIntersect = !1;
|
|
343
|
-
for (; currentElement && !currentElement.contains(dragHandleElement); ) {
|
|
344
|
-
if (intersects(currentElement.getBoundingClientRect(), dragHandleRect, !0)) {
|
|
345
|
-
didIntersect = !0;
|
|
346
|
-
break;
|
|
347
|
-
}
|
|
348
|
-
currentElement = currentElement.parentElement;
|
|
349
|
-
}
|
|
350
|
-
if (didIntersect)
|
|
351
|
-
return;
|
|
352
|
-
}
|
|
353
|
-
intersectingHandles.push(data);
|
|
354
|
-
}
|
|
355
|
-
});
|
|
356
|
-
}
|
|
357
|
-
function reportConstraintsViolation(resizeHandleId, flag) {
|
|
358
|
-
panelConstraintFlags.set(resizeHandleId, flag);
|
|
359
|
-
}
|
|
360
|
-
function updateCursor() {
|
|
361
|
-
let intersectsHorizontal = !1, intersectsVertical = !1;
|
|
362
|
-
intersectingHandles.forEach((data) => {
|
|
363
|
-
const {
|
|
364
|
-
direction
|
|
365
|
-
} = data;
|
|
366
|
-
direction === "horizontal" ? intersectsHorizontal = !0 : intersectsVertical = !0;
|
|
367
|
-
});
|
|
368
|
-
let constraintFlags = 0;
|
|
369
|
-
panelConstraintFlags.forEach((flag) => {
|
|
370
|
-
constraintFlags |= flag;
|
|
371
|
-
}), intersectsHorizontal && intersectsVertical ? setGlobalCursorStyle("intersection", constraintFlags) : intersectsHorizontal ? setGlobalCursorStyle("horizontal", constraintFlags) : intersectsVertical ? setGlobalCursorStyle("vertical", constraintFlags) : resetGlobalCursorStyle();
|
|
372
|
-
}
|
|
373
|
-
function updateListeners() {
|
|
374
|
-
ownerDocumentCounts.forEach((_, ownerDocument) => {
|
|
375
|
-
const {
|
|
376
|
-
body
|
|
377
|
-
} = ownerDocument;
|
|
378
|
-
body.removeEventListener("contextmenu", handlePointerUp), body.removeEventListener("pointerdown", handlePointerDown), body.removeEventListener("pointerleave", handlePointerMove), body.removeEventListener("pointermove", handlePointerMove);
|
|
379
|
-
}), window.removeEventListener("pointerup", handlePointerUp), window.removeEventListener("pointercancel", handlePointerUp), registeredResizeHandlers.size > 0 && (isPointerDown ? (intersectingHandles.length > 0 && ownerDocumentCounts.forEach((count, ownerDocument) => {
|
|
380
|
-
const {
|
|
381
|
-
body
|
|
382
|
-
} = ownerDocument;
|
|
383
|
-
count > 0 && (body.addEventListener("contextmenu", handlePointerUp), body.addEventListener("pointerleave", handlePointerMove), body.addEventListener("pointermove", handlePointerMove));
|
|
384
|
-
}), window.addEventListener("pointerup", handlePointerUp), window.addEventListener("pointercancel", handlePointerUp)) : ownerDocumentCounts.forEach((count, ownerDocument) => {
|
|
385
|
-
const {
|
|
386
|
-
body
|
|
387
|
-
} = ownerDocument;
|
|
388
|
-
count > 0 && (body.addEventListener("pointerdown", handlePointerDown, {
|
|
389
|
-
capture: !0
|
|
390
|
-
}), body.addEventListener("pointermove", handlePointerMove));
|
|
391
|
-
}));
|
|
392
|
-
}
|
|
393
|
-
function updateResizeHandlerStates(action, event) {
|
|
394
|
-
registeredResizeHandlers.forEach((data) => {
|
|
395
|
-
const {
|
|
396
|
-
setResizeHandlerState
|
|
397
|
-
} = data, isActive = intersectingHandles.includes(data);
|
|
398
|
-
setResizeHandlerState(action, isActive, event);
|
|
399
|
-
});
|
|
400
|
-
}
|
|
401
|
-
function assert(expectedCondition, message) {
|
|
402
|
-
if (!expectedCondition)
|
|
403
|
-
throw console.error(message), Error(message);
|
|
404
|
-
}
|
|
405
|
-
const PRECISION = 10;
|
|
406
|
-
function fuzzyCompareNumbers(actual, expected, fractionDigits = PRECISION) {
|
|
407
|
-
return actual.toFixed(fractionDigits) === expected.toFixed(fractionDigits) ? 0 : actual > expected ? 1 : -1;
|
|
408
|
-
}
|
|
409
|
-
function fuzzyNumbersEqual$1(actual, expected, fractionDigits = PRECISION) {
|
|
410
|
-
return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
|
|
411
|
-
}
|
|
412
|
-
function fuzzyNumbersEqual(actual, expected, fractionDigits) {
|
|
413
|
-
return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
|
|
414
|
-
}
|
|
415
|
-
function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
|
|
416
|
-
if (actual.length !== expected.length)
|
|
417
|
-
return !1;
|
|
418
|
-
for (let index = 0; index < actual.length; index++) {
|
|
419
|
-
const actualSize = actual[index], expectedSize = expected[index];
|
|
420
|
-
if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits))
|
|
421
|
-
return !1;
|
|
422
|
-
}
|
|
423
|
-
return !0;
|
|
424
|
-
}
|
|
425
|
-
function resizePanel({
|
|
426
|
-
panelConstraints: panelConstraintsArray,
|
|
427
|
-
panelIndex,
|
|
428
|
-
size
|
|
429
|
-
}) {
|
|
430
|
-
const panelConstraints = panelConstraintsArray[panelIndex];
|
|
431
|
-
assert(panelConstraints != null, `Panel constraints not found for index ${panelIndex}`);
|
|
432
|
-
let {
|
|
433
|
-
collapsedSize = 0,
|
|
434
|
-
collapsible,
|
|
435
|
-
maxSize = 100,
|
|
436
|
-
minSize = 0
|
|
437
|
-
} = panelConstraints;
|
|
438
|
-
if (fuzzyCompareNumbers(size, minSize) < 0)
|
|
439
|
-
if (collapsible) {
|
|
440
|
-
const halfwayPoint = (collapsedSize + minSize) / 2;
|
|
441
|
-
fuzzyCompareNumbers(size, halfwayPoint) < 0 ? size = collapsedSize : size = minSize;
|
|
442
|
-
} else
|
|
443
|
-
size = minSize;
|
|
444
|
-
return size = Math.min(maxSize, size), size = parseFloat(size.toFixed(PRECISION)), size;
|
|
445
|
-
}
|
|
446
|
-
function adjustLayoutByDelta({
|
|
447
|
-
delta,
|
|
448
|
-
initialLayout,
|
|
449
|
-
panelConstraints: panelConstraintsArray,
|
|
450
|
-
pivotIndices,
|
|
451
|
-
prevLayout,
|
|
452
|
-
trigger
|
|
453
|
-
}) {
|
|
454
|
-
if (fuzzyNumbersEqual(delta, 0))
|
|
455
|
-
return initialLayout;
|
|
456
|
-
const nextLayout = [...initialLayout], [firstPivotIndex, secondPivotIndex] = pivotIndices;
|
|
457
|
-
assert(firstPivotIndex != null, "Invalid first pivot index"), assert(secondPivotIndex != null, "Invalid second pivot index");
|
|
458
|
-
let deltaApplied = 0;
|
|
459
|
-
if (trigger === "keyboard") {
|
|
460
|
-
{
|
|
461
|
-
const index = delta < 0 ? secondPivotIndex : firstPivotIndex, panelConstraints = panelConstraintsArray[index];
|
|
462
|
-
assert(panelConstraints, `Panel constraints not found for index ${index}`);
|
|
463
|
-
const {
|
|
464
|
-
collapsedSize = 0,
|
|
465
|
-
collapsible,
|
|
466
|
-
minSize = 0
|
|
467
|
-
} = panelConstraints;
|
|
468
|
-
if (collapsible) {
|
|
469
|
-
const prevSize = initialLayout[index];
|
|
470
|
-
if (assert(prevSize != null, `Previous layout not found for panel index ${index}`), fuzzyNumbersEqual(prevSize, collapsedSize)) {
|
|
471
|
-
const localDelta = minSize - prevSize;
|
|
472
|
-
fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0 && (delta = delta < 0 ? 0 - localDelta : localDelta);
|
|
473
|
-
}
|
|
474
|
-
}
|
|
475
|
-
}
|
|
476
|
-
{
|
|
477
|
-
const index = delta < 0 ? firstPivotIndex : secondPivotIndex, panelConstraints = panelConstraintsArray[index];
|
|
478
|
-
assert(panelConstraints, `No panel constraints found for index ${index}`);
|
|
479
|
-
const {
|
|
480
|
-
collapsedSize = 0,
|
|
481
|
-
collapsible,
|
|
482
|
-
minSize = 0
|
|
483
|
-
} = panelConstraints;
|
|
484
|
-
if (collapsible) {
|
|
485
|
-
const prevSize = initialLayout[index];
|
|
486
|
-
if (assert(prevSize != null, `Previous layout not found for panel index ${index}`), fuzzyNumbersEqual(prevSize, minSize)) {
|
|
487
|
-
const localDelta = prevSize - collapsedSize;
|
|
488
|
-
fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0 && (delta = delta < 0 ? 0 - localDelta : localDelta);
|
|
489
|
-
}
|
|
490
|
-
}
|
|
491
|
-
}
|
|
492
|
-
}
|
|
493
|
-
{
|
|
494
|
-
const increment = delta < 0 ? 1 : -1;
|
|
495
|
-
let index = delta < 0 ? secondPivotIndex : firstPivotIndex, maxAvailableDelta = 0;
|
|
496
|
-
for (; ; ) {
|
|
497
|
-
const prevSize = initialLayout[index];
|
|
498
|
-
assert(prevSize != null, `Previous layout not found for panel index ${index}`);
|
|
499
|
-
const delta2 = resizePanel({
|
|
500
|
-
panelConstraints: panelConstraintsArray,
|
|
501
|
-
panelIndex: index,
|
|
502
|
-
size: 100
|
|
503
|
-
}) - prevSize;
|
|
504
|
-
if (maxAvailableDelta += delta2, index += increment, index < 0 || index >= panelConstraintsArray.length)
|
|
505
|
-
break;
|
|
506
|
-
}
|
|
507
|
-
const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
|
|
508
|
-
delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
|
|
509
|
-
}
|
|
510
|
-
{
|
|
511
|
-
let index = delta < 0 ? firstPivotIndex : secondPivotIndex;
|
|
512
|
-
for (; index >= 0 && index < panelConstraintsArray.length; ) {
|
|
513
|
-
const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied), prevSize = initialLayout[index];
|
|
514
|
-
assert(prevSize != null, `Previous layout not found for panel index ${index}`);
|
|
515
|
-
const unsafeSize = prevSize - deltaRemaining, safeSize = resizePanel({
|
|
516
|
-
panelConstraints: panelConstraintsArray,
|
|
517
|
-
panelIndex: index,
|
|
518
|
-
size: unsafeSize
|
|
519
|
-
});
|
|
520
|
-
if (!fuzzyNumbersEqual(prevSize, safeSize) && (deltaApplied += prevSize - safeSize, nextLayout[index] = safeSize, deltaApplied.toPrecision(3).localeCompare(Math.abs(delta).toPrecision(3), void 0, {
|
|
521
|
-
numeric: !0
|
|
522
|
-
}) >= 0))
|
|
523
|
-
break;
|
|
524
|
-
delta < 0 ? index-- : index++;
|
|
525
|
-
}
|
|
526
|
-
}
|
|
527
|
-
if (fuzzyLayoutsEqual(prevLayout, nextLayout))
|
|
528
|
-
return prevLayout;
|
|
529
|
-
{
|
|
530
|
-
const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex, prevSize = initialLayout[pivotIndex];
|
|
531
|
-
assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
|
|
532
|
-
const unsafeSize = prevSize + deltaApplied, safeSize = resizePanel({
|
|
533
|
-
panelConstraints: panelConstraintsArray,
|
|
534
|
-
panelIndex: pivotIndex,
|
|
535
|
-
size: unsafeSize
|
|
536
|
-
});
|
|
537
|
-
if (nextLayout[pivotIndex] = safeSize, !fuzzyNumbersEqual(safeSize, unsafeSize)) {
|
|
538
|
-
let deltaRemaining = unsafeSize - safeSize, index = delta < 0 ? secondPivotIndex : firstPivotIndex;
|
|
539
|
-
for (; index >= 0 && index < panelConstraintsArray.length; ) {
|
|
540
|
-
const prevSize2 = nextLayout[index];
|
|
541
|
-
assert(prevSize2 != null, `Previous layout not found for panel index ${index}`);
|
|
542
|
-
const unsafeSize2 = prevSize2 + deltaRemaining, safeSize2 = resizePanel({
|
|
543
|
-
panelConstraints: panelConstraintsArray,
|
|
544
|
-
panelIndex: index,
|
|
545
|
-
size: unsafeSize2
|
|
546
|
-
});
|
|
547
|
-
if (fuzzyNumbersEqual(prevSize2, safeSize2) || (deltaRemaining -= safeSize2 - prevSize2, nextLayout[index] = safeSize2), fuzzyNumbersEqual(deltaRemaining, 0))
|
|
548
|
-
break;
|
|
549
|
-
delta > 0 ? index-- : index++;
|
|
550
|
-
}
|
|
551
|
-
}
|
|
552
|
-
}
|
|
553
|
-
const totalSize = nextLayout.reduce((total, size) => size + total, 0);
|
|
554
|
-
return fuzzyNumbersEqual(totalSize, 100) ? nextLayout : prevLayout;
|
|
555
|
-
}
|
|
556
|
-
function calculateAriaValues({
|
|
557
|
-
layout,
|
|
558
|
-
panelsArray,
|
|
559
|
-
pivotIndices
|
|
560
|
-
}) {
|
|
561
|
-
let currentMinSize = 0, currentMaxSize = 100, totalMinSize = 0, totalMaxSize = 0;
|
|
562
|
-
const firstIndex = pivotIndices[0];
|
|
563
|
-
assert(firstIndex != null, "No pivot index found"), panelsArray.forEach((panelData, index) => {
|
|
564
|
-
const {
|
|
565
|
-
constraints
|
|
566
|
-
} = panelData, {
|
|
567
|
-
maxSize = 100,
|
|
568
|
-
minSize = 0
|
|
569
|
-
} = constraints;
|
|
570
|
-
index === firstIndex ? (currentMinSize = minSize, currentMaxSize = maxSize) : (totalMinSize += minSize, totalMaxSize += maxSize);
|
|
571
|
-
});
|
|
572
|
-
const valueMax = Math.min(currentMaxSize, 100 - totalMinSize), valueMin = Math.max(currentMinSize, 100 - totalMaxSize), valueNow = layout[firstIndex];
|
|
573
|
-
return {
|
|
574
|
-
valueMax,
|
|
575
|
-
valueMin,
|
|
576
|
-
valueNow
|
|
577
|
-
};
|
|
578
|
-
}
|
|
579
|
-
function getResizeHandleElementsForGroup(groupId, scope = document) {
|
|
580
|
-
return Array.from(scope.querySelectorAll(`[data-panel-resize-handle-id][data-panel-group-id="${groupId}"]`));
|
|
581
|
-
}
|
|
582
|
-
function getResizeHandleElementIndex(groupId, id, scope = document) {
|
|
583
|
-
const index = getResizeHandleElementsForGroup(groupId, scope).findIndex((handle) => handle.getAttribute("data-panel-resize-handle-id") === id);
|
|
584
|
-
return index ?? null;
|
|
585
|
-
}
|
|
586
|
-
function determinePivotIndices(groupId, dragHandleId, panelGroupElement) {
|
|
587
|
-
const index = getResizeHandleElementIndex(groupId, dragHandleId, panelGroupElement);
|
|
588
|
-
return index != null ? [index, index + 1] : [-1, -1];
|
|
589
|
-
}
|
|
590
|
-
function getPanelGroupElement(id, rootElement = document) {
|
|
591
|
-
var _dataset;
|
|
592
|
-
if (rootElement instanceof HTMLElement && (rootElement == null || (_dataset = rootElement.dataset) === null || _dataset === void 0 ? void 0 : _dataset.panelGroupId) == id)
|
|
593
|
-
return rootElement;
|
|
594
|
-
const element = rootElement.querySelector(`[data-panel-group][data-panel-group-id="${id}"]`);
|
|
595
|
-
return element || null;
|
|
596
|
-
}
|
|
597
|
-
function getResizeHandleElement(id, scope = document) {
|
|
598
|
-
const element = scope.querySelector(`[data-panel-resize-handle-id="${id}"]`);
|
|
599
|
-
return element || null;
|
|
600
|
-
}
|
|
601
|
-
function getResizeHandlePanelIds(groupId, handleId, panelsArray, scope = document) {
|
|
602
|
-
var _panelsArray$index$id, _panelsArray$index, _panelsArray$id, _panelsArray;
|
|
603
|
-
const handle = getResizeHandleElement(handleId, scope), handles = getResizeHandleElementsForGroup(groupId, scope), index = handle ? handles.indexOf(handle) : -1, idBefore = (_panelsArray$index$id = (_panelsArray$index = panelsArray[index]) === null || _panelsArray$index === void 0 ? void 0 : _panelsArray$index.id) !== null && _panelsArray$index$id !== void 0 ? _panelsArray$index$id : null, idAfter = (_panelsArray$id = (_panelsArray = panelsArray[index + 1]) === null || _panelsArray === void 0 ? void 0 : _panelsArray.id) !== null && _panelsArray$id !== void 0 ? _panelsArray$id : null;
|
|
604
|
-
return [idBefore, idAfter];
|
|
605
|
-
}
|
|
606
|
-
function useWindowSplitterPanelGroupBehavior({
|
|
607
|
-
committedValuesRef,
|
|
608
|
-
eagerValuesRef,
|
|
609
|
-
groupId,
|
|
610
|
-
layout,
|
|
611
|
-
panelDataArray,
|
|
612
|
-
panelGroupElement,
|
|
613
|
-
setLayout
|
|
614
|
-
}) {
|
|
615
|
-
useRef({
|
|
616
|
-
didWarnAboutMissingResizeHandle: !1
|
|
617
|
-
}), useIsomorphicLayoutEffect(() => {
|
|
618
|
-
if (!panelGroupElement)
|
|
619
|
-
return;
|
|
620
|
-
const resizeHandleElements = getResizeHandleElementsForGroup(groupId, panelGroupElement);
|
|
621
|
-
for (let index = 0; index < panelDataArray.length - 1; index++) {
|
|
622
|
-
const {
|
|
623
|
-
valueMax,
|
|
624
|
-
valueMin,
|
|
625
|
-
valueNow
|
|
626
|
-
} = calculateAriaValues({
|
|
627
|
-
layout,
|
|
628
|
-
panelsArray: panelDataArray,
|
|
629
|
-
pivotIndices: [index, index + 1]
|
|
630
|
-
}), resizeHandleElement = resizeHandleElements[index];
|
|
631
|
-
if (resizeHandleElement != null) {
|
|
632
|
-
const panelData = panelDataArray[index];
|
|
633
|
-
assert(panelData, `No panel data found for index "${index}"`), resizeHandleElement.setAttribute("aria-controls", panelData.id), resizeHandleElement.setAttribute("aria-valuemax", "" + Math.round(valueMax)), resizeHandleElement.setAttribute("aria-valuemin", "" + Math.round(valueMin)), resizeHandleElement.setAttribute("aria-valuenow", valueNow != null ? "" + Math.round(valueNow) : "");
|
|
634
|
-
}
|
|
635
|
-
}
|
|
636
|
-
return () => {
|
|
637
|
-
resizeHandleElements.forEach((resizeHandleElement, index) => {
|
|
638
|
-
resizeHandleElement.removeAttribute("aria-controls"), resizeHandleElement.removeAttribute("aria-valuemax"), resizeHandleElement.removeAttribute("aria-valuemin"), resizeHandleElement.removeAttribute("aria-valuenow");
|
|
639
|
-
});
|
|
640
|
-
};
|
|
641
|
-
}, [groupId, layout, panelDataArray, panelGroupElement]), useEffect(() => {
|
|
642
|
-
if (!panelGroupElement)
|
|
643
|
-
return;
|
|
644
|
-
const eagerValues = eagerValuesRef.current;
|
|
645
|
-
assert(eagerValues, "Eager values not found");
|
|
646
|
-
const {
|
|
647
|
-
panelDataArray: panelDataArray2
|
|
648
|
-
} = eagerValues, groupElement = getPanelGroupElement(groupId, panelGroupElement);
|
|
649
|
-
assert(groupElement != null, `No group found for id "${groupId}"`);
|
|
650
|
-
const handles = getResizeHandleElementsForGroup(groupId, panelGroupElement);
|
|
651
|
-
assert(handles, `No resize handles found for group id "${groupId}"`);
|
|
652
|
-
const cleanupFunctions = handles.map((handle) => {
|
|
653
|
-
const handleId = handle.getAttribute("data-panel-resize-handle-id");
|
|
654
|
-
assert(handleId, "Resize handle element has no handle id attribute");
|
|
655
|
-
const [idBefore, idAfter] = getResizeHandlePanelIds(groupId, handleId, panelDataArray2, panelGroupElement);
|
|
656
|
-
if (idBefore == null || idAfter == null)
|
|
657
|
-
return () => {
|
|
658
|
-
};
|
|
659
|
-
const onKeyDown = (event) => {
|
|
660
|
-
if (!event.defaultPrevented)
|
|
661
|
-
switch (event.key) {
|
|
662
|
-
case "Enter": {
|
|
663
|
-
event.preventDefault();
|
|
664
|
-
const index = panelDataArray2.findIndex((panelData) => panelData.id === idBefore);
|
|
665
|
-
if (index >= 0) {
|
|
666
|
-
const panelData = panelDataArray2[index];
|
|
667
|
-
assert(panelData, `No panel data found for index ${index}`);
|
|
668
|
-
const size = layout[index], {
|
|
669
|
-
collapsedSize = 0,
|
|
670
|
-
collapsible,
|
|
671
|
-
minSize = 0
|
|
672
|
-
} = panelData.constraints;
|
|
673
|
-
if (size != null && collapsible) {
|
|
674
|
-
const nextLayout = adjustLayoutByDelta({
|
|
675
|
-
delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
|
|
676
|
-
initialLayout: layout,
|
|
677
|
-
panelConstraints: panelDataArray2.map((panelData2) => panelData2.constraints),
|
|
678
|
-
pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
|
|
679
|
-
prevLayout: layout,
|
|
680
|
-
trigger: "keyboard"
|
|
681
|
-
});
|
|
682
|
-
layout !== nextLayout && setLayout(nextLayout);
|
|
683
|
-
}
|
|
684
|
-
}
|
|
685
|
-
break;
|
|
686
|
-
}
|
|
687
|
-
}
|
|
688
|
-
};
|
|
689
|
-
return handle.addEventListener("keydown", onKeyDown), () => {
|
|
690
|
-
handle.removeEventListener("keydown", onKeyDown);
|
|
691
|
-
};
|
|
692
|
-
});
|
|
693
|
-
return () => {
|
|
694
|
-
cleanupFunctions.forEach((cleanupFunction) => cleanupFunction());
|
|
695
|
-
};
|
|
696
|
-
}, [panelGroupElement, committedValuesRef, eagerValuesRef, groupId, layout, panelDataArray, setLayout]);
|
|
697
|
-
}
|
|
698
|
-
function areEqual(arrayA, arrayB) {
|
|
699
|
-
if (arrayA.length !== arrayB.length)
|
|
700
|
-
return !1;
|
|
701
|
-
for (let index = 0; index < arrayA.length; index++)
|
|
702
|
-
if (arrayA[index] !== arrayB[index])
|
|
703
|
-
return !1;
|
|
704
|
-
return !0;
|
|
705
|
-
}
|
|
706
|
-
function getResizeEventCursorPosition(direction, event) {
|
|
707
|
-
const isHorizontal = direction === "horizontal", {
|
|
708
|
-
x,
|
|
709
|
-
y
|
|
710
|
-
} = getResizeEventCoordinates(event);
|
|
711
|
-
return isHorizontal ? x : y;
|
|
712
|
-
}
|
|
713
|
-
function calculateDragOffsetPercentage(event, dragHandleId, direction, initialDragState, panelGroupElement) {
|
|
714
|
-
const isHorizontal = direction === "horizontal", handleElement = getResizeHandleElement(dragHandleId, panelGroupElement);
|
|
715
|
-
assert(handleElement, `No resize handle element found for id "${dragHandleId}"`);
|
|
716
|
-
const groupId = handleElement.getAttribute("data-panel-group-id");
|
|
717
|
-
assert(groupId, "Resize handle element has no group id attribute");
|
|
718
|
-
let {
|
|
719
|
-
initialCursorPosition
|
|
720
|
-
} = initialDragState;
|
|
721
|
-
const cursorPosition = getResizeEventCursorPosition(direction, event), groupElement = getPanelGroupElement(groupId, panelGroupElement);
|
|
722
|
-
assert(groupElement, `No group element found for id "${groupId}"`);
|
|
723
|
-
const groupRect = groupElement.getBoundingClientRect(), groupSizeInPixels = isHorizontal ? groupRect.width : groupRect.height;
|
|
724
|
-
return (cursorPosition - initialCursorPosition) / groupSizeInPixels * 100;
|
|
725
|
-
}
|
|
726
|
-
function calculateDeltaPercentage(event, dragHandleId, direction, initialDragState, keyboardResizeBy, panelGroupElement) {
|
|
727
|
-
if (isKeyDown(event)) {
|
|
728
|
-
const isHorizontal = direction === "horizontal";
|
|
729
|
-
let delta = 0;
|
|
730
|
-
event.shiftKey ? delta = 100 : keyboardResizeBy != null ? delta = keyboardResizeBy : delta = 10;
|
|
731
|
-
let movement = 0;
|
|
732
|
-
switch (event.key) {
|
|
733
|
-
case "ArrowDown":
|
|
734
|
-
movement = isHorizontal ? 0 : delta;
|
|
735
|
-
break;
|
|
736
|
-
case "ArrowLeft":
|
|
737
|
-
movement = isHorizontal ? -delta : 0;
|
|
738
|
-
break;
|
|
739
|
-
case "ArrowRight":
|
|
740
|
-
movement = isHorizontal ? delta : 0;
|
|
741
|
-
break;
|
|
742
|
-
case "ArrowUp":
|
|
743
|
-
movement = isHorizontal ? 0 : -delta;
|
|
744
|
-
break;
|
|
745
|
-
case "End":
|
|
746
|
-
movement = 100;
|
|
747
|
-
break;
|
|
748
|
-
case "Home":
|
|
749
|
-
movement = -100;
|
|
750
|
-
break;
|
|
751
|
-
}
|
|
752
|
-
return movement;
|
|
753
|
-
} else
|
|
754
|
-
return initialDragState == null ? 0 : calculateDragOffsetPercentage(event, dragHandleId, direction, initialDragState, panelGroupElement);
|
|
755
|
-
}
|
|
756
|
-
function calculateUnsafeDefaultLayout({
|
|
757
|
-
panelDataArray
|
|
758
|
-
}) {
|
|
759
|
-
const layout = Array(panelDataArray.length), panelConstraintsArray = panelDataArray.map((panelData) => panelData.constraints);
|
|
760
|
-
let numPanelsWithSizes = 0, remainingSize = 100;
|
|
761
|
-
for (let index = 0; index < panelDataArray.length; index++) {
|
|
762
|
-
const panelConstraints = panelConstraintsArray[index];
|
|
763
|
-
assert(panelConstraints, `Panel constraints not found for index ${index}`);
|
|
764
|
-
const {
|
|
765
|
-
defaultSize
|
|
766
|
-
} = panelConstraints;
|
|
767
|
-
defaultSize != null && (numPanelsWithSizes++, layout[index] = defaultSize, remainingSize -= defaultSize);
|
|
768
|
-
}
|
|
769
|
-
for (let index = 0; index < panelDataArray.length; index++) {
|
|
770
|
-
const panelConstraints = panelConstraintsArray[index];
|
|
771
|
-
assert(panelConstraints, `Panel constraints not found for index ${index}`);
|
|
772
|
-
const {
|
|
773
|
-
defaultSize
|
|
774
|
-
} = panelConstraints;
|
|
775
|
-
if (defaultSize != null)
|
|
776
|
-
continue;
|
|
777
|
-
const numRemainingPanels = panelDataArray.length - numPanelsWithSizes, size = remainingSize / numRemainingPanels;
|
|
778
|
-
numPanelsWithSizes++, layout[index] = size, remainingSize -= size;
|
|
779
|
-
}
|
|
780
|
-
return layout;
|
|
781
|
-
}
|
|
782
|
-
function callPanelCallbacks(panelsArray, layout, panelIdToLastNotifiedSizeMap) {
|
|
783
|
-
layout.forEach((size, index) => {
|
|
784
|
-
const panelData = panelsArray[index];
|
|
785
|
-
assert(panelData, `Panel data not found for index ${index}`);
|
|
786
|
-
const {
|
|
787
|
-
callbacks,
|
|
788
|
-
constraints,
|
|
789
|
-
id: panelId
|
|
790
|
-
} = panelData, {
|
|
791
|
-
collapsedSize = 0,
|
|
792
|
-
collapsible
|
|
793
|
-
} = constraints, lastNotifiedSize = panelIdToLastNotifiedSizeMap[panelId];
|
|
794
|
-
if (lastNotifiedSize == null || size !== lastNotifiedSize) {
|
|
795
|
-
panelIdToLastNotifiedSizeMap[panelId] = size;
|
|
796
|
-
const {
|
|
797
|
-
onCollapse,
|
|
798
|
-
onExpand,
|
|
799
|
-
onResize
|
|
800
|
-
} = callbacks;
|
|
801
|
-
onResize && onResize(size, lastNotifiedSize), collapsible && (onCollapse || onExpand) && (onExpand && (lastNotifiedSize == null || fuzzyNumbersEqual$1(lastNotifiedSize, collapsedSize)) && !fuzzyNumbersEqual$1(size, collapsedSize) && onExpand(), onCollapse && (lastNotifiedSize == null || !fuzzyNumbersEqual$1(lastNotifiedSize, collapsedSize)) && fuzzyNumbersEqual$1(size, collapsedSize) && onCollapse());
|
|
802
|
-
}
|
|
803
|
-
});
|
|
804
|
-
}
|
|
805
|
-
function compareLayouts(a, b) {
|
|
806
|
-
if (a.length !== b.length)
|
|
807
|
-
return !1;
|
|
808
|
-
for (let index = 0; index < a.length; index++)
|
|
809
|
-
if (a[index] != b[index])
|
|
810
|
-
return !1;
|
|
811
|
-
return !0;
|
|
812
|
-
}
|
|
813
|
-
function computePanelFlexBoxStyle({
|
|
814
|
-
defaultSize,
|
|
815
|
-
dragState,
|
|
816
|
-
layout,
|
|
817
|
-
panelData,
|
|
818
|
-
panelIndex,
|
|
819
|
-
precision = 3
|
|
820
|
-
}) {
|
|
821
|
-
const size = layout[panelIndex];
|
|
822
|
-
let flexGrow;
|
|
823
|
-
return size == null ? flexGrow = defaultSize != null ? defaultSize.toPrecision(precision) : "1" : panelData.length === 1 ? flexGrow = "1" : flexGrow = size.toPrecision(precision), {
|
|
824
|
-
flexBasis: 0,
|
|
825
|
-
flexGrow,
|
|
826
|
-
flexShrink: 1,
|
|
827
|
-
// Without this, Panel sizes may be unintentionally overridden by their content
|
|
828
|
-
overflow: "hidden",
|
|
829
|
-
// Disable pointer events inside of a panel during resize
|
|
830
|
-
// This avoid edge cases like nested iframes
|
|
831
|
-
pointerEvents: dragState !== null ? "none" : void 0
|
|
832
|
-
};
|
|
833
|
-
}
|
|
834
|
-
function debounce(callback, durationMs = 10) {
|
|
835
|
-
let timeoutId = null;
|
|
836
|
-
return (...args) => {
|
|
837
|
-
timeoutId !== null && clearTimeout(timeoutId), timeoutId = setTimeout(() => {
|
|
838
|
-
callback(...args);
|
|
839
|
-
}, durationMs);
|
|
840
|
-
};
|
|
841
|
-
}
|
|
842
|
-
function initializeDefaultStorage(storageObject) {
|
|
843
|
-
try {
|
|
844
|
-
if (typeof localStorage < "u")
|
|
845
|
-
storageObject.getItem = (name) => localStorage.getItem(name), storageObject.setItem = (name, value) => {
|
|
846
|
-
localStorage.setItem(name, value);
|
|
847
|
-
};
|
|
848
|
-
else
|
|
849
|
-
throw new Error("localStorage not supported in this environment");
|
|
850
|
-
} catch (error) {
|
|
851
|
-
console.error(error), storageObject.getItem = () => null, storageObject.setItem = () => {
|
|
852
|
-
};
|
|
853
|
-
}
|
|
854
|
-
}
|
|
855
|
-
function getPanelGroupKey(autoSaveId) {
|
|
856
|
-
return `react-resizable-panels:${autoSaveId}`;
|
|
857
|
-
}
|
|
858
|
-
function getPanelKey(panels) {
|
|
859
|
-
return panels.map((panel) => {
|
|
860
|
-
const {
|
|
861
|
-
constraints,
|
|
862
|
-
id,
|
|
863
|
-
idIsFromProps,
|
|
864
|
-
order
|
|
865
|
-
} = panel;
|
|
866
|
-
return idIsFromProps ? id : order ? `${order}:${JSON.stringify(constraints)}` : JSON.stringify(constraints);
|
|
867
|
-
}).sort((a, b) => a.localeCompare(b)).join(",");
|
|
868
|
-
}
|
|
869
|
-
function loadSerializedPanelGroupState(autoSaveId, storage) {
|
|
870
|
-
try {
|
|
871
|
-
const panelGroupKey = getPanelGroupKey(autoSaveId), serialized = storage.getItem(panelGroupKey);
|
|
872
|
-
if (serialized) {
|
|
873
|
-
const parsed = JSON.parse(serialized);
|
|
874
|
-
if (typeof parsed == "object" && parsed != null)
|
|
875
|
-
return parsed;
|
|
876
|
-
}
|
|
877
|
-
} catch {
|
|
878
|
-
}
|
|
879
|
-
return null;
|
|
880
|
-
}
|
|
881
|
-
function loadPanelGroupState(autoSaveId, panels, storage) {
|
|
882
|
-
var _loadSerializedPanelG, _state$panelKey;
|
|
883
|
-
const state = (_loadSerializedPanelG = loadSerializedPanelGroupState(autoSaveId, storage)) !== null && _loadSerializedPanelG !== void 0 ? _loadSerializedPanelG : {}, panelKey = getPanelKey(panels);
|
|
884
|
-
return (_state$panelKey = state[panelKey]) !== null && _state$panelKey !== void 0 ? _state$panelKey : null;
|
|
885
|
-
}
|
|
886
|
-
function savePanelGroupState(autoSaveId, panels, panelSizesBeforeCollapse, sizes, storage) {
|
|
887
|
-
var _loadSerializedPanelG2;
|
|
888
|
-
const panelGroupKey = getPanelGroupKey(autoSaveId), panelKey = getPanelKey(panels), state = (_loadSerializedPanelG2 = loadSerializedPanelGroupState(autoSaveId, storage)) !== null && _loadSerializedPanelG2 !== void 0 ? _loadSerializedPanelG2 : {};
|
|
889
|
-
state[panelKey] = {
|
|
890
|
-
expandToSizes: Object.fromEntries(panelSizesBeforeCollapse.entries()),
|
|
891
|
-
layout: sizes
|
|
892
|
-
};
|
|
893
|
-
try {
|
|
894
|
-
storage.setItem(panelGroupKey, JSON.stringify(state));
|
|
895
|
-
} catch (error) {
|
|
896
|
-
console.error(error);
|
|
897
|
-
}
|
|
898
|
-
}
|
|
899
|
-
function validatePanelGroupLayout({
|
|
900
|
-
layout: prevLayout,
|
|
901
|
-
panelConstraints
|
|
902
|
-
}) {
|
|
903
|
-
const nextLayout = [...prevLayout], nextLayoutTotalSize = nextLayout.reduce((accumulated, current) => accumulated + current, 0);
|
|
904
|
-
if (nextLayout.length !== panelConstraints.length)
|
|
905
|
-
throw Error(`Invalid ${panelConstraints.length} panel layout: ${nextLayout.map((size) => `${size}%`).join(", ")}`);
|
|
906
|
-
if (!fuzzyNumbersEqual(nextLayoutTotalSize, 100))
|
|
907
|
-
for (let index = 0; index < panelConstraints.length; index++) {
|
|
908
|
-
const unsafeSize = nextLayout[index];
|
|
909
|
-
assert(unsafeSize != null, `No layout data found for index ${index}`);
|
|
910
|
-
const safeSize = 100 / nextLayoutTotalSize * unsafeSize;
|
|
911
|
-
nextLayout[index] = safeSize;
|
|
912
|
-
}
|
|
913
|
-
let remainingSize = 0;
|
|
914
|
-
for (let index = 0; index < panelConstraints.length; index++) {
|
|
915
|
-
const unsafeSize = nextLayout[index];
|
|
916
|
-
assert(unsafeSize != null, `No layout data found for index ${index}`);
|
|
917
|
-
const safeSize = resizePanel({
|
|
918
|
-
panelConstraints,
|
|
919
|
-
panelIndex: index,
|
|
920
|
-
size: unsafeSize
|
|
921
|
-
});
|
|
922
|
-
unsafeSize != safeSize && (remainingSize += unsafeSize - safeSize, nextLayout[index] = safeSize);
|
|
923
|
-
}
|
|
924
|
-
if (!fuzzyNumbersEqual(remainingSize, 0))
|
|
925
|
-
for (let index = 0; index < panelConstraints.length; index++) {
|
|
926
|
-
const prevSize = nextLayout[index];
|
|
927
|
-
assert(prevSize != null, `No layout data found for index ${index}`);
|
|
928
|
-
const unsafeSize = prevSize + remainingSize, safeSize = resizePanel({
|
|
929
|
-
panelConstraints,
|
|
930
|
-
panelIndex: index,
|
|
931
|
-
size: unsafeSize
|
|
932
|
-
});
|
|
933
|
-
if (prevSize !== safeSize && (remainingSize -= safeSize - prevSize, nextLayout[index] = safeSize, fuzzyNumbersEqual(remainingSize, 0)))
|
|
934
|
-
break;
|
|
935
|
-
}
|
|
936
|
-
return nextLayout;
|
|
937
|
-
}
|
|
938
|
-
const LOCAL_STORAGE_DEBOUNCE_INTERVAL = 100, defaultStorage = {
|
|
939
|
-
getItem: (name) => (initializeDefaultStorage(defaultStorage), defaultStorage.getItem(name)),
|
|
940
|
-
setItem: (name, value) => {
|
|
941
|
-
initializeDefaultStorage(defaultStorage), defaultStorage.setItem(name, value);
|
|
942
|
-
}
|
|
943
|
-
}, debounceMap = {};
|
|
944
|
-
function PanelGroupWithForwardedRef({
|
|
945
|
-
autoSaveId = null,
|
|
946
|
-
children,
|
|
947
|
-
className: classNameFromProps = "",
|
|
948
|
-
direction,
|
|
949
|
-
forwardedRef,
|
|
950
|
-
id: idFromProps = null,
|
|
951
|
-
onLayout = null,
|
|
952
|
-
keyboardResizeBy = null,
|
|
953
|
-
storage = defaultStorage,
|
|
954
|
-
style: styleFromProps,
|
|
955
|
-
tagName: Type = "div",
|
|
956
|
-
...rest
|
|
957
|
-
}) {
|
|
958
|
-
const groupId = useUniqueId(idFromProps), panelGroupElementRef = useRef(null), [dragState, setDragState] = useState(null), [layout, setLayout] = useState([]), panelIdToLastNotifiedSizeMapRef = useRef({}), panelSizeBeforeCollapseRef = useRef(/* @__PURE__ */ new Map()), prevDeltaRef = useRef(0), committedValuesRef = useRef({
|
|
959
|
-
autoSaveId,
|
|
960
|
-
direction,
|
|
961
|
-
dragState,
|
|
962
|
-
id: groupId,
|
|
963
|
-
keyboardResizeBy,
|
|
964
|
-
onLayout,
|
|
965
|
-
storage
|
|
966
|
-
}), eagerValuesRef = useRef({
|
|
967
|
-
layout,
|
|
968
|
-
panelDataArray: [],
|
|
969
|
-
panelDataArrayChanged: !1
|
|
970
|
-
});
|
|
971
|
-
useRef({
|
|
972
|
-
didLogIdAndOrderWarning: !1,
|
|
973
|
-
didLogPanelConstraintsWarning: !1,
|
|
974
|
-
prevPanelIds: []
|
|
975
|
-
}), useImperativeHandle(forwardedRef, () => ({
|
|
976
|
-
getId: () => committedValuesRef.current.id,
|
|
977
|
-
getLayout: () => {
|
|
978
|
-
const {
|
|
979
|
-
layout: layout2
|
|
980
|
-
} = eagerValuesRef.current;
|
|
981
|
-
return layout2;
|
|
982
|
-
},
|
|
983
|
-
setLayout: (unsafeLayout) => {
|
|
984
|
-
const {
|
|
985
|
-
onLayout: onLayout2
|
|
986
|
-
} = committedValuesRef.current, {
|
|
987
|
-
layout: prevLayout,
|
|
988
|
-
panelDataArray
|
|
989
|
-
} = eagerValuesRef.current, safeLayout = validatePanelGroupLayout({
|
|
990
|
-
layout: unsafeLayout,
|
|
991
|
-
panelConstraints: panelDataArray.map((panelData) => panelData.constraints)
|
|
992
|
-
});
|
|
993
|
-
areEqual(prevLayout, safeLayout) || (setLayout(safeLayout), eagerValuesRef.current.layout = safeLayout, onLayout2 && onLayout2(safeLayout), callPanelCallbacks(panelDataArray, safeLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
994
|
-
}
|
|
995
|
-
}), []), useIsomorphicLayoutEffect(() => {
|
|
996
|
-
committedValuesRef.current.autoSaveId = autoSaveId, committedValuesRef.current.direction = direction, committedValuesRef.current.dragState = dragState, committedValuesRef.current.id = groupId, committedValuesRef.current.onLayout = onLayout, committedValuesRef.current.storage = storage;
|
|
997
|
-
}), useWindowSplitterPanelGroupBehavior({
|
|
998
|
-
committedValuesRef,
|
|
999
|
-
eagerValuesRef,
|
|
1000
|
-
groupId,
|
|
1001
|
-
layout,
|
|
1002
|
-
panelDataArray: eagerValuesRef.current.panelDataArray,
|
|
1003
|
-
setLayout,
|
|
1004
|
-
panelGroupElement: panelGroupElementRef.current
|
|
1005
|
-
}), useEffect(() => {
|
|
1006
|
-
const {
|
|
1007
|
-
panelDataArray
|
|
1008
|
-
} = eagerValuesRef.current;
|
|
1009
|
-
if (autoSaveId) {
|
|
1010
|
-
if (layout.length === 0 || layout.length !== panelDataArray.length)
|
|
1011
|
-
return;
|
|
1012
|
-
let debouncedSave = debounceMap[autoSaveId];
|
|
1013
|
-
debouncedSave == null && (debouncedSave = debounce(savePanelGroupState, LOCAL_STORAGE_DEBOUNCE_INTERVAL), debounceMap[autoSaveId] = debouncedSave);
|
|
1014
|
-
const clonedPanelDataArray = [...panelDataArray], clonedPanelSizesBeforeCollapse = new Map(panelSizeBeforeCollapseRef.current);
|
|
1015
|
-
debouncedSave(autoSaveId, clonedPanelDataArray, clonedPanelSizesBeforeCollapse, layout, storage);
|
|
1016
|
-
}
|
|
1017
|
-
}, [autoSaveId, layout, storage]), useEffect(() => {
|
|
1018
|
-
});
|
|
1019
|
-
const collapsePanel = useCallback((panelData) => {
|
|
1020
|
-
const {
|
|
1021
|
-
onLayout: onLayout2
|
|
1022
|
-
} = committedValuesRef.current, {
|
|
1023
|
-
layout: prevLayout,
|
|
1024
|
-
panelDataArray
|
|
1025
|
-
} = eagerValuesRef.current;
|
|
1026
|
-
if (panelData.constraints.collapsible) {
|
|
1027
|
-
const panelConstraintsArray = panelDataArray.map((panelData2) => panelData2.constraints), {
|
|
1028
|
-
collapsedSize = 0,
|
|
1029
|
-
panelSize,
|
|
1030
|
-
pivotIndices
|
|
1031
|
-
} = panelDataHelper(panelDataArray, panelData, prevLayout);
|
|
1032
|
-
if (assert(panelSize != null, `Panel size not found for panel "${panelData.id}"`), !fuzzyNumbersEqual$1(panelSize, collapsedSize)) {
|
|
1033
|
-
panelSizeBeforeCollapseRef.current.set(panelData.id, panelSize);
|
|
1034
|
-
const delta = findPanelDataIndex(panelDataArray, panelData) === panelDataArray.length - 1 ? panelSize - collapsedSize : collapsedSize - panelSize, nextLayout = adjustLayoutByDelta({
|
|
1035
|
-
delta,
|
|
1036
|
-
initialLayout: prevLayout,
|
|
1037
|
-
panelConstraints: panelConstraintsArray,
|
|
1038
|
-
pivotIndices,
|
|
1039
|
-
prevLayout,
|
|
1040
|
-
trigger: "imperative-api"
|
|
1041
|
-
});
|
|
1042
|
-
compareLayouts(prevLayout, nextLayout) || (setLayout(nextLayout), eagerValuesRef.current.layout = nextLayout, onLayout2 && onLayout2(nextLayout), callPanelCallbacks(panelDataArray, nextLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
1043
|
-
}
|
|
1044
|
-
}
|
|
1045
|
-
}, []), expandPanel = useCallback((panelData, minSizeOverride) => {
|
|
1046
|
-
const {
|
|
1047
|
-
onLayout: onLayout2
|
|
1048
|
-
} = committedValuesRef.current, {
|
|
1049
|
-
layout: prevLayout,
|
|
1050
|
-
panelDataArray
|
|
1051
|
-
} = eagerValuesRef.current;
|
|
1052
|
-
if (panelData.constraints.collapsible) {
|
|
1053
|
-
const panelConstraintsArray = panelDataArray.map((panelData2) => panelData2.constraints), {
|
|
1054
|
-
collapsedSize = 0,
|
|
1055
|
-
panelSize = 0,
|
|
1056
|
-
minSize: minSizeFromProps = 0,
|
|
1057
|
-
pivotIndices
|
|
1058
|
-
} = panelDataHelper(panelDataArray, panelData, prevLayout), minSize = minSizeOverride ?? minSizeFromProps;
|
|
1059
|
-
if (fuzzyNumbersEqual$1(panelSize, collapsedSize)) {
|
|
1060
|
-
const prevPanelSize = panelSizeBeforeCollapseRef.current.get(panelData.id), baseSize = prevPanelSize != null && prevPanelSize >= minSize ? prevPanelSize : minSize, delta = findPanelDataIndex(panelDataArray, panelData) === panelDataArray.length - 1 ? panelSize - baseSize : baseSize - panelSize, nextLayout = adjustLayoutByDelta({
|
|
1061
|
-
delta,
|
|
1062
|
-
initialLayout: prevLayout,
|
|
1063
|
-
panelConstraints: panelConstraintsArray,
|
|
1064
|
-
pivotIndices,
|
|
1065
|
-
prevLayout,
|
|
1066
|
-
trigger: "imperative-api"
|
|
1067
|
-
});
|
|
1068
|
-
compareLayouts(prevLayout, nextLayout) || (setLayout(nextLayout), eagerValuesRef.current.layout = nextLayout, onLayout2 && onLayout2(nextLayout), callPanelCallbacks(panelDataArray, nextLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
1069
|
-
}
|
|
1070
|
-
}
|
|
1071
|
-
}, []), getPanelSize = useCallback((panelData) => {
|
|
1072
|
-
const {
|
|
1073
|
-
layout: layout2,
|
|
1074
|
-
panelDataArray
|
|
1075
|
-
} = eagerValuesRef.current, {
|
|
1076
|
-
panelSize
|
|
1077
|
-
} = panelDataHelper(panelDataArray, panelData, layout2);
|
|
1078
|
-
return assert(panelSize != null, `Panel size not found for panel "${panelData.id}"`), panelSize;
|
|
1079
|
-
}, []), getPanelStyle = useCallback((panelData, defaultSize) => {
|
|
1080
|
-
const {
|
|
1081
|
-
panelDataArray
|
|
1082
|
-
} = eagerValuesRef.current, panelIndex = findPanelDataIndex(panelDataArray, panelData);
|
|
1083
|
-
return computePanelFlexBoxStyle({
|
|
1084
|
-
defaultSize,
|
|
1085
|
-
dragState,
|
|
1086
|
-
layout,
|
|
1087
|
-
panelData: panelDataArray,
|
|
1088
|
-
panelIndex
|
|
1089
|
-
});
|
|
1090
|
-
}, [dragState, layout]), isPanelCollapsed = useCallback((panelData) => {
|
|
1091
|
-
const {
|
|
1092
|
-
layout: layout2,
|
|
1093
|
-
panelDataArray
|
|
1094
|
-
} = eagerValuesRef.current, {
|
|
1095
|
-
collapsedSize = 0,
|
|
1096
|
-
collapsible,
|
|
1097
|
-
panelSize
|
|
1098
|
-
} = panelDataHelper(panelDataArray, panelData, layout2);
|
|
1099
|
-
return assert(panelSize != null, `Panel size not found for panel "${panelData.id}"`), collapsible === !0 && fuzzyNumbersEqual$1(panelSize, collapsedSize);
|
|
1100
|
-
}, []), isPanelExpanded = useCallback((panelData) => {
|
|
1101
|
-
const {
|
|
1102
|
-
layout: layout2,
|
|
1103
|
-
panelDataArray
|
|
1104
|
-
} = eagerValuesRef.current, {
|
|
1105
|
-
collapsedSize = 0,
|
|
1106
|
-
collapsible,
|
|
1107
|
-
panelSize
|
|
1108
|
-
} = panelDataHelper(panelDataArray, panelData, layout2);
|
|
1109
|
-
return assert(panelSize != null, `Panel size not found for panel "${panelData.id}"`), !collapsible || fuzzyCompareNumbers(panelSize, collapsedSize) > 0;
|
|
1110
|
-
}, []), registerPanel = useCallback((panelData) => {
|
|
1111
|
-
const {
|
|
1112
|
-
panelDataArray
|
|
1113
|
-
} = eagerValuesRef.current;
|
|
1114
|
-
panelDataArray.push(panelData), panelDataArray.sort((panelA, panelB) => {
|
|
1115
|
-
const orderA = panelA.order, orderB = panelB.order;
|
|
1116
|
-
return orderA == null && orderB == null ? 0 : orderA == null ? -1 : orderB == null ? 1 : orderA - orderB;
|
|
1117
|
-
}), eagerValuesRef.current.panelDataArrayChanged = !0;
|
|
1118
|
-
}, []);
|
|
1119
|
-
useIsomorphicLayoutEffect(() => {
|
|
1120
|
-
if (eagerValuesRef.current.panelDataArrayChanged) {
|
|
1121
|
-
eagerValuesRef.current.panelDataArrayChanged = !1;
|
|
1122
|
-
const {
|
|
1123
|
-
autoSaveId: autoSaveId2,
|
|
1124
|
-
onLayout: onLayout2,
|
|
1125
|
-
storage: storage2
|
|
1126
|
-
} = committedValuesRef.current, {
|
|
1127
|
-
layout: prevLayout,
|
|
1128
|
-
panelDataArray
|
|
1129
|
-
} = eagerValuesRef.current;
|
|
1130
|
-
let unsafeLayout = null;
|
|
1131
|
-
if (autoSaveId2) {
|
|
1132
|
-
const state = loadPanelGroupState(autoSaveId2, panelDataArray, storage2);
|
|
1133
|
-
state && (panelSizeBeforeCollapseRef.current = new Map(Object.entries(state.expandToSizes)), unsafeLayout = state.layout);
|
|
1134
|
-
}
|
|
1135
|
-
unsafeLayout == null && (unsafeLayout = calculateUnsafeDefaultLayout({
|
|
1136
|
-
panelDataArray
|
|
1137
|
-
}));
|
|
1138
|
-
const nextLayout = validatePanelGroupLayout({
|
|
1139
|
-
layout: unsafeLayout,
|
|
1140
|
-
panelConstraints: panelDataArray.map((panelData) => panelData.constraints)
|
|
1141
|
-
});
|
|
1142
|
-
areEqual(prevLayout, nextLayout) || (setLayout(nextLayout), eagerValuesRef.current.layout = nextLayout, onLayout2 && onLayout2(nextLayout), callPanelCallbacks(panelDataArray, nextLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
1143
|
-
}
|
|
1144
|
-
}), useIsomorphicLayoutEffect(() => {
|
|
1145
|
-
const eagerValues = eagerValuesRef.current;
|
|
1146
|
-
return () => {
|
|
1147
|
-
eagerValues.layout = [];
|
|
1148
|
-
};
|
|
1149
|
-
}, []);
|
|
1150
|
-
const registerResizeHandle2 = useCallback((dragHandleId) => function(event) {
|
|
1151
|
-
event.preventDefault();
|
|
1152
|
-
const panelGroupElement = panelGroupElementRef.current;
|
|
1153
|
-
if (!panelGroupElement)
|
|
1154
|
-
return () => null;
|
|
1155
|
-
const {
|
|
1156
|
-
direction: direction2,
|
|
1157
|
-
dragState: dragState2,
|
|
1158
|
-
id: groupId2,
|
|
1159
|
-
keyboardResizeBy: keyboardResizeBy2,
|
|
1160
|
-
onLayout: onLayout2
|
|
1161
|
-
} = committedValuesRef.current, {
|
|
1162
|
-
layout: prevLayout,
|
|
1163
|
-
panelDataArray
|
|
1164
|
-
} = eagerValuesRef.current, {
|
|
1165
|
-
initialLayout
|
|
1166
|
-
} = dragState2 ?? {}, pivotIndices = determinePivotIndices(groupId2, dragHandleId, panelGroupElement);
|
|
1167
|
-
let delta = calculateDeltaPercentage(event, dragHandleId, direction2, dragState2, keyboardResizeBy2, panelGroupElement);
|
|
1168
|
-
if (delta === 0)
|
|
1169
|
-
return;
|
|
1170
|
-
const isHorizontal = direction2 === "horizontal";
|
|
1171
|
-
document.dir === "rtl" && isHorizontal && (delta = -delta);
|
|
1172
|
-
const panelConstraints = panelDataArray.map((panelData) => panelData.constraints), nextLayout = adjustLayoutByDelta({
|
|
1173
|
-
delta,
|
|
1174
|
-
initialLayout: initialLayout ?? prevLayout,
|
|
1175
|
-
panelConstraints,
|
|
1176
|
-
pivotIndices,
|
|
1177
|
-
prevLayout,
|
|
1178
|
-
trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
|
|
1179
|
-
}), layoutChanged = !compareLayouts(prevLayout, nextLayout);
|
|
1180
|
-
(isPointerEvent(event) || isMouseEvent(event)) && prevDeltaRef.current != delta && (prevDeltaRef.current = delta, layoutChanged ? reportConstraintsViolation(dragHandleId, 0) : isHorizontal ? reportConstraintsViolation(dragHandleId, delta < 0 ? EXCEEDED_HORIZONTAL_MIN : EXCEEDED_HORIZONTAL_MAX) : reportConstraintsViolation(dragHandleId, delta < 0 ? EXCEEDED_VERTICAL_MIN : EXCEEDED_VERTICAL_MAX)), layoutChanged && (setLayout(nextLayout), eagerValuesRef.current.layout = nextLayout, onLayout2 && onLayout2(nextLayout), callPanelCallbacks(panelDataArray, nextLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
1181
|
-
}, []), resizePanel2 = useCallback((panelData, unsafePanelSize) => {
|
|
1182
|
-
const {
|
|
1183
|
-
onLayout: onLayout2
|
|
1184
|
-
} = committedValuesRef.current, {
|
|
1185
|
-
layout: prevLayout,
|
|
1186
|
-
panelDataArray
|
|
1187
|
-
} = eagerValuesRef.current, panelConstraintsArray = panelDataArray.map((panelData2) => panelData2.constraints), {
|
|
1188
|
-
panelSize,
|
|
1189
|
-
pivotIndices
|
|
1190
|
-
} = panelDataHelper(panelDataArray, panelData, prevLayout);
|
|
1191
|
-
assert(panelSize != null, `Panel size not found for panel "${panelData.id}"`);
|
|
1192
|
-
const delta = findPanelDataIndex(panelDataArray, panelData) === panelDataArray.length - 1 ? panelSize - unsafePanelSize : unsafePanelSize - panelSize, nextLayout = adjustLayoutByDelta({
|
|
1193
|
-
delta,
|
|
1194
|
-
initialLayout: prevLayout,
|
|
1195
|
-
panelConstraints: panelConstraintsArray,
|
|
1196
|
-
pivotIndices,
|
|
1197
|
-
prevLayout,
|
|
1198
|
-
trigger: "imperative-api"
|
|
1199
|
-
});
|
|
1200
|
-
compareLayouts(prevLayout, nextLayout) || (setLayout(nextLayout), eagerValuesRef.current.layout = nextLayout, onLayout2 && onLayout2(nextLayout), callPanelCallbacks(panelDataArray, nextLayout, panelIdToLastNotifiedSizeMapRef.current));
|
|
1201
|
-
}, []), reevaluatePanelConstraints = useCallback((panelData, prevConstraints) => {
|
|
1202
|
-
const {
|
|
1203
|
-
layout: layout2,
|
|
1204
|
-
panelDataArray
|
|
1205
|
-
} = eagerValuesRef.current, {
|
|
1206
|
-
collapsedSize: prevCollapsedSize = 0,
|
|
1207
|
-
collapsible: prevCollapsible
|
|
1208
|
-
} = prevConstraints, {
|
|
1209
|
-
collapsedSize: nextCollapsedSize = 0,
|
|
1210
|
-
collapsible: nextCollapsible,
|
|
1211
|
-
maxSize: nextMaxSize = 100,
|
|
1212
|
-
minSize: nextMinSize = 0
|
|
1213
|
-
} = panelData.constraints, {
|
|
1214
|
-
panelSize: prevPanelSize
|
|
1215
|
-
} = panelDataHelper(panelDataArray, panelData, layout2);
|
|
1216
|
-
prevPanelSize != null && (prevCollapsible && nextCollapsible && fuzzyNumbersEqual$1(prevPanelSize, prevCollapsedSize) ? fuzzyNumbersEqual$1(prevCollapsedSize, nextCollapsedSize) || resizePanel2(panelData, nextCollapsedSize) : prevPanelSize < nextMinSize ? resizePanel2(panelData, nextMinSize) : prevPanelSize > nextMaxSize && resizePanel2(panelData, nextMaxSize));
|
|
1217
|
-
}, [resizePanel2]), startDragging = useCallback((dragHandleId, event) => {
|
|
1218
|
-
const {
|
|
1219
|
-
direction: direction2
|
|
1220
|
-
} = committedValuesRef.current, {
|
|
1221
|
-
layout: layout2
|
|
1222
|
-
} = eagerValuesRef.current;
|
|
1223
|
-
if (!panelGroupElementRef.current)
|
|
1224
|
-
return;
|
|
1225
|
-
const handleElement = getResizeHandleElement(dragHandleId, panelGroupElementRef.current);
|
|
1226
|
-
assert(handleElement, `Drag handle element not found for id "${dragHandleId}"`);
|
|
1227
|
-
const initialCursorPosition = getResizeEventCursorPosition(direction2, event);
|
|
1228
|
-
setDragState({
|
|
1229
|
-
dragHandleId,
|
|
1230
|
-
dragHandleRect: handleElement.getBoundingClientRect(),
|
|
1231
|
-
initialCursorPosition,
|
|
1232
|
-
initialLayout: layout2
|
|
1233
|
-
});
|
|
1234
|
-
}, []), stopDragging = useCallback(() => {
|
|
1235
|
-
setDragState(null);
|
|
1236
|
-
}, []), unregisterPanel = useCallback((panelData) => {
|
|
1237
|
-
const {
|
|
1238
|
-
panelDataArray
|
|
1239
|
-
} = eagerValuesRef.current, index = findPanelDataIndex(panelDataArray, panelData);
|
|
1240
|
-
index >= 0 && (panelDataArray.splice(index, 1), delete panelIdToLastNotifiedSizeMapRef.current[panelData.id], eagerValuesRef.current.panelDataArrayChanged = !0);
|
|
1241
|
-
}, []), context = useMemo(() => ({
|
|
1242
|
-
collapsePanel,
|
|
1243
|
-
direction,
|
|
1244
|
-
dragState,
|
|
1245
|
-
expandPanel,
|
|
1246
|
-
getPanelSize,
|
|
1247
|
-
getPanelStyle,
|
|
1248
|
-
groupId,
|
|
1249
|
-
isPanelCollapsed,
|
|
1250
|
-
isPanelExpanded,
|
|
1251
|
-
reevaluatePanelConstraints,
|
|
1252
|
-
registerPanel,
|
|
1253
|
-
registerResizeHandle: registerResizeHandle2,
|
|
1254
|
-
resizePanel: resizePanel2,
|
|
1255
|
-
startDragging,
|
|
1256
|
-
stopDragging,
|
|
1257
|
-
unregisterPanel,
|
|
1258
|
-
panelGroupElement: panelGroupElementRef.current
|
|
1259
|
-
}), [collapsePanel, dragState, direction, expandPanel, getPanelSize, getPanelStyle, groupId, isPanelCollapsed, isPanelExpanded, reevaluatePanelConstraints, registerPanel, registerResizeHandle2, resizePanel2, startDragging, stopDragging, unregisterPanel]), style = {
|
|
1260
|
-
display: "flex",
|
|
1261
|
-
flexDirection: direction === "horizontal" ? "row" : "column",
|
|
1262
|
-
height: "100%",
|
|
1263
|
-
overflow: "hidden",
|
|
1264
|
-
width: "100%"
|
|
1265
|
-
};
|
|
1266
|
-
return createElement(PanelGroupContext.Provider, {
|
|
1267
|
-
value: context
|
|
1268
|
-
}, createElement(Type, {
|
|
1269
|
-
...rest,
|
|
1270
|
-
children,
|
|
1271
|
-
className: classNameFromProps,
|
|
1272
|
-
id: idFromProps,
|
|
1273
|
-
ref: panelGroupElementRef,
|
|
1274
|
-
style: {
|
|
1275
|
-
...style,
|
|
1276
|
-
...styleFromProps
|
|
1277
|
-
},
|
|
1278
|
-
// CSS selectors
|
|
1279
|
-
"data-panel-group": "",
|
|
1280
|
-
"data-panel-group-direction": direction,
|
|
1281
|
-
"data-panel-group-id": groupId
|
|
1282
|
-
}));
|
|
1283
|
-
}
|
|
1284
|
-
const PanelGroup = forwardRef((props2, ref) => createElement(PanelGroupWithForwardedRef, {
|
|
1285
|
-
...props2,
|
|
1286
|
-
forwardedRef: ref
|
|
1287
|
-
}));
|
|
1288
|
-
PanelGroupWithForwardedRef.displayName = "PanelGroup";
|
|
1289
|
-
PanelGroup.displayName = "forwardRef(PanelGroup)";
|
|
1290
|
-
function findPanelDataIndex(panelDataArray, panelData) {
|
|
1291
|
-
return panelDataArray.findIndex((prevPanelData) => prevPanelData === panelData || prevPanelData.id === panelData.id);
|
|
1292
|
-
}
|
|
1293
|
-
function panelDataHelper(panelDataArray, panelData, layout) {
|
|
1294
|
-
const panelIndex = findPanelDataIndex(panelDataArray, panelData), pivotIndices = panelIndex === panelDataArray.length - 1 ? [panelIndex - 1, panelIndex] : [panelIndex, panelIndex + 1], panelSize = layout[panelIndex];
|
|
1295
|
-
return {
|
|
1296
|
-
...panelData.constraints,
|
|
1297
|
-
panelSize,
|
|
1298
|
-
pivotIndices
|
|
1299
|
-
};
|
|
1300
|
-
}
|
|
1301
|
-
function useWindowSplitterResizeHandlerBehavior({
|
|
1302
|
-
disabled,
|
|
1303
|
-
handleId,
|
|
1304
|
-
resizeHandler,
|
|
1305
|
-
panelGroupElement
|
|
1306
|
-
}) {
|
|
1307
|
-
useEffect(() => {
|
|
1308
|
-
if (disabled || resizeHandler == null || panelGroupElement == null)
|
|
1309
|
-
return;
|
|
1310
|
-
const handleElement = getResizeHandleElement(handleId, panelGroupElement);
|
|
1311
|
-
if (handleElement == null)
|
|
1312
|
-
return;
|
|
1313
|
-
const onKeyDown = (event) => {
|
|
1314
|
-
if (!event.defaultPrevented)
|
|
1315
|
-
switch (event.key) {
|
|
1316
|
-
case "ArrowDown":
|
|
1317
|
-
case "ArrowLeft":
|
|
1318
|
-
case "ArrowRight":
|
|
1319
|
-
case "ArrowUp":
|
|
1320
|
-
case "End":
|
|
1321
|
-
case "Home": {
|
|
1322
|
-
event.preventDefault(), resizeHandler(event);
|
|
1323
|
-
break;
|
|
1324
|
-
}
|
|
1325
|
-
case "F6": {
|
|
1326
|
-
event.preventDefault();
|
|
1327
|
-
const groupId = handleElement.getAttribute("data-panel-group-id");
|
|
1328
|
-
assert(groupId, `No group element found for id "${groupId}"`);
|
|
1329
|
-
const handles = getResizeHandleElementsForGroup(groupId, panelGroupElement), index = getResizeHandleElementIndex(groupId, handleId, panelGroupElement);
|
|
1330
|
-
assert(index !== null, `No resize element found for id "${handleId}"`);
|
|
1331
|
-
const nextIndex = event.shiftKey ? index > 0 ? index - 1 : handles.length - 1 : index + 1 < handles.length ? index + 1 : 0;
|
|
1332
|
-
handles[nextIndex].focus();
|
|
1333
|
-
break;
|
|
1334
|
-
}
|
|
1335
|
-
}
|
|
1336
|
-
};
|
|
1337
|
-
return handleElement.addEventListener("keydown", onKeyDown), () => {
|
|
1338
|
-
handleElement.removeEventListener("keydown", onKeyDown);
|
|
1339
|
-
};
|
|
1340
|
-
}, [panelGroupElement, disabled, handleId, resizeHandler]);
|
|
1341
|
-
}
|
|
1342
|
-
function PanelResizeHandle({
|
|
1343
|
-
children = null,
|
|
1344
|
-
className: classNameFromProps = "",
|
|
1345
|
-
disabled = !1,
|
|
1346
|
-
hitAreaMargins,
|
|
1347
|
-
id: idFromProps,
|
|
1348
|
-
onDragging,
|
|
1349
|
-
style: styleFromProps = {},
|
|
1350
|
-
tabIndex = 0,
|
|
1351
|
-
tagName: Type = "div",
|
|
1352
|
-
...rest
|
|
1353
|
-
}) {
|
|
1354
|
-
var _hitAreaMargins$coars, _hitAreaMargins$fine;
|
|
1355
|
-
const elementRef = useRef(null), callbacksRef = useRef({
|
|
1356
|
-
onDragging
|
|
1357
|
-
});
|
|
1358
|
-
useEffect(() => {
|
|
1359
|
-
callbacksRef.current.onDragging = onDragging;
|
|
1360
|
-
});
|
|
1361
|
-
const panelGroupContext = useContext(PanelGroupContext);
|
|
1362
|
-
if (panelGroupContext === null)
|
|
1363
|
-
throw Error("PanelResizeHandle components must be rendered within a PanelGroup container");
|
|
1364
|
-
const {
|
|
1365
|
-
direction,
|
|
1366
|
-
groupId,
|
|
1367
|
-
registerResizeHandle: registerResizeHandleWithParentGroup,
|
|
1368
|
-
startDragging,
|
|
1369
|
-
stopDragging,
|
|
1370
|
-
panelGroupElement
|
|
1371
|
-
} = panelGroupContext, resizeHandleId = useUniqueId(idFromProps), [state, setState] = useState("inactive"), [isFocused, setIsFocused] = useState(!1), [resizeHandler, setResizeHandler] = useState(null), committedValuesRef = useRef({
|
|
1372
|
-
state
|
|
1373
|
-
});
|
|
1374
|
-
useIsomorphicLayoutEffect(() => {
|
|
1375
|
-
committedValuesRef.current.state = state;
|
|
1376
|
-
}), useEffect(() => {
|
|
1377
|
-
if (disabled)
|
|
1378
|
-
setResizeHandler(null);
|
|
1379
|
-
else {
|
|
1380
|
-
const resizeHandler2 = registerResizeHandleWithParentGroup(resizeHandleId);
|
|
1381
|
-
setResizeHandler(() => resizeHandler2);
|
|
1382
|
-
}
|
|
1383
|
-
}, [disabled, resizeHandleId, registerResizeHandleWithParentGroup]);
|
|
1384
|
-
const coarseHitAreaMargins = (_hitAreaMargins$coars = hitAreaMargins?.coarse) !== null && _hitAreaMargins$coars !== void 0 ? _hitAreaMargins$coars : 15, fineHitAreaMargins = (_hitAreaMargins$fine = hitAreaMargins?.fine) !== null && _hitAreaMargins$fine !== void 0 ? _hitAreaMargins$fine : 5;
|
|
1385
|
-
return useEffect(() => {
|
|
1386
|
-
if (disabled || resizeHandler == null)
|
|
1387
|
-
return;
|
|
1388
|
-
const element = elementRef.current;
|
|
1389
|
-
return assert(element, "Element ref not attached"), registerResizeHandle(resizeHandleId, element, direction, {
|
|
1390
|
-
coarse: coarseHitAreaMargins,
|
|
1391
|
-
fine: fineHitAreaMargins
|
|
1392
|
-
}, (action, isActive, event) => {
|
|
1393
|
-
if (isActive)
|
|
1394
|
-
switch (action) {
|
|
1395
|
-
case "down": {
|
|
1396
|
-
setState("drag"), startDragging(resizeHandleId, event);
|
|
1397
|
-
const {
|
|
1398
|
-
onDragging: onDragging2
|
|
1399
|
-
} = callbacksRef.current;
|
|
1400
|
-
onDragging2 && onDragging2(!0);
|
|
1401
|
-
break;
|
|
1402
|
-
}
|
|
1403
|
-
case "move": {
|
|
1404
|
-
const {
|
|
1405
|
-
state: state2
|
|
1406
|
-
} = committedValuesRef.current;
|
|
1407
|
-
state2 !== "drag" && setState("hover"), resizeHandler(event);
|
|
1408
|
-
break;
|
|
1409
|
-
}
|
|
1410
|
-
case "up": {
|
|
1411
|
-
setState("hover"), stopDragging();
|
|
1412
|
-
const {
|
|
1413
|
-
onDragging: onDragging2
|
|
1414
|
-
} = callbacksRef.current;
|
|
1415
|
-
onDragging2 && onDragging2(!1);
|
|
1416
|
-
break;
|
|
1417
|
-
}
|
|
1418
|
-
}
|
|
1419
|
-
else
|
|
1420
|
-
setState("inactive");
|
|
1421
|
-
});
|
|
1422
|
-
}, [coarseHitAreaMargins, direction, disabled, fineHitAreaMargins, registerResizeHandleWithParentGroup, resizeHandleId, resizeHandler, startDragging, stopDragging]), useWindowSplitterResizeHandlerBehavior({
|
|
1423
|
-
disabled,
|
|
1424
|
-
handleId: resizeHandleId,
|
|
1425
|
-
resizeHandler,
|
|
1426
|
-
panelGroupElement
|
|
1427
|
-
}), createElement(Type, {
|
|
1428
|
-
...rest,
|
|
1429
|
-
children,
|
|
1430
|
-
className: classNameFromProps,
|
|
1431
|
-
id: idFromProps,
|
|
1432
|
-
onBlur: () => setIsFocused(!1),
|
|
1433
|
-
onFocus: () => setIsFocused(!0),
|
|
1434
|
-
ref: elementRef,
|
|
1435
|
-
role: "separator",
|
|
1436
|
-
style: {
|
|
1437
|
-
...{
|
|
1438
|
-
touchAction: "none",
|
|
1439
|
-
userSelect: "none"
|
|
1440
|
-
},
|
|
1441
|
-
...styleFromProps
|
|
1442
|
-
},
|
|
1443
|
-
tabIndex,
|
|
1444
|
-
// CSS selectors
|
|
1445
|
-
"data-panel-group-direction": direction,
|
|
1446
|
-
"data-panel-group-id": groupId,
|
|
1447
|
-
"data-resize-handle": "",
|
|
1448
|
-
"data-resize-handle-active": state === "drag" ? "pointer" : isFocused ? "keyboard" : void 0,
|
|
1449
|
-
"data-resize-handle-state": state,
|
|
1450
|
-
"data-panel-resize-handle-enabled": !disabled,
|
|
1451
|
-
"data-panel-resize-handle-id": resizeHandleId
|
|
1452
|
-
});
|
|
1453
|
-
}
|
|
1454
|
-
PanelResizeHandle.displayName = "PanelResizeHandle";
|
|
1455
|
-
function CopyButton({ text }) {
|
|
1456
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton$1, { value: text, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: copied ? "Copied" : "Copy", withArrow: !0, position: "right", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { color: copied ? "teal" : "gray", variant: copied ? "light" : "subtle", onClick: copy, children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconCheck, { style: { width: rem(16) } }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconCopy, { style: { width: rem(16) } }) }) }) });
|
|
1457
|
-
}
|
|
1458
|
-
function CopyToClipboard({ text }) {
|
|
1459
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { pos: "absolute", top: "0", right: "0", p: "4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { text }) });
|
|
1460
|
-
}
|
|
1461
|
-
var cssScrollArea = "_5k2wbq0", cssCodeBlock = "_5k2wbq1";
|
|
1462
|
-
export {
|
|
1463
|
-
CopyToClipboard as C,
|
|
1464
|
-
PanelGroup as P,
|
|
1465
|
-
Panel as a,
|
|
1466
|
-
cssCodeBlock as b,
|
|
1467
|
-
cssScrollArea as c,
|
|
1468
|
-
PanelResizeHandle as d
|
|
1469
|
-
};
|