@base44-preview/vite-plugin 1.0.20-pr.82.48b1960 → 1.0.20-pr.83.ee1eb29

package/package.json

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

package/src/injections/page-height-bridge.ts

@@ -2,28 +2,21 @@
 // Inert until the parent posts a message; no observers, rewrites, or timers
 // fire on their own.
 //
-//   parent → child  { type: "freeze-vh-units", referenceVhBase?: number, reqId?: string }
+//   parent → child  { type: "freeze-vh-units", referenceVhBase?: number }
 //     Rewrites every viewport-height unit (`vh`/`dvh`/`svh`/`lvh`) in
 //     <style> + CSSOM to a CSS variable-backed expression (kills the
 //     vh ↔ auto-resize feedback loop). Repeated calls update the variable,
 //     so callers can rebase without recovering raw CSS. Idempotent; covers
-//     HMR-added styles too. When `reqId` is provided, replies with
-//     `{ type: "freeze-vh-units:ack", reqId }` immediately after accepting
-//     the request (semantics: "received", not "fully applied" — the rewrite
-//     is debounced and idempotent, so receipt is sufficient).
+//     HMR-added styles too. Fire-and-forget.
 //
-//   parent → child  { type: "measure-page-height", settleMs?: number, reqId?: string }
+//   parent → child  { type: "measure-page-height", settleMs?: number }
 //     After `settleMs` (default 2000) posts the page's measured content height
-//     as `{ type: "page-height-measured", height }` to the requester. When
-//     `reqId` is provided, also sends `{ type: "measure-page-height:ack", reqId }`
-//     immediately on receipt so the requester can distinguish "request lost"
-//     from "still waiting for measurement to settle".
+//     as `{ type: "page-height-measured", height }` to the requester.
 
 type IncomingMessage = {
   type?: string;
   settleMs?: number;
   referenceVhBase?: number;
-  reqId?: string;
 };
 
 type IndexableCssRule = CSSRule & {
@@ -79,31 +72,19 @@ export function setupPageHeightBridge(): () => void {
   const onMessage = (event: MessageEvent): void => {
     const data: IncomingMessage | null = (event.data ?? null) as IncomingMessage | null;
     if (!data || typeof data !== "object") return;
-    const ackOrigin: string =
-      event.origin && event.origin !== "null" ? event.origin : "*";
     switch (data.type) {
       case "freeze-vh-units": {
         const override: number | undefined =
           typeof data.referenceVhBase === "number" ? data.referenceVhBase : undefined;
         controller.freezeVhUnits(override);
-        if (typeof data.reqId === "string") {
-          window.parent.postMessage(
-            { type: "freeze-vh-units:ack", reqId: data.reqId },
-            ackOrigin,
-          );
-        }
         return;
       }
       case "measure-page-height": {
         const settleMs: number =
           typeof data.settleMs === "number" ? data.settleMs : DEFAULT_SETTLE_MS;
-        controller.measurePageHeight(ackOrigin, settleMs);
-        if (typeof data.reqId === "string") {
-          window.parent.postMessage(
-            { type: "measure-page-height:ack", reqId: data.reqId },
-            ackOrigin,
-          );
-        }
+        const origin: string =
+          event.origin && event.origin !== "null" ? event.origin : "*";
+        controller.measurePageHeight(origin, settleMs);
         return;
       }
     }

package/src/injections/utils.ts

@@ -82,12 +82,21 @@ 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): void {
+export function updateElementAttribute(
+  elements: Element[],
+  attribute: string,
+  value: string,
+  arrIndex?: number | string
+): void {
   if (!ALLOWED_ATTRIBUTES.includes(attribute)) {
     return;
   }
 
-  elements.forEach((element) => {
+  const targetElements = arrIndex != null
+    ? elements.filter((element) => (element as HTMLElement).dataset.arrIndex === String(arrIndex))
+    : elements;
+
+  targetElements.forEach((element) => {
     element.setAttribute(attribute, value);
   });
 }

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

@@ -368,12 +368,13 @@ export function setupVisualEditAgent() {
   const updateElementAttributeAndReposition = (
     visualSelectorId: string,
     attribute: string,
-    value: string
+    value: string,
+    arrIndex?: number | string
   ) => {
     const elements = findElementsById(visualSelectorId);
     if (elements.length === 0) return;
 
-    updateElementAttribute(elements, attribute, value);
+    updateElementAttribute(elements, attribute, value, arrIndex);
 
     // Reposition overlays after attribute change (e.g. image src swap can affect layout)
     setTimeout(() => {
@@ -529,7 +530,8 @@ export function setupVisualEditAgent() {
           updateElementAttributeAndReposition(
             message.data.visualSelectorId,
             message.data.attribute,
-            message.data.value
+            message.data.value,
+            message.data.arrIndex
           );
         } else {
           console.warn(
@@ -652,7 +654,6 @@ export function setupVisualEditAgent() {
             ? message.referenceVhBase
             : undefined
         );
-        postAckIfRequested(event, message, "freeze-vh-units:ack");
         break;
 
       case "measure-page-height":
@@ -660,12 +661,10 @@ export function setupVisualEditAgent() {
           event.origin && event.origin !== "null" ? event.origin : "*",
           typeof message.settleMs === "number" ? message.settleMs : undefined
         );
-        postAckIfRequested(event, message, "measure-page-height:ack");
         break;
 
       case "suppress-auto-popups":
         autoPopupSuppressor.suppress();
-        postAckIfRequested(event, message, "suppress-auto-popups:ack");
         break;
 
       case "toggle-canvas-wheel-zoom-bridge":
@@ -758,18 +757,3 @@ export function setupVisualEditAgent() {
   // Send ready message to parent
   window.parent.postMessage({ type: "visual-edit-agent-ready" }, "*");
 }
-
-// Post `{type: ackType, reqId}` back to the parent whenever the incoming
-// message included a `reqId`. Lets the canvas (parent) detect dropped or
-// late-arriving messages and retry — see postMessageWithAck.ts on the
-// apper side. No-op when `reqId` is missing (backward-compatible).
-export function postAckIfRequested(
-  event: MessageEvent,
-  message: { reqId?: unknown },
-  ackType: string,
-): void {
-  if (typeof message.reqId !== "string") return;
-  const ackOrigin =
-    event.origin && event.origin !== "null" ? event.origin : "*";
-  window.parent.postMessage({ type: ackType, reqId: message.reqId }, ackOrigin);
-}

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

@@ -69,6 +69,9 @@ 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;
 
@@ -80,6 +83,36 @@ 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
@@ -92,6 +125,17 @@ 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
@@ -122,6 +166,35 @@ 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;