react-resizable-panels 0.0.13 → 0.0.15

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.
@@ -18,13 +18,17 @@ const $f922724f4bad4884$export$f34532ac99e32150 = (0, $fpI56$createContext)(null
18
18
  const $f922724f4bad4884$export$7d8c6d083caec74a = (0, $fpI56$createContext)(null);
19
19
 
20
20
 
21
- function $ad28bce87b00c2be$export$2e2bcd8739ae039({ children: children = null , className: className = "" , defaultSize: defaultSize = 0.1 , id: idFromProps = null , minSize: minSize = 0.1 , order: order = null }) {
21
+ function $ad28bce87b00c2be$export$2e2bcd8739ae039({ children: children = null , className: className = "" , defaultSize: defaultSize = null , id: idFromProps = null , minSize: minSize = 10 , order: order = null }) {
22
22
  const context = (0, $fpI56$useContext)((0, $f922724f4bad4884$export$7d8c6d083caec74a));
23
23
  if (context === null) throw Error(`Panel components must be rendered within a PanelGroup container`);
24
24
  const panelId = (0, $968185313205dcfa$export$2e2bcd8739ae039)(idFromProps);
25
- if (minSize > defaultSize) {
26
- console.error(`Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`);
27
- defaultSize = minSize;
25
+ if (minSize < 0 || minSize > 100) throw Error(`Panel minSize must be between 0 and 100, but was ${minSize}`);
26
+ if (defaultSize !== null) {
27
+ if (defaultSize < 0 || defaultSize > 100) throw Error(`Panel defaultSize must be between 0 and 100, but was ${defaultSize}`);
28
+ else if (minSize > defaultSize) {
29
+ console.error(`Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`);
30
+ defaultSize = minSize;
31
+ }
28
32
  }
29
33
  const { getPanelStyle: getPanelStyle , registerPanel: registerPanel , unregisterPanel: unregisterPanel } = context;
30
34
  (0, $fpI56$useLayoutEffect)(()=>{
@@ -61,6 +65,16 @@ function $ad28bce87b00c2be$export$2e2bcd8739ae039({ children: children = null ,
61
65
 
62
66
 
63
67
 
68
+ // Note that Panel ids might be user-provided (stable) or useId generated (non-deterministic)
69
+ // so they should not be used as part of the serialization key.
70
+ // Using an attribute like minSize instead should work well enough.
71
+ // Pre-sorting by minSize allows remembering layouts even if panels are re-ordered/dragged.
72
+ function $6ff1a22b27cc039d$var$getSerializationKey(panels) {
73
+ return panels.map((panel)=>{
74
+ const { minSize: minSize , order: order } = panel;
75
+ return order ? `${order}:${minSize}` : `${minSize}`;
76
+ }).sort((a, b)=>a.localeCompare(b)).join(",");
77
+ }
64
78
  function $6ff1a22b27cc039d$var$loadSerializedPanelGroupState(autoSaveId) {
65
79
  try {
66
80
  const serialized = localStorage.getItem(`PanelGroup:sizes:${autoSaveId}`);
@@ -71,14 +85,18 @@ function $6ff1a22b27cc039d$var$loadSerializedPanelGroupState(autoSaveId) {
71
85
  } catch (error) {}
72
86
  return null;
73
87
  }
74
- function $6ff1a22b27cc039d$export$9c80c6617f0386da(autoSaveId, panelIds) {
88
+ function $6ff1a22b27cc039d$export$9c80c6617f0386da(autoSaveId, panels) {
75
89
  const state = $6ff1a22b27cc039d$var$loadSerializedPanelGroupState(autoSaveId);
76
- if (state) return state[panelIds.join(",")] ?? null;
90
+ if (state) {
91
+ const key = $6ff1a22b27cc039d$var$getSerializationKey(panels);
92
+ return state[key] ?? null;
93
+ }
77
94
  return null;
78
95
  }
79
- function $6ff1a22b27cc039d$export$af183b313c61be4f(autoSaveId, panelIds, sizes) {
96
+ function $6ff1a22b27cc039d$export$af183b313c61be4f(autoSaveId, panels, sizes) {
97
+ const key = $6ff1a22b27cc039d$var$getSerializationKey(panels);
80
98
  const state = $6ff1a22b27cc039d$var$loadSerializedPanelGroupState(autoSaveId) || {};
81
- state[panelIds.join(",")] = sizes;
99
+ state[key] = sizes;
82
100
  try {
83
101
  localStorage.setItem(`PanelGroup:sizes:${autoSaveId}`, JSON.stringify(state));
84
102
  } catch (error) {
@@ -87,7 +105,7 @@ function $6ff1a22b27cc039d$export$af183b313c61be4f(autoSaveId, panelIds, sizes)
87
105
  }
88
106
 
89
107
 
90
- const $fc25b75732bfda27$export$d6d3992f3becc879 = 5;
108
+ const $fc25b75732bfda27$export$d6d3992f3becc879 = 10;
91
109
 
92
110
 
93
111
  function $f30c804b5fe6cc1a$export$f50bae335f53943c(panels, idBefore, idAfter, delta, prevSizes) {
@@ -128,22 +146,24 @@ function $f30c804b5fe6cc1a$export$f50bae335f53943c(panels, idBefore, idAfter, de
128
146
  nextSizes[index] = prevSizes[index] + deltaApplied;
129
147
  return nextSizes;
130
148
  }
131
- function $f30c804b5fe6cc1a$export$622cea445a1c5b7d(panels, id, direction, sizes, height, width) {
149
+ function $f30c804b5fe6cc1a$export$6f43503e166de6fb(panels, id, sizes) {
150
+ if (panels.size === 1) return "100";
132
151
  const panelsArray = $f30c804b5fe6cc1a$export$a861c0ad45885494(panels);
133
- let index = panelsArray.findIndex((panel)=>panel.id === id);
134
- if (index < 0) return 0;
135
- let scaledOffset = 0;
136
- for(index = index - 1; index >= 0; index--){
137
- const panel = panelsArray[index];
138
- scaledOffset += $f30c804b5fe6cc1a$export$31b21d0167753bb4(panels, panel.id, direction, sizes, height, width);
139
- }
140
- return Math.round(scaledOffset);
152
+ const index = panelsArray.findIndex((panel)=>panel.id === id);
153
+ const size = sizes[index];
154
+ if (size == null) return "0";
155
+ return size.toPrecision((0, $fc25b75732bfda27$export$d6d3992f3becc879));
141
156
  }
142
157
  function $f30c804b5fe6cc1a$export$7361ed18ff57179e(id) {
143
158
  const element = document.querySelector(`[data-panel-id="${id}"]`);
144
159
  if (element) return element;
145
160
  return null;
146
161
  }
162
+ function $f30c804b5fe6cc1a$export$5e67632cf3550a9c(id) {
163
+ const element = document.querySelector(`[data-panel-group-id="${id}"]`);
164
+ if (element) return element;
165
+ return null;
166
+ }
147
167
  function $f30c804b5fe6cc1a$export$2e27d3a347680388(id) {
148
168
  const element = document.querySelector(`[data-panel-resize-handle-id="${id}"]`);
149
169
  if (element) return element;
@@ -174,15 +194,6 @@ function $f30c804b5fe6cc1a$export$68d3a33c21dfbe27(groupId, handleId, panelsArra
174
194
  function $f30c804b5fe6cc1a$export$a861c0ad45885494(panels) {
175
195
  return Array.from(panels.values()).sort((a, b)=>a.order - b.order);
176
196
  }
177
- function $f30c804b5fe6cc1a$export$31b21d0167753bb4(panels, id, direction, sizes, height, width) {
178
- const totalSize = direction === "horizontal" ? width : height;
179
- if (panels.size === 1) return totalSize;
180
- const panelsArray = $f30c804b5fe6cc1a$export$a861c0ad45885494(panels);
181
- const index = panelsArray.findIndex((panel)=>panel.id === id);
182
- const size = sizes[index];
183
- if (size == null) return 0;
184
- return Math.round(size * totalSize);
185
- }
186
197
 
187
198
 
188
199
  function $96f6397ae645d178$export$ec391ce65b083ed4(event, handleId, direction, initialOffset = 0) {
@@ -198,9 +209,11 @@ function $96f6397ae645d178$export$ec391ce65b083ed4(event, handleId, direction, i
198
209
  const elementOffset = isHorizontal ? rect.left : rect.top;
199
210
  return pointerOffset - elementOffset - initialOffset;
200
211
  }
201
- function $96f6397ae645d178$export$354b17c0684607ed(event, handleId, { height: height , width: width }, direction, initialOffset) {
212
+ function $96f6397ae645d178$export$354b17c0684607ed(event, groupId, handleId, direction, initialOffset) {
202
213
  const isHorizontal = direction === "horizontal";
203
- const size = isHorizontal ? width : height;
214
+ const groupElement = (0, $f30c804b5fe6cc1a$export$5e67632cf3550a9c)(groupId);
215
+ const rect = groupElement.getBoundingClientRect();
216
+ const size = isHorizontal ? rect.width : rect.height;
204
217
  if ($96f6397ae645d178$export$e7bf60a870f429b0(event)) {
205
218
  const denominator = event.shiftKey ? 10 : 100;
206
219
  const delta = size / denominator;
@@ -239,7 +252,9 @@ function $96f6397ae645d178$export$c4dfce035d43d1e0(event) {
239
252
 
240
253
  function $99ad02c951ec80d0$export$d9fcbe062527d159({ committedValuesRef: committedValuesRef , groupId: groupId , panels: panels , setSizes: setSizes , sizes: sizes }) {
241
254
  (0, $fpI56$useEffect)(()=>{
242
- const { direction: direction , height: height , panels: panels , width: width } = committedValuesRef.current;
255
+ const { direction: direction , panels: panels } = committedValuesRef.current;
256
+ const groupElement = (0, $f30c804b5fe6cc1a$export$5e67632cf3550a9c)(groupId);
257
+ const { height: height , width: width } = groupElement.getBoundingClientRect();
243
258
  const handles = (0, $f30c804b5fe6cc1a$export$ae14931f0a0256a3)(groupId);
244
259
  const cleanupFunctions = handles.map((handle)=>{
245
260
  const handleId = handle.getAttribute("data-panel-resize-handle-id");
@@ -251,11 +266,10 @@ function $99ad02c951ec80d0$export$d9fcbe062527d159({ committedValuesRef: committ
251
266
  return difference;
252
267
  }, 1);
253
268
  const ariaValueMin = panelsArray.find((panel)=>panel.id == idBefore)?.minSize ?? 0;
254
- const size = (0, $f30c804b5fe6cc1a$export$31b21d0167753bb4)(panels, idBefore, direction, sizes, height, width);
255
- const ariaValueNow = size / (direction === "horizontal" ? width : height);
269
+ const size = (0, $f30c804b5fe6cc1a$export$6f43503e166de6fb)(panels, idBefore, sizes);
256
270
  handle.setAttribute("aria-valuemax", "" + Math.round(100 * ariaValueMax));
257
271
  handle.setAttribute("aria-valuemin", "" + Math.round(100 * ariaValueMin));
258
- handle.setAttribute("aria-valuenow", "" + Math.round(100 * ariaValueNow));
272
+ handle.setAttribute("aria-valuenow", "" + size);
259
273
  const onKeyDown = (event)=>{
260
274
  switch(event.key){
261
275
  case "Enter":
@@ -335,7 +349,7 @@ function $99ad02c951ec80d0$export$33b0bea6ac3ffb03({ disabled: disabled , handle
335
349
 
336
350
 
337
351
 
338
- function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , children: children = null , className: className = "" , direction: direction , height: height , id: idFromProps = null , width: width }) {
352
+ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , children: children = null , className: className = "" , direction: direction , id: idFromProps = null }) {
339
353
  const groupId = (0, $968185313205dcfa$export$2e2bcd8739ae039)(idFromProps);
340
354
  const [activeHandleId, setActiveHandleId] = (0, $fpI56$useState)(null);
341
355
  const [panels, setPanels] = (0, $fpI56$useState)(new Map());
@@ -345,17 +359,13 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
345
359
  // Store committed values to avoid unnecessarily re-running memoization/effects functions.
346
360
  const committedValuesRef = (0, $fpI56$useRef)({
347
361
  direction: direction,
348
- height: height,
349
362
  panels: panels,
350
- sizes: sizes,
351
- width: width
363
+ sizes: sizes
352
364
  });
353
365
  (0, $fpI56$useLayoutEffect)(()=>{
354
366
  committedValuesRef.current.direction = direction;
355
- committedValuesRef.current.height = height;
356
367
  committedValuesRef.current.panels = panels;
357
368
  committedValuesRef.current.sizes = sizes;
358
- committedValuesRef.current.width = width;
359
369
  });
360
370
  (0, $99ad02c951ec80d0$export$d9fcbe062527d159)({
361
371
  committedValuesRef: committedValuesRef,
@@ -370,22 +380,30 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
370
380
  (0, $fpI56$useLayoutEffect)(()=>{
371
381
  const sizes = committedValuesRef.current.sizes;
372
382
  if (sizes.length === panels.size) return;
373
- // TODO [panels]
374
- // Validate that the total minSize is <= 1.
375
383
  // If this panel has been configured to persist sizing information,
376
384
  // default size should be restored from local storage if possible.
377
385
  let defaultSizes = undefined;
378
386
  if (autoSaveId) {
379
- const panelIds = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels).map((panel)=>panel.id);
380
- defaultSizes = (0, $6ff1a22b27cc039d$export$9c80c6617f0386da)(autoSaveId, panelIds);
387
+ const panelsArray = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
388
+ defaultSizes = (0, $6ff1a22b27cc039d$export$9c80c6617f0386da)(autoSaveId, panelsArray);
381
389
  }
382
390
  if (defaultSizes != null) setSizes(defaultSizes);
383
391
  else {
384
- const panelsArray = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
385
- const totalWeight = panelsArray.reduce((weight, panel)=>{
386
- return weight + panel.defaultSize;
387
- }, 0);
388
- setSizes(panelsArray.map((panel)=>panel.defaultSize / totalWeight));
392
+ const panelsArray1 = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
393
+ let panelsWithNullDefaultSize = 0;
394
+ let totalDefaultSize = 0;
395
+ let totalMinSize = 0;
396
+ panelsArray1.forEach((panel)=>{
397
+ totalMinSize += panel.minSize;
398
+ if (panel.defaultSize === null) panelsWithNullDefaultSize++;
399
+ else totalDefaultSize += panel.defaultSize;
400
+ });
401
+ if (totalDefaultSize > 100) throw new Error(`The sum of the defaultSize of all panels in a group cannot exceed 100.`);
402
+ else if (totalMinSize > 100) throw new Error(`The sum of the minSize of all panels in a group cannot exceed 100.`);
403
+ setSizes(panelsArray1.map((panel)=>{
404
+ if (panel.defaultSize === null) return (100 - totalDefaultSize) / panelsWithNullDefaultSize;
405
+ return panel.defaultSize;
406
+ }));
389
407
  }
390
408
  }, [
391
409
  autoSaveId,
@@ -395,8 +413,8 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
395
413
  // If this panel has been configured to persist sizing information, save sizes to local storage.
396
414
  if (autoSaveId) {
397
415
  if (sizes.length === 0 || sizes.length !== panels.size) return;
398
- const panelIds = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels).map((panel)=>panel.id);
399
- (0, $6ff1a22b27cc039d$export$af183b313c61be4f)(autoSaveId, panelIds, sizes);
416
+ const panelsArray = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
417
+ (0, $6ff1a22b27cc039d$export$af183b313c61be4f)(autoSaveId, panelsArray, sizes);
400
418
  }
401
419
  }, [
402
420
  autoSaveId,
@@ -405,27 +423,13 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
405
423
  ]);
406
424
  const getPanelStyle = (0, $fpI56$useCallback)((id)=>{
407
425
  const { panels: panels } = committedValuesRef.current;
408
- const offset = (0, $f30c804b5fe6cc1a$export$622cea445a1c5b7d)(panels, id, direction, sizes, height, width);
409
- const size = (0, $f30c804b5fe6cc1a$export$31b21d0167753bb4)(panels, id, direction, sizes, height, width);
410
- if (direction === "horizontal") return {
411
- height: "100%",
412
- position: "absolute",
413
- left: offset,
414
- top: 0,
415
- width: size
416
- };
417
- else return {
418
- height: size,
419
- position: "absolute",
420
- left: 0,
421
- top: offset,
422
- width: "100%"
426
+ const size = (0, $f30c804b5fe6cc1a$export$6f43503e166de6fb)(panels, id, sizes);
427
+ return {
428
+ flexGrow: size
423
429
  };
424
430
  }, [
425
431
  direction,
426
- height,
427
- sizes,
428
- width
432
+ sizes
429
433
  ]);
430
434
  const registerPanel = (0, $fpI56$useCallback)((id, panel)=>{
431
435
  setPanels((prevPanels)=>{
@@ -438,16 +442,17 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
438
442
  const registerResizeHandle = (0, $fpI56$useCallback)((handleId)=>{
439
443
  const resizeHandler = (event)=>{
440
444
  event.preventDefault();
441
- const { direction: direction , height: height , panels: panels , sizes: prevSizes , width: width } = committedValuesRef.current;
445
+ const { direction: direction , panels: panels , sizes: prevSizes } = committedValuesRef.current;
442
446
  const panelsArray = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
443
447
  const [idBefore, idAfter] = (0, $f30c804b5fe6cc1a$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
444
448
  if (idBefore == null || idAfter == null) return;
445
- const movement = (0, $96f6397ae645d178$export$354b17c0684607ed)(event, handleId, {
446
- height: height,
447
- width: width
448
- }, direction, dragOffsetRef.current);
449
+ const movement = (0, $96f6397ae645d178$export$354b17c0684607ed)(event, groupId, handleId, direction, dragOffsetRef.current);
450
+ if (movement === 0) return;
451
+ const groupElement = (0, $f30c804b5fe6cc1a$export$5e67632cf3550a9c)(groupId);
452
+ const rect = groupElement.getBoundingClientRect();
449
453
  const isHorizontal = direction === "horizontal";
450
- const delta = isHorizontal ? movement / width : movement / height;
454
+ const size = isHorizontal ? rect.width : rect.height;
455
+ const delta = movement / size * 100;
451
456
  const nextSizes = (0, $f30c804b5fe6cc1a$export$f50bae335f53943c)(panels, idBefore, idAfter, delta, prevSizes);
452
457
  if (prevSizes !== nextSizes) setSizes(nextSizes);
453
458
  };
@@ -490,6 +495,12 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
490
495
  }), [
491
496
  activeHandleId
492
497
  ]);
498
+ const style = {
499
+ display: "flex",
500
+ flexDirection: direction === "horizontal" ? "row" : "column",
501
+ height: "100%",
502
+ width: "100%"
503
+ };
493
504
  return /*#__PURE__*/ (0, $fpI56$jsx)((0, $f922724f4bad4884$export$f34532ac99e32150).Provider, {
494
505
  value: panelContext,
495
506
  children: /*#__PURE__*/ (0, $fpI56$jsx)((0, $f922724f4bad4884$export$7d8c6d083caec74a).Provider, {
@@ -497,11 +508,7 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
497
508
  children: /*#__PURE__*/ (0, $fpI56$jsx)("div", {
498
509
  className: className,
499
510
  "data-panel-group-id": groupId,
500
- style: {
501
- height: height,
502
- position: "relative",
503
- width: width
504
- },
511
+ style: style,
505
512
  children: children
506
513
  })
507
514
  })
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-resizable-panels/src/index.ts","packages/react-resizable-panels/src/Panel.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/utils/serialization.ts","packages/react-resizable-panels/src/utils/coordinates.ts","packages/react-resizable-panels/src/utils/group.ts","packages/react-resizable-panels/src/constants.ts","packages/react-resizable-panels/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/PanelResizeHandle.tsx"],"sourcesContent":["import Panel from \"./Panel\";\nimport { PanelContext } from \"./PanelContexts\";\nimport PanelGroup from \"./PanelGroup\";\nimport PanelResizeHandle from \"./PanelResizeHandle\";\n\nexport { Panel, PanelContext, PanelGroup, PanelResizeHandle };\n","import { ReactNode, useContext, useLayoutEffect } from \"react\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelGroupContext } from \"./PanelContexts\";\n\n// TODO [panels]\n// Support min pixel size too.\n// PanelGroup should warn if total width is less min pixel widths.\nexport default function Panel({\n children = null,\n className = \"\",\n defaultSize = 0.1,\n id: idFromProps = null,\n minSize = 0.1,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number;\n id?: string | null;\n minSize?: number;\n order?: number | null;\n}) {\n const context = useContext(PanelGroupContext);\n if (context === null) {\n throw Error(\n `Panel components must be rendered within a PanelGroup container`\n );\n }\n\n const panelId = useUniqueId(idFromProps);\n\n if (minSize > defaultSize) {\n console.error(\n `Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`\n );\n\n defaultSize = minSize;\n }\n\n const { getPanelStyle, registerPanel, unregisterPanel } = context;\n\n useLayoutEffect(() => {\n const panel = {\n defaultSize,\n id: panelId,\n minSize,\n order,\n };\n\n registerPanel(panelId, panel);\n\n return () => {\n unregisterPanel(panelId);\n };\n }, [defaultSize, panelId, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(panelId);\n\n return (\n <div\n className={className}\n data-panel-id={panelId}\n id={`data-panel-id-${panelId}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { useId, useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(\n idFromParams: string | null = null\n): string {\n const idFromUseId = typeof useId === \"function\" ? useId() : null;\n\n const idRef = useRef<string | null>(idFromParams || idFromUseId || null);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, ResizeEvent, ResizeHandler } from \"./types\";\n\nexport const PanelContext = createContext<{\n activeHandleId: string | null;\n} | null>(null);\n\nexport const PanelGroupContext = createContext<{\n direction: \"horizontal\" | \"vertical\";\n getPanelStyle: (id: string) => CSSProperties;\n groupId: string;\n registerPanel: (id: string, panel: PanelData) => void;\n registerResizeHandle: (id: string) => ResizeHandler;\n startDragging: (id: string, event: ResizeEvent) => void;\n stopDragging: () => void;\n unregisterPanel: (id: string) => void;\n} | null>(null);\n","import {\n CSSProperties,\n ReactNode,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { getDragOffset, getMovement } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getOffset,\n getResizeHandlePanelIds,\n getSize,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nexport type CommittedValues = {\n direction: Direction;\n height: number;\n panels: Map<string, PanelData>;\n sizes: number[];\n width: number;\n};\n\nexport type PanelDataMap = Map<string, PanelData>;\n\ntype Props = {\n autoSaveId?: string;\n children?: ReactNode;\n className?: string;\n direction: Direction;\n height: number;\n id?: string | null;\n width: number;\n};\n\n// TODO [panels]\n// Within an active drag, remember original positions to refine more easily on expand.\n// Look at what the Chrome devtools Sources does.\n\nexport default function PanelGroup({\n autoSaveId,\n children = null,\n className = \"\",\n direction,\n height,\n id: idFromProps = null,\n width,\n}: Props) {\n const groupId = useUniqueId(idFromProps);\n\n const [activeHandleId, setActiveHandleId] = useState<string | null>(null);\n const [panels, setPanels] = useState<PanelDataMap>(new Map());\n\n // 0-1 values representing the relative size of each panel.\n const [sizes, setSizes] = useState<number[]>([]);\n\n const dragOffsetRef = useRef<number>(0);\n\n // Store committed values to avoid unnecessarily re-running memoization/effects functions.\n const committedValuesRef = useRef<CommittedValues>({\n direction,\n height,\n panels,\n sizes,\n width,\n });\n\n useLayoutEffect(() => {\n committedValuesRef.current.direction = direction;\n committedValuesRef.current.height = height;\n committedValuesRef.current.panels = panels;\n committedValuesRef.current.sizes = sizes;\n committedValuesRef.current.width = width;\n });\n\n useWindowSplitterPanelGroupBehavior({\n committedValuesRef,\n groupId,\n panels,\n setSizes,\n sizes,\n });\n\n // Once all panels have registered themselves,\n // Compute the initial sizes based on default weights.\n // This assumes that panels register during initial mount (no conditional rendering)!\n useLayoutEffect(() => {\n const sizes = committedValuesRef.current.sizes;\n if (sizes.length === panels.size) {\n return;\n }\n\n // TODO [panels]\n // Validate that the total minSize is <= 1.\n\n // If this panel has been configured to persist sizing information,\n // default size should be restored from local storage if possible.\n let defaultSizes: number[] | undefined = undefined;\n if (autoSaveId) {\n const panelIds = panelsMapToSortedArray(panels).map((panel) => panel.id);\n defaultSizes = loadPanelLayout(autoSaveId, panelIds);\n }\n\n if (defaultSizes != null) {\n setSizes(defaultSizes);\n } else {\n const panelsArray = panelsMapToSortedArray(panels);\n const totalWeight = panelsArray.reduce((weight, panel) => {\n return weight + panel.defaultSize;\n }, 0);\n\n setSizes(panelsArray.map((panel) => panel.defaultSize / totalWeight));\n }\n }, [autoSaveId, panels]);\n\n useEffect(() => {\n // If this panel has been configured to persist sizing information, save sizes to local storage.\n if (autoSaveId) {\n if (sizes.length === 0 || sizes.length !== panels.size) {\n return;\n }\n\n const panelIds = panelsMapToSortedArray(panels).map((panel) => panel.id);\n savePanelGroupLayout(autoSaveId, panelIds, sizes);\n }\n }, [autoSaveId, panels, sizes]);\n\n const getPanelStyle = useCallback(\n (id: string): CSSProperties => {\n const { panels } = committedValuesRef.current;\n\n const offset = getOffset(panels, id, direction, sizes, height, width);\n const size = getSize(panels, id, direction, sizes, height, width);\n\n if (direction === \"horizontal\") {\n return {\n height: \"100%\",\n position: \"absolute\",\n left: offset,\n top: 0,\n width: size,\n };\n } else {\n return {\n height: size,\n position: \"absolute\",\n left: 0,\n top: offset,\n width: \"100%\",\n };\n }\n },\n [direction, height, sizes, width]\n );\n\n const registerPanel = useCallback((id: string, panel: PanelData) => {\n setPanels((prevPanels) => {\n if (prevPanels.has(id)) {\n return prevPanels;\n }\n\n const nextPanels = new Map(prevPanels);\n nextPanels.set(id, panel);\n\n return nextPanels;\n });\n }, []);\n\n const registerResizeHandle = useCallback(\n (handleId: string) => {\n const resizeHandler = (event: ResizeEvent) => {\n event.preventDefault();\n\n const {\n direction,\n height,\n panels,\n sizes: prevSizes,\n width,\n } = committedValuesRef.current;\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const [idBefore, idAfter] = getResizeHandlePanelIds(\n groupId,\n handleId,\n panelsArray\n );\n if (idBefore == null || idAfter == null) {\n return;\n }\n\n const movement = getMovement(\n event,\n handleId,\n { height, width },\n direction,\n dragOffsetRef.current\n );\n\n const isHorizontal = direction === \"horizontal\";\n const delta = isHorizontal ? movement / width : movement / height;\n\n const nextSizes = adjustByDelta(\n panels,\n idBefore,\n idAfter,\n delta,\n prevSizes\n );\n if (prevSizes !== nextSizes) {\n setSizes(nextSizes);\n }\n };\n\n return resizeHandler;\n },\n [groupId]\n );\n\n const unregisterPanel = useCallback((id: string) => {\n setPanels((prevPanels) => {\n if (!prevPanels.has(id)) {\n return prevPanels;\n }\n\n const nextPanels = new Map(prevPanels);\n nextPanels.delete(id);\n\n return nextPanels;\n });\n }, []);\n\n const panelGroupContext = useMemo(\n () => ({\n direction,\n getPanelStyle,\n groupId,\n registerPanel,\n registerResizeHandle,\n startDragging: (id: string, event: ResizeEvent) => {\n setActiveHandleId(id);\n\n dragOffsetRef.current = getDragOffset(event, id, direction);\n },\n stopDragging: () => {\n setActiveHandleId(null);\n },\n unregisterPanel,\n }),\n [\n direction,\n getPanelStyle,\n groupId,\n registerPanel,\n registerResizeHandle,\n unregisterPanel,\n ]\n );\n\n const panelContext = useMemo(\n () => ({\n activeHandleId,\n }),\n [activeHandleId]\n );\n\n return (\n <PanelContext.Provider value={panelContext}>\n <PanelGroupContext.Provider value={panelGroupContext}>\n <div\n className={className}\n data-panel-group-id={groupId}\n style={{ height, position: \"relative\", width }}\n >\n {children}\n </div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { PanelData } from \"../types\";\n\ntype SerializedPanelGroupState = { [panelIds: string]: number[] };\n\nfunction loadSerializedPanelGroupState(\n autoSaveId: string\n): SerializedPanelGroupState | null {\n try {\n const serialized = localStorage.getItem(`PanelGroup:sizes:${autoSaveId}`);\n if (serialized) {\n const parsed = JSON.parse(serialized);\n if (typeof parsed === \"object\" && parsed != null) {\n return parsed;\n }\n }\n } catch (error) {}\n\n return null;\n}\n\nexport function loadPanelLayout(\n autoSaveId: string,\n panelIds: string[]\n): number[] | null {\n const state = loadSerializedPanelGroupState(autoSaveId);\n if (state) {\n return state[panelIds.join(\",\")] ?? null;\n }\n\n return null;\n}\n\nexport function savePanelGroupLayout(\n autoSaveId: string,\n panelIds: string[],\n sizes: number[]\n): void {\n const state = loadSerializedPanelGroupState(autoSaveId) || {};\n state[panelIds.join(\",\")] = sizes;\n\n try {\n localStorage.setItem(\n `PanelGroup:sizes:${autoSaveId}`,\n JSON.stringify(state)\n );\n } catch (error) {\n console.error(error);\n }\n}\n","import { Direction, ResizeEvent } from \"../types\";\nimport { getResizeHandle } from \"./group\";\n\nexport type Coordinates = {\n movement: number;\n offset: number;\n};\n\nexport type Size = {\n height: number;\n width: number;\n};\n\nexport function getDragOffset(\n event: ResizeEvent,\n handleId: string,\n direction: Direction,\n initialOffset: number = 0\n): number {\n const isHorizontal = direction === \"horizontal\";\n\n let pointerOffset = 0;\n if (isMouseEvent(event)) {\n pointerOffset = isHorizontal ? event.clientX : event.clientY;\n } else if (isTouchEvent(event)) {\n const firstTouch = event.touches[0];\n pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;\n } else {\n return 0;\n }\n\n const handleElement = getResizeHandle(handleId);\n const rect = handleElement.getBoundingClientRect();\n const elementOffset = isHorizontal ? rect.left : rect.top;\n\n return pointerOffset - elementOffset - initialOffset;\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/movementX\nexport function getMovement(\n event: ResizeEvent,\n handleId: string,\n { height, width }: Size,\n direction: Direction,\n initialOffset: number\n): number {\n const isHorizontal = direction === \"horizontal\";\n const size = isHorizontal ? width : height;\n\n if (isKeyDown(event)) {\n const denominator = event.shiftKey ? 10 : 100;\n const delta = size / denominator;\n\n switch (event.key) {\n case \"ArrowDown\":\n return delta;\n case \"ArrowLeft\":\n return -delta;\n case \"ArrowRight\":\n return delta;\n case \"ArrowUp\":\n return -delta;\n case \"End\":\n if (isHorizontal) {\n return size;\n } else {\n return size;\n }\n case \"Home\":\n if (isHorizontal) {\n return -size;\n } else {\n return -size;\n }\n }\n } else {\n return getDragOffset(event, handleId, direction, initialOffset);\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseEvent(event: ResizeEvent): event is MouseEvent {\n return event.type.startsWith(\"mouse\");\n}\n\nexport function isTouchEvent(event: ResizeEvent): event is TouchEvent {\n return event.type.startsWith(\"touch\");\n}\n","import { PRECISION } from \"../constants\";\nimport { Direction, PanelData } from \"../types\";\n\nexport function adjustByDelta(\n panels: Map<string, PanelData>,\n idBefore: string,\n idAfter: string,\n delta: number,\n prevSizes: number[]\n): number[] {\n if (delta === 0) {\n return prevSizes;\n }\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const nextSizes = prevSizes.concat();\n\n let deltaApplied = 0;\n\n // A resizing panel affects the panels before or after it.\n //\n // A negative delta means the panel immediately after the resizer should grow/expand by decreasing its offset.\n // Other panels may also need to shrink/contract (and shift) to make room, depending on the min weights.\n //\n // A positive delta means the panel immediately before the resizer should \"expand\".\n // This is accomplished by shrinking/contracting (and shifting) one or more of the panels after the resizer.\n let pivotId = delta < 0 ? idBefore : idAfter;\n let index = panelsArray.findIndex((panel) => panel.id === pivotId);\n while (true) {\n const panel = panelsArray[index];\n const prevSize = prevSizes[index];\n const nextSize = Math.max(prevSize - Math.abs(delta), panel.minSize);\n if (prevSize !== nextSize) {\n deltaApplied += prevSize - nextSize;\n\n nextSizes[index] = nextSize;\n\n if (deltaApplied.toPrecision(PRECISION) >= delta.toPrecision(PRECISION)) {\n break;\n }\n }\n\n if (delta < 0) {\n if (--index < 0) {\n break;\n }\n } else {\n if (++index >= panelsArray.length) {\n break;\n }\n }\n }\n\n // If we were unable to resize any of the panels panels, return the previous state.\n // This will essentially bailout and ignore the \"mousemove\" event.\n if (deltaApplied === 0) {\n return prevSizes;\n }\n\n // Adjust the pivot panel before, but only by the amount that surrounding panels were able to shrink/contract.\n pivotId = delta < 0 ? idAfter : idBefore;\n index = panelsArray.findIndex((panel) => panel.id === pivotId);\n nextSizes[index] = prevSizes[index] + deltaApplied;\n\n return nextSizes;\n}\n\nexport function getOffset(\n panels: Map<string, PanelData>,\n id: string,\n direction: Direction,\n sizes: number[],\n height: number,\n width: number\n): number {\n const panelsArray = panelsMapToSortedArray(panels);\n\n let index = panelsArray.findIndex((panel) => panel.id === id);\n if (index < 0) {\n return 0;\n }\n\n let scaledOffset = 0;\n\n for (index = index - 1; index >= 0; index--) {\n const panel = panelsArray[index];\n scaledOffset += getSize(panels, panel.id, direction, sizes, height, width);\n }\n\n return Math.round(scaledOffset);\n}\n\nexport function getPanel(id: string): HTMLDivElement | null {\n const element = document.querySelector(`[data-panel-id=\"${id}\"]`);\n if (element) {\n return element as HTMLDivElement;\n }\n return null;\n}\n\nexport function getResizeHandle(id: string): HTMLDivElement | null {\n const element = document.querySelector(\n `[data-panel-resize-handle-id=\"${id}\"]`\n );\n if (element) {\n return element as HTMLDivElement;\n }\n return null;\n}\n\nexport function getResizeHandleIndex(id: string): number | null {\n const handles = getResizeHandles();\n const index = handles.findIndex(\n (handle) => handle.getAttribute(\"data-panel-resize-handle-id\") === id\n );\n return index ?? null;\n}\n\nexport function getResizeHandles(): HTMLDivElement[] {\n return Array.from(document.querySelectorAll(`[data-panel-resize-handle-id]`));\n}\n\nexport function getResizeHandlesForGroup(groupId: string): HTMLDivElement[] {\n return Array.from(\n document.querySelectorAll(\n `[data-panel-resize-handle-id][data-panel-group-id=\"${groupId}\"]`\n )\n );\n}\n\nexport function getResizeHandlePanelIds(\n groupId: string,\n handleId: string,\n panelsArray: PanelData[]\n): [idBefore: string | null, idAfter: string | null] {\n const handle = getResizeHandle(handleId);\n const handles = getResizeHandlesForGroup(groupId);\n const index = handles.indexOf(handle);\n\n const idBefore: string | null = panelsArray[index]?.id ?? null;\n const idAfter: string | null = panelsArray[index + 1]?.id ?? null;\n\n return [idBefore, idAfter];\n}\n\nexport function panelsMapToSortedArray(\n panels: Map<string, PanelData>\n): PanelData[] {\n return Array.from(panels.values()).sort((a, b) => a.order - b.order);\n}\n\nexport function getSize(\n panels: Map<string, PanelData>,\n id: string,\n direction: Direction,\n sizes: number[],\n height: number,\n width: number\n): number {\n const totalSize = direction === \"horizontal\" ? width : height;\n\n if (panels.size === 1) {\n return totalSize;\n }\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const index = panelsArray.findIndex((panel) => panel.id === id);\n const size = sizes[index];\n if (size == null) {\n return 0;\n }\n\n return Math.round(size * totalSize);\n}\n","export const PRECISION = 5;\n","import { RefObject, useEffect } from \"react\";\nimport { PRECISION } from \"../constants\";\n\nimport { CommittedValues, PanelDataMap } from \"../PanelGroup\";\nimport { ResizeHandler } from \"../types\";\nimport {\n adjustByDelta,\n getPanel,\n getResizeHandle,\n getResizeHandleIndex,\n getResizeHandlePanelIds,\n getResizeHandles,\n getResizeHandlesForGroup,\n getSize,\n panelsMapToSortedArray,\n} from \"../utils/group\";\n\n// https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/\n\nexport function useWindowSplitterPanelGroupBehavior({\n committedValuesRef,\n groupId,\n panels,\n setSizes,\n sizes,\n}: {\n committedValuesRef: RefObject<CommittedValues>;\n groupId: string;\n panels: PanelDataMap;\n setSizes: (sizes: number[]) => void;\n sizes: number[];\n}): void {\n useEffect(() => {\n const { direction, height, panels, width } = committedValuesRef.current;\n\n const handles = getResizeHandlesForGroup(groupId);\n const cleanupFunctions = handles.map((handle) => {\n const handleId = handle.getAttribute(\"data-panel-resize-handle-id\");\n const panelsArray = panelsMapToSortedArray(panels);\n\n const [idBefore, idAfter] = getResizeHandlePanelIds(\n groupId,\n handleId,\n panelsArray\n );\n if (idBefore == null || idAfter == null) {\n return () => {};\n }\n\n const ariaValueMax = panelsArray.reduce((difference, panel) => {\n if (panel.id !== idBefore) {\n return difference - panel.minSize;\n }\n return difference;\n }, 1);\n\n const ariaValueMin =\n panelsArray.find((panel) => panel.id == idBefore)?.minSize ?? 0;\n\n const size = getSize(panels, idBefore, direction, sizes, height, width);\n const ariaValueNow = size / (direction === \"horizontal\" ? width : height);\n\n handle.setAttribute(\"aria-valuemax\", \"\" + Math.round(100 * ariaValueMax));\n handle.setAttribute(\"aria-valuemin\", \"\" + Math.round(100 * ariaValueMin));\n handle.setAttribute(\"aria-valuenow\", \"\" + Math.round(100 * ariaValueNow));\n\n const onKeyDown = (event: KeyboardEvent) => {\n switch (event.key) {\n case \"Enter\": {\n const index = panelsArray.findIndex(\n (panel) => panel.id === idBefore\n );\n if (index >= 0) {\n const panelData = panelsArray[index];\n const size = sizes[index];\n if (size != null) {\n let delta = 0;\n if (\n size.toPrecision(PRECISION) <=\n panelData.minSize.toPrecision(PRECISION)\n ) {\n delta = direction === \"horizontal\" ? width : height;\n } else {\n delta = -(direction === \"horizontal\" ? width : height);\n }\n\n const nextSizes = adjustByDelta(\n panels,\n idBefore,\n idAfter,\n delta,\n sizes\n );\n if (sizes !== nextSizes) {\n setSizes(nextSizes);\n }\n }\n }\n break;\n }\n }\n };\n\n handle.addEventListener(\"keydown\", onKeyDown);\n\n const panelBefore = getPanel(idBefore);\n if (panelBefore != null) {\n handle.setAttribute(\"aria-controls\", panelBefore.id);\n }\n\n return () => {\n handle.removeAttribute(\"aria-valuemax\");\n handle.removeAttribute(\"aria-valuemin\");\n handle.removeAttribute(\"aria-valuenow\");\n\n handle.removeEventListener(\"keydown\", onKeyDown);\n\n if (panelBefore != null) {\n handle.removeAttribute(\"aria-controls\");\n }\n };\n });\n\n return () => {\n cleanupFunctions.forEach((cleanupFunction) => cleanupFunction());\n };\n }, [groupId, panels, sizes]);\n}\n\nexport function useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId,\n resizeHandler,\n}: {\n disabled: boolean;\n handleId: string;\n resizeHandler: ResizeHandler | null;\n}): void {\n useEffect(() => {\n if (disabled || resizeHandler == null) {\n return;\n }\n\n const handleElement = getResizeHandle(handleId);\n if (handleElement == null) {\n return;\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowLeft\":\n case \"ArrowRight\":\n case \"ArrowUp\":\n case \"End\":\n case \"Home\": {\n resizeHandler(event);\n break;\n }\n case \"F6\": {\n const handles = getResizeHandles();\n const index = getResizeHandleIndex(handleId);\n\n const nextIndex = event.shiftKey\n ? index > 0\n ? index - 1\n : handles.length - 1\n : index + 1 < handles.length\n ? index + 1\n : 0;\n\n const nextHandle = handles[nextIndex] as HTMLDivElement;\n nextHandle.focus();\n\n break;\n }\n }\n };\n\n handleElement.addEventListener(\"keydown\", onKeyDown);\n return () => {\n handleElement.removeEventListener(\"keydown\", onKeyDown);\n };\n }, [disabled, handleId, resizeHandler]);\n}\n","import {\n ReactNode,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { useWindowSplitterResizeHandlerBehavior } from \"./hooks/useWindowSplitterBehavior\";\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport type { ResizeHandler, ResizeEvent } from \"./types\";\n\nexport default function PanelResizeHandle({\n children = null,\n className = \"\",\n disabled = false,\n id: idFromProps = null,\n}: {\n children?: ReactNode;\n className?: string;\n disabled?: boolean;\n id?: string | null;\n}) {\n const divElementRef = useRef<HTMLDivElement>(null);\n\n const panelContext = useContext(PanelContext);\n const panelGroupContext = useContext(PanelGroupContext);\n if (panelContext === null || panelGroupContext === null) {\n throw Error(\n `PanelResizeHandle components must be rendered within a PanelGroup container`\n );\n }\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const resizeHandleId = useUniqueId(idFromProps);\n const isDragging = activeHandleId === resizeHandleId;\n\n const [resizeHandler, setResizeHandler] = useState<ResizeHandler | null>(\n null\n );\n\n const stopDraggingAndBlur = useCallback(() => {\n // Clicking on the drag handle shouldn't leave it focused;\n // That would cause the PanelGroup to think it was still active.\n const div = divElementRef.current!;\n div.blur();\n\n stopDragging();\n }, [stopDragging]);\n\n useEffect(() => {\n if (disabled) {\n setResizeHandler(null);\n } else {\n const resizeHandler = registerResizeHandle(resizeHandleId);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, resizeHandleId, registerResizeHandle]);\n\n useEffect(() => {\n if (disabled || resizeHandler == null || !isDragging) {\n return;\n }\n\n document.body.style.cursor =\n direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\";\n\n const onMove = (event: ResizeEvent) => {\n resizeHandler(event);\n };\n\n document.body.addEventListener(\"contextmenu\", stopDraggingAndBlur);\n document.body.addEventListener(\"mouseleave\", stopDraggingAndBlur);\n document.body.addEventListener(\"mousemove\", onMove);\n document.body.addEventListener(\"touchmove\", onMove);\n document.body.addEventListener(\"mouseup\", stopDraggingAndBlur);\n\n return () => {\n document.body.style.cursor = \"\";\n\n document.body.removeEventListener(\"contextmenu\", stopDraggingAndBlur);\n document.body.removeEventListener(\"mouseleave\", stopDraggingAndBlur);\n document.body.removeEventListener(\"mousemove\", onMove);\n document.body.removeEventListener(\"touchmove\", onMove);\n document.body.removeEventListener(\"mouseup\", stopDraggingAndBlur);\n };\n }, [direction, disabled, isDragging, resizeHandler, stopDraggingAndBlur]);\n\n useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId: resizeHandleId,\n resizeHandler,\n });\n\n return (\n <div\n className={className}\n data-panel-group-id={groupId}\n data-panel-resize-handle-enabled={!disabled}\n data-panel-resize-handle-id={resizeHandleId}\n onMouseDown={(event) => startDragging(resizeHandleId, event.nativeEvent)}\n onMouseUp={stopDraggingAndBlur}\n onTouchCancel={stopDraggingAndBlur}\n onTouchEnd={stopDraggingAndBlur}\n onTouchStart={(event) => startDragging(resizeHandleId, event.nativeEvent)}\n ref={divElementRef}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-resizable-panels/src/index.ts","packages/react-resizable-panels/src/Panel.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/utils/serialization.ts","packages/react-resizable-panels/src/utils/coordinates.ts","packages/react-resizable-panels/src/utils/group.ts","packages/react-resizable-panels/src/constants.ts","packages/react-resizable-panels/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/PanelResizeHandle.tsx"],"sourcesContent":["import Panel from \"./Panel\";\nimport { PanelContext } from \"./PanelContexts\";\nimport PanelGroup from \"./PanelGroup\";\nimport PanelResizeHandle from \"./PanelResizeHandle\";\n\nexport { Panel, PanelContext, PanelGroup, PanelResizeHandle };\n","import { ReactNode, useContext, useLayoutEffect } from \"react\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelGroupContext } from \"./PanelContexts\";\n\n// TODO [panels]\n// Support min pixel size too.\n// PanelGroup should warn if total width is less min pixel widths.\nexport default function Panel({\n children = null,\n className = \"\",\n defaultSize = null,\n id: idFromProps = null,\n minSize = 10,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number | null;\n id?: string | null;\n minSize?: number;\n order?: number | null;\n}) {\n const context = useContext(PanelGroupContext);\n if (context === null) {\n throw Error(\n `Panel components must be rendered within a PanelGroup container`\n );\n }\n\n const panelId = useUniqueId(idFromProps);\n\n if (minSize < 0 || minSize > 100) {\n throw Error(`Panel minSize must be between 0 and 100, but was ${minSize}`);\n }\n\n if (defaultSize !== null) {\n if (defaultSize < 0 || defaultSize > 100) {\n throw Error(\n `Panel defaultSize must be between 0 and 100, but was ${defaultSize}`\n );\n } else if (minSize > defaultSize) {\n console.error(\n `Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`\n );\n\n defaultSize = minSize;\n }\n }\n\n const { getPanelStyle, registerPanel, unregisterPanel } = context;\n\n useLayoutEffect(() => {\n const panel = {\n defaultSize,\n id: panelId,\n minSize,\n order,\n };\n\n registerPanel(panelId, panel);\n\n return () => {\n unregisterPanel(panelId);\n };\n }, [defaultSize, panelId, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(panelId);\n\n return (\n <div\n className={className}\n data-panel-id={panelId}\n id={`data-panel-id-${panelId}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { useId, useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(\n idFromParams: string | null = null\n): string {\n const idFromUseId = typeof useId === \"function\" ? useId() : null;\n\n const idRef = useRef<string | null>(idFromParams || idFromUseId || null);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, ResizeEvent, ResizeHandler } from \"./types\";\n\nexport const PanelContext = createContext<{\n activeHandleId: string | null;\n} | null>(null);\n\nexport const PanelGroupContext = createContext<{\n direction: \"horizontal\" | \"vertical\";\n getPanelStyle: (id: string) => CSSProperties;\n groupId: string;\n registerPanel: (id: string, panel: PanelData) => void;\n registerResizeHandle: (id: string) => ResizeHandler;\n startDragging: (id: string, event: ResizeEvent) => void;\n stopDragging: () => void;\n unregisterPanel: (id: string) => void;\n} | null>(null);\n","import {\n CSSProperties,\n ReactNode,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { getDragOffset, getMovement } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getFlexGrow,\n getPanelGroup,\n getResizeHandlePanelIds,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nexport type CommittedValues = {\n direction: Direction;\n panels: Map<string, PanelData>;\n sizes: number[];\n};\n\nexport type PanelDataMap = Map<string, PanelData>;\n\ntype Props = {\n autoSaveId?: string;\n children?: ReactNode;\n className?: string;\n direction: Direction;\n id?: string | null;\n};\n\n// TODO [panels]\n// Within an active drag, remember original positions to refine more easily on expand.\n// Look at what the Chrome devtools Sources does.\n\nexport default function PanelGroup({\n autoSaveId,\n children = null,\n className = \"\",\n direction,\n id: idFromProps = null,\n}: Props) {\n const groupId = useUniqueId(idFromProps);\n\n const [activeHandleId, setActiveHandleId] = useState<string | null>(null);\n const [panels, setPanels] = useState<PanelDataMap>(new Map());\n\n // 0-1 values representing the relative size of each panel.\n const [sizes, setSizes] = useState<number[]>([]);\n\n const dragOffsetRef = useRef<number>(0);\n\n // Store committed values to avoid unnecessarily re-running memoization/effects functions.\n const committedValuesRef = useRef<CommittedValues>({\n direction,\n panels,\n sizes,\n });\n\n useLayoutEffect(() => {\n committedValuesRef.current.direction = direction;\n committedValuesRef.current.panels = panels;\n committedValuesRef.current.sizes = sizes;\n });\n\n useWindowSplitterPanelGroupBehavior({\n committedValuesRef,\n groupId,\n panels,\n setSizes,\n sizes,\n });\n\n // Once all panels have registered themselves,\n // Compute the initial sizes based on default weights.\n // This assumes that panels register during initial mount (no conditional rendering)!\n useLayoutEffect(() => {\n const sizes = committedValuesRef.current.sizes;\n if (sizes.length === panels.size) {\n return;\n }\n\n // If this panel has been configured to persist sizing information,\n // default size should be restored from local storage if possible.\n let defaultSizes: number[] | undefined = undefined;\n if (autoSaveId) {\n const panelsArray = panelsMapToSortedArray(panels);\n defaultSizes = loadPanelLayout(autoSaveId, panelsArray);\n }\n\n if (defaultSizes != null) {\n setSizes(defaultSizes);\n } else {\n const panelsArray = panelsMapToSortedArray(panels);\n\n let panelsWithNullDefaultSize = 0;\n let totalDefaultSize = 0;\n let totalMinSize = 0;\n\n panelsArray.forEach((panel) => {\n totalMinSize += panel.minSize;\n\n if (panel.defaultSize === null) {\n panelsWithNullDefaultSize++;\n } else {\n totalDefaultSize += panel.defaultSize;\n }\n });\n\n if (totalDefaultSize > 100) {\n throw new Error(\n `The sum of the defaultSize of all panels in a group cannot exceed 100.`\n );\n } else if (totalMinSize > 100) {\n throw new Error(\n `The sum of the minSize of all panels in a group cannot exceed 100.`\n );\n }\n\n setSizes(\n panelsArray.map((panel) => {\n if (panel.defaultSize === null) {\n return (100 - totalDefaultSize) / panelsWithNullDefaultSize;\n }\n\n return panel.defaultSize;\n })\n );\n }\n }, [autoSaveId, panels]);\n\n useEffect(() => {\n // If this panel has been configured to persist sizing information, save sizes to local storage.\n if (autoSaveId) {\n if (sizes.length === 0 || sizes.length !== panels.size) {\n return;\n }\n\n const panelsArray = panelsMapToSortedArray(panels);\n savePanelGroupLayout(autoSaveId, panelsArray, sizes);\n }\n }, [autoSaveId, panels, sizes]);\n\n const getPanelStyle = useCallback(\n (id: string): CSSProperties => {\n const { panels } = committedValuesRef.current;\n\n const size = getFlexGrow(panels, id, sizes);\n\n return { flexGrow: size };\n },\n [direction, sizes]\n );\n\n const registerPanel = useCallback((id: string, panel: PanelData) => {\n setPanels((prevPanels) => {\n if (prevPanels.has(id)) {\n return prevPanels;\n }\n\n const nextPanels = new Map(prevPanels);\n nextPanels.set(id, panel);\n\n return nextPanels;\n });\n }, []);\n\n const registerResizeHandle = useCallback(\n (handleId: string) => {\n const resizeHandler = (event: ResizeEvent) => {\n event.preventDefault();\n\n const {\n direction,\n panels,\n sizes: prevSizes,\n } = committedValuesRef.current;\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const [idBefore, idAfter] = getResizeHandlePanelIds(\n groupId,\n handleId,\n panelsArray\n );\n if (idBefore == null || idAfter == null) {\n return;\n }\n\n const movement = getMovement(\n event,\n groupId,\n handleId,\n direction,\n dragOffsetRef.current\n );\n if (movement === 0) {\n return;\n }\n\n const groupElement = getPanelGroup(groupId);\n const rect = groupElement.getBoundingClientRect();\n const isHorizontal = direction === \"horizontal\";\n const size = isHorizontal ? rect.width : rect.height;\n const delta = (movement / size) * 100;\n\n const nextSizes = adjustByDelta(\n panels,\n idBefore,\n idAfter,\n delta,\n prevSizes\n );\n if (prevSizes !== nextSizes) {\n setSizes(nextSizes);\n }\n };\n\n return resizeHandler;\n },\n [groupId]\n );\n\n const unregisterPanel = useCallback((id: string) => {\n setPanels((prevPanels) => {\n if (!prevPanels.has(id)) {\n return prevPanels;\n }\n\n const nextPanels = new Map(prevPanels);\n nextPanels.delete(id);\n\n return nextPanels;\n });\n }, []);\n\n const panelGroupContext = useMemo(\n () => ({\n direction,\n getPanelStyle,\n groupId,\n registerPanel,\n registerResizeHandle,\n startDragging: (id: string, event: ResizeEvent) => {\n setActiveHandleId(id);\n\n dragOffsetRef.current = getDragOffset(event, id, direction);\n },\n stopDragging: () => {\n setActiveHandleId(null);\n },\n unregisterPanel,\n }),\n [\n direction,\n getPanelStyle,\n groupId,\n registerPanel,\n registerResizeHandle,\n unregisterPanel,\n ]\n );\n\n const panelContext = useMemo(\n () => ({\n activeHandleId,\n }),\n [activeHandleId]\n );\n\n const style: CSSProperties = {\n display: \"flex\",\n flexDirection: direction === \"horizontal\" ? \"row\" : \"column\",\n height: \"100%\",\n width: \"100%\",\n };\n\n return (\n <PanelContext.Provider value={panelContext}>\n <PanelGroupContext.Provider value={panelGroupContext}>\n <div className={className} data-panel-group-id={groupId} style={style}>\n {children}\n </div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { PanelData } from \"../types\";\n\ntype SerializedPanelGroupState = { [panelIds: string]: number[] };\n\n// Note that Panel ids might be user-provided (stable) or useId generated (non-deterministic)\n// so they should not be used as part of the serialization key.\n// Using an attribute like minSize instead should work well enough.\n// Pre-sorting by minSize allows remembering layouts even if panels are re-ordered/dragged.\nfunction getSerializationKey(panels: PanelData[]): string {\n return panels\n .map((panel) => {\n const { minSize, order } = panel;\n return order ? `${order}:${minSize}` : `${minSize}`;\n })\n .sort((a, b) => a.localeCompare(b))\n .join(\",\");\n}\n\nfunction loadSerializedPanelGroupState(\n autoSaveId: string\n): SerializedPanelGroupState | null {\n try {\n const serialized = localStorage.getItem(`PanelGroup:sizes:${autoSaveId}`);\n if (serialized) {\n const parsed = JSON.parse(serialized);\n if (typeof parsed === \"object\" && parsed != null) {\n return parsed;\n }\n }\n } catch (error) {}\n\n return null;\n}\n\nexport function loadPanelLayout(\n autoSaveId: string,\n panels: PanelData[]\n): number[] | null {\n const state = loadSerializedPanelGroupState(autoSaveId);\n if (state) {\n const key = getSerializationKey(panels);\n return state[key] ?? null;\n }\n\n return null;\n}\n\nexport function savePanelGroupLayout(\n autoSaveId: string,\n panels: PanelData[],\n sizes: number[]\n): void {\n const key = getSerializationKey(panels);\n const state = loadSerializedPanelGroupState(autoSaveId) || {};\n state[key] = sizes;\n\n try {\n localStorage.setItem(\n `PanelGroup:sizes:${autoSaveId}`,\n JSON.stringify(state)\n );\n } catch (error) {\n console.error(error);\n }\n}\n","import { Direction, ResizeEvent } from \"../types\";\nimport { getPanelGroup, getResizeHandle } from \"./group\";\n\nexport type Coordinates = {\n movement: number;\n offset: number;\n};\n\nexport type Size = {\n height: number;\n width: number;\n};\n\nexport function getDragOffset(\n event: ResizeEvent,\n handleId: string,\n direction: Direction,\n initialOffset: number = 0\n): number {\n const isHorizontal = direction === \"horizontal\";\n\n let pointerOffset = 0;\n if (isMouseEvent(event)) {\n pointerOffset = isHorizontal ? event.clientX : event.clientY;\n } else if (isTouchEvent(event)) {\n const firstTouch = event.touches[0];\n pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;\n } else {\n return 0;\n }\n\n const handleElement = getResizeHandle(handleId);\n const rect = handleElement.getBoundingClientRect();\n const elementOffset = isHorizontal ? rect.left : rect.top;\n\n return pointerOffset - elementOffset - initialOffset;\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/movementX\nexport function getMovement(\n event: ResizeEvent,\n groupId: string,\n handleId: string,\n direction: Direction,\n initialOffset: number\n): number {\n const isHorizontal = direction === \"horizontal\";\n\n const groupElement = getPanelGroup(groupId);\n const rect = groupElement.getBoundingClientRect();\n const size = isHorizontal ? rect.width : rect.height;\n\n if (isKeyDown(event)) {\n const denominator = event.shiftKey ? 10 : 100;\n const delta = size / denominator;\n\n switch (event.key) {\n case \"ArrowDown\":\n return delta;\n case \"ArrowLeft\":\n return -delta;\n case \"ArrowRight\":\n return delta;\n case \"ArrowUp\":\n return -delta;\n case \"End\":\n if (isHorizontal) {\n return size;\n } else {\n return size;\n }\n case \"Home\":\n if (isHorizontal) {\n return -size;\n } else {\n return -size;\n }\n }\n } else {\n return getDragOffset(event, handleId, direction, initialOffset);\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseEvent(event: ResizeEvent): event is MouseEvent {\n return event.type.startsWith(\"mouse\");\n}\n\nexport function isTouchEvent(event: ResizeEvent): event is TouchEvent {\n return event.type.startsWith(\"touch\");\n}\n","import { PRECISION } from \"../constants\";\nimport { PanelData } from \"../types\";\n\nexport function adjustByDelta(\n panels: Map<string, PanelData>,\n idBefore: string,\n idAfter: string,\n delta: number,\n prevSizes: number[]\n): number[] {\n if (delta === 0) {\n return prevSizes;\n }\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const nextSizes = prevSizes.concat();\n\n let deltaApplied = 0;\n\n // A resizing panel affects the panels before or after it.\n //\n // A negative delta means the panel immediately after the resizer should grow/expand by decreasing its offset.\n // Other panels may also need to shrink/contract (and shift) to make room, depending on the min weights.\n //\n // A positive delta means the panel immediately before the resizer should \"expand\".\n // This is accomplished by shrinking/contracting (and shifting) one or more of the panels after the resizer.\n let pivotId = delta < 0 ? idBefore : idAfter;\n let index = panelsArray.findIndex((panel) => panel.id === pivotId);\n while (true) {\n const panel = panelsArray[index];\n const prevSize = prevSizes[index];\n const nextSize = Math.max(prevSize - Math.abs(delta), panel.minSize);\n if (prevSize !== nextSize) {\n deltaApplied += prevSize - nextSize;\n\n nextSizes[index] = nextSize;\n\n if (deltaApplied.toPrecision(PRECISION) >= delta.toPrecision(PRECISION)) {\n break;\n }\n }\n\n if (delta < 0) {\n if (--index < 0) {\n break;\n }\n } else {\n if (++index >= panelsArray.length) {\n break;\n }\n }\n }\n\n // If we were unable to resize any of the panels panels, return the previous state.\n // This will essentially bailout and ignore the \"mousemove\" event.\n if (deltaApplied === 0) {\n return prevSizes;\n }\n\n // Adjust the pivot panel before, but only by the amount that surrounding panels were able to shrink/contract.\n pivotId = delta < 0 ? idAfter : idBefore;\n index = panelsArray.findIndex((panel) => panel.id === pivotId);\n nextSizes[index] = prevSizes[index] + deltaApplied;\n\n return nextSizes;\n}\n\n// This method returns a number between 1 and 100 representing\n// the % of the group's overall space this panel should occupy.\nexport function getFlexGrow(\n panels: Map<string, PanelData>,\n id: string,\n sizes: number[]\n): string {\n if (panels.size === 1) {\n return \"100\";\n }\n\n const panelsArray = panelsMapToSortedArray(panels);\n\n const index = panelsArray.findIndex((panel) => panel.id === id);\n const size = sizes[index];\n if (size == null) {\n return \"0\";\n }\n\n return size.toPrecision(PRECISION);\n}\n\nexport function getPanel(id: string): HTMLDivElement | null {\n const element = document.querySelector(`[data-panel-id=\"${id}\"]`);\n if (element) {\n return element as HTMLDivElement;\n }\n return null;\n}\n\nexport function getPanelGroup(id: string): HTMLDivElement | null {\n const element = document.querySelector(`[data-panel-group-id=\"${id}\"]`);\n if (element) {\n return element as HTMLDivElement;\n }\n return null;\n}\n\nexport function getResizeHandle(id: string): HTMLDivElement | null {\n const element = document.querySelector(\n `[data-panel-resize-handle-id=\"${id}\"]`\n );\n if (element) {\n return element as HTMLDivElement;\n }\n return null;\n}\n\nexport function getResizeHandleIndex(id: string): number | null {\n const handles = getResizeHandles();\n const index = handles.findIndex(\n (handle) => handle.getAttribute(\"data-panel-resize-handle-id\") === id\n );\n return index ?? null;\n}\n\nexport function getResizeHandles(): HTMLDivElement[] {\n return Array.from(document.querySelectorAll(`[data-panel-resize-handle-id]`));\n}\n\nexport function getResizeHandlesForGroup(groupId: string): HTMLDivElement[] {\n return Array.from(\n document.querySelectorAll(\n `[data-panel-resize-handle-id][data-panel-group-id=\"${groupId}\"]`\n )\n );\n}\n\nexport function getResizeHandlePanelIds(\n groupId: string,\n handleId: string,\n panelsArray: PanelData[]\n): [idBefore: string | null, idAfter: string | null] {\n const handle = getResizeHandle(handleId);\n const handles = getResizeHandlesForGroup(groupId);\n const index = handles.indexOf(handle);\n\n const idBefore: string | null = panelsArray[index]?.id ?? null;\n const idAfter: string | null = panelsArray[index + 1]?.id ?? null;\n\n return [idBefore, idAfter];\n}\n\nexport function panelsMapToSortedArray(\n panels: Map<string, PanelData>\n): PanelData[] {\n return Array.from(panels.values()).sort((a, b) => a.order - b.order);\n}\n","export const PRECISION = 10;\n","import { RefObject, useEffect } from \"react\";\nimport { PRECISION } from \"../constants\";\n\nimport { CommittedValues, PanelDataMap } from \"../PanelGroup\";\nimport { ResizeHandler } from \"../types\";\nimport {\n adjustByDelta,\n getPanel,\n getPanelGroup,\n getResizeHandle,\n getResizeHandleIndex,\n getResizeHandlePanelIds,\n getResizeHandles,\n getResizeHandlesForGroup,\n getFlexGrow,\n panelsMapToSortedArray,\n} from \"../utils/group\";\n\n// https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/\n\nexport function useWindowSplitterPanelGroupBehavior({\n committedValuesRef,\n groupId,\n panels,\n setSizes,\n sizes,\n}: {\n committedValuesRef: RefObject<CommittedValues>;\n groupId: string;\n panels: PanelDataMap;\n setSizes: (sizes: number[]) => void;\n sizes: number[];\n}): void {\n useEffect(() => {\n const { direction, panels } = committedValuesRef.current;\n\n const groupElement = getPanelGroup(groupId);\n const { height, width } = groupElement.getBoundingClientRect();\n\n const handles = getResizeHandlesForGroup(groupId);\n const cleanupFunctions = handles.map((handle) => {\n const handleId = handle.getAttribute(\"data-panel-resize-handle-id\");\n const panelsArray = panelsMapToSortedArray(panels);\n\n const [idBefore, idAfter] = getResizeHandlePanelIds(\n groupId,\n handleId,\n panelsArray\n );\n if (idBefore == null || idAfter == null) {\n return () => {};\n }\n\n const ariaValueMax = panelsArray.reduce((difference, panel) => {\n if (panel.id !== idBefore) {\n return difference - panel.minSize;\n }\n return difference;\n }, 1);\n\n const ariaValueMin =\n panelsArray.find((panel) => panel.id == idBefore)?.minSize ?? 0;\n\n const size = getFlexGrow(panels, idBefore, sizes);\n\n handle.setAttribute(\"aria-valuemax\", \"\" + Math.round(100 * ariaValueMax));\n handle.setAttribute(\"aria-valuemin\", \"\" + Math.round(100 * ariaValueMin));\n handle.setAttribute(\"aria-valuenow\", \"\" + size);\n\n const onKeyDown = (event: KeyboardEvent) => {\n switch (event.key) {\n case \"Enter\": {\n const index = panelsArray.findIndex(\n (panel) => panel.id === idBefore\n );\n if (index >= 0) {\n const panelData = panelsArray[index];\n const size = sizes[index];\n if (size != null) {\n let delta = 0;\n if (\n size.toPrecision(PRECISION) <=\n panelData.minSize.toPrecision(PRECISION)\n ) {\n delta = direction === \"horizontal\" ? width : height;\n } else {\n delta = -(direction === \"horizontal\" ? width : height);\n }\n\n const nextSizes = adjustByDelta(\n panels,\n idBefore,\n idAfter,\n delta,\n sizes\n );\n if (sizes !== nextSizes) {\n setSizes(nextSizes);\n }\n }\n }\n break;\n }\n }\n };\n\n handle.addEventListener(\"keydown\", onKeyDown);\n\n const panelBefore = getPanel(idBefore);\n if (panelBefore != null) {\n handle.setAttribute(\"aria-controls\", panelBefore.id);\n }\n\n return () => {\n handle.removeAttribute(\"aria-valuemax\");\n handle.removeAttribute(\"aria-valuemin\");\n handle.removeAttribute(\"aria-valuenow\");\n\n handle.removeEventListener(\"keydown\", onKeyDown);\n\n if (panelBefore != null) {\n handle.removeAttribute(\"aria-controls\");\n }\n };\n });\n\n return () => {\n cleanupFunctions.forEach((cleanupFunction) => cleanupFunction());\n };\n }, [groupId, panels, sizes]);\n}\n\nexport function useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId,\n resizeHandler,\n}: {\n disabled: boolean;\n handleId: string;\n resizeHandler: ResizeHandler | null;\n}): void {\n useEffect(() => {\n if (disabled || resizeHandler == null) {\n return;\n }\n\n const handleElement = getResizeHandle(handleId);\n if (handleElement == null) {\n return;\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowLeft\":\n case \"ArrowRight\":\n case \"ArrowUp\":\n case \"End\":\n case \"Home\": {\n resizeHandler(event);\n break;\n }\n case \"F6\": {\n const handles = getResizeHandles();\n const index = getResizeHandleIndex(handleId);\n\n const nextIndex = event.shiftKey\n ? index > 0\n ? index - 1\n : handles.length - 1\n : index + 1 < handles.length\n ? index + 1\n : 0;\n\n const nextHandle = handles[nextIndex] as HTMLDivElement;\n nextHandle.focus();\n\n break;\n }\n }\n };\n\n handleElement.addEventListener(\"keydown\", onKeyDown);\n return () => {\n handleElement.removeEventListener(\"keydown\", onKeyDown);\n };\n }, [disabled, handleId, resizeHandler]);\n}\n","import {\n ReactNode,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { useWindowSplitterResizeHandlerBehavior } from \"./hooks/useWindowSplitterBehavior\";\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport type { ResizeHandler, ResizeEvent } from \"./types\";\n\nexport default function PanelResizeHandle({\n children = null,\n className = \"\",\n disabled = false,\n id: idFromProps = null,\n}: {\n children?: ReactNode;\n className?: string;\n disabled?: boolean;\n id?: string | null;\n}) {\n const divElementRef = useRef<HTMLDivElement>(null);\n\n const panelContext = useContext(PanelContext);\n const panelGroupContext = useContext(PanelGroupContext);\n if (panelContext === null || panelGroupContext === null) {\n throw Error(\n `PanelResizeHandle components must be rendered within a PanelGroup container`\n );\n }\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const resizeHandleId = useUniqueId(idFromProps);\n const isDragging = activeHandleId === resizeHandleId;\n\n const [resizeHandler, setResizeHandler] = useState<ResizeHandler | null>(\n null\n );\n\n const stopDraggingAndBlur = useCallback(() => {\n // Clicking on the drag handle shouldn't leave it focused;\n // That would cause the PanelGroup to think it was still active.\n const div = divElementRef.current!;\n div.blur();\n\n stopDragging();\n }, [stopDragging]);\n\n useEffect(() => {\n if (disabled) {\n setResizeHandler(null);\n } else {\n const resizeHandler = registerResizeHandle(resizeHandleId);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, resizeHandleId, registerResizeHandle]);\n\n useEffect(() => {\n if (disabled || resizeHandler == null || !isDragging) {\n return;\n }\n\n document.body.style.cursor =\n direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\";\n\n const onMove = (event: ResizeEvent) => {\n resizeHandler(event);\n };\n\n document.body.addEventListener(\"contextmenu\", stopDraggingAndBlur);\n document.body.addEventListener(\"mouseleave\", stopDraggingAndBlur);\n document.body.addEventListener(\"mousemove\", onMove);\n document.body.addEventListener(\"touchmove\", onMove);\n document.body.addEventListener(\"mouseup\", stopDraggingAndBlur);\n\n return () => {\n document.body.style.cursor = \"\";\n\n document.body.removeEventListener(\"contextmenu\", stopDraggingAndBlur);\n document.body.removeEventListener(\"mouseleave\", stopDraggingAndBlur);\n document.body.removeEventListener(\"mousemove\", onMove);\n document.body.removeEventListener(\"touchmove\", onMove);\n document.body.removeEventListener(\"mouseup\", stopDraggingAndBlur);\n };\n }, [direction, disabled, isDragging, resizeHandler, stopDraggingAndBlur]);\n\n useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId: resizeHandleId,\n resizeHandler,\n });\n\n return (\n <div\n className={className}\n data-panel-group-id={groupId}\n data-panel-resize-handle-enabled={!disabled}\n data-panel-resize-handle-id={resizeHandleId}\n onMouseDown={(event) => startDragging(resizeHandleId, event.nativeEvent)}\n onMouseUp={stopDraggingAndBlur}\n onTouchCancel={stopDraggingAndBlur}\n onTouchEnd={stopDraggingAndBlur}\n onTouchStart={(event) => startDragging(resizeHandleId, event.nativeEvent)}\n ref={divElementRef}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.module.js.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-resizable-panels",
3
- "version": "0.0.13",
3
+ "version": "0.0.15",
4
4
  "description": "React components for resizable panel groups/layouts",
5
5
  "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
6
6
  "license": "MIT",
package/src/Panel.tsx CHANGED
@@ -9,14 +9,14 @@ import { PanelGroupContext } from "./PanelContexts";
9
9
  export default function Panel({
10
10
  children = null,
11
11
  className = "",
12
- defaultSize = 0.1,
12
+ defaultSize = null,
13
13
  id: idFromProps = null,
14
- minSize = 0.1,
14
+ minSize = 10,
15
15
  order = null,
16
16
  }: {
17
17
  children?: ReactNode;
18
18
  className?: string;
19
- defaultSize?: number;
19
+ defaultSize?: number | null;
20
20
  id?: string | null;
21
21
  minSize?: number;
22
22
  order?: number | null;
@@ -30,12 +30,22 @@ export default function Panel({
30
30
 
31
31
  const panelId = useUniqueId(idFromProps);
32
32
 
33
- if (minSize > defaultSize) {
34
- console.error(
35
- `Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`
36
- );
33
+ if (minSize < 0 || minSize > 100) {
34
+ throw Error(`Panel minSize must be between 0 and 100, but was ${minSize}`);
35
+ }
36
+
37
+ if (defaultSize !== null) {
38
+ if (defaultSize < 0 || defaultSize > 100) {
39
+ throw Error(
40
+ `Panel defaultSize must be between 0 and 100, but was ${defaultSize}`
41
+ );
42
+ } else if (minSize > defaultSize) {
43
+ console.error(
44
+ `Panel minSize ${minSize} cannot be greater than defaultSize ${defaultSize}`
45
+ );
37
46
 
38
- defaultSize = minSize;
47
+ defaultSize = minSize;
48
+ }
39
49
  }
40
50
 
41
51
  const { getPanelStyle, registerPanel, unregisterPanel } = context;