components/action-sheet.kmd
A context-anchored set of choices for the current task — slides up from
the bottom on phones, presented as a popover on larger screens — used
especially to confirm a destructive action with an explicit Cancel.
Distinct from a dialog (which interrupts for an unrelated decision) and
from a sheet (which holds content, not a choice list).
components/app-bars.kmd
Horizontal bar anchored at the top or bottom of an application
surface — holds page title, primary navigation actions, and
contextual actions.
components/avatar.kmd
The visual representation of a person or entity — photo with initials
and generic-icon fallbacks, a size scale, optional presence indicator —
plus the overlapping avatar group (face pile) with a "+N" overflow.
Modeled after Atlassian Avatar / AvatarGroup.
components/badges.kmd
Small visual marker attached to another element, signalling presence
of notifications, unread count, or status.
components/banners.kmd
Persistent informational bar at the top of a content region —
carries a message and 1-2 actions.
components/button-groups-expressive.kmd
Material 3 Expressive extension to base button groups (specs/components/buttons.kmd
§Button groups).
components/buttons.kmd
Button system — 7 variants (filled, tonal, outlined, text,
elevated, icon, FAB), button groups, segmented buttons.
components/cards.kmd
Card — a container of related content + actions, typically clickable
as a whole.
components/carousels-expressive.kmd
Material 3 Expressive extension to base Hero carousel (specs/components/
carousels.kmd).
components/carousels.kmd
Horizontally scrolling stack of items, optimized for browsing a
collection at a glance.
components/charts.kmd
Canonical chart primitives — line / bar / stacked-bar / area /
scatter / pie / donut / sparkline / graph (node-edge).
components/checkbox.kmd
Binary toggle in a multi-select context — user marks 0..N options.
Material parity (`/components/checkbox/overview`).
components/chips.kmd
Compact element representing an entity, attribute, or action —
smaller than a button and used in groups.
components/code-block.kmd
Code-block widget — the multi-framework code-tabs surface that hosts
per-format code samples behind a shared tab strip (HTML / Flutter /
Compose / SwiftUI / Web Components), with a per-tab copy button and a
transient "Copied" toast.
components/combobox.kmd
Typeahead input + dropdown of filtered options with optional async
loading, custom-value support, and multi-select variant.
components/data-table.kmd
Admin-grade tabular component — sortable columns, multi-select with
bulk actions, sticky header, pagination or virtualization, saved
column views, expandable rows, inline edit.
components/date-picker.kmd
Accessible date picker — typed ISO entry + calendar grid for single
date / date range / date+time.
components/dialogs.kmd
Modal interruption surface — basic dialog (centered modal), full-screen
dialog (mobile/onboarding), and alert dialog (destructive confirm).
Material parity (`/components/dialogs`).
components/diff-viewer.kmd
The component that renders a source-code diff in a code-hosting surface:
split (side-by-side) and unified (inline) modes, per-file sticky header
with collapse + stats, expandable context hunks, line-level add/remove/
context styling, and anchors for inline review comments.
components/dividers.kmd
Thin line separating content groups within a single surface.
Material parity (`/components/dividers`).
components/fab-menu.kmd
Material 3 Expressive FAB menu — successor of legacy "speed-dial".
ToggleFloatingActionButton + N FloatingActionButtonMenuItems with
staggered spring expansion + shape morph (FAB → "X").
components/guide-cue.kmd
One-shot tooltip-style component with arrow + title + body +
optional CTA, surfaces a single feature discovery, persists
per-user so it never re-shows after dismissal.
components/index-filters.kmd
Composite search + filter chips + saved views companion of
components/info-sprinkle.kmd
Lightweight inline help — small "i" icon next to a label that, on
hover / focus / tap, surfaces a short tooltip.
components/inline-definition.kmd
Underlined term that, on hover / focus / tap, surfaces its definition
in a popover without navigating away.
components/lists.kmd
Vertical stack of related items, each row showing a label and
optional leading / trailing elements.
components/loading-indicator.kmd
Material 3 Expressive Loading indicator — distinct from Progress
indicators.
components/log-viewer.kmd
The streaming build/run log surface for Koder Pipe (CI), Hub, and any
product that shows machine output: monospace append-only stream with
ANSI color, collapsible step groups, search, follow-tail autoscroll,
virtualization for huge logs, plus a companion job/workflow DAG graph
for multi-step builds.
components/menus.kmd
Floating list of choices anchored to a trigger — opens on demand,
closes after a choice or dismiss.
components/model-viewer.kmd
Interactive 3D model viewer — embed a glTF/GLB mesh that the user can
orbit, zoom and (on capable devices) place in AR.
components/money-input.kmd
A currency-aware amount field — optional currency selector, per-currency
decimal precision, locale-grouped formatting on blur, robust parsing of
what the user types, and a minor-unit storage contract.
components/nav-counters.kmd
Async-loaded count badges on navigation/tab items (e.g.
components/navigation.kmd
Primary navigation surfaces for switching between top-level
components/number-input.kmd
A numeric field with increment/decrement steppers, min/max/step bounds,
precision, and locale-aware formatting — the base for quantities,
counts, durations, and dimensions.
components/phone-input.kmd
Country-aware phone input — country selector + locale-aware mask +
ISO E.164 normalization on storage.
components/pickers.kmd
Compound controls for selecting a date, time, date range, or
date-time.
components/progress-indicators.kmd
Visual feedback that an operation is in progress — linear (bar) or
circular (spinner), determinate (known %) or indeterminate
(unknown duration).
components/radio-buttons.kmd
Single-select from N mutually exclusive options.
components/search-view.kmd
Full-screen / overlay search experience triggered from a search
field — shows suggestions, recent queries, and live results as the
user types.
components/sheets.kmd
Surface anchored to an edge of the screen, slidable to reveal
secondary content — bottom sheets (mobile primary) and side sheets
(tablet/desktop).
components/skeleton.kmd
Skeleton placeholder primitives — block / line / circle / image —
that mirror the final content shape during load.
components/sliders.kmd
Single-handle or range-handle control for selecting a numeric value
along a continuous or discrete scale.
components/snackbars.kmd
Transient feedback message at the bottom of the screen — confirms
an action, optionally offers a single action (undo, retry).
components/split-button.kmd
Material 3 Expressive composite button: primary action + separate menu
trigger side-by-side, divided.
components/state-label.kmd
The status pill for a code-hosting entity (issue or pull request) whose
value is drawn from a per-entity state machine, not a free tag.
components/switch.kmd
ON/OFF toggle with immediate effect.
components/tabs.kmd
Horizontal navigation within a single context — primary tabs (top
of content) and secondary tabs (filter within tab).
components/text-fields.kmd
Text input control — 2 variants (filled, outlined), single-line and
multi-line, with label, helper text, error state, leading/trailing
icons, character counter.
components/toolbars.kmd
Material 3 Expressive Toolbars — substituem o legado Bottom App Bar.
Two variants: docked (anchored bottom, 56dp) and floating (horizontal
bottom-center OR vertical side, hide-on-scroll).
components/tooltips.kmd
Brief contextual label revealing the name or description of a UI
element on hover, focus, or long-press.
components/tree-view.kmd
Hierarchical, expandable/collapsible list for nested data — file
explorers, settings navigation, nested categories, org structures — with
optional tri-state cascading checkboxes, lazy child loading, and full
keyboard + ARIA tree semantics.