@parhelia/core 0.1.12882 → 0.1.12884

package/dist/editor/page-viewer/pageModelSkeletonBuilder.js

@@ -1,796 +0,0 @@
-import { extractItemIdFromItemUri, getNextNonChromeMarkerElement, getPreviousNonChromeMarkerElement, isChromeMarkerElement, isSitecoreCodeMarkerElement, } from "../utils";
-const excludedComponentTypes = new Set(["StickyNote"]);
-const zeroGuid = "00000000-0000-0000-0000-000000000000";
-function normalizeSitecoreId(id) {
-    if (!id)
-        return "";
-    return id.replace(/[{}]/g, "").toLowerCase();
-}
-function normalizeSitecoreGuid(id) {
-    const normalized = normalizeSitecoreId(id);
-    if (/^[0-9a-f]{32}$/i.test(normalized)) {
-        return `${normalized.substring(0, 8)}-${normalized.substring(8, 12)}-${normalized.substring(12, 16)}-${normalized.substring(16, 20)}-${normalized.substring(20, 32)}`;
-    }
-    return normalized;
-}
-function normalizeHeadlessPlaceholderKey(id) {
-    const key = id ?? "";
-    const separatorIndex = key.lastIndexOf("_");
-    if (separatorIndex <= 0) {
-        return key;
-    }
-    const suffix = normalizeSitecoreGuid(key.substring(separatorIndex + 1));
-    // Root Content SDK placeholders are emitted as "placeholder_0000...".
-    // Keep nested placeholders intact because the rendering uid suffix tells
-    // Parhelia which component owns the placeholder.
-    return suffix === zeroGuid ? key.substring(0, separatorIndex) : key;
-}
-const codeMarkerDataCache = new WeakMap();
-function readSitecoreCodeMarkerData(element) {
-    if (!isSitecoreCodeMarkerElement(element)) {
-        return undefined;
-    }
-    if (codeMarkerDataCache.has(element)) {
-        return codeMarkerDataCache.get(element) ?? undefined;
-    }
-    const raw = element.textContent;
-    if (!raw) {
-        codeMarkerDataCache.set(element, null);
-        return undefined;
-    }
-    try {
-        const parsed = JSON.parse(raw);
-        if (parsed && typeof parsed === "object" && !Array.isArray(parsed)) {
-            const data = parsed;
-            codeMarkerDataCache.set(element, data);
-            return data;
-        }
-    }
-    catch {
-        // Native Sitecore chrome can be malformed or stripped; marker attributes
-        // are still enough for basic start/end matching.
-    }
-    codeMarkerDataCache.set(element, null);
-    return undefined;
-}
-function readRecord(value) {
-    return value && typeof value === "object" && !Array.isArray(value)
-        ? value
-        : undefined;
-}
-function readString(value) {
-    return typeof value === "string" && value.trim() ? value.trim() : undefined;
-}
-function readNumber(value) {
-    if (typeof value === "number" && Number.isFinite(value))
-        return value;
-    if (typeof value === "string") {
-        const parsed = parseInt(value, 10);
-        return Number.isFinite(parsed) ? parsed : undefined;
-    }
-    return undefined;
-}
-function firstString(record, keys) {
-    if (!record)
-        return undefined;
-    for (const key of keys) {
-        const value = readString(record[key]);
-        if (value)
-            return value;
-    }
-    return undefined;
-}
-function firstRecord(record, keys) {
-    if (!record)
-        return undefined;
-    for (const key of keys) {
-        const value = readRecord(record[key]);
-        if (value)
-            return value;
-    }
-    return undefined;
-}
-function isExplicitFalse(value) {
-    return (value === false ||
-        (typeof value === "string" && value.toLowerCase() === "false"));
-}
-function readEditableValue(data) {
-    if (!data)
-        return undefined;
-    const custom = firstRecord(data, ["custom", "customData", "Custom"]);
-    const candidateValues = [
-        data.editable,
-        data.isEditable,
-        data.canEdit,
-        custom?.editable,
-        custom?.isEditable,
-        custom?.canEdit,
-    ];
-    return candidateValues.some(isExplicitFalse) ? "false" : undefined;
-}
-function readDomComponentName(element) {
-    if (!element)
-        return undefined;
-    return (readString(element.getAttribute("data-component")) ||
-        readString(element.getAttribute("data-component-name")));
-}
-function setAttributeIfMissing(element, name, value) {
-    if (value === undefined || value === null || value === "")
-        return;
-    if (!element.hasAttribute(name)) {
-        element.setAttribute(name, String(value));
-    }
-}
-function readMarkerItemData(data, keys) {
-    if (!data)
-        return undefined;
-    const item = firstRecord(data, keys);
-    const rawId = firstString(item, ["id", "itemId", "ID"]) ||
-        firstString(data, [
-            "contextItemId",
-            "contextItem",
-            "datasourceId",
-            "datasource",
-            "dataSourceId",
-            "dataSource",
-            "itemId",
-        ]);
-    const uri = firstString(item, ["uri", "itemUri", "url"]) ||
-        firstString(data, ["contextItemUri", "datasourceUri", "dataSourceUri"]);
-    const idFromUri = uri ? extractItemIdFromItemUri(uri) : undefined;
-    const id = normalizeSitecoreGuid(rawId || idFromUri);
-    const language = firstString(item, ["language", "lang", "languageCode"]) ||
-        readQueryValue(uri, ["lang", "language", "sc_lang"]);
-    const version = readNumber(item?.version) ||
-        readNumber(item?.ver) ||
-        readNumber(readQueryValue(uri, ["ver", "version", "sc_version"]));
-    if (!id && !language && version === undefined) {
-        return undefined;
-    }
-    return { id, language, version };
-}
-function readQueryValue(uri, keys) {
-    if (!uri)
-        return undefined;
-    const queryStart = uri.indexOf("?");
-    if (queryStart < 0)
-        return undefined;
-    const params = new URLSearchParams(uri.substring(queryStart + 1));
-    for (const key of keys) {
-        const value = params.get(key);
-        if (value)
-            return value;
-    }
-    return undefined;
-}
-function readSitecoreFieldMarkerData(element, markerData) {
-    if (!isSitecoreCodeMarkerElement(element) ||
-        element.getAttribute("chrometype") !== "field" ||
-        element.getAttribute("kind") !== "open") {
-        return undefined;
-    }
-    const data = markerData ?? readSitecoreCodeMarkerData(element);
-    if (!data) {
-        return undefined;
-    }
-    const datasource = readMarkerItemData(data, [
-        "datasource",
-        "dataSource",
-        "contextItem",
-    ]);
-    const field = firstRecord(data, ["field", "fieldData"]);
-    const fieldId = normalizeSitecoreGuid(firstString(data, ["fieldId", "fieldID", "field"]) ||
-        firstString(field, ["id", "itemId", "fieldId", "fieldID"]));
-    return {
-        datasource,
-        fieldId: fieldId || undefined,
-    };
-}
-function normalizeSitecoreCodeMarkerAttributes(element, markerData) {
-    if (!isSitecoreCodeMarkerElement(element))
-        return;
-    element.setAttribute("hidden", "");
-    element.setAttribute("aria-hidden", "true");
-    if (element instanceof HTMLElement) {
-        element.style.display = "none";
-    }
-    const chromeType = element.getAttribute("chrometype");
-    const kind = element.getAttribute("kind");
-    const markerId = normalizeSitecoreGuid(element.getAttribute("id") ||
-        firstString(markerData, ["id", "uid", "uniqueId", "uniqueID"]));
-    if (chromeType === "rendering") {
-        normalizeRenderingCodeMarker(element, kind, markerId, markerData);
-    }
-    else if (chromeType === "placeholder") {
-        normalizePlaceholderCodeMarker(element, kind, markerId, markerData);
-    }
-    else if (chromeType === "field") {
-        normalizeFieldCodeMarker(element, markerData);
-    }
-}
-function normalizeRenderingCodeMarker(element, kind, markerId, markerData) {
-    if (!markerId)
-        return;
-    if (kind === "open") {
-        const rendering = firstRecord(markerData, ["rendering", "renderingItem"]);
-        const item = readMarkerItemData(markerData, [
-            "contextItem",
-            "datasource",
-            "dataSource",
-            "dataSourceItem",
-            "item",
-        ]);
-        const typeId = normalizeSitecoreGuid(firstString(markerData, [
-            "renderingId",
-            "renderingID",
-            "renderingItemId",
-            "renderingItemID",
-            "typeId",
-        ]) || firstString(rendering, ["id", "itemId", "renderingId"]));
-        const displayName = firstString(markerData, ["displayName", "name", "renderingName"]) ||
-            firstString(rendering, ["displayName", "name"]);
-        setAttributeIfMissing(element, "data-component-start", markerId);
-        setAttributeIfMissing(element, "data-type", displayName);
-        setAttributeIfMissing(element, "data-typeid", typeId);
-        setAttributeIfMissing(element, "data-itemid", item?.id);
-        setAttributeIfMissing(element, "data-language", item?.language);
-        setAttributeIfMissing(element, "data-version", item?.version);
-        setAttributeIfMissing(element, "data-editable", readEditableValue(markerData));
-        return;
-    }
-    if (kind === "close") {
-        setAttributeIfMissing(element, "data-component-end", markerId);
-    }
-}
-function normalizePlaceholderCodeMarker(element, kind, markerId, markerData) {
-    const placeholderKey = normalizeHeadlessPlaceholderKey(markerId);
-    if (!placeholderKey)
-        return;
-    if (kind === "open") {
-        const displayName = firstString(markerData, [
-            "displayName",
-            "description",
-            "name",
-        ]);
-        setAttributeIfMissing(element, "data-placeholder-start", placeholderKey);
-        setAttributeIfMissing(element, "data-description", displayName);
-        setAttributeIfMissing(element, "data-editable", readEditableValue(markerData));
-        return;
-    }
-    if (kind === "close") {
-        setAttributeIfMissing(element, "data-placeholder-end", placeholderKey);
-    }
-}
-function normalizeFieldCodeMarker(element, markerData) {
-    const fieldData = readSitecoreFieldMarkerData(element, markerData);
-    if (!fieldData?.fieldId)
-        return;
-    // Field code markers identify ownership for the page skeleton, but the hidden
-    // marker itself must not become the editable field element.
-}
-export function buildPageModelSkeleton(iframeDocument, editContextRef, pageViewContextRef) {
-    const pageItemDescriptor = pageViewContextRef.current?.pageItemDescriptor;
-    if (!iframeDocument || !editContextRef.current || !pageViewContextRef.current)
-        return;
-    // Function to ensure IDs are in UUID format
-    const ensureUUIDFormat = (id) => {
-        // If it's already in UUID format (with or without curly braces), return it
-        if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(id)) {
-            return id;
-        }
-        // If it's in curly braces format, remove them
-        if (/^\{[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}\}$/i.test(id)) {
-            return id.replace(/[{}]/g, "");
-        }
-        // If it's a GUID without hyphens, add them
-        if (/^[0-9a-f]{32}$/i.test(id)) {
-            return `${id.substring(0, 8)}-${id.substring(8, 12)}-${id.substring(12, 16)}-${id.substring(16, 20)}-${id.substring(20, 32)}`;
-        }
-        // If it's a shorter ID, pad it to make it a valid UUID
-        if (id.length < 32) {
-            const paddedId = id.padEnd(32, "0");
-            return `${paddedId.substring(0, 8)}-${paddedId.substring(8, 12)}-${paddedId.substring(12, 16)}-${paddedId.substring(16, 20)}-${paddedId.substring(20, 32)}`;
-        }
-        // For any other format, return as is
-        return id;
-    };
-    if (!pageItemDescriptor)
-        return;
-    const pageItem = {
-        ...pageItemDescriptor,
-        renderedFieldIds: [],
-    };
-    const treeWalker = iframeDocument.createTreeWalker(iframeDocument.documentElement, // Root node to start traversal
-    NodeFilter.SHOW_ELEMENT, // Only show element nodes
-    null);
-    const root = {
-        placeholders: [],
-        id: "page",
-        type: "Page",
-        typeId: "",
-        name: "Page",
-        items: [pageItem],
-        datasourceItem: pageItem,
-        renderedDictionaryKeys: [],
-        editorFields: {},
-    };
-    let currentComponent = root;
-    let currentPlaceholder;
-    const resolveComponentFirstElement = (componentStartId, element) => {
-        if (!isChromeMarkerElement(element)) {
-            return element;
-        }
-        const previousElement = getPreviousNonChromeMarkerElement(element);
-        const nextElement = element.nextElementSibling;
-        const nextIsMatchingEndMarker = !!nextElement &&
-            getComponentEndId(nextElement, componentStartId) === componentStartId;
-        // Some Sitecore markers are emitted after the rendered component body, with
-        // the matching end marker immediately after the start marker.
-        if (nextIsMatchingEndMarker && previousElement) {
-            return previousElement;
-        }
-        return getNextNonChromeMarkerElement(element) ?? previousElement ?? element;
-    };
-    const moveContainedComponentsToPlaceholder = (sourcePlaceholder, targetPlaceholder, containerElement, currentComponentId) => {
-        if (!sourcePlaceholder || sourcePlaceholder === targetPlaceholder) {
-            return;
-        }
-        const containedComponents = sourcePlaceholder.components.filter((component) => {
-            if (component.id === currentComponentId) {
-                return false;
-            }
-            return (!!component.firstDOMElement &&
-                containerElement.contains(component.firstDOMElement));
-        });
-        if (containedComponents.length === 0) {
-            return;
-        }
-        sourcePlaceholder.components = sourcePlaceholder.components.filter((component) => !containedComponents.includes(component));
-        for (const component of containedComponents) {
-            component.parentPlaceholder = targetPlaceholder;
-            targetPlaceholder.components.push(component);
-        }
-    };
-    const normalizeExplicitPlaceholderKey = (placeholderKey) => {
-        if (!placeholderKey) {
-            return placeholderKey;
-        }
-        const parts = placeholderKey.split("/").filter(Boolean);
-        return parts.at(-1) ?? placeholderKey;
-    };
-    const ensurePlaceholder = (parentComponent, placeholderKey, element) => {
-        let placeholder = parentComponent.placeholders.find((x) => x.key === placeholderKey);
-        if (!placeholder) {
-            placeholder = {
-                key: placeholderKey,
-                name: placeholderKey.indexOf(parentComponent.id + "_") === 0
-                    ? placeholderKey.substring(parentComponent.id.length + 1)
-                    : placeholderKey,
-                description: element.getAttribute("data-description") || "",
-                components: [],
-                parentComponent,
-                editable: element.getAttribute("data-editable") !== "false",
-            };
-            parentComponent.placeholders.push(placeholder);
-        }
-        return placeholder;
-    };
-    const placeholderKeysMatch = (left, right) => left === right ||
-        normalizeExplicitPlaceholderKey(left) ===
-            normalizeExplicitPlaceholderKey(right);
-    const findPlaceholderByKey = (component, placeholderKey) => {
-        for (const placeholder of component.placeholders) {
-            if (placeholderKeysMatch(placeholder.key, placeholderKey)) {
-                return placeholder;
-            }
-            for (const child of placeholder.components) {
-                const nested = findPlaceholderByKey(child, placeholderKey);
-                if (nested) {
-                    return nested;
-                }
-            }
-        }
-        return undefined;
-    };
-    const closePlaceholder = (placeholderEndId) => {
-        const closingPlaceholder = currentPlaceholder &&
-            placeholderKeysMatch(currentPlaceholder.key, placeholderEndId)
-            ? currentPlaceholder
-            : findPlaceholderByKey(root, placeholderEndId);
-        if (!closingPlaceholder) {
-            return false;
-        }
-        currentComponent = closingPlaceholder.parentComponent;
-        if (currentPlaceholder === closingPlaceholder) {
-            currentPlaceholder = undefined;
-        }
-        return true;
-    };
-    const resolveComponentLastElement = (componentEndId, element, component) => {
-        const previousElement = getPreviousNonChromeMarkerElement(element);
-        if (previousElement &&
-            getComponentStartId(previousElement) === componentEndId &&
-            component.firstDOMElement) {
-            return component.firstDOMElement;
-        }
-        return previousElement ?? element;
-    };
-    const startComponent = (componentStartId, element, dataSourceItemId) => {
-        if (!currentPlaceholder) {
-            if (!currentComponent) {
-                console.error("Component start without parent component:", componentStartId);
-                return;
-            }
-            const explicitPlaceholderKey = element.getAttribute("data-placeholderkey");
-            if (explicitPlaceholderKey) {
-                currentPlaceholder = ensurePlaceholder(currentComponent, normalizeExplicitPlaceholderKey(explicitPlaceholderKey), element);
-            }
-            else {
-                currentPlaceholder = currentComponent.placeholders.find((x) => x.key === "implicit_" + currentComponent?.datasourceItem?.id);
-                if (!currentPlaceholder) {
-                    currentPlaceholder = {
-                        key: "implicit_" + currentComponent?.datasourceItem?.id,
-                        name: "Implicit placeholder: " + currentComponent?.datasourceItem?.id,
-                        description: "",
-                        components: [],
-                        parentComponent: currentComponent,
-                        editable: element.getAttribute("data-editable") !== "false",
-                    };
-                    if (!currentComponent) {
-                        console.error("Component start without placeholder or parent component");
-                    }
-                    else {
-                        currentComponent.placeholders.push(currentPlaceholder);
-                    }
-                }
-            }
-        }
-        if (currentPlaceholder) {
-            const language = element.getAttribute("data-language") || pageItem.language;
-            const version = element.hasAttribute("data-version")
-                ? parseInt(element.getAttribute("data-version"))
-                : pageItem.version;
-            const itemId = dataSourceItemId || element.getAttribute("data-itemid");
-            const datasourceItem = itemId
-                ? {
-                    id: itemId,
-                    language,
-                    version,
-                    renderedFieldIds: [],
-                }
-                : undefined;
-            const layoutId = element.getAttribute("data-layoutid");
-            const parametersTemplateId = element.getAttribute("data-parameters-template-id");
-            const parameters = element.getAttribute("data-parameters");
-            const isSharedDatasource = element.getAttribute("data-shared-datasource") === "true";
-            const hasPersonalization = element.getAttribute("data-has-personalization") === "true";
-            // Store the parent component before we potentially change currentComponent
-            const parentComponent = currentPlaceholder.parentComponent;
-            const parentPlaceholder = currentPlaceholder;
-            const componentFirstElement = resolveComponentFirstElement(componentStartId, element);
-            const componentType = element.getAttribute("data-type") ||
-                readDomComponentName(componentFirstElement) ||
-                "";
-            setAttributeIfMissing(element, "data-type", componentType);
-            if (excludedComponentTypes.has(componentType)) {
-                element.setAttribute("data-skip-component", "true");
-                return undefined;
-            }
-            if (componentFirstElement instanceof HTMLElement &&
-                !componentFirstElement.hasAttribute("data-component-id")) {
-                componentFirstElement.setAttribute("data-component-id", componentStartId);
-            }
-            currentComponent = currentPlaceholder.components.find((x) => x.id === componentStartId);
-            // Check if we should skip this component because it has the same datasource as the parent
-            if (datasourceItem &&
-                datasourceItem.id === parentComponent?.datasourceItem?.id) {
-                element.setAttribute("data-skip-component", "true");
-                return undefined;
-            }
-            if (!currentComponent) {
-                currentComponent = {
-                    id: componentStartId,
-                    name: "",
-                    type: componentType,
-                    typeId: element.getAttribute("data-typeid") || "",
-                    parametersTemplateId: parametersTemplateId || undefined,
-                    parameters: parameters || undefined,
-                    items: datasourceItem ? [datasourceItem] : [],
-                    placeholders: [],
-                    parentPlaceholder: currentPlaceholder,
-                    renderedDictionaryKeys: [],
-                    datasourceItem,
-                    layoutId: layoutId || undefined,
-                    isShared: isSharedDatasource,
-                    hasPersonalization,
-                    isSharedLayout: element.getAttribute("data-shared-rendering") === "true",
-                    editorFields: {},
-                    firstDOMElement: componentFirstElement,
-                    editable: element.getAttribute("data-editable") !== "false",
-                };
-                if (currentComponent) {
-                    currentPlaceholder.components.push(currentComponent);
-                }
-            }
-            else {
-                currentComponent.isShared = isSharedDatasource;
-                currentComponent.hasPersonalization =
-                    hasPersonalization || currentComponent.hasPersonalization;
-                currentComponent.layoutId = layoutId || currentComponent.layoutId;
-                currentComponent.parametersTemplateId =
-                    parametersTemplateId || currentComponent.parametersTemplateId;
-                currentComponent.parameters = parameters || currentComponent.parameters;
-                currentComponent.isSharedLayout =
-                    element.getAttribute("data-shared-rendering") === "true" ||
-                        currentComponent.isSharedLayout;
-            }
-            // Check if the new component should have an implicit placeholder
-            const hasImplicitPlaceholder = element.getAttribute("data-has-implicit-placeholder") === "true";
-            if (hasImplicitPlaceholder && currentComponent) {
-                // Add an implicit placeholder to the newly created component
-                const implicitPlaceholder = {
-                    key: "implicit_" + currentComponent.datasourceItem?.id,
-                    name: "Implicit placeholder: " + currentComponent.datasourceItem?.id,
-                    description: "",
-                    components: [],
-                    parentComponent: currentComponent,
-                    editable: element.getAttribute("data-editable") !== "false",
-                };
-                currentComponent.placeholders.push(implicitPlaceholder);
-                moveContainedComponentsToPlaceholder(parentPlaceholder, implicitPlaceholder, componentFirstElement, currentComponent.id);
-                currentPlaceholder = implicitPlaceholder;
-            }
-            else {
-                currentPlaceholder = undefined;
-            }
-            return currentComponent;
-        }
-    };
-    const endComponent = (componentEndId) => {
-        if (!currentComponent || currentComponent.id !== componentEndId) {
-            console.error("Component end does not match start", currentComponent, componentEndId);
-            // Placeholder closed implicitly
-            if (currentPlaceholder?.parentComponent.id === componentEndId) {
-                currentComponent = currentPlaceholder.parentComponent;
-                currentPlaceholder = undefined;
-            }
-        }
-        currentPlaceholder = currentComponent?.parentPlaceholder;
-        if (currentPlaceholder?.key.startsWith("implicit_")) {
-            currentComponent = currentPlaceholder.parentComponent;
-        }
-        else
-            currentComponent = undefined;
-    };
-    const componentStack = [];
-    const getComponentStartId = (element) => {
-        const normalizedId = element.getAttribute("data-component-start");
-        if (normalizedId)
-            return normalizedId;
-        if (isSitecoreCodeMarkerElement(element) &&
-            element.getAttribute("chrometype") === "rendering" &&
-            element.getAttribute("kind") === "open") {
-            return normalizeSitecoreGuid(element.getAttribute("id"));
-        }
-        return null;
-    };
-    const getComponentEndId = (element, fallback) => {
-        const normalizedId = element.getAttribute("data-component-end");
-        if (normalizedId)
-            return normalizedId;
-        if (isSitecoreCodeMarkerElement(element) &&
-            element.getAttribute("chrometype") === "rendering" &&
-            element.getAttribute("kind") === "close") {
-            return normalizeSitecoreGuid(element.getAttribute("id")) || fallback || null;
-        }
-        return null;
-    };
-    const getPlaceholderStartId = (element) => {
-        const normalizedId = element.getAttribute("data-placeholder-start");
-        if (normalizedId)
-            return normalizedId;
-        if (isSitecoreCodeMarkerElement(element) &&
-            element.getAttribute("chrometype") === "placeholder" &&
-            element.getAttribute("kind") === "open") {
-            return normalizeHeadlessPlaceholderKey(normalizeSitecoreGuid(element.getAttribute("id")));
-        }
-        return null;
-    };
-    const getPlaceholderEndId = (element, fallback) => {
-        const normalizedId = element.getAttribute("data-placeholder-end");
-        if (normalizedId)
-            return normalizedId;
-        if (isSitecoreCodeMarkerElement(element) &&
-            element.getAttribute("chrometype") === "placeholder" &&
-            element.getAttribute("kind") === "close") {
-            return (normalizeHeadlessPlaceholderKey(normalizeSitecoreGuid(element.getAttribute("id"))) ||
-                fallback ||
-                null);
-        }
-        return null;
-    };
-    while (treeWalker.nextNode()) {
-        const node = treeWalker.currentNode;
-        if (node.nodeType !== Node.ELEMENT_NODE)
-            continue;
-        const element = node;
-        const sitecoreCodeMarkerData = readSitecoreCodeMarkerData(element);
-        normalizeSitecoreCodeMarkerAttributes(element, sitecoreCodeMarkerData);
-        if (componentStack.length > 0) {
-            const component = componentStack[componentStack.length - 1];
-            //if element is not a descendant of the component's firstDOMElement,   the component from the stack
-            if (component && !component.element.contains(element)) {
-                componentStack.pop();
-                endComponent(component.component.id);
-            }
-        }
-        const sitecoreFieldMarkerData = readSitecoreFieldMarkerData(element, sitecoreCodeMarkerData);
-        if (currentComponent && sitecoreFieldMarkerData?.fieldId) {
-            const fieldId = ensureUUIDFormat(normalizeSitecoreId(sitecoreFieldMarkerData.fieldId));
-            const datasource = sitecoreFieldMarkerData.datasource;
-            const itemId = normalizeSitecoreId(datasource?.id);
-            const language = datasource?.language ||
-                currentComponent.datasourceItem?.language ||
-                pageItem.language;
-            const version = datasource?.version ||
-                currentComponent.datasourceItem?.version ||
-                pageItem.version;
-            if (itemId) {
-                let renderedItem = itemId === currentComponent.datasourceItem?.id
-                    ? currentComponent.datasourceItem
-                    : currentComponent.items.find((x) => x.id === itemId &&
-                        x.language === language &&
-                        x.version === version);
-                if (!renderedItem) {
-                    renderedItem = {
-                        id: itemId,
-                        language,
-                        version,
-                        renderedFieldIds: [],
-                    };
-                    currentComponent.items.push(renderedItem);
-                }
-                if (!currentComponent.datasourceItem) {
-                    currentComponent.datasourceItem = renderedItem;
-                }
-                if (renderedItem.renderedFieldIds.indexOf(fieldId) === -1) {
-                    renderedItem.renderedFieldIds.push(fieldId);
-                }
-            }
-        }
-        else if (currentComponent && element.getAttribute("chrometype") === "field") {
-            const id = element.getAttribute("id");
-            if (id) {
-                //fld_C866BEE59CE340F18529EF72E1EC34A7_427EC0BD3BF245B9880FBDB0054E7925_en_1_f3327de03c4c4fb39dae57c139e6202d_913_edit
-                const idComponents = id.split("_");
-                if (idComponents.length > 2) {
-                    let fieldId = idComponents[2]?.toLocaleLowerCase();
-                    if (!fieldId)
-                        continue;
-                    fieldId = ensureUUIDFormat(fieldId);
-                    let itemId = idComponents[1]?.toLocaleLowerCase();
-                    if (!itemId)
-                        continue;
-                    itemId = ensureUUIDFormat(itemId);
-                    let renderedItem = itemId == currentComponent.datasourceItem?.id
-                        ? currentComponent.datasourceItem
-                        : currentComponent.items.find((x) => x.id === itemId);
-                    if (!renderedItem) {
-                        renderedItem = {
-                            id: itemId,
-                            language: currentComponent.datasourceItem?.language || "",
-                            version: currentComponent.datasourceItem?.version || 0,
-                            renderedFieldIds: [],
-                        };
-                        currentComponent.items.push(renderedItem);
-                    }
-                    if (renderedItem &&
-                        renderedItem.renderedFieldIds.indexOf(fieldId) === -1) {
-                        renderedItem.renderedFieldIds.push(fieldId);
-                    }
-                }
-            }
-        }
-        if (currentComponent && element.hasAttribute("data-fieldid")) {
-            const fieldId = element.getAttribute("data-fieldid");
-            const formattedFieldId = ensureUUIDFormat(fieldId);
-            const language = element.getAttribute("data-language") ||
-                currentComponent.datasourceItem?.language ||
-                pageItem.language;
-            const version = element.hasAttribute("data-version")
-                ? parseInt(element.getAttribute("data-version"))
-                : currentComponent.datasourceItem?.version || pageItem.version;
-            const itemId = element.getAttribute("data-itemid") ||
-                currentComponent.datasourceItem?.id;
-            if (!itemId)
-                continue;
-            let renderedItem = currentComponent.items.find((x) => x.id === itemId && x.language === language && x.version === version);
-            if (!renderedItem) {
-                renderedItem = {
-                    id: itemId,
-                    language,
-                    version,
-                    renderedFieldIds: [],
-                };
-                currentComponent.items.push(renderedItem);
-            }
-            if (renderedItem.renderedFieldIds.indexOf(formattedFieldId) === -1) {
-                renderedItem.renderedFieldIds.push(formattedFieldId);
-            }
-        }
-        if (element.tagName == "DIV" && element.hasAttribute("sc_item")) {
-            const componentId = extractItemIdFromItemUri(element.getAttribute("sc_item"));
-            if (componentId && componentId != currentComponent?.datasourceItem?.id) {
-                const component = startComponent(componentId, element, componentId);
-                if (component) {
-                    component.lastDOMElement = component.firstDOMElement;
-                    componentStack.push({ component, element });
-                }
-            }
-        }
-        if (isChromeMarkerElement(element)) {
-            const placeholderStartId = getPlaceholderStartId(element);
-            const placeholderEndId = getPlaceholderEndId(element, currentPlaceholder?.key);
-            const componentStartId = getComponentStartId(element);
-            const componentEndId = getComponentEndId(element, currentComponent?.id);
-            const dictionaryKeyStart = element.getAttribute("data-dictionary-key-start");
-            const editorGroup = element.getAttribute("data-editor-group");
-            if (currentComponent && editorGroup) {
-                let group = currentComponent.editorFields[editorGroup];
-                if (!group) {
-                    group = {
-                        addFields: [],
-                        removeFields: [],
-                    };
-                    currentComponent.editorFields[editorGroup] = group;
-                }
-                const addFields = element.getAttribute("data-add-fields")?.split(",");
-                const removeFields = element
-                    .getAttribute("data-remove-fields")
-                    ?.split(",");
-                group.addFields = [...group.addFields, ...(addFields || [])];
-                group.removeFields = [...group.removeFields, ...(removeFields || [])];
-            }
-            if (dictionaryKeyStart) {
-                if (!currentComponent) {
-                    console.error("Dictionary key without component:", dictionaryKeyStart);
-                }
-                else {
-                    currentComponent.renderedDictionaryKeys.push(dictionaryKeyStart);
-                }
-            }
-            if (placeholderStartId) {
-                if (!currentComponent) {
-                    if (!currentPlaceholder) {
-                        currentPlaceholder = ensurePlaceholder(root, placeholderStartId, element);
-                    }
-                }
-                else {
-                    currentPlaceholder = ensurePlaceholder(currentComponent, placeholderStartId, element);
-                    currentComponent = undefined;
-                }
-            }
-            if (placeholderEndId) {
-                if (!closePlaceholder(placeholderEndId)) {
-                    console.debug("Placeholder end without matching start", placeholderEndId);
-                }
-            }
-            if (componentStartId) {
-                startComponent(componentStartId, element);
-            }
-            if (componentEndId) {
-                if (currentComponent) {
-                    currentComponent.lastDOMElement = resolveComponentLastElement(componentEndId, element, currentComponent);
-                    endComponent(componentEndId);
-                }
-            }
-        }
-    }
-    const page = {
-        rootComponent: root,
-        item: pageItem,
-        editRevision: editContextRef.current?.revision ?? "",
-    };
-    pageViewContextRef.current?.setPageSkeleton(page);
-}
-//# sourceMappingURL=pageModelSkeletonBuilder.js.map