@fragmentsx/runtime-react 0.2.0-dev-20260922090625 → 0.2.0-dev-20260928114300

package/README.md

@@ -60,8 +60,9 @@ function App() {
 не передан, клиент бьётся в `window.location.origin`, что удобно при
 same-origin проксировании `/api` на публичный API площадки.
 
-`Area` сама разрешает область и внутри себя обёрнута в `Suspense` — пока
-манифест грузится, поддерево пустое. Под капотом:
+`Area` разрешает область в non-Suspense режиме; `Suspense` остаётся только
+вокруг загрузки модулей конуса. На сервере область не резолвится, не требует
+подключённого `$area` plugin и вместо области отдаёт `options.fallback`. Под капотом:
 
 ```
 <Area areaCode> → GET <backendEndpoint>/api/area/<code>/compiled
@@ -79,10 +80,12 @@ import { FragmentRenderer } from '@fragmentsx/runtime-react';
 <FragmentRenderer fragmentId={42} props={{ title: 'Привет' }} />
 ```
 
-`AreaProps` — `{ areaCode: string; options?: { timeout?, pause?, ssr? } }`.
+`AreaProps` — `{ areaCode: string; options?: { timeout?, pause?, ssr? (зарезервирована), props?, fallback?, onError?, empty? } }`.
 `FragmentRendererProps` — `{ fragmentId: number; props?; globalCssUrl?;
 projectProperties?; onError? }`.
 
+`options.fallback` показывает узел, пока область или модули загружаются; `options.empty` — когда контента не будет. `empty` принимает React-узел либо функцию `(reason, retry) => ReactNode`: `reason.kind` бывает `no-variant`, `misconfigured` или `failed`, а `retry` доступен только функциональной форме и намеренно не троттлится. `reason` предназначен для ветвления и диагностики, а не для готового к показу текста: `reason.error` и его код — внутренняя диагностика Fragments, решение об их отображении принимает площадка.
+
 ## Обработка ошибок
 
 Пакет реэкспортирует типизированные ошибки транспорта, чтобы их можно было

package/dist/index.d.ts

@@ -1,7 +1,9 @@
+import { AreaSourceTransport } from '@fragmentsx/fragments-client';
 import { ComponentType } from 'react';
 import { Context } from 'react';
 import { createFragmentsClient } from '@fragmentsx/fragments-client';
 import { CreateFragmentsClientOptions } from '@fragmentsx/fragments-client';
+import { createSourceCache } from '@fragmentsx/fragments-client';
 import { FC } from 'react';
 import { FragmentsApiVersionError } from '@fragmentsx/fragments-client';
 import { FragmentsAreaError } from '@fragmentsx/fragments-client';
@@ -10,6 +12,13 @@ import { GraphState } from '@graph-state/core';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { ResolvedSlotPosition } from '@fragmentsx/fragments-client';
+import { SourceCache } from '@fragmentsx/fragments-client';
+import { SourceCacheEntry } from '@fragmentsx/fragments-client';
+import { SourceCall } from '@fragmentsx/fragments-client';
+import { SourceOrigin } from '@fragmentsx/fragments-client';
+import { SourcePendingEntry } from '@fragmentsx/fragments-client';
+import { SourceReadyEntry } from '@fragmentsx/fragments-client';
+import { SourceRun } from '@fragmentsx/fragments-client';
 
 /**
  * Area — публичный компонент для рендеринга compiled fragment в consumer app.
@@ -21,8 +30,8 @@ export declare const Area: FC<AreaProps>;
 
 /**
  * Сентинел нерезолвленной области — возвращается вместо чтения `$area.read`,
- * когда на сервере `options.ssr === false`, либо когда `options.pause === true`
- * (suspense-режим).
+ * когда на сервере `options.ssr === false`, при терминальной ошибке серверного
+ * suspense-чтения (D-110-04), либо когда `options.pause === true`.
  *
  * Совместим с `UseAreaResult` по форме (тип возврата хука не расширяется),
  * поэтому правка остаётся minor: потребитель, передающий `rootFragmentId`
@@ -31,22 +40,38 @@ export declare const Area: FC<AreaProps>;
  */
 export declare const AREA_UNRESOLVED: UseAreaResult;
 
+/** ФБ-04: static or contextual replacement content for a terminal Area outcome. */
+export declare type AreaEmpty = ReactNode | ((reason: AreaEmptyReason, retry: () => void) => ReactNode);
+
+/** D-110-01: terminal area resolution outcome exposed to the consumer fallback. */
+export declare type AreaEmptyReason = {
+    kind: AreaEmptyReasonKind;
+    code?: string;
+    error: Error;
+};
+
+/** D-110-01/D-110-02: semantic category for a terminal area resolution outcome. */
+export declare type AreaEmptyReasonKind = "no-variant" | "misconfigured" | "failed";
+
 /**
  * Props для Area компонента (D-09, сокращён Phase 73 B-13; расширен quick 260830-rvp):
  *   - areaCode — строковый код области (Area.code в backend schema)
  *   - options.pause — пропустить рендер (conditional skip per legacy contract)
  *   - options.timeout — network timeout для $area.resolve fetch
- *   - options.ssr — отключить auto-resolve в SSR environment (default `true`);
- *     в browser auto-resolve запускается всегда. Параллель к render-react
- *     Area options.ssr.
+ *   - options.ssr — зарезервирована ради совместимости сигнатуры и не влияет
+ *     на resolve: Area всегда отключает серверный resolve (ФБ-06). Рабочая
+ *     опция сохранила бы известную SSR-мину, а тихое игнорирование стало бы
+ *     ловушкой для площадки; удаление требует отдельного решения.
  *   - options.props (INT-03) — объект мержится поверх серверных props (ключи
  *     потребителя выигрывают), функция вызывается с серверными props и её
  *     результат уходит в артефакт целиком. Обе формы поддержаны намеренно —
  *     паритет с legacy render-react, с которого мигрирует потребитель.
  *   - options.fallback (INT-04) — узел, видимый до разрешения области; default
- *     `null` (прежнее поведение).
- *   - options.onError (INT-04) — вызывается при броске внутри поддерева;
- *     default — только dev-лог границы (прежнее поведение).
+ *     `null` (прежнее поведение); в отличие от `empty`, это только загрузка.
+ *   - options.empty (ФБ-01/ФБ-03/ФБ-04) — узел либо функция для терминального
+ *     отсутствия контента; без него область, как и прежде, остаётся пустой.
+ *   - options.onError (INT-04, D-110-06) — вызывается при терминальном resolve
+ *     либо броске внутри поддерева.
  */
 export declare interface AreaProps {
     areaCode: string;
@@ -56,6 +81,7 @@ export declare interface AreaProps {
         ssr?: boolean;
         props?: Record<string, unknown> | ((serverProps: Record<string, unknown>) => Record<string, unknown>);
         fallback?: ReactNode;
+        empty?: AreaEmpty;
         onError?: (error: Error) => void;
     };
 }
@@ -206,6 +232,8 @@ export declare type ConsumerPropsFromSchema<S extends Record<string, SchemaField
  */
 export declare function createBrowserClient(opts: BrowserClientOptions): ReturnType<typeof createFragmentsClient>;
 
+export { createSourceCache }
+
 /**
  * Дефолтное значение, когда Provider не установлен (потребитель вне
  * `FragmentRenderer`, например изолированный юнит-тест компонента).
@@ -315,6 +343,9 @@ export declare interface FragmentRendererProps {
      * правки (дырка рисует пустоту, как и без пропа).
      */
     slots?: Record<string, ResolvedSlotPosition>;
+    sources?: Record<string, AreaSourceTransport>;
+    /** Превью в песочнице не может и не должно ходить к источнику (D-111-22) — `offline` ставит SourceNetworkContext на всё поддерево. */
+    sourceNetwork?: SourceNetworkMode;
     onError?: (error: Error) => void;
 }
 
@@ -490,6 +521,22 @@ declare type ObjectFieldType<F extends SchemaFieldDescriptor, D extends number>
     fields: infer Fields;
 } ? Fields extends Record<string, SchemaFieldDescriptor> ? keyof Fields extends never ? {} : D extends 0 ? ValueOfVariableType<"Object"> : PropsShape<Fields, false, PrevDepth<D>> : {} : {};
 
+declare type Operation<S extends keyof SourceMap & string, O extends keyof SourceMap[S] & string> = SourceMap[S][O] extends {
+    params: infer P;
+    response: infer R;
+} ? {
+    params: P;
+    response: R;
+} : never;
+
+declare type Options<S extends keyof SourceMap & string, O extends keyof SourceMap[S] & string> = Operation<S, O>["params"] extends infer P ? ({} extends P ? {
+    target: O;
+    params?: P;
+} : {
+    target: O;
+    params: P;
+}) : never;
+
 declare type PrevDepth<D extends number> = D extends 0 ? never : DepthCountdown[D];
 
 /**
@@ -598,6 +645,25 @@ declare type Simplify<T> = {
     [K in keyof T]: T[K];
 } & {};
 
+export { SourceCache }
+
+export { SourceCacheEntry }
+
+export { SourceCall }
+
+export declare interface SourceMap {
+}
+
+export declare type SourceNetworkMode = "live" | "offline";
+
+export { SourceOrigin }
+
+export { SourcePendingEntry }
+
+export { SourceReadyEntry }
+
+export { SourceRun }
+
 /**
  * Ref-counted `<link rel="stylesheet">` injector для compiled fragment CSS delivery (Req #11).
  *
@@ -707,6 +773,7 @@ export declare interface UseAreaResult {
      * (`Area`/`FragmentRenderer`) не делает optional-проверку.
      */
     slots: Record<string, ResolvedSlotPosition>;
+    sources: Record<string, AreaSourceTransport>;
 }
 
 /**
@@ -772,6 +839,15 @@ export declare function useFragmentStylesheet(href: string, key: string): void;
 
 export declare function useProjectProperty<K extends keyof ProjectProperties>(name: K): ProjectProperties[K];
 
+export declare type UseSource = <S extends keyof SourceMap & string, O extends keyof SourceMap[S] & string>(source: S, options: Options<S, O>) => UseSourceResult<Operation<S, O>["response"]>;
+
+export declare const useSource: UseSource;
+
+export declare type UseSourceResult<T> = {
+    data: T | undefined;
+    loading: boolean;
+};
+
 /** Носитель типа поля `Node` — читает `value`-проекцию третьей таблицы `NODE_TYPE_TO_TS` (D-97-03: три таблицы, три домена, слияние с `VARIABLE_TYPE_TO_TS` запрещено). */
 declare type ValueOfNodeType = (typeof NODE_TYPE_TO_TS)[typeof NODE_SCHEMA_TYPE]["value"];
 

package/dist/index.es.js

@@ -1,45 +1,49 @@
-import { jsx as a, jsxs as _, Fragment as k } from "react/jsx-runtime";
-import { createContext as v, useContext as f, useMemo as A, useState as L, useEffect as S, useLayoutEffect as b, version as O, Component as B, Suspense as w, createElement as D } from "react";
-import { toScopeClassName as $, AREA_GLOBAL_CSS_KEY as U, resolveStylesHref as V, fragmentCssKey as G, createFragmentsClient as K } from "@fragmentsx/fragments-client";
-import { FragmentsApiVersionError as ve, FragmentsAreaError as Ee, FragmentsLoadError as ge } from "@fragmentsx/fragments-client";
-const E = v(
+import { jsx as d, jsxs as te, Fragment as ne } from "react/jsx-runtime";
+import * as ae from "react";
+import { createContext as A, useContext as v, useMemo as N, useState as w, useEffect as y, useLayoutEffect as se, version as ue, Component as ce, Suspense as K, createElement as le, useCallback as _, useRef as H, useReducer as oe } from "react";
+import { FragmentsAreaError as de, toScopeClassName as ie, AREA_GLOBAL_CSS_KEY as fe, resolveStylesHref as me, fragmentCssKey as he, createSourceCache as Ee, sourceCallKey as j, sourceTransportKey as ve, resolveSourceRequest as ge, runSourceFetch as ye, createFragmentsClient as Se } from "@fragmentsx/fragments-client";
+import { FragmentsApiVersionError as Qe, FragmentsAreaError as We, FragmentsLoadError as Xe, createSourceCache as Ze } from "@fragmentsx/fragments-client";
+const k = A(
   null
 );
-E.displayName = "FragmentsClientContext";
-function Y(r) {
-  return /* @__PURE__ */ a(E.Provider, { value: r.value, children: r.children });
+k.displayName = "FragmentsClientContext";
+function Ae(r) {
+  return /* @__PURE__ */ d(k.Provider, { value: r.value, children: r.children });
 }
-const M = v(null);
-M.displayName = "InstanceIdContext";
-const g = v(
+function ke() {
+  return v(k);
+}
+const z = A(null);
+z.displayName = "InstanceIdContext";
+const F = A(
   null
 );
-g.displayName = "ModulesMapContext";
-function H({
+F.displayName = "ModulesMapContext";
+function Ce({
   value: r,
   children: e
 }) {
-  return /* @__PURE__ */ a(g.Provider, { value: r, children: e });
+  return /* @__PURE__ */ d(F.Provider, { value: r, children: e });
 }
-function ue() {
-  const r = f(E);
-  return A(
+function Ue() {
+  const r = v(k);
+  return N(
     () => ({
       reachGoal: (e) => {
-        var n, t;
-        (t = (n = r == null ? void 0 : r.$metrics) == null ? void 0 : n.reachGoal) == null || t.call(n, e);
+        var t, n;
+        (n = (t = r == null ? void 0 : r.$metrics) == null ? void 0 : t.reachGoal) == null || n.call(t, e);
       }
     }),
     [r]
   );
 }
-function z(r) {
-  const e = f(g);
+function Pe(r) {
+  const e = v(F);
   if (!e)
     throw new Error("[useFragmentComponent] No ModulesMapProvider in tree");
   return e.read(r);
 }
-const J = typeof window < "u", x = Object.freeze({
+const $ = typeof window < "u", L = Object.freeze({
   rootFragmentId: 0,
   variantId: null,
   props: {},
@@ -49,82 +53,103 @@ const J = typeof window < "u", x = Object.freeze({
   // обёртка рендера (задача 3) остаётся без атрибута class на этом сентинеле.
   fragments: [],
   // Phase 106: пустой словарь слотов — сентинел не разворачивает ни одной ссылки.
-  slots: {}
+  slots: {},
+  sources: {}
 });
-function q(r, e) {
-  const n = f(E);
-  if (!n)
-    throw new Error("[useArea] No FragmentsClientProvider in tree");
-  const t = n.$area;
-  if (!(t != null && t.read))
+function R(r) {
+  const e = r.$area;
+  if (!(e != null && e.read))
     throw new Error("[useArea] $area plugin not mounted");
-  const l = (e == null ? void 0 : e.suspense) ?? !0, u = (e == null ? void 0 : e.pause) === !0 || !J && (e == null ? void 0 : e.ssr) === !1, c = (e == null ? void 0 : e.timeout) != null ? { timeout: e.timeout } : void 0, [, m] = L(0);
-  if (S(() => {
-    if (l || u) return;
-    let s = !0;
-    return Promise.resolve(t.resolve(r, c)).catch(() => {
+  return e;
+}
+function Ne(r, e) {
+  const t = v(k);
+  if (!t)
+    throw new Error("[useArea] No FragmentsClientProvider in tree");
+  const n = (e == null ? void 0 : e.suspense) ?? !0, s = (e == null ? void 0 : e.pause) === !0 || !$ && (e == null ? void 0 : e.ssr) === !1, a = (e == null ? void 0 : e.timeout) != null ? { timeout: e.timeout } : void 0, [, i] = w(0);
+  if (y(() => {
+    if (n || s) return;
+    const l = R(t);
+    let u = !0;
+    return Promise.resolve(l.resolve(r, a)).catch(() => {
     }).finally(() => {
-      s && m((o) => o + 1);
+      u && i((E) => E + 1);
     }), () => {
-      s = !1;
+      u = !1;
     };
-  }, [r, l, e == null ? void 0 : e.pause, e == null ? void 0 : e.timeout, e == null ? void 0 : e.ssr]), l)
-    return u ? x : (t.has(r) || Promise.resolve(t.resolve(r, c)).catch(() => {
-    }), t.read(r));
-  if (u)
+  }, [r, n, e == null ? void 0 : e.pause, e == null ? void 0 : e.timeout, e == null ? void 0 : e.ssr]), n) {
+    if (s)
+      return L;
+    const l = R(t);
+    if (l.has(r) || Promise.resolve(l.resolve(r, a)).catch(() => {
+    }), !$)
+      try {
+        return l.read(r);
+      } catch (u) {
+        if (u != null && typeof u.then == "function")
+          throw u;
+        return process.env.NODE_ENV !== "production" && console.error(
+          `[useArea] Area ${r} remained unresolved on the server because its cache reached a terminal state`,
+          u
+        ), L;
+      }
+    return l.read(r);
+  }
+  if (s)
     return { status: "idle", data: null, error: null };
-  if (t.has(r))
+  const c = R(t);
+  if (c.has(r))
     try {
-      return { status: "ready", data: t.read(r), error: null };
-    } catch (s) {
+      return { status: "ready", data: c.read(r), error: null };
+    } catch (l) {
       return {
         status: "not-found",
         data: null,
-        error: s instanceof Error ? s : new Error(String(s))
+        error: l instanceof Error ? l : new Error(String(l))
       };
     }
-  return Promise.resolve(t.resolve(r, c)).catch(() => {
+  return Promise.resolve(c.resolve(r, a)).catch(() => {
   }), { status: "loading", data: null, error: null };
 }
-const I = typeof window < "u", Q = 3e3, h = /* @__PURE__ */ new Map(), p = (r, e) => {
-  if (!I) {
-    const d = () => {
+const G = typeof window < "u", we = 3e3, P = /* @__PURE__ */ new Map(), Y = (r, e) => {
+  if (!G) {
+    const h = () => {
     };
-    return d.loaded = Promise.resolve(), d;
+    return h.loaded = Promise.resolve(), h;
   }
-  const n = h.get(e);
-  if (n) {
-    n.refCount += 1;
-    const d = () => {
-      n.refCount -= 1, n.refCount === 0 && (n.clearReadyTimer(), n.linkEl.remove(), h.delete(e));
+  const t = P.get(e);
+  if (t) {
+    t.refCount += 1;
+    const h = () => {
+      t.refCount -= 1, t.refCount === 0 && (t.clearReadyTimer(), t.linkEl.remove(), P.delete(e));
     };
-    return d.loaded = n.loaded, d;
+    return h.loaded = t.loaded, h;
   }
-  const t = document.createElement("link");
-  t.rel = "stylesheet", t.href = r, t.setAttribute("data-fragment-key", e);
-  let l;
-  const u = new Promise((d) => {
-    l = d;
-  }), c = () => {
-    s(), l();
-  }, m = setTimeout(c, Q), s = () => clearTimeout(m);
-  t.addEventListener("load", c), t.addEventListener("error", c), document.head.appendChild(t);
-  const o = { refCount: 1, linkEl: t, loaded: u, clearReadyTimer: s };
-  h.set(e, o);
-  const i = () => {
-    o.refCount -= 1, o.refCount === 0 && (o.clearReadyTimer(), o.linkEl.remove(), h.delete(e));
+  const n = document.createElement("link");
+  n.rel = "stylesheet", n.href = r, n.setAttribute("data-fragment-key", e);
+  let s;
+  const a = new Promise((h) => {
+    s = h;
+  }), i = () => {
+    l(), s();
+  }, c = setTimeout(i, we), l = () => clearTimeout(c);
+  n.addEventListener("load", i), n.addEventListener("error", i), document.head.appendChild(n);
+  const u = { refCount: 1, linkEl: n, loaded: a, clearReadyTimer: l };
+  P.set(e, u);
+  const E = () => {
+    u.refCount -= 1, u.refCount === 0 && (u.clearReadyTimer(), u.linkEl.remove(), P.delete(e));
   };
-  return i.loaded = u, i;
-}, W = I ? b : S;
-function X(r, e) {
-  W(() => p(r, e), [r, e]);
+  return E.loaded = a, E;
+}, Fe = G ? se : y;
+function Te(r, e) {
+  Fe(() => Y(r, e), [r, e]);
 }
-const Z = parseInt(O.split(".")[0], 10), ee = Z >= 19;
-function P({
+const Re = parseInt(ue.split(".")[0], 10), _e = Re >= 19;
+function D({
   href: r,
   fragmentKey: e
 }) {
-  return ee ? /* @__PURE__ */ a(
+  return _e ? /* @__PURE__ */ d(
     "link",
     {
       rel: "stylesheet",
@@ -132,148 +157,237 @@ function P({
       precedence: "default",
       "data-fragment-key": e
     }
-  ) : (X(r, e), null);
+  ) : (Te(r, e), null);
+}
+function pe(r) {
+}
+const J = {}, x = A(null);
+x.displayName = "ProjectPropertiesContext";
+const q = Object.freeze({}), O = A(q);
+O.displayName = "SourceTransportsContext";
+const b = A("live");
+b.displayName = "SourceNetworkContext";
+function V(r) {
+  const e = r instanceof Error ? r : new Error(String(r));
+  if (!(e instanceof de))
+    return { kind: "failed", error: e };
+  const { code: t } = e;
+  return t === "NO_ACTIVE_VARIANT" ? { kind: "no-variant", code: t, error: e } : t === "AREA_NOT_FOUND" || t === "NO_PUBLISHED_SNAPSHOT" || t === "NESTED_SNAPSHOT_MISSING" ? { kind: "misconfigured", code: t, error: e } : { kind: "failed", code: t, error: e };
 }
-function se(r) {
+function Q(r, e, t) {
+  return typeof r == "function" ? r(e, t) : r ?? null;
 }
-const R = {}, y = v(null);
-y.displayName = "ProjectPropertiesContext";
-class T extends B {
+const xe = () => {
+};
+function U(r) {
+  return r instanceof Error ? r : new Error(String(r));
+}
+class W extends ce {
   constructor() {
-    super(...arguments), this.state = { hasError: !1 };
+    super(...arguments), this.state = { hasError: !1, error: null };
   }
-  static getDerivedStateFromError() {
-    return { hasError: !0 };
+  static getDerivedStateFromError(e) {
+    return { hasError: !0, error: U(e) };
   }
-  componentDidCatch(e, n) {
-    var t, l;
-    process.env.NODE_ENV !== "production" && console.error("[fragments] Area error:", e, n.componentStack), (l = (t = this.props).onError) == null || l.call(t, e);
+  componentDidCatch(e, t) {
+    var s, a;
+    const n = U(e);
+    process.env.NODE_ENV !== "production" && console.error("[fragments] Area error:", n, t.componentStack), (a = (s = this.props).onError) == null || a.call(s, n);
   }
   render() {
-    return this.state.hasError ? null : this.props.children;
+    if (this.state.hasError) {
+      const e = { kind: "failed", error: this.state.error ?? new Error("Unknown Area error") };
+      try {
+        return Q(this.props.empty, e, this.props.retry ?? xe);
+      } catch {
+        return null;
+      }
+    }
+    return this.props.children;
   }
 }
-function j(r, e) {
+function X(r, e) {
   if (!r) return {};
-  const n = {};
-  for (const t of Object.keys(r))
-    n[t] = re(r[t], e);
-  return n;
+  const t = {};
+  for (const n of Object.keys(r))
+    t[n] = Oe(r[n], e);
+  return t;
 }
-function re(r, e) {
-  return Array.isArray(r) ? r.map((n, t) => n === null ? null : F(n, e, t)) : F(r, e);
+function Oe(r, e) {
+  return Array.isArray(r) ? r.map((t, n) => t === null ? null : p(t, e, n)) : p(r, e);
 }
-function F(r, e, n) {
-  let t;
+function p(r, e, t) {
+  let n;
   try {
-    t = e(r.fragmentId);
-  } catch (u) {
-    if (u != null && typeof u.then == "function")
-      throw u;
-    return console.warn(`[FragmentRenderer] Slot fragment ${r.fragmentId} failed to load — rendering empty hole`, u), null;
+    n = e(r.fragmentId);
+  } catch (a) {
+    if (a != null && typeof a.then == "function")
+      throw a;
+    return console.warn(`[FragmentRenderer] Slot fragment ${r.fragmentId} failed to load — rendering empty hole`, a), null;
   }
-  const l = j(r.slots, e);
-  return D(t, { key: n, ...r.props, ...l });
+  const s = X(r.slots, e);
+  return le(n, { key: t, ...r.props, ...s });
 }
-const N = ({
+const Z = ({
   fragmentId: r,
   props: e,
-  globalCssUrl: n = null,
-  projectProperties: t = R,
-  fragments: l = [r],
-  slots: u
+  globalCssUrl: t = null,
+  projectProperties: n = J,
+  fragments: s = [r],
+  slots: a,
+  sources: i = q,
+  sourceNetwork: c = "live"
 }) => {
-  const c = z(r), m = f(g);
-  if (!m)
+  const l = Pe(r), u = v(F);
+  if (!u)
     throw new Error("[FragmentRendererInner] No ModulesMapProvider in tree");
-  const s = j(u, m.read), o = { ...e ?? {}, ...s }, i = l.length > 0 ? l.map($).join(" ") : void 0;
-  return /* @__PURE__ */ _(k, { children: [
-    n != null && /* @__PURE__ */ a(
-      P,
+  const E = X(a, u.read), h = { ...e ?? {}, ...E }, o = s.length > 0 ? s.map(ie).join(" ") : void 0;
+  return /* @__PURE__ */ te(ne, { children: [
+    t != null && /* @__PURE__ */ d(
+      D,
       {
-        href: n,
-        fragmentKey: U
+        href: t,
+        fragmentKey: fe
       }
     ),
-    l.map((d) => {
-      const C = V(d);
-      return C ? /* @__PURE__ */ a(
-        P,
+    s.map((m) => {
+      const g = me(m);
+      return g ? /* @__PURE__ */ d(
+        D,
         {
-          href: C,
-          fragmentKey: G(d)
+          href: g,
+          fragmentKey: he(m)
         },
-        d
+        m
       ) : null;
     }),
-    /* @__PURE__ */ a(y.Provider, { value: t, children: /* @__PURE__ */ a(M.Provider, { value: null, children: /* @__PURE__ */ a(
+    /* @__PURE__ */ d(b.Provider, { value: c, children: /* @__PURE__ */ d(O.Provider, { value: i, children: /* @__PURE__ */ d(x.Provider, { value: n, children: /* @__PURE__ */ d(z.Provider, { value: null, children: /* @__PURE__ */ d(
       "div",
       {
-        className: i,
+        className: o,
         style: { display: "contents" },
-        children: /* @__PURE__ */ a(c, { ...o })
+        children: /* @__PURE__ */ d(l, { ...h })
       }
-    ) }) })
+    ) }) }) }) })
   ] });
-}, ce = ({ onError: r, ...e }) => /* @__PURE__ */ a(w, { fallback: null, children: /* @__PURE__ */ a(T, { onError: r, children: /* @__PURE__ */ a(N, { ...e }) }) }), te = ({ areaCode: r, options: e }) => {
-  if ((e == null ? void 0 : e.pause) === !0)
+}, Be = ({ onError: r, ...e }) => /* @__PURE__ */ d(K, { fallback: null, children: /* @__PURE__ */ d(W, { onError: r, children: /* @__PURE__ */ d(Z, { ...e }) }) }), be = ({ areaCode: r, options: e, retry: t }) => {
+  const n = Ne(r, {
+    suspense: !1,
+    ssr: !1,
+    pause: e == null ? void 0 : e.pause,
+    timeout: e == null ? void 0 : e.timeout
+  }), s = H(null);
+  if (y(() => {
+    var S;
+    if (n.status !== "not-found" || !n.error) return;
+    const m = V(n.error), g = JSON.stringify([r, m.kind, m.code, m.error.message]);
+    s.current !== g && (s.current = g, (S = e == null ? void 0 : e.onError) == null || S.call(e, m.error), process.env.NODE_ENV !== "production" && m.kind !== "no-variant" && console.error(
+      `[fragments] Area resolution ${m.kind}: areaCode=${r}, code=${m.code ?? "none"}`,
+      m.error
+    ));
+  }, [r, e == null ? void 0 : e.onError, n.error, n.status]), (e == null ? void 0 : e.pause) === !0)
     return null;
-  const n = q(r, {
-    timeout: e == null ? void 0 : e.timeout,
-    ssr: e == null ? void 0 : e.ssr
-  });
-  if (n === x)
-    return null;
-  const { rootFragmentId: t, props: l, projectProperties: u, globalCssUrl: c, fragments: m, slots: s } = n, o = typeof (e == null ? void 0 : e.props) == "function" ? e.props(l) : e != null && e.props ? { ...l, ...e.props } : l;
-  return /* @__PURE__ */ a(
-    N,
+  if (n.status === "idle")
+    return (e == null ? void 0 : e.fallback) ?? null;
+  if (n.status === "not-found")
+    return Q(e == null ? void 0 : e.empty, V(n.error), t);
+  if (n.status === "loading" || !n.data)
+    return (e == null ? void 0 : e.fallback) ?? null;
+  const { rootFragmentId: a, props: i, projectProperties: c, globalCssUrl: l, fragments: u, slots: E, sources: h } = n.data, o = typeof (e == null ? void 0 : e.props) == "function" ? e.props(i) : e != null && e.props ? { ...i, ...e.props } : i;
+  return /* @__PURE__ */ d(K, { fallback: (e == null ? void 0 : e.fallback) ?? null, children: /* @__PURE__ */ d(
+    Z,
     {
-      fragmentId: t,
+      fragmentId: a,
       props: o,
-      globalCssUrl: c,
-      projectProperties: u,
-      fragments: m,
-      slots: s
+      globalCssUrl: l,
+      projectProperties: c,
+      fragments: u,
+      slots: E,
+      sources: h
     }
+  ) });
+}, Ke = ({ areaCode: r, options: e }) => {
+  const t = v(k), [n, s] = w(0), a = t == null ? void 0 : t.$area;
+  y(() => {
+    (e == null ? void 0 : e.ssr) !== !0 || process.env.NODE_ENV === "production" || console.error(
+      "[fragments] Area option `ssr` is reserved: server resolution has been removed from the runtime; existing `ssr: false` calls continue to work unchanged."
+    );
+  }, [e == null ? void 0 : e.ssr]);
+  const i = _(() => {
+    a != null && a.resolve && (a.resolve(r).catch(() => {
+    }), s((c) => c + 1));
+  }, [a, r]);
+  return (
+    // A retry remounts the boundary and AreaInner: a repeated failure is a new
+    // telemetry event, so AreaInner intentionally calls options.onError again.
+    /* @__PURE__ */ d(W, { onError: e == null ? void 0 : e.onError, empty: e == null ? void 0 : e.empty, retry: i, children: /* @__PURE__ */ d(be, { areaCode: r, options: e, retry: i }) }, n)
   );
-}, oe = ({ areaCode: r, options: e }) => /* @__PURE__ */ a(w, { fallback: (e == null ? void 0 : e.fallback) ?? null, children: /* @__PURE__ */ a(T, { onError: e == null ? void 0 : e.onError, children: /* @__PURE__ */ a(te, { areaCode: r, options: e }) }) });
-function de({ client: r, children: e }) {
-  const n = A(
+};
+function He({ client: r, children: e }) {
+  const t = N(
     () => ({
-      read: (t) => r.$fragments.read(t)
+      read: (n) => r.$fragments.read(n)
     }),
     [r]
   );
-  return /* @__PURE__ */ a(Y, { value: r, children: /* @__PURE__ */ a(H, { value: n, children: e }) });
+  return /* @__PURE__ */ d(Ae, { value: r, children: /* @__PURE__ */ d(Ce, { value: t, children: e }) });
+}
+function ze(r) {
+  return (v(x) ?? J)[r];
+}
+function Ie(r, e) {
+  const [, t] = oe((a) => a + 1, 0), n = e(), s = H(n);
+  return s.current = n, y(() => {
+    const a = r(t);
+    return Object.is(s.current, e()) || t(), a;
+  }, [r, e]), n;
 }
-function me(r) {
-  return (f(y) ?? R)[r];
+const B = ae.useSyncExternalStore, Me = B || ((r, e) => Ie(r, e)), ee = "offline", je = () => Promise.reject(new Error(ee));
+function $e(r, e) {
+  var M;
+  const t = ke(), [n] = w(Ee), s = (t == null ? void 0 : t.sourceCache) ?? n, a = (M = t == null ? void 0 : t.sourceFetchers) == null ? void 0 : M[r], i = a ? "host-fetch" : "network", c = t == null ? void 0 : t.env, l = j({ source: r, target: e.target, params: e.params }), u = N(() => ({ source: r, target: e.target, params: e.params }), [l]), E = _((T) => s.subscribe(u, T), [s, u]), h = _(() => s.get(u), [s, u]), o = Me(E, h, h), m = v(b), g = v(O), S = ve(r, e.target), f = N(
+    () => m === ee ? null : ge(g[S], u.params),
+    [m, g, S, u]
+  ), [C, I] = w(null);
+  return y(() => {
+    (o == null ? void 0 : o.status) === "ready" && C !== null && I(null);
+  }, [o, C]), y(() => {
+    f && !f.ok && o === void 0 && console.warn(`[useSource] ${S}: ${f.reason}`);
+  }, [S, f == null ? void 0 : f.ok, f && !f.ok ? f.reason : void 0, o === void 0]), y(() => {
+    if (f && !f.ok || (o == null ? void 0 : o.status) === "ready" || C === l) return;
+    I(l);
+    const T = f && f.ok ? () => ye({ url: f.url, init: f.init }, { fetcher: a, timeout: c == null ? void 0 : c.timeout }).then((re) => (c != null && c.debug && console.info(`[useSource] loaded ${j(u)} origin=${i}`), re)) : je;
+    s.load(u, T, i);
+  }, [s, u, l, o, C, f, a, i, c == null ? void 0 : c.timeout, c == null ? void 0 : c.debug]), (o == null ? void 0 : o.status) === "ready" ? { data: o.data ?? void 0, loading: !1 } : (o == null ? void 0 : o.status) === "pending" ? { data: void 0, loading: !0 } : f && !f.ok ? { data: void 0, loading: !1 } : { data: void 0, loading: C !== l };
 }
-function fe(r) {
-  return K({ ...r, inject: p });
+const Ge = $e;
+function Ye(r) {
+  return Se({ ...r, inject: Y });
 }
 export {
-  x as AREA_UNRESOLVED,
-  oe as Area,
-  ce as FragmentRenderer,
-  P as FragmentStylesheet,
-  ve as FragmentsApiVersionError,
-  Ee as FragmentsAreaError,
-  E as FragmentsClientContext,
-  Y as FragmentsClientProvider,
-  ge as FragmentsLoadError,
-  de as FragmentsProvider,
-  M as InstanceIdContext,
-  g as ModulesMapContext,
-  H as ModulesMapProvider,
-  y as ProjectPropertiesContext,
-  fe as createBrowserClient,
-  R as defaultProjectProperties,
-  p as injectStylesheet,
-  q as useArea,
-  se as useCssChunk,
-  z as useFragmentComponent,
-  ue as useFragmentMetrics,
-  X as useFragmentStylesheet,
-  me as useProjectProperty
+  L as AREA_UNRESOLVED,
+  Ke as Area,
+  Be as FragmentRenderer,
+  D as FragmentStylesheet,
+  Qe as FragmentsApiVersionError,
+  We as FragmentsAreaError,
+  k as FragmentsClientContext,
+  Ae as FragmentsClientProvider,
+  Xe as FragmentsLoadError,
+  He as FragmentsProvider,
+  z as InstanceIdContext,
+  F as ModulesMapContext,
+  Ce as ModulesMapProvider,
+  x as ProjectPropertiesContext,
+  Ye as createBrowserClient,
+  Ze as createSourceCache,
+  J as defaultProjectProperties,
+  Y as injectStylesheet,
+  Ne as useArea,
+  pe as useCssChunk,
+  Pe as useFragmentComponent,
+  Ue as useFragmentMetrics,
+  Te as useFragmentStylesheet,
+  ze as useProjectProperty,
+  Ge as useSource
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(l,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("react/jsx-runtime"),require("react"),require("@fragmentsx/fragments-client")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@fragmentsx/fragments-client"],u):(l=typeof globalThis<"u"?globalThis:l||self,u(l.FragmentsRuntimeReact={},l.jsxRuntime,l.React,l.fragmentsClient))})(this,function(l,u,a,m){"use strict";const g=a.createContext(null);g.displayName="FragmentsClientContext";function j(r){return u.jsx(g.Provider,{value:r.value,children:r.children})}const P=a.createContext(null);P.displayName="InstanceIdContext";const E=a.createContext(null);E.displayName="ModulesMapContext";function w({value:r,children:e}){return u.jsx(E.Provider,{value:r,children:e})}function p(){const r=a.useContext(g);return a.useMemo(()=>({reachGoal:e=>{var n,t;(t=(n=r==null?void 0:r.$metrics)==null?void 0:n.reachGoal)==null||t.call(n,e)}}),[r])}function I(r){const e=a.useContext(E);if(!e)throw new Error("[useFragmentComponent] No ModulesMapProvider in tree");return e.read(r)}const B=typeof window<"u",F=Object.freeze({rootFragmentId:0,variantId:null,props:{},projectProperties:{},globalCssUrl:null,fragments:[],slots:{}});function T(r,e){const n=a.useContext(g);if(!n)throw new Error("[useArea] No FragmentsClientProvider in tree");const t=n.$area;if(!(t!=null&&t.read))throw new Error("[useArea] $area plugin not mounted");const s=(e==null?void 0:e.suspense)??!0,c=(e==null?void 0:e.pause)===!0||!B&&(e==null?void 0:e.ssr)===!1,d=(e==null?void 0:e.timeout)!=null?{timeout:e.timeout}:void 0,[,h]=a.useState(0);if(a.useEffect(()=>{if(s||c)return;let o=!0;return Promise.resolve(t.resolve(r,d)).catch(()=>{}).finally(()=>{o&&h(f=>f+1)}),()=>{o=!1}},[r,s,e==null?void 0:e.pause,e==null?void 0:e.timeout,e==null?void 0:e.ssr]),s)return c?F:(t.has(r)||Promise.resolve(t.resolve(r,d)).catch(()=>{}),t.read(r));if(c)return{status:"idle",data:null,error:null};if(t.has(r))try{return{status:"ready",data:t.read(r),error:null}}catch(o){return{status:"not-found",data:null,error:o instanceof Error?o:new Error(String(o))}}return Promise.resolve(t.resolve(r,d)).catch(()=>{}),{status:"loading",data:null,error:null}}const _=typeof window<"u",D=3e3,v=new Map,A=(r,e)=>{if(!_){const i=()=>{};return i.loaded=Promise.resolve(),i}const n=v.get(e);if(n){n.refCount+=1;const i=()=>{n.refCount-=1,n.refCount===0&&(n.clearReadyTimer(),n.linkEl.remove(),v.delete(e))};return i.loaded=n.loaded,i}const t=document.createElement("link");t.rel="stylesheet",t.href=r,t.setAttribute("data-fragment-key",e);let s;const c=new Promise(i=>{s=i}),d=()=>{o(),s()},h=setTimeout(d,D),o=()=>clearTimeout(h);t.addEventListener("load",d),t.addEventListener("error",d),document.head.appendChild(t);const f={refCount:1,linkEl:t,loaded:c,clearReadyTimer:o};v.set(e,f);const C=()=>{f.refCount-=1,f.refCount===0&&(f.clearReadyTimer(),f.linkEl.remove(),v.delete(e))};return C.loaded=c,C},V=_?a.useLayoutEffect:a.useEffect;function b(r,e){V(()=>A(r,e),[r,e])}const R=parseInt(a.version.split(".")[0],10)>=19;function S({href:r,fragmentKey:e}){return R?u.jsx("link",{rel:"stylesheet",href:r,precedence:"default","data-fragment-key":e}):(b(r,e),null)}function U(r){}const M={},y=a.createContext(null);y.displayName="ProjectPropertiesContext";class N extends a.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,n){var t,s;process.env.NODE_ENV!=="production"&&console.error("[fragments] Area error:",e,n.componentStack),(s=(t=this.props).onError)==null||s.call(t,e)}render(){return this.state.hasError?null:this.props.children}}function O(r,e){if(!r)return{};const n={};for(const t of Object.keys(r))n[t]=$(r[t],e);return n}function $(r,e){return Array.isArray(r)?r.map((n,t)=>n===null?null:L(n,e,t)):L(r,e)}function L(r,e,n){let t;try{t=e(r.fragmentId)}catch(c){if(c!=null&&typeof c.then=="function")throw c;return console.warn(`[FragmentRenderer] Slot fragment ${r.fragmentId} failed to load — rendering empty hole`,c),null}const s=O(r.slots,e);return a.createElement(t,{key:n,...r.props,...s})}const k=({fragmentId:r,props:e,globalCssUrl:n=null,projectProperties:t=M,fragments:s=[r],slots:c})=>{const d=I(r),h=a.useContext(E);if(!h)throw new Error("[FragmentRendererInner] No ModulesMapProvider in tree");const o=O(c,h.read),f={...e??{},...o},C=s.length>0?s.map(m.toScopeClassName).join(" "):void 0;return u.jsxs(u.Fragment,{children:[n!=null&&u.jsx(S,{href:n,fragmentKey:m.AREA_GLOBAL_CSS_KEY}),s.map(i=>{const x=m.resolveStylesHref(i);return x?u.jsx(S,{href:x,fragmentKey:m.fragmentCssKey(i)},i):null}),u.jsx(y.Provider,{value:t,children:u.jsx(P.Provider,{value:null,children:u.jsx("div",{className:C,style:{display:"contents"},children:u.jsx(d,{...f})})})})]})},q=({onError:r,...e})=>u.jsx(a.Suspense,{fallback:null,children:u.jsx(N,{onError:r,children:u.jsx(k,{...e})})}),G=({areaCode:r,options:e})=>{if((e==null?void 0:e.pause)===!0)return null;const n=T(r,{timeout:e==null?void 0:e.timeout,ssr:e==null?void 0:e.ssr});if(n===F)return null;const{rootFragmentId:t,props:s,projectProperties:c,globalCssUrl:d,fragments:h,slots:o}=n,f=typeof(e==null?void 0:e.props)=="function"?e.props(s):e!=null&&e.props?{...s,...e.props}:s;return u.jsx(k,{fragmentId:t,props:f,globalCssUrl:d,projectProperties:c,fragments:h,slots:o})},K=({areaCode:r,options:e})=>u.jsx(a.Suspense,{fallback:(e==null?void 0:e.fallback)??null,children:u.jsx(N,{onError:e==null?void 0:e.onError,children:u.jsx(G,{areaCode:r,options:e})})});function Y({client:r,children:e}){const n=a.useMemo(()=>({read:t=>r.$fragments.read(t)}),[r]);return u.jsx(j,{value:r,children:u.jsx(w,{value:n,children:e})})}function H(r){return(a.useContext(y)??M)[r]}function J(r){return m.createFragmentsClient({...r,inject:A})}Object.defineProperty(l,"FragmentsApiVersionError",{enumerable:!0,get:()=>m.FragmentsApiVersionError}),Object.defineProperty(l,"FragmentsAreaError",{enumerable:!0,get:()=>m.FragmentsAreaError}),Object.defineProperty(l,"FragmentsLoadError",{enumerable:!0,get:()=>m.FragmentsLoadError}),l.AREA_UNRESOLVED=F,l.Area=K,l.FragmentRenderer=q,l.FragmentStylesheet=S,l.FragmentsClientContext=g,l.FragmentsClientProvider=j,l.FragmentsProvider=Y,l.InstanceIdContext=P,l.ModulesMapContext=E,l.ModulesMapProvider=w,l.ProjectPropertiesContext=y,l.createBrowserClient=J,l.defaultProjectProperties=M,l.injectStylesheet=A,l.useArea=T,l.useCssChunk=U,l.useFragmentComponent=I,l.useFragmentMetrics=p,l.useFragmentStylesheet=b,l.useProjectProperty=H,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});
+(function(s,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react/jsx-runtime"),require("react"),require("@fragmentsx/fragments-client")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@fragmentsx/fragments-client"],l):(s=typeof globalThis<"u"?globalThis:s||self,l(s.FragmentsRuntimeReact={},s.jsxRuntime,s.React,s.fragmentsClient))})(this,function(s,l,u,h){"use strict";function ee(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,n.get?n:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const re=ee(u),P=u.createContext(null);P.displayName="FragmentsClientContext";function $(r){return l.jsx(P.Provider,{value:r.value,children:r.children})}function te(){return u.useContext(P)}const N=u.createContext(null);N.displayName="InstanceIdContext";const A=u.createContext(null);A.displayName="ModulesMapContext";function D({value:r,children:e}){return l.jsx(A.Provider,{value:r,children:e})}function ne(){const r=u.useContext(P);return u.useMemo(()=>({reachGoal:e=>{var t,n;(n=(t=r==null?void 0:r.$metrics)==null?void 0:t.reachGoal)==null||n.call(t,e)}}),[r])}function L(r){const e=u.useContext(A);if(!e)throw new Error("[useFragmentComponent] No ModulesMapProvider in tree");return e.read(r)}const V=typeof window<"u",O=Object.freeze({rootFragmentId:0,variantId:null,props:{},projectProperties:{},globalCssUrl:null,fragments:[],slots:{},sources:{}});function w(r){const e=r.$area;if(!(e!=null&&e.read))throw new Error("[useArea] $area plugin not mounted");return e}function U(r,e){const t=u.useContext(P);if(!t)throw new Error("[useArea] No FragmentsClientProvider in tree");const n=(e==null?void 0:e.suspense)??!0,c=(e==null?void 0:e.pause)===!0||!V&&(e==null?void 0:e.ssr)===!1,a=(e==null?void 0:e.timeout)!=null?{timeout:e.timeout}:void 0,[,m]=u.useState(0);if(u.useEffect(()=>{if(n||c)return;const f=w(t);let o=!0;return Promise.resolve(f.resolve(r,a)).catch(()=>{}).finally(()=>{o&&m(y=>y+1)}),()=>{o=!1}},[r,n,e==null?void 0:e.pause,e==null?void 0:e.timeout,e==null?void 0:e.ssr]),n){if(c)return O;const f=w(t);if(f.has(r)||Promise.resolve(f.resolve(r,a)).catch(()=>{}),!V)try{return f.read(r)}catch(o){if(o!=null&&typeof o.then=="function")throw o;return process.env.NODE_ENV!=="production"&&console.error(`[useArea] Area ${r} remained unresolved on the server because its cache reached a terminal state`,o),O}return f.read(r)}if(c)return{status:"idle",data:null,error:null};const d=w(t);if(d.has(r))try{return{status:"ready",data:d.read(r),error:null}}catch(f){return{status:"not-found",data:null,error:f instanceof Error?f:new Error(String(f))}}return Promise.resolve(d.resolve(r,a)).catch(()=>{}),{status:"loading",data:null,error:null}}const B=typeof window<"u",ue=3e3,k=new Map,T=(r,e)=>{if(!B){const v=()=>{};return v.loaded=Promise.resolve(),v}const t=k.get(e);if(t){t.refCount+=1;const v=()=>{t.refCount-=1,t.refCount===0&&(t.clearReadyTimer(),t.linkEl.remove(),k.delete(e))};return v.loaded=t.loaded,v}const n=document.createElement("link");n.rel="stylesheet",n.href=r,n.setAttribute("data-fragment-key",e);let c;const a=new Promise(v=>{c=v}),m=()=>{f(),c()},d=setTimeout(m,ue),f=()=>clearTimeout(d);n.addEventListener("load",m),n.addEventListener("error",m),document.head.appendChild(n);const o={refCount:1,linkEl:n,loaded:a,clearReadyTimer:f};k.set(e,o);const y=()=>{o.refCount-=1,o.refCount===0&&(o.clearReadyTimer(),o.linkEl.remove(),k.delete(e))};return y.loaded=a,y},se=B?u.useLayoutEffect:u.useEffect;function K(r,e){se(()=>T(r,e),[r,e])}const ae=parseInt(u.version.split(".")[0],10)>=19;function M({href:r,fragmentKey:e}){return ae?l.jsx("link",{rel:"stylesheet",href:r,precedence:"default","data-fragment-key":e}):(K(r,e),null)}function ce(r){}const _={},b=u.createContext(null);b.displayName="ProjectPropertiesContext";const z=Object.freeze({}),j=u.createContext(z);j.displayName="SourceTransportsContext";const I=u.createContext("live");I.displayName="SourceNetworkContext";function H(r){const e=r instanceof Error?r:new Error(String(r));if(!(e instanceof h.FragmentsAreaError))return{kind:"failed",error:e};const{code:t}=e;return t==="NO_ACTIVE_VARIANT"?{kind:"no-variant",code:t,error:e}:t==="AREA_NOT_FOUND"||t==="NO_PUBLISHED_SNAPSHOT"||t==="NESTED_SNAPSHOT_MISSING"?{kind:"misconfigured",code:t,error:e}:{kind:"failed",code:t,error:e}}function G(r,e,t){return typeof r=="function"?r(e,t):r??null}const oe=()=>{};function Y(r){return r instanceof Error?r:new Error(String(r))}class q extends u.Component{constructor(){super(...arguments),this.state={hasError:!1,error:null}}static getDerivedStateFromError(e){return{hasError:!0,error:Y(e)}}componentDidCatch(e,t){var c,a;const n=Y(e);process.env.NODE_ENV!=="production"&&console.error("[fragments] Area error:",n,t.componentStack),(a=(c=this.props).onError)==null||a.call(c,n)}render(){if(this.state.hasError){const e={kind:"failed",error:this.state.error??new Error("Unknown Area error")};try{return G(this.props.empty,e,this.props.retry??oe)}catch{return null}}return this.props.children}}function J(r,e){if(!r)return{};const t={};for(const n of Object.keys(r))t[n]=le(r[n],e);return t}function le(r,e){return Array.isArray(r)?r.map((t,n)=>t===null?null:p(t,e,n)):p(r,e)}function p(r,e,t){let n;try{n=e(r.fragmentId)}catch(a){if(a!=null&&typeof a.then=="function")throw a;return console.warn(`[FragmentRenderer] Slot fragment ${r.fragmentId} failed to load — rendering empty hole`,a),null}const c=J(r.slots,e);return u.createElement(n,{key:t,...r.props,...c})}const Q=({fragmentId:r,props:e,globalCssUrl:t=null,projectProperties:n=_,fragments:c=[r],slots:a,sources:m=z,sourceNetwork:d="live"})=>{const f=L(r),o=u.useContext(A);if(!o)throw new Error("[FragmentRendererInner] No ModulesMapProvider in tree");const y=J(a,o.read),v={...e??{},...y},i=c.length>0?c.map(h.toScopeClassName).join(" "):void 0;return l.jsxs(l.Fragment,{children:[t!=null&&l.jsx(M,{href:t,fragmentKey:h.AREA_GLOBAL_CSS_KEY}),c.map(g=>{const S=h.resolveStylesHref(g);return S?l.jsx(M,{href:S,fragmentKey:h.fragmentCssKey(g)},g):null}),l.jsx(I.Provider,{value:d,children:l.jsx(j.Provider,{value:m,children:l.jsx(b.Provider,{value:n,children:l.jsx(N.Provider,{value:null,children:l.jsx("div",{className:i,style:{display:"contents"},children:l.jsx(f,{...v})})})})})})]})},de=({onError:r,...e})=>l.jsx(u.Suspense,{fallback:null,children:l.jsx(q,{onError:r,children:l.jsx(Q,{...e})})}),fe=({areaCode:r,options:e,retry:t})=>{const n=U(r,{suspense:!1,ssr:!1,pause:e==null?void 0:e.pause,timeout:e==null?void 0:e.timeout}),c=u.useRef(null);if(u.useEffect(()=>{var C;if(n.status!=="not-found"||!n.error)return;const g=H(n.error),S=JSON.stringify([r,g.kind,g.code,g.error.message]);c.current!==S&&(c.current=S,(C=e==null?void 0:e.onError)==null||C.call(e,g.error),process.env.NODE_ENV!=="production"&&g.kind!=="no-variant"&&console.error(`[fragments] Area resolution ${g.kind}: areaCode=${r}, code=${g.code??"none"}`,g.error))},[r,e==null?void 0:e.onError,n.error,n.status]),(e==null?void 0:e.pause)===!0)return null;if(n.status==="idle")return(e==null?void 0:e.fallback)??null;if(n.status==="not-found")return G(e==null?void 0:e.empty,H(n.error),t);if(n.status==="loading"||!n.data)return(e==null?void 0:e.fallback)??null;const{rootFragmentId:a,props:m,projectProperties:d,globalCssUrl:f,fragments:o,slots:y,sources:v}=n.data,i=typeof(e==null?void 0:e.props)=="function"?e.props(m):e!=null&&e.props?{...m,...e.props}:m;return l.jsx(u.Suspense,{fallback:(e==null?void 0:e.fallback)??null,children:l.jsx(Q,{fragmentId:a,props:i,globalCssUrl:f,projectProperties:d,fragments:o,slots:y,sources:v})})},ie=({areaCode:r,options:e})=>{const t=u.useContext(P),[n,c]=u.useState(0),a=t==null?void 0:t.$area;u.useEffect(()=>{(e==null?void 0:e.ssr)!==!0||process.env.NODE_ENV==="production"||console.error("[fragments] Area option `ssr` is reserved: server resolution has been removed from the runtime; existing `ssr: false` calls continue to work unchanged.")},[e==null?void 0:e.ssr]);const m=u.useCallback(()=>{a!=null&&a.resolve&&(a.resolve(r).catch(()=>{}),c(d=>d+1))},[a,r]);return l.jsx(q,{onError:e==null?void 0:e.onError,empty:e==null?void 0:e.empty,retry:m,children:l.jsx(fe,{areaCode:r,options:e,retry:m})},n)};function me({client:r,children:e}){const t=u.useMemo(()=>({read:n=>r.$fragments.read(n)}),[r]);return l.jsx($,{value:r,children:l.jsx(D,{value:t,children:e})})}function Ee(r){return(u.useContext(b)??_)[r]}function he(r,e){const[,t]=u.useReducer(a=>a+1,0),n=e(),c=u.useRef(n);return c.current=n,u.useEffect(()=>{const a=r(t);return Object.is(c.current,e())||t(),a},[r,e]),n}const W=re.useSyncExternalStore,ge=W||((r,e)=>he(r,e)),X="offline",ve=()=>Promise.reject(new Error(X));function ye(r,e){var R;const t=te(),[n]=u.useState(h.createSourceCache),c=(t==null?void 0:t.sourceCache)??n,a=(R=t==null?void 0:t.sourceFetchers)==null?void 0:R[r],m=a?"host-fetch":"network",d=t==null?void 0:t.env,f=h.sourceCallKey({source:r,target:e.target,params:e.params}),o=u.useMemo(()=>({source:r,target:e.target,params:e.params}),[f]),y=u.useCallback(x=>c.subscribe(o,x),[c,o]),v=u.useCallback(()=>c.get(o),[c,o]),i=ge(y,v,v),g=u.useContext(I),S=u.useContext(j),C=h.sourceTransportKey(r,e.target),E=u.useMemo(()=>g===X?null:h.resolveSourceRequest(S[C],o.params),[g,S,C,o]),[F,Z]=u.useState(null);return u.useEffect(()=>{(i==null?void 0:i.status)==="ready"&&F!==null&&Z(null)},[i,F]),u.useEffect(()=>{E&&!E.ok&&i===void 0&&console.warn(`[useSource] ${C}: ${E.reason}`)},[C,E==null?void 0:E.ok,E&&!E.ok?E.reason:void 0,i===void 0]),u.useEffect(()=>{if(E&&!E.ok||(i==null?void 0:i.status)==="ready"||F===f)return;Z(f);const x=E&&E.ok?()=>h.runSourceFetch({url:E.url,init:E.init},{fetcher:a,timeout:d==null?void 0:d.timeout}).then(Ce=>(d!=null&&d.debug&&console.info(`[useSource] loaded ${h.sourceCallKey(o)} origin=${m}`),Ce)):ve;c.load(o,x,m)},[c,o,f,i,F,E,a,m,d==null?void 0:d.timeout,d==null?void 0:d.debug]),(i==null?void 0:i.status)==="ready"?{data:i.data??void 0,loading:!1}:(i==null?void 0:i.status)==="pending"?{data:void 0,loading:!0}:E&&!E.ok?{data:void 0,loading:!1}:{data:void 0,loading:F!==f}}const Se=ye;function Pe(r){return h.createFragmentsClient({...r,inject:T})}Object.defineProperty(s,"FragmentsApiVersionError",{enumerable:!0,get:()=>h.FragmentsApiVersionError}),Object.defineProperty(s,"FragmentsAreaError",{enumerable:!0,get:()=>h.FragmentsAreaError}),Object.defineProperty(s,"FragmentsLoadError",{enumerable:!0,get:()=>h.FragmentsLoadError}),Object.defineProperty(s,"createSourceCache",{enumerable:!0,get:()=>h.createSourceCache}),s.AREA_UNRESOLVED=O,s.Area=ie,s.FragmentRenderer=de,s.FragmentStylesheet=M,s.FragmentsClientContext=P,s.FragmentsClientProvider=$,s.FragmentsProvider=me,s.InstanceIdContext=N,s.ModulesMapContext=A,s.ModulesMapProvider=D,s.ProjectPropertiesContext=b,s.createBrowserClient=Pe,s.defaultProjectProperties=_,s.injectStylesheet=T,s.useArea=U,s.useCssChunk=ce,s.useFragmentComponent=L,s.useFragmentMetrics=ne,s.useFragmentStylesheet=K,s.useProjectProperty=Ee,s.useSource=Se,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fragmentsx/runtime-react",
   "private": false,
-  "version": "0.2.0-dev-20260922090625",
+  "version": "0.2.0-dev-20260928114300",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -32,7 +32,7 @@
   },
   "dependencies": {
     "@graph-state/core": "^0.13.3",
-    "@fragmentsx/fragments-client": "0.2.0-dev-20260922090625"
+    "@fragmentsx/fragments-client": "0.2.0-dev-20260928114300"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",