@weaverse/next 0.1.0-alpha.8 → 0.1.0-alpha.9

package/dist/index.d.mts

@@ -1,8 +1,8 @@
-import { Weaverse } from '@weaverse/react';
+import { WeaverseItemStore, Weaverse, ElementData } from '@weaverse/react';
 export { isBrowser, isIframe, useChildInstances, useItemInstance, useParentInstance, useWeaverse } from '@weaverse/react';
 export { InspectorGroup, PageType, SchemaType, createSchema } from '@weaverse/schema';
-import { h as WeaverseNextClientConfig, g as WeaverseNextClient, i as WeaverseNextCommerceContext, x as WeaverseNextRequestContext, t as WeaverseNextLoaderData, a as TranslationStore, y as WeaverseNextRequestInfo, k as WeaverseNextComponentData, I as WeaverseNextThemeSettingsStore, A as WeaverseNextRuntimeInternal, M as WeaverseNextTranslationMap, z as WeaverseNextRuntimeConfig, J as WeaverseNextTranslationChanges, v as WeaverseNextPageData } from './seo-CpN6tC36.mjs';
-export { T as ThemeTextStore, W as WeaverseArticle, b as WeaverseBlog, c as WeaverseCollection, d as WeaverseMetaObject, j as WeaverseNextComponent, l as WeaverseNextComponentLoaderArgs, m as WeaverseNextComponentProps, o as WeaverseNextCustomPageEntry, p as WeaverseNextFetchCustomPagesOptions, r as WeaverseNextI18n, s as WeaverseNextLoadPageInput, u as WeaverseNextPageAssignment, B as WeaverseNextSeoMetadata, F as WeaverseNextStorefront, K as WeaverseNextTranslationEntry, L as WeaverseNextTranslationItemEntry, N as WeaverseNextTranslationMapEntry, O as WeaverseProduct, P as formatWeaverseNextSeoMetadata, Q as getWeaverseNextSeoMetadata } from './seo-CpN6tC36.mjs';
+import { h as WeaverseNextClientConfig, g as WeaverseNextClient, i as WeaverseNextCommerceContext, x as WeaverseNextRequestContext, t as WeaverseNextLoaderData, a as TranslationStore, y as WeaverseNextRequestInfo, k as WeaverseNextComponentData, I as WeaverseNextThemeSettingsStore, A as WeaverseNextRuntimeInternal, M as WeaverseNextTranslationMap, v as WeaverseNextPageData, z as WeaverseNextRuntimeConfig, J as WeaverseNextTranslationChanges } from './seo-Dos9t22_.mjs';
+export { T as ThemeTextStore, W as WeaverseArticle, b as WeaverseBlog, c as WeaverseCollection, d as WeaverseMetaObject, j as WeaverseNextComponent, l as WeaverseNextComponentLoaderArgs, m as WeaverseNextComponentProps, o as WeaverseNextCustomPageEntry, p as WeaverseNextFetchCustomPagesOptions, r as WeaverseNextI18n, s as WeaverseNextLoadPageInput, u as WeaverseNextPageAssignment, B as WeaverseNextSeoMetadata, F as WeaverseNextStorefront, K as WeaverseNextTranslationEntry, L as WeaverseNextTranslationItemEntry, N as WeaverseNextTranslationMapEntry, O as WeaverseProduct, P as formatWeaverseNextSeoMetadata, Q as getWeaverseNextSeoMetadata } from './seo-Dos9t22_.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode } from 'react';
@@ -331,6 +331,43 @@ interface WeaverseNextRootProviderProps {
  */
 declare function WeaverseNextRootProvider(props: WeaverseNextRootProviderProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * Item store that flattens the serialized item's nested `data` field onto the
+ * store and seeds schema defaults — same shape Hydrogen produces, so the
+ * shared `@weaverse/react` renderer can spread props at the top level.
+ */
+declare class WeaverseNextItem extends WeaverseItemStore {
+    weaverse: WeaverseNextRuntime;
+    /**
+     * Cached merged snapshot (base `_store` + translations). Reset whenever the
+     * `_store` ref or the item's translation entry ref changes, so
+     * `useSyncExternalStore` sees a stable object between unrelated re-renders.
+     */
+    private _cachedSnapshot;
+    private _snapshotStoreRef;
+    private _snapshotTranslationRef;
+    constructor(initialData: WeaverseNextComponentData, weaverse: Weaverse);
+    /**
+     * Flatten nested `data` on updates exactly like the constructor does. Core's
+     * `initProject()` calls `setData(item)` when a new runtime serves a page
+     * whose item instances already exist (e.g. locale/client navigation), and
+     * the inherited shallow merge would leave stale top-level props behind.
+     * Assigning through the inherited `data` setter swaps the `_store` ref,
+     * which invalidates the memoized snapshot below. The subscriber emit is
+     * queued instead of fired when a render-phase deferral is active (see
+     * `collectDeferredItemUpdates`).
+     */
+    setData: (update: Omit<ElementData, "id" | "type">) => ElementData;
+    /**
+     * Overlay item-level translations onto the base store when the runtime is in
+     * translation mode. Mirrors Hydrogen's `WeaverseHydrogenItem.getSnapShot()`:
+     * memoized by `_store` ref + translation entry ref so the returned object is
+     * referentially stable, and a fast path that returns the base store untouched
+     * when the item has no translations.
+     */
+    getSnapShot: () => ElementData;
+}
+
 declare global {
     interface Window {
         __weaverse?: WeaverseNextRuntime;
@@ -352,6 +389,24 @@ declare class WeaverseNextRuntime extends Weaverse {
     translationMap: WeaverseNextTranslationMap;
     translationLocale: string;
     translationLanguageId: string;
+    /**
+     * Fresh page data captured while React was rendering. Runtime reuse happens
+     * inside the renderer's render phase (`useMemo`), where applying it through
+     * `setProjectData()` would emit item updates to `useSyncExternalStore`
+     * subscribers mid-render. The renderer applies it post-commit via
+     * `flushRenderPhaseUpdates()`. Never set on design-mode runtimes — the live
+     * Studio tree owns the page data there.
+     */
+    pendingProjectData?: WeaverseNextPageData & {
+        rootId: string;
+    };
+    /**
+     * Reused item instances whose data was refreshed while this runtime was
+     * constructed during render (core `initProject()` calls `setData()` on
+     * them). Their data is already fresh; only the subscriber notification was
+     * deferred to `flushRenderPhaseUpdates()`.
+     */
+    pendingItemUpdates: WeaverseNextItem[];
     constructor(config: WeaverseNextRuntimeConfig);
     /**
      * Pull `translationMap` / `translationLocale` / `translationLanguageId` off
@@ -388,6 +443,14 @@ declare class WeaverseNextRuntime extends Weaverse {
     setProjectData: (data: WeaverseNextPageData & {
         rootId: string;
     }) => void;
+    /**
+     * Apply updates deferred off the render phase: swap in any pending page data
+     * captured on runtime reuse, then notify items whose data was refreshed
+     * during construction. The renderer calls this from a layout effect right
+     * after commit, so subscribers re-render before paint (no content flash) and
+     * without React's setState-in-render warning.
+     */
+    flushRenderPhaseUpdates: () => void;
 }
 declare function createWeaverseNextRuntime(config: WeaverseNextRuntimeConfig): WeaverseNextRuntime;
 declare function bindWeaverseNextStudioRuntime(runtime: WeaverseNextRuntime): boolean;

package/dist/index.d.ts

@@ -1,8 +1,8 @@
-import { Weaverse } from '@weaverse/react';
+import { WeaverseItemStore, Weaverse, ElementData } from '@weaverse/react';
 export { isBrowser, isIframe, useChildInstances, useItemInstance, useParentInstance, useWeaverse } from '@weaverse/react';
 export { InspectorGroup, PageType, SchemaType, createSchema } from '@weaverse/schema';
-import { h as WeaverseNextClientConfig, g as WeaverseNextClient, i as WeaverseNextCommerceContext, x as WeaverseNextRequestContext, t as WeaverseNextLoaderData, a as TranslationStore, y as WeaverseNextRequestInfo, k as WeaverseNextComponentData, I as WeaverseNextThemeSettingsStore, A as WeaverseNextRuntimeInternal, M as WeaverseNextTranslationMap, z as WeaverseNextRuntimeConfig, J as WeaverseNextTranslationChanges, v as WeaverseNextPageData } from './seo-CpN6tC36.js';
-export { T as ThemeTextStore, W as WeaverseArticle, b as WeaverseBlog, c as WeaverseCollection, d as WeaverseMetaObject, j as WeaverseNextComponent, l as WeaverseNextComponentLoaderArgs, m as WeaverseNextComponentProps, o as WeaverseNextCustomPageEntry, p as WeaverseNextFetchCustomPagesOptions, r as WeaverseNextI18n, s as WeaverseNextLoadPageInput, u as WeaverseNextPageAssignment, B as WeaverseNextSeoMetadata, F as WeaverseNextStorefront, K as WeaverseNextTranslationEntry, L as WeaverseNextTranslationItemEntry, N as WeaverseNextTranslationMapEntry, O as WeaverseProduct, P as formatWeaverseNextSeoMetadata, Q as getWeaverseNextSeoMetadata } from './seo-CpN6tC36.js';
+import { h as WeaverseNextClientConfig, g as WeaverseNextClient, i as WeaverseNextCommerceContext, x as WeaverseNextRequestContext, t as WeaverseNextLoaderData, a as TranslationStore, y as WeaverseNextRequestInfo, k as WeaverseNextComponentData, I as WeaverseNextThemeSettingsStore, A as WeaverseNextRuntimeInternal, M as WeaverseNextTranslationMap, v as WeaverseNextPageData, z as WeaverseNextRuntimeConfig, J as WeaverseNextTranslationChanges } from './seo-Dos9t22_.js';
+export { T as ThemeTextStore, W as WeaverseArticle, b as WeaverseBlog, c as WeaverseCollection, d as WeaverseMetaObject, j as WeaverseNextComponent, l as WeaverseNextComponentLoaderArgs, m as WeaverseNextComponentProps, o as WeaverseNextCustomPageEntry, p as WeaverseNextFetchCustomPagesOptions, r as WeaverseNextI18n, s as WeaverseNextLoadPageInput, u as WeaverseNextPageAssignment, B as WeaverseNextSeoMetadata, F as WeaverseNextStorefront, K as WeaverseNextTranslationEntry, L as WeaverseNextTranslationItemEntry, N as WeaverseNextTranslationMapEntry, O as WeaverseProduct, P as formatWeaverseNextSeoMetadata, Q as getWeaverseNextSeoMetadata } from './seo-Dos9t22_.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode } from 'react';
@@ -331,6 +331,43 @@ interface WeaverseNextRootProviderProps {
  */
 declare function WeaverseNextRootProvider(props: WeaverseNextRootProviderProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * Item store that flattens the serialized item's nested `data` field onto the
+ * store and seeds schema defaults — same shape Hydrogen produces, so the
+ * shared `@weaverse/react` renderer can spread props at the top level.
+ */
+declare class WeaverseNextItem extends WeaverseItemStore {
+    weaverse: WeaverseNextRuntime;
+    /**
+     * Cached merged snapshot (base `_store` + translations). Reset whenever the
+     * `_store` ref or the item's translation entry ref changes, so
+     * `useSyncExternalStore` sees a stable object between unrelated re-renders.
+     */
+    private _cachedSnapshot;
+    private _snapshotStoreRef;
+    private _snapshotTranslationRef;
+    constructor(initialData: WeaverseNextComponentData, weaverse: Weaverse);
+    /**
+     * Flatten nested `data` on updates exactly like the constructor does. Core's
+     * `initProject()` calls `setData(item)` when a new runtime serves a page
+     * whose item instances already exist (e.g. locale/client navigation), and
+     * the inherited shallow merge would leave stale top-level props behind.
+     * Assigning through the inherited `data` setter swaps the `_store` ref,
+     * which invalidates the memoized snapshot below. The subscriber emit is
+     * queued instead of fired when a render-phase deferral is active (see
+     * `collectDeferredItemUpdates`).
+     */
+    setData: (update: Omit<ElementData, "id" | "type">) => ElementData;
+    /**
+     * Overlay item-level translations onto the base store when the runtime is in
+     * translation mode. Mirrors Hydrogen's `WeaverseHydrogenItem.getSnapShot()`:
+     * memoized by `_store` ref + translation entry ref so the returned object is
+     * referentially stable, and a fast path that returns the base store untouched
+     * when the item has no translations.
+     */
+    getSnapShot: () => ElementData;
+}
+
 declare global {
     interface Window {
         __weaverse?: WeaverseNextRuntime;
@@ -352,6 +389,24 @@ declare class WeaverseNextRuntime extends Weaverse {
     translationMap: WeaverseNextTranslationMap;
     translationLocale: string;
     translationLanguageId: string;
+    /**
+     * Fresh page data captured while React was rendering. Runtime reuse happens
+     * inside the renderer's render phase (`useMemo`), where applying it through
+     * `setProjectData()` would emit item updates to `useSyncExternalStore`
+     * subscribers mid-render. The renderer applies it post-commit via
+     * `flushRenderPhaseUpdates()`. Never set on design-mode runtimes — the live
+     * Studio tree owns the page data there.
+     */
+    pendingProjectData?: WeaverseNextPageData & {
+        rootId: string;
+    };
+    /**
+     * Reused item instances whose data was refreshed while this runtime was
+     * constructed during render (core `initProject()` calls `setData()` on
+     * them). Their data is already fresh; only the subscriber notification was
+     * deferred to `flushRenderPhaseUpdates()`.
+     */
+    pendingItemUpdates: WeaverseNextItem[];
     constructor(config: WeaverseNextRuntimeConfig);
     /**
      * Pull `translationMap` / `translationLocale` / `translationLanguageId` off
@@ -388,6 +443,14 @@ declare class WeaverseNextRuntime extends Weaverse {
     setProjectData: (data: WeaverseNextPageData & {
         rootId: string;
     }) => void;
+    /**
+     * Apply updates deferred off the render phase: swap in any pending page data
+     * captured on runtime reuse, then notify items whose data was refreshed
+     * during construction. The renderer calls this from a layout effect right
+     * after commit, so subscribers re-render before paint (no content flash) and
+     * without React's setState-in-render warning.
+     */
+    flushRenderPhaseUpdates: () => void;
 }
 declare function createWeaverseNextRuntime(config: WeaverseNextRuntimeConfig): WeaverseNextRuntime;
 declare function bindWeaverseNextStudioRuntime(runtime: WeaverseNextRuntime): boolean;

package/dist/index.js

@@ -27,6 +27,24 @@ function generateDataFromSchema(schema) {
 }
 
 // src/item.ts
+function flattenItemData(update) {
+  let { data, ...rest } = update;
+  if (!(data && typeof data === "object" && !Array.isArray(data))) {
+    return rest;
+  }
+  return { ...data, ...rest };
+}
+var deferredItemUpdates = null;
+function collectDeferredItemUpdates(create) {
+  let previousQueue = deferredItemUpdates;
+  let queue = /* @__PURE__ */ new Set();
+  deferredItemUpdates = queue;
+  try {
+    return [create(), [...queue]];
+  } finally {
+    deferredItemUpdates = previousQueue;
+  }
+}
 var WeaverseNextItem = class extends react.WeaverseItemStore {
   /**
    * Cached merged snapshot (base `_store` + translations). Reset whenever the
@@ -38,10 +56,28 @@ var WeaverseNextItem = class extends react.WeaverseItemStore {
   _snapshotTranslationRef = null;
   constructor(initialData, weaverse) {
     super(initialData, weaverse);
-    let { data, ...rest } = initialData;
     let schemaData = generateDataFromSchema(this.Element?.schema);
-    Object.assign(this._store, schemaData, data, rest);
+    Object.assign(this._store, schemaData, flattenItemData(initialData));
   }
+  /**
+   * Flatten nested `data` on updates exactly like the constructor does. Core's
+   * `initProject()` calls `setData(item)` when a new runtime serves a page
+   * whose item instances already exist (e.g. locale/client navigation), and
+   * the inherited shallow merge would leave stale top-level props behind.
+   * Assigning through the inherited `data` setter swaps the `_store` ref,
+   * which invalidates the memoized snapshot below. The subscriber emit is
+   * queued instead of fired when a render-phase deferral is active (see
+   * `collectDeferredItemUpdates`).
+   */
+  setData = (update) => {
+    this.data = flattenItemData(update);
+    if (deferredItemUpdates) {
+      deferredItemUpdates.add(this);
+    } else {
+      this.triggerUpdate();
+    }
+    return this.data;
+  };
   /**
    * Overlay item-level translations onto the base store when the runtime is in
    * translation mode. Mirrors Hydrogen's `WeaverseHydrogenItem.getSnapShot()`:
@@ -681,6 +717,22 @@ var WeaverseNextRuntime = class extends react.Weaverse {
   translationMap = {};
   translationLocale = String();
   translationLanguageId = String();
+  /**
+   * Fresh page data captured while React was rendering. Runtime reuse happens
+   * inside the renderer's render phase (`useMemo`), where applying it through
+   * `setProjectData()` would emit item updates to `useSyncExternalStore`
+   * subscribers mid-render. The renderer applies it post-commit via
+   * `flushRenderPhaseUpdates()`. Never set on design-mode runtimes — the live
+   * Studio tree owns the page data there.
+   */
+  pendingProjectData;
+  /**
+   * Reused item instances whose data was refreshed while this runtime was
+   * constructed during render (core `initProject()` calls `setData()` on
+   * them). Their data is already fresh; only the subscriber notification was
+   * deferred to `flushRenderPhaseUpdates()`.
+   */
+  pendingItemUpdates = [];
   constructor(config) {
     let { client, data } = config;
     let page = getRenderablePage(data);
@@ -804,6 +856,27 @@ var WeaverseNextRuntime = class extends react.Weaverse {
     this.extractTranslationSidecar();
     this.initProject();
   };
+  /**
+   * Apply updates deferred off the render phase: swap in any pending page data
+   * captured on runtime reuse, then notify items whose data was refreshed
+   * during construction. The renderer calls this from a layout effect right
+   * after commit, so subscribers re-render before paint (no content flash) and
+   * without React's setState-in-render warning.
+   */
+  flushRenderPhaseUpdates = () => {
+    let pendingData = this.pendingProjectData;
+    if (pendingData) {
+      this.pendingProjectData = void 0;
+      this.setProjectData(pendingData);
+    }
+    let pendingItems = this.pendingItemUpdates;
+    if (pendingItems.length > 0) {
+      this.pendingItemUpdates = [];
+      for (let item of pendingItems) {
+        item.triggerUpdate();
+      }
+    }
+  };
 };
 function createWeaverseNextRuntime(config) {
   let requestInfo = buildWeaverseNextRequestInfo(config.client?.requestContext);
@@ -813,8 +886,10 @@ function createWeaverseNextRuntime(config) {
   let requestKey = getRuntimeKey(page.id, requestInfo);
   if (existing?.__weaverseNextRequestKey === requestKey) {
     let nextIsDesignMode = config.client?.requestContext?.isDesignMode ?? false;
-    if (!(existing.isDesignMode || nextIsDesignMode)) {
-      existing.setProjectData(page);
+    if (existing.isDesignMode || nextIsDesignMode) {
+      existing.pendingProjectData = void 0;
+    } else {
+      existing.pendingProjectData = page;
     }
     existing.__weaverseNextLatestData = page;
     existing.dataContext = resolveDataContext(config);
@@ -845,7 +920,10 @@ function createWeaverseNextRuntime(config) {
     registerRuntime(existing);
     return existing;
   }
-  let runtime = new WeaverseNextRuntime(config);
+  let [runtime, refreshedItems] = collectDeferredItemUpdates(
+    () => new WeaverseNextRuntime(config)
+  );
+  runtime.pendingItemUpdates = refreshedItems;
   runtime.__weaverseNextRequestKey = requestKey;
   runtime.__weaverseNextLatestData = page;
   registerRuntime(runtime);
@@ -998,6 +1076,7 @@ function WeaverseNextStudio(props) {
   );
 }
 var EMPTY_DATA_CONTEXT = {};
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? react$1.useEffect : react$1.useLayoutEffect;
 function getRenderablePage2(data) {
   let page = data?.page;
   if (!page) {
@@ -1033,6 +1112,9 @@ var WeaverseNextRenderer = react$1.memo(function WeaverseNextRendererComponent(p
     context?.themeSettingsStore,
     context?.translationStore
   ]);
+  useIsomorphicLayoutEffect(() => {
+    weaverse?.flushRenderPhaseUpdates();
+  }, [weaverse]);
   if (!weaverse) {
     return null;
   }