Welcome to Vanilla Breeze
This bell pulls live notifications from /go/notify/messages — the same contract documented at /docs/concepts/service-contracts/. Static articles like this one are the no-JS / no-backend fallback.
content-lens
Universal switchable host for VB lens components. Wraps a set of light-DOM lens children and exposes reader controls to switch which one is active.
Overview
The <content-lens> component is the universal host for VB's lens family. It wraps any number of lens children (each carrying a data-lens-name attribute) and renders a reader-facing radio control so visitors can switch between views over the same underlying data.
Without JavaScript, every lens child is rendered stacked — the page remains usable.
Switchable lens host with shared data source
<content-lens data-lens-default="trust" data-lens-src="/pages.json"> <time-index data-lens-name="time">…</time-index> <author-index data-lens-name="author"></author-index> <topic-map data-lens-name="topic"></topic-map> <trust-filter data-lens-name="trust"></trust-filter></content-lens>Attributes
| Attribute | Type | Default | Description |
|---|---|---|---|
data-lens-default | string | first child | Lens to activate on first load |
data-lens-controls | "on" | "off" | "on" | Render the reader chip group |
data-lens-src | string | — | Shared data URL forwarded to every child unless the child sets its own |
data-lens-storage | string | pathname | Key for sessionStorage so the reader's last choice persists per page |
data-active-lens | string | computed | Reflects the active lens (state, not config) |
Events
| Event | Detail | When |
|---|---|---|
content-lens:change | { lens: string } | Reader switches lenses (or programmatic setLens()) |
Reader sovereignty
The lens family follows VB's reader-sovereignty principle: the author defines the exposed view, the reader can always reframe. <content-lens> exposes the radio chips by default; authors who want to lock to a single view can set data-lens-controls="off", but the underlying data is still discoverable via the shared data-lens-src.