@bravostudioai/react 0.1.47 → 0.1.48

package/dist/components/EncoreApp.js

@@ -1,52 +1,52 @@
 import { jsx as n } from "react/jsx-runtime";
-import T from "../node_modules/swr/dist/index/index.js";
-import _ from "../lib/fetcher.js";
-import i from "../stores/useEncoreState.js";
-import { useRef as H, useEffect as c, useState as Y, useCallback as nt, useMemo as ct, Suspense as at } from "react";
+import Y from "../node_modules/swr/dist/index/index.js";
+import q from "../lib/fetcher.js";
+import l from "../stores/useEncoreState.js";
+import { useRef as G, useEffect as c, useState as J, useCallback as ct, useMemo as at, Suspense as it } from "react";
 import { setLocalModeOverride as A, isLocalMode as B } from "../lib/localMode.js";
-import it from "./DynamicComponent.js";
-import { useEncoreRouter as lt } from "../contexts/EncoreRouterContext.js";
-import { usePusherUpdates as dt } from "../hooks/usePusherUpdates.js";
-import { useFontLoader as ut } from "../hooks/useFontLoader.js";
-import { useRepeatingContainers as ft } from "../hooks/useRepeatingContainers.js";
-import { EncoreContextProviders as mt } from "./EncoreContextProviders.js";
-import { patchPageData as ht } from "../lib/dataPatching.js";
-import { logger as f } from "../lib/logger.js";
-const pt = ({ to: e, children: o, style: D, ...b }) => {
-  const { navigate: l } = lt();
+import lt from "./DynamicComponent.js";
+import { useEncoreRouter as dt } from "../contexts/EncoreRouterContext.js";
+import { usePusherUpdates as ut } from "../hooks/usePusherUpdates.js";
+import { useFontLoader as ft } from "../hooks/useFontLoader.js";
+import { useRepeatingContainers as mt } from "../hooks/useRepeatingContainers.js";
+import { EncoreContextProviders as ht } from "./EncoreContextProviders.js";
+import { patchPageData as pt } from "../lib/dataPatching.js";
+import { logger as d } from "../lib/logger.js";
+const yt = ({ to: e, children: o, style: D, ...b }) => {
+  const { navigate: u } = dt();
   return /* @__PURE__ */ n(
     "a",
     {
       href: e,
       onClick: (m) => {
-        m.preventDefault(), l(e);
+        m.preventDefault(), u(e);
       },
       style: { cursor: "pointer", ...D },
       ...b,
       children: o
     }
   );
-}, yt = (e) => e.setApp, gt = (e) => e.setAppId, vt = (e) => e.setPageId, bt = (e) => e.assetsById, Ft = ({
+}, gt = (e) => e.setApp, vt = (e) => e.setAppId, bt = (e) => e.setPageId, wt = (e) => e.assetsById, jt = ({
   appId: e,
   pageId: o,
   componentId: D,
   fallback: b,
-  onSizeChange: l,
+  onSizeChange: u,
   onContentSizeChange: m,
-  onAction: q,
+  onAction: Q,
   data: w,
-  source: d,
-  repeatingContainerControls: G,
+  source: f,
+  repeatingContainerControls: X,
   inputGroups: L,
   baseURL: S,
   appDefinition: h,
   pageDefinition: R,
   componentCode: O,
   mode: P,
-  embeds: C
+  embeds: M
 }) => {
-  f.debug("EncoreApp render", { appId: e, pageId: o, mode: P }), S && i.getState().baseURL !== S && i.getState().setBaseURL(S), d && A(d === "local" ? "local" : "remote");
-  const J = !1, M = i(yt), E = i(gt), U = i(vt), p = i(bt), F = H(null), j = H(null);
+  d.debug("EncoreApp render", { appId: e, pageId: o, mode: P }), S && l.getState().baseURL !== S && l.getState().setBaseURL(S), f && A(f === "local" ? "local" : "remote");
+  const Z = !1, C = l(gt), E = l(vt), U = l(bt), p = l(wt), F = G(null), j = G(null);
   c(() => {
     if (!m) return;
     const t = j.current;
@@ -61,25 +61,25 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
     });
     return r(), s.observe(t), () => s.disconnect();
   }, [m]);
-  const [Q, X] = Y(0), Z = nt(() => {
-    X((t) => typeof t == "number" ? t + 1 : Date.now());
-  }, []);
-  dt({
+  const [W, z] = J(0), I = ct(() => {
+    z((t) => typeof t == "number" ? t + 1 : Date.now());
+  }, []), N = f === "local" || B(), y = P === "production", a = P === "optimistic", V = !y && !a;
+  ut({
     appId: e,
     pageId: o || void 0,
-    enabled: !B() && !h,
-    onUpdate: Z
+    enabled: a || !B() && !h,
+    onUpdate: I
   });
-  const W = d === "local" || B(), y = P === "production", u = P === "optimistic", N = !y && !u, V = !y && e ? `/devices/apps/${e}${W ? "?useLocal=1" : ""}` : null, z = T(V, _, {
-    suspense: N && !!V,
+  const K = !y && e ? `/devices/apps/${e}${N ? "?useLocal=1" : ""}` : null, tt = Y(K, q, {
+    suspense: V && !!K,
     // Suspense only for Dynamic mode
-    fallbackData: u && h ? h : void 0,
+    fallbackData: a && h ? h : void 0,
     revalidateOnMount: !0
     // Ensure we fetch fresh data in optimistic mode
-  }), g = y && h ? { data: h } : z;
+  }), g = y && h ? { data: h } : tt;
   c(() => {
-    M(g.data);
-  }, [g.data, M]), ut(g?.data), c(() => {
+    C(g.data);
+  }, [g.data, C]), ft(g?.data), c(() => {
     E(e);
   }, [e, E]), c(() => {
     o && U(o);
@@ -91,39 +91,41 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
       }) : Promise.resolve())
     ))();
   }, [p]);
-  const k = !y && e && o ? `/devices/apps/${e}/node/${o}${W ? "?useLocal=1" : ""}` : null;
-  f.debug("Page data fetch", { pageUrl: k, mode: P });
-  const I = T(k, _, {
-    suspense: N && !!k,
-    fallbackData: u && R ? R : void 0,
+  const k = !y && e && o ? `/devices/apps/${e}/node/${o}${N ? "?useLocal=1" : ""}` : null;
+  d.debug("Page data fetch", { pageUrl: k, mode: P });
+  const et = Y(k, q, {
+    suspense: V && !!k,
+    fallbackData: a && R ? R : void 0,
     revalidateOnMount: !0
-  }), $ = y && R ? { data: R } : I, [tt, K] = Y(
+  }), $ = y && R ? { data: R } : et, [ot, T] = J(
     O
   );
   c(() => {
-    u && e && o && !B() ? (async () => {
+    a && e && o && !B() ? (async () => {
       try {
-        const { CONST_COMPONENTS_CDN_URL: r } = await import("../packages/encore-lib/constants.js"), s = Math.round(Date.now() / 1e3), x = `${e}/draft/components/${o}`, v = `${r}/${x}.js?cacheBuster=${s}`, a = await fetch(v);
-        if (a.ok) {
-          const st = await a.text();
-          K(st), f.debug("Refreshed optimistic component code");
+        const { CONST_COMPONENTS_CDN_URL: r } = await import("../packages/encore-lib/constants.js"), s = Math.round(Date.now() / 1e3), x = `${e}/draft/components/${o}`, v = `${r}/${x}.js?cacheBuster=${s}`, i = await fetch(v);
+        if (i.ok) {
+          const _ = await i.text();
+          T((H) => _ === H ? (d.debug("Optimistic code is up to date"), H) : (d.debug(
+            "Refreshed optimistic component code (new version found)"
+          ), _));
         }
       } catch (r) {
-        f.warn("Failed to background refresh optimistic component", r);
+        d.warn("Failed to background refresh optimistic component", r);
       }
-    })() : K(O);
-  }, [O, u, e, o]);
-  const et = u ? tt : O;
-  f.debug("Page data loaded", {
+    })() : T(O);
+  }, [O, a, e, o, W]);
+  const rt = a ? ot : O;
+  d.debug("Page data loaded", {
     hasData: !!$?.data,
     dataType: typeof $?.data
   });
-  const ot = ct(() => {
+  const st = at(() => {
     let t = $.data?.clientData;
-    return f.debug("Building context", {
+    return d.debug("Building context", {
       hasClientData: !!t,
       clientDataKeys: Object.keys(t || {}).length
-    }), t && ht(t), {
+    }), t && pt(t), {
       nodeData: void 0,
       // Allow overriding specific values by element id.
       // For now, this is used to override TextComponent content when the node has the PROP:TEXT_VAR tag.
@@ -133,38 +135,38 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
       // Support for standalone component data binding (encore:data tags at root level)
       rootData: w,
       // Support for embedded components
-      embedsById: C
+      embedsById: M
     };
-  }, [$.data?.clientData, w, C]), rt = ft(
-    G
+  }, [$.data?.clientData, w, M]), nt = mt(
+    X
   );
   return c(() => {
     if (L) {
-      const t = i.getState().setInputGroupValue;
+      const t = l.getState().setInputGroupValue;
       Object.entries(L).forEach(([r, s]) => {
         t(r, s);
       });
     }
   }, [L]), c(() => {
-    if (!l) return;
+    if (!u) return;
     const t = F.current;
     if (!t) return;
     const r = (v) => {
-      const a = v.contentRect;
-      l({ width: a.width, height: a.height });
+      const i = v.contentRect;
+      u({ width: i.width, height: i.height });
     }, s = new ResizeObserver((v) => {
-      for (const a of v)
-        r(a);
+      for (const i of v)
+        r(i);
     }), x = t.getBoundingClientRect();
-    return l({ width: x.width, height: x.height }), s.observe(t), () => {
+    return u({ width: x.width, height: x.height }), s.observe(t), () => {
       s.disconnect();
     };
-  }, [l]), c(() => {
-    if (d)
-      return A(d === "local" ? "local" : "remote"), () => {
+  }, [u]), c(() => {
+    if (f)
+      return A(f === "local" ? "local" : "remote"), () => {
         A(null);
       };
-  }, [d]), o ? /* @__PURE__ */ n(
+  }, [f]), o ? /* @__PURE__ */ n(
     "div",
     {
       ref: F,
@@ -184,20 +186,20 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
             display: "flex",
             flexDirection: "column"
           },
-          children: /* @__PURE__ */ n(at, { fallback: b || /* @__PURE__ */ n("div", {}), children: /* @__PURE__ */ n(
-            mt,
+          children: /* @__PURE__ */ n(it, { fallback: b || /* @__PURE__ */ n("div", {}), children: /* @__PURE__ */ n(
+            ht,
             {
               componentId: D,
-              onAction: q,
-              repeatingContainerContextValue: rt,
-              bindingContextValue: ot,
+              onAction: Q,
+              repeatingContainerContextValue: nt,
+              bindingContextValue: st,
               children: /* @__PURE__ */ n(
-                it,
+                lt,
                 {
                   name: `${e}/draft/components/${o}`,
                   fallback: b,
-                  reloadKey: Q,
-                  componentCode: et
+                  reloadKey: W,
+                  componentCode: rt
                 }
               )
             }
@@ -211,9 +213,9 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
       (t) => t?.id
     )
   ) : g?.data?.app.pageIds || []).map((t) => /* @__PURE__ */ n(
-    pt,
+    yt,
     {
-      to: `/apps/${e}/pages/${t}?noRedirect=${J}`,
+      to: `/apps/${e}/pages/${t}?noRedirect=${Z}`,
       style: {
         fontSize: 20,
         display: "block",
@@ -225,6 +227,6 @@ const pt = ({ to: e, children: o, style: D, ...b }) => {
   )) }) });
 };
 export {
-  Ft as default
+  jt as default
 };
 //# sourceMappingURL=EncoreApp.js.map

package/dist/components/EncoreApp.js.map

@@ -1 +1 @@
-{"version":3,"file":"EncoreApp.js","sources":["../../src/components/EncoreApp.tsx"],"sourcesContent":["\"use client\";\nimport useSWR from \"swr\";\nimport fetcher from \"../lib/fetcher\";\nimport useEncoreState from \"../stores/useEncoreState\";\nimport React, {\n  Suspense,\n  useEffect,\n  useRef,\n  useState,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport { isLocalMode, setLocalModeOverride } from \"../lib/localMode\";\nimport type { EncoreActionPayload } from \"../contexts/EncoreActionContext\";\nimport DynamicComponent from \"./DynamicComponent\";\nimport { useEncoreRouter } from \"../contexts/EncoreRouterContext\";\nimport { usePusherUpdates } from \"../hooks/usePusherUpdates\";\nimport { useFontLoader } from \"../hooks/useFontLoader\";\nimport { useRepeatingContainers } from \"../hooks/useRepeatingContainers\";\nimport { EncoreContextProviders } from \"./EncoreContextProviders\";\nimport { patchPageData } from \"../lib/dataPatching\";\nimport logger from \"../lib/logger\";\n\n// Simple internal Link component that uses our router context\nconst Link = ({ to, children, style, ...props }: any) => {\n  const { navigate } = useEncoreRouter();\n  return (\n    <a\n      href={to}\n      onClick={(e) => {\n        e.preventDefault();\n        navigate(to);\n      }}\n      style={{ cursor: \"pointer\", ...style }}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\n/**\n * Props for the EncoreApp component\n */\nexport type EncoreAppProps = {\n  /** Unique identifier for the Encore app */\n  appId: string;\n  /** Unique identifier for the page to render. If not provided, shows page selector UI */\n  pageId?: string;\n  /** Optional component identifier for context tracking */\n  componentId?: string;\n  /** Fallback UI to show during component loading */\n  fallback?: React.ReactNode;\n  /** Callback fired when the container size changes */\n  onSizeChange?: (size: { width: number; height: number }) => void;\n  /** Callback fired when the content size changes (including overflow) */\n  onContentSizeChange?: (size: { width: number; height: number }) => void;\n  /** Callback fired when user interactions trigger actions (button clicks, form submissions, etc.) */\n  onAction?: (payload: EncoreActionPayload) => void | Promise<void>;\n  /** Data bindings for components with encore:data tags. Maps component IDs to display values */\n  data?: Record<string, string | number | any[]>;\n  /** Force component loading from \"remote\" CDN or \"local\" filesystem */\n  source?: \"remote\" | \"local\";\n  /** Control repeating containers (sliders, lists) programmatically by container ID */\n  repeatingContainerControls?: Record<\n    string,\n    { currentIndex?: number; onIndexChange?: (index: number) => void }\n  >;\n  /** Control input groups (radio button-like behavior). Maps group name to active element */\n  inputGroups?: Record<string, string>;\n  /** Base URL for the Encore service API */\n  baseURL?: string;\n  /** Provide app definition directly instead of fetching (for offline/bundled deployments) */\n  appDefinition?: any;\n  /** Provide page definition directly instead of fetching (for offline/bundled deployments) */\n  pageDefinition?: any;\n  /** Provide component code directly instead of fetching (for offline/bundled deployments) */\n  componentCode?: string;\n  /** Deployment mode: dynamic (default), optimistic, or production */\n  mode?: \"dynamic\" | \"optimistic\" | \"production\";\n  /** Map of embedded components by ID */\n  embeds?: Record<string, React.ReactNode>;\n};\n\ntype Props = EncoreAppProps;\n\ntype EncoreAssetsById = Record<string, { url?: string }>;\ntype EncoreState = {\n  setApp: (app: unknown) => void;\n  setAppId: (id: string) => void;\n  setPageId: (id: string) => void;\n  assetsById: EncoreAssetsById;\n};\n\nconst setAppSelector = (state: EncoreState) => state.setApp;\nconst setAppIdSelector = (state: EncoreState) => state.setAppId;\nconst setPageIdSelector = (state: EncoreState) => state.setPageId;\nconst assetsByIdSelector = (state: EncoreState) => state.assetsById;\n\n/**\n * Main Encore runtime component\n *\n * Loads and renders Encore Studio apps dynamically from the Encore service.\n * Handles data fetching, font loading, real-time updates, and component rendering.\n *\n * @example\n * // Basic usage\n * <EncoreApp appId=\"01ABC123\" pageId=\"01DEF456\" />\n *\n * @example\n * // With data binding\n * <EncoreApp\n *   appId=\"01ABC123\"\n *   pageId=\"01DEF456\"\n *   data={{\n *     \"title-component\": { text: \"Hello World\" }\n *   }}\n * />\n *\n * @example\n * // Controlling a slider\n * const [slideIndex, setSlideIndex] = useState(0);\n * <EncoreApp\n *   appId=\"01ABC123\"\n *   pageId=\"01DEF456\"\n *   repeatingContainerControls={{\n *     \"slider-123\": {\n *       currentIndex: slideIndex,\n *       onIndexChange: setSlideIndex\n *     }\n *   }}\n * />\n */\nconst EncoreApp = ({\n  appId,\n  pageId,\n  componentId,\n  fallback,\n  onSizeChange,\n  onContentSizeChange,\n  onAction,\n  data,\n  source,\n  repeatingContainerControls,\n  inputGroups,\n  baseURL,\n  appDefinition,\n  pageDefinition,\n  componentCode,\n  mode,\n  embeds,\n}: Props) => {\n  logger.debug(\"EncoreApp render\", { appId, pageId, mode });\n\n  // CRITICAL: Set baseURL BEFORE any hooks that might trigger fetches\n  // This must happen synchronously, not in useEffect, because useSWR will fetch immediately\n  if (baseURL) {\n    const currentBaseURL = useEncoreState.getState().baseURL;\n    if (currentBaseURL !== baseURL) {\n      useEncoreState.getState().setBaseURL(baseURL);\n    }\n  }\n\n  // Apply source override immediately so hooks below observe correct mode\n  if (source) {\n    setLocalModeOverride(source === \"local\" ? \"local\" : \"remote\");\n  }\n\n  const noRedirect = false;\n\n  const setApp = useEncoreState(setAppSelector);\n  const setAppId = useEncoreState(setAppIdSelector);\n  const setPageId = useEncoreState(setPageIdSelector);\n  const assetsById = useEncoreState(assetsByIdSelector);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const contentWrapperRef = useRef<HTMLDivElement | null>(null);\n\n  // Monitor content size changes\n  useEffect(() => {\n    if (!onContentSizeChange) return;\n    const element = contentWrapperRef.current;\n    if (!element) return;\n\n    const notify = () => {\n      // Use scroll dimensions to get full size including overflow\n      onContentSizeChange({\n        width: element.scrollWidth,\n        height: element.scrollHeight,\n      });\n    };\n\n    const observer = new ResizeObserver(() => {\n      notify();\n    });\n\n    // Emit initial size\n    notify();\n    observer.observe(element);\n    return () => observer.disconnect();\n  }, [onContentSizeChange]);\n\n  // State to force DynamicComponent reload when updates are received\n  const [reloadKey, setReloadKey] = useState<string | number>(0);\n  // Set up Pusher to listen for component updates\n  const handleUpdate = useCallback(() => {\n    // Increment reloadKey to force DynamicComponent to reload\n    setReloadKey((prev) => (typeof prev === \"number\" ? prev + 1 : Date.now()));\n  }, []);\n\n  // Only enable Pusher in remote mode - it doesn't make sense in local mode\n  usePusherUpdates({\n    appId,\n    pageId: pageId || undefined,\n    enabled: !isLocalMode() && !appDefinition,\n    onUpdate: handleUpdate,\n  });\n\n  const useLocalFlag = source === \"local\" || isLocalMode();\n\n  // Determine if we should fetch app definition\n  // Production: Do NOT fetch (use appDefinition)\n  // Dynamic: Fetch always (ignore appDefinition unless valid) - wait, dynamic assumes no bundled data usually, or if provided, use it? Current logic uses simple check.\n  // Optimistic: Fetch always, but use appDefinition as fallback/initial data\n\n  // Logic:\n  // If we have appDefinition:\n  // - Production: Use it, no fetch.\n  // - Optimistic: Use it as fallbackData (SWR), and fetch.\n  // - Dynamic (Edge Case): User provided data but wants dynamic? Treat same as Optimistic roughly, or just ignore data.\n  //   But usually Dynamic won't have appDefinition passed unless manually done.\n\n  // Refined Logic based on `mode`:\n  const isProductionMode = mode === \"production\";\n  const isOptimisticMode = mode === \"optimistic\";\n  // Default to dynamic if not specified\n  const isDynamicMode = !isProductionMode && !isOptimisticMode;\n\n  const shouldFetchApp = !isProductionMode && appId;\n  const appUrl = shouldFetchApp\n    ? `/devices/apps/${appId}${useLocalFlag ? \"?useLocal=1\" : \"\"}`\n    : null;\n\n  const appSWR = useSWR(appUrl, fetcher, {\n    suspense: isDynamicMode && !!appUrl, // Suspense only for Dynamic mode\n    fallbackData: isOptimisticMode && appDefinition ? appDefinition : undefined,\n    revalidateOnMount: true, // Ensure we fetch fresh data in optimistic mode\n  });\n\n  const app =\n    isProductionMode && appDefinition ? { data: appDefinition } : appSWR;\n\n  useEffect(() => {\n    setApp(app.data);\n  }, [app.data, setApp]);\n\n  // Load fonts declared in app.json\n  useFontLoader(app?.data);\n\n  useEffect(() => {\n    setAppId(appId);\n  }, [appId, setAppId]);\n\n  useEffect(() => {\n    if (!pageId) return;\n    setPageId(pageId);\n  }, [pageId, setPageId]);\n\n  // FIXME: Asset data should be embedded into & preloaded by component, not looked up like this\n  useEffect(() => {\n    if (Object.keys(assetsById).length === 0) return;\n    (async () => {\n      // Preload images in the browser\n      await Promise.allSettled(\n        Object.keys(assetsById).map((id) => {\n          if (assetsById[id].url) {\n            return new Promise((resolve) => {\n              const img = new Image();\n              img.onload = resolve;\n              img.onerror = resolve; // tolerate failures to avoid unhandled rejections\n              img.src = assetsById[id].url!;\n            });\n          }\n          return Promise.resolve();\n        })\n      );\n    })();\n  }, [assetsById]);\n\n  const shouldFetchPage = !isProductionMode && appId && pageId;\n  const pageUrl = shouldFetchPage\n    ? `/devices/apps/${appId}/node/${pageId}${\n        useLocalFlag ? \"?useLocal=1\" : \"\"\n      }`\n    : null;\n\n  logger.debug(\"Page data fetch\", { pageUrl, mode });\n\n  const pageSWR = useSWR(pageUrl, fetcher, {\n    suspense: isDynamicMode && !!pageUrl,\n    fallbackData:\n      isOptimisticMode && pageDefinition ? pageDefinition : undefined,\n    revalidateOnMount: true,\n  });\n\n  const pageData =\n    isProductionMode && pageDefinition ? { data: pageDefinition } : pageSWR;\n\n  // Specific logic for Component Code fetching in Optimistic Mode\n  // If optimistic, we have componentCode passed in (bundled). We use that initially.\n  // BUT we also want to fetch the latest component code in background.\n  // DynamicComponent uses 'componentCode' prop if present.\n  // We need to fetch the code separately and override the prop passed to DynamicComponent.\n\n  // We need to fetch the latest component JS in optimistic mode\n  // The DynamicComponent currently logic: if (componentCode) loadAMDModule(code) else fetchDep(name).\n  // We want: render with initial componentCode, BUT ALSO fetch new code, and when valid, switch to it.\n\n  const [optimisticCode, setOptimisticCode] = useState<string | undefined>(\n    componentCode\n  );\n\n  useEffect(() => {\n    // If in optimistic mode, we want to fetch the latest code\n    if (isOptimisticMode && appId && pageId && !isLocalMode()) {\n      // We can reuse the logic from DynamicComponent/dynamicModules roughly, or just fetch text.\n      // The URL logic is in dynamicModules.\n      // Let's just rely on DynamicComponent to do the fetching if we pass undefined?\n      // No, if we pass undefined it will suspend/show fallback. We want to show OLD code.\n\n      // So we renders with `optimisticCode` (initially bundled).\n      // We fire a background fetch. on success, updated `optimisticCode`.\n\n      const fetchLatestCode = async () => {\n        try {\n          // Replicating URL logic from dynamicModules for remote mode\n          const { CONST_COMPONENTS_CDN_URL } = await import(\"../../constants\");\n          const cacheBuster = Math.round(Date.now() / 1000);\n          const name = `${appId}/draft/components/${pageId}`;\n          const url = `${CONST_COMPONENTS_CDN_URL}/${name}.js?cacheBuster=${cacheBuster}`;\n\n          const resp = await fetch(url);\n          if (resp.ok) {\n            const text = await resp.text();\n            // Only update if different?\n            // Comparing huge strings might be expensive, but React state update checks equality anyway (ref).\n            // Let's just set it.\n            setOptimisticCode(text);\n            logger.debug(\"Refreshed optimistic component code\");\n          }\n        } catch (e) {\n          logger.warn(\"Failed to background refresh optimistic component\", e);\n        }\n      };\n\n      fetchLatestCode();\n    } else {\n      // If prop changes (e.g. from HMR or parent), sync it\n      setOptimisticCode(componentCode);\n    }\n  }, [componentCode, isOptimisticMode, appId, pageId]);\n\n  // Use the calculated optimistic code or the passed prop depending on mode\n  const effectiveComponentCode = isOptimisticMode\n    ? optimisticCode\n    : componentCode;\n\n  logger.debug(\"Page data loaded\", {\n    hasData: !!pageData?.data,\n    dataType: typeof pageData?.data,\n  });\n\n  // Memoize the context object to prevent infinite re-renders\n  // Only recreate when the actual data changes, not on every render\n  const context = useMemo(() => {\n    let clientData = pageData.data?.clientData;\n    logger.debug(\"Building context\", {\n      hasClientData: !!clientData,\n      clientDataKeys: Object.keys(clientData || {}).length,\n    });\n\n    // Apply layout heuristics to fix common issues\n    if (clientData) {\n      patchPageData(clientData);\n    }\n\n    return {\n      nodeData: undefined,\n      // Allow overriding specific values by element id.\n      // For now, this is used to override TextComponent content when the node has the PROP:TEXT_VAR tag.\n      textOverridesById: data,\n      // Support for encore:data:array tags - provide array data by component ID\n      arrayDataById: data,\n      // Support for standalone component data binding (encore:data tags at root level)\n      rootData: data,\n      // Support for embedded components\n      embedsById: embeds,\n    };\n  }, [pageData.data?.clientData, data, embeds]);\n\n  // Manage repeating container controls (sliders, lists)\n  const repeatingContainerContextValue = useRepeatingContainers(\n    repeatingContainerControls\n  );\n\n  // Sync input groups from props to store\n  useEffect(() => {\n    if (inputGroups) {\n      const setInputGroupValue = useEncoreState.getState().setInputGroupValue;\n      Object.entries(inputGroups).forEach(([groupName, elementName]) => {\n        setInputGroupValue(groupName, elementName);\n      });\n    }\n  }, [inputGroups]);\n\n  // Observe size changes of the dynamic content container and notify consumer\n  useEffect(() => {\n    if (!onSizeChange) return;\n    const element = containerRef.current;\n    if (!element) return;\n    const notify = (entry: ResizeObserverEntry) => {\n      const cr = entry.contentRect;\n      onSizeChange({ width: cr.width, height: cr.height });\n    };\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        notify(entry);\n      }\n    });\n    // Emit initial size as soon as possible\n    const rect = element.getBoundingClientRect();\n    onSizeChange({ width: rect.width, height: rect.height });\n    observer.observe(element);\n    return () => {\n      observer.disconnect();\n    };\n  }, [onSizeChange]);\n\n  // Per-instance source override\n  useEffect(() => {\n    if (!source) return;\n    setLocalModeOverride(source === \"local\" ? \"local\" : \"remote\");\n    return () => {\n      // Clear override when this instance unmounts\n      setLocalModeOverride(null);\n    };\n  }, [source]);\n\n  if (!pageId) {\n    return (\n      <div style={{ padding: \"30px\" }}>\n        <div style={{ overflowY: \"auto\" }}>\n          {(isLocalMode()\n            ? // Local mode: app.json provides pages under app.data.pages\n              ((app?.data as any)?.app?.data?.pages || []).map(\n                (pg: any) => pg?.id\n              )\n            : app?.data?.app.pageIds || []\n          ).map((p: string) => (\n            <Link\n              key={p}\n              to={`/apps/${appId}/pages/${p}?noRedirect=${noRedirect}`}\n              style={{\n                fontSize: 20,\n                display: \"block\",\n                marginBottom: \"10px\",\n              }}\n            >\n              {p}\n            </Link>\n          ))}\n        </div>\n      </div>\n    );\n  }\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        width: \"100%\",\n        height: \"100%\",\n        position: \"relative\",\n        overflow: \"hidden\",\n      }}\n    >\n      <div\n        ref={contentWrapperRef}\n        style={{\n          width: \"100%\",\n          height: \"100%\",\n          display: \"flex\",\n          flexDirection: \"column\",\n        }}\n      >\n        <Suspense fallback={fallback || <div />}>\n          <EncoreContextProviders\n            componentId={componentId}\n            onAction={onAction}\n            repeatingContainerContextValue={repeatingContainerContextValue}\n            bindingContextValue={context}\n          >\n            <DynamicComponent\n              name={`${appId}/draft/components/${pageId}`}\n              fallback={fallback}\n              reloadKey={reloadKey}\n              componentCode={effectiveComponentCode}\n            />\n          </EncoreContextProviders>\n        </Suspense>\n      </div>\n    </div>\n  );\n};\n\nexport default EncoreApp;\n"],"names":["Link","to","children","style","props","navigate","useEncoreRouter","jsx","e","setAppSelector","state","setAppIdSelector","setPageIdSelector","assetsByIdSelector","EncoreApp","appId","pageId","componentId","fallback","onSizeChange","onContentSizeChange","onAction","data","source","repeatingContainerControls","inputGroups","baseURL","appDefinition","pageDefinition","componentCode","mode","embeds","logger","useEncoreState","setLocalModeOverride","noRedirect","setApp","setAppId","setPageId","assetsById","containerRef","useRef","contentWrapperRef","useEffect","element","notify","observer","reloadKey","setReloadKey","useState","handleUpdate","useCallback","prev","usePusherUpdates","isLocalMode","useLocalFlag","isProductionMode","isOptimisticMode","isDynamicMode","appUrl","appSWR","useSWR","fetcher","app","useFontLoader","id","resolve","img","pageUrl","pageSWR","pageData","optimisticCode","setOptimisticCode","CONST_COMPONENTS_CDN_URL","cacheBuster","name","url","resp","text","effectiveComponentCode","context","useMemo","clientData","patchPageData","repeatingContainerContextValue","useRepeatingContainers","setInputGroupValue","groupName","elementName","entry","cr","entries","rect","Suspense","EncoreContextProviders","DynamicComponent","pg","p"],"mappings":";;;;;;;;;;;;;;AAwBA,MAAMA,KAAO,CAAC,EAAE,IAAAC,GAAI,UAAAC,GAAU,OAAAC,GAAO,GAAGC,QAAiB;AACvD,QAAM,EAAE,UAAAC,EAAA,IAAaC,GAAA;AACrB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAMN;AAAA,MACN,SAAS,CAACO,MAAM;AACd,QAAAA,EAAE,eAAA,GACFH,EAASJ,CAAE;AAAA,MACb;AAAA,MACA,OAAO,EAAE,QAAQ,WAAW,GAAGE,EAAA;AAAA,MAC9B,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,GAuDMO,KAAiB,CAACC,MAAuBA,EAAM,QAC/CC,KAAmB,CAACD,MAAuBA,EAAM,UACjDE,KAAoB,CAACF,MAAuBA,EAAM,WAClDG,KAAqB,CAACH,MAAuBA,EAAM,YAoCnDI,KAAY,CAAC;AAAA,EACjB,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,4BAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AACF,MAAa;AACX,EAAAC,EAAO,MAAM,oBAAoB,EAAE,OAAAjB,GAAO,QAAAC,GAAQ,MAAAc,GAAM,GAIpDJ,KACqBO,EAAe,SAAA,EAAW,YAC1BP,KACrBO,EAAe,SAAA,EAAW,WAAWP,CAAO,GAK5CH,KACFW,EAAqBX,MAAW,UAAU,UAAU,QAAQ;AAG9D,QAAMY,IAAa,IAEbC,IAASH,EAAexB,EAAc,GACtC4B,IAAWJ,EAAetB,EAAgB,GAC1C2B,IAAYL,EAAerB,EAAiB,GAC5C2B,IAAaN,EAAepB,EAAkB,GAC9C2B,IAAeC,EAA8B,IAAI,GACjDC,IAAoBD,EAA8B,IAAI;AAG5D,EAAAE,EAAU,MAAM;AACd,QAAI,CAACvB,EAAqB;AAC1B,UAAMwB,IAAUF,EAAkB;AAClC,QAAI,CAACE,EAAS;AAEd,UAAMC,IAAS,MAAM;AAEnB,MAAAzB,EAAoB;AAAA,QAClB,OAAOwB,EAAQ;AAAA,QACf,QAAQA,EAAQ;AAAA,MAAA,CACjB;AAAA,IACH,GAEME,IAAW,IAAI,eAAe,MAAM;AACxC,MAAAD,EAAA;AAAA,IACF,CAAC;AAGD,WAAAA,EAAA,GACAC,EAAS,QAAQF,CAAO,GACjB,MAAME,EAAS,WAAA;AAAA,EACxB,GAAG,CAAC1B,CAAmB,CAAC;AAGxB,QAAM,CAAC2B,GAAWC,CAAY,IAAIC,EAA0B,CAAC,GAEvDC,IAAeC,GAAY,MAAM;AAErC,IAAAH,EAAa,CAACI,MAAU,OAAOA,KAAS,WAAWA,IAAO,IAAI,KAAK,KAAM;AAAA,EAC3E,GAAG,CAAA,CAAE;AAGL,EAAAC,GAAiB;AAAA,IACf,OAAAtC;AAAA,IACA,QAAQC,KAAU;AAAA,IAClB,SAAS,CAACsC,EAAA,KAAiB,CAAC3B;AAAA,IAC5B,UAAUuB;AAAA,EAAA,CACX;AAED,QAAMK,IAAehC,MAAW,WAAW+B,EAAA,GAerCE,IAAmB1B,MAAS,cAC5B2B,IAAmB3B,MAAS,cAE5B4B,IAAgB,CAACF,KAAoB,CAACC,GAGtCE,IADiB,CAACH,KAAoBzC,IAExC,iBAAiBA,CAAK,GAAGwC,IAAe,gBAAgB,EAAE,KAC1D,MAEEK,IAASC,EAAOF,GAAQG,GAAS;AAAA,IACrC,UAAUJ,KAAiB,CAAC,CAACC;AAAA;AAAA,IAC7B,cAAcF,KAAoB9B,IAAgBA,IAAgB;AAAA,IAClE,mBAAmB;AAAA;AAAA,EAAA,CACpB,GAEKoC,IACJP,KAAoB7B,IAAgB,EAAE,MAAMA,MAAkBiC;AAEhE,EAAAjB,EAAU,MAAM;AACd,IAAAP,EAAO2B,EAAI,IAAI;AAAA,EACjB,GAAG,CAACA,EAAI,MAAM3B,CAAM,CAAC,GAGrB4B,GAAcD,GAAK,IAAI,GAEvBpB,EAAU,MAAM;AACd,IAAAN,EAAStB,CAAK;AAAA,EAChB,GAAG,CAACA,GAAOsB,CAAQ,CAAC,GAEpBM,EAAU,MAAM;AACd,IAAK3B,KACLsB,EAAUtB,CAAM;AAAA,EAClB,GAAG,CAACA,GAAQsB,CAAS,CAAC,GAGtBK,EAAU,MAAM;AACd,IAAI,OAAO,KAAKJ,CAAU,EAAE,WAAW,MACtC,YAEC,MAAM,QAAQ;AAAA,MACZ,OAAO,KAAKA,CAAU,EAAE,IAAI,CAAC0B,MACvB1B,EAAW0B,CAAE,EAAE,MACV,IAAI,QAAQ,CAACC,MAAY;AAC9B,cAAMC,IAAM,IAAI,MAAA;AAChB,QAAAA,EAAI,SAASD,GACbC,EAAI,UAAUD,GACdC,EAAI,MAAM5B,EAAW0B,CAAE,EAAE;AAAA,MAC3B,CAAC,IAEI,QAAQ,QAAA,CAChB;AAAA,IAAA;AAAA,EAGP,GAAG,CAAC1B,CAAU,CAAC;AAGf,QAAM6B,IADkB,CAACZ,KAAoBzC,KAASC,IAElD,iBAAiBD,CAAK,SAASC,CAAM,GACnCuC,IAAe,gBAAgB,EACjC,KACA;AAEJ,EAAAvB,EAAO,MAAM,mBAAmB,EAAE,SAAAoC,GAAS,MAAAtC,GAAM;AAEjD,QAAMuC,IAAUR,EAAOO,GAASN,GAAS;AAAA,IACvC,UAAUJ,KAAiB,CAAC,CAACU;AAAA,IAC7B,cACEX,KAAoB7B,IAAiBA,IAAiB;AAAA,IACxD,mBAAmB;AAAA,EAAA,CACpB,GAEK0C,IACJd,KAAoB5B,IAAiB,EAAE,MAAMA,MAAmByC,GAY5D,CAACE,IAAgBC,CAAiB,IAAIvB;AAAA,IAC1CpB;AAAA,EAAA;AAGF,EAAAc,EAAU,MAAM;AAEd,IAAIc,KAAoB1C,KAASC,KAAU,CAACsC,OASlB,YAAY;AAClC,UAAI;AAEF,cAAM,EAAE,0BAAAmB,EAAA,IAA6B,MAAM,OAAO,qCAAiB,GAC7DC,IAAc,KAAK,MAAM,KAAK,IAAA,IAAQ,GAAI,GAC1CC,IAAO,GAAG5D,CAAK,qBAAqBC,CAAM,IAC1C4D,IAAM,GAAGH,CAAwB,IAAIE,CAAI,mBAAmBD,CAAW,IAEvEG,IAAO,MAAM,MAAMD,CAAG;AAC5B,YAAIC,EAAK,IAAI;AACX,gBAAMC,KAAO,MAAMD,EAAK,KAAA;AAIxB,UAAAL,EAAkBM,EAAI,GACtB9C,EAAO,MAAM,qCAAqC;AAAA,QACpD;AAAA,MACF,SAASxB,GAAG;AACV,QAAAwB,EAAO,KAAK,qDAAqDxB,CAAC;AAAA,MACpE;AAAA,IACF,GAEA,IAGAgE,EAAkB3C,CAAa;AAAA,EAEnC,GAAG,CAACA,GAAe4B,GAAkB1C,GAAOC,CAAM,CAAC;AAGnD,QAAM+D,KAAyBtB,IAC3Bc,KACA1C;AAEJ,EAAAG,EAAO,MAAM,oBAAoB;AAAA,IAC/B,SAAS,CAAC,CAACsC,GAAU;AAAA,IACrB,UAAU,OAAOA,GAAU;AAAA,EAAA,CAC5B;AAID,QAAMU,KAAUC,GAAQ,MAAM;AAC5B,QAAIC,IAAaZ,EAAS,MAAM;AAChC,WAAAtC,EAAO,MAAM,oBAAoB;AAAA,MAC/B,eAAe,CAAC,CAACkD;AAAA,MACjB,gBAAgB,OAAO,KAAKA,KAAc,CAAA,CAAE,EAAE;AAAA,IAAA,CAC/C,GAGGA,KACFC,GAAcD,CAAU,GAGnB;AAAA,MACL,UAAU;AAAA;AAAA;AAAA,MAGV,mBAAmB5D;AAAA;AAAA,MAEnB,eAAeA;AAAA;AAAA,MAEf,UAAUA;AAAA;AAAA,MAEV,YAAYS;AAAA,IAAA;AAAA,EAEhB,GAAG,CAACuC,EAAS,MAAM,YAAYhD,GAAMS,CAAM,CAAC,GAGtCqD,KAAiCC;AAAA,IACrC7D;AAAA,EAAA;AA8CF,SA1CAmB,EAAU,MAAM;AACd,QAAIlB,GAAa;AACf,YAAM6D,IAAqBrD,EAAe,SAAA,EAAW;AACrD,aAAO,QAAQR,CAAW,EAAE,QAAQ,CAAC,CAAC8D,GAAWC,CAAW,MAAM;AAChE,QAAAF,EAAmBC,GAAWC,CAAW;AAAA,MAC3C,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC/D,CAAW,CAAC,GAGhBkB,EAAU,MAAM;AACd,QAAI,CAACxB,EAAc;AACnB,UAAMyB,IAAUJ,EAAa;AAC7B,QAAI,CAACI,EAAS;AACd,UAAMC,IAAS,CAAC4C,MAA+B;AAC7C,YAAMC,IAAKD,EAAM;AACjB,MAAAtE,EAAa,EAAE,OAAOuE,EAAG,OAAO,QAAQA,EAAG,QAAQ;AAAA,IACrD,GACM5C,IAAW,IAAI,eAAe,CAAC6C,MAAY;AAC/C,iBAAWF,KAASE;AAClB,QAAA9C,EAAO4C,CAAK;AAAA,IAEhB,CAAC,GAEKG,IAAOhD,EAAQ,sBAAA;AACrB,WAAAzB,EAAa,EAAE,OAAOyE,EAAK,OAAO,QAAQA,EAAK,QAAQ,GACvD9C,EAAS,QAAQF,CAAO,GACjB,MAAM;AACX,MAAAE,EAAS,WAAA;AAAA,IACX;AAAA,EACF,GAAG,CAAC3B,CAAY,CAAC,GAGjBwB,EAAU,MAAM;AACd,QAAKpB;AACL,aAAAW,EAAqBX,MAAW,UAAU,UAAU,QAAQ,GACrD,MAAM;AAEX,QAAAW,EAAqB,IAAI;AAAA,MAC3B;AAAA,EACF,GAAG,CAACX,CAAM,CAAC,GAENP,IA4BH,gBAAAT;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKiC;AAAA,MACL,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,UAAU;AAAA,MAAA;AAAA,MAGZ,UAAA,gBAAAjC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKmC;AAAA,UACL,OAAO;AAAA,YACL,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAe;AAAA,UAAA;AAAA,UAGjB,4BAACmD,IAAA,EAAS,UAAU3E,KAAY,gBAAAX,EAAC,SAAI,GACnC,UAAA,gBAAAA;AAAA,YAACuF;AAAA,YAAA;AAAA,cACC,aAAA7E;AAAA,cACA,UAAAI;AAAA,cACA,gCAAA+D;AAAA,cACA,qBAAqBJ;AAAA,cAErB,UAAA,gBAAAzE;AAAA,gBAACwF;AAAA,gBAAA;AAAA,kBACC,MAAM,GAAGhF,CAAK,qBAAqBC,CAAM;AAAA,kBACzC,UAAAE;AAAA,kBACA,WAAA6B;AAAA,kBACA,eAAegC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACjB;AAAA,UAAA,EACF,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA,IA3DA,gBAAAxE,EAAC,OAAA,EAAI,OAAO,EAAE,SAAS,OAAA,GACrB,UAAA,gBAAAA,EAAC,OAAA,EAAI,OAAO,EAAE,WAAW,UACrB,WAAA+C,EAAA;AAAA;AAAA,KAEIS,GAAK,MAAc,KAAK,MAAM,SAAS,CAAA,GAAI;AAAA,MAC3C,CAACiC,MAAYA,GAAI;AAAA,IAAA;AAAA,MAEnBjC,GAAK,MAAM,IAAI,WAAW,CAAA,GAC5B,IAAI,CAACkC,MACL,gBAAA1F;AAAA,IAACP;AAAA,IAAA;AAAA,MAEC,IAAI,SAASe,CAAK,UAAUkF,CAAC,eAAe9D,CAAU;AAAA,MACtD,OAAO;AAAA,QACL,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAc;AAAA,MAAA;AAAA,MAGf,UAAA8D;AAAA,IAAA;AAAA,IARIA;AAAA,EAAA,CAUR,GACH,EAAA,CACF;AAwCN;"}
+{"version":3,"file":"EncoreApp.js","sources":["../../src/components/EncoreApp.tsx"],"sourcesContent":["\"use client\";\nimport useSWR from \"swr\";\nimport fetcher from \"../lib/fetcher\";\nimport useEncoreState from \"../stores/useEncoreState\";\nimport React, {\n  Suspense,\n  useEffect,\n  useRef,\n  useState,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport { isLocalMode, setLocalModeOverride } from \"../lib/localMode\";\nimport type { EncoreActionPayload } from \"../contexts/EncoreActionContext\";\nimport DynamicComponent from \"./DynamicComponent\";\nimport { useEncoreRouter } from \"../contexts/EncoreRouterContext\";\nimport { usePusherUpdates } from \"../hooks/usePusherUpdates\";\nimport { useFontLoader } from \"../hooks/useFontLoader\";\nimport { useRepeatingContainers } from \"../hooks/useRepeatingContainers\";\nimport { EncoreContextProviders } from \"./EncoreContextProviders\";\nimport { patchPageData } from \"../lib/dataPatching\";\nimport logger from \"../lib/logger\";\n\n// Simple internal Link component that uses our router context\nconst Link = ({ to, children, style, ...props }: any) => {\n  const { navigate } = useEncoreRouter();\n  return (\n    <a\n      href={to}\n      onClick={(e) => {\n        e.preventDefault();\n        navigate(to);\n      }}\n      style={{ cursor: \"pointer\", ...style }}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\n/**\n * Props for the EncoreApp component\n */\nexport type EncoreAppProps = {\n  /** Unique identifier for the Encore app */\n  appId: string;\n  /** Unique identifier for the page to render. If not provided, shows page selector UI */\n  pageId?: string;\n  /** Optional component identifier for context tracking */\n  componentId?: string;\n  /** Fallback UI to show during component loading */\n  fallback?: React.ReactNode;\n  /** Callback fired when the container size changes */\n  onSizeChange?: (size: { width: number; height: number }) => void;\n  /** Callback fired when the content size changes (including overflow) */\n  onContentSizeChange?: (size: { width: number; height: number }) => void;\n  /** Callback fired when user interactions trigger actions (button clicks, form submissions, etc.) */\n  onAction?: (payload: EncoreActionPayload) => void | Promise<void>;\n  /** Data bindings for components with encore:data tags. Maps component IDs to display values */\n  data?: Record<string, string | number | any[]>;\n  /** Force component loading from \"remote\" CDN or \"local\" filesystem */\n  source?: \"remote\" | \"local\";\n  /** Control repeating containers (sliders, lists) programmatically by container ID */\n  repeatingContainerControls?: Record<\n    string,\n    { currentIndex?: number; onIndexChange?: (index: number) => void }\n  >;\n  /** Control input groups (radio button-like behavior). Maps group name to active element */\n  inputGroups?: Record<string, string>;\n  /** Base URL for the Encore service API */\n  baseURL?: string;\n  /** Provide app definition directly instead of fetching (for offline/bundled deployments) */\n  appDefinition?: any;\n  /** Provide page definition directly instead of fetching (for offline/bundled deployments) */\n  pageDefinition?: any;\n  /** Provide component code directly instead of fetching (for offline/bundled deployments) */\n  componentCode?: string;\n  /** Deployment mode: dynamic (default), optimistic, or production */\n  mode?: \"dynamic\" | \"optimistic\" | \"production\";\n  /** Map of embedded components by ID */\n  embeds?: Record<string, React.ReactNode>;\n};\n\ntype Props = EncoreAppProps;\n\ntype EncoreAssetsById = Record<string, { url?: string }>;\ntype EncoreState = {\n  setApp: (app: unknown) => void;\n  setAppId: (id: string) => void;\n  setPageId: (id: string) => void;\n  assetsById: EncoreAssetsById;\n};\n\nconst setAppSelector = (state: EncoreState) => state.setApp;\nconst setAppIdSelector = (state: EncoreState) => state.setAppId;\nconst setPageIdSelector = (state: EncoreState) => state.setPageId;\nconst assetsByIdSelector = (state: EncoreState) => state.assetsById;\n\n/**\n * Main Encore runtime component\n *\n * Loads and renders Encore Studio apps dynamically from the Encore service.\n * Handles data fetching, font loading, real-time updates, and component rendering.\n *\n * @example\n * // Basic usage\n * <EncoreApp appId=\"01ABC123\" pageId=\"01DEF456\" />\n *\n * @example\n * // With data binding\n * <EncoreApp\n *   appId=\"01ABC123\"\n *   pageId=\"01DEF456\"\n *   data={{\n *     \"title-component\": { text: \"Hello World\" }\n *   }}\n * />\n *\n * @example\n * // Controlling a slider\n * const [slideIndex, setSlideIndex] = useState(0);\n * <EncoreApp\n *   appId=\"01ABC123\"\n *   pageId=\"01DEF456\"\n *   repeatingContainerControls={{\n *     \"slider-123\": {\n *       currentIndex: slideIndex,\n *       onIndexChange: setSlideIndex\n *     }\n *   }}\n * />\n */\nconst EncoreApp = ({\n  appId,\n  pageId,\n  componentId,\n  fallback,\n  onSizeChange,\n  onContentSizeChange,\n  onAction,\n  data,\n  source,\n  repeatingContainerControls,\n  inputGroups,\n  baseURL,\n  appDefinition,\n  pageDefinition,\n  componentCode,\n  mode,\n  embeds,\n}: Props) => {\n  logger.debug(\"EncoreApp render\", { appId, pageId, mode });\n\n  // CRITICAL: Set baseURL BEFORE any hooks that might trigger fetches\n  // This must happen synchronously, not in useEffect, because useSWR will fetch immediately\n  if (baseURL) {\n    const currentBaseURL = useEncoreState.getState().baseURL;\n    if (currentBaseURL !== baseURL) {\n      useEncoreState.getState().setBaseURL(baseURL);\n    }\n  }\n\n  // Apply source override immediately so hooks below observe correct mode\n  if (source) {\n    setLocalModeOverride(source === \"local\" ? \"local\" : \"remote\");\n  }\n\n  const noRedirect = false;\n\n  const setApp = useEncoreState(setAppSelector);\n  const setAppId = useEncoreState(setAppIdSelector);\n  const setPageId = useEncoreState(setPageIdSelector);\n  const assetsById = useEncoreState(assetsByIdSelector);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const contentWrapperRef = useRef<HTMLDivElement | null>(null);\n\n  // Monitor content size changes\n  useEffect(() => {\n    if (!onContentSizeChange) return;\n    const element = contentWrapperRef.current;\n    if (!element) return;\n\n    const notify = () => {\n      // Use scroll dimensions to get full size including overflow\n      onContentSizeChange({\n        width: element.scrollWidth,\n        height: element.scrollHeight,\n      });\n    };\n\n    const observer = new ResizeObserver(() => {\n      notify();\n    });\n\n    // Emit initial size\n    notify();\n    observer.observe(element);\n    return () => observer.disconnect();\n  }, [onContentSizeChange]);\n\n  // State to force DynamicComponent reload when updates are received\n  const [reloadKey, setReloadKey] = useState<string | number>(0);\n  // Set up Pusher to listen for component updates\n  const handleUpdate = useCallback(() => {\n    // Increment reloadKey to force DynamicComponent to reload\n    setReloadKey((prev) => (typeof prev === \"number\" ? prev + 1 : Date.now()));\n  }, []);\n\n  const useLocalFlag = source === \"local\" || isLocalMode();\n\n  // Determine if we should fetch app definition\n  // Production: Do NOT fetch (use appDefinition)\n  // Dynamic: Fetch always (ignore appDefinition unless valid) - wait, dynamic assumes no bundled data usually, or if provided, use it? Current logic uses simple check.\n  // Optimistic: Fetch always, but use appDefinition as fallback/initial data\n\n  // Logic:\n  // If we have appDefinition:\n  // - Production: Use it, no fetch.\n  // - Optimistic: Use it as fallbackData (SWR), and fetch.\n  // - Dynamic (Edge Case): User provided data but wants dynamic? Treat same as Optimistic roughly, or just ignore data.\n  //   But usually Dynamic won't have appDefinition passed unless manually done.\n\n  // Refined Logic based on `mode`:\n  const isProductionMode = mode === \"production\";\n  const isOptimisticMode = mode === \"optimistic\";\n  // Default to dynamic if not specified\n  const isDynamicMode = !isProductionMode && !isOptimisticMode;\n\n  // Only enable Pusher in remote mode - it doesn't make sense in local mode\n  usePusherUpdates({\n    appId,\n    pageId: pageId || undefined,\n    enabled: isOptimisticMode || (!isLocalMode() && !appDefinition),\n    onUpdate: handleUpdate,\n  });\n\n  const shouldFetchApp = !isProductionMode && appId;\n  const appUrl = shouldFetchApp\n    ? `/devices/apps/${appId}${useLocalFlag ? \"?useLocal=1\" : \"\"}`\n    : null;\n\n  const appSWR = useSWR(appUrl, fetcher, {\n    suspense: isDynamicMode && !!appUrl, // Suspense only for Dynamic mode\n    fallbackData: isOptimisticMode && appDefinition ? appDefinition : undefined,\n    revalidateOnMount: true, // Ensure we fetch fresh data in optimistic mode\n  });\n\n  const app =\n    isProductionMode && appDefinition ? { data: appDefinition } : appSWR;\n\n  useEffect(() => {\n    setApp(app.data);\n  }, [app.data, setApp]);\n\n  // Load fonts declared in app.json\n  useFontLoader(app?.data);\n\n  useEffect(() => {\n    setAppId(appId);\n  }, [appId, setAppId]);\n\n  useEffect(() => {\n    if (!pageId) return;\n    setPageId(pageId);\n  }, [pageId, setPageId]);\n\n  // FIXME: Asset data should be embedded into & preloaded by component, not looked up like this\n  useEffect(() => {\n    if (Object.keys(assetsById).length === 0) return;\n    (async () => {\n      // Preload images in the browser\n      await Promise.allSettled(\n        Object.keys(assetsById).map((id) => {\n          if (assetsById[id].url) {\n            return new Promise((resolve) => {\n              const img = new Image();\n              img.onload = resolve;\n              img.onerror = resolve; // tolerate failures to avoid unhandled rejections\n              img.src = assetsById[id].url!;\n            });\n          }\n          return Promise.resolve();\n        }),\n      );\n    })();\n  }, [assetsById]);\n\n  const shouldFetchPage = !isProductionMode && appId && pageId;\n  const pageUrl = shouldFetchPage\n    ? `/devices/apps/${appId}/node/${pageId}${\n        useLocalFlag ? \"?useLocal=1\" : \"\"\n      }`\n    : null;\n\n  logger.debug(\"Page data fetch\", { pageUrl, mode });\n\n  const pageSWR = useSWR(pageUrl, fetcher, {\n    suspense: isDynamicMode && !!pageUrl,\n    fallbackData:\n      isOptimisticMode && pageDefinition ? pageDefinition : undefined,\n    revalidateOnMount: true,\n  });\n\n  const pageData =\n    isProductionMode && pageDefinition ? { data: pageDefinition } : pageSWR;\n\n  // Specific logic for Component Code fetching in Optimistic Mode\n  // If optimistic, we have componentCode passed in (bundled). We use that initially.\n  // BUT we also want to fetch the latest component code in background.\n  // DynamicComponent uses 'componentCode' prop if present.\n  // We need to fetch the code separately and override the prop passed to DynamicComponent.\n\n  // We need to fetch the latest component JS in optimistic mode\n  // The DynamicComponent currently logic: if (componentCode) loadAMDModule(code) else fetchDep(name).\n  // We want: render with initial componentCode, BUT ALSO fetch new code, and when valid, switch to it.\n\n  const [optimisticCode, setOptimisticCode] = useState<string | undefined>(\n    componentCode,\n  );\n\n  useEffect(() => {\n    // If in optimistic mode, we want to fetch the latest code\n    if (isOptimisticMode && appId && pageId && !isLocalMode()) {\n      // We can reuse the logic from DynamicComponent/dynamicModules roughly, or just fetch text.\n      // The URL logic is in dynamicModules.\n      // Let's just rely on DynamicComponent to do the fetching if we pass undefined?\n      // No, if we pass undefined it will suspend/show fallback. We want to show OLD code.\n\n      // So we renders with `optimisticCode` (initially bundled).\n      // We fire a background fetch. on success, updated `optimisticCode`.\n\n      const fetchLatestCode = async () => {\n        try {\n          // Replicating URL logic from dynamicModules for remote mode\n          const { CONST_COMPONENTS_CDN_URL } = await import(\"../../constants\");\n          const cacheBuster = Math.round(Date.now() / 1000);\n          const name = `${appId}/draft/components/${pageId}`;\n          const url = `${CONST_COMPONENTS_CDN_URL}/${name}.js?cacheBuster=${cacheBuster}`;\n\n          const resp = await fetch(url);\n          if (resp.ok) {\n            const text = await resp.text();\n            // Check if code is different from what we have (either bundled or previously fetched)\n            // Use strict equality as strings are primitives.\n            // If the server returns identical code, we skip the update to avoid re-rendering.\n            setOptimisticCode((currentCode) => {\n              if (text === currentCode) {\n                logger.debug(\"Optimistic code is up to date\");\n                return currentCode;\n              }\n              logger.debug(\n                \"Refreshed optimistic component code (new version found)\",\n              );\n              return text;\n            });\n          }\n        } catch (e) {\n          logger.warn(\"Failed to background refresh optimistic component\", e);\n        }\n      };\n\n      fetchLatestCode();\n    } else {\n      // If prop changes (e.g. from HMR or parent), sync it\n      setOptimisticCode(componentCode);\n    }\n  }, [componentCode, isOptimisticMode, appId, pageId, reloadKey]);\n\n  // Use the calculated optimistic code or the passed prop depending on mode\n  const effectiveComponentCode = isOptimisticMode\n    ? optimisticCode\n    : componentCode;\n\n  logger.debug(\"Page data loaded\", {\n    hasData: !!pageData?.data,\n    dataType: typeof pageData?.data,\n  });\n\n  // Memoize the context object to prevent infinite re-renders\n  // Only recreate when the actual data changes, not on every render\n  const context = useMemo(() => {\n    let clientData = pageData.data?.clientData;\n    logger.debug(\"Building context\", {\n      hasClientData: !!clientData,\n      clientDataKeys: Object.keys(clientData || {}).length,\n    });\n\n    // Apply layout heuristics to fix common issues\n    if (clientData) {\n      patchPageData(clientData);\n    }\n\n    return {\n      nodeData: undefined,\n      // Allow overriding specific values by element id.\n      // For now, this is used to override TextComponent content when the node has the PROP:TEXT_VAR tag.\n      textOverridesById: data,\n      // Support for encore:data:array tags - provide array data by component ID\n      arrayDataById: data,\n      // Support for standalone component data binding (encore:data tags at root level)\n      rootData: data,\n      // Support for embedded components\n      embedsById: embeds,\n    };\n  }, [pageData.data?.clientData, data, embeds]);\n\n  // Manage repeating container controls (sliders, lists)\n  const repeatingContainerContextValue = useRepeatingContainers(\n    repeatingContainerControls,\n  );\n\n  // Sync input groups from props to store\n  useEffect(() => {\n    if (inputGroups) {\n      const setInputGroupValue = useEncoreState.getState().setInputGroupValue;\n      Object.entries(inputGroups).forEach(([groupName, elementName]) => {\n        setInputGroupValue(groupName, elementName);\n      });\n    }\n  }, [inputGroups]);\n\n  // Observe size changes of the dynamic content container and notify consumer\n  useEffect(() => {\n    if (!onSizeChange) return;\n    const element = containerRef.current;\n    if (!element) return;\n    const notify = (entry: ResizeObserverEntry) => {\n      const cr = entry.contentRect;\n      onSizeChange({ width: cr.width, height: cr.height });\n    };\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        notify(entry);\n      }\n    });\n    // Emit initial size as soon as possible\n    const rect = element.getBoundingClientRect();\n    onSizeChange({ width: rect.width, height: rect.height });\n    observer.observe(element);\n    return () => {\n      observer.disconnect();\n    };\n  }, [onSizeChange]);\n\n  // Per-instance source override\n  useEffect(() => {\n    if (!source) return;\n    setLocalModeOverride(source === \"local\" ? \"local\" : \"remote\");\n    return () => {\n      // Clear override when this instance unmounts\n      setLocalModeOverride(null);\n    };\n  }, [source]);\n\n  if (!pageId) {\n    return (\n      <div style={{ padding: \"30px\" }}>\n        <div style={{ overflowY: \"auto\" }}>\n          {(isLocalMode()\n            ? // Local mode: app.json provides pages under app.data.pages\n              ((app?.data as any)?.app?.data?.pages || []).map(\n                (pg: any) => pg?.id,\n              )\n            : app?.data?.app.pageIds || []\n          ).map((p: string) => (\n            <Link\n              key={p}\n              to={`/apps/${appId}/pages/${p}?noRedirect=${noRedirect}`}\n              style={{\n                fontSize: 20,\n                display: \"block\",\n                marginBottom: \"10px\",\n              }}\n            >\n              {p}\n            </Link>\n          ))}\n        </div>\n      </div>\n    );\n  }\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        width: \"100%\",\n        height: \"100%\",\n        position: \"relative\",\n        overflow: \"hidden\",\n      }}\n    >\n      <div\n        ref={contentWrapperRef}\n        style={{\n          width: \"100%\",\n          height: \"100%\",\n          display: \"flex\",\n          flexDirection: \"column\",\n        }}\n      >\n        <Suspense fallback={fallback || <div />}>\n          <EncoreContextProviders\n            componentId={componentId}\n            onAction={onAction}\n            repeatingContainerContextValue={repeatingContainerContextValue}\n            bindingContextValue={context}\n          >\n            <DynamicComponent\n              name={`${appId}/draft/components/${pageId}`}\n              fallback={fallback}\n              reloadKey={reloadKey}\n              componentCode={effectiveComponentCode}\n            />\n          </EncoreContextProviders>\n        </Suspense>\n      </div>\n    </div>\n  );\n};\n\nexport default EncoreApp;\n"],"names":["Link","to","children","style","props","navigate","useEncoreRouter","jsx","e","setAppSelector","state","setAppIdSelector","setPageIdSelector","assetsByIdSelector","EncoreApp","appId","pageId","componentId","fallback","onSizeChange","onContentSizeChange","onAction","data","source","repeatingContainerControls","inputGroups","baseURL","appDefinition","pageDefinition","componentCode","mode","embeds","logger","useEncoreState","setLocalModeOverride","noRedirect","setApp","setAppId","setPageId","assetsById","containerRef","useRef","contentWrapperRef","useEffect","element","notify","observer","reloadKey","setReloadKey","useState","handleUpdate","useCallback","prev","useLocalFlag","isLocalMode","isProductionMode","isOptimisticMode","isDynamicMode","usePusherUpdates","appUrl","appSWR","useSWR","fetcher","app","useFontLoader","id","resolve","img","pageUrl","pageSWR","pageData","optimisticCode","setOptimisticCode","CONST_COMPONENTS_CDN_URL","cacheBuster","name","url","resp","text","currentCode","effectiveComponentCode","context","useMemo","clientData","patchPageData","repeatingContainerContextValue","useRepeatingContainers","setInputGroupValue","groupName","elementName","entry","cr","entries","rect","Suspense","EncoreContextProviders","DynamicComponent","pg","p"],"mappings":";;;;;;;;;;;;;;AAwBA,MAAMA,KAAO,CAAC,EAAE,IAAAC,GAAI,UAAAC,GAAU,OAAAC,GAAO,GAAGC,QAAiB;AACvD,QAAM,EAAE,UAAAC,EAAA,IAAaC,GAAA;AACrB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAMN;AAAA,MACN,SAAS,CAACO,MAAM;AACd,QAAAA,EAAE,eAAA,GACFH,EAASJ,CAAE;AAAA,MACb;AAAA,MACA,OAAO,EAAE,QAAQ,WAAW,GAAGE,EAAA;AAAA,MAC9B,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,GAuDMO,KAAiB,CAACC,MAAuBA,EAAM,QAC/CC,KAAmB,CAACD,MAAuBA,EAAM,UACjDE,KAAoB,CAACF,MAAuBA,EAAM,WAClDG,KAAqB,CAACH,MAAuBA,EAAM,YAoCnDI,KAAY,CAAC;AAAA,EACjB,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,4BAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AACF,MAAa;AACX,EAAAC,EAAO,MAAM,oBAAoB,EAAE,OAAAjB,GAAO,QAAAC,GAAQ,MAAAc,GAAM,GAIpDJ,KACqBO,EAAe,SAAA,EAAW,YAC1BP,KACrBO,EAAe,SAAA,EAAW,WAAWP,CAAO,GAK5CH,KACFW,EAAqBX,MAAW,UAAU,UAAU,QAAQ;AAG9D,QAAMY,IAAa,IAEbC,IAASH,EAAexB,EAAc,GACtC4B,IAAWJ,EAAetB,EAAgB,GAC1C2B,IAAYL,EAAerB,EAAiB,GAC5C2B,IAAaN,EAAepB,EAAkB,GAC9C2B,IAAeC,EAA8B,IAAI,GACjDC,IAAoBD,EAA8B,IAAI;AAG5D,EAAAE,EAAU,MAAM;AACd,QAAI,CAACvB,EAAqB;AAC1B,UAAMwB,IAAUF,EAAkB;AAClC,QAAI,CAACE,EAAS;AAEd,UAAMC,IAAS,MAAM;AAEnB,MAAAzB,EAAoB;AAAA,QAClB,OAAOwB,EAAQ;AAAA,QACf,QAAQA,EAAQ;AAAA,MAAA,CACjB;AAAA,IACH,GAEME,IAAW,IAAI,eAAe,MAAM;AACxC,MAAAD,EAAA;AAAA,IACF,CAAC;AAGD,WAAAA,EAAA,GACAC,EAAS,QAAQF,CAAO,GACjB,MAAME,EAAS,WAAA;AAAA,EACxB,GAAG,CAAC1B,CAAmB,CAAC;AAGxB,QAAM,CAAC2B,GAAWC,CAAY,IAAIC,EAA0B,CAAC,GAEvDC,IAAeC,GAAY,MAAM;AAErC,IAAAH,EAAa,CAACI,MAAU,OAAOA,KAAS,WAAWA,IAAO,IAAI,KAAK,KAAM;AAAA,EAC3E,GAAG,CAAA,CAAE,GAECC,IAAe9B,MAAW,WAAW+B,EAAA,GAerCC,IAAmBzB,MAAS,cAC5B0B,IAAmB1B,MAAS,cAE5B2B,IAAgB,CAACF,KAAoB,CAACC;AAG5C,EAAAE,GAAiB;AAAA,IACf,OAAA3C;AAAA,IACA,QAAQC,KAAU;AAAA,IAClB,SAASwC,KAAqB,CAACF,EAAA,KAAiB,CAAC3B;AAAA,IACjD,UAAUuB;AAAA,EAAA,CACX;AAGD,QAAMS,IADiB,CAACJ,KAAoBxC,IAExC,iBAAiBA,CAAK,GAAGsC,IAAe,gBAAgB,EAAE,KAC1D,MAEEO,KAASC,EAAOF,GAAQG,GAAS;AAAA,IACrC,UAAUL,KAAiB,CAAC,CAACE;AAAA;AAAA,IAC7B,cAAcH,KAAoB7B,IAAgBA,IAAgB;AAAA,IAClE,mBAAmB;AAAA;AAAA,EAAA,CACpB,GAEKoC,IACJR,KAAoB5B,IAAgB,EAAE,MAAMA,MAAkBiC;AAEhE,EAAAjB,EAAU,MAAM;AACd,IAAAP,EAAO2B,EAAI,IAAI;AAAA,EACjB,GAAG,CAACA,EAAI,MAAM3B,CAAM,CAAC,GAGrB4B,GAAcD,GAAK,IAAI,GAEvBpB,EAAU,MAAM;AACd,IAAAN,EAAStB,CAAK;AAAA,EAChB,GAAG,CAACA,GAAOsB,CAAQ,CAAC,GAEpBM,EAAU,MAAM;AACd,IAAK3B,KACLsB,EAAUtB,CAAM;AAAA,EAClB,GAAG,CAACA,GAAQsB,CAAS,CAAC,GAGtBK,EAAU,MAAM;AACd,IAAI,OAAO,KAAKJ,CAAU,EAAE,WAAW,MACtC,YAEC,MAAM,QAAQ;AAAA,MACZ,OAAO,KAAKA,CAAU,EAAE,IAAI,CAAC0B,MACvB1B,EAAW0B,CAAE,EAAE,MACV,IAAI,QAAQ,CAACC,MAAY;AAC9B,cAAMC,IAAM,IAAI,MAAA;AAChB,QAAAA,EAAI,SAASD,GACbC,EAAI,UAAUD,GACdC,EAAI,MAAM5B,EAAW0B,CAAE,EAAE;AAAA,MAC3B,CAAC,IAEI,QAAQ,QAAA,CAChB;AAAA,IAAA;AAAA,EAGP,GAAG,CAAC1B,CAAU,CAAC;AAGf,QAAM6B,IADkB,CAACb,KAAoBxC,KAASC,IAElD,iBAAiBD,CAAK,SAASC,CAAM,GACnCqC,IAAe,gBAAgB,EACjC,KACA;AAEJ,EAAArB,EAAO,MAAM,mBAAmB,EAAE,SAAAoC,GAAS,MAAAtC,GAAM;AAEjD,QAAMuC,KAAUR,EAAOO,GAASN,GAAS;AAAA,IACvC,UAAUL,KAAiB,CAAC,CAACW;AAAA,IAC7B,cACEZ,KAAoB5B,IAAiBA,IAAiB;AAAA,IACxD,mBAAmB;AAAA,EAAA,CACpB,GAEK0C,IACJf,KAAoB3B,IAAiB,EAAE,MAAMA,MAAmByC,IAY5D,CAACE,IAAgBC,CAAiB,IAAIvB;AAAA,IAC1CpB;AAAA,EAAA;AAGF,EAAAc,EAAU,MAAM;AAEd,IAAIa,KAAoBzC,KAASC,KAAU,CAACsC,OASlB,YAAY;AAClC,UAAI;AAEF,cAAM,EAAE,0BAAAmB,EAAA,IAA6B,MAAM,OAAO,qCAAiB,GAC7DC,IAAc,KAAK,MAAM,KAAK,IAAA,IAAQ,GAAI,GAC1CC,IAAO,GAAG5D,CAAK,qBAAqBC,CAAM,IAC1C4D,IAAM,GAAGH,CAAwB,IAAIE,CAAI,mBAAmBD,CAAW,IAEvEG,IAAO,MAAM,MAAMD,CAAG;AAC5B,YAAIC,EAAK,IAAI;AACX,gBAAMC,IAAO,MAAMD,EAAK,KAAA;AAIxB,UAAAL,EAAkB,CAACO,MACbD,MAASC,KACX/C,EAAO,MAAM,+BAA+B,GACrC+C,MAET/C,EAAO;AAAA,YACL;AAAA,UAAA,GAEK8C,EACR;AAAA,QACH;AAAA,MACF,SAAStE,GAAG;AACV,QAAAwB,EAAO,KAAK,qDAAqDxB,CAAC;AAAA,MACpE;AAAA,IACF,GAEA,IAGAgE,EAAkB3C,CAAa;AAAA,EAEnC,GAAG,CAACA,GAAe2B,GAAkBzC,GAAOC,GAAQ+B,CAAS,CAAC;AAG9D,QAAMiC,KAAyBxB,IAC3Be,KACA1C;AAEJ,EAAAG,EAAO,MAAM,oBAAoB;AAAA,IAC/B,SAAS,CAAC,CAACsC,GAAU;AAAA,IACrB,UAAU,OAAOA,GAAU;AAAA,EAAA,CAC5B;AAID,QAAMW,KAAUC,GAAQ,MAAM;AAC5B,QAAIC,IAAab,EAAS,MAAM;AAChC,WAAAtC,EAAO,MAAM,oBAAoB;AAAA,MAC/B,eAAe,CAAC,CAACmD;AAAA,MACjB,gBAAgB,OAAO,KAAKA,KAAc,CAAA,CAAE,EAAE;AAAA,IAAA,CAC/C,GAGGA,KACFC,GAAcD,CAAU,GAGnB;AAAA,MACL,UAAU;AAAA;AAAA;AAAA,MAGV,mBAAmB7D;AAAA;AAAA,MAEnB,eAAeA;AAAA;AAAA,MAEf,UAAUA;AAAA;AAAA,MAEV,YAAYS;AAAA,IAAA;AAAA,EAEhB,GAAG,CAACuC,EAAS,MAAM,YAAYhD,GAAMS,CAAM,CAAC,GAGtCsD,KAAiCC;AAAA,IACrC9D;AAAA,EAAA;AA8CF,SA1CAmB,EAAU,MAAM;AACd,QAAIlB,GAAa;AACf,YAAM8D,IAAqBtD,EAAe,SAAA,EAAW;AACrD,aAAO,QAAQR,CAAW,EAAE,QAAQ,CAAC,CAAC+D,GAAWC,CAAW,MAAM;AAChE,QAAAF,EAAmBC,GAAWC,CAAW;AAAA,MAC3C,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAChE,CAAW,CAAC,GAGhBkB,EAAU,MAAM;AACd,QAAI,CAACxB,EAAc;AACnB,UAAMyB,IAAUJ,EAAa;AAC7B,QAAI,CAACI,EAAS;AACd,UAAMC,IAAS,CAAC6C,MAA+B;AAC7C,YAAMC,IAAKD,EAAM;AACjB,MAAAvE,EAAa,EAAE,OAAOwE,EAAG,OAAO,QAAQA,EAAG,QAAQ;AAAA,IACrD,GACM7C,IAAW,IAAI,eAAe,CAAC8C,MAAY;AAC/C,iBAAWF,KAASE;AAClB,QAAA/C,EAAO6C,CAAK;AAAA,IAEhB,CAAC,GAEKG,IAAOjD,EAAQ,sBAAA;AACrB,WAAAzB,EAAa,EAAE,OAAO0E,EAAK,OAAO,QAAQA,EAAK,QAAQ,GACvD/C,EAAS,QAAQF,CAAO,GACjB,MAAM;AACX,MAAAE,EAAS,WAAA;AAAA,IACX;AAAA,EACF,GAAG,CAAC3B,CAAY,CAAC,GAGjBwB,EAAU,MAAM;AACd,QAAKpB;AACL,aAAAW,EAAqBX,MAAW,UAAU,UAAU,QAAQ,GACrD,MAAM;AAEX,QAAAW,EAAqB,IAAI;AAAA,MAC3B;AAAA,EACF,GAAG,CAACX,CAAM,CAAC,GAENP,IA4BH,gBAAAT;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKiC;AAAA,MACL,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,UAAU;AAAA,MAAA;AAAA,MAGZ,UAAA,gBAAAjC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKmC;AAAA,UACL,OAAO;AAAA,YACL,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAe;AAAA,UAAA;AAAA,UAGjB,4BAACoD,IAAA,EAAS,UAAU5E,KAAY,gBAAAX,EAAC,SAAI,GACnC,UAAA,gBAAAA;AAAA,YAACwF;AAAA,YAAA;AAAA,cACC,aAAA9E;AAAA,cACA,UAAAI;AAAA,cACA,gCAAAgE;AAAA,cACA,qBAAqBJ;AAAA,cAErB,UAAA,gBAAA1E;AAAA,gBAACyF;AAAA,gBAAA;AAAA,kBACC,MAAM,GAAGjF,CAAK,qBAAqBC,CAAM;AAAA,kBACzC,UAAAE;AAAA,kBACA,WAAA6B;AAAA,kBACA,eAAeiC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACjB;AAAA,UAAA,EACF,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA,IA3DA,gBAAAzE,EAAC,OAAA,EAAI,OAAO,EAAE,SAAS,OAAA,GACrB,UAAA,gBAAAA,EAAC,OAAA,EAAI,OAAO,EAAE,WAAW,UACrB,WAAA+C,EAAA;AAAA;AAAA,KAEIS,GAAK,MAAc,KAAK,MAAM,SAAS,CAAA,GAAI;AAAA,MAC3C,CAACkC,MAAYA,GAAI;AAAA,IAAA;AAAA,MAEnBlC,GAAK,MAAM,IAAI,WAAW,CAAA,GAC5B,IAAI,CAACmC,MACL,gBAAA3F;AAAA,IAACP;AAAA,IAAA;AAAA,MAEC,IAAI,SAASe,CAAK,UAAUmF,CAAC,eAAe/D,CAAU;AAAA,MACtD,OAAO;AAAA,QACL,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAc;AAAA,MAAA;AAAA,MAGf,UAAA+D;AAAA,IAAA;AAAA,IARIA;AAAA,EAAA,CAUR,GACH,EAAA,CACF;AAwCN;"}

package/dist/src/components/EncoreApp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EncoreApp.d.ts","sourceRoot":"","sources":["../../../src/components/EncoreApp.tsx"],"names":[],"mappings":"AAIA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AA4B3E;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,wFAAwF;IACxF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,qDAAqD;IACrD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACjE,wEAAwE;IACxE,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACxE,oGAAoG;IACpG,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAClE,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,EAAE,CAAC,CAAC;IAC/C,sEAAsE;IACtE,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC5B,qFAAqF;IACrF,0BAA0B,CAAC,EAAE,MAAM,CACjC,MAAM,EACN;QAAE,YAAY,CAAC,EAAE,MAAM,CAAC;QAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,CACnE,CAAC;IACF,2FAA2F;IAC3F,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,6FAA6F;IAC7F,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,YAAY,CAAC;IAC/C,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;CAC1C,CAAC;AAEF,KAAK,KAAK,GAAG,cAAc,CAAC;AAe5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,QAAA,MAAM,SAAS,GAAI,oNAkBhB,KAAK,4CAwWP,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"EncoreApp.d.ts","sourceRoot":"","sources":["../../../src/components/EncoreApp.tsx"],"names":[],"mappings":"AAIA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AA4B3E;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,wFAAwF;IACxF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,qDAAqD;IACrD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACjE,wEAAwE;IACxE,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACxE,oGAAoG;IACpG,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAClE,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,EAAE,CAAC,CAAC;IAC/C,sEAAsE;IACtE,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC5B,qFAAqF;IACrF,0BAA0B,CAAC,EAAE,MAAM,CACjC,MAAM,EACN;QAAE,YAAY,CAAC,EAAE,MAAM,CAAC;QAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,CACnE,CAAC;IACF,2FAA2F;IAC3F,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,6FAA6F;IAC7F,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,YAAY,CAAC;IAC/C,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;CAC1C,CAAC;AAEF,KAAK,KAAK,GAAG,cAAc,CAAC;AAe5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,QAAA,MAAM,SAAS,GAAI,oNAkBhB,KAAK,4CAgXP,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/src/version.d.ts

@@ -1,2 +1,2 @@
-export declare const PACKAGE_VERSION = "0.1.47";
+export declare const PACKAGE_VERSION = "0.1.48";
 //# sourceMappingURL=version.d.ts.map

package/dist/version.js

@@ -1,4 +1,4 @@
-const o = "0.1.47";
+const o = "0.1.48";
 export {
   o as PACKAGE_VERSION
 };

package/dist/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["export const PACKAGE_VERSION = \"0.1.47\";\n"],"names":["PACKAGE_VERSION"],"mappings":"AAAO,MAAMA,IAAkB;"}
+{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["export const PACKAGE_VERSION = \"0.1.48\";\n"],"names":["PACKAGE_VERSION"],"mappings":"AAAO,MAAMA,IAAkB;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bravostudioai/react",
-  "version": "0.1.47",
+  "version": "0.1.48",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/src/index.d.ts",

package/src/components/EncoreApp.tsx

@@ -207,14 +207,6 @@ const EncoreApp = ({
     setReloadKey((prev) => (typeof prev === "number" ? prev + 1 : Date.now()));
   }, []);
 
-  // Only enable Pusher in remote mode - it doesn't make sense in local mode
-  usePusherUpdates({
-    appId,
-    pageId: pageId || undefined,
-    enabled: !isLocalMode() && !appDefinition,
-    onUpdate: handleUpdate,
-  });
-
   const useLocalFlag = source === "local" || isLocalMode();
 
   // Determine if we should fetch app definition
@@ -235,6 +227,14 @@ const EncoreApp = ({
   // Default to dynamic if not specified
   const isDynamicMode = !isProductionMode && !isOptimisticMode;
 
+  // Only enable Pusher in remote mode - it doesn't make sense in local mode
+  usePusherUpdates({
+    appId,
+    pageId: pageId || undefined,
+    enabled: isOptimisticMode || (!isLocalMode() && !appDefinition),
+    onUpdate: handleUpdate,
+  });
+
   const shouldFetchApp = !isProductionMode && appId;
   const appUrl = shouldFetchApp
     ? `/devices/apps/${appId}${useLocalFlag ? "?useLocal=1" : ""}`
@@ -281,7 +281,7 @@ const EncoreApp = ({
             });
           }
           return Promise.resolve();
-        })
+        }),
       );
     })();
   }, [assetsById]);
@@ -316,7 +316,7 @@ const EncoreApp = ({
   // We want: render with initial componentCode, BUT ALSO fetch new code, and when valid, switch to it.
 
   const [optimisticCode, setOptimisticCode] = useState<string | undefined>(
-    componentCode
+    componentCode,
   );
 
   useEffect(() => {
@@ -341,11 +341,19 @@ const EncoreApp = ({
           const resp = await fetch(url);
           if (resp.ok) {
             const text = await resp.text();
-            // Only update if different?
-            // Comparing huge strings might be expensive, but React state update checks equality anyway (ref).
-            // Let's just set it.
-            setOptimisticCode(text);
-            logger.debug("Refreshed optimistic component code");
+            // Check if code is different from what we have (either bundled or previously fetched)
+            // Use strict equality as strings are primitives.
+            // If the server returns identical code, we skip the update to avoid re-rendering.
+            setOptimisticCode((currentCode) => {
+              if (text === currentCode) {
+                logger.debug("Optimistic code is up to date");
+                return currentCode;
+              }
+              logger.debug(
+                "Refreshed optimistic component code (new version found)",
+              );
+              return text;
+            });
           }
         } catch (e) {
           logger.warn("Failed to background refresh optimistic component", e);
@@ -357,7 +365,7 @@ const EncoreApp = ({
       // If prop changes (e.g. from HMR or parent), sync it
       setOptimisticCode(componentCode);
     }
-  }, [componentCode, isOptimisticMode, appId, pageId]);
+  }, [componentCode, isOptimisticMode, appId, pageId, reloadKey]);
 
   // Use the calculated optimistic code or the passed prop depending on mode
   const effectiveComponentCode = isOptimisticMode
@@ -399,7 +407,7 @@ const EncoreApp = ({
 
   // Manage repeating container controls (sliders, lists)
   const repeatingContainerContextValue = useRepeatingContainers(
-    repeatingContainerControls
+    repeatingContainerControls,
   );
 
   // Sync input groups from props to store
@@ -452,7 +460,7 @@ const EncoreApp = ({
           {(isLocalMode()
             ? // Local mode: app.json provides pages under app.data.pages
               ((app?.data as any)?.app?.data?.pages || []).map(
-                (pg: any) => pg?.id
+                (pg: any) => pg?.id,
               )
             : app?.data?.app.pageIds || []
           ).map((p: string) => (

package/src/version.ts

@@ -1 +1 @@
-export const PACKAGE_VERSION = "0.1.47";
+export const PACKAGE_VERSION = "0.1.48";