@fragmentsx/runtime-react 0.2.0-dev-20260912055143 → 0.2.0-dev-20260928092325

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';
@@ -9,6 +11,14 @@ import { FragmentsLoadError } from '@fragmentsx/fragments-client';
 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.
@@ -20,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`
@@ -30,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;
@@ -55,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;
     };
 }
@@ -114,6 +141,8 @@ declare type ArtifactSchemaFieldAtDepth<D extends number> = D extends 0 ? never
     readonly type: "Array";
     readonly defaultValue?: readonly unknown[];
     readonly definition?: ArtifactSchemaFieldAtDepth<PrevDepth<D>>;
+}) | (ArtifactSchemaFieldCommon & {
+    readonly type: typeof NODE_SCHEMA_TYPE;
 });
 
 /**
@@ -138,7 +167,13 @@ declare type ArtifactSchemaFieldAtDepth<D extends number> = D extends 0 ? never
  * Зарезервированные типы словаря (`Event`, `Goal`, `ComponentInstance`,
  * `Date`, `'fragment'`) в объединение НЕ входят — этим `ArtifactSchema`
  * отличается от `SchemaFieldDescriptor` (`propsFromSchema.ts`), у которого
- * `type: VariableType` принимает любой тип словаря. Ключи `RESERVED_SCHEMA_KEYS`
+ * `type: VariableType` принимает любой тип словаря. Десятый вариант — `Node`
+ * (Phase 106, SLOT-01): дырка, содержимое которой кладёт не автор шаблона.
+ * `Node` живёт ТОЛЬКО здесь и в литеральной valibot-схеме гейта — в словарь
+ * `variableType` он не заводится (переменной типа «узел» не бывает, С-05), и
+ * поэтому не является ни разрешённым, ни зарезервированным типом словаря; у
+ * него нет `defaultValue` — значение по умолчанию пришлось бы сериализовать в
+ * схему, а узел не сериализуется. Ключи `RESERVED_SCHEMA_KEYS`
  * (`__proto__`/`constructor`/`prototype`/`_id`/`_type`/`parent`/`$ref`) типом
  * не выражаются и остаются структурным кодом `SCHEMA_RESERVED_KEY` в гейте —
  * TypeScript не умеет запретить конкретные строковые ключи объекта общим
@@ -197,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`, например изолированный юнит-тест компонента).
@@ -264,7 +301,7 @@ declare type FieldRequired<F extends SchemaFieldDescriptor, ConsiderDefault exte
  * индексированного доступа вне условного типа, который резолвился бы по
  * ограничению.
  */
-declare type FieldValueType<F extends SchemaFieldDescriptor, D extends number> = F["type"] extends "Enum" ? EnumFieldType<F> : F["type"] extends "Object" ? ObjectFieldType<F, D> : F["type"] extends "Array" ? ArrayFieldType<F, D> : ValueOfVariableType<F["type"]>;
+declare type FieldValueType<F extends SchemaFieldDescriptor, D extends number> = F["type"] extends "Enum" ? EnumFieldType<F> : F["type"] extends "Object" ? ObjectFieldType<F, D> : F["type"] extends "Array" ? ArrayFieldType<F, D> : F["type"] extends typeof NODE_SCHEMA_TYPE ? ValueOfNodeType : ValueOfVariableType<Extract<F["type"], VariableType>>;
 
 export declare interface FragmentMetrics {
     reachGoal: (info: ReachGoalInfo) => void;
@@ -291,6 +328,24 @@ export declare interface FragmentRendererProps {
     globalCssUrl?: string | null;
     /** Словарь project-переменных площадки (манифест области или блок данных preview); ключ — имя переменной, значение — голое (D-72-02). */
     projectProperties?: Record<string, unknown>;
+    /**
+     * Phase 105 план 105-05 (D-105-11): конус — список id (root + reachable),
+     * корень первым. Необязательное со значением по умолчанию «только
+     * собственный id» — так превью и любой прямой потребитель этого тела без
+     * настоящего конуса (до плана 105-08) продолжают работать без правки.
+     */
+    fragments?: number[];
+    /**
+     * Phase 106 (D-106-01/SLOT-04/план 05): дырки шаблона (`type: 'Node'`),
+     * заполненные данными варианта — дерево ссылок `{fragmentId, props, slots}`
+     * либо список таких ссылок (`ResolvedSlotPosition`). Необязательное —
+     * превью и любой прямой потребитель без слотов продолжают работать без
+     * правки (дырка рисует пустоту, как и без пропа).
+     */
+    slots?: Record<string, ResolvedSlotPosition>;
+    sources?: Record<string, AreaSourceTransport>;
+    /** Превью в песочнице не может и не должно ходить к источнику (D-111-22) — `offline` ставит SourceNetworkContext на всё поддерево. */
+    sourceNetwork?: SourceNetworkMode;
     onError?: (error: Error) => void;
 }
 
@@ -430,6 +485,27 @@ declare interface ModulesMapProviderProps {
     children: ReactNode;
 }
 
+/**
+ * Третья таблица проекции типа (D-97-03: три таблицы — три домена), рядом с
+ * `VARIABLE_TYPE_TO_TS` (`variableTypeToTs.ts`). `Node` не входит в словарь
+ * `variableType` (`constants/index.ts`) — переменной этого типа не бывает по
+ * С-05, сервер её не развернёт; дырка объявляется ТОЛЬКО в литерале схемы
+ * артефакта. Сливать эту таблицу с `VARIABLE_TYPE_TO_TS` ЗАПРЕЩЕНО — тот же
+ * запрет, что охраняет разделение `VARIABLE_TYPE_TO_TS` от соседних реестров
+ * `VariableType → valibot-схема` (D-97-03).
+ *
+ * `value` несёт носитель типа `ReactNode` — импорт типовый, рантайм-импорта
+ * React в пакете `@fragmentsx/definition` не появляется.
+ */
+declare const NODE_SCHEMA_TYPE: "Node";
+
+declare const NODE_TYPE_TO_TS: {
+    Node: {
+        ts: string;
+        value: ReactNode;
+    };
+};
+
 /**
  * Тип поля `Object`. Вырожденный вердикт — литеральный `{}` (пустой
  * объектный тип БЕЗ индексной сигнатуры), когда `fields` отсутствует или
@@ -445,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];
 
 /**
@@ -534,7 +626,7 @@ export declare interface ReachGoalInfo {
  * тип значения, которое мутируется в рантайме.
  */
 export declare interface SchemaFieldDescriptor {
-    readonly type: VariableType;
+    readonly type: VariableType | typeof NODE_SCHEMA_TYPE;
     readonly required?: boolean;
     readonly defaultValue?: unknown;
     /** `Enum` — варианты значения; `PropsFromSchema` сужает до `cases[].id`. */
@@ -553,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).
  *
@@ -648,6 +759,21 @@ export declare interface UseAreaResult {
      * `null` — backend не отдал global reset; baseline применяться не будет.
      */
     globalCssUrl: string | null;
+    /**
+     * Phase 105 план 105-05 (D-105-11): конус — список id (root + reachable),
+     * корень первым. `$area` уже нормализует отсутствие поля у backend'а в
+     * `[]` — потребитель (`Area`/`FragmentRenderer`) не делает optional-проверку.
+     */
+    fragments: number[];
+    /**
+     * Phase 106 (D-106-01/SLOT-04/план 05): дырки шаблона (`type: 'Node'`),
+     * заполненные данными варианта — дерево ссылок `{fragmentId, props, slots}`
+     * либо список таких ссылок (`ResolvedSlotPosition`). `$area` уже
+     * нормализует отсутствие поля у backend'а в `{}` — потребитель
+     * (`Area`/`FragmentRenderer`) не делает optional-проверку.
+     */
+    slots: Record<string, ResolvedSlotPosition>;
+    sources: Record<string, AreaSourceTransport>;
 }
 
 /**
@@ -713,6 +839,18 @@ 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"];
+
 /** Носитель типа поля-НЕ-Enum/Object/Array — читает `value`-проекцию таблицы `VARIABLE_TYPE_TO_TS` (носитель, значение не используется, только тип). */
 declare type ValueOfVariableType<T extends VariableType> = (typeof VARIABLE_TYPE_TO_TS)[T]["value"];
 

package/dist/index.es.js

@@ -1,128 +1,155 @@
-import { jsx as l, jsxs as j, Fragment as I } from "react/jsx-runtime";
-import { createContext as v, useContext as f, useMemo as P, useState as L, useEffect as F, useLayoutEffect as N, version as k, Component as b, Suspense as A } from "react";
-import { AREA_GLOBAL_CSS_KEY as p, fragmentCssKey as O, fragmentFontsKey as U, createFragmentsClient as B } from "@fragmentsx/fragments-client";
-import { FragmentsApiVersionError as oe, FragmentsAreaError as ie, FragmentsLoadError as fe } from "@fragmentsx/fragments-client";
-const m = 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
 );
-m.displayName = "FragmentsClientContext";
-function D(r) {
-  return /* @__PURE__ */ l(m.Provider, { value: r.value, children: r.children });
+k.displayName = "FragmentsClientContext";
+function Ae(r) {
+  return /* @__PURE__ */ d(k.Provider, { value: r.value, children: r.children });
 }
-function K() {
-  return f(m);
+function ke() {
+  return v(k);
 }
-const S = v(null);
-S.displayName = "InstanceIdContext";
-const g = v(
+const z = A(null);
+z.displayName = "InstanceIdContext";
+const F = A(
   null
 );
-g.displayName = "ModulesMapContext";
-function V({
+F.displayName = "ModulesMapContext";
+function Ce({
   value: r,
   children: e
 }) {
-  return /* @__PURE__ */ l(g.Provider, { value: r, children: e });
+  return /* @__PURE__ */ d(F.Provider, { value: r, children: e });
 }
-function re() {
-  const r = f(m);
-  return P(
+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 G(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 Y = typeof window < "u", x = Object.freeze({
+const $ = typeof window < "u", L = Object.freeze({
   rootFragmentId: 0,
   variantId: null,
   props: {},
   projectProperties: {},
-  globalCssUrl: null
+  globalCssUrl: null,
+  // Phase 105 план 105-05: пустой конус — форма возврата хука не меняется,
+  // обёртка рендера (задача 3) остаётся без атрибута class на этом сентинеле.
+  fragments: [],
+  // Phase 106: пустой словарь слотов — сентинел не разворачивает ни одной ссылки.
+  slots: {},
+  sources: {}
 });
-function $(r, e) {
-  const n = f(m);
-  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 s = (e == null ? void 0 : e.suspense) ?? !0, d = (e == null ? void 0 : e.pause) === !0 || !Y && (e == null ? void 0 : e.ssr) === !1, a = (e == null ? void 0 : e.timeout) != null ? { timeout: e.timeout } : void 0, [, u] = L(0);
-  if (F(() => {
-    if (s || d) return;
-    let c = !0;
-    return Promise.resolve(t.resolve(r, a)).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(() => {
-      c && u((o) => o + 1);
+      u && i((E) => E + 1);
     }), () => {
-      c = !1;
+      u = !1;
     };
-  }, [r, s, e == null ? void 0 : e.pause, e == null ? void 0 : e.timeout, e == null ? void 0 : e.ssr]), s)
-    return d ? x : (t.has(r) || Promise.resolve(t.resolve(r, a)).catch(() => {
-    }), t.read(r));
-  if (d)
+  }, [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 (c) {
+      return { status: "ready", data: c.read(r), error: null };
+    } catch (l) {
       return {
         status: "not-found",
         data: null,
-        error: c instanceof Error ? c : new Error(String(c))
+        error: l instanceof Error ? l : new Error(String(l))
       };
     }
-  return Promise.resolve(t.resolve(r, a)).catch(() => {
+  return Promise.resolve(c.resolve(r, a)).catch(() => {
   }), { status: "loading", data: null, error: null };
 }
-const w = typeof window < "u", z = 3e3, h = /* @__PURE__ */ new Map(), M = (r, e) => {
-  if (!w) {
-    const i = () => {
+const G = typeof window < "u", we = 3e3, P = /* @__PURE__ */ new Map(), Y = (r, e) => {
+  if (!G) {
+    const h = () => {
     };
-    return i.loaded = Promise.resolve(), i;
+    return h.loaded = Promise.resolve(), h;
   }
-  const n = h.get(e);
-  if (n) {
-    n.refCount += 1;
-    const i = () => {
-      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 i.loaded = n.loaded, i;
+    return h.loaded = t.loaded, h;
   }
-  const t = document.createElement("link");
-  t.rel = "stylesheet", t.href = r, t.setAttribute("data-fragment-key", e);
+  const n = document.createElement("link");
+  n.rel = "stylesheet", n.href = r, n.setAttribute("data-fragment-key", e);
   let s;
-  const d = new Promise((i) => {
-    s = i;
-  }), a = () => {
-    c(), s();
-  }, u = setTimeout(a, z), c = () => clearTimeout(u);
-  t.addEventListener("load", a), t.addEventListener("error", a), document.head.appendChild(t);
-  const o = { refCount: 1, linkEl: t, loaded: d, clearReadyTimer: c };
-  h.set(e, o);
-  const y = () => {
-    o.refCount -= 1, o.refCount === 0 && (o.clearReadyTimer(), o.linkEl.remove(), h.delete(e));
+  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 y.loaded = d, y;
-}, H = w ? N : F;
-function J(r, e) {
-  H(() => M(r, e), [r, e]);
+  return E.loaded = a, E;
+}, Fe = G ? se : y;
+function Te(r, e) {
+  Fe(() => Y(r, e), [r, e]);
 }
-const q = parseInt(k.split(".")[0], 10), Q = q >= 19;
-function E({
+const Re = parseInt(ue.split(".")[0], 10), _e = Re >= 19;
+function D({
   href: r,
   fragmentKey: e
 }) {
-  return Q ? /* @__PURE__ */ l(
+  return _e ? /* @__PURE__ */ d(
     "link",
     {
       rel: "stylesheet",
@@ -130,122 +157,237 @@ function E({
       precedence: "default",
       "data-fragment-key": e
     }
-  ) : (J(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 te(r) {
+function Q(r, e, t) {
+  return typeof r == "function" ? r(e, t) : r ?? null;
 }
-const R = {}, C = v(null);
-C.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, s;
-    process.env.NODE_ENV !== "production" && console.error("[fragments] Area error:", e, n.componentStack), (s = (t = this.props).onError) == null || s.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 X(r, e) {
+  if (!r) return {};
+  const t = {};
+  for (const n of Object.keys(r))
+    t[n] = Oe(r[n], e);
+  return t;
+}
+function Oe(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 s = X(r.slots, e);
+  return le(n, { key: t, ...r.props, ...s });
 }
-const _ = ({
+const Z = ({
   fragmentId: r,
   props: e,
-  globalCssUrl: n = null,
-  projectProperties: t = R
+  globalCssUrl: t = null,
+  projectProperties: n = J,
+  fragments: s = [r],
+  slots: a,
+  sources: i = q,
+  sourceNetwork: c = "live"
 }) => {
-  const s = G(r), a = K().$fragments, u = a == null ? void 0 : a.getRef(r), c = a == null ? void 0 : a.getScopeClass(r), o = e ?? {};
-  return /* @__PURE__ */ j(I, { children: [
-    n != null && /* @__PURE__ */ l(
-      E,
+  const l = Pe(r), u = v(F);
+  if (!u)
+    throw new Error("[FragmentRendererInner] No ModulesMapProvider in tree");
+  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: p
+        href: t,
+        fragmentKey: fe
       }
     ),
-    u && /* @__PURE__ */ l(
-      E,
-      {
-        href: u.cssUrl,
-        fragmentKey: O(r)
-      }
-    ),
-    (u == null ? void 0 : u.fontsUrl) != null && /* @__PURE__ */ l(
-      E,
-      {
-        href: u.fontsUrl,
-        fragmentKey: U(r)
-      }
-    ),
-    /* @__PURE__ */ l(C.Provider, { value: t, children: /* @__PURE__ */ l(S.Provider, { value: null, children: /* @__PURE__ */ l(
+    s.map((m) => {
+      const g = me(m);
+      return g ? /* @__PURE__ */ d(
+        D,
+        {
+          href: g,
+          fragmentKey: he(m)
+        },
+        m
+      ) : null;
+    }),
+    /* @__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: c,
+        className: o,
         style: { display: "contents" },
-        children: /* @__PURE__ */ l(s, { ...o })
+        children: /* @__PURE__ */ d(l, { ...h })
       }
-    ) }) })
+    ) }) }) }) })
   ] });
-}, ne = ({ onError: r, ...e }) => /* @__PURE__ */ l(A, { fallback: null, children: /* @__PURE__ */ l(T, { onError: r, children: /* @__PURE__ */ l(_, { ...e }) }) }), W = ({ areaCode: r, options: e }) => {
-  if ((e == null ? void 0 : e.pause) === !0)
-    return null;
-  const n = $(r, {
-    timeout: e == null ? void 0 : e.timeout,
-    ssr: e == null ? void 0 : e.ssr
-  });
-  if (n === x)
+}, 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 { rootFragmentId: t, props: s, projectProperties: d, globalCssUrl: a } = n, u = typeof (e == null ? void 0 : e.props) == "function" ? e.props(s) : e != null && e.props ? { ...s, ...e.props } : s;
-  return /* @__PURE__ */ l(
-    _,
+  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,
-      props: u,
-      globalCssUrl: a,
-      projectProperties: d
+      fragmentId: a,
+      props: o,
+      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)
   );
-}, le = ({ areaCode: r, options: e }) => /* @__PURE__ */ l(A, { fallback: (e == null ? void 0 : e.fallback) ?? null, children: /* @__PURE__ */ l(T, { onError: e == null ? void 0 : e.onError, children: /* @__PURE__ */ l(W, { areaCode: r, options: e }) }) });
-function ae({ client: r, children: e }) {
-  const n = P(
+};
+function He({ client: r, children: e }) {
+  const t = N(
     () => ({
-      read: (t) => r.$fragments.read(t)
+      read: (n) => r.$fragments.read(n)
     }),
     [r]
   );
-  return /* @__PURE__ */ l(D, { value: r, children: /* @__PURE__ */ l(V, { 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 se(r) {
-  return (f(C) ?? 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 ue(r) {
-  return B({ ...r, inject: M });
+const Ge = $e;
+function Ye(r) {
+  return Se({ ...r, inject: Y });
 }
 export {
-  x as AREA_UNRESOLVED,
-  le as Area,
-  ne as FragmentRenderer,
-  E as FragmentStylesheet,
-  oe as FragmentsApiVersionError,
-  ie as FragmentsAreaError,
-  m as FragmentsClientContext,
-  D as FragmentsClientProvider,
-  fe as FragmentsLoadError,
-  ae as FragmentsProvider,
-  S as InstanceIdContext,
-  g as ModulesMapContext,
-  V as ModulesMapProvider,
-  C as ProjectPropertiesContext,
-  ue as createBrowserClient,
-  R as defaultProjectProperties,
-  M as injectStylesheet,
-  $ as useArea,
-  te as useCssChunk,
-  G as useFragmentComponent,
-  re as useFragmentMetrics,
-  J as useFragmentStylesheet,
-  se 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(t,s){typeof exports=="object"&&typeof module<"u"?s(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"],s):(t=typeof globalThis<"u"?globalThis:t||self,s(t.FragmentsRuntimeReact={},t.jsxRuntime,t.React,t.fragmentsClient))})(this,function(t,s,u,m){"use strict";const g=u.createContext(null);g.displayName="FragmentsClientContext";function M(r){return s.jsx(g.Provider,{value:r.value,children:r.children})}function N(){return u.useContext(g)}const y=u.createContext(null);y.displayName="InstanceIdContext";const E=u.createContext(null);E.displayName="ModulesMapContext";function j({value:r,children:e}){return s.jsx(E.Provider,{value:r,children:e})}function k(){const r=u.useContext(g);return u.useMemo(()=>({reachGoal:e=>{var l,n;(n=(l=r==null?void 0:r.$metrics)==null?void 0:l.reachGoal)==null||n.call(l,e)}}),[r])}function w(r){const e=u.useContext(E);if(!e)throw new Error("[useFragmentComponent] No ModulesMapProvider in tree");return e.read(r)}const x=typeof window<"u",F=Object.freeze({rootFragmentId:0,variantId:null,props:{},projectProperties:{},globalCssUrl:null});function T(r,e){const l=u.useContext(g);if(!l)throw new Error("[useArea] No FragmentsClientProvider in tree");const n=l.$area;if(!(n!=null&&n.read))throw new Error("[useArea] $area plugin not mounted");const c=(e==null?void 0:e.suspense)??!0,i=(e==null?void 0:e.pause)===!0||!x&&(e==null?void 0:e.ssr)===!1,a=(e==null?void 0:e.timeout)!=null?{timeout:e.timeout}:void 0,[,d]=u.useState(0);if(u.useEffect(()=>{if(c||i)return;let o=!0;return Promise.resolve(n.resolve(r,a)).catch(()=>{}).finally(()=>{o&&d(f=>f+1)}),()=>{o=!1}},[r,c,e==null?void 0:e.pause,e==null?void 0:e.timeout,e==null?void 0:e.ssr]),c)return i?F:(n.has(r)||Promise.resolve(n.resolve(r,a)).catch(()=>{}),n.read(r));if(i)return{status:"idle",data:null,error:null};if(n.has(r))try{return{status:"ready",data:n.read(r),error:null}}catch(o){return{status:"not-found",data:null,error:o instanceof Error?o:new Error(String(o))}}return Promise.resolve(n.resolve(r,a)).catch(()=>{}),{status:"loading",data:null,error:null}}const _=typeof window<"u",U=3e3,v=new Map,A=(r,e)=>{if(!_){const h=()=>{};return h.loaded=Promise.resolve(),h}const l=v.get(e);if(l){l.refCount+=1;const h=()=>{l.refCount-=1,l.refCount===0&&(l.clearReadyTimer(),l.linkEl.remove(),v.delete(e))};return h.loaded=l.loaded,h}const n=document.createElement("link");n.rel="stylesheet",n.href=r,n.setAttribute("data-fragment-key",e);let c;const i=new Promise(h=>{c=h}),a=()=>{o(),c()},d=setTimeout(a,U),o=()=>clearTimeout(d);n.addEventListener("load",a),n.addEventListener("error",a),document.head.appendChild(n);const f={refCount:1,linkEl:n,loaded:i,clearReadyTimer:o};v.set(e,f);const O=()=>{f.refCount-=1,f.refCount===0&&(f.clearReadyTimer(),f.linkEl.remove(),v.delete(e))};return O.loaded=i,O},B=_?u.useLayoutEffect:u.useEffect;function b(r,e){B(()=>A(r,e),[r,e])}const D=parseInt(u.version.split(".")[0],10)>=19;function C({href:r,fragmentKey:e}){return D?s.jsx("link",{rel:"stylesheet",href:r,precedence:"default","data-fragment-key":e}):(b(r,e),null)}function V(r){}const S={},P=u.createContext(null);P.displayName="ProjectPropertiesContext";class I extends u.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,l){var n,c;process.env.NODE_ENV!=="production"&&console.error("[fragments] Area error:",e,l.componentStack),(c=(n=this.props).onError)==null||c.call(n,e)}render(){return this.state.hasError?null:this.props.children}}const L=({fragmentId:r,props:e,globalCssUrl:l=null,projectProperties:n=S})=>{const c=w(r),a=N().$fragments,d=a==null?void 0:a.getRef(r),o=a==null?void 0:a.getScopeClass(r),f=e??{};return s.jsxs(s.Fragment,{children:[l!=null&&s.jsx(C,{href:l,fragmentKey:m.AREA_GLOBAL_CSS_KEY}),d&&s.jsx(C,{href:d.cssUrl,fragmentKey:m.fragmentCssKey(r)}),(d==null?void 0:d.fontsUrl)!=null&&s.jsx(C,{href:d.fontsUrl,fragmentKey:m.fragmentFontsKey(r)}),s.jsx(P.Provider,{value:n,children:s.jsx(y.Provider,{value:null,children:s.jsx("div",{className:o,style:{display:"contents"},children:s.jsx(c,{...f})})})})]})},K=({onError:r,...e})=>s.jsx(u.Suspense,{fallback:null,children:s.jsx(I,{onError:r,children:s.jsx(L,{...e})})}),q=({areaCode:r,options:e})=>{if((e==null?void 0:e.pause)===!0)return null;const l=T(r,{timeout:e==null?void 0:e.timeout,ssr:e==null?void 0:e.ssr});if(l===F)return null;const{rootFragmentId:n,props:c,projectProperties:i,globalCssUrl:a}=l,d=typeof(e==null?void 0:e.props)=="function"?e.props(c):e!=null&&e.props?{...c,...e.props}:c;return s.jsx(L,{fragmentId:n,props:d,globalCssUrl:a,projectProperties:i})},G=({areaCode:r,options:e})=>s.jsx(u.Suspense,{fallback:(e==null?void 0:e.fallback)??null,children:s.jsx(I,{onError:e==null?void 0:e.onError,children:s.jsx(q,{areaCode:r,options:e})})});function R({client:r,children:e}){const l=u.useMemo(()=>({read:n=>r.$fragments.read(n)}),[r]);return s.jsx(M,{value:r,children:s.jsx(j,{value:l,children:e})})}function Y(r){return(u.useContext(P)??S)[r]}function J(r){return m.createFragmentsClient({...r,inject:A})}Object.defineProperty(t,"FragmentsApiVersionError",{enumerable:!0,get:()=>m.FragmentsApiVersionError}),Object.defineProperty(t,"FragmentsAreaError",{enumerable:!0,get:()=>m.FragmentsAreaError}),Object.defineProperty(t,"FragmentsLoadError",{enumerable:!0,get:()=>m.FragmentsLoadError}),t.AREA_UNRESOLVED=F,t.Area=G,t.FragmentRenderer=K,t.FragmentStylesheet=C,t.FragmentsClientContext=g,t.FragmentsClientProvider=M,t.FragmentsProvider=R,t.InstanceIdContext=y,t.ModulesMapContext=E,t.ModulesMapProvider=j,t.ProjectPropertiesContext=P,t.createBrowserClient=J,t.defaultProjectProperties=S,t.injectStylesheet=A,t.useArea=T,t.useCssChunk=V,t.useFragmentComponent=w,t.useFragmentMetrics=k,t.useFragmentStylesheet=b,t.useProjectProperty=Y,Object.defineProperty(t,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-20260912055143",
+  "version": "0.2.0-dev-20260928092325",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -32,7 +32,7 @@
   },
   "dependencies": {
     "@graph-state/core": "^0.13.3",
-    "@fragmentsx/fragments-client": "0.2.0-dev-20260912055143"
+    "@fragmentsx/fragments-client": "0.2.0-dev-20260928092325"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",