Chunks
Opinionated compositions of Primitives. Solve the most common page and panel layouts with literal Tailwind already arranged.
Layouts
AppShell
Outer dark-mode + popover/toaster mount
BlankShell
No-chrome envelope; sets background and font only
CenteredShell
Single centered column for auth / error / empty states
DialogShell
Opinionated wrapper around the Dialog primitive
ListDetailShell
Opinionated SplitShell with selection state
PageShell
In-app page envelope with header/body/aside/footer slots
SheetShell
Edge-sliding panel; wraps Sheet primitive
SplitShell
Two-pane (master/detail) layout, optional resizable
Headers
AnnouncementBar
Top-of-app dismissible banner — Message + Tone + optional Action
AppBrand
Logo + product name + optional version chip
AppHeader
Sticky top bar with backdrop blur — slots: Brand, Nav, Actions
PageHeader
Top of an in-page area: Title, Description, Breadcrumbs, Actions
SectionHeader
Smaller heading band inside a ContentSection
SubHeader
Context strip below AppHeader (env switcher, ambient breadcrumbs)
Toolbar
Horizontal action strip — slots: Start, Center, End. Density enum
Navigation
AccountMenu
Avatar trigger + DropdownMenu shell — Name, Email, AvatarUrl, Initials
AppSidebar
Pre-wired sidebar with Brand / Nav / Footer slots
BackLink
Single "← Back to X" element — Href, Label
BreadcrumbBar
Declarative breadcrumb — Items: IList<BreadcrumbItem>
NavGroup
Labelled grouping inside a NavList — Label, Collapsible, DefaultOpen
NavList
Vertical link list — ChildContent of NavListItem / NavGroup
NavListItem
Single link row — Href, IconSvg, Label, Active, Badge, OnClick
NavRail
Narrow icon-only nav rail — Items: IList<NavRailItem>
TabBar
Top-of-page tab navigation — Items: IList<TabDefinition>
Content
ActionCard
Card with click target + trailing arrow — Href / OnClick
Callout
Visually distinct aside — Title, Tone, IconSvg, ChildContent
CardGrid
Responsive grid of cards — Columns, Gap
Container
Max-width content centerer — MaxWidth: Size
ContentSection
Section header + body in standard padding/spacing
ElevatedCard
Card primitive wrapper — Style / Elevation / HoverElevation
EmptyStatePanel
EmptyState wrapped in section-level chrome
EmptyView
Full-page empty state
ErrorStatePanel
ErrorState wrapped in section chrome — adds Status (e.g. 404)
ErrorView
Full-page error
FeatureCard
Icon + Title + Description card; for landing/onboarding
Hero
Landing-style intro band — Title, Subtitle, Actions, Media
KpiTile
Single big-number stat tile — Label, Value, Delta, Trend
LoadingPanel
Spinner + optional message centered in min-height block
LoadingView
Full-page loading
MediaCard
Thumbnail-first card — Image + Title/Description + Actions
MetricGroup
Horizontal arrangement of KpiTiles with dividers
PageContent
Vertical stack of sections with consistent gap
SkeletonCard
Skeleton-of-a-card preset for grid loading
StatCard
Card-based KPI with Sparkline + Actions slots
Forms
CheckboxField
Inline checkbox + label-right field wrapper
ComboboxField
Combobox wrapper — Items, Value, Placeholder
ConfirmDialog
Dialog-based confirm-action wrapper — Tone, ConfirmLabel
DateField
DatePicker wrapper — DateTime? Value
FileUpload
Drop-zone file picker — click or drag-and-drop, IBrowserFile
FilterBar
Horizontal filter chip row — Filters, ClearAction
FormActions
Sticky-bottom action row — Start, End slots
FormGrid
Multi-column field layout — Columns, Gap
FormLabel
Form-context wrapper around the Label primitive
FormSection
Labelled grouping of fields — Title, Description, ChildContent
FormShell
Page-level form envelope: PageHeader + Sections + FormActions
InlineForm
Single-row form for search-and-go / subscribe / quick-add
LoginForm
Opinionated login template — Email/Password + Footer slot
PasswordField
Password Input + show/hide toggle
RadioGroupField
Vertical radio group with label-above
SearchBar
Toolbar pattern: SearchInput + filter slot + result-count
SearchField
SearchInput wrapper — Query, Placeholder
SelectField
Select wrapper — Items, Value, Placeholder
SliderField
Slider wrapper — Min, Max, Step, Value
SwitchField
Inline switch + label-right field wrapper
TextAreaField
Textarea wrapper — Rows, Value
TextField
Input wrapper — Type (Text/Email/Number/Tel/Url), Value
TimeField
TimePicker wrapper — TimeSpan? Value
ToggleField
Inline toggle + label-right field wrapper
ToggleGroupField
Horizontal multi-button toggle group — Options
WizardShell
Stepper + per-step body + Back/Next footer
Data
BulkActionBar
Selection-driven action bar above a table
DataPage
Full data-table page envelope — Toolbar, Table, Pagination slots
DataPagination
Pagination row with item count + page nav
DataToolbar
Search + filters + view-switcher + actions row above a table
DetailPage
Record detail layout — Title, Description, Main / Aside / Footer
EmptyTable
Empty state inside a Table aware of column count
FilterChip
Single removable filter chip — Label, OnRemove, IconSvg
KvList
Label/value definition list — ChildContent of KvListItem
ResultsList
Generic vertical list with selection, optional pagination, Empty
RowActions
Table-row dropdown action menu — Items slot
SettingsPage
Side-tabs + content area — Tabs, SelectedTab, Content slot
Marketplace
ContextPanelShell
XMC Page Builder left context panel shell
CustomFieldShell
XMC Page Builder Custom Field dialog shell
DashboardWidgetShell
XMC Dashboard widget shell — Title, Header, Body
FullScreenShell
XMC Sites full-screen iframe shell — ChildContent
StandaloneShell
Cloud Portal homepage standalone shell — ChildContent