react-resizable-panels 0.0.9 → 0.0.10

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/CHANGELOG.md CHANGED
@@ -1,5 +1,9 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.0.10
4
+ * Drag UX change: Reversing drag after dragging past the min/max size of a panel will no longer have an effect until the pointer overlaps with the resize handle. (Thanks @davidkpiano for the suggestion!)
5
+ * Bug fix: Resize handles are no longer left in a "focused" state after a touch/mouse event.
6
+
3
7
  ## 0.0.9
4
8
  * [#13](https://github.com/bvaughn/react-resizable-panels/issues/13): `PanelResizeHandle` should declare "separator" role and implement the recommended ["Window Splitter" pattern](https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/)
5
9
 
@@ -1 +1 @@
1
- {"mappings":";AAAA,iBAAwB,YAAY,GAAG,UAAU,CAAC;ACIlD,OAAO,MAAM;oBACK,MAAM,GAAG,IAAI;EAChB,CAAC;ACChB,sBAA8B,EAC5B,QAAe,EACf,SAAc,EACd,WAAiB,EACjB,EAAE,EACF,OAAa,EACb,KAAY,GACb,EAAE;IACD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB,eA6CA;AO/BD,aAAa;IACX,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAMF,2BAAmC,EACjC,UAAU,EACV,QAAe,EACf,SAAc,EACd,SAAS,EACT,MAAM,EACN,KAAK,GACN,EAAE,KAAK,eA8OP;AC9RD,kCAA0C,EACxC,QAAe,EACf,SAAc,EACd,QAAgB,EAChB,EAAE,EAAE,MAAa,GAClB,EAAE;IACD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB,eAyFA","sources":["packages/react-resizable-panels/src/src/types.ts","packages/react-resizable-panels/src/src/PanelContexts.ts","packages/react-resizable-panels/src/src/Panel.tsx","packages/react-resizable-panels/src/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/src/utils/serialization.ts","packages/react-resizable-panels/src/src/utils/coordinates.ts","packages/react-resizable-panels/src/src/constants.ts","packages/react-resizable-panels/src/src/utils/group.ts","packages/react-resizable-panels/src/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/src/PanelGroup.tsx","packages/react-resizable-panels/src/src/PanelResizeHandle.tsx","packages/react-resizable-panels/src/src/index.ts","packages/react-resizable-panels/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null,null,null,null,"import Panel from \"./Panel\";\nimport { PanelContext } from \"./PanelContexts\";\nimport PanelGroup from \"./PanelGroup\";\nimport PanelResizeHandle from \"./PanelResizeHandle\";\n\nexport { Panel, PanelContext, PanelGroup, PanelResizeHandle };\n"],"names":[],"version":3,"file":"react-resizable-panels.d.ts.map","sourceRoot":"../../../"}
1
+ {"mappings":";AAAA,iBAAwB,YAAY,GAAG,UAAU,CAAC;ACIlD,OAAO,MAAM;oBACK,MAAM,GAAG,IAAI;EAChB,CAAC;ACChB,sBAA8B,EAC5B,QAAe,EACf,SAAc,EACd,WAAiB,EACjB,EAAE,EACF,OAAa,EACb,KAAY,GACb,EAAE;IACD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB,eA6CA;AO/BD,aAAa;IACX,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAMF,2BAAmC,EACjC,UAAU,EACV,QAAe,EACf,SAAc,EACd,SAAS,EACT,MAAM,EACN,KAAK,GACN,EAAE,KAAK,eA4NP;ACrQD,kCAA0C,EACxC,QAAe,EACf,SAAc,EACd,QAAgB,EAChB,EAAE,EAAE,MAAa,GAClB,EAAE;IACD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB,eAqGA","sources":["packages/react-resizable-panels/src/src/types.ts","packages/react-resizable-panels/src/src/PanelContexts.ts","packages/react-resizable-panels/src/src/Panel.tsx","packages/react-resizable-panels/src/src/hooks/useUniqueId.ts","packages/react-resizable-panels/src/src/utils/serialization.ts","packages/react-resizable-panels/src/src/constants.ts","packages/react-resizable-panels/src/src/utils/group.ts","packages/react-resizable-panels/src/src/utils/coordinates.ts","packages/react-resizable-panels/src/src/hooks/useWindowSplitterBehavior.ts","packages/react-resizable-panels/src/src/PanelGroup.tsx","packages/react-resizable-panels/src/src/PanelResizeHandle.tsx","packages/react-resizable-panels/src/src/index.ts","packages/react-resizable-panels/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null,null,null,null,"import Panel from \"./Panel\";\nimport { PanelContext } from \"./PanelContexts\";\nimport PanelGroup from \"./PanelGroup\";\nimport PanelResizeHandle from \"./PanelResizeHandle\";\n\nexport { Panel, PanelContext, PanelGroup, PanelResizeHandle };\n"],"names":[],"version":3,"file":"react-resizable-panels.d.ts.map","sourceRoot":"../../../"}
@@ -97,82 +97,6 @@ function $e045b0dd313f33c7$export$af183b313c61be4f(autoSaveId, panelIds, sizes)
97
97
  }
98
98
 
99
99
 
100
- const $f5af57c8e042a4ad$var$element = document.createElement("div");
101
- $f5af57c8e042a4ad$var$element.getBoundingClientRect();
102
- function $f5af57c8e042a4ad$export$70637efcd850e4ef(event, prevCoordinates, dimensions, direction) {
103
- const { screenX: prevScreenX , screenY: prevScreenY } = prevCoordinates;
104
- const { height: height , width: width } = dimensions;
105
- const getMovementBetween = (current, prev)=>prev === 0 ? 0 : current - prev;
106
- if ($f5af57c8e042a4ad$export$e7bf60a870f429b0(event)) {
107
- let movementX = 0;
108
- let movementY = 0;
109
- const size = direction === "horizontal" ? width : height;
110
- const denominator = event.shiftKey ? 10 : 100;
111
- const delta = size / denominator;
112
- switch(event.key){
113
- case "ArrowDown":
114
- movementY = delta;
115
- break;
116
- case "ArrowLeft":
117
- movementX = -delta;
118
- break;
119
- case "ArrowRight":
120
- movementX = delta;
121
- break;
122
- case "ArrowUp":
123
- movementY = -delta;
124
- break;
125
- case "End":
126
- if (direction === "horizontal") movementX = size;
127
- else movementY = size;
128
- break;
129
- case "Home":
130
- if (direction === "horizontal") movementX = -size;
131
- else movementY = -size;
132
- break;
133
- }
134
- // Estimate screen X/Y to be the center of the resize handle.
135
- // Otherwise the first mouse/touch event after a keyboard event will appear to "jump"
136
- let screenX = 0;
137
- let screenY = 0;
138
- if (document.activeElement) {
139
- const rect = document.activeElement.getBoundingClientRect();
140
- screenX = rect.left + rect.width / 2;
141
- screenY = rect.top + rect.height / 2;
142
- }
143
- return {
144
- movementX: movementX,
145
- movementY: movementY,
146
- screenX: screenX,
147
- screenY: screenY
148
- };
149
- } else if ($f5af57c8e042a4ad$export$ce897e7f0aa63661(event)) {
150
- const firstTouch = event.touches[0];
151
- return {
152
- movementX: getMovementBetween(firstTouch.screenX, prevScreenX),
153
- movementY: getMovementBetween(firstTouch.screenY, prevScreenY),
154
- screenX: firstTouch.screenX,
155
- screenY: firstTouch.screenY
156
- };
157
- } else if ($f5af57c8e042a4ad$export$5107d838cdd17dee(event)) return {
158
- movementX: getMovementBetween(event.screenX, prevScreenX),
159
- movementY: getMovementBetween(event.screenY, prevScreenY),
160
- screenX: event.screenX,
161
- screenY: event.screenY
162
- };
163
- else throw Error(`Unsupported event type: "${event.type}"`);
164
- }
165
- function $f5af57c8e042a4ad$export$e7bf60a870f429b0(event) {
166
- return event.type === "keydown";
167
- }
168
- function $f5af57c8e042a4ad$export$5107d838cdd17dee(event) {
169
- return event.type === "mousemove";
170
- }
171
- function $f5af57c8e042a4ad$export$ce897e7f0aa63661(event) {
172
- return event.type === "touchmove";
173
- }
174
-
175
-
176
100
  const $3237bc4a138172cd$export$d6d3992f3becc879 = 5;
177
101
 
178
102
 
@@ -271,6 +195,55 @@ function $d520236daad9c5d5$export$31b21d0167753bb4(panels, id, direction, sizes,
271
195
  }
272
196
 
273
197
 
198
+ const $f5af57c8e042a4ad$var$element = document.createElement("div");
199
+ $f5af57c8e042a4ad$var$element.getBoundingClientRect();
200
+ function $f5af57c8e042a4ad$export$354b17c0684607ed(event, handleId, { height: height , width: width }, direction) {
201
+ const isHorizontal = direction === "horizontal";
202
+ const size = isHorizontal ? width : height;
203
+ if ($f5af57c8e042a4ad$export$e7bf60a870f429b0(event)) {
204
+ const denominator = event.shiftKey ? 10 : 100;
205
+ const delta = size / denominator;
206
+ switch(event.key){
207
+ case "ArrowDown":
208
+ return delta;
209
+ case "ArrowLeft":
210
+ return -delta;
211
+ case "ArrowRight":
212
+ return delta;
213
+ case "ArrowUp":
214
+ return -delta;
215
+ case "End":
216
+ if (isHorizontal) return size;
217
+ else return size;
218
+ case "Home":
219
+ if (isHorizontal) return -size;
220
+ else return -size;
221
+ }
222
+ } else {
223
+ const handleElement = (0, $d520236daad9c5d5$export$2e27d3a347680388)(handleId);
224
+ const rect = handleElement.getBoundingClientRect();
225
+ const elementOffset = isHorizontal ? rect.left : rect.top;
226
+ let pointerOffset = 0;
227
+ if ($f5af57c8e042a4ad$export$5107d838cdd17dee(event)) pointerOffset = isHorizontal ? event.clientX : event.clientY;
228
+ else {
229
+ const firstTouch = event.touches[0];
230
+ pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;
231
+ }
232
+ return pointerOffset - elementOffset;
233
+ }
234
+ }
235
+ function $f5af57c8e042a4ad$export$e7bf60a870f429b0(event) {
236
+ return event.type === "keydown";
237
+ }
238
+ function $f5af57c8e042a4ad$export$5107d838cdd17dee(event) {
239
+ return event.type === "mousemove";
240
+ }
241
+ function $f5af57c8e042a4ad$export$ce897e7f0aa63661(event) {
242
+ return event.type === "touchmove";
243
+ }
244
+
245
+
246
+
274
247
 
275
248
 
276
249
 
@@ -385,12 +358,6 @@ function $d428eaeef644efb2$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
385
358
  sizes: sizes,
386
359
  width: width
387
360
  });
388
- // Tracks the most recent coordinates of a touch/mouse event.
389
- // This is needed to calculate movement (because TouchEvent doesn't support movementX and movementY).
390
- const prevCoordinatesRef = (0, $b2QPe$react.useRef)({
391
- screenX: 0,
392
- screenY: 0
393
- });
394
361
  (0, $b2QPe$react.useLayoutEffect)(()=>{
395
362
  committedValuesRef.current.direction = direction;
396
363
  committedValuesRef.current.height = height;
@@ -483,16 +450,11 @@ function $d428eaeef644efb2$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
483
450
  const panelsArray = (0, $d520236daad9c5d5$export$a861c0ad45885494)(panels);
484
451
  const [idBefore, idAfter] = (0, $d520236daad9c5d5$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
485
452
  if (idBefore == null || idAfter == null) return;
486
- const nextCoordinates = (0, $f5af57c8e042a4ad$export$70637efcd850e4ef)(event, prevCoordinatesRef.current, {
453
+ const movement = (0, $f5af57c8e042a4ad$export$354b17c0684607ed)(event, handleId, {
487
454
  height: height,
488
455
  width: width
489
456
  }, direction);
490
- prevCoordinatesRef.current = {
491
- screenX: nextCoordinates.screenX,
492
- screenY: nextCoordinates.screenY
493
- };
494
457
  const isHorizontal = direction === "horizontal";
495
- const movement = isHorizontal ? nextCoordinates.movementX : nextCoordinates.movementY;
496
458
  const delta = isHorizontal ? movement / width : movement / height;
497
459
  const nextSizes = (0, $d520236daad9c5d5$export$f50bae335f53943c)(panels, idBefore, idAfter, delta, prevSizes);
498
460
  if (prevSizes !== nextSizes) setSizes(nextSizes);
@@ -518,10 +480,6 @@ function $d428eaeef644efb2$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
518
480
  startDragging: (id)=>setActiveHandleId(id),
519
481
  stopDragging: ()=>{
520
482
  setActiveHandleId(null);
521
- prevCoordinatesRef.current = {
522
- screenX: 0,
523
- screenY: 0
524
- };
525
483
  },
526
484
  unregisterPanel: unregisterPanel
527
485
  }), [
@@ -546,17 +504,17 @@ function $d428eaeef644efb2$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
546
504
  children: children
547
505
  }, void 0, false, {
548
506
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
549
- lineNumber: 290,
507
+ lineNumber: 272,
550
508
  columnNumber: 9
551
509
  }, this)
552
510
  }, void 0, false, {
553
511
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
554
- lineNumber: 289,
512
+ lineNumber: 271,
555
513
  columnNumber: 7
556
514
  }, this)
557
515
  }, void 0, false, {
558
516
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
559
- lineNumber: 288,
517
+ lineNumber: 270,
560
518
  columnNumber: 5
561
519
  }, this);
562
520
  }
@@ -568,6 +526,7 @@ function $d428eaeef644efb2$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
568
526
 
569
527
 
570
528
  function $d578a49f00f1bdeb$export$2e2bcd8739ae039({ children: children = null , className: className = "" , disabled: disabled = false , id: idProp = null }) {
529
+ const divElementRef = (0, $d578a49f00f1bdeb$import$65588215f5c347c3$b8f5890fc79d6aca)(null);
571
530
  const panelContext = (0, $b2QPe$react.useContext)((0, $3251d17c1c3bce6c$export$f34532ac99e32150));
572
531
  const panelGroupContext = (0, $b2QPe$react.useContext)((0, $3251d17c1c3bce6c$export$7d8c6d083caec74a));
573
532
  if (panelContext === null || panelGroupContext === null) throw Error(`PanelResizeHandle components must be rendered within a PanelGroup container`);
@@ -576,6 +535,15 @@ function $d578a49f00f1bdeb$export$2e2bcd8739ae039({ children: children = null ,
576
535
  const { direction: direction , groupId: groupId , registerResizeHandle: registerResizeHandle , startDragging: startDragging , stopDragging: stopDragging } = panelGroupContext;
577
536
  const isDragging = activeHandleId === id;
578
537
  const [resizeHandler, setResizeHandler] = (0, $b2QPe$react.useState)(null);
538
+ const stopDraggingAndBlur = (0, $d578a49f00f1bdeb$import$65588215f5c347c3$35808ee640e87ca7)(()=>{
539
+ // Clicking on the drag handle shouldn't leave it focused;
540
+ // That would cause the PanelGroup to think it was still active.
541
+ const div = divElementRef.current;
542
+ div.blur();
543
+ stopDragging();
544
+ }, [
545
+ stopDragging
546
+ ]);
579
547
  (0, $b2QPe$react.useEffect)(()=>{
580
548
  if (disabled) setResizeHandler(null);
581
549
  else {
@@ -593,23 +561,23 @@ function $d578a49f00f1bdeb$export$2e2bcd8739ae039({ children: children = null ,
593
561
  const onMove = (event)=>{
594
562
  resizeHandler(event);
595
563
  };
596
- document.body.addEventListener("mouseleave", stopDragging);
564
+ document.body.addEventListener("mouseleave", stopDraggingAndBlur);
597
565
  document.body.addEventListener("mousemove", onMove);
598
566
  document.body.addEventListener("touchmove", onMove);
599
- document.body.addEventListener("mouseup", stopDragging);
567
+ document.body.addEventListener("mouseup", stopDraggingAndBlur);
600
568
  return ()=>{
601
569
  document.body.style.cursor = "";
602
- document.body.removeEventListener("mouseleave", stopDragging);
570
+ document.body.removeEventListener("mouseleave", stopDraggingAndBlur);
603
571
  document.body.removeEventListener("mousemove", onMove);
604
572
  document.body.removeEventListener("touchmove", onMove);
605
- document.body.removeEventListener("mouseup", stopDragging);
573
+ document.body.removeEventListener("mouseup", stopDraggingAndBlur);
606
574
  };
607
575
  }, [
608
576
  direction,
609
577
  disabled,
610
578
  isDragging,
611
579
  resizeHandler,
612
- stopDragging
580
+ stopDraggingAndBlur
613
581
  ]);
614
582
  (0, $63be9a96d8675f03$export$33b0bea6ac3ffb03)({
615
583
  disabled: disabled,
@@ -622,10 +590,11 @@ function $d578a49f00f1bdeb$export$2e2bcd8739ae039({ children: children = null ,
622
590
  "data-panel-resize-handle-enabled": !disabled,
623
591
  "data-panel-resize-handle-id": id,
624
592
  onMouseDown: ()=>startDragging(id),
625
- onMouseUp: stopDragging,
626
- onTouchCancel: stopDragging,
627
- onTouchEnd: stopDragging,
593
+ onMouseUp: stopDraggingAndBlur,
594
+ onTouchCancel: stopDraggingAndBlur,
595
+ onTouchEnd: stopDraggingAndBlur,
628
596
  onTouchStart: ()=>startDragging(id),
597
+ ref: divElementRef,
629
598
  role: "separator",
630
599
  style: {
631
600
  cursor: direction === "horizontal" ? "ew-resize" : "ns-resize",
@@ -635,7 +604,7 @@ function $d578a49f00f1bdeb$export$2e2bcd8739ae039({ children: children = null ,
635
604
  children: children
636
605
  }, void 0, false, {
637
606
  fileName: "packages/react-resizable-panels/src/PanelResizeHandle.tsx",
638
- lineNumber: 87,
607
+ lineNumber: 105,
639
608
  columnNumber: 5
640
609
  }, this);
641
610
  }
@@ -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/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","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\";\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,\n minSize = 0.1,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number;\n id: string;\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 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,\n minSize,\n order,\n };\n\n registerPanel(id, panel);\n\n return () => {\n unregisterPanel(id);\n };\n }, [defaultSize, id, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(id);\n\n return (\n <div\n className={className}\n data-panel-id={id}\n id={`data-panel-id-${id}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, 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) => 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\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { Coordinates, getUpdatedCoordinates } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getOffset,\n getResizeHandlePanelIds,\n getSize,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\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 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 width,\n}: Props) {\n const groupId = useUniqueId();\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 // 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 // Tracks the most recent coordinates of a touch/mouse event.\n // This is needed to calculate movement (because TouchEvent doesn't support movementX and movementY).\n const prevCoordinatesRef = useRef<Coordinates>({\n screenX: 0,\n screenY: 0,\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 nextCoordinates = getUpdatedCoordinates(\n event,\n prevCoordinatesRef.current,\n { height, width },\n direction\n );\n prevCoordinatesRef.current = {\n screenX: nextCoordinates.screenX,\n screenY: nextCoordinates.screenY,\n };\n\n const isHorizontal = direction === \"horizontal\";\n const movement = isHorizontal\n ? nextCoordinates.movementX\n : nextCoordinates.movementY;\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) => setActiveHandleId(id),\n stopDragging: () => {\n setActiveHandleId(null);\n prevCoordinatesRef.current = {\n screenX: 0,\n screenY: 0,\n };\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 className={className}>{children}</div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(id: string | null = null): string {\n const idRef = useRef<string | null>(id);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\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\";\n\nexport type Coordinates = {\n screenX: number;\n screenY: number;\n};\n\nexport type Dimensions = {\n height: number;\n width: number;\n};\n\nexport type Movement = {\n movementX: number;\n movementY: number;\n};\n\nconst element = document.createElement(\"div\");\nelement.getBoundingClientRect();\n\n// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/movementX\nexport function getUpdatedCoordinates(\n event: ResizeEvent,\n prevCoordinates: Coordinates,\n dimensions: Dimensions,\n direction: Direction\n): Coordinates & Movement {\n const { screenX: prevScreenX, screenY: prevScreenY } = prevCoordinates;\n const { height, width } = dimensions;\n\n const getMovementBetween = (current: number, prev: number) =>\n prev === 0 ? 0 : current - prev;\n\n if (isKeyDown(event)) {\n let movementX = 0;\n let movementY = 0;\n\n const size = direction === \"horizontal\" ? width : height;\n const denominator = event.shiftKey ? 10 : 100;\n const delta = size / denominator;\n\n switch (event.key) {\n case \"ArrowDown\":\n movementY = delta;\n break;\n case \"ArrowLeft\":\n movementX = -delta;\n break;\n case \"ArrowRight\":\n movementX = delta;\n break;\n case \"ArrowUp\":\n movementY = -delta;\n break;\n case \"End\":\n if (direction === \"horizontal\") {\n movementX = size;\n } else {\n movementY = size;\n }\n break;\n case \"Home\":\n if (direction === \"horizontal\") {\n movementX = -size;\n } else {\n movementY = -size;\n }\n break;\n }\n\n // Estimate screen X/Y to be the center of the resize handle.\n // Otherwise the first mouse/touch event after a keyboard event will appear to \"jump\"\n let screenX = 0;\n let screenY = 0;\n if (document.activeElement) {\n const rect = document.activeElement.getBoundingClientRect();\n screenX = rect.left + rect.width / 2;\n screenY = rect.top + rect.height / 2;\n }\n\n return {\n movementX,\n movementY,\n screenX,\n screenY,\n };\n } else if (isTouchMoveEvent(event)) {\n const firstTouch = event.touches[0];\n\n return {\n movementX: getMovementBetween(firstTouch.screenX, prevScreenX),\n movementY: getMovementBetween(firstTouch.screenY, prevScreenY),\n screenX: firstTouch.screenX,\n screenY: firstTouch.screenY,\n };\n } else if (isMouseMoveEvent(event)) {\n return {\n movementX: getMovementBetween(event.screenX, prevScreenX),\n movementY: getMovementBetween(event.screenY, prevScreenY),\n screenX: event.screenX,\n screenY: event.screenY,\n };\n } else {\n throw Error(`Unsupported event type: \"${(event as any).type}\"`);\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseMoveEvent(event: ResizeEvent): event is MouseEvent {\n return event.type === \"mousemove\";\n}\n\nexport function isTouchMoveEvent(event: ResizeEvent): event is TouchEvent {\n return event.type === \"touchmove\";\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 { ReactNode, useContext, useEffect, useState } from \"react\";\n\nimport useUniqueId from \"./hooks/useUniqueId\";\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: idProp = null,\n}: {\n children?: ReactNode;\n className?: string;\n disabled?: boolean;\n id?: string | 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 id = useUniqueId(idProp);\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const isDragging = activeHandleId === id;\n\n const [resizeHandler, setResizeHandler] = useState<ResizeHandler | null>(\n null\n );\n\n useEffect(() => {\n if (disabled) {\n setResizeHandler(null);\n } else {\n const resizeHandler = registerResizeHandle(id);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, id, 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(\"mouseleave\", stopDragging);\n document.body.addEventListener(\"mousemove\", onMove);\n document.body.addEventListener(\"touchmove\", onMove);\n document.body.addEventListener(\"mouseup\", stopDragging);\n\n return () => {\n document.body.style.cursor = \"\";\n\n document.body.removeEventListener(\"mouseleave\", stopDragging);\n document.body.removeEventListener(\"mousemove\", onMove);\n document.body.removeEventListener(\"touchmove\", onMove);\n document.body.removeEventListener(\"mouseup\", stopDragging);\n };\n }, [direction, disabled, isDragging, resizeHandler, stopDragging]);\n\n useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId: id,\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={id}\n onMouseDown={() => startDragging(id)}\n onMouseUp={stopDragging}\n onTouchCancel={stopDragging}\n onTouchEnd={stopDragging}\n onTouchStart={() => startDragging(id)}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.js.map","sourceRoot":"../../../"}
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/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","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\";\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,\n minSize = 0.1,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number;\n id: string;\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 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,\n minSize,\n order,\n };\n\n registerPanel(id, panel);\n\n return () => {\n unregisterPanel(id);\n };\n }, [defaultSize, id, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(id);\n\n return (\n <div\n className={className}\n data-panel-id={id}\n id={`data-panel-id-${id}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, 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) => 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\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { getMovement } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getOffset,\n getResizeHandlePanelIds,\n getSize,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\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 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 width,\n}: Props) {\n const groupId = useUniqueId();\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 // 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 );\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) => setActiveHandleId(id),\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 className={className}>{children}</div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(id: string | null = null): string {\n const idRef = useRef<string | null>(id);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\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\nconst element = document.createElement(\"div\");\nelement.getBoundingClientRect();\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): 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 const handleElement = getResizeHandle(handleId)!;\n const rect = handleElement.getBoundingClientRect();\n const elementOffset = isHorizontal ? rect.left : rect.top;\n\n let pointerOffset = 0;\n if (isMouseMoveEvent(event)) {\n pointerOffset = isHorizontal ? event.clientX : event.clientY;\n } else {\n const firstTouch = event.touches[0];\n pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;\n }\n\n return pointerOffset - elementOffset;\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseMoveEvent(event: ResizeEvent): event is MouseEvent {\n return event.type === \"mousemove\";\n}\n\nexport function isTouchMoveEvent(event: ResizeEvent): event is TouchEvent {\n return event.type === \"touchmove\";\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\";\n\nimport useUniqueId from \"./hooks/useUniqueId\";\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: idProp = 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 id = useUniqueId(idProp);\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const isDragging = activeHandleId === id;\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(id);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, id, 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(\"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(\"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: id,\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={id}\n onMouseDown={() => startDragging(id)}\n onMouseUp={stopDraggingAndBlur}\n onTouchCancel={stopDraggingAndBlur}\n onTouchEnd={stopDraggingAndBlur}\n onTouchStart={() => startDragging(id)}\n ref={divElementRef}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.js.map","sourceRoot":"../../../"}
@@ -89,82 +89,6 @@ function $6ff1a22b27cc039d$export$af183b313c61be4f(autoSaveId, panelIds, sizes)
89
89
  }
90
90
 
91
91
 
92
- const $96f6397ae645d178$var$element = document.createElement("div");
93
- $96f6397ae645d178$var$element.getBoundingClientRect();
94
- function $96f6397ae645d178$export$70637efcd850e4ef(event, prevCoordinates, dimensions, direction) {
95
- const { screenX: prevScreenX , screenY: prevScreenY } = prevCoordinates;
96
- const { height: height , width: width } = dimensions;
97
- const getMovementBetween = (current, prev)=>prev === 0 ? 0 : current - prev;
98
- if ($96f6397ae645d178$export$e7bf60a870f429b0(event)) {
99
- let movementX = 0;
100
- let movementY = 0;
101
- const size = direction === "horizontal" ? width : height;
102
- const denominator = event.shiftKey ? 10 : 100;
103
- const delta = size / denominator;
104
- switch(event.key){
105
- case "ArrowDown":
106
- movementY = delta;
107
- break;
108
- case "ArrowLeft":
109
- movementX = -delta;
110
- break;
111
- case "ArrowRight":
112
- movementX = delta;
113
- break;
114
- case "ArrowUp":
115
- movementY = -delta;
116
- break;
117
- case "End":
118
- if (direction === "horizontal") movementX = size;
119
- else movementY = size;
120
- break;
121
- case "Home":
122
- if (direction === "horizontal") movementX = -size;
123
- else movementY = -size;
124
- break;
125
- }
126
- // Estimate screen X/Y to be the center of the resize handle.
127
- // Otherwise the first mouse/touch event after a keyboard event will appear to "jump"
128
- let screenX = 0;
129
- let screenY = 0;
130
- if (document.activeElement) {
131
- const rect = document.activeElement.getBoundingClientRect();
132
- screenX = rect.left + rect.width / 2;
133
- screenY = rect.top + rect.height / 2;
134
- }
135
- return {
136
- movementX: movementX,
137
- movementY: movementY,
138
- screenX: screenX,
139
- screenY: screenY
140
- };
141
- } else if ($96f6397ae645d178$export$ce897e7f0aa63661(event)) {
142
- const firstTouch = event.touches[0];
143
- return {
144
- movementX: getMovementBetween(firstTouch.screenX, prevScreenX),
145
- movementY: getMovementBetween(firstTouch.screenY, prevScreenY),
146
- screenX: firstTouch.screenX,
147
- screenY: firstTouch.screenY
148
- };
149
- } else if ($96f6397ae645d178$export$5107d838cdd17dee(event)) return {
150
- movementX: getMovementBetween(event.screenX, prevScreenX),
151
- movementY: getMovementBetween(event.screenY, prevScreenY),
152
- screenX: event.screenX,
153
- screenY: event.screenY
154
- };
155
- else throw Error(`Unsupported event type: "${event.type}"`);
156
- }
157
- function $96f6397ae645d178$export$e7bf60a870f429b0(event) {
158
- return event.type === "keydown";
159
- }
160
- function $96f6397ae645d178$export$5107d838cdd17dee(event) {
161
- return event.type === "mousemove";
162
- }
163
- function $96f6397ae645d178$export$ce897e7f0aa63661(event) {
164
- return event.type === "touchmove";
165
- }
166
-
167
-
168
92
  const $fc25b75732bfda27$export$d6d3992f3becc879 = 5;
169
93
 
170
94
 
@@ -263,6 +187,55 @@ function $f30c804b5fe6cc1a$export$31b21d0167753bb4(panels, id, direction, sizes,
263
187
  }
264
188
 
265
189
 
190
+ const $96f6397ae645d178$var$element = document.createElement("div");
191
+ $96f6397ae645d178$var$element.getBoundingClientRect();
192
+ function $96f6397ae645d178$export$354b17c0684607ed(event, handleId, { height: height , width: width }, direction) {
193
+ const isHorizontal = direction === "horizontal";
194
+ const size = isHorizontal ? width : height;
195
+ if ($96f6397ae645d178$export$e7bf60a870f429b0(event)) {
196
+ const denominator = event.shiftKey ? 10 : 100;
197
+ const delta = size / denominator;
198
+ switch(event.key){
199
+ case "ArrowDown":
200
+ return delta;
201
+ case "ArrowLeft":
202
+ return -delta;
203
+ case "ArrowRight":
204
+ return delta;
205
+ case "ArrowUp":
206
+ return -delta;
207
+ case "End":
208
+ if (isHorizontal) return size;
209
+ else return size;
210
+ case "Home":
211
+ if (isHorizontal) return -size;
212
+ else return -size;
213
+ }
214
+ } else {
215
+ const handleElement = (0, $f30c804b5fe6cc1a$export$2e27d3a347680388)(handleId);
216
+ const rect = handleElement.getBoundingClientRect();
217
+ const elementOffset = isHorizontal ? rect.left : rect.top;
218
+ let pointerOffset = 0;
219
+ if ($96f6397ae645d178$export$5107d838cdd17dee(event)) pointerOffset = isHorizontal ? event.clientX : event.clientY;
220
+ else {
221
+ const firstTouch = event.touches[0];
222
+ pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;
223
+ }
224
+ return pointerOffset - elementOffset;
225
+ }
226
+ }
227
+ function $96f6397ae645d178$export$e7bf60a870f429b0(event) {
228
+ return event.type === "keydown";
229
+ }
230
+ function $96f6397ae645d178$export$5107d838cdd17dee(event) {
231
+ return event.type === "mousemove";
232
+ }
233
+ function $96f6397ae645d178$export$ce897e7f0aa63661(event) {
234
+ return event.type === "touchmove";
235
+ }
236
+
237
+
238
+
266
239
 
267
240
 
268
241
 
@@ -377,12 +350,6 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
377
350
  sizes: sizes,
378
351
  width: width
379
352
  });
380
- // Tracks the most recent coordinates of a touch/mouse event.
381
- // This is needed to calculate movement (because TouchEvent doesn't support movementX and movementY).
382
- const prevCoordinatesRef = (0, $fpI56$useRef)({
383
- screenX: 0,
384
- screenY: 0
385
- });
386
353
  (0, $fpI56$useLayoutEffect)(()=>{
387
354
  committedValuesRef.current.direction = direction;
388
355
  committedValuesRef.current.height = height;
@@ -475,16 +442,11 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
475
442
  const panelsArray = (0, $f30c804b5fe6cc1a$export$a861c0ad45885494)(panels);
476
443
  const [idBefore, idAfter] = (0, $f30c804b5fe6cc1a$export$68d3a33c21dfbe27)(groupId, handleId, panelsArray);
477
444
  if (idBefore == null || idAfter == null) return;
478
- const nextCoordinates = (0, $96f6397ae645d178$export$70637efcd850e4ef)(event, prevCoordinatesRef.current, {
445
+ const movement = (0, $96f6397ae645d178$export$354b17c0684607ed)(event, handleId, {
479
446
  height: height,
480
447
  width: width
481
448
  }, direction);
482
- prevCoordinatesRef.current = {
483
- screenX: nextCoordinates.screenX,
484
- screenY: nextCoordinates.screenY
485
- };
486
449
  const isHorizontal = direction === "horizontal";
487
- const movement = isHorizontal ? nextCoordinates.movementX : nextCoordinates.movementY;
488
450
  const delta = isHorizontal ? movement / width : movement / height;
489
451
  const nextSizes = (0, $f30c804b5fe6cc1a$export$f50bae335f53943c)(panels, idBefore, idAfter, delta, prevSizes);
490
452
  if (prevSizes !== nextSizes) setSizes(nextSizes);
@@ -510,10 +472,6 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
510
472
  startDragging: (id)=>setActiveHandleId(id),
511
473
  stopDragging: ()=>{
512
474
  setActiveHandleId(null);
513
- prevCoordinatesRef.current = {
514
- screenX: 0,
515
- screenY: 0
516
- };
517
475
  },
518
476
  unregisterPanel: unregisterPanel
519
477
  }), [
@@ -538,17 +496,17 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
538
496
  children: children
539
497
  }, void 0, false, {
540
498
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
541
- lineNumber: 290,
499
+ lineNumber: 272,
542
500
  columnNumber: 9
543
501
  }, this)
544
502
  }, void 0, false, {
545
503
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
546
- lineNumber: 289,
504
+ lineNumber: 271,
547
505
  columnNumber: 7
548
506
  }, this)
549
507
  }, void 0, false, {
550
508
  fileName: "packages/react-resizable-panels/src/PanelGroup.tsx",
551
- lineNumber: 288,
509
+ lineNumber: 270,
552
510
  columnNumber: 5
553
511
  }, this);
554
512
  }
@@ -560,6 +518,7 @@ function $c44ee3356398c8a1$export$2e2bcd8739ae039({ autoSaveId: autoSaveId , chi
560
518
 
561
519
 
562
520
  function $b067b37706bb37b8$export$2e2bcd8739ae039({ children: children = null , className: className = "" , disabled: disabled = false , id: idProp = null }) {
521
+ const divElementRef = (0, $b067b37706bb37b8$import$65588215f5c347c3$b8f5890fc79d6aca)(null);
563
522
  const panelContext = (0, $fpI56$useContext)((0, $f922724f4bad4884$export$f34532ac99e32150));
564
523
  const panelGroupContext = (0, $fpI56$useContext)((0, $f922724f4bad4884$export$7d8c6d083caec74a));
565
524
  if (panelContext === null || panelGroupContext === null) throw Error(`PanelResizeHandle components must be rendered within a PanelGroup container`);
@@ -568,6 +527,15 @@ function $b067b37706bb37b8$export$2e2bcd8739ae039({ children: children = null ,
568
527
  const { direction: direction , groupId: groupId , registerResizeHandle: registerResizeHandle , startDragging: startDragging , stopDragging: stopDragging } = panelGroupContext;
569
528
  const isDragging = activeHandleId === id;
570
529
  const [resizeHandler, setResizeHandler] = (0, $fpI56$useState)(null);
530
+ const stopDraggingAndBlur = (0, $b067b37706bb37b8$import$65588215f5c347c3$35808ee640e87ca7)(()=>{
531
+ // Clicking on the drag handle shouldn't leave it focused;
532
+ // That would cause the PanelGroup to think it was still active.
533
+ const div = divElementRef.current;
534
+ div.blur();
535
+ stopDragging();
536
+ }, [
537
+ stopDragging
538
+ ]);
571
539
  (0, $fpI56$useEffect)(()=>{
572
540
  if (disabled) setResizeHandler(null);
573
541
  else {
@@ -585,23 +553,23 @@ function $b067b37706bb37b8$export$2e2bcd8739ae039({ children: children = null ,
585
553
  const onMove = (event)=>{
586
554
  resizeHandler(event);
587
555
  };
588
- document.body.addEventListener("mouseleave", stopDragging);
556
+ document.body.addEventListener("mouseleave", stopDraggingAndBlur);
589
557
  document.body.addEventListener("mousemove", onMove);
590
558
  document.body.addEventListener("touchmove", onMove);
591
- document.body.addEventListener("mouseup", stopDragging);
559
+ document.body.addEventListener("mouseup", stopDraggingAndBlur);
592
560
  return ()=>{
593
561
  document.body.style.cursor = "";
594
- document.body.removeEventListener("mouseleave", stopDragging);
562
+ document.body.removeEventListener("mouseleave", stopDraggingAndBlur);
595
563
  document.body.removeEventListener("mousemove", onMove);
596
564
  document.body.removeEventListener("touchmove", onMove);
597
- document.body.removeEventListener("mouseup", stopDragging);
565
+ document.body.removeEventListener("mouseup", stopDraggingAndBlur);
598
566
  };
599
567
  }, [
600
568
  direction,
601
569
  disabled,
602
570
  isDragging,
603
571
  resizeHandler,
604
- stopDragging
572
+ stopDraggingAndBlur
605
573
  ]);
606
574
  (0, $99ad02c951ec80d0$export$33b0bea6ac3ffb03)({
607
575
  disabled: disabled,
@@ -614,10 +582,11 @@ function $b067b37706bb37b8$export$2e2bcd8739ae039({ children: children = null ,
614
582
  "data-panel-resize-handle-enabled": !disabled,
615
583
  "data-panel-resize-handle-id": id,
616
584
  onMouseDown: ()=>startDragging(id),
617
- onMouseUp: stopDragging,
618
- onTouchCancel: stopDragging,
619
- onTouchEnd: stopDragging,
585
+ onMouseUp: stopDraggingAndBlur,
586
+ onTouchCancel: stopDraggingAndBlur,
587
+ onTouchEnd: stopDraggingAndBlur,
620
588
  onTouchStart: ()=>startDragging(id),
589
+ ref: divElementRef,
621
590
  role: "separator",
622
591
  style: {
623
592
  cursor: direction === "horizontal" ? "ew-resize" : "ns-resize",
@@ -627,7 +596,7 @@ function $b067b37706bb37b8$export$2e2bcd8739ae039({ children: children = null ,
627
596
  children: children
628
597
  }, void 0, false, {
629
598
  fileName: "packages/react-resizable-panels/src/PanelResizeHandle.tsx",
630
- lineNumber: 87,
599
+ lineNumber: 105,
631
600
  columnNumber: 5
632
601
  }, this);
633
602
  }
@@ -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/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","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\";\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,\n minSize = 0.1,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number;\n id: string;\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 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,\n minSize,\n order,\n };\n\n registerPanel(id, panel);\n\n return () => {\n unregisterPanel(id);\n };\n }, [defaultSize, id, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(id);\n\n return (\n <div\n className={className}\n data-panel-id={id}\n id={`data-panel-id-${id}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, 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) => 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\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { Coordinates, getUpdatedCoordinates } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getOffset,\n getResizeHandlePanelIds,\n getSize,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\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 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 width,\n}: Props) {\n const groupId = useUniqueId();\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 // 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 // Tracks the most recent coordinates of a touch/mouse event.\n // This is needed to calculate movement (because TouchEvent doesn't support movementX and movementY).\n const prevCoordinatesRef = useRef<Coordinates>({\n screenX: 0,\n screenY: 0,\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 nextCoordinates = getUpdatedCoordinates(\n event,\n prevCoordinatesRef.current,\n { height, width },\n direction\n );\n prevCoordinatesRef.current = {\n screenX: nextCoordinates.screenX,\n screenY: nextCoordinates.screenY,\n };\n\n const isHorizontal = direction === \"horizontal\";\n const movement = isHorizontal\n ? nextCoordinates.movementX\n : nextCoordinates.movementY;\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) => setActiveHandleId(id),\n stopDragging: () => {\n setActiveHandleId(null);\n prevCoordinatesRef.current = {\n screenX: 0,\n screenY: 0,\n };\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 className={className}>{children}</div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(id: string | null = null): string {\n const idRef = useRef<string | null>(id);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\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\";\n\nexport type Coordinates = {\n screenX: number;\n screenY: number;\n};\n\nexport type Dimensions = {\n height: number;\n width: number;\n};\n\nexport type Movement = {\n movementX: number;\n movementY: number;\n};\n\nconst element = document.createElement(\"div\");\nelement.getBoundingClientRect();\n\n// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/movementX\nexport function getUpdatedCoordinates(\n event: ResizeEvent,\n prevCoordinates: Coordinates,\n dimensions: Dimensions,\n direction: Direction\n): Coordinates & Movement {\n const { screenX: prevScreenX, screenY: prevScreenY } = prevCoordinates;\n const { height, width } = dimensions;\n\n const getMovementBetween = (current: number, prev: number) =>\n prev === 0 ? 0 : current - prev;\n\n if (isKeyDown(event)) {\n let movementX = 0;\n let movementY = 0;\n\n const size = direction === \"horizontal\" ? width : height;\n const denominator = event.shiftKey ? 10 : 100;\n const delta = size / denominator;\n\n switch (event.key) {\n case \"ArrowDown\":\n movementY = delta;\n break;\n case \"ArrowLeft\":\n movementX = -delta;\n break;\n case \"ArrowRight\":\n movementX = delta;\n break;\n case \"ArrowUp\":\n movementY = -delta;\n break;\n case \"End\":\n if (direction === \"horizontal\") {\n movementX = size;\n } else {\n movementY = size;\n }\n break;\n case \"Home\":\n if (direction === \"horizontal\") {\n movementX = -size;\n } else {\n movementY = -size;\n }\n break;\n }\n\n // Estimate screen X/Y to be the center of the resize handle.\n // Otherwise the first mouse/touch event after a keyboard event will appear to \"jump\"\n let screenX = 0;\n let screenY = 0;\n if (document.activeElement) {\n const rect = document.activeElement.getBoundingClientRect();\n screenX = rect.left + rect.width / 2;\n screenY = rect.top + rect.height / 2;\n }\n\n return {\n movementX,\n movementY,\n screenX,\n screenY,\n };\n } else if (isTouchMoveEvent(event)) {\n const firstTouch = event.touches[0];\n\n return {\n movementX: getMovementBetween(firstTouch.screenX, prevScreenX),\n movementY: getMovementBetween(firstTouch.screenY, prevScreenY),\n screenX: firstTouch.screenX,\n screenY: firstTouch.screenY,\n };\n } else if (isMouseMoveEvent(event)) {\n return {\n movementX: getMovementBetween(event.screenX, prevScreenX),\n movementY: getMovementBetween(event.screenY, prevScreenY),\n screenX: event.screenX,\n screenY: event.screenY,\n };\n } else {\n throw Error(`Unsupported event type: \"${(event as any).type}\"`);\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseMoveEvent(event: ResizeEvent): event is MouseEvent {\n return event.type === \"mousemove\";\n}\n\nexport function isTouchMoveEvent(event: ResizeEvent): event is TouchEvent {\n return event.type === \"touchmove\";\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 { ReactNode, useContext, useEffect, useState } from \"react\";\n\nimport useUniqueId from \"./hooks/useUniqueId\";\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: idProp = null,\n}: {\n children?: ReactNode;\n className?: string;\n disabled?: boolean;\n id?: string | 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 id = useUniqueId(idProp);\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const isDragging = activeHandleId === id;\n\n const [resizeHandler, setResizeHandler] = useState<ResizeHandler | null>(\n null\n );\n\n useEffect(() => {\n if (disabled) {\n setResizeHandler(null);\n } else {\n const resizeHandler = registerResizeHandle(id);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, id, 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(\"mouseleave\", stopDragging);\n document.body.addEventListener(\"mousemove\", onMove);\n document.body.addEventListener(\"touchmove\", onMove);\n document.body.addEventListener(\"mouseup\", stopDragging);\n\n return () => {\n document.body.style.cursor = \"\";\n\n document.body.removeEventListener(\"mouseleave\", stopDragging);\n document.body.removeEventListener(\"mousemove\", onMove);\n document.body.removeEventListener(\"touchmove\", onMove);\n document.body.removeEventListener(\"mouseup\", stopDragging);\n };\n }, [direction, disabled, isDragging, resizeHandler, stopDragging]);\n\n useWindowSplitterResizeHandlerBehavior({\n disabled,\n handleId: id,\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={id}\n onMouseDown={() => startDragging(id)}\n onMouseUp={stopDragging}\n onTouchCancel={stopDragging}\n onTouchEnd={stopDragging}\n onTouchStart={() => startDragging(id)}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.module.js.map","sourceRoot":"../../../"}
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/PanelContexts.ts","packages/react-resizable-panels/src/PanelGroup.tsx","packages/react-resizable-panels/src/hooks/useUniqueId.ts","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\";\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,\n minSize = 0.1,\n order = null,\n}: {\n children?: ReactNode;\n className?: string;\n defaultSize?: number;\n id: string;\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 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,\n minSize,\n order,\n };\n\n registerPanel(id, panel);\n\n return () => {\n unregisterPanel(id);\n };\n }, [defaultSize, id, minSize, order, registerPanel, unregisterPanel]);\n\n const style = getPanelStyle(id);\n\n return (\n <div\n className={className}\n data-panel-id={id}\n id={`data-panel-id-${id}`}\n style={style}\n >\n {children}\n </div>\n );\n}\n","import { CSSProperties, createContext } from \"react\";\n\nimport { PanelData, 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) => 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\";\nimport useUniqueId from \"./hooks/useUniqueId\";\n\nimport { PanelContext, PanelGroupContext } from \"./PanelContexts\";\nimport { Direction, PanelData, ResizeEvent } from \"./types\";\nimport { loadPanelLayout, savePanelGroupLayout } from \"./utils/serialization\";\nimport { getMovement } from \"./utils/coordinates\";\nimport {\n adjustByDelta,\n getOffset,\n getResizeHandlePanelIds,\n getSize,\n panelsMapToSortedArray,\n} from \"./utils/group\";\nimport { useWindowSplitterPanelGroupBehavior } from \"./hooks/useWindowSplitterBehavior\";\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 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 width,\n}: Props) {\n const groupId = useUniqueId();\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 // 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 );\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) => setActiveHandleId(id),\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 className={className}>{children}</div>\n </PanelGroupContext.Provider>\n </PanelContext.Provider>\n );\n}\n","import { useRef } from \"react\";\n\nlet counter = 0;\n\nexport default function useUniqueId(id: string | null = null): string {\n const idRef = useRef<string | null>(id);\n if (idRef.current === null) {\n idRef.current = \"\" + counter++;\n }\n\n return idRef.current;\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\nconst element = document.createElement(\"div\");\nelement.getBoundingClientRect();\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): 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 const handleElement = getResizeHandle(handleId)!;\n const rect = handleElement.getBoundingClientRect();\n const elementOffset = isHorizontal ? rect.left : rect.top;\n\n let pointerOffset = 0;\n if (isMouseMoveEvent(event)) {\n pointerOffset = isHorizontal ? event.clientX : event.clientY;\n } else {\n const firstTouch = event.touches[0];\n pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;\n }\n\n return pointerOffset - elementOffset;\n }\n}\n\nexport function isKeyDown(event: ResizeEvent): event is KeyboardEvent {\n return event.type === \"keydown\";\n}\n\nexport function isMouseMoveEvent(event: ResizeEvent): event is MouseEvent {\n return event.type === \"mousemove\";\n}\n\nexport function isTouchMoveEvent(event: ResizeEvent): event is TouchEvent {\n return event.type === \"touchmove\";\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\";\n\nimport useUniqueId from \"./hooks/useUniqueId\";\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: idProp = 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 id = useUniqueId(idProp);\n\n const { activeHandleId } = panelContext;\n const {\n direction,\n groupId,\n registerResizeHandle,\n startDragging,\n stopDragging,\n } = panelGroupContext;\n\n const isDragging = activeHandleId === id;\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(id);\n setResizeHandler(() => resizeHandler);\n }\n }, [disabled, id, 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(\"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(\"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: id,\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={id}\n onMouseDown={() => startDragging(id)}\n onMouseUp={stopDraggingAndBlur}\n onTouchCancel={stopDraggingAndBlur}\n onTouchEnd={stopDraggingAndBlur}\n onTouchStart={() => startDragging(id)}\n ref={divElementRef}\n role=\"separator\"\n style={{\n cursor: direction === \"horizontal\" ? \"ew-resize\" : \"ns-resize\",\n touchAction: \"none\",\n }}\n tabIndex={0}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"react-resizable-panels.module.js.map","sourceRoot":"../../../"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-resizable-panels",
3
- "version": "0.0.9",
3
+ "version": "0.0.10",
4
4
  "description": "React components for resizable panel groups/layouts",
5
5
  "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
6
6
  "license": "MIT",
@@ -13,7 +13,7 @@ import useUniqueId from "./hooks/useUniqueId";
13
13
  import { PanelContext, PanelGroupContext } from "./PanelContexts";
14
14
  import { Direction, PanelData, ResizeEvent } from "./types";
15
15
  import { loadPanelLayout, savePanelGroupLayout } from "./utils/serialization";
16
- import { Coordinates, getUpdatedCoordinates } from "./utils/coordinates";
16
+ import { getMovement } from "./utils/coordinates";
17
17
  import {
18
18
  adjustByDelta,
19
19
  getOffset,
@@ -71,13 +71,6 @@ export default function PanelGroup({
71
71
  width,
72
72
  });
73
73
 
74
- // Tracks the most recent coordinates of a touch/mouse event.
75
- // This is needed to calculate movement (because TouchEvent doesn't support movementX and movementY).
76
- const prevCoordinatesRef = useRef<Coordinates>({
77
- screenX: 0,
78
- screenY: 0,
79
- });
80
-
81
74
  useLayoutEffect(() => {
82
75
  committedValuesRef.current.direction = direction;
83
76
  committedValuesRef.current.height = height;
@@ -203,21 +196,14 @@ export default function PanelGroup({
203
196
  return;
204
197
  }
205
198
 
206
- const nextCoordinates = getUpdatedCoordinates(
199
+ const movement = getMovement(
207
200
  event,
208
- prevCoordinatesRef.current,
201
+ handleId,
209
202
  { height, width },
210
203
  direction
211
204
  );
212
- prevCoordinatesRef.current = {
213
- screenX: nextCoordinates.screenX,
214
- screenY: nextCoordinates.screenY,
215
- };
216
205
 
217
206
  const isHorizontal = direction === "horizontal";
218
- const movement = isHorizontal
219
- ? nextCoordinates.movementX
220
- : nextCoordinates.movementY;
221
207
  const delta = isHorizontal ? movement / width : movement / height;
222
208
 
223
209
  const nextSizes = adjustByDelta(
@@ -260,10 +246,6 @@ export default function PanelGroup({
260
246
  startDragging: (id: string) => setActiveHandleId(id),
261
247
  stopDragging: () => {
262
248
  setActiveHandleId(null);
263
- prevCoordinatesRef.current = {
264
- screenX: 0,
265
- screenY: 0,
266
- };
267
249
  },
268
250
  unregisterPanel,
269
251
  }),
@@ -1,4 +1,11 @@
1
- import { ReactNode, useContext, useEffect, useState } from "react";
1
+ import {
2
+ ReactNode,
3
+ useCallback,
4
+ useContext,
5
+ useEffect,
6
+ useRef,
7
+ useState,
8
+ } from "react";
2
9
 
3
10
  import useUniqueId from "./hooks/useUniqueId";
4
11
  import { useWindowSplitterResizeHandlerBehavior } from "./hooks/useWindowSplitterBehavior";
@@ -16,6 +23,8 @@ export default function PanelResizeHandle({
16
23
  disabled?: boolean;
17
24
  id?: string | null;
18
25
  }) {
26
+ const divElementRef = useRef<HTMLDivElement>(null);
27
+
19
28
  const panelContext = useContext(PanelContext);
20
29
  const panelGroupContext = useContext(PanelGroupContext);
21
30
  if (panelContext === null || panelGroupContext === null) {
@@ -41,6 +50,15 @@ export default function PanelResizeHandle({
41
50
  null
42
51
  );
43
52
 
53
+ const stopDraggingAndBlur = useCallback(() => {
54
+ // Clicking on the drag handle shouldn't leave it focused;
55
+ // That would cause the PanelGroup to think it was still active.
56
+ const div = divElementRef.current!;
57
+ div.blur();
58
+
59
+ stopDragging();
60
+ }, [stopDragging]);
61
+
44
62
  useEffect(() => {
45
63
  if (disabled) {
46
64
  setResizeHandler(null);
@@ -62,20 +80,20 @@ export default function PanelResizeHandle({
62
80
  resizeHandler(event);
63
81
  };
64
82
 
65
- document.body.addEventListener("mouseleave", stopDragging);
83
+ document.body.addEventListener("mouseleave", stopDraggingAndBlur);
66
84
  document.body.addEventListener("mousemove", onMove);
67
85
  document.body.addEventListener("touchmove", onMove);
68
- document.body.addEventListener("mouseup", stopDragging);
86
+ document.body.addEventListener("mouseup", stopDraggingAndBlur);
69
87
 
70
88
  return () => {
71
89
  document.body.style.cursor = "";
72
90
 
73
- document.body.removeEventListener("mouseleave", stopDragging);
91
+ document.body.removeEventListener("mouseleave", stopDraggingAndBlur);
74
92
  document.body.removeEventListener("mousemove", onMove);
75
93
  document.body.removeEventListener("touchmove", onMove);
76
- document.body.removeEventListener("mouseup", stopDragging);
94
+ document.body.removeEventListener("mouseup", stopDraggingAndBlur);
77
95
  };
78
- }, [direction, disabled, isDragging, resizeHandler, stopDragging]);
96
+ }, [direction, disabled, isDragging, resizeHandler, stopDraggingAndBlur]);
79
97
 
80
98
  useWindowSplitterResizeHandlerBehavior({
81
99
  disabled,
@@ -90,10 +108,11 @@ export default function PanelResizeHandle({
90
108
  data-panel-resize-handle-enabled={!disabled}
91
109
  data-panel-resize-handle-id={id}
92
110
  onMouseDown={() => startDragging(id)}
93
- onMouseUp={stopDragging}
94
- onTouchCancel={stopDragging}
95
- onTouchEnd={stopDragging}
111
+ onMouseUp={stopDraggingAndBlur}
112
+ onTouchCancel={stopDraggingAndBlur}
113
+ onTouchEnd={stopDraggingAndBlur}
96
114
  onTouchStart={() => startDragging(id)}
115
+ ref={divElementRef}
97
116
  role="separator"
98
117
  style={{
99
118
  cursor: direction === "horizontal" ? "ew-resize" : "ns-resize",
@@ -1,107 +1,69 @@
1
1
  import { Direction, ResizeEvent } from "../types";
2
+ import { getResizeHandle } from "./group";
2
3
 
3
4
  export type Coordinates = {
4
- screenX: number;
5
- screenY: number;
5
+ movement: number;
6
+ offset: number;
6
7
  };
7
8
 
8
- export type Dimensions = {
9
+ export type Size = {
9
10
  height: number;
10
11
  width: number;
11
12
  };
12
13
 
13
- export type Movement = {
14
- movementX: number;
15
- movementY: number;
16
- };
17
-
18
14
  const element = document.createElement("div");
19
15
  element.getBoundingClientRect();
20
16
 
21
17
  // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/movementX
22
- export function getUpdatedCoordinates(
18
+ export function getMovement(
23
19
  event: ResizeEvent,
24
- prevCoordinates: Coordinates,
25
- dimensions: Dimensions,
20
+ handleId: string,
21
+ { height, width }: Size,
26
22
  direction: Direction
27
- ): Coordinates & Movement {
28
- const { screenX: prevScreenX, screenY: prevScreenY } = prevCoordinates;
29
- const { height, width } = dimensions;
30
-
31
- const getMovementBetween = (current: number, prev: number) =>
32
- prev === 0 ? 0 : current - prev;
23
+ ): number {
24
+ const isHorizontal = direction === "horizontal";
25
+ const size = isHorizontal ? width : height;
33
26
 
34
27
  if (isKeyDown(event)) {
35
- let movementX = 0;
36
- let movementY = 0;
37
-
38
- const size = direction === "horizontal" ? width : height;
39
28
  const denominator = event.shiftKey ? 10 : 100;
40
29
  const delta = size / denominator;
41
30
 
42
31
  switch (event.key) {
43
32
  case "ArrowDown":
44
- movementY = delta;
45
- break;
33
+ return delta;
46
34
  case "ArrowLeft":
47
- movementX = -delta;
48
- break;
35
+ return -delta;
49
36
  case "ArrowRight":
50
- movementX = delta;
51
- break;
37
+ return delta;
52
38
  case "ArrowUp":
53
- movementY = -delta;
54
- break;
39
+ return -delta;
55
40
  case "End":
56
- if (direction === "horizontal") {
57
- movementX = size;
41
+ if (isHorizontal) {
42
+ return size;
58
43
  } else {
59
- movementY = size;
44
+ return size;
60
45
  }
61
- break;
62
46
  case "Home":
63
- if (direction === "horizontal") {
64
- movementX = -size;
47
+ if (isHorizontal) {
48
+ return -size;
65
49
  } else {
66
- movementY = -size;
50
+ return -size;
67
51
  }
68
- break;
69
52
  }
53
+ } else {
54
+ const handleElement = getResizeHandle(handleId)!;
55
+ const rect = handleElement.getBoundingClientRect();
56
+ const elementOffset = isHorizontal ? rect.left : rect.top;
70
57
 
71
- // Estimate screen X/Y to be the center of the resize handle.
72
- // Otherwise the first mouse/touch event after a keyboard event will appear to "jump"
73
- let screenX = 0;
74
- let screenY = 0;
75
- if (document.activeElement) {
76
- const rect = document.activeElement.getBoundingClientRect();
77
- screenX = rect.left + rect.width / 2;
78
- screenY = rect.top + rect.height / 2;
58
+ let pointerOffset = 0;
59
+ if (isMouseMoveEvent(event)) {
60
+ pointerOffset = isHorizontal ? event.clientX : event.clientY;
61
+ } else {
62
+ const firstTouch = event.touches[0];
63
+ pointerOffset = isHorizontal ? firstTouch.screenX : firstTouch.screenY;
79
64
  }
80
65
 
81
- return {
82
- movementX,
83
- movementY,
84
- screenX,
85
- screenY,
86
- };
87
- } else if (isTouchMoveEvent(event)) {
88
- const firstTouch = event.touches[0];
89
-
90
- return {
91
- movementX: getMovementBetween(firstTouch.screenX, prevScreenX),
92
- movementY: getMovementBetween(firstTouch.screenY, prevScreenY),
93
- screenX: firstTouch.screenX,
94
- screenY: firstTouch.screenY,
95
- };
96
- } else if (isMouseMoveEvent(event)) {
97
- return {
98
- movementX: getMovementBetween(event.screenX, prevScreenX),
99
- movementY: getMovementBetween(event.screenY, prevScreenY),
100
- screenX: event.screenX,
101
- screenY: event.screenY,
102
- };
103
- } else {
104
- throw Error(`Unsupported event type: "${(event as any).type}"`);
66
+ return pointerOffset - elementOffset;
105
67
  }
106
68
  }
107
69