Composition / API
foldkit-composition/foldkit
foldkit-composition/foldkit: a Document drawn as ordinary Foldkit Html.
A Renderer is one function per Block of a Catalog, from the Block's decoded
props and its Regions' drawn children to Html. It adds no reconciler, no
component runtime and no per-node state, and it takes the builder it is
given, so the same Renderer draws a page in the browser and inside a
foldkit-ssr static region on the server.
Production and the editor's canvas use the same Renderer. Edit mode adds two
things: each node is wrapped in a display: contents element that carries
data-composition-node, so an editor can find the node under the pointer,
and a text prop a view draws with field is marked, so it can be edited in place.
Namespaces
Renderer | |
Stateful | A page's stateful nodes, as a placed collection holds them: one Bundle per node, keyed by its id, the parent's own Model. |
Functions
fieldName | The value FIELD_ATTRIBUTE holds for a node's prop: JSON, so no id is split on a separator. |
fieldOf | The node and prop a field's attribute names; none for a value that names none. |
Values
DROP_ATTRIBUTE | In edit mode, on the node a drop is aimed at, holding where: before, inside or after; or inside on the empty Region it is aimed at. |
FIELD_ATTRIBUTE | In edit mode, on a text prop's element, naming its node and prop: see fieldOf. |
HIDDEN_ATTRIBUTE | In edit mode, on a node whose when does not hold in the context drawn for. |
MARK_ATTRIBUTE | In edit mode, selected or hovered, for a stylesheet to outline. One attribute, so a node both hovered and selected is marked selected, whatever order a… |
NODE_ATTRIBUTE | The attribute that marks a node's element in edit mode. |
PAGE_CONTAINER | The container a page is drawn in: an editor's frame, and a published page's root, are container: page / inline-size, so a look's container queries… |
PLACEHOLDER_ATTRIBUTE | The attribute on a placeholder, naming the Block it stands for. |
REGION_ATTRIBUTE | In edit mode, on the element that stands for an empty Region, naming the Region. It is marked with its node's NODE_ATTRIBUTE too, so it is a part of that… |
Interfaces
Editing | The text prop an editor is editing in place, and its text when editing began: the field is drawn with that text until editing ends, so a redraw while the… |
RenderContext | What a Block's view is drawn from. |
StatefulCollection | What a placed collection (Page.each(...)) offers that Stateful uses. |
Types
Entries | One view per Block of the Catalog, by name: a Block without one is a type error. |
Mode | How a Document is drawn: as a visitor sees it, or on an editor's canvas. |
TextKey | The props of Props that are any text, which field draws: a prop that is exactly string. One of a few names ('plain' | 'accent'), a branded string or one… |