ochre-sdk 1.0.78 → 1.1.0

package/dist/parsers/website/components.mjs

@@ -0,0 +1,681 @@
+import { componentSchema } from "../../schemas.mjs";
+import { parseXMLContent, transformPermanentIdentificationUrlToItemLink } from "../string.mjs";
+import { parseStringContent } from "../helpers.mjs";
+import { parseBibliographyList, parseIdentification, parseLinks, parseSimplifiedProperties } from "../index.mjs";
+import { parseBounds } from "./bounds.mjs";
+import { findWebsiteLink, findWebsiteLinkByCategories, getWebsiteLinks, parseWebsiteLinkTarget, webImageFromLink } from "./links.mjs";
+import { formatComponentError, formatXMLWebsiteResourceMetadata } from "./messages.mjs";
+import { parseWebsiteOptions } from "./options.mjs";
+import { websitePresentationReader } from "./reader.mjs";
+import { parseResponsiveCssStyles } from "./styles.mjs";
+import { normalizeWebsiteResources } from "./walk.mjs";
+import * as v from "valibot";
+//#region src/parsers/website/components.ts
+/**
+* Default values for a collection's display properties, shared between the
+* "collection" component and the "query" component's collection overrides.
+*/
+const COLLECTION_PROPERTY_DEFAULTS = {
+	variant: "slide",
+	paginationVariant: "default",
+	loadingVariant: "skeleton",
+	minimumColumnCount: null,
+	maximumColumnCount: null,
+	expectedItemCount: null,
+	isSortDisplayed: false,
+	isUsingQueryParams: false,
+	isInteractive: true
+};
+/**
+* Default values for a collection's image display properties, merged separately
+* from {@link COLLECTION_PROPERTY_DEFAULTS} because overrides of the nested
+* "image" object are themselves partial.
+*/
+const COLLECTION_IMAGE_DEFAULTS = {
+	layout: "start",
+	fit: "fit",
+	alignment: null,
+	isPlaceholderDisplayed: true
+};
+/**
+* Reads the collection display properties explicitly set on a reader, omitting
+* any that are unset. The "collection" component merges these over
+* {@link COLLECTION_PROPERTY_DEFAULTS} and {@link COLLECTION_IMAGE_DEFAULTS},
+* while the "query" component uses them as partial overrides for its embedded
+* collection.
+*/
+function parseCollectionPropertyOverrides(reader) {
+	const overrides = {};
+	const imageOverrides = {};
+	function read(key, label) {
+		const value = reader.value(label);
+		if (value != null) overrides[key] = value;
+	}
+	function readImage(key, label) {
+		const value = reader.value(label);
+		if (value != null) imageOverrides[key] = value;
+	}
+	read("variant", "variant");
+	read("paginationVariant", "pagination-variant");
+	read("loadingVariant", "loading-variant");
+	read("minimumColumnCount", "minimum-column-count");
+	read("maximumColumnCount", "maximum-column-count");
+	read("expectedItemCount", "item-count");
+	read("isSortDisplayed", "sort-displayed");
+	read("isUsingQueryParams", "is-using-query-params");
+	read("isInteractive", "is-interactive");
+	readImage("layout", "image-layout");
+	readImage("fit", "image-fit");
+	readImage("alignment", "image-alignment");
+	readImage("isPlaceholderDisplayed", "image-placeholder-displayed");
+	return Object.keys(imageOverrides).length > 0 ? {
+		...overrides,
+		image: imageOverrides
+	} : overrides;
+}
+/**
+* Parses the "use-property" values defining which item properties a collection
+* displays, returning `null` when none are set.
+*/
+function parseCollectionDisplayedProperties(reader) {
+	const property = reader.property("use-property");
+	if (property == null) return null;
+	return property.values.flatMap((value) => value.uuid === null ? [] : [{
+		uuid: value.uuid,
+		label: value.label
+	}]);
+}
+const THREE_D_VIEWER_COMPONENT_DEFAULTS = {
+	isInteractive: true,
+	isControlsDisplayed: true
+};
+function parse3dViewerComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const resourceLink = findWebsiteLink(websiteLinks, "resource", (link) => link.fileFormat === "model/obj");
+	if (resourceLink == null) throw new Error(formatComponentError("Resource link not found", "3d-viewer", elementResource), { cause: componentProperty });
+	const properties = { ...THREE_D_VIEWER_COMPONENT_DEFAULTS };
+	componentReader.readAll(properties, {
+		isInteractive: "is-interactive",
+		isControlsDisplayed: "controls-displayed"
+	});
+	const { isInteractive, isControlsDisplayed } = properties;
+	return {
+		component: "3d-viewer",
+		linkUuid: resourceLink.uuid,
+		fileSize: resourceLink.fileSize,
+		isInteractive,
+		isControlsDisplayed
+	};
+}
+function parseAdvancedSearchComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, options, pageSlugs } = parameters;
+	const boundElementPropertyUuid = componentReader.uuid("bound-element");
+	const href = parseWebsiteLinkTarget(componentReader.valueNode("link-to"), pageSlugs);
+	if (boundElementPropertyUuid == null && href == null) throw new Error(formatComponentError("Bound element or href not found", "advanced-search", elementResource), { cause: componentProperty });
+	return {
+		component: "advanced-search",
+		boundElementUuid: boundElementPropertyUuid,
+		href,
+		options: parseWebsiteOptions(elementResource.options, options)
+	};
+}
+function parseAnnotatedDocumentComponent(parameters) {
+	const { componentProperty, elementResource, websiteLinks } = parameters;
+	const documentLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "internalDocument");
+	if (documentLink == null) throw new Error(formatComponentError("Document link not found", "annotated-document", elementResource), { cause: componentProperty });
+	return {
+		component: "annotated-document",
+		linkUuid: documentLink.uuid
+	};
+}
+const ANNOTATED_IMAGE_COMPONENT_DEFAULTS = {
+	isFilterInputDisplayed: true,
+	isOptionsDisplayed: true,
+	isAnnotationHighlightsDisplayed: true,
+	isAnnotationTooltipsDisplayed: true
+};
+function parseAnnotatedImageComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const imageLinks = getWebsiteLinks(websiteLinks, "resource").filter((link) => link.type === "image" || link.type === "IIIF");
+	if (imageLinks.length === 0) throw new Error(formatComponentError("Image link not found", "annotated-image", elementResource), { cause: componentProperty });
+	const properties = { ...ANNOTATED_IMAGE_COMPONENT_DEFAULTS };
+	componentReader.readAll(properties, {
+		isFilterInputDisplayed: "filter-input-displayed",
+		isOptionsDisplayed: "options-displayed",
+		isAnnotationHighlightsDisplayed: "annotation-highlights-displayed",
+		isAnnotationTooltipsDisplayed: "annotation-tooltips-displayed"
+	});
+	const { isFilterInputDisplayed, isOptionsDisplayed, isAnnotationHighlightsDisplayed, isAnnotationTooltipsDisplayed } = properties;
+	return {
+		component: "annotated-image",
+		linkUuid: imageLinks[0].uuid,
+		isFilterInputDisplayed,
+		isOptionsDisplayed,
+		isAnnotationHighlightsDisplayed,
+		isAnnotationTooltipsDisplayed
+	};
+}
+const AUDIO_PLAYER_COMPONENT_DEFAULTS = {
+	isSpeedControlsDisplayed: true,
+	isVolumeControlsDisplayed: true,
+	isSeekBarDisplayed: true
+};
+function parseAudioPlayerComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const audioLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "audio");
+	if (audioLink == null) throw new Error(formatComponentError("Audio link not found", "audio-player", elementResource), { cause: componentProperty });
+	const properties = { ...AUDIO_PLAYER_COMPONENT_DEFAULTS };
+	componentReader.readAll(properties, {
+		isSpeedControlsDisplayed: "speed-controls-displayed",
+		isVolumeControlsDisplayed: "volume-controls-displayed",
+		isSeekBarDisplayed: "seek-bar-displayed"
+	});
+	const { isSpeedControlsDisplayed, isVolumeControlsDisplayed, isSeekBarDisplayed } = properties;
+	return {
+		component: "audio-player",
+		linkUuid: audioLink.uuid,
+		isSpeedControlsDisplayed,
+		isVolumeControlsDisplayed,
+		isSeekBarDisplayed
+	};
+}
+function parseBibliographyComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks, options } = parameters;
+	const bibliographies = parseBibliographyList(elementResource.bibliographies, options);
+	if (websiteLinks.length === 0 && bibliographies.length === 0) throw new Error(formatComponentError("No links found", "bibliography", elementResource), { cause: componentProperty });
+	const layout = componentReader.valueOr("layout", "long");
+	const isSourceDocumentDisplayed = componentReader.valueOr("source-document-displayed", true);
+	return {
+		component: "bibliography",
+		linkUuids: websiteLinks.map((link) => link.uuid),
+		bibliographies,
+		layout,
+		isSourceDocumentDisplayed
+	};
+}
+function parseButtonComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks, options, pageSlugs } = parameters;
+	const variant = componentReader.valueOr("variant", "default");
+	let isExternal = false;
+	let isRelative = false;
+	let href = parseWebsiteLinkTarget(componentReader.valueNode("navigate-to"), pageSlugs);
+	if (href === null) {
+		href = parseWebsiteLinkTarget(componentReader.valueNode("link-to"), pageSlugs);
+		if (href === null) throw new Error(formatComponentError("Properties “navigate-to” or “link-to” not found", "button", elementResource), { cause: componentProperty });
+		isExternal = href.startsWith("http");
+		isRelative = !href.startsWith("/");
+	}
+	const startIcon = componentReader.value("start-icon");
+	const endIcon = componentReader.value("end-icon");
+	const imageLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "image" || link.type === "IIIF");
+	const image = imageLink == null ? null : webImageFromLink(imageLink, "high");
+	const childResources = normalizeWebsiteResources(elementResource.resource);
+	const elements = [];
+	for (const childResource of childResources) {
+		const childReader = websitePresentationReader(parseSimplifiedProperties(childResource.properties, options));
+		if (childReader.value("presentation") !== "element") continue;
+		if (childReader.nestedByValue("presentation", "element").value("component") === "button") continue;
+		elements.push(parseWebElement(childResource, options, pageSlugs));
+	}
+	return {
+		component: "button",
+		variant,
+		href,
+		isExternal,
+		isRelative,
+		label: elementResource.document && "content" in elementResource.document ? parseXMLContent(elementResource.document, options) : null,
+		startIcon,
+		endIcon,
+		image,
+		elements
+	};
+}
+const COLLECTION_FILTER_DEFAULTS = {
+	isResultsBarDisplayed: false,
+	isInputDisplayed: false,
+	isLimitedToInputFilter: false,
+	isLimitedToLeafPropertyValues: false,
+	isSidebarDisplayed: false,
+	sidebarSort: "default",
+	isSidebarHelpTooltipsDisplayed: false
+};
+function parseCollectionComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks, options } = parameters;
+	const setLinks = getWebsiteLinks(websiteLinks, "set");
+	if (setLinks.length === 0) throw new Error(formatComponentError("Set links not found", "collection", elementResource), { cause: componentProperty });
+	const filter = { ...COLLECTION_FILTER_DEFAULTS };
+	componentReader.readAll(filter, {
+		isResultsBarDisplayed: "filter-results-bar-displayed",
+		isInputDisplayed: "filter-input-displayed",
+		isLimitedToInputFilter: "filter-limit-to-input-filter",
+		isLimitedToLeafPropertyValues: "filter-limit-to-leaf-property-values",
+		isSidebarDisplayed: "filter-sidebar-displayed",
+		sidebarSort: "filter-sidebar-sort",
+		isSidebarHelpTooltipsDisplayed: "filter-sidebar-help-tooltips-displayed"
+	});
+	const componentOptions = parseWebsiteOptions(elementResource.options, options);
+	const propertyOverrides = parseCollectionPropertyOverrides(componentReader);
+	return {
+		component: "collection",
+		linkUuids: setLinks.map((link) => link.uuid),
+		displayedProperties: parseCollectionDisplayedProperties(componentReader),
+		...COLLECTION_PROPERTY_DEFAULTS,
+		...propertyOverrides,
+		image: {
+			...COLLECTION_IMAGE_DEFAULTS,
+			...propertyOverrides.image
+		},
+		filter,
+		options: componentOptions
+	};
+}
+function parseEmptySpaceComponent(parameters) {
+	const { componentReader } = parameters;
+	return {
+		component: "empty-space",
+		height: componentReader.stringValue("height"),
+		width: componentReader.stringValue("width")
+	};
+}
+function parseEntriesComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const entriesLink = findWebsiteLinkByCategories(websiteLinks, ["set", "tree"]);
+	if (entriesLink == null) throw new Error(formatComponentError("Entries link not found", "entries", elementResource), { cause: componentProperty });
+	const variant = componentReader.valueOr("variant", "entry");
+	const isFilterInputDisplayed = componentReader.valueOr("filter-input-displayed", false);
+	return {
+		component: "entries",
+		linkUuid: entriesLink.uuid,
+		variant,
+		isFilterInputDisplayed
+	};
+}
+function parseIframeComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const webpageLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "webpage");
+	if (webpageLink?.href == null) throw new Error(formatComponentError("URL not found", "iframe", elementResource), { cause: componentProperty });
+	return {
+		component: "iframe",
+		href: transformPermanentIdentificationUrlToItemLink(webpageLink.href),
+		height: componentReader.stringValue("height"),
+		width: componentReader.stringValue("width")
+	};
+}
+function parseIiifViewerComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const manifestLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "IIIF");
+	if (manifestLink == null) throw new Error(formatComponentError("Manifest link not found", "iiif-viewer", elementResource), { cause: componentProperty });
+	const variant = componentReader.valueOr("variant", "universal-viewer");
+	return {
+		component: "iiif-viewer",
+		linkUuid: manifestLink.uuid,
+		variant
+	};
+}
+/**
+* The defaults an image component falls back to
+*
+* Annotated rather than `as const`, so each field keeps the full union its
+* type allows and the parser can still compare against the other members.
+*/
+const IMAGE_COMPONENT_DEFAULTS = {
+	imageQuality: "high",
+	variant: "default",
+	captionLayout: "bottom",
+	isFullWidth: true,
+	isFullHeight: true,
+	captionSource: "name",
+	altTextSource: "name",
+	isTransparentBackground: false,
+	isCover: false
+};
+function parseImageComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	if (websiteLinks.length === 0) throw new Error(formatComponentError("No links found", "image", elementResource), { cause: componentProperty });
+	const properties = { ...IMAGE_COMPONENT_DEFAULTS };
+	componentReader.readAll(properties, {
+		imageQuality: "image-quality",
+		variant: "variant",
+		captionLayout: "layout-caption",
+		isFullWidth: "is-full-width",
+		isFullHeight: "is-full-height",
+		captionSource: "source-caption",
+		altTextSource: "alt-text-source",
+		isTransparentBackground: "is-transparent",
+		isCover: "is-cover"
+	});
+	const { imageQuality, variant, captionLayout, isFullWidth, isFullHeight, captionSource, altTextSource, isTransparentBackground, isCover } = properties;
+	const images = Array.from(websiteLinks, (link) => webImageFromLink(link, imageQuality));
+	const width = componentReader.stringValue("width");
+	const height = componentReader.stringValue("height");
+	const variantReader = componentReader.nested("variant");
+	let carouselOptions = null;
+	if (images.length > 1) {
+		const secondsPerImage = variant === "carousel" ? variantReader.stringValue("seconds-per-image") : null;
+		carouselOptions = { secondsPerImage: Number(secondsPerImage ?? 5) };
+	}
+	let heroOptions = null;
+	if (variant === "hero") heroOptions = {
+		isBackgroundImageDisplayed: variantReader.valueOr("background-image-displayed", true),
+		isDocumentDisplayed: variantReader.valueOr("document-displayed", true)
+	};
+	return {
+		component: "image",
+		images,
+		variant,
+		width,
+		height,
+		isFullWidth,
+		isFullHeight,
+		imageQuality,
+		captionLayout,
+		captionSource,
+		altTextSource,
+		isTransparentBackground,
+		isCover,
+		carouselOptions,
+		heroOptions
+	};
+}
+function parseImageGalleryComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const galleryLink = findWebsiteLinkByCategories(websiteLinks, ["set", "tree"]);
+	if (galleryLink == null) throw new Error(formatComponentError("Image gallery link not found", "image-gallery", elementResource), { cause: componentProperty });
+	const isFilterInputDisplayed = componentReader.valueOr("filter-input-displayed", true);
+	return {
+		component: "image-gallery",
+		linkUuid: galleryLink.uuid,
+		isFilterInputDisplayed
+	};
+}
+const MAP_COMPONENT_DEFAULTS = {
+	isInteractive: true,
+	isClustered: false,
+	isUsingPins: false,
+	isControlsDisplayed: false,
+	isFullHeight: false
+};
+function parseMapComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const mapLink = findWebsiteLinkByCategories(websiteLinks, ["set", "tree"]);
+	if (mapLink == null) throw new Error(formatComponentError("Map link not found", "map", elementResource), { cause: componentProperty });
+	const properties = { ...MAP_COMPONENT_DEFAULTS };
+	componentReader.readAll(properties, {
+		isInteractive: "is-interactive",
+		isClustered: "is-clustered",
+		isUsingPins: "is-using-pins",
+		isControlsDisplayed: "controls-displayed",
+		isFullHeight: "is-full-height"
+	});
+	const { isInteractive, isClustered, isUsingPins, isControlsDisplayed, isFullHeight } = properties;
+	const customBasemap = componentReader.value("custom-basemap");
+	let initialBounds = null;
+	const initialBoundsProperty = componentReader.value("initial-bounds");
+	if (initialBoundsProperty !== null) initialBounds = parseBounds(String(initialBoundsProperty));
+	let maximumBounds = null;
+	const maximumBoundsProperty = componentReader.value("maximum-bounds");
+	if (maximumBoundsProperty !== null) maximumBounds = parseBounds(String(maximumBoundsProperty));
+	return {
+		component: "map",
+		linkUuid: mapLink.uuid,
+		customBasemap,
+		initialBounds,
+		maximumBounds,
+		isInteractive,
+		isClustered,
+		isUsingPins,
+		isControlsDisplayed,
+		isFullHeight
+	};
+}
+function parseQueryItemQueries(propertyVariables, queryLanguage, elementResource) {
+	const queries = [];
+	for (const propertyVariable of propertyVariables) {
+		if (propertyVariable.uuid === null) throw new Error(formatComponentError("Property variable UUID not found", "query", elementResource), { cause: propertyVariable });
+		const dataType = propertyVariable.dataType;
+		if (dataType === "coordinate") throw new Error(formatComponentError("Query prompts with data type \"coordinate\" are not supported", "query", elementResource), { cause: propertyVariable });
+		queries.push({
+			target: "property",
+			propertyVariable: propertyVariable.uuid,
+			dataType,
+			matchMode: "exact",
+			isCaseSensitive: true,
+			language: queryLanguage
+		});
+	}
+	return queries;
+}
+function parseQueryComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks, options } = parameters;
+	const setLinks = getWebsiteLinks(websiteLinks, "set");
+	if (setLinks.length === 0) throw new Error(formatComponentError("Set links not found", "query", elementResource), { cause: componentProperty });
+	if (componentProperty.properties.length === 0) throw new Error(formatComponentError("Query properties not found", "query", elementResource), { cause: componentProperty });
+	const items = [];
+	for (const queryItem of componentProperty.properties) {
+		const queryReader = websitePresentationReader(queryItem.properties);
+		const label = queryReader.multilingualValue("query-prompt", options);
+		if (label === null) continue;
+		const propertyVariables = queryReader.property("use-property")?.values.filter((value) => value.uuid !== null) ?? [];
+		const queryLanguage = options.languages[0];
+		if (queryLanguage == null) throw new Error(formatComponentError("Query language not found", "query", elementResource));
+		const queries = parseQueryItemQueries(propertyVariables, queryLanguage, elementResource);
+		const startIcon = queryReader.value("start-icon");
+		const endIcon = queryReader.value("end-icon");
+		items.push({
+			label,
+			queries,
+			startIcon,
+			endIcon
+		});
+	}
+	if (items.length === 0) throw new Error(formatComponentError("No queries found", "query", elementResource), { cause: componentProperty });
+	const componentOptions = parseWebsiteOptions(elementResource.options, options);
+	const collectionProperties = parseCollectionPropertyOverrides(componentReader.nestedByValue("sub-component-override", "collection"));
+	const displayedProperties = parseCollectionDisplayedProperties(componentReader);
+	if (displayedProperties != null) collectionProperties.displayedProperties = displayedProperties;
+	return {
+		component: "query",
+		linkUuids: setLinks.map((link) => link.uuid),
+		items,
+		options: componentOptions,
+		collectionProperties
+	};
+}
+function parseTableComponent(parameters) {
+	const { componentProperty, elementResource, websiteLinks } = parameters;
+	const tableLink = findWebsiteLink(websiteLinks, "set");
+	if (tableLink == null) throw new Error(formatComponentError("Table link not found", "table", elementResource), { cause: componentProperty });
+	return {
+		component: "table",
+		linkUuid: tableLink.uuid
+	};
+}
+function parseSearchBarComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, options, pageSlugs } = parameters;
+	const queryVariant = componentReader.valueOr("query-variant", "submit");
+	const boundElementUuid = componentReader.uuid("bound-element");
+	const href = parseWebsiteLinkTarget(componentReader.valueNode("link-to"), pageSlugs);
+	if (boundElementUuid === null && href === null) throw new Error(formatComponentError("Bound element or href not found", "search-bar", elementResource), { cause: componentProperty });
+	return {
+		component: "search-bar",
+		queryVariant,
+		placeholder: componentReader.multilingualValue("placeholder-text", options),
+		baseFilterQueries: componentReader.value("base-filter-queries")?.replaceAll(String.raw`\{`, "{").replaceAll(String.raw`\}`, "}") ?? null,
+		boundElementUuid,
+		href
+	};
+}
+function parseTextComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, options } = parameters;
+	const content = elementResource.document && "content" in elementResource.document ? parseXMLContent(elementResource.document, options) : null;
+	if (content == null) throw new Error(formatComponentError("Content not found", "text", elementResource), { cause: componentProperty });
+	let variantName = "block";
+	let variant;
+	const variantProperty = componentReader.property("variant");
+	if (variantProperty !== null) {
+		const variantReader = websitePresentationReader(variantProperty.properties);
+		variantName = variantProperty.values[0].content;
+		switch (variantName) {
+			case "paragraph":
+				variant = {
+					name: variantName,
+					size: variantReader.valueOr("size", "md")
+				};
+				break;
+			case "label":
+				variant = {
+					name: variantName,
+					size: variantReader.valueOr("size", "md")
+				};
+				break;
+			case "heading":
+				variant = {
+					name: variantName,
+					size: variantReader.valueOr("size", "md")
+				};
+				break;
+			case "display":
+				variant = {
+					name: variantName,
+					size: variantReader.valueOr("size", "md")
+				};
+				break;
+			default: variant = { name: variantName };
+		}
+	} else variant = { name: variantName };
+	const headingLevel = componentReader.value("heading-level");
+	return {
+		component: "text",
+		variant,
+		headingLevel,
+		content
+	};
+}
+function parseTimelineComponent(parameters) {
+	const { componentProperty, elementResource, websiteLinks } = parameters;
+	const timelineLink = findWebsiteLink(websiteLinks, "tree");
+	if (timelineLink == null) throw new Error(formatComponentError("Timeline link not found", "timeline", elementResource), { cause: componentProperty });
+	return {
+		component: "timeline",
+		linkUuid: timelineLink.uuid
+	};
+}
+function parseVideoComponent(parameters) {
+	const { componentProperty, componentReader, elementResource, websiteLinks } = parameters;
+	const videoLink = findWebsiteLink(websiteLinks, "resource", (link) => link.type === "video");
+	if (videoLink == null) throw new Error(formatComponentError("Video link not found", "video", elementResource), { cause: componentProperty });
+	const isChaptersDisplayed = componentReader.valueOr("chapters-displayed", true);
+	return {
+		component: "video",
+		linkUuid: videoLink.uuid,
+		isChaptersDisplayed
+	};
+}
+/**
+* Parses raw web element properties into a standardized WebElementComponent structure
+*
+* @param componentProperty - Raw component property data in OCHRE format
+* @param elementResource - Raw element resource data in OCHRE format
+* @returns Parsed WebElementComponent object
+*/
+/**
+* The parser for each web element component, keyed by its OCHRE component name
+*
+* Every component parser takes the same {@link WebElementComponentParameters}
+* bag, so this is a table rather than a `switch`: a missing component is a type
+* error here instead of a runtime throw, and each parser can be exercised on
+* its own.
+*/
+const WEB_ELEMENT_COMPONENT_PARSERS = {
+	"3d-viewer": parse3dViewerComponent,
+	"advanced-search": parseAdvancedSearchComponent,
+	"annotated-document": parseAnnotatedDocumentComponent,
+	"annotated-image": parseAnnotatedImageComponent,
+	"audio-player": parseAudioPlayerComponent,
+	bibliography: parseBibliographyComponent,
+	button: parseButtonComponent,
+	collection: parseCollectionComponent,
+	"empty-space": parseEmptySpaceComponent,
+	entries: parseEntriesComponent,
+	iframe: parseIframeComponent,
+	"iiif-viewer": parseIiifViewerComponent,
+	image: parseImageComponent,
+	"image-gallery": parseImageGalleryComponent,
+	map: parseMapComponent,
+	query: parseQueryComponent,
+	table: parseTableComponent,
+	"search-bar": parseSearchBarComponent,
+	text: parseTextComponent,
+	timeline: parseTimelineComponent,
+	video: parseVideoComponent
+};
+function parseWebElementProperties(componentProperty, elementResource, options, pageSlugs) {
+	const unparsedComponentName = componentProperty.values[0].content;
+	const componentNameResult = v.safeParse(componentSchema, unparsedComponentName);
+	const parse = componentNameResult.success ? WEB_ELEMENT_COMPONENT_PARSERS[componentNameResult.output] : void 0;
+	if (parse == null) throw new Error(`Invalid or non-implemented component name \u{201C}${unparsedComponentName.toString()}\u{201D} for the following element: \u{201C}${parseStringContent(elementResource.identification.label, options)}\u{201D}`);
+	return parse({
+		componentProperty,
+		componentReader: websitePresentationReader(componentProperty.properties),
+		elementResource,
+		websiteLinks: parseLinks(elementResource.links, options),
+		options,
+		pageSlugs
+	});
+}
+function parseWebTitle(properties, identification, overrides) {
+	const title = {
+		label: identification.label,
+		variant: "default",
+		properties: {
+			isNameDisplayed: overrides?.isNameDisplayed ?? false,
+			isDescriptionDisplayed: overrides?.isDescriptionDisplayed ?? false,
+			isDateDisplayed: overrides?.isDateDisplayed ?? false,
+			isCreatorsDisplayed: overrides?.isCreatorsDisplayed ?? false,
+			isCountDisplayed: overrides?.isCountDisplayed ?? false
+		}
+	};
+	const titleReader = websitePresentationReader(properties).nestedByValue("presentation", "title");
+	if (titleReader.size > 0) {
+		titleReader.readAll(title, { variant: "variant" });
+		titleReader.readAll(title.properties, {
+			isNameDisplayed: "name-displayed",
+			isDescriptionDisplayed: "description-displayed",
+			isDateDisplayed: "date-displayed",
+			isCreatorsDisplayed: "creators-displayed",
+			isCountDisplayed: "count-displayed"
+		});
+	}
+	return title;
+}
+/**
+* Parses raw web element data into a standardized WebElement structure
+*
+* @param elementResource - Raw element resource data in OCHRE format
+* @returns Parsed WebElement object
+*/
+function parseWebElement(elementResource, options, pageSlugs) {
+	const identification = parseIdentification(elementResource.identification, options);
+	const elementProperties = parseSimplifiedProperties(elementResource.properties, options);
+	const presentationProperty = websitePresentationReader(elementProperties).requiredProperty("presentation", `Presentation property not found for element (${formatXMLWebsiteResourceMetadata(elementResource)})`);
+	const properties = parseWebElementProperties(websitePresentationReader(presentationProperty.properties).requiredProperty("component", `Component property not found for element (${formatXMLWebsiteResourceMetadata(elementResource)})`), elementResource, options, pageSlugs);
+	const cssStyles = parseResponsiveCssStyles(elementProperties);
+	const title = parseWebTitle(elementProperties, identification, {
+		isNameDisplayed: [
+			"annotated-image",
+			"annotated-document",
+			"collection"
+		].includes(properties.component),
+		isCountDisplayed: properties.component === "collection"
+	});
+	return {
+		uuid: elementResource.uuid,
+		language: elementResource.lang ?? null,
+		type: "element",
+		title,
+		cssStyles,
+		...properties
+	};
+}
+//#endregion
+export { WEB_ELEMENT_COMPONENT_PARSERS, parseWebElement, parseWebTitle };