@contentful/experiences-svelte 0.5.5 → 0.5.7

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+## 0.5.7 (2026-08-20)
+
+### 🚀 Features
+
+- **adapter-angular:** scaffold @contentful/experiences-angular [AIS-361] ([#134](https://github.com/contentful/experiences/pull/134))
+
+### 🧱 Updated Dependencies
+
+- Updated client to 0.3.6
+- Updated design to 0.7.6
+- Updated core to 0.7.6
+
+## 0.5.6 (2026-08-12)
+
+### 🩹 Fixes
+
+- **core,adapters:** render Experience Templates as ordinary nodes [AIS-413] ([#133](https://github.com/contentful/experiences/pull/133))
+
+### 🧱 Updated Dependencies
+
+- Updated client to 0.3.5
+- Updated design to 0.7.5
+- Updated core to 0.7.5
+
 ## 0.5.5 (2026-08-11)
 
 ### 🚀 Features

package/README.md

@@ -20,7 +20,7 @@ The public API mirrors `@contentful/experiences-react` 1:1 in shape; only the re
 
 ```ts
 defineComponent<Props>(config); // Type-narrowing identity for component-type configs
-defineExperienceTemplate<Props>(config); // Same shape, for page-level Experience Template wrappers
+defineExperienceTemplate<Props>(config); // Same shape, for coded Experience Template configs
 ```
 
 ### Resolver
@@ -35,7 +35,7 @@ resolveExperience(payload, config, opts?); // Async; walks payload, runs resolve
 ServerExperienceRenderer; // SSR-safe; active viewport seeded from initialViewportId
 ClientExperienceRenderer; // Subscribes to window.matchMedia via runes
 MissingComponent; // Default fallback for unregistered component types
-NodesRenderer; // Exposed so you can render non-`children` slots manually (see Slot children)
+NodesRenderer; // Exposed so you can re-render a slot's raw nodes yourself (see Slot children)
 useActiveViewport; // Rune-backed reactive object; you'll rarely need it directly
 ```
 
@@ -46,7 +46,7 @@ getDesignValues<T>(); // Optional helper: the same resolved design record that a
 toCss(design, options?); // Turns a design record into a plain style object, keeping only real CSS keys
 getExperience(); // RenderContext: debug, metadata, viewports, activeViewport
 getContentfulComponent(); // Raw payload for the enclosing node (or undefined)
-getContentfulExperienceTemplate(); // Same, for the page-level Experience Template
+getContentfulExperienceTemplate(); // Same, for an enclosing coded Experience Template node
 type ToCssOptions;
 ```
 
@@ -61,7 +61,7 @@ type ComponentConfig, ExperienceTemplateConfig,
 type ContentfulComponent, ContentfulExperienceTemplate,
 type RenderContext, ResolveToken,
 type ExperiencePayload, ExperienceNode, ComponentNode, ExperienceTemplateNode,
-type PortableRenderPlan, PortableRenderNode, PortableExperienceTemplate,
+type PortableRenderPlan, PortableRenderNode, PortableRegistration,
 type DesignPropValue, ManualDesignValue, DesignToken, ValuesByViewport,
 type ViewportDef, ExperienceContext, ResolveContext,
 type ResolverConfig, ResolveExperienceOptions
@@ -129,7 +129,7 @@ export const experienceConfig: Config = { components, resolveToken };
 
 ### Slot children
 
-A component's default slot children arrive as an **array of Snippets** (`Snippet[]`), one per child — not a single wrapping Snippet. For the common "just render them" case, iterate the array with `{#each}` and `{@render}`; to wrap, reorder, or drop children individually, do it inside that loop.
+Every slot arrives as a prop named after the slot, holding an **array of Snippets** (`Snippet[]`), one per child — not a single wrapping Snippet. For the common "just render them" case, iterate the array with `{#each}` and `{@render}`; to wrap, reorder, or drop children individually, do it inside that loop.
 
 ```svelte
 <!-- Section.svelte -->
@@ -156,7 +156,9 @@ A component's default slot children arrive as an **array of Snippets** (`Snippet
 -->
 ```
 
-The default slot is injected as the `children` prop. Any **additional named slots** are not auto-injected — reach them from the raw payload via `getContentfulComponent().slots` (a `Record<string, PortableRenderNode[]>`) and render them yourself with `NodesRenderer`.
+`children` is not special — it is simply the conventional name for the default slot. **Every** slot in the payload becomes a same-named `Snippet[]` prop, so a component with a `header` slot just declares `header?: Snippet[]` and renders it the same way. This applies identically to coded Experience Templates: a template with a `content` slot receives a `content` prop.
+
+If you'd rather render a slot's raw nodes yourself, they are still on the payload at `getContentfulComponent().slots` (a `Record<string, PortableRenderNode[]>`) — hand them to `NodesRenderer`.
 
 For the full getting-started walkthrough, the merge-precedence rules, viewport handling, and design rationale, see the [root README](../../README.md) and [`AGENTS.md`](../../AGENTS.md).
 

package/dist/ClientExperienceRenderer.svelte

@@ -14,7 +14,6 @@
   import DebugExperience from './DebugExperience.svelte';
   import MissingComponent from './MissingComponent.svelte';
   import NodesRenderer from './NodesRenderer.svelte';
-  import WrapWithExperienceTemplate from './WrapWithExperienceTemplate.svelte';
   import type { ClientExperienceRendererProps } from './component-props.js';
   import { setExperience } from './context.js';
   import type { RenderContext } from './types.js';
@@ -75,14 +74,10 @@
   {#if debug}
     <DebugExperience {experience} />
   {/if}
-  <WrapWithExperienceTemplate experienceTemplate={experience.experienceTemplate} {config} experience={liveContext}>
-    {#snippet children()}
-      <NodesRenderer
-        nodes={experience.nodes}
-        {config}
-        experience={liveContext}
-        {renderUnknown}
-      />
-    {/snippet}
-  </WrapWithExperienceTemplate>
+  <NodesRenderer
+    nodes={experience.nodes}
+    {config}
+    experience={liveContext}
+    {renderUnknown}
+  />
 {/if}

package/dist/ClientExperienceRenderer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ClientExperienceRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/ClientExperienceRenderer.svelte.ts"],"names":[],"mappings":"AA2FA,QAAA,MAAM,wBAAwB,kGAAwC,CAAC;AACvE,KAAK,wBAAwB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAC5E,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"ClientExperienceRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/ClientExperienceRenderer.svelte.ts"],"names":[],"mappings":"AAqFA,QAAA,MAAM,wBAAwB,kGAAwC,CAAC;AACvE,KAAK,wBAAwB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAC5E,eAAe,wBAAwB,CAAC"}

package/dist/DebugExperience.svelte

@@ -17,10 +17,17 @@
   let { experience, defaultOpen = false }: DebugExperienceProps = $props();
 
   const nodeCount = $derived(experience.nodes.length);
+  // Coded Experience Templates are ordinary top-level nodes, so name them from
+  // the node list — a composite Experience simply has none to report.
+  const templateIds = $derived(
+    experience.nodes
+      .filter((node) => node.registration.kind === 'experienceTemplate')
+      .map((node) => node.registration.id)
+  );
   const summary = $derived(
     `Experience debug — ${nodeCount} top-level node${nodeCount === 1 ? '' : 's'}${
-      experience.experienceTemplate
-        ? `, experience template: ${experience.experienceTemplate.experienceTemplateId}`
+      templateIds.length
+        ? `, experience template${templateIds.length === 1 ? '' : 's'}: ${templateIds.join(', ')}`
         : ''
     }`
   );

package/dist/DebugExperience.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DebugExperience.svelte.d.ts","sourceRoot":"","sources":["../src/DebugExperience.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAqDjE,QAAA,MAAM,eAAe,0DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"DebugExperience.svelte.d.ts","sourceRoot":"","sources":["../src/DebugExperience.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AA4DjE,QAAA,MAAM,eAAe,0DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/DebugExperience.test.js

@@ -2,13 +2,20 @@ import { render } from '@testing-library/svelte';
 import { describe, expect, it } from 'vitest';
 import DebugExperience from './DebugExperience.svelte';
 const emptyPlan = { nodes: [], viewports: [], fallbackViewportIndex: 0 };
-function node(componentId, content = {}) {
+function node(id, content = {}) {
     return {
-        registration: { componentId },
+        registration: { kind: 'component', id },
         props: { content, design: {}, designRaw: {} },
         slots: {},
     };
 }
+function templateNode(id) {
+    return {
+        registration: { kind: 'experienceTemplate', id },
+        props: { content: {}, design: {}, designRaw: {} },
+        slots: {},
+    };
+}
 describe('DebugExperience.svelte', () => {
     it('renders a collapsible details panel with the debug marker, collapsed by default', () => {
         const { container } = render(DebugExperience, { props: { experience: emptyPlan } });
@@ -33,19 +40,25 @@ describe('DebugExperience.svelte', () => {
         const { container } = render(DebugExperience, { props: { experience: one } });
         expect(container.innerHTML).toContain('Experience debug — 1 top-level node');
     });
-    it('names the experienceTemplate in the summary when present', () => {
+    it('names experienceTemplate nodes in the summary', () => {
         const plan = {
             viewports: [],
-            nodes: [],
-            experienceTemplate: {
-                experienceTemplateId: 'page',
-                props: { content: {}, design: {}, designRaw: {} },
-            },
+            nodes: [templateNode('page')],
             fallbackViewportIndex: 0,
         };
         const { container } = render(DebugExperience, { props: { experience: plan } });
         expect(container.innerHTML).toContain('experience template: page');
     });
+    it('omits the experience-template summary for a composite experience', () => {
+        const plan = {
+            viewports: [],
+            nodes: [node('button'), node('text')],
+            fallbackViewportIndex: 0,
+        };
+        const { container } = render(DebugExperience, { props: { experience: plan } });
+        expect(container.innerHTML).toContain('Experience debug — 2 top-level nodes');
+        expect(container.innerHTML).not.toContain('experience template');
+    });
     it('dumps the plan as pretty JSON', () => {
         const plan = {
             viewports: [],
@@ -53,7 +66,7 @@ describe('DebugExperience.svelte', () => {
             fallbackViewportIndex: 0,
         };
         const { container } = render(DebugExperience, { props: { experience: plan } });
-        expect(container.innerHTML).toContain('componentId');
+        expect(container.innerHTML).toContain('registration');
         expect(container.innerHTML).toContain('button');
         expect(container.innerHTML).toContain('Go');
     });

package/dist/NodeRenderer.svelte

@@ -2,18 +2,29 @@
  * Single-node renderer. Splits out of NodesRenderer so the per-node
  * `setContext` for the contentful payload happens during *that node's*
  * component init (Svelte's setContext can only be called at top level).
+ *
+ * A node's `registration.kind` picks which half of the customer Config owns
+ * its implementation — `experienceTemplates` for a coded Experience Template,
+ * `components` otherwise. Everything else (slot props, merge precedence,
+ * design resolution) is identical across the two kinds.
 -->
 <script lang="ts">
   import type { Snippet } from 'svelte';
 
   import type { PortableRenderNode } from '@contentful/experiences-sdk-core';
+  import { selectResolvedDesign } from '@contentful/experiences-design';
 
-  import { setContentfulComponent, setResolvedDesign } from './context.js';
-  import { selectResolvedDesign } from './design-utils.js';
+  import {
+    setContentfulComponent,
+    setContentfulExperienceTemplate,
+    setResolvedDesign,
+  } from './context.js';
   import type { RenderUnknown } from './component-props.js';
   import {
     normalizeComponentRegistration,
+    normalizeExperienceTemplateRegistration,
     type ContentfulComponent,
+    type ContentfulExperienceTemplate,
     type Config,
     type RenderContext,
   } from './types.js';
@@ -23,23 +34,49 @@
     config: Config;
     experience: RenderContext;
     renderUnknown: RenderUnknown;
-    children: Snippet[];
+    /**
+     * Pre-rendered slot children keyed by slot name — one zero-arg Snippet per
+     * child node. Spread onto the customer component as named props, so a slot
+     * named `content` arrives as a `content` prop. `children` is not special.
+     */
+    slotSnippets: Record<string, Snippet[]>;
   }
 
-  let { node, config, experience, renderUnknown, children }: NodeRendererProps = $props();
+  let { node, config, experience, renderUnknown, slotSnippets }: NodeRendererProps = $props();
+
+  const { kind, id } = node.registration;
+  const isExperienceTemplate = kind === 'experienceTemplate';
 
-  const entry = $derived(config.components[node.registration.componentId]);
-  const componentConfig = $derived(entry ? normalizeComponentRegistration(entry) : null);
+  const entry = $derived(
+    isExperienceTemplate ? config.experienceTemplates?.[id] : config.components[id]
+  );
+  const componentConfig = $derived.by(() => {
+    if (!entry) return null;
+    return isExperienceTemplate
+      ? normalizeExperienceTemplateRegistration(entry)
+      : normalizeComponentRegistration(entry);
+  });
 
-  const contentful: ContentfulComponent = {
-    componentId: node.registration.componentId,
-    nodeId: node.nodeId,
-    content: node.props.content,
-    design: node.props.designRaw,
-    resolved: node.props.resolved,
-    slots: node.slots,
-  };
-  setContentfulComponent(contentful);
+  if (isExperienceTemplate) {
+    const contentful: ContentfulExperienceTemplate = {
+      experienceTemplateId: id,
+      nodeId: node.nodeId,
+      content: node.props.content,
+      design: node.props.designRaw,
+      resolved: node.props.resolved,
+    };
+    setContentfulExperienceTemplate(contentful);
+  } else {
+    const contentful: ContentfulComponent = {
+      componentId: id,
+      nodeId: node.nodeId,
+      content: node.props.content,
+      design: node.props.designRaw,
+      resolved: node.props.resolved,
+      slots: node.slots,
+    };
+    setContentfulComponent(contentful);
+  }
 
   const tokenResolvedDesign = $derived.by(() => {
     const { props, unresolved } = selectResolvedDesign(
@@ -51,7 +88,7 @@
     );
     if (unresolved.length && typeof console !== 'undefined') {
       console.warn(
-        `[@contentful/experiences-svelte] resolveToken returned undefined for token id(s) on "${node.registration.componentId}": ${unresolved.join(', ')}. getDesignValues() will omit those keys.`
+        `[@contentful/experiences-svelte] resolveToken returned undefined for token id(s) on ${kind} "${id}": ${unresolved.join(', ')}. getDesignValues() will omit those keys.`
       );
     }
     return props;
@@ -59,7 +96,7 @@
 
   setResolvedDesign(() => tokenResolvedDesign);
 
-  // Merge precedence (last wins): defaults < design < content < resolveData < children.
+  // Merge precedence (last wins): defaults < design < content < resolveData < slots.
   const composed = $derived.by(() => {
     if (!componentConfig) return null;
     return {
@@ -67,18 +104,35 @@
       ...tokenResolvedDesign,
       ...node.props.content,
       ...node.props.resolved,
-      children,
+      ...slotSnippets,
     };
   });
+
+  // An unregistered Experience Template would blank the page if we swapped it
+  // for the missing-component box, so warn and render its slot children
+  // unwrapped — the content survives, the diagnostic names what's missing.
+  const orphanedSnippets = $derived.by(() => {
+    if (componentConfig || !isExperienceTemplate) return null;
+    if (typeof console !== 'undefined') {
+      console.warn(
+        `[@contentful/experiences-svelte] No experience template registered for id "${id}". Rendering its slot children without the experience template wrapper.`
+      );
+    }
+    return Object.values(slotSnippets).flat();
+  });
 </script>
 
 {#if componentConfig && composed}
   {@const Cmp = componentConfig.component}
   <Cmp {...composed} />
+{:else if orphanedSnippets}
+  {#each orphanedSnippets as childSnippet, index (index)}
+    {@render childSnippet()}
+  {/each}
 {:else}
   {@const Unknown = renderUnknown}
   <Unknown
-    componentId={node.registration.componentId}
+    componentId={id}
     nodeId={node.nodeId}
   />
 {/if}

package/dist/NodeRenderer.svelte.d.ts

@@ -7,7 +7,12 @@ interface NodeRendererProps {
     config: Config;
     experience: RenderContext;
     renderUnknown: RenderUnknown;
-    children: Snippet[];
+    /**
+     * Pre-rendered slot children keyed by slot name — one zero-arg Snippet per
+     * child node. Spread onto the customer component as named props, so a slot
+     * named `content` arrives as a `content` prop. `children` is not special.
+     */
+    slotSnippets: Record<string, Snippet[]>;
 }
 declare const NodeRenderer: import("svelte").Component<NodeRendererProps, {}, "">;
 type NodeRenderer = ReturnType<typeof NodeRenderer>;

package/dist/NodeRenderer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NodeRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/NodeRenderer.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAI3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAGH,KAAK,MAAM,EACX,KAAK,aAAa,EACnB,MAAM,YAAY,CAAC;AAGpB,UAAU,iBAAiB;IACzB,IAAI,EAAE,kBAAkB,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,aAAa,CAAC;IAC1B,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,OAAO,EAAE,CAAC;CACrB;AAqEH,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"NodeRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/NodeRenderer.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAQ3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAKH,KAAK,MAAM,EACX,KAAK,aAAa,EACnB,MAAM,YAAY,CAAC;AAGpB,UAAU,iBAAiB;IACzB,IAAI,EAAE,kBAAkB,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,aAAa,CAAC;IAC1B,aAAa,EAAE,aAAa,CAAC;IAC7B;;;;OAIG;IACH,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC;CACzC;AA2GH,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/NodesRenderer.svelte

@@ -1,17 +1,18 @@
 <!--
  * Recursive renderer over PortableRenderNodes. Customer components receive
- * the merged content / design / resolveData prop bag plus the default
- * `children` slot as an ARRAY of Snippets — one zero-arg Snippet per
- * pre-rendered child node — declared as `children?: Snippet[]`. A component
+ * the merged content / design / resolveData prop bag plus one prop per slot,
+ * each an ARRAY of Snippets — one zero-arg Snippet per pre-rendered child
+ * node. A slot named `content` arrives as `content?: Snippet[]`; the
+ * conventional default slot arrives as `children?: Snippet[]`. A component
  * renders them all with an each-block + @render, or maps/filters/wraps the
- * children individually. The array mirrors the React adapter's ReactNode[]
+ * children individually. The arrays mirror the React adapter's ReactNode[]
  * slot contract; see the README for the consuming-a-slot example.
  *
- * Only the default `children` slot is injected as a prop — Svelte 5 Snippets
- * are compile-time entities, so the renderer can't synthesize an unbounded
- * set of named Snippet props from runtime payload data. Additional named
- * slots are reachable through `getContentfulComponent().slots` and can be
- * rendered with the exported NodesRenderer (see README).
+ * This applies to every node kind — a coded Experience Template declaring a
+ * `content` slot gets a `content` prop exactly as a component would. The raw
+ * per-slot payload nodes are also reachable via
+ * `getContentfulComponent().slots` for callers that want to render them
+ * themselves with the exported NodesRenderer.
  *
  * The Experience runtime context and the raw Contentful payload are read
  * via `getExperience` / `getContentfulComponent`.
@@ -38,20 +39,42 @@
   let { nodes, config, experience, renderUnknown }: NodesRendererProps = $props();
 
   // Curry the parameterized `renderNode` snippet into a zero-arg Snippet bound
-  // to one node. Svelte 5 invokes a snippet as `(anchor, ...argGetters)`, so we
-  // forward the anchor and supply the node through a getter. This is the one
-  // spot that leans on Svelte's snippet calling convention; pinned by the
-  // `children`-array tests in server-renderer.test.ts.
+  // to one node: forward the anchor (the renderer, under SSR) and supply the
+  // node through a getter. This is the one spot that leans on Svelte's snippet
+  // calling convention; pinned by the slot-array tests in
+  // server-renderer.test.ts and nodes-renderer.ssr.test.ts.
   function toChildSnippet(node: PortableRenderNode): Snippet {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any -- programmatic snippet construction; see note above.
     return ((anchor: unknown) => (renderNode as any)(anchor, () => node)) as Snippet;
   }
+
+  // Svelte's two compiler outputs disagree on how snippet arguments arrive: the
+  // client build passes each one as a getter, the server build passes it by
+  // value. Compiler-generated `{@render}` call sites match whichever build they
+  // are in, but `toChildSnippet` writes its call by hand, so the snippet body
+  // accepts either shape and normalizes here.
+  type NodeArg = PortableRenderNode | (() => PortableRenderNode);
+  function unwrapNode(node: NodeArg): PortableRenderNode {
+    return typeof node === 'function' ? node() : node;
+  }
+
+  // Build one Snippet[] per slot so every slot becomes a named prop. Snippets
+  // themselves are compile-time entities, but the *prop bag* is plain runtime
+  // data — so an unbounded set of payload-driven slot names is fine as long as
+  // each snippet comes from `toChildSnippet`.
+  function toSlotSnippets(node: PortableRenderNode): Record<string, Snippet[]> {
+    const slotSnippets: Record<string, Snippet[]> = {};
+    for (const [slotName, children] of Object.entries(node.slots)) {
+      slotSnippets[slotName] = children.map(toChildSnippet);
+    }
+    return slotSnippets;
+  }
 </script>
 
-{#snippet renderNode(node: PortableRenderNode)}
-  {@const childNodes = (node.slots.children ?? []) as PortableRenderNode[]}
-  {@const children = childNodes.map(toChildSnippet)}
-  <NodeRenderer {node} {config} {experience} {renderUnknown} {children} />
+{#snippet renderNode(nodeArg: NodeArg)}
+  {@const node = unwrapNode(nodeArg)}
+  {@const slotSnippets = toSlotSnippets(node)}
+  <NodeRenderer {node} {config} {experience} {renderUnknown} {slotSnippets} />
 {/snippet}
 
 {#each nodes as node, index (node.nodeId ?? index)}

package/dist/NodesRenderer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NodesRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/NodesRenderer.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAG3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGtD,UAAU,kBAAkB;IAC1B,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,aAAa,CAAC;IAC1B,aAAa,EAAE,aAAa,CAAC;CAC9B;AAqCH,QAAA,MAAM,aAAa,wDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"NodesRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/NodesRenderer.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAG3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGtD,UAAU,kBAAkB;IAC1B,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,aAAa,CAAC;IAC1B,aAAa,EAAE,aAAa,CAAC;CAC9B;AA4DH,QAAA,MAAM,aAAa,wDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/ServerExperienceRenderer.svelte

@@ -14,7 +14,6 @@
   import DebugExperience from './DebugExperience.svelte';
   import MissingComponent from './MissingComponent.svelte';
   import NodesRenderer from './NodesRenderer.svelte';
-  import WrapWithExperienceTemplate from './WrapWithExperienceTemplate.svelte';
   import type { ServerExperienceRendererProps } from './component-props.js';
   import { setExperience } from './context.js';
   import type { RenderContext } from './types.js';
@@ -63,14 +62,10 @@
   {#if debug}
     <DebugExperience {experience} />
   {/if}
-  <WrapWithExperienceTemplate experienceTemplate={experience.experienceTemplate} {config} experience={renderContext}>
-    {#snippet children()}
-      <NodesRenderer
-        nodes={experience.nodes}
-        {config}
-        experience={renderContext}
-        {renderUnknown}
-      />
-    {/snippet}
-  </WrapWithExperienceTemplate>
+  <NodesRenderer
+    nodes={experience.nodes}
+    {config}
+    experience={renderContext}
+    {renderUnknown}
+  />
 {/if}

package/dist/ServerExperienceRenderer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ServerExperienceRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/ServerExperienceRenderer.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,sBAAsB,CAAC;AAsE1E,QAAA,MAAM,wBAAwB,mEAAwC,CAAC;AACvE,KAAK,wBAAwB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAC5E,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"ServerExperienceRenderer.svelte.d.ts","sourceRoot":"","sources":["../src/ServerExperienceRenderer.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,sBAAsB,CAAC;AAiE1E,QAAA,MAAM,wBAAwB,mEAAwC,CAAC;AACvE,KAAK,wBAAwB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAC5E,eAAe,wBAAwB,CAAC"}

package/dist/design-utils.d.ts

@@ -1,11 +1,3 @@
-import type { DesignPropValue, ResolveToken, ViewportDef } from '@contentful/experiences-sdk-core';
-export declare function selectResolvedDesign(props: {
-    design: Record<string, unknown>;
-    designRaw: Record<string, DesignPropValue>;
-}, viewports: ViewportDef[], activeViewportIndex: number, fallbackViewportIndex: number, resolveToken: ResolveToken | undefined): {
-    props: Record<string, unknown>;
-    unresolved: string[];
-};
 export interface ToCssOptions {
     /** Keys to skip, matched against the original record key. */
     exclude?: string[];

package/dist/design-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"design-utils.d.ts","sourceRoot":"","sources":["../src/design-utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAUnG,wBAAgB,oBAAoB,CAClC,KAAK,EAAE;IAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;CAAE,EACtF,SAAS,EAAE,WAAW,EAAE,EACxB,mBAAmB,EAAE,MAAM,EAC3B,qBAAqB,EAAE,MAAM,EAC7B,YAAY,EAAE,YAAY,GAAG,SAAS,GACrC;IAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAAC,UAAU,EAAE,MAAM,EAAE,CAAA;CAAE,CAM1D;AAED,MAAM,WAAW,YAAY;IAC3B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,KAAK,CACnB,MAAM,EAAE,MAAM,EACd,EAAE,OAAO,EAAE,OAAO,EAAE,GAAE,YAAiB,GACtC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAYjC"}
+{"version":3,"file":"design-utils.d.ts","sourceRoot":"","sources":["../src/design-utils.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,YAAY;IAC3B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,KAAK,CACnB,MAAM,EAAE,MAAM,EACd,EAAE,OAAO,EAAE,OAAO,EAAE,GAAE,YAAiB,GACtC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAYjC"}

package/dist/design-utils.js

@@ -1,13 +1,4 @@
-import { applyTokenResolver, isCssProperty, resolveDesignProperties, toCssKey, } from '@contentful/experiences-design';
-// Use the server-resolved `props.design` when the active viewport matches the
-// fallback; otherwise recompute the cascade from raw `props.designRaw`.
-export function selectResolvedDesign(props, viewports, activeViewportIndex, fallbackViewportIndex, resolveToken) {
-    if (activeViewportIndex === fallbackViewportIndex) {
-        return { props: props.design, unresolved: [] };
-    }
-    const resolvedDesign = resolveDesignProperties(props.designRaw, viewports, activeViewportIndex);
-    return applyTokenResolver(resolvedDesign, resolveToken);
-}
+import { isCssProperty, toCssKey } from '@contentful/experiences-design';
 /**
  * Convert a design record into a plain style object, keeping only keys that
  * normalize to a known CSS property. Non-CSS keys (`variant`, `as`, …) and

package/dist/index.d.ts

@@ -15,7 +15,7 @@ export { defineComponent, defineExperienceTemplate, normalizeComponentRegistrati
 export type { ComponentConfig, Components, Config, ContentfulComponent, ContentfulExperienceTemplate, ExperienceTemplateConfig, ExperienceTemplateRegistration, ExperienceTemplates, Registration, RenderContext, ResolveToken, } from './types.js';
 export { resolveExperience } from '@contentful/experiences-sdk-core';
 export type { ResolverConfig, ResolveExperienceOptions } from '@contentful/experiences-sdk-core';
-export type { ComponentNode, ComponentRef, DesignPropValue, DesignToken, ExperienceContext, ExperienceNode, ExperiencePayload, ExperienceSys, ExperienceTemplateNode, ExperienceTemplateRef, ManualDesignValue, PortableExperienceTemplate, PortableRegistration, PortableRenderNode, PortableRenderPlan, ResolveContext, ValuesByViewport, ViewportDef, } from '@contentful/experiences-sdk-core';
+export type { ComponentNode, ComponentRef, DesignPropValue, DesignToken, ExperienceContext, ExperienceNode, ExperiencePayload, ExperienceSys, ExperienceTemplateNode, ExperienceTemplateRef, ManualDesignValue, PortableRegistration, PortableRenderNode, PortableRenderPlan, ResolveContext, ValuesByViewport, ViewportDef, } from '@contentful/experiences-sdk-core';
 export { CSS_PROPERTIES, getValueForViewport, getViewportIndex, isCssProperty, resolveDesignProperties, toCssKey, toCssMediaQuery, } from '@contentful/experiences-design';
 export { ContentfulViewDelivery, ContentfulViewDeliveryClient, DELIVERY_HOST, NotFoundError, PREVIEW_HOST, createClient, fetchExperience, } from '@contentful/experiences-client';
 export type { ClientOptions, CreateClientOptions, ExperienceOptions, ResolveOptions, } from '@contentful/experiences-client';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAItE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAElE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,YAAY,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAG/E,OAAO,EACL,aAAa,EACb,sBAAsB,EACtB,+BAA+B,GAChC,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,YAAY,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,YAAY,EACV,6BAA6B,EAC7B,6BAA6B,IAAI,uBAAuB,EACxD,oBAAoB,EACpB,qBAAqB,EACrB,aAAa,EACb,6BAA6B,GAC9B,MAAM,sBAAsB,CAAC;AAG9B,OAAO,EACL,eAAe,EACf,wBAAwB,EACxB,8BAA8B,EAC9B,uCAAuC,GACxC,MAAM,YAAY,CAAC;AACpB,YAAY,EACV,eAAe,EACf,UAAU,EACV,MAAM,EACN,mBAAmB,EACnB,4BAA4B,EAC5B,wBAAwB,EACxB,8BAA8B,EAC9B,mBAAmB,EACnB,YAAY,EACZ,aAAa,EACb,YAAY,GACb,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,YAAY,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AAGjG,YAAY,EACV,aAAa,EACb,YAAY,EACZ,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,sBAAsB,EACtB,qBAAqB,EACrB,iBAAiB,EACjB,0BAA0B,EAC1B,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EAChB,WAAW,GACZ,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,aAAa,EACb,uBAAuB,EACvB,QAAQ,EACR,eAAe,GAChB,MAAM,gCAAgC,CAAC;AAGxC,OAAO,EACL,sBAAsB,EACtB,4BAA4B,EAC5B,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,eAAe,GAChB,MAAM,gCAAgC,CAAC;AACxC,YAAY,EACV,aAAa,EACb,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,GACf,MAAM,gCAAgC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAKtE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAElE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,YAAY,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAG/E,OAAO,EACL,aAAa,EACb,sBAAsB,EACtB,+BAA+B,GAChC,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,YAAY,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,YAAY,EACV,6BAA6B,EAC7B,6BAA6B,IAAI,uBAAuB,EACxD,oBAAoB,EACpB,qBAAqB,EACrB,aAAa,EACb,6BAA6B,GAC9B,MAAM,sBAAsB,CAAC;AAG9B,OAAO,EACL,eAAe,EACf,wBAAwB,EACxB,8BAA8B,EAC9B,uCAAuC,GACxC,MAAM,YAAY,CAAC;AACpB,YAAY,EACV,eAAe,EACf,UAAU,EACV,MAAM,EACN,mBAAmB,EACnB,4BAA4B,EAC5B,wBAAwB,EACxB,8BAA8B,EAC9B,mBAAmB,EACnB,YAAY,EACZ,aAAa,EACb,YAAY,GACb,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,YAAY,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AAGjG,YAAY,EACV,aAAa,EACb,YAAY,EACZ,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,sBAAsB,EACtB,qBAAqB,EACrB,iBAAiB,EACjB,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EAChB,WAAW,GACZ,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,aAAa,EACb,uBAAuB,EACvB,QAAQ,EACR,eAAe,GAChB,MAAM,gCAAgC,CAAC;AAGxC,OAAO,EACL,sBAAsB,EACtB,4BAA4B,EAC5B,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,eAAe,GAChB,MAAM,gCAAgC,CAAC;AACxC,YAAY,EACV,aAAa,EACb,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,GACf,MAAM,gCAAgC,CAAC"}

package/dist/index.js

@@ -17,7 +17,8 @@ export { default as ExperienceRenderer } from './ClientExperienceRenderer.svelte
 export { default as ServerExperienceRenderer } from './ServerExperienceRenderer.svelte';
 export { default as MissingComponent } from './MissingComponent.svelte';
 export { default as DebugExperience } from './DebugExperience.svelte';
-// Exposed so advanced customers can render non-`children` slots manually:
+// Every slot already arrives as a same-named `Snippet[]` prop; this is exposed so
+// advanced customers can render a slot's raw nodes themselves instead:
 // e.g. `<NodesRenderer nodes={contentful.slots.header as PortableRenderNode[]} ... />`.
 export { default as NodesRenderer } from './NodesRenderer.svelte';
 export { useActiveViewport } from './use-active-viewport.svelte.js';

package/dist/nodes-renderer.ssr.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=nodes-renderer.ssr.test.d.ts.map

package/dist/nodes-renderer.ssr.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodes-renderer.ssr.test.d.ts","sourceRoot":"","sources":["../src/nodes-renderer.ssr.test.ts"],"names":[],"mappings":""}