@digitalculture/ochre-sdk 0.3.7 → 0.4.0

package/dist/index.cjs

@@ -1329,20 +1329,34 @@ var parseWebpageResources = async (webpageResources, type) => {
       (property) => property.label === "presentation" && property.values[0].content === type
     );
     if (!resourceProperty) continue;
-    if (type === "element") {
-      const element = await parseWebElement(
-        resource,
-        resourceProperty.properties
-      );
-      returnElements.push(
-        element
-      );
-    } else {
-      const webpage = await parseWebpage(resource);
-      if (webpage) {
+    switch (type) {
+      case "element": {
+        const element = await parseWebElement(
+          resource,
+          resourceProperty.properties
+        );
         returnElements.push(
-          webpage
+          element
         );
+        break;
+      }
+      case "page": {
+        const webpage = await parseWebpage(resource);
+        if (webpage) {
+          returnElements.push(
+            webpage
+          );
+        }
+        break;
+      }
+      case "block": {
+        const block = await parseBlock(resource);
+        if (block) {
+          returnElements.push(
+            block
+          );
+        }
+        break;
       }
     }
   }
@@ -1438,6 +1452,13 @@ async function parseWebElementProperties(componentProperty, elementResource) {
       break;
     }
     case "button": {
+      let variant = getPropertyValueByLabel(
+        componentProperty.properties,
+        "variant"
+      );
+      if (variant === null) {
+        variant = "default";
+      }
       let isExternal = false;
       let href = getPropertyValueByLabel(
         componentProperty.properties,
@@ -1453,6 +1474,7 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           isExternal = true;
         }
       }
+      properties.variant = variant;
       properties.href = href;
       properties.isExternal = isExternal;
       properties.label = ["string", "number", "boolean"].includes(
@@ -1527,6 +1549,22 @@ async function parseWebElementProperties(componentProperty, elementResource) {
       if (captionLayout === null) {
         captionLayout = "bottom";
       }
+      let isFullWidth = true;
+      const isFullWidthProperty = getPropertyValueByLabel(
+        componentProperty.properties,
+        "is-full-width"
+      );
+      if (isFullWidthProperty !== null) {
+        isFullWidth = isFullWidthProperty === "Yes";
+      }
+      let isFullHeight = true;
+      const isFullHeightProperty = getPropertyValueByLabel(
+        componentProperty.properties,
+        "is-full-height"
+      );
+      if (isFullHeightProperty !== null) {
+        isFullHeight = isFullHeightProperty === "Yes";
+      }
       let imageQuality = getPropertyValueByLabel(
         componentProperty.properties,
         "image-quality"
@@ -1555,8 +1593,6 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           "variant"
         );
         let secondsPerImage = 5;
-        let isFullWidth = false;
-        let isFullHeight = false;
         if (variantProperty && variantProperty.values[0].content === "carousel") {
           const secondsPerImageProperty = getPropertyValueByLabel(
             variantProperty.properties,
@@ -1565,30 +1601,16 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           if (secondsPerImageProperty !== null) {
             secondsPerImage = Number.parseFloat(secondsPerImageProperty);
           }
-          const isFullWidthProperty = getPropertyValueByLabel(
-            variantProperty.properties,
-            "is-full-width"
-          );
-          if (isFullWidthProperty !== null) {
-            isFullWidth = isFullWidthProperty === "Yes";
-          }
-          const isFullHeightProperty = getPropertyValueByLabel(
-            variantProperty.properties,
-            "is-full-height"
-          );
-          if (isFullHeightProperty !== null) {
-            isFullHeight = isFullHeightProperty === "Yes";
-          }
         }
         carouselOptions = {
-          secondsPerImage,
-          isFullWidth,
-          isFullHeight
+          secondsPerImage
         };
       }
       properties.images = images;
       properties.variant = variant;
       properties.carouselOptions = carouselOptions;
+      properties.isFullWidth = isFullWidth;
+      properties.isFullHeight = isFullHeight;
       properties.imageQuality = imageQuality;
       properties.captionLayout = captionLayout;
       properties.captionSource = captionSource;
@@ -1878,10 +1900,33 @@ async function parseWebpage(webpageResource) {
   const imageLink = links.find(
     (link) => link.type === "image" || link.type === "IIIF"
   );
-  const elements = webpageResource.resource ? await parseWebpageResources(
+  const blocks = webpageResource.resource ? await parseWebpageResources(
     Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
-    "element"
+    "block"
   ) : [];
+  if (blocks.length === 0) {
+    const defaultBlock = {
+      uuid: webpageResource.uuid,
+      layout: "vertical",
+      blocks: [],
+      elements: [],
+      properties: {
+        spacing: "default",
+        gap: "none",
+        alignItems: "stretch",
+        justifyContent: "stretch"
+      },
+      cssStyles: []
+    };
+    blocks.push(defaultBlock);
+    const elements = webpageResource.resource ? await parseWebpageResources(
+      Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
+      "element"
+    ) : [];
+    if (elements.length > 0) {
+      defaultBlock.elements = elements;
+    }
+  }
   const webpages = webpageResource.resource ? await parseWebpageResources(
     Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
     "page"
@@ -1934,7 +1979,7 @@ async function parseWebpage(webpageResource) {
   return {
     title: identification.label,
     slug,
-    elements,
+    blocks,
     properties: {
       displayedInHeader,
       width,
@@ -1957,6 +2002,85 @@ async function parseWebpages(webpageResources) {
   }
   return returnPages;
 }
+async function parseBlock(blockResource) {
+  const returnBlock = {
+    uuid: blockResource.uuid,
+    layout: "vertical",
+    blocks: [],
+    elements: [],
+    properties: {
+      spacing: "default",
+      gap: "none",
+      alignItems: "stretch",
+      justifyContent: "stretch"
+    },
+    cssStyles: []
+  };
+  const blockProperties = blockResource.properties ? parseProperties(
+    Array.isArray(blockResource.properties.property) ? blockResource.properties.property : [blockResource.properties.property]
+  ) : [];
+  const blockMainProperties = blockProperties.find(
+    (property) => property.label === "presentation" && property.values[0]?.content === "block"
+  )?.properties;
+  if (blockMainProperties) {
+    const layoutProperty = blockMainProperties.find(
+      (property) => property.label === "layout"
+    )?.values[0];
+    if (layoutProperty) {
+      returnBlock.layout = layoutProperty.content;
+    }
+    const spacingProperty = blockMainProperties.find(
+      (property) => property.label === "spacing"
+    )?.values[0];
+    if (spacingProperty) {
+      returnBlock.properties.spacing = spacingProperty.content;
+    }
+    const gapProperty = blockMainProperties.find(
+      (property) => property.label === "gap"
+    )?.values[0];
+    if (gapProperty) {
+      returnBlock.properties.gap = gapProperty.content;
+    }
+    const alignItemsProperty = blockMainProperties.find(
+      (property) => property.label === "align-items"
+    )?.values[0];
+    if (alignItemsProperty) {
+      returnBlock.properties.alignItems = alignItemsProperty.content;
+    }
+    const justifyContentProperty = blockMainProperties.find(
+      (property) => property.label === "justify-content"
+    )?.values[0];
+    if (justifyContentProperty) {
+      returnBlock.properties.justifyContent = justifyContentProperty.content;
+    }
+  }
+  const blockBlocks = blockResource.resource ? await parseWebpageResources(
+    Array.isArray(blockResource.resource) ? blockResource.resource : [blockResource.resource],
+    "block"
+  ) : [];
+  for (const block of blockBlocks) {
+    returnBlock.blocks.push(block);
+  }
+  const blockElements = blockResource.resource ? await parseWebpageResources(
+    Array.isArray(blockResource.resource) ? blockResource.resource : [blockResource.resource],
+    "element"
+  ) : [];
+  for (const element of blockElements) {
+    returnBlock.elements.push(element);
+  }
+  const blockCssStyles = blockProperties.find(
+    (property) => property.label === "presentation" && property.values[0]?.content === "css"
+  )?.properties;
+  if (blockCssStyles) {
+    for (const property of blockCssStyles) {
+      returnBlock.cssStyles.push({
+        label: property.label,
+        value: property.values[0].content
+      });
+    }
+  }
+  return returnBlock;
+}
 function parseWebsiteProperties(properties) {
   const mainProperties = parseProperties(properties);
   const websiteProperties = mainProperties.find(
@@ -1996,6 +2120,7 @@ function parseWebsiteProperties(properties) {
   let isHeaderProjectDisplayed = true;
   let isFooterDisplayed = true;
   let isSidebarDisplayed = false;
+  let sidebarVariant = "default";
   let searchCollectionUuid = null;
   let supportsThemeToggle = true;
   const headerProperty = websiteProperties.find(
@@ -2034,6 +2159,12 @@ function parseWebsiteProperties(properties) {
   if (sidebarProperty) {
     isSidebarDisplayed = sidebarProperty.content === "Yes";
   }
+  const sidebarVariantProperty = websiteProperties.find(
+    (property) => property.label === "sidebar-variant"
+  )?.values[0];
+  if (sidebarVariantProperty) {
+    sidebarVariant = sidebarVariantProperty.content;
+  }
   const collectionSearchProperty = websiteProperties.find(
     (property) => property.label === "search-collection"
   )?.values[0];
@@ -2061,6 +2192,7 @@ function parseWebsiteProperties(properties) {
     isHeaderProjectDisplayed,
     isFooterDisplayed,
     isSidebarDisplayed,
+    sidebarVariant,
     supportsThemeToggle,
     searchCollectionUuid,
     logoUrl: logoUuid !== null ? `https://ochre.lib.uchicago.edu/ochre?uuid=${logoUuid}&load` : null

package/dist/index.d.cts

@@ -430,6 +430,7 @@ type WebsiteProperties = {
     isHeaderProjectDisplayed: boolean;
     isFooterDisplayed: boolean;
     isSidebarDisplayed: boolean;
+    sidebarVariant: "default" | "inline";
     supportsThemeToggle: boolean;
     searchCollectionUuid: string | null;
     logoUrl: string | null;
@@ -438,7 +439,7 @@ type Webpage = {
     title: string;
     slug: string;
     properties: WebpageProperties;
-    elements: Array<WebElement>;
+    blocks: Array<Block>;
     webpages: Array<Webpage>;
 };
 /**
@@ -488,6 +489,7 @@ type WebElementComponent = {
     blogId: string;
 } | {
     component: "button";
+    variant: "default" | "transparent";
     href: string;
     isExternal: boolean;
     label: string;
@@ -505,10 +507,10 @@ type WebElementComponent = {
     images: Array<WebImage>;
     variant: "default" | "carousel";
     carouselOptions: {
-        secondsPerImage: number | null;
-        isFullWidth: boolean | null;
-        isFullHeight: boolean | null;
+        secondsPerImage: number;
     } | null;
+    isFullWidth: boolean;
+    isFullHeight: boolean;
     imageQuality: "high" | "low";
     captionSource: "name" | "abbreviation" | "description";
     captionLayout: "top" | "bottom" | "suppress";
@@ -570,6 +572,34 @@ type Style = {
     label: string;
     value: string;
 };
+/**
+ * Represents a block of vertical or horizontal content alignment
+ */
+type Block = {
+    uuid: string;
+    layout: "vertical" | "horizontal" | "grid";
+    blocks: Array<Block>;
+    elements: Array<WebElement>;
+    properties: {
+        /**
+         * valid `gridTemplateColumns` or `gridTemplateRows` CSS property value
+         */
+        spacing: string;
+        /**
+         * `gap` CSS property value
+         */
+        gap: "none" | "small" | "medium" | "large";
+        /**
+         * `align-items` CSS property value
+         */
+        alignItems: "stretch" | "start" | "center" | "end" | "space-between";
+        /**
+         * `justify-content` CSS property value
+         */
+        justifyContent: "stretch" | "start" | "center" | "end" | "space-between";
+    };
+    cssStyles: Array<Style>;
+};
 
 /**
  * Fetches and parses a bibliography from the OCHRE API
@@ -1813,4 +1843,4 @@ declare function trimEndLineBreaks(string: string): string;
  */
 declare function parseStringContent(content: OchreStringContent, language?: string): string;
 
-export { type Bibliography, type Concept, type Context, type ContextItem, type ContextNode, type Coordinates, type Data, type Document, type Event, type Footnote, type Gallery, type Identification, type Image, type ImageMap, type ImageMapArea, type Interpretation, type License, type Link, type Metadata, type NestedConcept, type NestedResource, type NestedSpatialUnit, type Note, type Observation, type Period, type Person, type Property, type PropertyValue, type PropertyValueType, type Resource, type Set, type SpatialUnit, type Style, type Tree, type WebElement, type WebElementComponent, type WebImage, type Webpage, type WebpageProperties, type Website, type WebsiteProperties, fetchBibliography, fetchByUuid, fetchConcept, fetchGallery, fetchPeriod, fetchResource, fetchSet, fetchSpatialUnit, fetchTree, fetchWebsite, filterProperties, getAllPropertyLabels, getPropertyByLabel, getPropertyValueByLabel, getPropertyValuesByLabel, parseBibliographies, parseBibliography, parseConcept, parseConcepts, parseContext, parseCoordinates, parseDocument, parseEmailAndUrl, parseEvents, parseFakeString, parseIdentification, parseImage, parseImageMap, parseInterpretations, parseLanguages, parseLicense, parseLink, parseLinks, parseMetadata, parseNotes, parseObservation, parseObservations, parsePeriod, parsePeriods, parsePerson, parsePersons, parseProperties, parseResource, parseResources, parseSet, parseSpatialUnit, parseSpatialUnits, parseStringContent, parseStringDocumentItem, parseStringItem, parseTree, parseWebsite, trimEndLineBreaks };
+export { type Bibliography, type Block, type Concept, type Context, type ContextItem, type ContextNode, type Coordinates, type Data, type Document, type Event, type Footnote, type Gallery, type Identification, type Image, type ImageMap, type ImageMapArea, type Interpretation, type License, type Link, type Metadata, type NestedConcept, type NestedResource, type NestedSpatialUnit, type Note, type Observation, type Period, type Person, type Property, type PropertyValue, type PropertyValueType, type Resource, type Set, type SpatialUnit, type Style, type Tree, type WebElement, type WebElementComponent, type WebImage, type Webpage, type WebpageProperties, type Website, type WebsiteProperties, fetchBibliography, fetchByUuid, fetchConcept, fetchGallery, fetchPeriod, fetchResource, fetchSet, fetchSpatialUnit, fetchTree, fetchWebsite, filterProperties, getAllPropertyLabels, getPropertyByLabel, getPropertyValueByLabel, getPropertyValuesByLabel, parseBibliographies, parseBibliography, parseConcept, parseConcepts, parseContext, parseCoordinates, parseDocument, parseEmailAndUrl, parseEvents, parseFakeString, parseIdentification, parseImage, parseImageMap, parseInterpretations, parseLanguages, parseLicense, parseLink, parseLinks, parseMetadata, parseNotes, parseObservation, parseObservations, parsePeriod, parsePeriods, parsePerson, parsePersons, parseProperties, parseResource, parseResources, parseSet, parseSpatialUnit, parseSpatialUnits, parseStringContent, parseStringDocumentItem, parseStringItem, parseTree, parseWebsite, trimEndLineBreaks };

package/dist/index.d.ts

@@ -430,6 +430,7 @@ type WebsiteProperties = {
     isHeaderProjectDisplayed: boolean;
     isFooterDisplayed: boolean;
     isSidebarDisplayed: boolean;
+    sidebarVariant: "default" | "inline";
     supportsThemeToggle: boolean;
     searchCollectionUuid: string | null;
     logoUrl: string | null;
@@ -438,7 +439,7 @@ type Webpage = {
     title: string;
     slug: string;
     properties: WebpageProperties;
-    elements: Array<WebElement>;
+    blocks: Array<Block>;
     webpages: Array<Webpage>;
 };
 /**
@@ -488,6 +489,7 @@ type WebElementComponent = {
     blogId: string;
 } | {
     component: "button";
+    variant: "default" | "transparent";
     href: string;
     isExternal: boolean;
     label: string;
@@ -505,10 +507,10 @@ type WebElementComponent = {
     images: Array<WebImage>;
     variant: "default" | "carousel";
     carouselOptions: {
-        secondsPerImage: number | null;
-        isFullWidth: boolean | null;
-        isFullHeight: boolean | null;
+        secondsPerImage: number;
     } | null;
+    isFullWidth: boolean;
+    isFullHeight: boolean;
     imageQuality: "high" | "low";
     captionSource: "name" | "abbreviation" | "description";
     captionLayout: "top" | "bottom" | "suppress";
@@ -570,6 +572,34 @@ type Style = {
     label: string;
     value: string;
 };
+/**
+ * Represents a block of vertical or horizontal content alignment
+ */
+type Block = {
+    uuid: string;
+    layout: "vertical" | "horizontal" | "grid";
+    blocks: Array<Block>;
+    elements: Array<WebElement>;
+    properties: {
+        /**
+         * valid `gridTemplateColumns` or `gridTemplateRows` CSS property value
+         */
+        spacing: string;
+        /**
+         * `gap` CSS property value
+         */
+        gap: "none" | "small" | "medium" | "large";
+        /**
+         * `align-items` CSS property value
+         */
+        alignItems: "stretch" | "start" | "center" | "end" | "space-between";
+        /**
+         * `justify-content` CSS property value
+         */
+        justifyContent: "stretch" | "start" | "center" | "end" | "space-between";
+    };
+    cssStyles: Array<Style>;
+};
 
 /**
  * Fetches and parses a bibliography from the OCHRE API
@@ -1813,4 +1843,4 @@ declare function trimEndLineBreaks(string: string): string;
  */
 declare function parseStringContent(content: OchreStringContent, language?: string): string;
 
-export { type Bibliography, type Concept, type Context, type ContextItem, type ContextNode, type Coordinates, type Data, type Document, type Event, type Footnote, type Gallery, type Identification, type Image, type ImageMap, type ImageMapArea, type Interpretation, type License, type Link, type Metadata, type NestedConcept, type NestedResource, type NestedSpatialUnit, type Note, type Observation, type Period, type Person, type Property, type PropertyValue, type PropertyValueType, type Resource, type Set, type SpatialUnit, type Style, type Tree, type WebElement, type WebElementComponent, type WebImage, type Webpage, type WebpageProperties, type Website, type WebsiteProperties, fetchBibliography, fetchByUuid, fetchConcept, fetchGallery, fetchPeriod, fetchResource, fetchSet, fetchSpatialUnit, fetchTree, fetchWebsite, filterProperties, getAllPropertyLabels, getPropertyByLabel, getPropertyValueByLabel, getPropertyValuesByLabel, parseBibliographies, parseBibliography, parseConcept, parseConcepts, parseContext, parseCoordinates, parseDocument, parseEmailAndUrl, parseEvents, parseFakeString, parseIdentification, parseImage, parseImageMap, parseInterpretations, parseLanguages, parseLicense, parseLink, parseLinks, parseMetadata, parseNotes, parseObservation, parseObservations, parsePeriod, parsePeriods, parsePerson, parsePersons, parseProperties, parseResource, parseResources, parseSet, parseSpatialUnit, parseSpatialUnits, parseStringContent, parseStringDocumentItem, parseStringItem, parseTree, parseWebsite, trimEndLineBreaks };
+export { type Bibliography, type Block, type Concept, type Context, type ContextItem, type ContextNode, type Coordinates, type Data, type Document, type Event, type Footnote, type Gallery, type Identification, type Image, type ImageMap, type ImageMapArea, type Interpretation, type License, type Link, type Metadata, type NestedConcept, type NestedResource, type NestedSpatialUnit, type Note, type Observation, type Period, type Person, type Property, type PropertyValue, type PropertyValueType, type Resource, type Set, type SpatialUnit, type Style, type Tree, type WebElement, type WebElementComponent, type WebImage, type Webpage, type WebpageProperties, type Website, type WebsiteProperties, fetchBibliography, fetchByUuid, fetchConcept, fetchGallery, fetchPeriod, fetchResource, fetchSet, fetchSpatialUnit, fetchTree, fetchWebsite, filterProperties, getAllPropertyLabels, getPropertyByLabel, getPropertyValueByLabel, getPropertyValuesByLabel, parseBibliographies, parseBibliography, parseConcept, parseConcepts, parseContext, parseCoordinates, parseDocument, parseEmailAndUrl, parseEvents, parseFakeString, parseIdentification, parseImage, parseImageMap, parseInterpretations, parseLanguages, parseLicense, parseLink, parseLinks, parseMetadata, parseNotes, parseObservation, parseObservations, parsePeriod, parsePeriods, parsePerson, parsePersons, parseProperties, parseResource, parseResources, parseSet, parseSpatialUnit, parseSpatialUnits, parseStringContent, parseStringDocumentItem, parseStringItem, parseTree, parseWebsite, trimEndLineBreaks };

package/dist/index.js

@@ -1251,20 +1251,34 @@ var parseWebpageResources = async (webpageResources, type) => {
       (property) => property.label === "presentation" && property.values[0].content === type
     );
     if (!resourceProperty) continue;
-    if (type === "element") {
-      const element = await parseWebElement(
-        resource,
-        resourceProperty.properties
-      );
-      returnElements.push(
-        element
-      );
-    } else {
-      const webpage = await parseWebpage(resource);
-      if (webpage) {
+    switch (type) {
+      case "element": {
+        const element = await parseWebElement(
+          resource,
+          resourceProperty.properties
+        );
         returnElements.push(
-          webpage
+          element
         );
+        break;
+      }
+      case "page": {
+        const webpage = await parseWebpage(resource);
+        if (webpage) {
+          returnElements.push(
+            webpage
+          );
+        }
+        break;
+      }
+      case "block": {
+        const block = await parseBlock(resource);
+        if (block) {
+          returnElements.push(
+            block
+          );
+        }
+        break;
       }
     }
   }
@@ -1360,6 +1374,13 @@ async function parseWebElementProperties(componentProperty, elementResource) {
       break;
     }
     case "button": {
+      let variant = getPropertyValueByLabel(
+        componentProperty.properties,
+        "variant"
+      );
+      if (variant === null) {
+        variant = "default";
+      }
       let isExternal = false;
       let href = getPropertyValueByLabel(
         componentProperty.properties,
@@ -1375,6 +1396,7 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           isExternal = true;
         }
       }
+      properties.variant = variant;
       properties.href = href;
       properties.isExternal = isExternal;
       properties.label = ["string", "number", "boolean"].includes(
@@ -1449,6 +1471,22 @@ async function parseWebElementProperties(componentProperty, elementResource) {
       if (captionLayout === null) {
         captionLayout = "bottom";
       }
+      let isFullWidth = true;
+      const isFullWidthProperty = getPropertyValueByLabel(
+        componentProperty.properties,
+        "is-full-width"
+      );
+      if (isFullWidthProperty !== null) {
+        isFullWidth = isFullWidthProperty === "Yes";
+      }
+      let isFullHeight = true;
+      const isFullHeightProperty = getPropertyValueByLabel(
+        componentProperty.properties,
+        "is-full-height"
+      );
+      if (isFullHeightProperty !== null) {
+        isFullHeight = isFullHeightProperty === "Yes";
+      }
       let imageQuality = getPropertyValueByLabel(
         componentProperty.properties,
         "image-quality"
@@ -1477,8 +1515,6 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           "variant"
         );
         let secondsPerImage = 5;
-        let isFullWidth = false;
-        let isFullHeight = false;
         if (variantProperty && variantProperty.values[0].content === "carousel") {
           const secondsPerImageProperty = getPropertyValueByLabel(
             variantProperty.properties,
@@ -1487,30 +1523,16 @@ async function parseWebElementProperties(componentProperty, elementResource) {
           if (secondsPerImageProperty !== null) {
             secondsPerImage = Number.parseFloat(secondsPerImageProperty);
           }
-          const isFullWidthProperty = getPropertyValueByLabel(
-            variantProperty.properties,
-            "is-full-width"
-          );
-          if (isFullWidthProperty !== null) {
-            isFullWidth = isFullWidthProperty === "Yes";
-          }
-          const isFullHeightProperty = getPropertyValueByLabel(
-            variantProperty.properties,
-            "is-full-height"
-          );
-          if (isFullHeightProperty !== null) {
-            isFullHeight = isFullHeightProperty === "Yes";
-          }
         }
         carouselOptions = {
-          secondsPerImage,
-          isFullWidth,
-          isFullHeight
+          secondsPerImage
         };
       }
       properties.images = images;
       properties.variant = variant;
       properties.carouselOptions = carouselOptions;
+      properties.isFullWidth = isFullWidth;
+      properties.isFullHeight = isFullHeight;
       properties.imageQuality = imageQuality;
       properties.captionLayout = captionLayout;
       properties.captionSource = captionSource;
@@ -1800,10 +1822,33 @@ async function parseWebpage(webpageResource) {
   const imageLink = links.find(
     (link) => link.type === "image" || link.type === "IIIF"
   );
-  const elements = webpageResource.resource ? await parseWebpageResources(
+  const blocks = webpageResource.resource ? await parseWebpageResources(
     Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
-    "element"
+    "block"
   ) : [];
+  if (blocks.length === 0) {
+    const defaultBlock = {
+      uuid: webpageResource.uuid,
+      layout: "vertical",
+      blocks: [],
+      elements: [],
+      properties: {
+        spacing: "default",
+        gap: "none",
+        alignItems: "stretch",
+        justifyContent: "stretch"
+      },
+      cssStyles: []
+    };
+    blocks.push(defaultBlock);
+    const elements = webpageResource.resource ? await parseWebpageResources(
+      Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
+      "element"
+    ) : [];
+    if (elements.length > 0) {
+      defaultBlock.elements = elements;
+    }
+  }
   const webpages = webpageResource.resource ? await parseWebpageResources(
     Array.isArray(webpageResource.resource) ? webpageResource.resource : [webpageResource.resource],
     "page"
@@ -1856,7 +1901,7 @@ async function parseWebpage(webpageResource) {
   return {
     title: identification.label,
     slug,
-    elements,
+    blocks,
     properties: {
       displayedInHeader,
       width,
@@ -1879,6 +1924,85 @@ async function parseWebpages(webpageResources) {
   }
   return returnPages;
 }
+async function parseBlock(blockResource) {
+  const returnBlock = {
+    uuid: blockResource.uuid,
+    layout: "vertical",
+    blocks: [],
+    elements: [],
+    properties: {
+      spacing: "default",
+      gap: "none",
+      alignItems: "stretch",
+      justifyContent: "stretch"
+    },
+    cssStyles: []
+  };
+  const blockProperties = blockResource.properties ? parseProperties(
+    Array.isArray(blockResource.properties.property) ? blockResource.properties.property : [blockResource.properties.property]
+  ) : [];
+  const blockMainProperties = blockProperties.find(
+    (property) => property.label === "presentation" && property.values[0]?.content === "block"
+  )?.properties;
+  if (blockMainProperties) {
+    const layoutProperty = blockMainProperties.find(
+      (property) => property.label === "layout"
+    )?.values[0];
+    if (layoutProperty) {
+      returnBlock.layout = layoutProperty.content;
+    }
+    const spacingProperty = blockMainProperties.find(
+      (property) => property.label === "spacing"
+    )?.values[0];
+    if (spacingProperty) {
+      returnBlock.properties.spacing = spacingProperty.content;
+    }
+    const gapProperty = blockMainProperties.find(
+      (property) => property.label === "gap"
+    )?.values[0];
+    if (gapProperty) {
+      returnBlock.properties.gap = gapProperty.content;
+    }
+    const alignItemsProperty = blockMainProperties.find(
+      (property) => property.label === "align-items"
+    )?.values[0];
+    if (alignItemsProperty) {
+      returnBlock.properties.alignItems = alignItemsProperty.content;
+    }
+    const justifyContentProperty = blockMainProperties.find(
+      (property) => property.label === "justify-content"
+    )?.values[0];
+    if (justifyContentProperty) {
+      returnBlock.properties.justifyContent = justifyContentProperty.content;
+    }
+  }
+  const blockBlocks = blockResource.resource ? await parseWebpageResources(
+    Array.isArray(blockResource.resource) ? blockResource.resource : [blockResource.resource],
+    "block"
+  ) : [];
+  for (const block of blockBlocks) {
+    returnBlock.blocks.push(block);
+  }
+  const blockElements = blockResource.resource ? await parseWebpageResources(
+    Array.isArray(blockResource.resource) ? blockResource.resource : [blockResource.resource],
+    "element"
+  ) : [];
+  for (const element of blockElements) {
+    returnBlock.elements.push(element);
+  }
+  const blockCssStyles = blockProperties.find(
+    (property) => property.label === "presentation" && property.values[0]?.content === "css"
+  )?.properties;
+  if (blockCssStyles) {
+    for (const property of blockCssStyles) {
+      returnBlock.cssStyles.push({
+        label: property.label,
+        value: property.values[0].content
+      });
+    }
+  }
+  return returnBlock;
+}
 function parseWebsiteProperties(properties) {
   const mainProperties = parseProperties(properties);
   const websiteProperties = mainProperties.find(
@@ -1918,6 +2042,7 @@ function parseWebsiteProperties(properties) {
   let isHeaderProjectDisplayed = true;
   let isFooterDisplayed = true;
   let isSidebarDisplayed = false;
+  let sidebarVariant = "default";
   let searchCollectionUuid = null;
   let supportsThemeToggle = true;
   const headerProperty = websiteProperties.find(
@@ -1956,6 +2081,12 @@ function parseWebsiteProperties(properties) {
   if (sidebarProperty) {
     isSidebarDisplayed = sidebarProperty.content === "Yes";
   }
+  const sidebarVariantProperty = websiteProperties.find(
+    (property) => property.label === "sidebar-variant"
+  )?.values[0];
+  if (sidebarVariantProperty) {
+    sidebarVariant = sidebarVariantProperty.content;
+  }
   const collectionSearchProperty = websiteProperties.find(
     (property) => property.label === "search-collection"
   )?.values[0];
@@ -1983,6 +2114,7 @@ function parseWebsiteProperties(properties) {
     isHeaderProjectDisplayed,
     isFooterDisplayed,
     isSidebarDisplayed,
+    sidebarVariant,
     supportsThemeToggle,
     searchCollectionUuid,
     logoUrl: logoUuid !== null ? `https://ochre.lib.uchicago.edu/ochre?uuid=${logoUuid}&load` : null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digitalculture/ochre-sdk",
-  "version": "0.3.7",
+  "version": "0.4.0",
   "type": "module",
   "license": "MIT",
   "description": "Node.js library for working with OCHRE (Online Cultural and Historical Research Environment) data",
@@ -45,13 +45,13 @@
   },
   "devDependencies": {
     "@antfu/eslint-config": "^4.3.0",
-    "@arethetypeswrong/cli": "^0.17.3",
+    "@arethetypeswrong/cli": "^0.17.4",
     "@changesets/cli": "^2.28.1",
     "@total-typescript/ts-reset": "^0.6.1",
-    "@types/node": "^22.13.4",
-    "eslint": "^9.20.1",
+    "@types/node": "^22.13.5",
+    "eslint": "^9.21.0",
     "eslint-plugin-unused-imports": "^4.1.4",
-    "prettier": "^3.5.1",
+    "prettier": "^3.5.2",
     "tsup": "^8.3.6",
     "typescript": "^5.7.3",
     "vitest": "^3.0.6"