Skip to Content
This page documents Clover 3.x, @samvera/clover-iiif, the earlier version of Clover, kept here for reference. These docs lead with Clover 4: Get started.

PartOf

A containing resource that includes the resource that has the partOf property.

partOf ↗ 
<PartOf
  partOf={[
    {
      id: "https://api.dc.library.northwestern.edu/api/v2/collections/c373ecd2-2c45-45f2-9f9e-52dc244870bd?as=iiif",
      type: "Collection",
      label: {
        none: ["Commedia dell'Arte: The Masks of Antonio Fava"],
      },
      summary: {
        none: [
          "The Commedia dell'Arte, the famous improvisational theatre style born in Renaissance Italy, remains a major influence in today's theatre. Antonio Fava is an actor, comedian, author, director, musician, mask maker and Internationally renowned Maestro of Commedia dell'Arte.  The masks in this collection are all stored in the Charles Deering McCormick Library of Special Collections. Fava's book The Comic Mask in the Commedia dell'Arte is published by Northwestern University Press.",
        ],
      },
    },
  ]}
/>

Usage

React

import { PartOf } from "@samvera/clover-iiif/primitives";
 
const CustomPartOf = ({ partOf }) => {
  return <PartOf partOf={partOf} />;
};
 
export default CustomPartOf;

API Reference

PropTypeDefaultRequired
asol, ulul—
partOfpartOf —Yes
classNamestring, undefined——
styleCSSProperties, undefined——
langstring, undefined——
titlestring, undefined——
data-*string, undefined——
aria-*AriaAttributes, undefined——

Custom Element

The PartOf component can be rendered as either ol or ul elements. The default is ul.

<PartOf
  partOf={[
    {
      id: "https://digital.lib.utk.edu/assemble/collection/collections/rfta",
      type: "Collection",
      label: { en: ["Rising From the Ashes Oral Histories"] },
    },
    {
      id: "https://digital.lib.utk.edu/assemble/collection/collections/rftacuratedart",
      type: "Collection",
      label: {
        en: [
          "Rising from the Ashes: The Chimney Tops 2 Wildfires in Memory and Art",
        ],
      },
    },
  ]}
  as="ol"
/>