@base44-preview/vite-plugin 1.0.20-pr.83.ee1eb29 → 1.0.20-pr.84.a80f99c

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@base44-preview/vite-plugin",
-  "version": "1.0.20-pr.83.ee1eb29",
+  "version": "1.0.20-pr.84.a80f99c",
   "description": "The Vite plugin for base44 based applications",
   "type": "module",
   "license": "MIT",

package/src/injections/navigation-notifier.ts

@@ -32,6 +32,26 @@ if (window.self !== window.top) {
   // Handle browser back/forward navigation
   window.addEventListener("popstate", notifyNavigation);
 
+  // Parent-driven CLIENT-SIDE navigation (no full reload). The canvas keeps a
+  // single pre-booted iframe and switches which page it shows by posting
+  // `navigate-to-route` instead of swapping `src`. We pushState (or replaceState)
+  // to the new path and dispatch a synthetic popstate so client routers
+  // (React Router et al.) re-render the matched route. `pushState`/`replaceState`
+  // are already patched above to fire `notifyNavigation`, so the parent still
+  // receives the resulting `app_changed_url` ack and can confirm the switch.
+  window.addEventListener("message", (event) => {
+    const data = event.data;
+    if (!data || data.type !== "navigate-to-route") return;
+    const path = data.path;
+    if (typeof path !== "string" || !path.startsWith("/")) return;
+    if (data.replace) {
+      history.replaceState(history.state, "", path);
+    } else {
+      history.pushState(history.state, "", path);
+    }
+    window.dispatchEvent(new PopStateEvent("popstate"));
+  });
+
   // Notify initial URL on load
   window.parent?.postMessage(
     {

package/src/injections/utils.ts

@@ -82,21 +82,12 @@ export function updateElementClasses(elements: Element[], classes: string): void
 }
 
 /** Set a single attribute on all provided elements. */
-export function updateElementAttribute(
-  elements: Element[],
-  attribute: string,
-  value: string,
-  arrIndex?: number | string
-): void {
+export function updateElementAttribute(elements: Element[], attribute: string, value: string): void {
   if (!ALLOWED_ATTRIBUTES.includes(attribute)) {
     return;
   }
 
-  const targetElements = arrIndex != null
-    ? elements.filter((element) => (element as HTMLElement).dataset.arrIndex === String(arrIndex))
-    : elements;
-
-  targetElements.forEach((element) => {
+  elements.forEach((element) => {
     element.setAttribute(attribute, value);
   });
 }

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

@@ -368,13 +368,12 @@ export function setupVisualEditAgent() {
   const updateElementAttributeAndReposition = (
     visualSelectorId: string,
     attribute: string,
-    value: string,
-    arrIndex?: number | string
+    value: string
   ) => {
     const elements = findElementsById(visualSelectorId);
     if (elements.length === 0) return;
 
-    updateElementAttribute(elements, attribute, value, arrIndex);
+    updateElementAttribute(elements, attribute, value);
 
     // Reposition overlays after attribute change (e.g. image src swap can affect layout)
     setTimeout(() => {
@@ -530,8 +529,7 @@ export function setupVisualEditAgent() {
           updateElementAttributeAndReposition(
             message.data.visualSelectorId,
             message.data.attribute,
-            message.data.value,
-            message.data.arrIndex
+            message.data.value
           );
         } else {
           console.warn(

package/src/processors/static-array-processor.ts

@@ -69,9 +69,6 @@ export class StaticArrayProcessor {
     path: NodePath<t.JSXOpeningElement>,
     callbackParam: string
   ): string | null {
-    const imageSrcFieldPath = this.findImageSrcFieldPath(path, callbackParam);
-    if (imageSrcFieldPath) return imageSrcFieldPath;
-
     const parentElement = path.parentPath;
     if (!parentElement?.isJSXElement()) return null;
 
@@ -83,36 +80,6 @@ export class StaticArrayProcessor {
     return null;
   }
 
-  private findImageSrcFieldPath(
-    path: NodePath<t.JSXOpeningElement>,
-    callbackParam: string
-  ): string | null {
-    const elementName = this.getElementName(path);
-    if (elementName !== "img" && elementName !== "Image") return null;
-
-    for (const attr of path.node.attributes) {
-      if (
-        !this.types.isJSXAttribute(attr) ||
-        !this.types.isJSXIdentifier(attr.name) ||
-        attr.name.name !== "src" ||
-        !attr.value ||
-        !this.types.isJSXExpressionContainer(attr.value)
-      ) {
-        continue;
-      }
-
-      const expression = attr.value.expression;
-      if (
-        this.types.isMemberExpression(expression) ||
-        this.types.isOptionalMemberExpression(expression)
-      ) {
-        return this.extractFieldPathFromExpression(expression, callbackParam);
-      }
-    }
-
-    return null;
-  }
-
   private extractFieldPathFromChild(
     child: NodePath<t.JSXElement["children"][number]>,
     callbackParam: string
@@ -125,17 +92,6 @@ export class StaticArrayProcessor {
     return this.extractFieldPath(expression, callbackParam);
   }
 
-  private extractFieldPathFromExpression(
-    expr: t.MemberExpression | t.OptionalMemberExpression,
-    callbackParam: string
-  ): string | null {
-    const parts = this.collectMemberExpressionPartsFromNode(expr);
-    if (!parts) return null;
-
-    const { rootName, propertyNames } = parts;
-    return rootName === callbackParam ? propertyNames.join(".") : null;
-  }
-
   private extractFieldPath(
     expr: NodePath<t.MemberExpression>,
     callbackParam: string
@@ -166,35 +122,6 @@ export class StaticArrayProcessor {
     return { rootName: current.node.name, propertyNames };
   }
 
-  private collectMemberExpressionPartsFromNode(
-    expr: t.MemberExpression | t.OptionalMemberExpression
-  ): { rootName: string; propertyNames: string[] } | null {
-    const propertyNames: string[] = [];
-    let current: t.Expression = expr;
-
-    while (
-      this.types.isMemberExpression(current) ||
-      this.types.isOptionalMemberExpression(current)
-    ) {
-      const property = current.property;
-      if (!this.types.isIdentifier(property)) return null;
-
-      propertyNames.unshift(property.name);
-      current = current.object as t.Expression;
-    }
-
-    if (!this.types.isIdentifier(current)) return null;
-
-    return { rootName: current.name, propertyNames };
-  }
-
-  private getElementName(path: NodePath<t.JSXOpeningElement>): string | null {
-    const name = path.node.name;
-    if (this.types.isJSXIdentifier(name)) return name.name;
-    if (this.types.isJSXMemberExpression(name)) return name.property.name;
-    return null;
-  }
-
   private ensureIndexParam(arrayInfo: ArrayMapInfo): string {
     if (arrayInfo.indexParam) {
       return arrayInfo.indexParam;