autofit fixed and simplified, thx Mike ! (Mike code readapted for edge cases)

graflow_examples/test4.html

@@ -45,19 +45,25 @@
                 font-size: 1em;
             }            
             bz-graflow{
-                overflow: scroll;
                 border: 2px solid black;
             }
-            bz-graflow.icmp{ grid-column: 1 / -1; width: 100vw; height: 80vh; background: var(--eicui-base-color-grey-10); }
+            /* Fill the demo frame — autofit sizes to the graflow box, not the parent */
+            bz-graflow.icmp{
+                width: 100%;
+                height: 100%;
+                background: var(--eicui-base-color-grey-10);
+            }
             .container {
                 resize: both;
-                overflow: auto;   /* required in practice */
-                min-width: 800px;
-                min-height: 300px;
-                border: 1px solid #999;
+                overflow: hidden;
+                width: 90vw;
+                height: 80vh;
+                min-width: 400px;
+                min-height: 240px;
                 padding: 0;
                 position: relative;
-                border:2px solid #A00
+                border: 2px solid #A00;
+                box-sizing: border-box;
             }
             .container::after {
                 content: "";
@@ -102,11 +108,10 @@
                 )
                 
                 const el = document.querySelector('.container')
-                let timer = null // debounce
                 const ro = new ResizeObserver(([entry]) => {
                     const grfl = entry.target.querySelector('bz-graflow')
                     grfl.autofit()
-                })                
+                })
                 ro.observe(el)
 
                 let aifmi = null; let sidx=0;