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/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/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/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/navigation.kmd
Primary navigation surfaces for switching between top-level
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/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.