UEA-PRODEM

node_modules/react-resizable-panels/README.md

@@ -1,4 +1,4 @@
-<img src="https://react-resizable-panels.vercel.app/og.svg" alt="react-resizable-panels logo" width="400" height="210" />
+<img src="https://react-resizable-panels.vercel.app/og.png" alt="react-resizable-panels logo" width="400" height="210" />
 
 `react-resizable-panels`: React components for resizable panel groups/layouts.
 
@@ -89,7 +89,8 @@ Falls back to <code>useId</code> when not provided.</p>
       <td>defaultLayout</td>
       <td><p>Default layout for the Group.</p>
 <p>ℹ️ This value allows layouts to be remembered between page reloads.</p>
-<p>⚠️ Refer to the documentation for how to avoid layout shift when using server components.</p>
+<p>⚠️ Slight layout shift may occur when server-rendering panels with percentage-based default sizes.
+Refer to the documentation for suggestions on how to minimize the impact of this.</p>
 </td>
     </tr>
     <tr>
@@ -120,7 +121,29 @@ Use this prop to disable that behavior for Panels and Separators in this group.<
     </tr>
     <tr>
       <td>onLayoutChange</td>
-      <td><p>Called when panel sizes change; receives a map of Panel id to size.</p>
+      <td><p>Called when the Group&#39;s layout is changing.</p>
+<p>⚠️ For layout changes caused by pointer events, this method is called each time the pointer is moved.
+For most cases, it is recommended to use the <code>onLayoutChanged</code> callback instead.</p>
+</td>
+    </tr>
+    <tr>
+      <td>onLayoutChanged</td>
+      <td><p>Called after the Group&#39;s layout has  been changed.</p>
+<p>ℹ️ For layout changes caused by pointer events, this method is not called until the pointer has been released.
+This method is recommended when saving layouts to some storage api.</p>
+</td>
+    </tr>
+    <tr>
+      <td>resizeTargetMinimumSize</td>
+      <td><p>Minimum size of the resizable hit target area (either <code>Separator</code> or <code>Panel</code> edge)
+This threshold ensures are large enough to avoid mis-clicks.</p>
+<ul>
+<li>Coarse inputs (typically a finger on a touchscreen) have reduced accuracy;
+to ensure accessibility and ease of use, hit targets should be larger to prevent mis-clicks.</li>
+<li>Fine inputs (typically a mouse) can be smaller</li>
+</ul>
+<p>ℹ️ <a href="https://developer.apple.com/design/human-interface-guidelines/accessibility">Apple interface guidelines</a> suggest <code>20pt</code> (<code>27px</code>) on desktops and <code>28pt</code> (<code>37px</code>) for touch devices
+In practice this seems to be much larger than many of their own applications use though.</p>
 </td>
     </tr>
     <tr>
@@ -157,6 +180,8 @@ Panel elements always include the following attributes:
 ```
 
 ℹ️ [Test id](https://testing-library.com/docs/queries/bytestid/) can be used to narrow selection when unit testing.
+
+⚠️ Panel elements must be direct DOM children of their parent Group elements.
 <!-- Panel:description:end -->
 
 #### Required props
@@ -211,11 +236,30 @@ Falls back to <code>useId</code> when not provided.</p>
     <tr>
       <td>defaultSize</td>
       <td><p>Default size of Panel within its parent group; default is auto-assigned based on the total number of Panels.</p>
+<p>⚠️ Percentage based sizes may cause slight layout shift when server-rendering.
+For more information see the documentation.</p>
+</td>
+    </tr>
+    <tr>
+      <td>disabled</td>
+      <td><p>When disabled, a panel cannot be resized either directly or indirectly (by resizing another panel).</p>
 </td>
     </tr>
     <tr>
       <td>elementRef</td>
       <td><p>Ref attached to the root <code>HTMLDivElement</code>.</p>
+</td>
+    </tr>
+    <tr>
+      <td>groupResizeBehavior</td>
+      <td><p>How should this Panel behave if the parent Group is resized?
+Defaults to <code>preserve-relative-size</code>.</p>
+<ul>
+<li><code>preserve-relative-size</code>: Retain the current relative size (as a percentage of the Group)</li>
+<li><code>preserve-pixel-size</code>: Retain its current size (in pixels)</li>
+</ul>
+<p>ℹ️ Panel min/max size constraints may impact this behavior.</p>
+<p>⚠️ A Group must contain at least one Panel with <code>preserve-relative-size</code> resize behavior.</p>
 </td>
     </tr>
     <tr>
@@ -259,7 +303,7 @@ Falls back to <code>useId</code> when not provided.</p>
 <!-- Separator:description:begin -->
 Separators are not _required_ but they are _recommended_ as they improve keyboard accessibility.
 
-Separators should be rendered as the direct child of a Group component.
+⚠️ Separator elements must be direct DOM children of their parent Group elements.
 
 Separator elements always include the following attributes:
 
@@ -309,6 +353,18 @@ Falls back to <code>useId</code> when not provided.</p>
       <td><p>CSS properties.</p>
 <p>ℹ️ Use the <code>data-separator</code> attribute for custom <em>hover</em> and <em>active</em> styles</p>
 <p>⚠️ The following properties cannot be overridden: <code>flex-grow</code>, <code>flex-shrink</code></p>
+</td>
+    </tr>
+    <tr>
+      <td>disabled</td>
+      <td><p>When disabled, the separator cannot be used to resize its neighboring panels.</p>
+<p>ℹ️ The panels may still be resized indirectly (while other panels are being resized).
+To prevent a panel from being resized at all, it needs to also be disabled.</p>
+</td>
+    </tr>
+    <tr>
+      <td>disableDoubleClick</td>
+      <td><p>When true, double-clicking this <code>Separator</code> will not reset its <code>Panel</code> to its default size.</p>
 </td>
     </tr>
     <tr>