START HERE
Getting Started
ARCHITECTURE
Architecture Overview
Write-Once Components
Declarative Surface
Package Architecture
Components
Styling
Localization
Analytics & GTM
WRITE-ONCE
Photon Engine
Design System
Capabilities
Storage
Forms
Code Editor
Markdown
Mermaid
Email Rendering
COMPILATION
Compiler
Supported C# Features
External Type Resolution
Build Flow
Diagnostics
RUNTIME
Runtime (TypeScript)
Performance
SERVER
Server Integration
Server Events
Assets
BunPackage
Security
ECOSYSTEM
Image
Charts
Icons
Lottie
DEVELOPMENT
Visual Editor
Debug
Roadmap
Upgrading
ACTIONS & INPUTS
Button
IconButton
TextInput
Select
Checkbox
Switch
RadioGroup
SegmentedControl
Slider
Stepper
SearchField
SURFACES & DISPLAY
Card
Badge
Chip
Avatar
Banner
ProgressBar
EmptyState
Divider
NAVIGATION
Tabs
AppBar
BottomNavigation
Breadcrumb
Pagination
PageIndicator
Menu
Drawer
OVERLAYS
Dialog
BottomSheet
Toast
Popover
Tooltip
LISTS & DATA
List
ListView
Table
Accordion
CodeBlock
TOUCH INTERACTION
PullToRefresh
SwipeableRow
DocsLists & data
ListView source
1 min readListItem is a row with title, subtitle and leading/trailing slots; List stacks them with optional dividers.
1
using eQuantic.UI.Components;
LISTITEM
WC
Write-once componentsOne class, two runtimes
3
DS
Declarative surfaceFactories that mirror constructors
Usage
1
2
3
4
5
6
7
8
9
10
new List
{
Items = accounts.Select(a => new ListItem(a.Name, a.Number)
{
Leading = new Avatar(a.Initials),
Trailing = new Icon(Icons.ChevronRight),
OnPressed = () => Open(a),
}).ToList(),
Dividers = true,
}
API
Prop
Type
Default
Description
Item.Title
string
—
Primary line.
Item.Subtitle
string?
null
Secondary line, truncated to one line.
Item.Leading
VisualNode?
null
Avatar, icon or checkbox.
Item.Trailing
VisualNode?
null
Chevron, value, or a switch.
Item.OnPressed
Action?
null
Makes the row a single target.
Item.Disabled
bool
false
0.38, not pressable.
Items
IReadOnlyList<ListItem>
—
The rows.
Dividers
bool
false
Hairlines between rows.
States
State
Rendering
Rest
Surface
Pressed
SurfaceSubtle wash
Disabled
0.38
Accessibility
•
Each row is one focus stop announcing its whole content; a trailing chevron is decorative.
When to use
•
Bounded collections you can render at once.
Avoid
•
Thousands of rows — that is ListView.
NOTEEvery dimension resolves through Sizing.*(SizeVariant) and the token scales — never a literal. Source: src/eQuantic.UI.Components/ListItem.cs.