Upload index.html with huggingface_hub

index.html

@@ -1404,16 +1404,24 @@
         const startW = this.el.panel.offsetWidth;
         this.el.widthHandle.classList.add('active');
 
+        const chart = this.el.chart;
+        // Freeze chart height so Plotly's responsive ResizeObserver
+        // cannot collapse it while the panel width is being dragged.
+        const lockedH = chart.offsetHeight;
+        chart.style.minHeight = lockedH + 'px';
+
         const onMove = (ev) => {
           const newW = Math.max(300, startW + ev.clientX - startX);
           this.el.panel.style.width = newW + 'px';
-          window.dispatchEvent(new Event('resize'));
         };
 
         const onUp = () => {
           this.el.widthHandle.classList.remove('active');
           document.removeEventListener('mousemove', onMove);
           document.removeEventListener('mouseup', onUp);
+          chart.style.minHeight = '';
+          Plotly.purge(chart);
+          this.renderChart();
         };
 
         document.addEventListener('mousemove', onMove);
@@ -1828,13 +1836,8 @@
         elInitLoading.style.display = 'none';
         elAddPanelRow.style.display = '';
 
-        // Create 2x2 default panels
-        await Promise.all([
-          addPanel({ suite: 'eng_base_full', metric: 'bits_per_byte' }),
-          addPanel({ suite: 'deu_base_full', metric: 'bits_per_byte' }),
-          addPanel({ suite: 'eng_base_full', metric: 'acc_norm' }),
-          addPanel({ suite: 'deu_base_full', metric: 'acc_norm' }),
-        ]);
+        // Create default panel
+        await addPanel({ suite: 'eng_base_main', metric: 'acc_norm' });
       } catch (err) {
         elInitLoading.innerHTML = `<span style="color:#e63946">
           Error: ${err.message}<br>