# LanternUI v0.8.2 - Table of Contents

> Native Phoenix LiveView UI components — server-rendered SVG charts and more, themeable via CSS variables (Fluxon-compatible). No React, no JS chart libraries.

## Pages

- [LanternUI](readme.md)
- [Changelog](changelog.md)
- [Chat Kit](chat-kit.md)
- [Support helpers](support-helpers.md)
- [Compact type + grey roles](scale.md)
- [Library behaviours](behaviours.md)
- [Dense-app primitives](dense-app.md)
- [Recipes](recipes.md)

## Modules

- [LanternUI](LanternUI.md): LanternUI — a dev-tool-native, open-source component system for Phoenix LiveView.
- [LanternUI.Charts](LanternUI.Charts.md): Native LiveView chart components — server-rendered SVG, minimal JS.
- [LanternUI.Charts.Geometry](LanternUI.Charts.Geometry.md): Pure geometry helpers for LanternUI charts: linear scaling, "nice" axis ticks,
and SVG path building.
- [LanternUI.Class](LanternUI.Class.md): Class-string composition for LanternUI components.
- [LanternUI.Components.Accordion](LanternUI.Components.Accordion.md): Accordion — a WAI-ARIA APG accordion with the Fluxon 2.3.1 composition API.
- [LanternUI.Components.Alert](LanternUI.Components.Alert.md): Inline status alert. Mirrors Fluxon's `alert/1` surface.
- [LanternUI.Components.AlertDialog](LanternUI.Components.AlertDialog.md): Semantic confirmation dialog composed on the shared modal runtime.
- [LanternUI.Components.Autocomplete](LanternUI.Components.Autocomplete.md): A Fluxon-compatible autocomplete for static or LiveView-backed search.
- [LanternUI.Components.Avatar](LanternUI.Components.Avatar.md): Compact initials or fallback-content avatar. No Fluxon equivalent.
- [LanternUI.Components.Badge](LanternUI.Components.Badge.md): Status badge / pill. Mirrors Fluxon's `badge/1` surface.
- [LanternUI.Components.Breadcrumb](LanternUI.Components.Breadcrumb.md): Compact path breadcrumb — layout chrome + file/tree navigation.
- [LanternUI.Components.Button](LanternUI.Components.Button.md): Buttons — Fluxon-compatible API, shadcn-caliber styling.
- [LanternUI.Components.Calendar](LanternUI.Components.Calendar.md): A month-grid calendar primitive — the pane the date pickers compose.
- [LanternUI.Components.Card](LanternUI.Components.Card.md): A bounded panel: a titled surface that groups related content on a page.
- [LanternUI.Components.Checkbox](LanternUI.Components.Checkbox.md): Checkbox with label, description, and error states.
- [LanternUI.Components.ColorInput](LanternUI.Components.ColorInput.md): Native color picker paired with a hex readout. Mirrors Fluxon's `color_input/1`
and matches `Form.input` chrome (label, description, help, errors).
- [LanternUI.Components.Command](LanternUI.Components.Command.md): Command palette (⌘K dialog) — a modal combobox over a listbox of actions.
- [LanternUI.Components.DataTable](LanternUI.Components.DataTable.md): The admin data table — one Flop-driven table to replace the per-app
`admin_table` copies. API deliberately mirrors the enventory/skusync
baseline so swaps are mechanical.
- [LanternUI.Components.DatePicker](LanternUI.Components.DatePicker.md): Date/time pickers — Fluxon-compatible API composed from LanternUI primitives.
- [LanternUI.Components.DatetimeField](LanternUI.Components.DatetimeField.md): A segmented, directly-editable date/time field — the trigger primitive the
date pickers compose (HeroUI-style: `2 / 3 / 2026, 8:45 AM`).
- [LanternUI.Components.DescriptionList](LanternUI.Components.DescriptionList.md): Label/value pairs for a record's detail view — the `<dl>` every show page
hand-rolls.
- [LanternUI.Components.Dropdown](LanternUI.Components.Dropdown.md): Dropdown menu on the shared overlay runtime (anchored placement, focus
return, Escape/outside dismissal, arrow-key item navigation).
- [LanternUI.Components.EmptyState](LanternUI.Components.EmptyState.md): Quiet empty/zero state for tables, lists, and panels (a lantern-ui extension —
Fluxon has no equivalent).
- [LanternUI.Components.Form](LanternUI.Components.Form.md): Form chrome — `label`, `error`, and a Fluxon-compatible `input`.
- [LanternUI.Components.GroupBand](LanternUI.Components.GroupBand.md): Tinted full-width group header: chevron · glyph · name · count · trailing
action (the `+`).
- [LanternUI.Components.Icon](LanternUI.Components.Icon.md): A small, curated inline-SVG icon set (Heroicons outline paths, MIT).
- [LanternUI.Components.IconButton](LanternUI.Components.IconButton.md): Deprecated alias of `LanternUI.Components.Button.button/1` with `label` on an
`icon-*` size. Removed in 0.9.0.
- [LanternUI.Components.Inspector](LanternUI.Components.Inspector.md): Sticky right-rail inspector: optional section headings and a dense
`description_list`.
- [LanternUI.Components.Layout](LanternUI.Components.Layout.md): App shell — a full-width top bar (brand + inline context + actions) over a
fixed, collapsible left sidebar and a main content column. Breadcrumb chrome
is a first-class layout region (goprint-style sticky trail under the appbar),
not a per-app one-off.
- [LanternUI.Components.ListRow](LanternUI.Components.ListRow.md): Dense issue/inbox row: leading glyph · muted mono id · truncating title ·
meta · trailing. ~36px tall, hairline separators, hover tint.
- [LanternUI.Components.Loading](LanternUI.Components.Loading.md): Inline loading indicator — ring spinner or staggered dots. Mirrors Fluxon's
`loading/1` (server-render + CSS only, no JS).
- [LanternUI.Components.LogView](LanternUI.Components.LogView.md): Log view: monospace lines with a timestamp gutter and per-line severity.
No Fluxon equivalent. Pure presentational server render; no JS hook.
- [LanternUI.Components.Menu](LanternUI.Components.Menu.md): Menu button and menubar — no Fluxon equivalent. Clean-room implementations
of the WAI-ARIA APG menu-button and menubar patterns.
- [LanternUI.Components.Message](LanternUI.Components.Message.md): Chat message rows with optional avatar, metadata, and footer. No Fluxon
equivalent.
- [LanternUI.Components.MessageScroller](LanternUI.Components.MessageScroller.md): Accessible, follow-aware transcript viewport for chat messages. No Fluxon
equivalent.
- [LanternUI.Components.Meter](LanternUI.Components.Meter.md): Meter — a scalar measurement within a known range (`role="meter"`, WAI-ARIA
APG Meter pattern). Distinct from `progress`, which conveys task completion.
Pure server-render + CSS; no Fluxon equivalent.
- [LanternUI.Components.Modal](LanternUI.Components.Modal.md): Modal dialog on the shared overlay runtime (focus trap, Escape/outside
dismissal, `prefers-reduced-motion`-aware fade).
- [LanternUI.Components.Navlist](LanternUI.Components.Navlist.md): Vertical nav list — heading + links. Mirrors Fluxon's `navlist` / `navheading`
/ `navlink` surface (server-render only, no JS).
- [LanternUI.Components.Pagination](LanternUI.Components.Pagination.md): Pager + page-size control for paginated collections (a lantern-ui extension;
Fluxon has no pagination component — this replaces flop_phoenix's pager).
- [LanternUI.Components.Popover](LanternUI.Components.Popover.md): Click-triggered floating panel holding arbitrary content.
- [LanternUI.Components.Progress](LanternUI.Components.Progress.md): Progress bar or completion ring. Pure server-render + CSS.
- [LanternUI.Components.ProgressRing](LanternUI.Components.ProgressRing.md): Deprecated alias of `LanternUI.Components.Progress.progress/1` with
`shape="ring"`. Removed in 0.9.0.
- [LanternUI.Components.Radio](LanternUI.Components.Radio.md): Radio group for exclusive single selection. Mirrors Fluxon's `radio_group/1`
as `radio/1` so templates call `<.radio>`.
- [LanternUI.Components.ResourceList](LanternUI.Components.ResourceList.md): Resource list: a simple index of resources (projects, apps, databases,
buckets). No Fluxon equivalent. Pure presentational server render; no JS hook.
- [LanternUI.Components.ScrollArea](LanternUI.Components.ScrollArea.md): ScrollArea — themed scrollbar wrapper around native overflow scrolling. No
Fluxon equivalent.
- [LanternUI.Components.Segmented](LanternUI.Components.Segmented.md): Deprecated alias of `LanternUI.Components.Tabs.tabs_list/1` with
`variant="segmented"`. Removed in 0.9.0.
- [LanternUI.Components.Select](LanternUI.Components.Select.md): Select — mirrors Fluxon's `select/1` surface: a `FormField`-aware select with
a rich listbox path and a `native` fallback.
- [LanternUI.Components.Separator](LanternUI.Components.Separator.md): Visual divider — horizontal, vertical, or labeled. Mirrors Fluxon's
`separator/1`.
- [LanternUI.Components.Sheet](LanternUI.Components.Sheet.md): Slide-over panel (drawer) that enters from a screen edge. Mirrors Fluxon's
`sheet/1`, and shares the dialog open/close runtime with `modal/1`, so it's
driven by `LanternUI.open_dialog/1` / `close_dialog/1`.
- [LanternUI.Components.SidePanel](LanternUI.Components.SidePanel.md): Collapsible right-hand panel plus a toggle that remembers open/closed in
`localStorage`.
- [LanternUI.Components.Skeleton](LanternUI.Components.Skeleton.md): Decorative, CSS-only placeholder for content that is still loading.
- [LanternUI.Components.Slider](LanternUI.Components.Slider.md): Slider — a single-thumb range input built on the WAI-ARIA APG slider pattern.
No Fluxon equivalent; the form surface (`field`/`name`/`value`, label stack,
errors) mirrors LanternUI's other form controls.
- [LanternUI.Components.Stat](LanternUI.Components.Stat.md): Compact summary metrics extracted from the data table overview.
- [LanternUI.Components.StateGlyph](LanternUI.Components.StateGlyph.md): Status circles, priority signal bars, run-pipeline, sync, and source glyphs
for dense lists.
- [LanternUI.Components.Switch](LanternUI.Components.Switch.md): Toggle switch for binary settings. Mirrors Fluxon's `switch/1` surface.
- [LanternUI.Components.Table](LanternUI.Components.Table.md): Presentational table family — the styled substrate `data_table` composes.
Mirrors Fluxon's `table`/`table_head`/`table_body`/`table_row` surface.
- [LanternUI.Components.Tabs](LanternUI.Components.Tabs.md): Tabs — segmented tab list + panels. Mirrors Fluxon's `tabs`/`tabs_list`/
`tabs_panel` surface, server-driven: the active tab is an assign, tabs emit
`phx-click` (or `patch`/`navigate`) and panels render with `active`.
- [LanternUI.Components.Textarea](LanternUI.Components.Textarea.md): Multi-line text input. Mirrors Fluxon's `textarea/1` and matches `Form.input`
chrome (label, description, help, errors).
- [LanternUI.Components.Theme](LanternUI.Components.Theme.md): Runtime theming — persisted `--lantern-*` token overrides.
- [LanternUI.Components.Timeline](LanternUI.Components.Timeline.md): Timeline: a vertical sequence of events with a marker rail. No Fluxon
equivalent. Pure presentational server render; no JS hook.
- [LanternUI.Components.Toast](LanternUI.Components.Toast.md): Toast notification stack. Render once in a LiveView layout and push messages
with `LanternUI.send_toast/4`.
- [LanternUI.Components.Tooltip](LanternUI.Components.Tooltip.md): Tooltip - mirrors Fluxon's `tooltip/1` API with a small LiveView hook for
hover/focus timing and viewport-aware placement.

- [LanternUI.Components.Waterfall](LanternUI.Components.Waterfall.md): Waterfall: horizontal spans laid out on ONE shared time axis, with a ruler.
No Fluxon equivalent. Pure presentational server render; no JS hook.
- [LanternUI.Lint](LanternUI.Lint.md): Scan `.ex` / `.exs` / `.heex` for arbitrary Tailwind pixel values, hardcoded
palette colors, and page-local greys. Used by `mix lantern.lint`.

## Mix Tasks

- [mix lantern.lint](Mix.Tasks.Lantern.Lint.md): Scan `.ex` / `.exs` / `.heex` for values that bypass lantern's compact type
and grey scale. See `docs/scale.md`.

