@se-studio/core-ui 0.0.0-next16-20260822103555

package/dist/showcase/mockFactory.js

@@ -0,0 +1,726 @@
+import { BLOCKS, MARKS, } from '@contentful/rich-text-types';
+import { DEFAULT_ALLOWED_UNUSED } from '../utils/UnusedChecker';
+/** Tiny valid JPEG data URL for CMS showcase `PictureComponent` blur placeholder demos */
+const SHOWCASE_PICTURE_BLUR_DATA_URL = 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYAAAAAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAABAAEDAREAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAb/xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIQAxAAAAHT/8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQABBQJf/8QAFBEBAAAAAAAAAAAAAAAAAAAAAP/aAAgBAwEBPwF//8QAFBEBAAAAAAAAAAAAAAAAAAAAAP/aAAgBAgEBPwF//8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQAGPwJ//8QAFBABAAAAAAAAAAAAAAAAAAAAAP/aAAgBAQABPyF//9k=';
+/**
+ * Parses inline marks (bold) from a text string.
+ * Returns an array of text nodes with appropriate marks.
+ */
+function parseInlineMarks(text) {
+    const parts = text.split(/(\*\*.*?\*\*)/g);
+    return parts
+        .filter((part) => part.length > 0)
+        .map((part) => {
+        if (part.startsWith('**') && part.endsWith('**')) {
+            return {
+                nodeType: 'text',
+                value: part.slice(2, -2),
+                marks: [{ type: MARKS.BOLD }],
+                data: {},
+            };
+        }
+        return {
+            nodeType: 'text',
+            value: part,
+            marks: [],
+            data: {},
+        };
+    });
+}
+/**
+ * Creates a valid Contentful Rich Text document from a string, supporting basic markdown:
+ * - Paragraphs (split by double newline)
+ * - Bold text (**text**)
+ * - Headings (# H1, ## H2, etc.)
+ * - Bullet lists (- item or * item)
+ */
+export function createRichTextFromMarkdown(text) {
+    if (!text) {
+        return null;
+    }
+    const paragraphs = text.split(/\n\n+/);
+    const content = paragraphs.map((paragraphText) => {
+        // Check for bullet lists (lines starting with - or *)
+        const lines = paragraphText.split('\n');
+        const isUnorderedList = lines.every((line) => /^[-*]\s+/.test(line) || line.trim() === '');
+        if (isUnorderedList && lines.some((line) => /^[-*]\s+/.test(line))) {
+            const listItems = lines
+                .filter((line) => /^[-*]\s+/.test(line))
+                .map((line) => {
+                const itemText = line.replace(/^[-*]\s+/, '');
+                return {
+                    nodeType: BLOCKS.LIST_ITEM,
+                    data: {},
+                    content: [
+                        {
+                            nodeType: BLOCKS.PARAGRAPH,
+                            data: {},
+                            content: parseInlineMarks(itemText),
+                        },
+                    ],
+                };
+            });
+            return {
+                nodeType: BLOCKS.UL_LIST,
+                data: {},
+                content: listItems,
+            };
+        }
+        // Check for headings
+        let nodeType = BLOCKS.PARAGRAPH;
+        let cleanText = paragraphText;
+        const headingMatch = paragraphText.match(/^(#{1,6})\s+(.+)/);
+        if (headingMatch?.[1] && headingMatch[2]) {
+            const level = headingMatch[1].length;
+            cleanText = headingMatch[2];
+            switch (level) {
+                case 1:
+                    nodeType = BLOCKS.HEADING_1;
+                    break;
+                case 2:
+                    nodeType = BLOCKS.HEADING_2;
+                    break;
+                case 3:
+                    nodeType = BLOCKS.HEADING_3;
+                    break;
+                case 4:
+                    nodeType = BLOCKS.HEADING_4;
+                    break;
+                case 5:
+                    nodeType = BLOCKS.HEADING_5;
+                    break;
+                case 6:
+                    nodeType = BLOCKS.HEADING_6;
+                    break;
+            }
+        }
+        return {
+            nodeType,
+            data: {},
+            content: parseInlineMarks(cleanText),
+        };
+    });
+    const document = {
+        nodeType: BLOCKS.DOCUMENT,
+        data: {},
+        content: content,
+    };
+    return {
+        json: document,
+    };
+}
+/** True when a mock URL is a video page (must not become next/image Picture src). */
+export function isExternalVideoPageUrl(url) {
+    if (!url)
+        return false;
+    try {
+        const host = new URL(url).hostname.replace(/^www\./, '');
+        return (host === 'vimeo.com' ||
+            host === 'player.vimeo.com' ||
+            host === 'youtu.be' ||
+            host === 'youtube.com' ||
+            host === 'youtube-nocookie.com' ||
+            host.endsWith('.youtube.com') ||
+            host.endsWith('.youtube-nocookie.com'));
+    }
+    catch {
+        return false;
+    }
+}
+function buildExternalVideoEmbedHtml(url) {
+    const width = 1280;
+    const height = 720;
+    try {
+        const u = new URL(url);
+        const host = u.hostname.replace(/^www\./, '');
+        if (host === 'vimeo.com' || host === 'player.vimeo.com') {
+            const id = u.pathname.split('/').filter(Boolean).pop() ?? '';
+            const src = `https://player.vimeo.com/video/${id}`;
+            return {
+                width,
+                height,
+                html: `<iframe src="${src}" width="${width}" height="${height}" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="Showcase video"></iframe>`,
+            };
+        }
+        if (host === 'youtu.be') {
+            const id = u.pathname.replace(/^\//, '');
+            const src = `https://www.youtube.com/embed/${id}`;
+            return {
+                width,
+                height,
+                html: `<iframe src="${src}" width="${width}" height="${height}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen title="Showcase video"></iframe>`,
+            };
+        }
+        if (host === 'youtube.com' ||
+            host.endsWith('.youtube.com') ||
+            host.endsWith('.youtube-nocookie.com')) {
+            const id = u.searchParams.get('v') ?? u.pathname.split('/').filter(Boolean).pop() ?? '';
+            const src = `https://www.youtube.com/embed/${id}`;
+            return {
+                width,
+                height,
+                html: `<iframe src="${src}" width="${width}" height="${height}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen title="Showcase video"></iframe>`,
+            };
+        }
+    }
+    catch {
+        // fall through
+    }
+    return {
+        width,
+        height,
+        html: `<iframe src="${url}" width="${width}" height="${height}" frameborder="0" allowfullscreen title="Showcase video"></iframe>`,
+    };
+}
+/**
+ * Creates a valid Visual object.
+ * - When `lottieUrl` is provided the visual wraps an IAnimation.
+ * - When `url` is a Vimeo/YouTube page, wraps an External video (not Picture).
+ * - When `url` is provided it is used as the image src.
+ * - Otherwise a placehold.co placeholder is generated from the dimensions.
+ */
+export function createVisual(id, width, height, url, lottieUrl, widthPercent) {
+    if (lottieUrl) {
+        const format = lottieUrl.toLowerCase().endsWith('.lottie') ? 'dotlottie' : 'lottie-json';
+        const animation = {
+            type: 'Animation',
+            id: `animation-${id}`,
+            name: 'Sample Animation',
+            format,
+            animationSrc: lottieUrl,
+            loop: true,
+            autoPlay: true,
+            ...(widthPercent != null && { widthPercent }),
+            ...(width > 0 && height > 0
+                ? {
+                    optimised: {
+                        width,
+                        height,
+                        data: `<svg width="${width}" height="${height}" viewBox="0 0 ${width} ${height}" xmlns="http://www.w3.org/2000/svg"></svg>`,
+                    },
+                }
+                : {}),
+        };
+        return { type: 'Visual', id: `visual-${id}`, animation };
+    }
+    if (url && isExternalVideoPageUrl(url)) {
+        const embed = buildExternalVideoEmbedHtml(url);
+        return {
+            type: 'Visual',
+            id: `visual-${id}`,
+            video: {
+                type: 'External video',
+                id: `video-${id}`,
+                name: 'Sample external video',
+                external: url,
+                width: embed.width,
+                height: embed.height,
+                embed: {
+                    html: embed.html,
+                    width: embed.width,
+                    height: embed.height,
+                },
+                ...(widthPercent != null && { widthPercent }),
+            },
+        };
+    }
+    return {
+        type: 'Visual',
+        id: `visual-${id}`,
+        image: {
+            type: 'Picture',
+            id: `img-${id}`,
+            name: 'Sample Image',
+            mimeType: 'image/jpeg',
+            width,
+            height,
+            size: 1024,
+            src: url ?? `https://placehold.co/${width}x${height}`,
+            description: 'Sample placeholder image',
+            blurDataURL: SHOWCASE_PICTURE_BLUR_DATA_URL,
+            ...(widthPercent != null && { widthPercent }),
+        },
+    };
+}
+/**
+ * Creates a Responsive Visual object.
+ * Passes through real image URL or Lottie URL from curated mock when available.
+ */
+export function createResponsiveVisual(showVisual, showMobile, width = 800, height = 600, url, lottieUrl, widthPercent) {
+    if (!showVisual) {
+        return undefined;
+    }
+    // Lottie animations don't have meaningful pixel dimensions — use as-is for both viewports.
+    if (lottieUrl) {
+        return {
+            visual: createVisual('desktop', 0, 0, undefined, lottieUrl, widthPercent),
+            mobileVisual: showMobile
+                ? createVisual('mobile', 0, 0, undefined, lottieUrl, widthPercent)
+                : undefined,
+            hideVisual: false,
+            hideMobileVisual: !showMobile,
+        };
+    }
+    // External video pages: single video visual (no mobile duplicate needed for showcase).
+    if (url && isExternalVideoPageUrl(url)) {
+        return {
+            visual: createVisual('desktop', width, height, url, undefined, widthPercent),
+            hideVisual: false,
+            hideMobileVisual: true,
+        };
+    }
+    // Calculate mobile dimensions maintaining roughly the same aspect ratio, but max width 400
+    const aspectRatio = height > 0 ? width / height : 4 / 3;
+    const mobileWidth = 400;
+    const mobileHeight = Math.round(mobileWidth / aspectRatio);
+    return {
+        visual: createVisual('desktop', width, height, url, undefined, widthPercent),
+        mobileVisual: showMobile
+            ? createVisual('mobile', mobileWidth, mobileHeight, url, undefined, widthPercent)
+            : undefined,
+        hideVisual: false,
+        hideMobileVisual: !showMobile,
+    };
+}
+/**
+ * Creates sample links
+ */
+export function createLinks(count) {
+    return Array.from({ length: count }).map((_, i) => ({
+        type: 'Internal link',
+        internalType: 'Page',
+        internalId: `link-${i}`,
+        id: `link-${i}`,
+        name: `Sample Link ${i + 1}`,
+        title: `Action ${i + 1}`,
+        text: `Action ${i + 1}`,
+        slug: 'sample-page',
+        href: '#',
+        variant: i === 0 ? 'Primary' : 'Secondary',
+        lastModified: new Date(),
+    }));
+}
+/**
+ * Returns true if a mock value is a pre-built Contentful Rich Text document
+ * that can be passed directly to the renderer without conversion.
+ */
+function isMockRichText(value) {
+    return (value !== null &&
+        typeof value === 'object' &&
+        'json' in value &&
+        typeof value.json === 'object');
+}
+/**
+ * Returns true if the value is a non-empty array of MockLink objects (from curated mock data).
+ */
+function isMockLinkArray(value) {
+    return (Array.isArray(value) &&
+        value.length > 0 &&
+        typeof value[0]?.type === 'string' &&
+        typeof value[0]?.href === 'string');
+}
+function isMockVisualDims(value) {
+    return (value !== null &&
+        typeof value === 'object' &&
+        typeof value.width === 'number' &&
+        typeof value.height === 'number');
+}
+function isMockOtherMediaArray(value) {
+    return Array.isArray(value) && (value.length === 0 || isMockVisualDims(value[0]));
+}
+/** Converts curated otherMedia (array of visual dimensions) to IVisual[] for component renderers. */
+function mockOtherMediaToVisuals(mockOtherMedia) {
+    return mockOtherMedia.map((dims, i) => createVisual(`other-media-${i}`, dims.width, dims.height, dims.url, dims.lottieUrl, dims.widthPercent));
+}
+/**
+ * Converts curated MockLink[] (JSON-safe, from showcase-mocks.json) to proper link objects
+ * that the component renderers expect. Internal links get a synthetic lastModified Date.
+ */
+function mockLinksToLinkProps(mockLinks) {
+    return mockLinks.map((ml) => {
+        const base = {
+            id: ml.id,
+            name: ml.name,
+            text: ml.text,
+            variant: ml.variant,
+            backgroundColour: ml.backgroundColour ?? null,
+            textColour: ml.textColour ?? null,
+        };
+        if (ml.type === 'Internal link') {
+            const link = {
+                ...base,
+                type: 'Internal link',
+                internalId: ml.internalId ?? ml.id,
+                href: ml.href,
+                internalType: (ml.internalType ?? 'Page'),
+                slug: ml.slug ?? '',
+                title: ml.name,
+                lastModified: new Date(),
+            };
+            return link;
+        }
+        if (ml.type === 'External link') {
+            const link = {
+                ...base,
+                type: 'External link',
+                href: ml.href,
+            };
+            return link;
+        }
+        const link = {
+            ...base,
+            type: 'Blank link',
+            href: null,
+        };
+        return link;
+    });
+}
+function toRichText(s) {
+    return s ? createRichTextFromMarkdown(s) : null;
+}
+export function parseShowcaseControls(searchParams, defaultState) {
+    const params = new URLSearchParams();
+    Object.entries(searchParams).forEach(([key, value]) => {
+        if (typeof value === 'string') {
+            params.set(key, value);
+        }
+        else if (Array.isArray(value) && value.length > 0 && value[0] !== undefined) {
+            params.set(key, value[0]);
+        }
+    });
+    const getBool = (key) => {
+        const val = params.get(key);
+        return (val === null ? defaultState[key] : val === 'true');
+    };
+    const getStr = (key) => {
+        return (params.get(key) || defaultState[key]);
+    };
+    const getNum = (key) => {
+        const val = params.get(key);
+        return (val ? Number(val) : defaultState[key]);
+    };
+    return {
+        heading: getStr('heading'),
+        showHeading: getBool('showHeading'),
+        preHeading: getStr('preHeading'),
+        postHeading: getStr('postHeading'),
+        body: getStr('body'),
+        additionalCopy: getStr('additionalCopy'),
+        showVisual: getBool('showVisual'),
+        showMobileVisual: getBool('showMobileVisual'),
+        backgroundColour: getStr('backgroundColour'),
+        textColour: getStr('textColour'),
+        textSize: getStr('textSize'),
+        showLinks: getBool('showLinks'),
+        numberOfLinks: getNum('numberOfLinks'),
+        cmsLabel: getStr('cmsLabel'),
+    };
+}
+/**
+ * Merges mock data for the given type into the default showcase control state.
+ * Used by ShowcasePage and ShowcaseRenderPage to get the baseline for controls and URL diffing.
+ */
+export function getMergedShowcaseDefaultState(defaultState, type, mode, componentMockMap, collectionMockMap) {
+    const merged = { ...defaultState };
+    if (!type)
+        return merged;
+    const currentMockData = mode === 'component' ? componentMockMap[type] : collectionMockMap[type];
+    if (!currentMockData)
+        return merged;
+    merged.heading = typeof currentMockData.heading === 'string' ? currentMockData.heading : '';
+    merged.preHeading =
+        typeof currentMockData.preHeading === 'string' ? currentMockData.preHeading : '';
+    merged.postHeading =
+        typeof currentMockData.postHeading === 'string' ? currentMockData.postHeading : '';
+    merged.body = typeof currentMockData.body === 'string' ? currentMockData.body : '';
+    merged.additionalCopy =
+        typeof currentMockData.additionalCopy === 'string' ? currentMockData.additionalCopy : '';
+    if (typeof currentMockData.backgroundColour === 'string')
+        merged.backgroundColour = currentMockData.backgroundColour;
+    if (typeof currentMockData.textColour === 'string')
+        merged.textColour = currentMockData.textColour;
+    return merged;
+}
+/**
+ * Creates a mock card item for a collection
+ */
+export function createMockCardContent(collectionType, index, controls, collectionCardFieldsMap, cardMockData) {
+    const cardId = `mock-card-${index}`;
+    const cardName = `Mock Card ${index + 1}`;
+    // Special handling for collections whose contents are IVisual[] (visuals only)
+    if (collectionType === 'Carousel: Media' ||
+        collectionType.includes('Media') ||
+        collectionType === 'Separated visuals' ||
+        collectionType === 'Visuals') {
+        const v = cardMockData?.visual;
+        return createVisual(`visual-${index}`, v?.width ?? 800, v?.height ?? 600, v?.url, v?.lottieUrl, v?.widthPercent);
+    }
+    // Extract visual dimensions from mock data if present
+    const visualDims = cardMockData?.visual;
+    const mockFields = cardMockData || {};
+    // When curated mock data is present, return null for absent fields so the component
+    // doesn't render placeholder text that doesn't exist in the real CMS entry.
+    const getString = (key, defaultVal) => {
+        const val = mockFields[key];
+        if (typeof val === 'string')
+            return val;
+        return cardMockData ? null : defaultVal;
+    };
+    // Helper to get rich text from mock data: passes MockRichText documents through directly,
+    // or converts a markdown string, or falls back to the default string / null.
+    const getRichText = (key, defaultVal) => {
+        const val = mockFields[key];
+        if (isMockRichText(val)) {
+            return val;
+        }
+        const str = typeof val === 'string' ? val : null;
+        if (str)
+            return createRichTextFromMarkdown(str);
+        return cardMockData ? null : createRichTextFromMarkdown(defaultVal);
+    };
+    // When curated mock data is present, treat it as the sole source of truth.
+    // Don't inject showcase control defaults (colors, visuals, links) on top of it.
+    const isCurated = !!cardMockData;
+    const rawCard = {
+        id: cardId,
+        type: 'Component',
+        componentType: 'Generic',
+        name: cardName,
+        cmsLabel: cardName,
+        index,
+        isFirst: index === 0,
+        isLast: index === 3,
+        indexOfType: index,
+        preHeading: getString('preHeading', `Pre-heading ${index + 1}`),
+        heading: getString('heading', `Card Heading ${index + 1}`),
+        postHeading: getString('postHeading', `Post-heading ${index + 1}`),
+        body: getRichText('body', `This is the body content for mock card ${index + 1}.`),
+        additionalCopy: getRichText('additionalCopy', `Additional copy for card ${index + 1}.`),
+        // Spread other mock fields
+        ...Object.fromEntries(Object.entries(mockFields)
+            .filter(([key]) => ![
+            'visual',
+            'links',
+            'preHeading',
+            'heading',
+            'postHeading',
+            'body',
+            'additionalCopy',
+        ].includes(key))
+            .map(([key, val]) => {
+            // If it's a string, pass it as is (could be string field OR markdown for unknown rich text field)
+            // We can't automatically know if custom fields are rich text or not without schema.
+            return [key, val];
+        })),
+        // Prefer curated visual dims; otherwise placeholder when showVisual (default).
+        visual: (() => {
+            if (visualDims) {
+                return createResponsiveVisual(true, true, visualDims.width, visualDims.height, visualDims.url, visualDims.lottieUrl, visualDims.widthPercent);
+            }
+            if (!controls.showVisual && isCurated) {
+                return undefined;
+            }
+            return createResponsiveVisual(isCurated ? true : controls.showVisual, controls.showMobileVisual);
+        })(),
+        // Placeholder icon when no real visual dims (filtered out if unused).
+        icon: visualDims ? undefined : createVisual(`icon-${index}`, 64, 64),
+        // Curated: use the mock's colors (null = component picks its own default).
+        // Generic: use the showcase control colors.
+        backgroundColour: isCurated
+            ? (mockFields['backgroundColour'] ?? null)
+            : controls.backgroundColour,
+        textColour: isCurated
+            ? (mockFields['textColour'] ?? null)
+            : controls.textColour,
+        textSize: controls.textSize,
+        // Curated: use mock links, or empty (the mock is authoritative — no phantom buttons).
+        // Generic: generate placeholder links.
+        links: isMockLinkArray(mockFields['links'])
+            ? mockLinksToLinkProps(mockFields['links'])
+            : isCurated
+                ? []
+                : createLinks(1),
+    };
+    const usedFields = collectionCardFieldsMap[collectionType];
+    if (!usedFields) {
+        return rawCard;
+    }
+    // Filter fields to only include those that are used or allowed
+    const filteredCard = Object.fromEntries(Object.entries(rawCard).filter(([key]) => {
+        if (['id', 'type', 'componentType', 'name', 'cmsLabel', 'index'].includes(key)) {
+            return true;
+        }
+        if (usedFields.has(key)) {
+            return true;
+        }
+        if (DEFAULT_ALLOWED_UNUSED.has(key)) {
+            return true;
+        }
+        return false;
+    }));
+    return filteredCard;
+}
+/**
+ * Generates a mock component or collection based on the control state.
+ * URL params (providedControlKeys) always override mock data for those keys.
+ */
+export function createMockShowcaseData(type, mode, controls, componentFieldsMap, collectionFieldsMap, collectionCardFieldsMap, componentMockMap = {}, collectionMockMap = {}, collectionCardMockMap = {}, providedControlKeys = new Set()) {
+    // Determine used fields first so we can conditionally create contents
+    const usedFields = mode === 'component' ? componentFieldsMap[type] : collectionFieldsMap[type];
+    const mockData = mode === 'component' ? componentMockMap[type] : collectionMockMap[type];
+    const mockFields = mockData || {};
+    const visualDims = mockData?.visual;
+    // When curated mock data is present, treat it as the sole source of truth unless URL provided a key.
+    const isCurated = !!mockData;
+    const commonFields = {
+        id: 'mock-id',
+        name: controls.cmsLabel,
+        cmsLabel: controls.cmsLabel,
+        index: 0,
+        isFirst: true,
+        isLast: true,
+        indexOfType: 0,
+        // URL-provided keys override; otherwise curated mock or control default.
+        preHeading: providedControlKeys.has('preHeading')
+            ? controls.preHeading || null
+            : isCurated
+                ? mockFields['preHeading'] != null
+                    ? String(mockFields['preHeading'])
+                    : null
+                : controls.preHeading || null,
+        heading: providedControlKeys.has('heading')
+            ? controls.showHeading
+                ? controls.heading
+                : null
+            : isCurated
+                ? mockFields['heading'] != null
+                    ? String(mockFields['heading'])
+                    : null
+                : controls.showHeading
+                    ? controls.heading
+                    : null,
+        postHeading: providedControlKeys.has('postHeading')
+            ? controls.postHeading || null
+            : isCurated
+                ? mockFields['postHeading'] != null
+                    ? String(mockFields['postHeading'])
+                    : null
+                : controls.postHeading || null,
+        body: providedControlKeys.has('body')
+            ? toRichText(controls.body)
+            : isMockRichText(mockFields['body'])
+                ? mockFields['body']
+                : typeof mockFields['body'] === 'string'
+                    ? toRichText(mockFields['body'])
+                    : isCurated
+                        ? null
+                        : toRichText(controls.body),
+        additionalCopy: providedControlKeys.has('additionalCopy')
+            ? toRichText(controls.additionalCopy)
+            : isMockRichText(mockFields['additionalCopy'])
+                ? mockFields['additionalCopy']
+                : typeof mockFields['additionalCopy'] === 'string'
+                    ? toRichText(mockFields['additionalCopy'])
+                    : isCurated
+                        ? null
+                        : toRichText(controls.additionalCopy),
+        // Spread other mock fields that are NOT standard controls
+        // (Standard controls like heading/body are passed via `controls` object,
+        // so we don't need to spread them again, but we do need custom fields)
+        ...Object.fromEntries(Object.entries(mockFields)
+            .filter(([key]) => ![
+            'visual',
+            'otherMedia',
+            'links',
+            'preHeading',
+            'heading',
+            'postHeading',
+            'body',
+            'additionalCopy',
+        ].includes(key))
+            .map(([key, val]) => [key, val])),
+        // Curated otherMedia: convert array of visual dimensions to IVisual[] (includes widthPercent).
+        otherMedia: isMockOtherMediaArray(mockFields['otherMedia'])
+            ? mockOtherMediaToVisuals(mockFields['otherMedia'])
+            : undefined,
+        // Prefer curated visual dimensions/URL when present. Otherwise generate a
+        // placehold.co placeholder when showVisual is true (default). usedFields
+        // filter drops `visual` when the type does not use it.
+        visual: (() => {
+            const show = providedControlKeys.has('showVisual')
+                ? controls.showVisual
+                : visualDims
+                    ? true
+                    : controls.showVisual;
+            if (!show) {
+                return undefined;
+            }
+            return createResponsiveVisual(true, controls.showMobileVisual || Boolean(visualDims?.url), visualDims?.width, visualDims?.height, visualDims?.url, visualDims?.lottieUrl, visualDims?.widthPercent);
+        })(),
+        backgroundColour: providedControlKeys.has('backgroundColour')
+            ? controls.backgroundColour
+            : isCurated
+                ? (mockFields['backgroundColour'] ?? null)
+                : controls.backgroundColour,
+        textColour: providedControlKeys.has('textColour')
+            ? controls.textColour
+            : isCurated
+                ? (mockFields['textColour'] ?? null)
+                : controls.textColour,
+        textSize: controls.textSize,
+        links: providedControlKeys.has('showLinks') || providedControlKeys.has('numberOfLinks')
+            ? controls.showLinks
+                ? createLinks(controls.numberOfLinks)
+                : []
+            : isMockLinkArray(mockFields['links'])
+                ? mockLinksToLinkProps(mockFields['links'])
+                : isCurated
+                    ? []
+                    : controls.showLinks
+                        ? createLinks(controls.numberOfLinks)
+                        : [],
+    };
+    // Only create contents if the collection explicitly uses them
+    const collectionUsesContents = usedFields?.has('contents') ?? true;
+    // Support both a single card mock (repeated for all slots) and an array of distinct card mocks.
+    // When curated cards are provided use exactly that count; otherwise default to 4.
+    const rawCardMock = collectionCardMockMap[type];
+    const curatedCardCount = Array.isArray(rawCardMock) ? rawCardMock.length : undefined;
+    const cardCount = curatedCardCount ?? 4;
+    const getCardMock = (i) => {
+        if (!rawCardMock)
+            return undefined;
+        if (Array.isArray(rawCardMock))
+            return rawCardMock[i % rawCardMock.length];
+        return rawCardMock;
+    };
+    const rawData = mode === 'component'
+        ? {
+            ...commonFields,
+            type: 'Component',
+            componentType: type,
+        }
+        : {
+            ...commonFields,
+            type: 'Collection',
+            collectionType: type,
+            ...(collectionUsesContents && {
+                contents: Array.from({ length: cardCount }).map((_, i) => createMockCardContent(type, i, controls, collectionCardFieldsMap, getCardMock(i))),
+            }),
+        };
+    // Filter fields to only include those that are used or allowed
+    const filteredData = Object.fromEntries(Object.entries(rawData).filter(([key]) => {
+        if (['type', 'componentType', 'collectionType'].includes(key)) {
+            return true;
+        }
+        if (usedFields?.has(key)) {
+            return true;
+        }
+        if (DEFAULT_ALLOWED_UNUSED.has(key)) {
+            return true;
+        }
+        return false;
+    }));
+    return filteredData;
+}
+//# sourceMappingURL=mockFactory.js.map