Glossary

Every component and helper Clover exports. Place any component inside a Root<clover-root>, anywhere in your markup; one with nothing to show renders nothing.

Core components

Each has a page of its own. A primitive shows one IIIF property of the Manifest, or of the current Canvas with of="canvas". Given a value, it shows that instead, inside a Root<clover-root> or not.

Component	Description
`Root<clover-root>`	Loads a IIIF resource and holds its current view: every other component goes inside a Root and reads from it.
`Body<clover-body>`	The Root's current view, drawn by Canvas or by a renderer of your own, in a box with a height.
`Canvas<clover-canvas>`	The view that renders 2D images and video, with easy pan and zoom in an accessible and configurable interface.
`Timeline<clover-timeline>`	Clover's player for IIIF Presentation 4 Timelines: sound played with its artwork, title, captions and chapters, on its own or in a Root.
`Scene<clover-scene>`	Clover's 3D view for IIIF Presentation 4 Scenes: glTF models, lit and framed, turned and zoomed by pointer, key or control, on its own or in a Root.
`Items<clover-items>`	A sequence, its current item marked, as thumbnails in a slider, a list, a grid or masonry, or one item at a time.
`Panel<clover-panel>`	What a IIIF resource says about itself, in sections as tabs or an accordion, including sections of your own.
`Annotations<clover-annotations>`	Every annotation of a IIIF resource, by layer and by Canvas, to read, to find on the Canvas, and to hide from it.
`Collection<clover-collection>`	The Collection a Manifest is in, described and its members listed, and a menu of its members to move between them.
`Contents<clover-contents>`	A Manifest's table of contents from its Ranges, the current entry marked, each entry going to its Canvas.
`Search<clover-search>`	IIIF Content Search of the Root's Manifest, version 1 or 2: a field, then the hits by Canvas with the words around them, drawn on the Canvas.
`Transcript<clover-transcript>`	The words of the recording or page in view: its captions as text, the cue playing marked, or its transcript as plain text.
`Download<clover-download>`	The rendering of the page in view and of the Manifest, a PDF, a text or a full-size file, as links in two groups.
`Map<clover-map>`	Where a IIIF resource is, on a map: its navPlace places, and its georeferenced images laid over the ground.
Primitives
`Label<clover-label>`	The resource's label, or the current Canvas's, in the defined language, in the element you choose.
`Thumbnail<clover-thumbnail>`	A small picture of the resource, or of the current Canvas, as an image named by its label.
`Summary<clover-summary>`	The summary of the resource, or of the current Canvas, cut to five lines with Read more when it runs longer.
`Metadata<clover-metadata>`	The metadata of the resource, or of the current Canvas, as a description list of labels and values in the defined language.
`RequiredStatement<clover-required-statement>`	The required statement of the resource, or of the current Canvas, such as an attribution, as a label and value in the defined language.
`Rights<clover-rights>`	The rights of the resource, or of the current Canvas, as a link to its license or rights statement.
`Homepage<clover-homepage>`	A IIIF resource's homepage, the web pages about it, as a list of links, each named by its label.
`SeeAlso<clover-see-also>`	A IIIF resource's seeAlso, the machine-readable descriptions of it elsewhere, as a list of links.
`Rendering<clover-rendering>`	A IIIF resource's rendering, the other formats it comes in, such as a PDF or a transcript, as a list of links.
`PartOf<clover-part-of>`	A IIIF resource's partOf, the Collections it belongs to, as a list of links, each named by its label.
`Id<clover-id>`	A IIIF resource's id, its own address, as a link: the Manifest's, or the current Canvas's, in a Root or given on its own.
`Provider<clover-provider>`	Who provided a IIIF resource: each provider's logo, and its name linked to its homepage. The components inside it read the provider they are drawn for.
`Logo<clover-logo>`	A IIIF provider's logo, each of the resource's providers' in turn, its alt text the provider's name; inside a Provider, that provider's.
`Value<clover-value>`	Any IIIF language map you hold, in the defined language, read strictly by its format as plain text, IIIF's HTML or Markdown.

UI components

These work with the core components. The ones templates share, PanelPane and Lightbox, are on Helpers.

Component	Description
`Previous<clover-previous>`, `Next<clover-next>`	Round buttons to the previous or next view (a spread, in a paged book), or with `of="members"` a Collection’s Manifest. Each shows disabled at an end.
`Position<clover-position>`	The current view’s place, “2 / 5”, or a member’s with `of="members"`.
`Status<clover-status>`	Clover’s loading mark, or what went wrong, announced to assistive technology. `loading={false}loading="false"` only announces it.
`Tab<clover-tab>`	One section of the Panel: its `value`, its `label`, and what it shows.
`About<clover-about>`	A Manifest’s descriptive and linking properties, among them its summary, thumbnail, metadata and provider.
`PanelToggle<clover-panel-toggle>`	Shows and hides the Panel. Inside a `Body<clover-body>`, it joins the Canvas’s controls.
`CollectionSelect<clover-collection-select>`	A menu of a Collection’s members; choosing one shows it.
`Split<clover-split>`, `SplitPane<clover-split-pane>`, `SplitHandle<clover-split-handle>`	Panes side by side, a `SplitHandle<clover-split-handle>` between them to resize them.
`ReadMore<clover-read-more>`	A “Read more” button for text of your own, as `Summary<clover-summary>` has.
`Tip<clover-tip>`	A control’s name and key, shown on hover and focus.

Helpers

The functions and hooks Clover is built with. Each is on Helpers.

IIIF resources

Helper	Description
`toPresentation4`	Upgrades a resource from an earlier Presentation version to Presentation 4.
`readAs`	Tells you whether a value is HTML, Markdown or plain text.
`toPlainText`	Turns a IIIF HTML value into plain text.
`localize`	Picks a language map’s text in the defined language.
`thumbnailSource`	Finds a Manifest’s, Collection’s or Canvas’s thumbnail.
`stillSource`	Finds a picture to stand in for a Canvas at the size it’s drawn.
`regionSource`	Finds an image of one region of a Canvas.
`resolveThumbnail`	Turns a source into an image URL its `info.json` allows.
`buildContentState`	Writes a content state annotation for a Canvas, a region or a time.
`encodeContentState`	Encodes a content state annotation for a link.
`decodeContentState`	Decodes an `iiif-content` value back into its annotation.
`groupViews`	Groups a Manifest’s Canvases into the views the Viewer shows.
`resolveBehavior`	Reads the `behavior` that lays out a sequence.
`resolveDirection`	Reads a `viewingDirectionviewing-direction`.

Maps

Helper	Description
`hasMapData`	Tells you whether a Manifest has anything to put on a Map.
`navPlaceOf`	Gathers every `navPlace.navPlace` into one GeoJSON FeatureCollection.
`georeferencesOf`	Gathers the georeferenced images of a Manifest’s Canvases.
`readGeoreference`	Reads one Georeference Extension annotation as an image to lay over a Map.
`boundsOf`	The box that holds places and georeferenced images.
`cornersOf`	Where a georeferenced image’s corners land.
`affineTransform`	The transform from a georeference’s image pixels to longitude and latitude.
`setMapWorkerUrl`	Serves MapLibre’s worker from an address of your own.

Hooks

Hook	Description
`useStatus()root.clover.status()`	Whether the Root is loading, ready or failed.
`useManifest()root.clover.manifest()`	The Manifest, in Presentation 4.
`useSequence()root.clover.sequence()`	The Canvases, the views and the viewing direction.
`useVisibleCanvases()root.clover.visibleCanvases()`	The Canvases of the current view.
`useActiveCanvas()root.clover.activeCanvas()`	The current Canvas.
`useNavigation()root.clover.navigation()`	Where the view is, and the steps to the others.
`useAnnotationCollection()`	The content’s annotations, walked as one whole.
`useAnnotationPages()root.clover.annotationPages()`	Each AnnotationPage, the Manifest’s and the Root’s own, with its annotations.
`useLocalized(value)`	A language map’s text, in the Root’s language.
`useT()`	The predefined strings, in Clover’s interface language.
`useLangOf()`	A predefined string’s `lang`, where it isn’t the page’s.
`usePanelSections(names)`	Which of the Panel’s default sections the resource has data for.
`useCloverSelector(select)`	Any value from the Root’s state.
`useClover()root.clover`	The Root’s state and actions.
`useUniqueId()`	An id unique on the page.

Templates

Helper	Description
`usePanelPane`	Keeps the Panel’s state, beside the Body or over it.
`PanelPane`	Draws the Panel in a SplitPane of its own.
`useWideEnough`	Tells you whether an element is wide enough.
`BESIDE_REM`, `PAGE_MIN`, `PANEL_MIN`	The room the Body and the Panel need.
`useDrawer`	Gives a SplitPane of your own the Panel’s behavior.
`useFollowFocus`	Moves focus with a button that’s drawn somewhere new.
`preloadDrag`	Starts loading the code that drags a SplitPane closed.
`Lightbox`	The dialog Gallery opens for one cell of its grid.
`preloadLightbox`	Starts loading the Lightbox’s code.
`useGivenAnnotations`	The annotations given to the Root as an AnnotationPage.