@base44-preview/vite-plugin 0.2.22-pr.37.fd9cb1a → 0.2.22-pr.39.4150ff4

package/dist/visual-edit-plugin.js

@@ -2,6 +2,8 @@ import { parse } from "@babel/parser";
 import { default as traverse } from "@babel/traverse";
 import { default as generate } from "@babel/generator";
 import * as t from "@babel/types";
+import { StaticArrayProcessor } from "./processors/static-array-processor.js";
+import { JSXUtils } from "./jsx-utils.js";
 // Helper function to check if JSX element contains dynamic content
 export function checkIfElementHasDynamicContent(jsxElement) {
     let hasDynamicContent = false;
@@ -190,6 +192,8 @@ export function visualEditPlugin() {
                     ],
                 });
                 // Traverse the AST and add source location and dynamic content attributes to JSX elements
+                JSXUtils.init(t);
+                const staticArrayProcessor = new StaticArrayProcessor(t);
                 let elementsProcessed = 0;
                 traverse.default(ast, {
                     JSXElement(path) {
@@ -217,6 +221,7 @@ export function visualEditPlugin() {
                         const dynamicContentAttr = t.jsxAttribute(t.jsxIdentifier("data-dynamic-content"), t.stringLiteral(isDynamic ? "true" : "false"));
                         // Add both attributes to the beginning of the attributes array
                         openingElement.attributes.unshift(sourceLocationAttr, dynamicContentAttr);
+                        staticArrayProcessor.process(path.get("openingElement"));
                         elementsProcessed++;
                     },
                 });

package/dist/visual-edit-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"visual-edit-plugin.js","sourceRoot":"","sources":["../src/visual-edit-plugin.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"visual-edit-plugin.js","sourceRoot":"","sources":["../src/visual-edit-plugin.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@base44-preview/vite-plugin",
-  "version": "0.2.22-pr.37.fd9cb1a",
+  "version": "0.2.22-pr.39.4150ff4",
   "description": "The Vite plugin for base44 based applications",
   "type": "module",
   "license": "MIT",
@@ -23,6 +23,7 @@
     "test:unit": "vitest run"
   },
   "devDependencies": {
+    "@babel/core": "^7.29.0",
     "@types/babel__generator": "^7.27.0",
     "@types/babel__traverse": "^7.28.0",
     "@types/node": "^24.6.2",

package/src/injections/visual-edit-agent.ts

@@ -1 +1,561 @@
-export { setupVisualEditAgent } from "./visual-edit-agent/index.js";
+import { findElementsById, updateElementClasses } from "./utils.js";
+
+export function setupVisualEditAgent() {
+  // State variables (replacing React useState/useRef)
+  let isVisualEditMode = false;
+  let isPopoverDragging = false;
+  let isDropdownOpen = false;
+  let hoverOverlays: HTMLDivElement[] = [];
+  let selectedOverlays: HTMLDivElement[] = [];
+  let currentHighlightedElements: Element[] = [];
+  let selectedElementId: string | null = null;
+
+  // Create overlay element
+  const createOverlay = (isSelected = false): HTMLDivElement => {
+    const overlay = document.createElement("div");
+    overlay.style.position = "absolute";
+    overlay.style.pointerEvents = "none";
+    overlay.style.transition = "all 0.1s ease-in-out";
+    overlay.style.zIndex = "9999";
+
+    if (isSelected) {
+      overlay.style.border = "2px solid #2563EB";
+    } else {
+      overlay.style.border = "2px solid #95a5fc";
+      overlay.style.backgroundColor = "rgba(99, 102, 241, 0.05)";
+    }
+
+    return overlay;
+  };
+
+  // Position overlay relative to element
+  const positionOverlay = (
+    overlay: HTMLDivElement,
+    element: Element,
+    isSelected = false
+  ) => {
+    if (!element || !isVisualEditMode) return;
+
+    const htmlElement = element as HTMLElement;
+    // Force layout recalculation
+    void htmlElement.offsetWidth;
+
+    const rect = element.getBoundingClientRect();
+    overlay.style.top = `${rect.top + window.scrollY}px`;
+    overlay.style.left = `${rect.left + window.scrollX}px`;
+    overlay.style.width = `${rect.width}px`;
+    overlay.style.height = `${rect.height}px`;
+
+    // Check if label already exists in overlay
+    let label = overlay.querySelector("div") as HTMLDivElement | null;
+
+    if (!label) {
+      label = document.createElement("div");
+      label.textContent = element.tagName.toLowerCase();
+      label.style.position = "absolute";
+      label.style.top = "-27px";
+      label.style.left = "-2px";
+      label.style.padding = "2px 8px";
+      label.style.fontSize = "11px";
+      label.style.fontWeight = isSelected ? "500" : "400";
+      label.style.color = isSelected ? "#ffffff" : "#526cff";
+      label.style.backgroundColor = isSelected ? "#526cff" : "#DBEAFE";
+      label.style.borderRadius = "3px";
+      label.style.minWidth = "24px";
+      label.style.textAlign = "center";
+      overlay.appendChild(label);
+    }
+  };
+
+  // Clear hover overlays
+  const clearHoverOverlays = () => {
+    hoverOverlays.forEach((overlay) => {
+      if (overlay && overlay.parentNode) {
+        overlay.remove();
+      }
+    });
+    hoverOverlays = [];
+    currentHighlightedElements = [];
+  };
+
+  // Handle mouse over event
+  const handleMouseOver = (e: MouseEvent) => {
+    if (!isVisualEditMode || isPopoverDragging) return;
+
+    const target = e.target as Element;
+
+    // Prevent hover effects when a dropdown is open
+    if (isDropdownOpen) {
+      clearHoverOverlays();
+      return;
+    }
+
+    // Prevent hover effects on SVG path elements
+    if (target.tagName.toLowerCase() === "path") {
+      clearHoverOverlays();
+      return;
+    }
+
+    // Support both data-source-location and data-visual-selector-id
+    const element = target.closest(
+      "[data-source-location], [data-visual-selector-id]"
+    );
+    if (!element) {
+      clearHoverOverlays();
+      return;
+    }
+
+    // Prefer data-source-location, fallback to data-visual-selector-id
+    const htmlElement = element as HTMLElement;
+    const selectorId =
+      htmlElement.dataset.sourceLocation ||
+      htmlElement.dataset.visualSelectorId;
+
+    // Skip if this element is already selected
+    if (selectedElementId === selectorId) {
+      clearHoverOverlays();
+      return;
+    }
+
+    // Find all elements with the same ID
+    const elements = findElementsById(selectorId || null);
+
+    // Clear previous hover overlays
+    clearHoverOverlays();
+
+    // Create overlays for all matching elements
+    elements.forEach((el) => {
+      const overlay = createOverlay(false);
+      document.body.appendChild(overlay);
+      hoverOverlays.push(overlay);
+      positionOverlay(overlay, el);
+    });
+
+    currentHighlightedElements = elements;
+  };
+
+  // Handle mouse out event
+  const handleMouseOut = () => {
+    if (isPopoverDragging) return;
+    clearHoverOverlays();
+  };
+
+  // Handle element click
+  const handleElementClick = (e: MouseEvent) => {
+    if (!isVisualEditMode) return;
+
+    const target = e.target as Element;
+
+    // Close dropdowns when clicking anywhere in iframe if a dropdown is open
+    if (isDropdownOpen) {
+      e.preventDefault();
+      e.stopPropagation();
+      e.stopImmediatePropagation();
+
+      window.parent.postMessage({ type: "close-dropdowns" }, "*");
+      return;
+    }
+
+    // Prevent clicking on SVG path elements
+    if (target.tagName.toLowerCase() === "path") {
+      return;
+    }
+
+    // Prevent default behavior immediately when in visual edit mode
+    e.preventDefault();
+    e.stopPropagation();
+    e.stopImmediatePropagation();
+
+    // Support both data-source-location and data-visual-selector-id
+    const element = target.closest(
+      "[data-source-location], [data-visual-selector-id]"
+    );
+    if (!element) {
+      return;
+    }
+
+    const htmlElement = element as HTMLElement;
+    const visualSelectorId =
+      htmlElement.dataset.sourceLocation ||
+      htmlElement.dataset.visualSelectorId;
+
+    // Clear any existing selected overlays
+    selectedOverlays.forEach((overlay) => {
+      if (overlay && overlay.parentNode) {
+        overlay.remove();
+      }
+    });
+    selectedOverlays = [];
+
+    // Find all elements with the same ID
+    const elements = findElementsById(visualSelectorId || null);
+
+    // Create selected overlays for all matching elements
+    elements.forEach((el) => {
+      const overlay = createOverlay(true);
+      document.body.appendChild(overlay);
+      selectedOverlays.push(overlay);
+      positionOverlay(overlay, el, true);
+    });
+
+    selectedElementId = visualSelectorId || null;
+
+    // Clear hover overlays
+    clearHoverOverlays();
+
+    // Calculate element position for popover positioning
+    const rect = element.getBoundingClientRect();
+    const elementPosition = {
+      top: rect.top,
+      left: rect.left,
+      right: rect.right,
+      bottom: rect.bottom,
+      width: rect.width,
+      height: rect.height,
+      centerX: rect.left + rect.width / 2,
+      centerY: rect.top + rect.height / 2,
+    };
+
+    // Send message to parent window with element info including position
+    const svgElement = element as SVGElement;
+    const elementData = {
+      type: "element-selected",
+      tagName: element.tagName,
+      classes:
+        (svgElement.className as unknown as SVGAnimatedString)?.baseVal ||
+        element.className ||
+        "",
+      visualSelectorId: visualSelectorId,
+      content: (element as HTMLElement).innerText,
+      dataSourceLocation: htmlElement.dataset.sourceLocation,
+      isDynamicContent: htmlElement.dataset.dynamicContent === "true",
+      linenumber: htmlElement.dataset.linenumber,
+      filename: htmlElement.dataset.filename,
+      position: elementPosition,
+    };
+    window.parent.postMessage(elementData, "*");
+  };
+
+  // Unselect the current element
+  const unselectElement = () => {
+    selectedOverlays.forEach((overlay) => {
+      if (overlay && overlay.parentNode) {
+        overlay.remove();
+      }
+    });
+    selectedOverlays = [];
+    selectedElementId = null;
+  };
+
+  const updateElementClassesAndReposition = (visualSelectorId: string, classes: string) => {
+    const elements = findElementsById(visualSelectorId);
+    if (elements.length === 0) return;
+
+    updateElementClasses(elements, classes);
+
+    // Use a small delay to allow the browser to recalculate layout before repositioning
+    setTimeout(() => {
+      // Reposition selected overlays
+      if (selectedElementId === visualSelectorId) {
+        selectedOverlays.forEach((overlay, index) => {
+          if (index < elements.length) {
+            positionOverlay(overlay, elements[index]!);
+          }
+        });
+      }
+
+      // Reposition hover overlays if needed
+      if (currentHighlightedElements.length > 0) {
+        const hoveredElement = currentHighlightedElements[0] as HTMLElement;
+        const hoveredId = hoveredElement?.dataset?.visualSelectorId;
+        if (hoveredId === visualSelectorId) {
+          hoverOverlays.forEach((overlay, index) => {
+            if (index < currentHighlightedElements.length) {
+              positionOverlay(overlay, currentHighlightedElements[index]!);
+            }
+          });
+        }
+      }
+    }, 50);
+  };
+
+  // Update element content by visual selector ID
+  const updateElementContent = (visualSelectorId: string, content: string) => {
+    const elements = findElementsById(visualSelectorId);
+
+    if (elements.length === 0) {
+      return;
+    }
+
+    elements.forEach((element) => {
+      (element as HTMLElement).innerText = content;
+    });
+
+    setTimeout(() => {
+      if (selectedElementId === visualSelectorId) {
+        selectedOverlays.forEach((overlay, index) => {
+          if (index < elements.length) {
+            positionOverlay(overlay, elements[index]!);
+          }
+        });
+      }
+    }, 50);
+  };
+
+  // Toggle visual edit mode
+  const toggleVisualEditMode = (isEnabled: boolean) => {
+    isVisualEditMode = isEnabled;
+
+    if (!isEnabled) {
+      clearHoverOverlays();
+
+      selectedOverlays.forEach((overlay) => {
+        if (overlay && overlay.parentNode) {
+          overlay.remove();
+        }
+      });
+      selectedOverlays = [];
+
+      currentHighlightedElements = [];
+      selectedElementId = null;
+      document.body.style.cursor = "default";
+
+      document.removeEventListener("mouseover", handleMouseOver);
+      document.removeEventListener("mouseout", handleMouseOut);
+      document.removeEventListener("click", handleElementClick, true);
+    } else {
+      document.body.style.cursor = "crosshair";
+      document.addEventListener("mouseover", handleMouseOver);
+      document.addEventListener("mouseout", handleMouseOut);
+      document.addEventListener("click", handleElementClick, true);
+    }
+  };
+
+  // Handle scroll events to update popover position
+  const handleScroll = () => {
+    if (selectedElementId) {
+      const elements = findElementsById(selectedElementId);
+      if (elements.length > 0) {
+        const element = elements[0];
+        const rect = element!.getBoundingClientRect();
+
+        const viewportHeight = window.innerHeight;
+        const viewportWidth = window.innerWidth;
+        const isInViewport =
+          rect.top < viewportHeight &&
+          rect.bottom > 0 &&
+          rect.left < viewportWidth &&
+          rect.right > 0;
+
+        const elementPosition = {
+          top: rect.top,
+          left: rect.left,
+          right: rect.right,
+          bottom: rect.bottom,
+          width: rect.width,
+          height: rect.height,
+          centerX: rect.left + rect.width / 2,
+          centerY: rect.top + rect.height / 2,
+        };
+
+        window.parent.postMessage(
+          {
+            type: "element-position-update",
+            position: elementPosition,
+            isInViewport: isInViewport,
+            visualSelectorId: selectedElementId,
+          },
+          "*"
+        );
+      }
+    }
+  };
+
+  // Handle messages from parent window
+  const handleMessage = (event: MessageEvent) => {
+    const message = event.data;
+
+    switch (message.type) {
+      case "toggle-visual-edit-mode":
+        toggleVisualEditMode(message.data.enabled);
+        break;
+
+      case "update-classes":
+        if (message.data && message.data.classes !== undefined) {
+          updateElementClassesAndReposition(
+            message.data.visualSelectorId,
+            message.data.classes
+          );
+        } else {
+          console.warn(
+            "[VisualEditAgent] Invalid update-classes message:",
+            message
+          );
+        }
+        break;
+
+      case "unselect-element":
+        unselectElement();
+        break;
+
+      case "refresh-page":
+        window.location.reload();
+        break;
+
+      case "update-content":
+        if (message.data && message.data.content !== undefined) {
+          updateElementContent(
+            message.data.visualSelectorId,
+            message.data.content
+          );
+        } else {
+          console.warn(
+            "[VisualEditAgent] Invalid update-content message:",
+            message
+          );
+        }
+        break;
+
+      case "request-element-position":
+        if (selectedElementId) {
+          const elements = findElementsById(selectedElementId);
+          if (elements.length > 0) {
+            const element = elements[0];
+            const rect = element!.getBoundingClientRect();
+
+            const viewportHeight = window.innerHeight;
+            const viewportWidth = window.innerWidth;
+            const isInViewport =
+              rect.top < viewportHeight &&
+              rect.bottom > 0 &&
+              rect.left < viewportWidth &&
+              rect.right > 0;
+
+            const elementPosition = {
+              top: rect.top,
+              left: rect.left,
+              right: rect.right,
+              bottom: rect.bottom,
+              width: rect.width,
+              height: rect.height,
+              centerX: rect.left + rect.width / 2,
+              centerY: rect.top + rect.height / 2,
+            };
+
+            window.parent.postMessage(
+              {
+                type: "element-position-update",
+                position: elementPosition,
+                isInViewport: isInViewport,
+                visualSelectorId: selectedElementId,
+              },
+              "*"
+            );
+          }
+        }
+        break;
+
+      case "popover-drag-state":
+        if (message.data && message.data.isDragging !== undefined) {
+          isPopoverDragging = message.data.isDragging;
+          if (message.data.isDragging) {
+            clearHoverOverlays();
+          }
+        }
+        break;
+
+      case "dropdown-state":
+        if (message.data && message.data.isOpen !== undefined) {
+          isDropdownOpen = message.data.isOpen;
+          if (message.data.isOpen) {
+            clearHoverOverlays();
+          }
+        }
+        break;
+
+      default:
+        break;
+    }
+  };
+
+  // Handle window resize to reposition overlays
+  const handleResize = () => {
+    if (selectedElementId) {
+      const elements = findElementsById(selectedElementId);
+      selectedOverlays.forEach((overlay, index) => {
+        if (index < elements.length) {
+          positionOverlay(overlay, elements[index]!);
+        }
+      });
+    }
+
+    if (currentHighlightedElements.length > 0) {
+      hoverOverlays.forEach((overlay, index) => {
+        if (index < currentHighlightedElements.length) {
+          positionOverlay(overlay, currentHighlightedElements[index]!);
+        }
+      });
+    }
+  };
+
+  // Initialize: Add IDs to elements that don't have them but have linenumbers
+  const elementsWithLineNumber = document.querySelectorAll(
+    "[data-linenumber]:not([data-visual-selector-id])"
+  );
+  elementsWithLineNumber.forEach((el, index) => {
+    const htmlEl = el as HTMLElement;
+    const id = `visual-id-${htmlEl.dataset.filename}-${htmlEl.dataset.linenumber}-${index}`;
+    htmlEl.dataset.visualSelectorId = id;
+  });
+
+  // Create mutation observer to detect layout changes
+  const mutationObserver = new MutationObserver((mutations) => {
+    const needsUpdate = mutations.some((mutation) => {
+      const hasVisualId = (node: Node): boolean => {
+        if (node.nodeType === Node.ELEMENT_NODE) {
+          const el = node as HTMLElement;
+          if (el.dataset && el.dataset.visualSelectorId) {
+            return true;
+          }
+          for (let i = 0; i < el.children.length; i++) {
+            if (hasVisualId(el.children[i]!)) {
+              return true;
+            }
+          }
+        }
+        return false;
+      };
+
+      const isLayoutChange =
+        mutation.type === "attributes" &&
+        (mutation.attributeName === "style" ||
+          mutation.attributeName === "class" ||
+          mutation.attributeName === "width" ||
+          mutation.attributeName === "height");
+
+      return isLayoutChange && hasVisualId(mutation.target);
+    });
+
+    if (needsUpdate) {
+      setTimeout(handleResize, 50);
+    }
+  });
+
+  // Set up event listeners
+  window.addEventListener("message", handleMessage);
+  window.addEventListener("scroll", handleScroll, true);
+  document.addEventListener("scroll", handleScroll, true);
+  window.addEventListener("resize", handleResize);
+  window.addEventListener("scroll", handleResize);
+
+  // Start observing DOM mutations
+  mutationObserver.observe(document.body, {
+    attributes: true,
+    childList: true,
+    subtree: true,
+    attributeFilter: ["style", "class", "width", "height"],
+  });
+
+  // Send ready message to parent
+  window.parent.postMessage({ type: "visual-edit-agent-ready" }, "*");
+}