fix(sidebar): disable frame CSS transition while user is resizing the sidebar to prevent janky animations

ts_web/elements/wcc-sidebar.ts

@@ -768,6 +768,11 @@ export class WccSidebar extends DeesElement {
     const frame = this.dashboardRef?.shadowRoot?.querySelector('wcc-frame') as any;
     const properties = this.dashboardRef?.shadowRoot?.querySelector('wcc-properties') as any;
 
+    // Disable frame transition during resize
+    if (frame) {
+      frame.isResizing = true;
+    }
+
     const onMouseMove = (e: MouseEvent) => {
       const newWidth = Math.min(400, Math.max(150, startWidth + (e.clientX - startX)));
       this.sidebarWidth = newWidth;
@@ -784,6 +789,10 @@ export class WccSidebar extends DeesElement {
       this.isResizing = false;
       document.removeEventListener('mousemove', onMouseMove);
       document.removeEventListener('mouseup', onMouseUp);
+      // Re-enable frame transition
+      if (frame) {
+        frame.isResizing = false;
+      }
       // Dispatch event on release for URL persistence
       this.dispatchEvent(new CustomEvent('widthChanged', { detail: this.sidebarWidth }));
     };