Import the viewer, replace one presentation
The first two examples import the existing
data viewer, declare one
template @match rule, and call base.inspect
with a loaded document. The viewer dispatches a cell's retained source
node through apply-templates @mode=cell. Its default rule
produces a td; a matching local rule replaces the whole cell.
The first sample loads a local copy of the
PokéAPI Pokémon list as JSON.
CEM-ML imports it into a retained CEM tree: each object's field is a
property node with a name attribute.
The inline rule matches a value whose parent property is named
name. Matching supplies node automatically.
The replacement cell contains an image plus the original name;
{$node} reuses its native value in the label and image alternative text.
dom::chain(node)
navigates through the property to its object, then finds the sibling
url property. .text().split("/").nth(6)
extracts the ID from that URL. Like Rust, nth is zero-based:
index 6 selects the seventh segment. Missing, null or short URLs leave
the name visible without an image. URL cells keep the imported view.
The inline source is an implicit module: imports and matching rules
are declarations; other content runs in source order. Neither
module nor body wrappers are needed, and a rule
selected only by matching needs no @name.
The separate stock rule demonstrates
a content override in inspect mode, keeping the default
cell. It matches /catalog/product/stock with trimmed text
0. Namespace checks and a direct parent() chain
keep a reference branch's stock ordinary. Five products show the
warning alongside the default presentation for available stock.
Table discovery, columns, sorting and row selection come from the base
viewer. Both files, pokemon-cells.json
and stock-cells.xml, have separate preview
cards below. Presentation leaves their retained source trees intact.
Missing values show ∅; repeated values, attributes and
direct row text keep the base viewer's grouped cells.
imgUrlRoot points to the Dream World SVG directory in
pokeapi-sprites@2.0.2.
Appending the Pokémon ID and .svg gives each image URL.
Images load from unpkg; the data files remain local. Pokémon imagery
belongs to The Pokémon Company; see the
upstream licence.
These examples consume complete retained trees, subject to the existing
import and query limits.
See also
Data tables and imported presentation aspects · HTTP data and Pokémon images · Table inspector controls
The child below uses cemt:apply_templates(label, "label")
to select its label rule from an expression. The function returns native
content, so the result can feed another query or attribute without a
string round trip. The parent's attribute hook adds one to the count,
including through the conditional attribute body. The child receives
that integer and the retained name subtree. Its text-only section
demonstrates a content hook.