Each example below opens in a live Shinylive editor where you can read the source, modify it, and see the result — all in the browser.
Counter
The three core bindings in one place: a reactive text child, a
reactive attribute (disabled), and a direct
onClick handler.
Old Faithful
The classic Shiny demo, rebuilt with irid. A controlled slider drives a histogram of Old Faithful eruption wait times.
Composing Components
Two counter components sharing state with a parent App.
reactiveVals are created in the parent and passed down as
arguments — no string IDs, no module namespacing. A derived
total reactive shows how shared state flows naturally
across the tree.
Temperature Converter
Two inputs representing the same value in different units, where
editing either one updates the other. Demonstrates how controlled inputs
and reactive() keep multiple views of the same state in
sync.
Todo List
A TodoMVC-style app where items are stored as a
reactiveVal holding a plain R list. Adding, toggling,
filtering, and removing items are ordinary functions that update that
list.
Dynamic Column Cards
Rebuilds the scenario from Shiny’s
dynamic-observers problem: pick a dataset, pick columns from it,
each column becomes a card with a close button, and removing a card puts
the column back in the dropdown. In Shiny this required nested
observers, ghost-input workarounds, and a memory leak fix. Here the
parent owns a reactiveVal and the dropdown and close
buttons both read and write it directly.
Optimistic Updates
irid applies controlled input changes immediately in the browser before the server round-trip completes. If the server responds with a different value, the browser reconciles automatically.
Shiny Modules
irid components work naturally inside standard Shiny modules. This
example embeds two independent counter modules side by side using
iridOutput() and renderIrid().