@contentful/experiences-svelte 0.5.5 → 0.5.7

package/dist/nodes-renderer.ssr.test.js

@@ -0,0 +1,126 @@
+/*
+ * True SSR coverage: renders through `svelte/server` so Svelte's *server*
+ * compiler output is exercised. Every other test in this package renders via
+ * `@testing-library/svelte`, i.e. the client build.
+ *
+ * The two builds differ in how a compiled snippet receives its arguments — by
+ * getter on the client, by value on the server — and `NodesRenderer` builds one
+ * snippet call by hand (`toChildSnippet`). These tests pin that nested nodes
+ * render under SSR for both node kinds; without the normalization in
+ * `NodesRenderer`, every child node throws.
+ *
+ * Runs under vitest.ssr.config.ts (environment: node).
+ */
+import { describe, expect, it } from 'vitest';
+import { render } from 'svelte/server';
+import { resolveExperience } from '@contentful/experiences-sdk-core';
+import ServerExperienceRenderer from './ServerExperienceRenderer.svelte';
+import ButtonFixture from './test-fixtures/ButtonFixture.svelte';
+import ContainerFixture from './test-fixtures/ContainerFixture.svelte';
+import ExperienceTemplateFixture from './test-fixtures/ExperienceTemplateFixture.svelte';
+const VIEWPORTS = [{ id: 'desktop', query: '*', displayName: 'Desktop', previewSize: '100%' }];
+const componentNode = (typeId, rest = {}) => ({
+    component: {
+        sys: {
+            type: 'ResourceLink',
+            linkType: 'Contentful:Component',
+            urn: `crn:contentful:::experience:spaces/$self/environments/$self/components/${typeId}`,
+        },
+    },
+    ...rest,
+});
+const experienceTemplateNode = (typeId, rest = {}) => ({
+    experienceTemplate: {
+        sys: {
+            type: 'ResourceLink',
+            linkType: 'Contentful:ExperienceTemplate',
+            urn: `crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/${typeId}`,
+        },
+    },
+    ...rest,
+});
+const button = (label) => componentNode('contentful-button', {
+    id: `btn-${label}`,
+    contentProperties: { label },
+    designProperties: {},
+    slots: {},
+});
+const config = {
+    components: {
+        'contentful-container': ContainerFixture,
+        'contentful-button': ButtonFixture,
+    },
+    experienceTemplates: { page: ExperienceTemplateFixture },
+};
+const renderPlan = async (payload) => {
+    const plan = await resolveExperience(payload, config);
+    return render(ServerExperienceRenderer, {
+        props: { experience: plan, config },
+    }).body;
+};
+describe('NodesRenderer — SSR (server-compiled output)', () => {
+    it('renders a component node’s slot children', async () => {
+        const html = await renderPlan({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('contentful-container', {
+                    id: 'container',
+                    contentProperties: {},
+                    designProperties: {},
+                    slots: { children: [button('Get started')] },
+                }),
+            ],
+        });
+        expect(html).toContain('Get started');
+        expect(html.indexOf('<div')).toBeLessThan(html.indexOf('Get started'));
+    });
+    it('renders a coded Experience Template node’s named `content` slot', async () => {
+        const html = await renderPlan({
+            viewports: VIEWPORTS,
+            nodes: [
+                experienceTemplateNode('page', {
+                    id: 'tpl',
+                    contentProperties: { title: 'Coded page' },
+                    designProperties: {},
+                    slots: { content: [button('Read the blog')] },
+                }),
+            ],
+        });
+        expect(html).toContain('data-experience-template="page"');
+        expect(html).toContain('data-title="Coded page"');
+        expect(html).toContain('Read the blog');
+        // The button is inside the template chrome, not a sibling of it.
+        expect(html.split('<main')[1]).toContain('Read the blog');
+    });
+    it('renders deeply nested slot children', async () => {
+        const html = await renderPlan({
+            viewports: VIEWPORTS,
+            nodes: [
+                experienceTemplateNode('page', {
+                    id: 'tpl',
+                    contentProperties: {},
+                    designProperties: {},
+                    slots: {
+                        content: [
+                            componentNode('contentful-container', {
+                                id: 'container',
+                                contentProperties: {},
+                                designProperties: {},
+                                slots: { children: [button('Deep')] },
+                            }),
+                        ],
+                    },
+                }),
+            ],
+        });
+        expect(html).toContain('Deep');
+    });
+    it('renders a composite experience unwrapped', async () => {
+        const html = await renderPlan({
+            viewports: VIEWPORTS,
+            nodes: [button('Alone')],
+        });
+        expect(html).toContain('Alone');
+        expect(html).not.toContain('<main');
+    });
+});

package/dist/server-renderer.test.js

@@ -35,6 +35,38 @@ function componentNode(typeId, rest = {}) {
         ...rest,
     };
 }
+/**
+ * A coded Experience Template is an ordinary top-level node — the only
+ * difference from `componentNode` is which registry its id resolves against.
+ */
+function experienceTemplateNode(typeId, rest = {}) {
+    return {
+        experienceTemplate: {
+            sys: {
+                type: 'ResourceLink',
+                linkType: 'Contentful:ExperienceTemplate',
+                urn: `crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/${typeId}`,
+            },
+        },
+        ...rest,
+    };
+}
+/**
+ * `sys.experienceTemplate` rides along on every Experience — coded and
+ * composite alike — so it must never influence rendering. Tests attach it to
+ * prove it is ignored.
+ */
+function sysWithExperienceTemplate(typeId) {
+    return {
+        experienceTemplate: {
+            sys: {
+                type: 'ResourceLink',
+                linkType: 'Contentful:ExperienceTemplate',
+                urn: `crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/${typeId}`,
+            },
+        },
+    };
+}
 beforeEach(() => {
     captureSink.splice(0);
 });
@@ -158,13 +190,13 @@ describe('ServerExperienceRenderer', () => {
             nodes: [
                 {
                     nodeId: 'root',
-                    registration: { componentId: 'contentful-container' },
+                    registration: { kind: 'component', id: 'contentful-container' },
                     props: { content: {}, design: {}, designRaw: {} },
                     slots: {
                         children: [
                             {
                                 nodeId: 'ghost',
-                                registration: { componentId: 'NotRegistered' },
+                                registration: { kind: 'component', id: 'NotRegistered' },
                                 props: { content: {}, design: {}, designRaw: {} },
                                 slots: {},
                             },
@@ -247,7 +279,7 @@ describe('ServerExperienceRenderer', () => {
             nodes: [
                 {
                     nodeId: 'r',
-                    registration: { componentId: 'item' },
+                    registration: { kind: 'component', id: 'item' },
                     props: {
                         content: { value: 'fromContent' },
                         design: {},
@@ -263,25 +295,26 @@ describe('ServerExperienceRenderer', () => {
         });
         expect(container.innerHTML).toContain('data-value="fromResolveData"');
     });
-    it('wraps rendered nodes with the registered experienceTemplate', async () => {
+    it('renders an experienceTemplate node from the experienceTemplates registry', async () => {
         const tplConfig = {
             components: { item: PrecedenceFixture },
             experienceTemplates: {
                 page: { component: ExperienceTemplateFixture, defaults: { title: 'Default Title' } },
             },
         };
+        // The payload's `content` slot must arrive as a named `content` Snippet[]
+        // prop — the fixture renders it, so the child only appears if that holds.
         const tplPayload = {
-            sys: {
-                experienceTemplate: {
-                    sys: {
-                        type: 'ResourceLink',
-                        linkType: 'Contentful:ExperienceTemplate',
-                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/page',
-                    },
-                },
-            },
+            sys: sysWithExperienceTemplate('page'),
             viewports: VIEWPORTS,
-            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'inside' } })],
+            nodes: [
+                experienceTemplateNode('page', {
+                    id: 'tpl',
+                    slots: {
+                        content: [componentNode('item', { id: 'i', contentProperties: { value: 'inside' } })],
+                    },
+                }),
+            ],
         };
         const plan = await resolveExperience(tplPayload, tplConfig);
         const { container } = render(ServerExperienceRenderer, {
@@ -291,26 +324,52 @@ describe('ServerExperienceRenderer', () => {
         expect(container.innerHTML).toContain('data-title="Default Title"');
         expect(container.innerHTML).toContain('inside');
     });
-    it('renders nodes unwrapped + warns when the experienceTemplate is not registered', async () => {
+    it('renders a composite experience unwrapped — sys.experienceTemplate is ignored', async () => {
+        const warn = vi.spyOn(console, 'warn').mockImplementation(() => { });
+        // `hero` is registered as a template, but the nodes are plain components,
+        // so nothing may wrap them.
+        const cfg = {
+            components: { item: PrecedenceFixture },
+            experienceTemplates: { hero: ExperienceTemplateFixture },
+        };
+        const plan = await resolveExperience({
+            sys: sysWithExperienceTemplate('hero'),
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('item', { id: 'a', contentProperties: { value: 'one' } }),
+                componentNode('item', { id: 'b', contentProperties: { value: 'two' } }),
+            ],
+        }, cfg);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(container.innerHTML).toContain('data-value="one"');
+        expect(container.innerHTML).toContain('data-value="two"');
+        expect(container.innerHTML).not.toContain('data-experience-template');
+        expect(warn).not.toHaveBeenCalled();
+        warn.mockRestore();
+    });
+    it('renders slot children unwrapped + warns when the experienceTemplate is not registered', async () => {
         const warn = vi.spyOn(console, 'warn').mockImplementation(() => { });
         const cfg = { components: { item: PrecedenceFixture } };
         const tplPayload = {
-            sys: {
-                experienceTemplate: {
-                    sys: {
-                        type: 'ResourceLink',
-                        linkType: 'Contentful:ExperienceTemplate',
-                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/missing-experienceTemplate',
-                    },
-                },
-            },
             viewports: VIEWPORTS,
-            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'unwrapped' } })],
+            nodes: [
+                experienceTemplateNode('missing-experienceTemplate', {
+                    id: 'tpl',
+                    slots: {
+                        content: [
+                            componentNode('item', { id: 'i', contentProperties: { value: 'unwrapped' } }),
+                        ],
+                    },
+                }),
+            ],
         };
         const plan = await resolveExperience(tplPayload, cfg);
         const { container } = render(ServerExperienceRenderer, {
             props: { experience: plan, config: cfg },
         });
+        // The subtree survives — an unregistered template must not blank the page.
         expect(container.innerHTML).toContain('data-value="unwrapped"');
         expect(container.innerHTML).not.toContain('data-experience-template');
         expect(warn).toHaveBeenCalledWith(expect.stringContaining('missing-experienceTemplate'));
@@ -407,8 +466,9 @@ describe('ServerExperienceRenderer — bare-component registrations', () => {
         expect(keys).toContain('text');
         expect(keys).not.toContain('experience');
         expect(keys).not.toContain('contentful');
-        // Children is always injected as a Snippet by the renderer.
-        expect(keys).toContain('children');
+        // Slot props exist only for slots the payload actually carries — `children`
+        // is just a slot name, so a node without slots gets no `children` prop.
+        expect(keys).not.toContain('children');
     });
 });
 describe('ServerExperienceRenderer — getContentfulComponent()', () => {
@@ -518,32 +578,28 @@ describe('ServerExperienceRenderer — resolveToken', () => {
         // unchanged, so the customer can inspect it or resolve it themselves.
         expect(container.innerHTML).toContain('data-bg="[object Object]"');
     });
-    it('runs on page-level experienceTemplate design props too', async () => {
+    it('runs on an experienceTemplate node design props too', async () => {
         const tplConfig = {
             components: { item: PrecedenceFixture },
             experienceTemplates: { page: ExperienceTemplateFixture },
             resolveToken: (ref) => (ref.value === 'brand/canvas' ? '#111827' : undefined),
         };
         const tplPayload = {
-            sys: {
-                experienceTemplate: {
-                    sys: {
-                        type: 'ResourceLink',
-                        linkType: 'Contentful:ExperienceTemplate',
-                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/experienceTemplates/page',
-                    },
-                },
-            },
+            sys: sysWithExperienceTemplate('page'),
             viewports: VIEWPORTS,
-            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'ok' } })],
+            nodes: [
+                experienceTemplateNode('page', {
+                    id: 'tpl',
+                    designProperties: { cfBackground: dt('brand/canvas') },
+                    slots: {
+                        content: [componentNode('item', { id: 'i', contentProperties: { value: 'ok' } })],
+                    },
+                }),
+            ],
         };
         const plan = await resolveExperience(tplPayload, tplConfig);
-        // Experience Templates don't carry design props in the current XDA payload
-        // shape; seed a raw token on the resolved plan so we exercise the
-        // experienceTemplate path. Render at a non-fallback viewport (mobile ≠
-        // fallback index 0) so the adapter recomputes from the seeded raw design
-        // and runs resolveToken.
-        plan.experienceTemplate.props.designRaw = { cfBackground: dt('brand/canvas') };
+        // Render at a non-fallback viewport (mobile ≠ fallback index 0) so the
+        // adapter recomputes from the raw design and runs resolveToken itself.
         const { container } = render(ServerExperienceRenderer, {
             props: { experience: plan, config: tplConfig, initialViewportId: 'mobile' },
         });

package/dist/test-fixtures/ExperienceTemplateFixture.svelte

@@ -3,16 +3,21 @@
 
   import { getDesignValues } from '../get-design-values.js';
 
+  // A coded Experience Template's slots arrive as named `Snippet[]` props, so
+  // the payload's `content` slot lands on a `content` prop — no `children`
+  // special case.
   let {
     title,
-    children,
+    content,
   }: {
     title?: string;
-    children: Snippet;
+    content?: Snippet[];
   } = $props();
   const design = $derived(getDesignValues());
 </script>
 
 <main data-experience-template="page" data-title={title} data-bg={design.cfBackground as string}>
-  {@render children()}
+  {#each content ?? [] as childSnippet, index (index)}
+    {@render childSnippet()}
+  {/each}
 </main>

package/dist/test-fixtures/ExperienceTemplateFixture.svelte.d.ts

@@ -1,7 +1,7 @@
 import type { Snippet } from 'svelte';
 type $$ComponentProps = {
     title?: string;
-    children: Snippet;
+    content?: Snippet[];
 };
 declare const ExperienceTemplateFixture: import("svelte").Component<$$ComponentProps, {}, "">;
 type ExperienceTemplateFixture = ReturnType<typeof ExperienceTemplateFixture>;

package/dist/test-fixtures/ExperienceTemplateFixture.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExperienceTemplateFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/ExperienceTemplateFixture.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAIrC,KAAK,gBAAgB,GAAI;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAmBJ,QAAA,MAAM,yBAAyB,sDAAwC,CAAC;AACxE,KAAK,yBAAyB,GAAG,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;AAC9E,eAAe,yBAAyB,CAAC"}
+{"version":3,"file":"ExperienceTemplateFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/ExperienceTemplateFixture.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAIrC,KAAK,gBAAgB,GAAI;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;CACrB,CAAC;AAwBJ,QAAA,MAAM,yBAAyB,sDAAwC,CAAC;AACxE,KAAK,yBAAyB,GAAG,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;AAC9E,eAAe,yBAAyB,CAAC"}

package/dist/types.d.ts

@@ -7,7 +7,7 @@ export type { ResolveContext, ResolveToken };
  * node. Useful for custom design-property resolution outside the SDK's
  * cascade, branching by `componentId` in a generic wrapper, keying
  * analytics on `nodeId`, rendering a raw-payload panel in preview, or
- * rendering non-`children` slots through the exported `<NodesRenderer />`.
+ * re-rendering a slot's nodes yourself through the exported `<NodesRenderer />`.
  *
  * Design properties stay in their **raw discriminated form** here (the same
  * shape `ctx.design` carries inside `resolveData`). The viewport-cascaded,
@@ -20,20 +20,21 @@ export interface ContentfulComponent {
     design: Record<string, DesignPropValue>;
     resolved?: Record<string, unknown>;
     /**
-     * Raw per-slot node arrays from the payload. The default slot named
-     * `children` is rendered automatically and passed as a Snippet prop;
-     * additional slots (if any) are reachable here and can be rendered with
-     * `<NodesRenderer nodes={...} />`.
+     * Raw per-slot node arrays from the payload. Every slot is also rendered
+     * automatically and passed as a same-named `Snippet[]` prop (`children` is
+     * not special); these raw nodes are here for callers that want to render a
+     * slot themselves with `<NodesRenderer nodes={...} />`.
      */
     slots: Record<string, unknown>;
 }
 /**
- * Same shape as `ContentfulComponent`, but for the page-level Experience
- * Template.
- * Exposed via `getContentfulExperienceTemplate()` inside an Experience Template's component tree.
+ * Same shape as `ContentfulComponent`, but for an Experience Template node.
+ * Exposed via `getContentfulExperienceTemplate()` inside an Experience
+ * Template's component tree.
  */
 export interface ContentfulExperienceTemplate {
     experienceTemplateId: string;
+    nodeId?: string;
     content: Record<string, unknown>;
     design: Record<string, DesignPropValue>;
     resolved?: Record<string, unknown>;
@@ -56,8 +57,8 @@ export interface RenderContext extends ExperienceContext {
 }
 /**
  * Customer-supplied configuration for a single component type. The `component`
- * receives the merged props (design + content + resolveData + `children`
- * Snippet); resolved design values auto-fill matching props and are also
+ * receives the merged props (design + content + resolveData + one `Snippet[]`
+ * prop per slot); resolved design values auto-fill matching props and are also
  * readable via `getDesignValues()`. Runtime context and raw payload come from
  * `getExperience()` / `getContentfulComponent()`.
  */
@@ -76,6 +77,13 @@ export interface ComponentConfig<Props extends object = Record<string, unknown>>
  *   card:   defineComponent<CardProps>({ component: Card, resolveData: ... }),
  */
 export type Registration<Props extends object = Record<string, unknown>> = Component<any> | ComponentConfig<Props>;
+/**
+ * Customer-supplied configuration for a coded Experience Template. Identical in
+ * shape and behavior to `ComponentConfig` — an Experience Template is just a
+ * node whose implementation lives in the `experienceTemplates` registry. Its
+ * slots arrive as named `Snippet[]` props (a `content` slot becomes a `content`
+ * prop), so there is no `children` special case.
+ */
 export interface ExperienceTemplateConfig<Props extends object = Record<string, unknown>> {
     defaults?: Partial<Props>;
     resolveData?: (ctx: ResolveContext) => Partial<Props> | Promise<Partial<Props>>;
@@ -84,7 +92,17 @@ export interface ExperienceTemplateConfig<Props extends object = Record<string,
 export type ExperienceTemplateRegistration<Props extends object = Record<string, unknown>> = Component<any> | ExperienceTemplateConfig<Props>;
 export declare function defineExperienceTemplate<Props extends object = Record<string, unknown>>(config: ExperienceTemplateConfig<Props>): ExperienceTemplateConfig<Props>;
 export declare function defineComponent<Props extends object = Record<string, unknown>>(config: ComponentConfig<Props>): ComponentConfig<Props>;
+/**
+ * Component registry — keyed by `componentId` (last slash-segment of
+ * `component.sys.urn`).
+ */
 export type Components = Record<string, Registration<any>>;
+/**
+ * Experience Template registry — keyed by `experienceTemplateId` (last
+ * slash-segment of an Experience Template node's own
+ * `experienceTemplate.sys.urn`). Not read from `payload.sys`; templates are
+ * ordinary nodes.
+ */
 export type ExperienceTemplates = Record<string, ExperienceTemplateRegistration<any>>;
 export interface Config {
     components: Components;

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/use-active-viewport.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-active-viewport.svelte.d.ts","sourceRoot":"","sources":["../src/use-active-viewport.svelte.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAGpE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,mBAAmB,EAAE,MAAM,CAAC;CACtC;AA4BD;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,WAAW,EAAE,EACxB,iBAAiB,CAAC,EAAE,MAAM,GACzB,uBAAuB,CAiDzB"}
+{"version":3,"file":"use-active-viewport.svelte.d.ts","sourceRoot":"","sources":["../src/use-active-viewport.svelte.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAGpE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,mBAAmB,EAAE,MAAM,CAAC;CACtC;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,WAAW,EAAE,EACxB,iBAAiB,CAAC,EAAE,MAAM,GACzB,uBAAuB,CAiDzB"}

package/dist/use-active-viewport.svelte.js

@@ -10,28 +10,7 @@
  * to seed the first render so SSR + client agree on viewport before
  * window.matchMedia takes over.
  */
-import { getViewportIndex, toCssMediaQuery } from '@contentful/experiences-design';
-function createMediaQueryMatchers(viewports) {
-    const mediaQueryMatches = new Array(viewports.length).fill(false);
-    // The first viewport is the wildcard "*" and always matches.
-    mediaQueryMatches[0] = true;
-    const mediaQueryMatchers = [];
-    if (typeof window === 'undefined') {
-        return [mediaQueryMatchers, mediaQueryMatches];
-    }
-    for (let index = 0; index < viewports.length; index++) {
-        const viewport = viewports[index];
-        if (!viewport)
-            continue;
-        const cssQuery = toCssMediaQuery(viewport);
-        if (!cssQuery)
-            continue;
-        const matcher = window.matchMedia(cssQuery);
-        mediaQueryMatches[index] = matcher.matches;
-        mediaQueryMatchers.push({ index, signal: matcher });
-    }
-    return [mediaQueryMatchers, mediaQueryMatches];
-}
+import { createMediaQueryMatchers, getViewportIndex } from '@contentful/experiences-design';
 /**
  * Returns a reactive object whose `activeViewportIndex` updates as the
  * window's matched media queries change. Mounts listeners via `$effect`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/experiences-svelte",
-  "version": "0.5.5",
+  "version": "0.5.7",
   "description": "Svelte adapter for Contentful Experiences — Server and Client renderers over a PortableRenderPlan",
   "license": "MIT",
   "type": "module",
@@ -31,13 +31,13 @@
   },
   "scripts": {
     "build": "svelte-package -i src -o dist && publint",
-    "test": "vitest run",
+    "test": "vitest run && vitest run -c vitest.ssr.config.ts",
     "check": "svelte-check --tsconfig ./tsconfig.json"
   },
   "dependencies": {
-    "@contentful/experiences-client": "0.3.4",
-    "@contentful/experiences-sdk-core": "0.7.4",
-    "@contentful/experiences-design": "0.7.4"
+    "@contentful/experiences-client": "0.3.6",
+    "@contentful/experiences-sdk-core": "0.7.6",
+    "@contentful/experiences-design": "0.7.6"
   },
   "peerDependencies": {
     "svelte": "^5.55.7"

package/dist/WrapWithExperienceTemplate.svelte

@@ -1,90 +0,0 @@
-<!--
- * Wraps the rendered Experience nodes with the page-level Experience Template when the
- * plan carries one and the customer registered an Experience Template config under that
- * id. When the Experience Template is referenced but unregistered, warns once and
- * renders children unwrapped — graceful degradation matches the
- * unknown-component fallback story.
--->
-<script lang="ts">
-  import type { Snippet } from 'svelte';
-
-  import type { PortableExperienceTemplate } from '@contentful/experiences-sdk-core';
-
-  import { setContentfulExperienceTemplate, setResolvedDesign } from './context.js';
-  import { selectResolvedDesign } from './design-utils.js';
-  import {
-    normalizeExperienceTemplateRegistration,
-    type ContentfulExperienceTemplate,
-    type Config,
-    type RenderContext,
-  } from './types.js';
-
-  interface WrapWithExperienceTemplateProps {
-    experienceTemplate: PortableExperienceTemplate | undefined;
-    config: Config;
-    experience: RenderContext;
-    children: Snippet;
-  }
-
-  let { experienceTemplate, config, experience, children }: WrapWithExperienceTemplateProps = $props();
-
-  // setContext must run during synchronous component init — call once with
-  // the initial value (Experience Templates do not toggle on/off mid-mount).
-  if (experienceTemplate) {
-    setContentfulExperienceTemplate({
-      experienceTemplateId: experienceTemplate.experienceTemplateId,
-      content: experienceTemplate.props.content,
-      design: experienceTemplate.props.designRaw,
-      resolved: experienceTemplate.props.resolved,
-    } satisfies ContentfulExperienceTemplate);
-  }
-
-  const entry = $derived(experienceTemplate ? config.experienceTemplates?.[experienceTemplate.experienceTemplateId] : undefined);
-  const experienceTemplateConfig = $derived(entry ? normalizeExperienceTemplateRegistration(entry) : null);
-
-  const tokenResolvedDesign = $derived.by(() => {
-    if (!experienceTemplate) return {};
-    const { props, unresolved } = selectResolvedDesign(
-      experienceTemplate.props,
-      experience.viewports,
-      experience.activeViewportIndex,
-      experience.fallbackViewportIndex,
-      config.resolveToken
-    );
-    if (unresolved.length && typeof console !== 'undefined') {
-      console.warn(
-        `[@contentful/experiences-svelte] resolveToken returned undefined for token id(s) on experience template "${experienceTemplate.experienceTemplateId}": ${unresolved.join(', ')}. getDesignValues() will omit those keys.`
-      );
-    }
-    return props;
-  });
-
-  // A getter (not a snapshot) so getDesignValues() stays reactive.
-  setResolvedDesign(() => tokenResolvedDesign);
-
-  // Same precedence as component nodes.
-  const composed = $derived.by(() => {
-    if (!experienceTemplate || !experienceTemplateConfig) return null;
-    return {
-      ...experienceTemplateConfig.defaults,
-      ...tokenResolvedDesign,
-      ...experienceTemplate.props.content,
-      ...experienceTemplate.props.resolved,
-    };
-  });
-
-  $effect(() => {
-    if (experienceTemplate && !experienceTemplateConfig && typeof console !== 'undefined') {
-      console.warn(
-        `[@contentful/experiences-svelte] No experience template registered for id "${experienceTemplate.experienceTemplateId}". Rendering nodes without the experience template wrapper.`
-      );
-    }
-  });
-</script>
-
-{#if experienceTemplate && experienceTemplateConfig && composed}
-  {@const Tpl = experienceTemplateConfig.component}
-  <Tpl {...composed} {children} />
-{:else}
-  {@render children()}
-{/if}

package/dist/WrapWithExperienceTemplate.svelte.d.ts

@@ -1,13 +0,0 @@
-import type { Snippet } from 'svelte';
-import type { PortableExperienceTemplate } from '@contentful/experiences-sdk-core';
-import { type Config, type RenderContext } from './types.js';
-interface WrapWithExperienceTemplateProps {
-    experienceTemplate: PortableExperienceTemplate | undefined;
-    config: Config;
-    experience: RenderContext;
-    children: Snippet;
-}
-declare const WrapWithExperienceTemplate: import("svelte").Component<WrapWithExperienceTemplateProps, {}, "">;
-type WrapWithExperienceTemplate = ReturnType<typeof WrapWithExperienceTemplate>;
-export default WrapWithExperienceTemplate;
-//# sourceMappingURL=WrapWithExperienceTemplate.svelte.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"WrapWithExperienceTemplate.svelte.d.ts","sourceRoot":"","sources":["../src/WrapWithExperienceTemplate.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAC;AAInF,OAAO,EAGH,KAAK,MAAM,EACX,KAAK,aAAa,EACnB,MAAM,YAAY,CAAC;AAGpB,UAAU,+BAA+B;IACvC,kBAAkB,EAAE,0BAA0B,GAAG,SAAS,CAAC;IAC3D,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,aAAa,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;CACnB;AA6EH,QAAA,MAAM,0BAA0B,qEAAwC,CAAC;AACzE,KAAK,0BAA0B,GAAG,UAAU,CAAC,OAAO,0BAA0B,CAAC,CAAC;AAChF,eAAe,0BAA0B,CAAC"}