@cmssy/next 10.9.1 → 10.10.0

package/dist/middleware.cjs

@@ -74,8 +74,11 @@ function createCmssyProxy(config, options = {}) {
       for (const write of writes) {
         response.cookies.set(write.name, write.value, {
           ...DEFAULT_COOKIE_OPTIONS,
-          ...write.value ? {} : { maxAge: 0 },
-          ...write.options
+          ...write.options,
+          // Deletion wins over the caller's options. They will be the same
+          // options the cookie was written with, maxAge included, and honoring
+          // that here would keep an emptied cookie alive instead of removing it.
+          ...write.value ? {} : { maxAge: 0 }
         });
       }
       return response;

package/dist/middleware.js

@@ -73,8 +73,11 @@ function createCmssyProxy(config, options = {}) {
       for (const write of writes) {
         response.cookies.set(write.name, write.value, {
           ...DEFAULT_COOKIE_OPTIONS,
-          ...write.value ? {} : { maxAge: 0 },
-          ...write.options
+          ...write.options,
+          // Deletion wins over the caller's options. They will be the same
+          // options the cookie was written with, maxAge included, and honoring
+          // that here would keep an emptied cookie alive instead of removing it.
+          ...write.value ? {} : { maxAge: 0 }
         });
       }
       return response;

package/dist/server.cjs

@@ -9,6 +9,7 @@ var internalServer = require('@cmssy/react/internal-server');
 var internal = require('@cmssy/core/internal');
 var core = require('@cmssy/core');
 var jsxRuntime = require('react/jsx-runtime');
+var locale = require('@cmssy/core/internal/locale');
 
 // src/server.ts
 function hasEditFlag(value) {
@@ -249,7 +250,71 @@ async function isCmssyEditMode() {
   const h = await headers.headers();
   return h.get(core.CMSSY_EDIT_HEADER) === "1";
 }
+async function CmssyLayoutSlot({
+  config,
+  blocks,
+  position,
+  path,
+  page = "/",
+  editable: Editable,
+  appContext
+}) {
+  const editMode = await isCmssyEditMode();
+  const [groups, siteLocales] = await Promise.all([
+    internal.fetchLayouts(config, page, {
+      previewSecret: editMode ? config.draftSecret : void 0
+    }),
+    locale.resolveSiteLocales(config)
+  ]);
+  const locale$1 = path ? locale.splitLocaleFromPath(path, siteLocales).locale : await localeFromHeader(siteLocales.defaultLocale);
+  if (!editMode) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      react.CmssyServerLayout,
+      {
+        groups,
+        blocks,
+        position,
+        locale: locale$1,
+        defaultLocale: siteLocales.defaultLocale,
+        enabledLocales: siteLocales.locales,
+        config,
+        appContext
+      }
+    );
+  }
+  const origin = core.resolveEditorOrigin(config.editorOrigin);
+  const editorData = await react.resolveEditorLayoutBlockData({
+    groups,
+    blocks,
+    position,
+    locale: locale$1,
+    defaultLocale: siteLocales.defaultLocale,
+    enabledLocales: siteLocales.locales,
+    isPreview: true,
+    config,
+    appContext
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Editable,
+    {
+      groups,
+      position,
+      locale: locale$1,
+      defaultLocale: siteLocales.defaultLocale,
+      enabledLocales: siteLocales.locales,
+      edit: { editorOrigin: (Array.isArray(origin) ? origin[0] : origin) ?? "" },
+      data: editorData.data,
+      resolvedContent: editorData.content,
+      appContext
+    }
+  );
+}
+async function localeFromHeader(defaultLocale) {
+  const { headers: headers3 } = await import('next/headers');
+  return (await headers3()).get(locale.CMSSY_LOCALE_HEADER) || defaultLocale;
+}
 
+exports.CmssyLayoutSlot = CmssyLayoutSlot;
 exports.createCmssyEditPage = createCmssyEditPage;
 exports.createCmssyPage = createCmssyPage;
 exports.createDraftRoute = createDraftRoute;

package/dist/server.d.cts

@@ -1,8 +1,8 @@
 export { C as CmssyAppContext, a as CmssyEditorProps, b as CreateCmssyPageOptions, c as createCmssyEditPage, d as createCmssyPage } from './index-B64zk2X7.cjs';
-import { CmssyConfig } from '@cmssy/core';
-import 'react/jsx-runtime';
-import 'react';
-import '@cmssy/react';
+import { CmssyConfig, LayoutPosition } from '@cmssy/core';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentType } from 'react';
+import { BlockDefinition, CmssyLayoutGroup } from '@cmssy/react';
 import '@cmssy/react/client';
 
 type CmssyDraftRouteConfig = Pick<CmssyConfig, "draftSecret"> & {
@@ -12,4 +12,66 @@ declare function createDraftRoute(config: CmssyDraftRouteConfig): (request: Requ
 
 declare function isCmssyEditMode(): Promise<boolean>;
 
-export { type CmssyDraftRouteConfig, createDraftRoute, isCmssyEditMode };
+interface CmssyLayoutSlotProps {
+    config: CmssyConfig;
+    blocks: BlockDefinition[];
+    /**
+     * Which layout position to render. Six exist - `top`, `header`,
+     * `sidebar_left`, `sidebar_right`, `footer`, `bottom` - and most sites use
+     * two of them; the type is what tells you about the other four.
+     */
+    position: LayoutPosition;
+    /**
+     * The catch-all segments of the route rendering this slot, **as routed**.
+     * The language prefix in them IS the language, and reading it here keeps the
+     * route statically renderable.
+     *
+     * Omit it only where there are no params to read - a root layout - and the
+     * language falls back to the header the middleware set, which means calling
+     * `headers()` and giving up static rendering for the whole route. The version
+     * of this component removed in 10.0 had no choice about that; this one does.
+     */
+    path?: string[];
+    /** The page whose layout to render. Defaults to the site-wide header/footer. */
+    page?: string;
+    /**
+     * The client wrapper around `CmssyLazyLayout`, rendered in edit mode.
+     *
+     * Required, and a component rather than a loader: the block registry has to
+     * be imported lazily ON THE CLIENT, and a function cannot cross the server
+     * boundary. Without it the editor gets a header it can select and not fill -
+     * which is why this is a type error rather than a runtime warning.
+     */
+    editable: ComponentType<{
+        groups: CmssyLayoutGroup[];
+        position: string;
+        locale: string;
+        defaultLocale: string;
+        enabledLocales: string[];
+        edit: {
+            editorOrigin: string;
+        };
+        data?: Record<string, unknown>;
+        resolvedContent?: Record<string, Record<string, unknown>>;
+        appContext?: Record<string, unknown>;
+    }>;
+    /** Forwarded untouched to every block as `context.app`. */
+    appContext?: Record<string, unknown>;
+}
+/**
+ * The site-wide header and footer, which are layout **blocks** rather than
+ * markup the app owns. Rendered the way each mode needs them:
+ *
+ *  - published traffic: server-rendered blocks, no client cost;
+ *  - the editor: the same blocks through the edit bridge, fetched with the
+ *    preview secret and handed their server-resolved content, so a relation
+ *    field shows records rather than the ids it stores.
+ *
+ * Getting any of that wrong is invisible - the site looks right while the
+ * editor shows a header it cannot fill, or the published version of one. Every
+ * app that wrote this by hand between 10.0 and 10.9 got at least one of the
+ * three wrong, which is why it is back.
+ */
+declare function CmssyLayoutSlot({ config, blocks, position, path, page, editable: Editable, appContext, }: CmssyLayoutSlotProps): Promise<react_jsx_runtime.JSX.Element>;
+
+export { type CmssyDraftRouteConfig, CmssyLayoutSlot, type CmssyLayoutSlotProps, createDraftRoute, isCmssyEditMode };

package/dist/server.d.ts

@@ -1,8 +1,8 @@
 export { C as CmssyAppContext, a as CmssyEditorProps, b as CreateCmssyPageOptions, c as createCmssyEditPage, d as createCmssyPage } from './index-B64zk2X7.js';
-import { CmssyConfig } from '@cmssy/core';
-import 'react/jsx-runtime';
-import 'react';
-import '@cmssy/react';
+import { CmssyConfig, LayoutPosition } from '@cmssy/core';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentType } from 'react';
+import { BlockDefinition, CmssyLayoutGroup } from '@cmssy/react';
 import '@cmssy/react/client';
 
 type CmssyDraftRouteConfig = Pick<CmssyConfig, "draftSecret"> & {
@@ -12,4 +12,66 @@ declare function createDraftRoute(config: CmssyDraftRouteConfig): (request: Requ
 
 declare function isCmssyEditMode(): Promise<boolean>;
 
-export { type CmssyDraftRouteConfig, createDraftRoute, isCmssyEditMode };
+interface CmssyLayoutSlotProps {
+    config: CmssyConfig;
+    blocks: BlockDefinition[];
+    /**
+     * Which layout position to render. Six exist - `top`, `header`,
+     * `sidebar_left`, `sidebar_right`, `footer`, `bottom` - and most sites use
+     * two of them; the type is what tells you about the other four.
+     */
+    position: LayoutPosition;
+    /**
+     * The catch-all segments of the route rendering this slot, **as routed**.
+     * The language prefix in them IS the language, and reading it here keeps the
+     * route statically renderable.
+     *
+     * Omit it only where there are no params to read - a root layout - and the
+     * language falls back to the header the middleware set, which means calling
+     * `headers()` and giving up static rendering for the whole route. The version
+     * of this component removed in 10.0 had no choice about that; this one does.
+     */
+    path?: string[];
+    /** The page whose layout to render. Defaults to the site-wide header/footer. */
+    page?: string;
+    /**
+     * The client wrapper around `CmssyLazyLayout`, rendered in edit mode.
+     *
+     * Required, and a component rather than a loader: the block registry has to
+     * be imported lazily ON THE CLIENT, and a function cannot cross the server
+     * boundary. Without it the editor gets a header it can select and not fill -
+     * which is why this is a type error rather than a runtime warning.
+     */
+    editable: ComponentType<{
+        groups: CmssyLayoutGroup[];
+        position: string;
+        locale: string;
+        defaultLocale: string;
+        enabledLocales: string[];
+        edit: {
+            editorOrigin: string;
+        };
+        data?: Record<string, unknown>;
+        resolvedContent?: Record<string, Record<string, unknown>>;
+        appContext?: Record<string, unknown>;
+    }>;
+    /** Forwarded untouched to every block as `context.app`. */
+    appContext?: Record<string, unknown>;
+}
+/**
+ * The site-wide header and footer, which are layout **blocks** rather than
+ * markup the app owns. Rendered the way each mode needs them:
+ *
+ *  - published traffic: server-rendered blocks, no client cost;
+ *  - the editor: the same blocks through the edit bridge, fetched with the
+ *    preview secret and handed their server-resolved content, so a relation
+ *    field shows records rather than the ids it stores.
+ *
+ * Getting any of that wrong is invisible - the site looks right while the
+ * editor shows a header it cannot fill, or the published version of one. Every
+ * app that wrote this by hand between 10.0 and 10.9 got at least one of the
+ * three wrong, which is why it is back.
+ */
+declare function CmssyLayoutSlot({ config, blocks, position, path, page, editable: Editable, appContext, }: CmssyLayoutSlotProps): Promise<react_jsx_runtime.JSX.Element>;
+
+export { type CmssyDraftRouteConfig, CmssyLayoutSlot, type CmssyLayoutSlotProps, createDraftRoute, isCmssyEditMode };

package/dist/server.js

@@ -1,12 +1,13 @@
 import 'server-only';
 import { draftMode, headers } from 'next/headers';
 import { notFound, redirect } from 'next/navigation';
-import { createCmssyClient, CmssyServerPage } from '@cmssy/react';
+import { createCmssyClient, CmssyServerPage, CmssyServerLayout, resolveEditorLayoutBlockData } from '@cmssy/react';
 import { CmssyLocaleProvider } from '@cmssy/react/internal';
 import { resolveEditorBlockData } from '@cmssy/react/internal-server';
-import { isDevelopment, resolveSiteLocales, splitLocaleFromPath, fetchPage, resolveForms, toCspOrigin, cmssySecretsMatch } from '@cmssy/core/internal';
+import { isDevelopment, resolveSiteLocales, splitLocaleFromPath, fetchPage, resolveForms, toCspOrigin, cmssySecretsMatch, fetchLayouts } from '@cmssy/core/internal';
 import { CMSSY_SECRET_QUERY_PARAM, resolveEditorOrigin, CMSSY_EDIT_HEADER, CMSSY_EDIT_QUERY_PARAM } from '@cmssy/core';
 import { jsx } from 'react/jsx-runtime';
+import { resolveSiteLocales as resolveSiteLocales$1, splitLocaleFromPath as splitLocaleFromPath$1, CMSSY_LOCALE_HEADER } from '@cmssy/core/internal/locale';
 
 // src/server.ts
 function hasEditFlag(value) {
@@ -247,5 +248,68 @@ async function isCmssyEditMode() {
   const h = await headers();
   return h.get(CMSSY_EDIT_HEADER) === "1";
 }
+async function CmssyLayoutSlot({
+  config,
+  blocks,
+  position,
+  path,
+  page = "/",
+  editable: Editable,
+  appContext
+}) {
+  const editMode = await isCmssyEditMode();
+  const [groups, siteLocales] = await Promise.all([
+    fetchLayouts(config, page, {
+      previewSecret: editMode ? config.draftSecret : void 0
+    }),
+    resolveSiteLocales$1(config)
+  ]);
+  const locale = path ? splitLocaleFromPath$1(path, siteLocales).locale : await localeFromHeader(siteLocales.defaultLocale);
+  if (!editMode) {
+    return /* @__PURE__ */ jsx(
+      CmssyServerLayout,
+      {
+        groups,
+        blocks,
+        position,
+        locale,
+        defaultLocale: siteLocales.defaultLocale,
+        enabledLocales: siteLocales.locales,
+        config,
+        appContext
+      }
+    );
+  }
+  const origin = resolveEditorOrigin(config.editorOrigin);
+  const editorData = await resolveEditorLayoutBlockData({
+    groups,
+    blocks,
+    position,
+    locale,
+    defaultLocale: siteLocales.defaultLocale,
+    enabledLocales: siteLocales.locales,
+    isPreview: true,
+    config,
+    appContext
+  });
+  return /* @__PURE__ */ jsx(
+    Editable,
+    {
+      groups,
+      position,
+      locale,
+      defaultLocale: siteLocales.defaultLocale,
+      enabledLocales: siteLocales.locales,
+      edit: { editorOrigin: (Array.isArray(origin) ? origin[0] : origin) ?? "" },
+      data: editorData.data,
+      resolvedContent: editorData.content,
+      appContext
+    }
+  );
+}
+async function localeFromHeader(defaultLocale) {
+  const { headers: headers3 } = await import('next/headers');
+  return (await headers3()).get(CMSSY_LOCALE_HEADER) || defaultLocale;
+}
 
-export { createCmssyEditPage, createCmssyPage, createDraftRoute, isCmssyEditMode };
+export { CmssyLayoutSlot, createCmssyEditPage, createCmssyPage, createDraftRoute, isCmssyEditMode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cmssy/next",
-  "version": "10.9.1",
+  "version": "10.10.0",
   "description": "Next.js App Router bindings for cmssy headless sites (createCmssyPage + draft preview)",
   "keywords": [
     "cmssy",
@@ -65,12 +65,12 @@
     "tsup": "^8.3.0",
     "typescript": "^5.6.0",
     "vitest": "^2.1.0",
-    "@cmssy/react": "10.9.1"
+    "@cmssy/react": "10.10.0"
   },
   "dependencies": {
     "@cmssy/types": "0.32.0",
     "server-only": "^0.0.1",
-    "@cmssy/core": "10.9.1"
+    "@cmssy/core": "10.10.0"
   },
   "scripts": {
     "build": "tsup",