@cmssy/react 18.0.0 → 19.1.0

package/dist/index.cjs

@@ -407,7 +407,9 @@ async function resolveCmssyLayoutSlot(config, options) {
     path,
     locale: explicitLocale,
     retry,
-    fetch: fetchImpl
+    fetch: fetchImpl,
+    layoutStore,
+    onTransientLayoutFailure = "throw"
   } = options;
   const requestOptions = {
     retry: retry ?? "build",
@@ -418,12 +420,31 @@ async function resolveCmssyLayoutSlot(config, options) {
   const locale$1 = explicitLocale ?? fromPath.locale;
   const slugSegments = fromPath.path ?? [];
   const page = layoutSlotPage(explicitPage ?? "/" + slugSegments.join("/"));
-  const groups = await internal.fetchLayouts(config, page.slug, {
-    previewSecret: editMode || preview ? config.draftSecret : void 0,
-    ...requestOptions
-  });
+  const previewSecret = editMode || preview ? config.draftSecret : void 0;
+  let groups = [];
+  let unavailable;
+  try {
+    groups = await internal.readThroughLayoutStore(
+      layoutStore,
+      internal.layoutStoreKey(config, page.slug, previewSecret),
+      () => internal.fetchLayouts(config, page.slug, {
+        previewSecret,
+        ...requestOptions
+      })
+    );
+  } catch (error) {
+    if (onTransientLayoutFailure !== "degrade" || !core.isTransientRequestError(error)) {
+      throw error;
+    }
+    unavailable = {
+      status: error.status,
+      ...error.retryAfterMs !== void 0 ? { retryAfterMs: error.retryAfterMs } : {},
+      message: error.message
+    };
+  }
   const base = {
     groups,
+    ...unavailable ? { unavailable } : {},
     settings: groups.find((g) => g.region === region)?.settings ?? null,
     page,
     locale: locale$1,
@@ -504,6 +525,56 @@ async function CmssyServerLayout({
     })
   ) });
 }
+var cardStyle2 = {
+  boxSizing: "border-box",
+  margin: "8px 0",
+  padding: "12px 16px",
+  border: "1px dashed #f59e0b",
+  borderRadius: "8px",
+  background: "rgba(245, 158, 11, 0.08)",
+  color: "#b45309",
+  fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace",
+  fontSize: "13px",
+  lineHeight: 1.5,
+  textAlign: "left"
+};
+var headingStyle2 = {
+  fontWeight: 700,
+  marginBottom: "4px"
+};
+var messageStyle2 = {
+  whiteSpace: "pre-wrap",
+  overflowWrap: "anywhere"
+};
+function retryHint(retryAfterMs) {
+  if (retryAfterMs === void 0) return "";
+  return ` Try again in ${Math.max(1, Math.ceil(retryAfterMs / 1e3))}s.`;
+}
+function LayoutUnavailableCard({
+  region,
+  unavailable
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "alert",
+      "data-cmssy-layout-unavailable": region,
+      "data-cmssy-layout-status": unavailable.status,
+      style: cardStyle2,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: headingStyle2, children: [
+          'Layout region "',
+          region,
+          '" could not be loaded (',
+          unavailable.status,
+          ").",
+          retryHint(unavailable.retryAfterMs)
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: messageStyle2, children: unavailable.message })
+      ]
+    }
+  );
+}
 async function resolveCmssyLayout(config, options) {
   const { editable: Editable, ...slotOptions } = options;
   if (slotOptions.editMode && !Editable) {
@@ -511,10 +582,10 @@ async function resolveCmssyLayout(config, options) {
       "cmssy: resolveCmssyLayout needs an `editable` component in edit mode - the editor bridge lives on the client"
     );
   }
-  const resolved = await resolveCmssyLayoutSlot(
-    config,
-    slotOptions
-  );
+  const resolved = await resolveCmssyLayoutSlot(config, {
+    onTransientLayoutFailure: "degrade",
+    ...slotOptions
+  });
   const { groups, settings, page, locale, defaultLocale, enabledLocales } = resolved;
   const shared = {
     groups,
@@ -525,25 +596,41 @@ async function resolveCmssyLayout(config, options) {
     enabledLocales,
     appContext: options.appContext
   };
-  const element = slotOptions.editMode && Editable ? /* @__PURE__ */ jsxRuntime.jsx(
-    Editable,
-    {
-      ...shared,
-      edit: { editorOrigin: resolved.editorOrigin ?? "" },
-      data: resolved.data,
-      resolvedContent: resolved.resolvedContent
-    }
-  ) : /* @__PURE__ */ jsxRuntime.jsx(
-    CmssyServerLayout,
-    {
-      ...shared,
-      blocks: options.blocks,
-      config,
-      preview: slotOptions.preview
-    }
-  );
+  let element;
+  if (slotOptions.editMode && Editable) {
+    const editable = /* @__PURE__ */ jsxRuntime.jsx(
+      Editable,
+      {
+        ...shared,
+        edit: { editorOrigin: resolved.editorOrigin ?? "" },
+        data: resolved.data,
+        resolvedContent: resolved.resolvedContent
+      }
+    );
+    element = resolved.unavailable ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        LayoutUnavailableCard,
+        {
+          region: options.region,
+          unavailable: resolved.unavailable
+        }
+      ),
+      editable
+    ] }) : editable;
+  } else {
+    element = /* @__PURE__ */ jsxRuntime.jsx(
+      CmssyServerLayout,
+      {
+        ...shared,
+        blocks: options.blocks,
+        config,
+        preview: slotOptions.preview
+      }
+    );
+  }
   return {
     groups,
+    ...resolved.unavailable ? { unavailable: resolved.unavailable } : {},
     settings,
     page,
     locale,
@@ -955,6 +1042,10 @@ Object.defineProperty(exports, "CmssyRequestError", {
   enumerable: true,
   get: function () { return core.CmssyRequestError; }
 });
+Object.defineProperty(exports, "MediaType", {
+  enumerable: true,
+  get: function () { return core.MediaType; }
+});
 Object.defineProperty(exports, "PROTOCOL_VERSION", {
   enumerable: true,
   get: function () { return core.PROTOCOL_VERSION; }
@@ -983,6 +1074,18 @@ Object.defineProperty(exports, "mediaAlt", {
   enumerable: true,
   get: function () { return core.mediaAlt; }
 });
+Object.defineProperty(exports, "mediaDuration", {
+  enumerable: true,
+  get: function () { return core.mediaDuration; }
+});
+Object.defineProperty(exports, "mediaType", {
+  enumerable: true,
+  get: function () { return core.mediaType; }
+});
+Object.defineProperty(exports, "mediaTypeValues", {
+  enumerable: true,
+  get: function () { return core.mediaTypeValues; }
+});
 Object.defineProperty(exports, "mediaUrl", {
   enumerable: true,
   get: function () { return core.mediaUrl; }

package/dist/index.d.cts

@@ -1,9 +1,10 @@
 import { CmssyPageData, CmssyClientConfig, CmssyFormDefinition, CmssyBlockAuthContext, CmssyBlockWorkspace, CmssyLayoutGroup, CmssyBlockPage, RetryOption, FetchLike, CmssyConfig, CmssyRegionOf, CmssyRegionSettingsOf, RawBlock, CmssyBlockContext } from '@cmssy/core';
-export { AppToEditorMessage, BlockMeta, BlockPropsSchema, BlockRect, BlockSchema, BoundsMessage, BuildBlockContextExtra, ClickMessage, CmssyBlockAuthContext, CmssyBlockContext, CmssyBlockMember, CmssyBlockPage, CmssyBlockWorkspace, CmssyBranding, CmssyClient, CmssyClientConfig, CmssyFormDefinition, CmssyFormField, CmssyFormSettings, CmssyFormSubmitResponse, CmssyLayout, CmssyLayoutGroup, CmssyLocaleContext, CmssyLocalizedValue, CmssyModelDefinition, CmssyModelRecord, CmssyPageData, CmssyPageMeta, CmssyPageSummary, CmssyRecordList, CmssyRegion, CmssyRegionOf, CmssyRegionSettings, CmssyRegionSettingsOf, CmssyRequestError, CmssyRetryMode, CmssySiteConfig, CmssyTypedDocument, EditorToAppMessage, FetchLike, FetchLikeResponse, FetchPageOptions, FieldControl, FieldDefinition, FieldType, GraphqlRequestOptions, InferBlockContent, LayoutRegion, LayoutRegionId, MediaLike, PROTOCOL_VERSION, ParentReadyMessage, PatchMessage, PostTarget, QueryScopedOptions, RawBlock, RawLayoutBlock, ReadyMessage, RetryOption, RetryPolicy, SelectMessage, SubmitFormInput, TypedField, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
+export { AppToEditorMessage, BlockMeta, BlockPropsSchema, BlockRect, BlockSchema, BoundsMessage, BuildBlockContextExtra, ClickMessage, CmssyBlockAuthContext, CmssyBlockContext, CmssyBlockMember, CmssyBlockPage, CmssyBlockWorkspace, CmssyBranding, CmssyClient, CmssyClientConfig, CmssyFormDefinition, CmssyFormField, CmssyFormSettings, CmssyFormSubmitResponse, CmssyLayout, CmssyLayoutGroup, CmssyLocaleContext, CmssyLocalizedValue, CmssyModelDefinition, CmssyModelRecord, CmssyPageData, CmssyPageMeta, CmssyPageSummary, CmssyRecordList, CmssyRegion, CmssyRegionOf, CmssyRegionSettings, CmssyRegionSettingsOf, CmssyRequestError, CmssyRetryMode, CmssySiteConfig, CmssyTypedDocument, EditorToAppMessage, FetchLike, FetchLikeResponse, FetchPageOptions, FieldControl, FieldDefinition, FieldType, GraphqlRequestOptions, InferBlockContent, LayoutRegion, LayoutRegionId, MediaLike, MediaType, PROTOCOL_VERSION, ParentReadyMessage, PatchMessage, PostTarget, QueryScopedOptions, RawBlock, RawLayoutBlock, ReadyMessage, RetryOption, RetryPolicy, SelectMessage, SubmitFormInput, TypedField, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaDuration, mediaType, mediaTypeValues, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
 import { B as BlockDefinition, L as LayoutBlockPage, a as BlockMap } from './resolve-block-data-Bkracpae.cjs';
 export { b as BlockProps, E as EditorBlockData, R as ResolveBlockDataOptions, c as ResolveLayoutBlockDataOptions, d as buildBlockMap, e as defineBlock, r as resolveEditorBlockData, f as resolveEditorLayoutBlockData } from './resolve-block-data-Bkracpae.cjs';
 import { FieldDefinition } from '@cmssy/types';
 export { FieldCondition, FieldConditionGroup, FieldConditionLogic } from '@cmssy/types';
+import { CmssyLayoutStore } from '@cmssy/core/internal';
 export { buildBlockContext } from '@cmssy/core/internal';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactElement, ComponentType } from 'react';
@@ -35,6 +36,8 @@ interface ResolveCmssyLayoutSlotBase {
     appContext?: Record<string, unknown>;
     retry?: RetryOption;
     fetch?: FetchLike;
+    layoutStore?: CmssyLayoutStore;
+    onTransientLayoutFailure?: "throw" | "degrade";
 }
 type CmssyLayoutSlotLocaleSource = {
     path: string[];
@@ -44,8 +47,14 @@ type CmssyLayoutSlotLocaleSource = {
     path?: undefined;
 };
 type ResolveCmssyLayoutSlotOptions = ResolveCmssyLayoutSlotBase & CmssyLayoutSlotLocaleSource;
+interface CmssyLayoutUnavailable {
+    status: number;
+    retryAfterMs?: number;
+    message: string;
+}
 interface CmssyLayoutSlotResolution {
     groups: CmssyLayoutGroup[];
+    unavailable?: CmssyLayoutUnavailable;
     settings: Record<string, unknown> | null;
     page: CmssyBlockPage;
     locale: string;
@@ -78,6 +87,7 @@ type ResolveCmssyLayoutOptions<C extends CmssyConfig, P extends CmssyRegionOf<C>
 };
 interface CmssyLayoutResolution<C extends CmssyConfig = CmssyConfig, P extends CmssyRegionOf<C> = CmssyRegionOf<C>> {
     groups: CmssyLayoutGroup[];
+    unavailable?: CmssyLayoutUnavailable;
     settings: CmssyRegionSettingsOf<C, P> | null;
     page: CmssyBlockPage;
     locale: string;
@@ -160,4 +170,4 @@ interface UnknownBlockProps {
 }
 declare function UnknownBlock({ type }: UnknownBlockProps): react_jsx_runtime.JSX.Element;
 
-export { BlockDefinition, BlockMap, CmssyBlock, type CmssyBlockProps, CmssyBlocks, type CmssyBlocksProps, type CmssyLayoutEditableProps, CmssyLayoutRegion, type CmssyLayoutRegionProps, type CmssyLayoutResolution, type CmssyLayoutSlotLocaleSource, type CmssyLayoutSlotResolution, CmssyServerLayout, type CmssyServerLayoutProps, CmssyServerPage, type CmssyServerPageProps, LayoutBlockPage, type ResolveCmssyLayoutOptions, type ResolveCmssyLayoutSlotOptions, UnknownBlock, type UnknownBlockProps, resolveCmssyLayout, resolveCmssyLayoutSlot };
+export { BlockDefinition, BlockMap, CmssyBlock, type CmssyBlockProps, CmssyBlocks, type CmssyBlocksProps, type CmssyLayoutEditableProps, CmssyLayoutRegion, type CmssyLayoutRegionProps, type CmssyLayoutResolution, type CmssyLayoutSlotLocaleSource, type CmssyLayoutSlotResolution, type CmssyLayoutUnavailable, CmssyServerLayout, type CmssyServerLayoutProps, CmssyServerPage, type CmssyServerPageProps, LayoutBlockPage, type ResolveCmssyLayoutOptions, type ResolveCmssyLayoutSlotOptions, UnknownBlock, type UnknownBlockProps, resolveCmssyLayout, resolveCmssyLayoutSlot };

package/dist/index.d.ts

@@ -1,9 +1,10 @@
 import { CmssyPageData, CmssyClientConfig, CmssyFormDefinition, CmssyBlockAuthContext, CmssyBlockWorkspace, CmssyLayoutGroup, CmssyBlockPage, RetryOption, FetchLike, CmssyConfig, CmssyRegionOf, CmssyRegionSettingsOf, RawBlock, CmssyBlockContext } from '@cmssy/core';
-export { AppToEditorMessage, BlockMeta, BlockPropsSchema, BlockRect, BlockSchema, BoundsMessage, BuildBlockContextExtra, ClickMessage, CmssyBlockAuthContext, CmssyBlockContext, CmssyBlockMember, CmssyBlockPage, CmssyBlockWorkspace, CmssyBranding, CmssyClient, CmssyClientConfig, CmssyFormDefinition, CmssyFormField, CmssyFormSettings, CmssyFormSubmitResponse, CmssyLayout, CmssyLayoutGroup, CmssyLocaleContext, CmssyLocalizedValue, CmssyModelDefinition, CmssyModelRecord, CmssyPageData, CmssyPageMeta, CmssyPageSummary, CmssyRecordList, CmssyRegion, CmssyRegionOf, CmssyRegionSettings, CmssyRegionSettingsOf, CmssyRequestError, CmssyRetryMode, CmssySiteConfig, CmssyTypedDocument, EditorToAppMessage, FetchLike, FetchLikeResponse, FetchPageOptions, FieldControl, FieldDefinition, FieldType, GraphqlRequestOptions, InferBlockContent, LayoutRegion, LayoutRegionId, MediaLike, PROTOCOL_VERSION, ParentReadyMessage, PatchMessage, PostTarget, QueryScopedOptions, RawBlock, RawLayoutBlock, ReadyMessage, RetryOption, RetryPolicy, SelectMessage, SubmitFormInput, TypedField, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
+export { AppToEditorMessage, BlockMeta, BlockPropsSchema, BlockRect, BlockSchema, BoundsMessage, BuildBlockContextExtra, ClickMessage, CmssyBlockAuthContext, CmssyBlockContext, CmssyBlockMember, CmssyBlockPage, CmssyBlockWorkspace, CmssyBranding, CmssyClient, CmssyClientConfig, CmssyFormDefinition, CmssyFormField, CmssyFormSettings, CmssyFormSubmitResponse, CmssyLayout, CmssyLayoutGroup, CmssyLocaleContext, CmssyLocalizedValue, CmssyModelDefinition, CmssyModelRecord, CmssyPageData, CmssyPageMeta, CmssyPageSummary, CmssyRecordList, CmssyRegion, CmssyRegionOf, CmssyRegionSettings, CmssyRegionSettingsOf, CmssyRequestError, CmssyRetryMode, CmssySiteConfig, CmssyTypedDocument, EditorToAppMessage, FetchLike, FetchLikeResponse, FetchPageOptions, FieldControl, FieldDefinition, FieldType, GraphqlRequestOptions, InferBlockContent, LayoutRegion, LayoutRegionId, MediaLike, MediaType, PROTOCOL_VERSION, ParentReadyMessage, PatchMessage, PostTarget, QueryScopedOptions, RawBlock, RawLayoutBlock, ReadyMessage, RetryOption, RetryPolicy, SelectMessage, SubmitFormInput, TypedField, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaDuration, mediaType, mediaTypeValues, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
 import { B as BlockDefinition, L as LayoutBlockPage, a as BlockMap } from './resolve-block-data-Bkracpae.js';
 export { b as BlockProps, E as EditorBlockData, R as ResolveBlockDataOptions, c as ResolveLayoutBlockDataOptions, d as buildBlockMap, e as defineBlock, r as resolveEditorBlockData, f as resolveEditorLayoutBlockData } from './resolve-block-data-Bkracpae.js';
 import { FieldDefinition } from '@cmssy/types';
 export { FieldCondition, FieldConditionGroup, FieldConditionLogic } from '@cmssy/types';
+import { CmssyLayoutStore } from '@cmssy/core/internal';
 export { buildBlockContext } from '@cmssy/core/internal';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactElement, ComponentType } from 'react';
@@ -35,6 +36,8 @@ interface ResolveCmssyLayoutSlotBase {
     appContext?: Record<string, unknown>;
     retry?: RetryOption;
     fetch?: FetchLike;
+    layoutStore?: CmssyLayoutStore;
+    onTransientLayoutFailure?: "throw" | "degrade";
 }
 type CmssyLayoutSlotLocaleSource = {
     path: string[];
@@ -44,8 +47,14 @@ type CmssyLayoutSlotLocaleSource = {
     path?: undefined;
 };
 type ResolveCmssyLayoutSlotOptions = ResolveCmssyLayoutSlotBase & CmssyLayoutSlotLocaleSource;
+interface CmssyLayoutUnavailable {
+    status: number;
+    retryAfterMs?: number;
+    message: string;
+}
 interface CmssyLayoutSlotResolution {
     groups: CmssyLayoutGroup[];
+    unavailable?: CmssyLayoutUnavailable;
     settings: Record<string, unknown> | null;
     page: CmssyBlockPage;
     locale: string;
@@ -78,6 +87,7 @@ type ResolveCmssyLayoutOptions<C extends CmssyConfig, P extends CmssyRegionOf<C>
 };
 interface CmssyLayoutResolution<C extends CmssyConfig = CmssyConfig, P extends CmssyRegionOf<C> = CmssyRegionOf<C>> {
     groups: CmssyLayoutGroup[];
+    unavailable?: CmssyLayoutUnavailable;
     settings: CmssyRegionSettingsOf<C, P> | null;
     page: CmssyBlockPage;
     locale: string;
@@ -160,4 +170,4 @@ interface UnknownBlockProps {
 }
 declare function UnknownBlock({ type }: UnknownBlockProps): react_jsx_runtime.JSX.Element;
 
-export { BlockDefinition, BlockMap, CmssyBlock, type CmssyBlockProps, CmssyBlocks, type CmssyBlocksProps, type CmssyLayoutEditableProps, CmssyLayoutRegion, type CmssyLayoutRegionProps, type CmssyLayoutResolution, type CmssyLayoutSlotLocaleSource, type CmssyLayoutSlotResolution, CmssyServerLayout, type CmssyServerLayoutProps, CmssyServerPage, type CmssyServerPageProps, LayoutBlockPage, type ResolveCmssyLayoutOptions, type ResolveCmssyLayoutSlotOptions, UnknownBlock, type UnknownBlockProps, resolveCmssyLayout, resolveCmssyLayoutSlot };
+export { BlockDefinition, BlockMap, CmssyBlock, type CmssyBlockProps, CmssyBlocks, type CmssyBlocksProps, type CmssyLayoutEditableProps, CmssyLayoutRegion, type CmssyLayoutRegionProps, type CmssyLayoutResolution, type CmssyLayoutSlotLocaleSource, type CmssyLayoutSlotResolution, type CmssyLayoutUnavailable, CmssyServerLayout, type CmssyServerLayoutProps, CmssyServerPage, type CmssyServerPageProps, LayoutBlockPage, type ResolveCmssyLayoutOptions, type ResolveCmssyLayoutSlotOptions, UnknownBlock, type UnknownBlockProps, resolveCmssyLayout, resolveCmssyLayoutSlot };

package/dist/index.js

@@ -1,6 +1,6 @@
-import { blocksToSchemas, resolveEditorOrigin, verifyCmssyEditToken, CMSSY_EDIT_TOKEN_HEADER } from '@cmssy/core';
-export { CmssyRequestError, PROTOCOL_VERSION, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
-import { buildBlockContext, fetchLayouts, normalizeBlockContent, asBucket, layoutRegionIds, fetchPage, resolveSiteLocales as resolveSiteLocales$1, getBlockContentForLanguage, resolveRelationContent } from '@cmssy/core/internal';
+import { blocksToSchemas, isTransientRequestError, resolveEditorOrigin, verifyCmssyEditToken, CMSSY_EDIT_TOKEN_HEADER } from '@cmssy/core';
+export { CmssyRequestError, MediaType, PROTOCOL_VERSION, createCmssyClient, defineCmssyLayout, fields, graphqlRequest, isProtocolCompatible, mediaAlt, mediaDuration, mediaType, mediaTypeValues, mediaUrl, mediaUrls, normalizeOrigin, parseEditorMessage, postToEditor } from '@cmssy/core';
+import { buildBlockContext, readThroughLayoutStore, layoutStoreKey, fetchLayouts, normalizeBlockContent, asBucket, layoutRegionIds, fetchPage, resolveSiteLocales as resolveSiteLocales$1, getBlockContentForLanguage, resolveRelationContent } from '@cmssy/core/internal';
 export { buildBlockContext } from '@cmssy/core/internal';
 import { createElement } from 'react';
 import { BlockErrorBoundary } from '@cmssy/react/block-error-boundary';
@@ -407,7 +407,9 @@ async function resolveCmssyLayoutSlot(config, options) {
     path,
     locale: explicitLocale,
     retry,
-    fetch: fetchImpl
+    fetch: fetchImpl,
+    layoutStore,
+    onTransientLayoutFailure = "throw"
   } = options;
   const requestOptions = {
     retry: retry ?? "build",
@@ -418,12 +420,31 @@ async function resolveCmssyLayoutSlot(config, options) {
   const locale = explicitLocale ?? fromPath.locale;
   const slugSegments = fromPath.path ?? [];
   const page = layoutSlotPage(explicitPage ?? "/" + slugSegments.join("/"));
-  const groups = await fetchLayouts(config, page.slug, {
-    previewSecret: editMode || preview ? config.draftSecret : void 0,
-    ...requestOptions
-  });
+  const previewSecret = editMode || preview ? config.draftSecret : void 0;
+  let groups = [];
+  let unavailable;
+  try {
+    groups = await readThroughLayoutStore(
+      layoutStore,
+      layoutStoreKey(config, page.slug, previewSecret),
+      () => fetchLayouts(config, page.slug, {
+        previewSecret,
+        ...requestOptions
+      })
+    );
+  } catch (error) {
+    if (onTransientLayoutFailure !== "degrade" || !isTransientRequestError(error)) {
+      throw error;
+    }
+    unavailable = {
+      status: error.status,
+      ...error.retryAfterMs !== void 0 ? { retryAfterMs: error.retryAfterMs } : {},
+      message: error.message
+    };
+  }
   const base = {
     groups,
+    ...unavailable ? { unavailable } : {},
     settings: groups.find((g) => g.region === region)?.settings ?? null,
     page,
     locale,
@@ -504,6 +525,56 @@ async function CmssyServerLayout({
     })
   ) });
 }
+var cardStyle2 = {
+  boxSizing: "border-box",
+  margin: "8px 0",
+  padding: "12px 16px",
+  border: "1px dashed #f59e0b",
+  borderRadius: "8px",
+  background: "rgba(245, 158, 11, 0.08)",
+  color: "#b45309",
+  fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace",
+  fontSize: "13px",
+  lineHeight: 1.5,
+  textAlign: "left"
+};
+var headingStyle2 = {
+  fontWeight: 700,
+  marginBottom: "4px"
+};
+var messageStyle2 = {
+  whiteSpace: "pre-wrap",
+  overflowWrap: "anywhere"
+};
+function retryHint(retryAfterMs) {
+  if (retryAfterMs === void 0) return "";
+  return ` Try again in ${Math.max(1, Math.ceil(retryAfterMs / 1e3))}s.`;
+}
+function LayoutUnavailableCard({
+  region,
+  unavailable
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "alert",
+      "data-cmssy-layout-unavailable": region,
+      "data-cmssy-layout-status": unavailable.status,
+      style: cardStyle2,
+      children: [
+        /* @__PURE__ */ jsxs("div", { style: headingStyle2, children: [
+          'Layout region "',
+          region,
+          '" could not be loaded (',
+          unavailable.status,
+          ").",
+          retryHint(unavailable.retryAfterMs)
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: messageStyle2, children: unavailable.message })
+      ]
+    }
+  );
+}
 async function resolveCmssyLayout(config, options) {
   const { editable: Editable, ...slotOptions } = options;
   if (slotOptions.editMode && !Editable) {
@@ -511,10 +582,10 @@ async function resolveCmssyLayout(config, options) {
       "cmssy: resolveCmssyLayout needs an `editable` component in edit mode - the editor bridge lives on the client"
     );
   }
-  const resolved = await resolveCmssyLayoutSlot(
-    config,
-    slotOptions
-  );
+  const resolved = await resolveCmssyLayoutSlot(config, {
+    onTransientLayoutFailure: "degrade",
+    ...slotOptions
+  });
   const { groups, settings, page, locale, defaultLocale, enabledLocales } = resolved;
   const shared = {
     groups,
@@ -525,25 +596,41 @@ async function resolveCmssyLayout(config, options) {
     enabledLocales,
     appContext: options.appContext
   };
-  const element = slotOptions.editMode && Editable ? /* @__PURE__ */ jsx(
-    Editable,
-    {
-      ...shared,
-      edit: { editorOrigin: resolved.editorOrigin ?? "" },
-      data: resolved.data,
-      resolvedContent: resolved.resolvedContent
-    }
-  ) : /* @__PURE__ */ jsx(
-    CmssyServerLayout,
-    {
-      ...shared,
-      blocks: options.blocks,
-      config,
-      preview: slotOptions.preview
-    }
-  );
+  let element;
+  if (slotOptions.editMode && Editable) {
+    const editable = /* @__PURE__ */ jsx(
+      Editable,
+      {
+        ...shared,
+        edit: { editorOrigin: resolved.editorOrigin ?? "" },
+        data: resolved.data,
+        resolvedContent: resolved.resolvedContent
+      }
+    );
+    element = resolved.unavailable ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        LayoutUnavailableCard,
+        {
+          region: options.region,
+          unavailable: resolved.unavailable
+        }
+      ),
+      editable
+    ] }) : editable;
+  } else {
+    element = /* @__PURE__ */ jsx(
+      CmssyServerLayout,
+      {
+        ...shared,
+        blocks: options.blocks,
+        config,
+        preview: slotOptions.preview
+      }
+    );
+  }
   return {
     groups,
+    ...resolved.unavailable ? { unavailable: resolved.unavailable } : {},
     settings,
     page,
     locale,

package/dist/spa.cjs

@@ -207,7 +207,9 @@ async function resolveCmssyLayoutSlot(config, options) {
     path,
     locale: explicitLocale,
     retry,
-    fetch: fetchImpl
+    fetch: fetchImpl,
+    layoutStore,
+    onTransientLayoutFailure = "throw"
   } = options;
   const requestOptions = {
     retry: retry ?? "build",
@@ -218,12 +220,31 @@ async function resolveCmssyLayoutSlot(config, options) {
   const locale$1 = explicitLocale ?? fromPath.locale;
   const slugSegments = fromPath.path ?? [];
   const page = layoutSlotPage(explicitPage ?? "/" + slugSegments.join("/"));
-  const groups = await internal.fetchLayouts(config, page.slug, {
-    previewSecret: editMode || preview ? config.draftSecret : void 0,
-    ...requestOptions
-  });
+  const previewSecret = editMode || preview ? config.draftSecret : void 0;
+  let groups = [];
+  let unavailable;
+  try {
+    groups = await internal.readThroughLayoutStore(
+      layoutStore,
+      internal.layoutStoreKey(config, page.slug, previewSecret),
+      () => internal.fetchLayouts(config, page.slug, {
+        previewSecret,
+        ...requestOptions
+      })
+    );
+  } catch (error) {
+    if (onTransientLayoutFailure !== "degrade" || !core.isTransientRequestError(error)) {
+      throw error;
+    }
+    unavailable = {
+      status: error.status,
+      ...error.retryAfterMs !== void 0 ? { retryAfterMs: error.retryAfterMs } : {},
+      message: error.message
+    };
+  }
   const base = {
     groups,
+    ...unavailable ? { unavailable } : {},
     settings: groups.find((g) => g.region === region)?.settings ?? null,
     page,
     locale: locale$1,

package/dist/spa.js

@@ -1,7 +1,7 @@
 "use client";
 import { useMemo, useState, useRef, useEffect, useCallback, createElement } from 'react';
-import { layoutRegionIds, fetchPage, buildBlockContext, fetchLayouts, normalizeBlockContent, asBucket, getBlockContentForLanguage, resolveRelationContent } from '@cmssy/core/internal';
-import { resolveEditorOrigin, blocksToSchemas } from '@cmssy/core';
+import { layoutRegionIds, fetchPage, buildBlockContext, readThroughLayoutStore, layoutStoreKey, fetchLayouts, normalizeBlockContent, asBucket, getBlockContentForLanguage, resolveRelationContent } from '@cmssy/core/internal';
+import { isTransientRequestError, resolveEditorOrigin, blocksToSchemas } from '@cmssy/core';
 import { resolveSiteLocales, splitLocaleFromPath } from '@cmssy/core/internal/locale';
 import { BlockErrorBoundary } from '@cmssy/react/block-error-boundary';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
@@ -205,7 +205,9 @@ async function resolveCmssyLayoutSlot(config, options) {
     path,
     locale: explicitLocale,
     retry,
-    fetch: fetchImpl
+    fetch: fetchImpl,
+    layoutStore,
+    onTransientLayoutFailure = "throw"
   } = options;
   const requestOptions = {
     retry: retry ?? "build",
@@ -216,12 +218,31 @@ async function resolveCmssyLayoutSlot(config, options) {
   const locale = explicitLocale ?? fromPath.locale;
   const slugSegments = fromPath.path ?? [];
   const page = layoutSlotPage(explicitPage ?? "/" + slugSegments.join("/"));
-  const groups = await fetchLayouts(config, page.slug, {
-    previewSecret: editMode || preview ? config.draftSecret : void 0,
-    ...requestOptions
-  });
+  const previewSecret = editMode || preview ? config.draftSecret : void 0;
+  let groups = [];
+  let unavailable;
+  try {
+    groups = await readThroughLayoutStore(
+      layoutStore,
+      layoutStoreKey(config, page.slug, previewSecret),
+      () => fetchLayouts(config, page.slug, {
+        previewSecret,
+        ...requestOptions
+      })
+    );
+  } catch (error) {
+    if (onTransientLayoutFailure !== "degrade" || !isTransientRequestError(error)) {
+      throw error;
+    }
+    unavailable = {
+      status: error.status,
+      ...error.retryAfterMs !== void 0 ? { retryAfterMs: error.retryAfterMs } : {},
+      message: error.message
+    };
+  }
   const base = {
     groups,
+    ...unavailable ? { unavailable } : {},
     settings: groups.find((g) => g.region === region)?.settings ?? null,
     page,
     locale,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cmssy/react",
-  "version": "18.0.0",
+  "version": "19.1.0",
   "description": "React blocks, renderers, data client and editor bridge for cmssy headless sites",
   "keywords": [
     "cmssy",
@@ -106,8 +106,8 @@
     "vitest": "^2.1.0"
   },
   "dependencies": {
-    "@cmssy/types": "0.54.0",
-    "@cmssy/core": "18.0.0"
+    "@cmssy/types": "0.59.0",
+    "@cmssy/core": "19.1.0"
   },
   "scripts": {
     "build": "tsup",