@contentful/experiences-svelte 0.3.1

package/dist/server-renderer.test.js

@@ -0,0 +1,566 @@
+import { render } from '@testing-library/svelte';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { resolveExperience } from '@contentful/experiences-core';
+import ServerExperienceRenderer from './ServerExperienceRenderer.svelte';
+import CapturingComponent from './test-fixtures/CapturingComponent.svelte';
+import ButtonFixture from './test-fixtures/ButtonFixture.svelte';
+import ContainerFixture from './test-fixtures/ContainerFixture.svelte';
+import HeadingFixture from './test-fixtures/HeadingFixture.svelte';
+import ItemFixture from './test-fixtures/ItemFixture.svelte';
+import PrecedenceFixture from './test-fixtures/PrecedenceFixture.svelte';
+import TemplateFixture from './test-fixtures/TemplateFixture.svelte';
+import { captureSink } from './test-fixtures/capture-sink.js';
+import { toCss } from './design-utils.js';
+const VIEWPORTS = [
+    { id: 'desktop', query: '*', displayName: 'Desktop', previewSize: '100%' },
+    { id: 'tablet', query: '<992px', displayName: 'Tablet', previewSize: '100%' },
+    { id: 'mobile', query: '<576px', displayName: 'Mobile', previewSize: '100%' },
+];
+const m = (value) => ({ type: 'ManualDesignValue', value });
+const vbv = (values) => ({
+    type: 'ValuesByViewport',
+    values,
+});
+const dt = (value) => ({ type: 'DesignToken', value });
+function componentNode(typeId, rest = {}) {
+    return {
+        componentType: {
+            sys: {
+                type: 'ResourceLink',
+                linkType: 'Contentful:ComponentType',
+                urn: `crn:contentful:::experience:spaces/$self/environments/$self/componentTypes/${typeId}`,
+            },
+        },
+        ...rest,
+    };
+}
+beforeEach(() => {
+    captureSink.splice(0);
+});
+const config = {
+    components: {
+        'contentful-container': ContainerFixture,
+        'contentful-heading': HeadingFixture,
+        'contentful-button': ButtonFixture,
+    },
+};
+const payload = {
+    viewports: VIEWPORTS,
+    nodes: [
+        componentNode('contentful-container', {
+            id: 'page',
+            contentProperties: {},
+            designProperties: {
+                cfPadding: vbv({ desktop: m('40px'), mobile: m('12px') }),
+            },
+            slots: {
+                children: [
+                    componentNode('contentful-heading', {
+                        id: 'heading',
+                        contentProperties: { text: 'Build faster' },
+                        designProperties: {
+                            cfFontSize: vbv({ desktop: m('32px'), mobile: m('20px') }),
+                        },
+                    }),
+                    componentNode('contentful-button', {
+                        id: 'btn',
+                        contentProperties: { label: 'Get started' },
+                        designProperties: {
+                            cfBackgroundColor: vbv({
+                                desktop: m('#4f39f6'),
+                                tablet: m('#ff0000'),
+                                mobile: m('#00aa00'),
+                            }),
+                        },
+                    }),
+                ],
+            },
+        }),
+    ],
+};
+describe('ServerExperienceRenderer', () => {
+    it('renders a nested experience with desktop-resolved design props by default', async () => {
+        const plan = await resolveExperience(payload, config);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config },
+        });
+        const html = container.innerHTML;
+        expect(html).toContain('data-padding="40px"');
+        expect(html).toContain('data-font-size="32px"');
+        expect(html).toContain('data-bg="#4f39f6"');
+        expect(html).toContain('Build faster');
+        expect(html).toContain('Get started');
+    });
+    it('honors initialViewportId when resolving design props', async () => {
+        const plan = await resolveExperience(payload, config);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config, initialViewportId: 'mobile' },
+        });
+        const html = container.innerHTML;
+        expect(html).toContain('data-padding="12px"');
+        expect(html).toContain('data-font-size="20px"');
+        expect(html).toContain('data-bg="#00aa00"');
+    });
+    it('cascades design values when the active viewport has none', async () => {
+        const plan = await resolveExperience(payload, config);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config, initialViewportId: 'tablet' },
+        });
+        const html = container.innerHTML;
+        expect(html).toContain('data-font-size="32px"'); // cascaded from desktop
+        expect(html).toContain('data-bg="#ff0000"'); // tablet-specific
+    });
+    it('renders nothing meaningful when plan is null/undefined', () => {
+        const { container: nullContainer } = render(ServerExperienceRenderer, {
+            props: { experience: null, config },
+        });
+        expect(nullContainer.querySelector('*')).toBeNull();
+        const { container: undefContainer } = render(ServerExperienceRenderer, {
+            props: { experience: undefined, config },
+        });
+        expect(undefContainer.querySelector('*')).toBeNull();
+    });
+    it('exposes the active viewport on render context (defaults to viewport[0])', async () => {
+        const captureConfig = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({ viewports: VIEWPORTS, nodes: [componentNode('capture')] }, captureConfig);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: captureConfig },
+        });
+        expect(captureSink.length).toBe(1);
+        const ctx = captureSink[0].experience;
+        expect(ctx.activeViewportIndex).toBe(0);
+        expect(ctx.activeViewport).toBe(VIEWPORTS[0]);
+        expect(ctx.viewports).toBe(VIEWPORTS);
+    });
+    it('honors initialViewportId when computing the active viewport', async () => {
+        const captureConfig = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({ viewports: VIEWPORTS, nodes: [componentNode('capture')] }, captureConfig);
+        render(ServerExperienceRenderer, {
+            props: {
+                experience: plan,
+                config: captureConfig,
+                initialViewportId: 'mobile',
+            },
+        });
+        const ctx = captureSink[0].experience;
+        expect(ctx.activeViewportIndex).toBe(2);
+        expect(ctx.activeViewport).toBe(VIEWPORTS[2]);
+    });
+    it('renders missing-component fallback in preview mode', () => {
+        const warn = vi.spyOn(console, 'warn').mockImplementation(() => { });
+        const justContainer = {
+            components: { 'contentful-container': ContainerFixture },
+        };
+        const planWithMissing = {
+            viewports: VIEWPORTS,
+            nodes: [
+                {
+                    nodeId: 'root',
+                    registration: { componentTypeId: 'contentful-container' },
+                    props: { content: {}, design: {} },
+                    slots: {
+                        children: [
+                            {
+                                nodeId: 'ghost',
+                                registration: { componentTypeId: 'NotRegistered' },
+                                props: { content: {}, design: {} },
+                                slots: {},
+                            },
+                        ],
+                    },
+                },
+            ],
+        };
+        const { container: previewContainer } = render(ServerExperienceRenderer, {
+            props: {
+                experience: planWithMissing,
+                config: justContainer,
+                context: { isPreview: true },
+            },
+        });
+        expect(previewContainer.innerHTML).toContain('data-experiences-missing="NotRegistered"');
+        const { container: prodContainer } = render(ServerExperienceRenderer, {
+            props: { experience: planWithMissing, config: justContainer },
+        });
+        expect(prodContainer.innerHTML).not.toContain('data-experiences-missing');
+        warn.mockRestore();
+    });
+    it('merges defaults beneath content (content wins)', async () => {
+        const itemConfig = {
+            components: {
+                item: {
+                    defaults: { variant: 'fallback', priority: 'low' },
+                    component: ItemFixture,
+                },
+            },
+        };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('item', {
+                    id: 'i',
+                    contentProperties: { variant: 'fromContent' },
+                }),
+            ],
+        }, itemConfig);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: itemConfig },
+        });
+        expect(container.innerHTML).toContain('data-variant="fromContent"');
+        expect(container.innerHTML).toContain('data-priority="low"');
+    });
+    it('respects merge precedence: defaults < content < resolved', () => {
+        const precedenceConfig = {
+            components: {
+                item: {
+                    defaults: { value: 'fromDefault' },
+                    component: PrecedenceFixture,
+                },
+            },
+        };
+        const planWithResolved = {
+            viewports: VIEWPORTS,
+            nodes: [
+                {
+                    nodeId: 'r',
+                    registration: { componentTypeId: 'item' },
+                    props: {
+                        content: { value: 'fromContent' },
+                        design: {},
+                        resolved: { value: 'fromResolveData' },
+                    },
+                    slots: {},
+                },
+            ],
+        };
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: planWithResolved, config: precedenceConfig },
+        });
+        expect(container.innerHTML).toContain('data-value="fromResolveData"');
+    });
+    it('wraps rendered nodes with the registered template', async () => {
+        const tplConfig = {
+            components: { item: PrecedenceFixture },
+            templates: {
+                page: { component: TemplateFixture, defaults: { title: 'Default Title' } },
+            },
+        };
+        const tplPayload = {
+            sys: {
+                template: {
+                    sys: {
+                        type: 'ResourceLink',
+                        linkType: 'Contentful:Template',
+                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/templates/page',
+                    },
+                },
+            },
+            viewports: VIEWPORTS,
+            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'inside' } })],
+        };
+        const plan = await resolveExperience(tplPayload, tplConfig);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: tplConfig },
+        });
+        expect(container.innerHTML).toContain('data-template="page"');
+        expect(container.innerHTML).toContain('data-title="Default Title"');
+        expect(container.innerHTML).toContain('inside');
+    });
+    it('renders nodes unwrapped + warns when the template is not registered', async () => {
+        const warn = vi.spyOn(console, 'warn').mockImplementation(() => { });
+        const cfg = { components: { item: PrecedenceFixture } };
+        const tplPayload = {
+            sys: {
+                template: {
+                    sys: {
+                        type: 'ResourceLink',
+                        linkType: 'Contentful:Template',
+                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/templates/missing-template',
+                    },
+                },
+            },
+            viewports: VIEWPORTS,
+            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'unwrapped' } })],
+        };
+        const plan = await resolveExperience(tplPayload, cfg);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(container.innerHTML).toContain('data-value="unwrapped"');
+        expect(container.innerHTML).not.toContain('data-template');
+        expect(warn).toHaveBeenCalledWith(expect.stringContaining('missing-template'));
+        warn.mockRestore();
+    });
+});
+describe('ServerExperienceRenderer — bare-component registrations', () => {
+    it('accepts a bare Svelte component as a registry entry', async () => {
+        const cfg = { components: { item: PrecedenceFixture } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [componentNode('item', { id: 'b', contentProperties: { value: 'hi' } })],
+        }, cfg);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(container.innerHTML).toContain('data-value="hi"');
+    });
+    it('does NOT spread experience/contentful as props onto components', async () => {
+        const cfg = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('capture', {
+                    id: 'c',
+                    contentProperties: { text: 'hi' },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        const keys = Object.keys(captureSink[0].props);
+        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');
+    });
+});
+describe('ServerExperienceRenderer — getContentfulComponent()', () => {
+    it('exposes the raw Contentful payload to descendants', async () => {
+        const cfg = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('capture', {
+                    id: 'btn-1',
+                    contentProperties: { label: 'Buy now' },
+                    designProperties: { cfPadding: vbv({ desktop: m('40px') }) },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        const contentful = captureSink[0].contentful;
+        expect(contentful).toMatchObject({
+            componentTypeId: 'capture',
+            nodeId: 'btn-1',
+            content: { label: 'Buy now' },
+            design: { cfPadding: vbv({ desktop: m('40px') }) },
+            resolved: undefined,
+        });
+    });
+    it('contentful.resolved carries the resolveData return value', async () => {
+        const cfg = {
+            components: {
+                capture: {
+                    resolveData: () => ({ enriched: 'yes' }),
+                    component: CapturingComponent,
+                },
+            },
+        };
+        const plan = await resolveExperience({ viewports: VIEWPORTS, nodes: [componentNode('capture', { id: 'i' })] }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(captureSink[0].contentful?.resolved).toEqual({ enriched: 'yes' });
+    });
+});
+describe('ServerExperienceRenderer — resolveToken', () => {
+    it('passes DesignToken envelopes through the resolver before render', async () => {
+        const cfg = {
+            components: { 'contentful-button': ButtonFixture },
+            resolveToken: (ref) => (ref.value === 'color/surface/hero' ? '#4f39f6' : undefined),
+        };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('contentful-button', {
+                    id: 'b',
+                    contentProperties: { label: 'Go' },
+                    designProperties: { cfBackgroundColor: dt('color/surface/hero') },
+                }),
+            ],
+        }, cfg);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(container.innerHTML).toContain('data-bg="#4f39f6"');
+        expect(container.innerHTML).not.toContain('DesignToken');
+    });
+    it('warns and drops the key from the design bag when the resolver returns undefined', async () => {
+        const warn = vi.spyOn(console, 'warn').mockImplementation(() => { });
+        const cfg = {
+            components: { 'contentful-button': CapturingComponent },
+            resolveToken: () => undefined,
+        };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('contentful-button', {
+                    id: 'b',
+                    contentProperties: { label: 'Go' },
+                    designProperties: { cfBackgroundColor: dt('color/unknown') },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        expect(captureSink[0].designValues).not.toHaveProperty('cfBackgroundColor');
+        expect(warn).toHaveBeenCalledWith(expect.stringContaining('color/unknown'));
+        expect(warn).toHaveBeenCalledWith(expect.stringContaining('contentful-button'));
+        warn.mockRestore();
+    });
+    it('leaves envelopes untouched when no resolver is supplied (backward-compatible)', async () => {
+        const cfg = { components: { 'contentful-button': ButtonFixture } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('contentful-button', {
+                    id: 'b',
+                    contentProperties: { label: 'Go' },
+                    designProperties: { cfBackgroundColor: dt('color/surface/hero') },
+                }),
+            ],
+        }, cfg);
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        // Svelte stringifies the envelope object into "[object Object]" on the
+        // attribute — the point is that the raw envelope reaches the component
+        // unchanged, so the customer can inspect it or resolve it themselves.
+        expect(container.innerHTML).toContain('data-bg="[object Object]"');
+    });
+    it('runs on page-level template design props too', async () => {
+        const tplConfig = {
+            components: { item: PrecedenceFixture },
+            templates: { page: TemplateFixture },
+            resolveToken: (ref) => (ref.value === 'brand/canvas' ? '#111827' : undefined),
+        };
+        const tplPayload = {
+            sys: {
+                template: {
+                    sys: {
+                        type: 'ResourceLink',
+                        linkType: 'Contentful:Template',
+                        urn: 'crn:contentful:::experience:spaces/$self/environments/$self/templates/page',
+                    },
+                },
+            },
+            viewports: VIEWPORTS,
+            nodes: [componentNode('item', { id: 'i', contentProperties: { value: 'ok' } })],
+        };
+        const plan = await resolveExperience(tplPayload, tplConfig);
+        // Templates don't carry design props in the current XDA payload shape;
+        // seed one on the resolved plan so we exercise the template path.
+        plan.template.props.design = { cfBackground: dt('brand/canvas') };
+        const { container } = render(ServerExperienceRenderer, {
+            props: { experience: plan, config: tplConfig },
+        });
+        expect(container.innerHTML).toContain('data-bg="#111827"');
+    });
+});
+describe('ServerExperienceRenderer — design values are not injected as props', () => {
+    it('does NOT spread resolved design values onto component props', async () => {
+        const cfg = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('capture', {
+                    id: 'p',
+                    contentProperties: { label: 'keep me' },
+                    designProperties: { cfBackgroundColor: m('#f00'), cfPadding: m('10px') },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg },
+        });
+        const keys = Object.keys(captureSink[0].props);
+        // Content still flows as a prop; design does not.
+        expect(keys).toContain('label');
+        expect(keys).not.toContain('cfBackgroundColor');
+        expect(keys).not.toContain('cfPadding');
+        // The values are still readable through getDesignValues().
+        expect(captureSink[0].designValues).toEqual({
+            cfBackgroundColor: '#f00',
+            cfPadding: '10px',
+        });
+    });
+});
+describe('ServerExperienceRenderer — getDesignValues()', () => {
+    it('returns the resolved design bag for the current node', async () => {
+        const cfg = {
+            components: { capture: CapturingComponent },
+            resolveToken: (ref) => (ref.value === 'brand/primary' ? '#4f39f6' : undefined),
+        };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('capture', {
+                    id: 'p',
+                    designProperties: {
+                        cfBackgroundColor: dt('brand/primary'),
+                        cfPadding: m('24px'),
+                    },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, { props: { experience: plan, config: cfg } });
+        expect(captureSink[0].designValues).toEqual({
+            cfBackgroundColor: '#4f39f6',
+            cfPadding: '24px',
+        });
+    });
+    it('honors the active viewport when reading design values', async () => {
+        const cfg = { components: { capture: CapturingComponent } };
+        const plan = await resolveExperience({
+            viewports: VIEWPORTS,
+            nodes: [
+                componentNode('capture', {
+                    id: 'p',
+                    designProperties: {
+                        cfPadding: vbv({ desktop: m('40px'), mobile: m('12px') }),
+                    },
+                }),
+            ],
+        }, cfg);
+        render(ServerExperienceRenderer, {
+            props: { experience: plan, config: cfg, initialViewportId: 'mobile' },
+        });
+        expect(captureSink[0].designValues).toEqual({ cfPadding: '12px' });
+    });
+});
+describe('toCss (Svelte)', () => {
+    it('converts bare (non-cf) CSS keys — the shape real payloads use', () => {
+        expect(toCss({ fontSize: '20px', backgroundColor: '#4f39f6' })).toEqual({
+            fontSize: '20px',
+            backgroundColor: '#4f39f6',
+        });
+    });
+    it('still handles cf-prefixed and kebab/snake CSS keys', () => {
+        expect(toCss({ cfBackgroundColor: '#4f39f6', 'font-size': '10px', font_weight: 700 })).toEqual({
+            backgroundColor: '#4f39f6',
+            fontSize: '10px',
+            fontWeight: 700,
+        });
+    });
+    it('drops keys that are not known CSS properties (variant, as, ratio, target)', () => {
+        expect(toCss({ backgroundColor: '#4f39f6', variant: 'h1', as: 'h2', ratio: '1:2', target: '_self' })).toEqual({ backgroundColor: '#4f39f6' });
+    });
+    it('drops non-scalar (object/array/bool) values by design', () => {
+        // toCss produces something spreadable into an inline style — booleans
+        // and objects can't be inline-styled without opinionation, so they drop.
+        expect(toCss({
+            padding: '10px',
+            reverse: true,
+            nested: { color: 'red' },
+        })).toEqual({ padding: '10px' });
+    });
+    it('respects include/exclude lists', () => {
+        expect(toCss({ backgroundColor: '#4f39f6', padding: '10px' }, { include: ['backgroundColor'] })).toEqual({ backgroundColor: '#4f39f6' });
+        expect(toCss({ backgroundColor: '#4f39f6', padding: '10px' }, { exclude: ['padding'] })).toEqual({ backgroundColor: '#4f39f6' });
+    });
+});

package/dist/test-fixtures/ButtonFixture.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+  import { getDesignValues } from '../get-design-values.js';
+
+  let { label }: { label?: string } = $props();
+  const design = $derived(getDesignValues());
+</script>
+
+<button type="button" data-bg={design.cfBackgroundColor as string}>{label}</button>

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

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    label?: string;
+};
+declare const ButtonFixture: import("svelte").Component<$$ComponentProps, {}, "">;
+type ButtonFixture = ReturnType<typeof ButtonFixture>;
+export default ButtonFixture;
+//# sourceMappingURL=ButtonFixture.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/ButtonFixture.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAY7C,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/test-fixtures/CapturingComponent.svelte

@@ -0,0 +1,18 @@
+<!--
+  Test fixture: pushes its full props plus the current experience /
+  contentful context into a module-level `captureSink` that tests pull from.
+-->
+<script lang="ts">
+  import { getExperience, getContentfulComponent } from '../context.js';
+  import { getDesignValues } from '../get-design-values.js';
+  import { captureSink } from './capture-sink.js';
+
+  // Capture every prop the renderer passes in.
+  const rest = $props();
+  captureSink.push({
+    props: { ...rest },
+    experience: getExperience(),
+    contentful: getContentfulComponent(),
+    designValues: getDesignValues<Record<string, unknown>>(),
+  });
+</script>

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

@@ -0,0 +1,4 @@
+declare const CapturingComponent: import("svelte").Component<$$ComponentProps, {}, "">;
+type CapturingComponent = ReturnType<typeof CapturingComponent>;
+export default CapturingComponent;
+//# sourceMappingURL=CapturingComponent.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CapturingComponent.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/CapturingComponent.svelte.ts"],"names":[],"mappings":"AAyBA,QAAA,MAAM,kBAAkB,sDAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/test-fixtures/ContainerFixture.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+
+  import { getDesignValues } from '../get-design-values.js';
+
+  let { children }: { children?: Snippet } = $props();
+  const design = $derived(getDesignValues());
+</script>
+
+<div data-padding={design.cfPadding as string}>
+  {#if children}{@render children()}{/if}
+</div>

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

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    children?: Snippet;
+};
+declare const ContainerFixture: import("svelte").Component<$$ComponentProps, {}, "">;
+type ContainerFixture = ReturnType<typeof ContainerFixture>;
+export default ContainerFixture;
+//# sourceMappingURL=ContainerFixture.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ContainerFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/ContainerFixture.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAIrC,KAAK,gBAAgB,GAAI;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAgBjD,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/test-fixtures/HeadingFixture.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+  import { getDesignValues } from '../get-design-values.js';
+
+  let { text }: { text?: string } = $props();
+  const design = $derived(getDesignValues());
+</script>
+
+<h1 data-font-size={design.cfFontSize as string}>{text}</h1>

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

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    text?: string;
+};
+declare const HeadingFixture: import("svelte").Component<$$ComponentProps, {}, "">;
+type HeadingFixture = ReturnType<typeof HeadingFixture>;
+export default HeadingFixture;
+//# sourceMappingURL=HeadingFixture.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HeadingFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/test-fixtures/HeadingFixture.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAY5C,QAAA,MAAM,cAAc,sDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}