flint_ui library

Classes

Alert
Tone-aware alert surface for important status messages.
AnimationDirection
CSS animation-direction value.
AnimationFillMode
CSS animation-fill-mode value.
AnimationIteration
CSS animation-iteration-count value.
AnimationPlayState
CSS animation-play-state value.
AppShell
Two-column application shell with sidebar, optional brand, and topbar.
AspectRatioBox
Box that preserves a CSS aspect ratio.
AuthSessionManager
Stores and reads simple browser-side auth session state.
AuthSessionSnapshot
A read-only snapshot of the current browser auth session.
AuthShell
Authentication page shell with centered card content.
Avatar
Circular user avatar that renders an image or initials.
Background
CSS background value that can combine multiple layers.
Border
Typed CSS border shorthand value.
Box
Low-level box element with common size, spacing, and surface props.
BoxSizing
CSS box-sizing value.
Item rendered inside Breadcrumbs.
Breadcrumb navigation trail for hierarchical pages.
BrowserNavigation
BrowserStorage
Base API for browser-backed key/value storage.
Button
Semantic button with Flint UI variants, tones, sizes, and loading state.
ButtonGroup
Inline container for grouping related action buttons.
Center
Flex container that centers child content on both axes.
Checkbox
Checkbox field with label, help text, and validation message support.
ClientRouter
Browser API client with Flint-style route grouping.
Color
CSS color value used by typed Flint UI styles.
Colors
Built-in color tokens for Flint UI examples and components.
Column
Vertical flex container.
ConfirmAction
Confirmation dialog for dangerous or deliberate user actions.
ConstrainedBox
Box that applies min/max size constraints.
Container
Generic div wrapper for grouping and styling content.
Cookies
Reads and writes browser cookies for Flint UI apps.
Cursor
CSS cursor value.
DartStyle
Typed CSS style object for Flint UI components.
DashboardShell
Dashboard page shell built around AppShell and Topbar.
DataTable
Opinionated Table with default loading and empty states.
DescriptionItem
Label/value item rendered by DescriptionList.
DescriptionList
Semantic description list for label/value metadata.
Divider
Horizontal or vertical separator.
DocsShell
Documentation page shell with optional nav and sidebar.
Drawer
Slide-out dialog panel anchored to the left or right side.
EdgeInsets
Typed spacing value for CSS margin and padding.
EmptyState
Empty-state surface with title, message, icon, and action slots.
EnvironmentConfig
FieldGroup
Groups related form fields under an optional title and description.
Figure
Semantic figure element with an image and optional caption.
FileInput
File picker field with label, help text, and validation message support.
Flex
Typed CSS flex shorthand value.
FlexWrap
CSS flex-wrap value.
FlintComponent
Base class for reusable Flint UI components.
FlintComponentNode
Node wrapper that lets a FlintComponent render in the node tree.
FlintComponentRegistry
Registry that maps Flint page names to component builders.
FlintDocument
FlintElement
DOM element node with a tag, properties, and children.
FlintFragment
Groups multiple child nodes without adding an element wrapper.
FlintModelApi<T>
Browser client for conventional FlintDart model/resource endpoints.
FlintModelRecord
Lightweight browser-side record that mirrors a FlintDart model payload.
FlintNode
Base type for all renderable Flint UI nodes.
FlintPage
FlintPageContext
FlintRawHtml
Raw HTML node used by server rendering for trusted HTML fragments.
FlintRoot
Server stub for the browser DOM root.
FlintText
Text node rendered into the browser DOM.
FlintTheme
Design theme that groups colors, spacing, radii, shadows, and fonts.
FontFamily
CSS font-family value.
Form
Semantic form container with Flint UI spacing and submit handling.
FormController
Stateful helper for form data, validation errors, and submit lifecycle.
FormErrors
Collection of validation messages keyed by form field name.
FunctionalComponent
Component wrapper for a function that returns renderable output.
Gradient
CSS gradient value for typed backgrounds.
GradientDirection
Direction keyword for directional linear gradients.
GradientPosition
Position value used by radial gradients.
Gradients
Built-in gradients for Flint UI examples and components.
GradientStop
Color stop used in typed gradient factories.
Grid
CSS grid container with optional template and alignment controls.
GridTemplateColumns
CSS grid-template-columns value with helpers for common layouts.
GridTrack
CSS grid track value used by grid template helpers.
Component that synchronizes page title and head metadata.
HeadTag
Describes a browser <head> tag managed by Flint UI.
HtmlContent
Server-safe HTML content component.
Icon
Inline SVG icon component.
IconButton
Accessible icon-only button with Flint UI variants and loading state.
IconData
A reusable SVG icon definition for Flint UI.
Icons
Curated outline icons for Flint UI apps.
IconShape
A low-level SVG shape used by IconData.
Image
Responsive img element with common loading and decoding attributes.
KeyframeStep
One step in a CSS @keyframes animation.
Anchor element with optional button-style variants.
MarketingShell
Marketing page shell with optional nav, hero, content, and footer.
MissingFlintPage
Modal dialog overlay with optional header, close action, and footer actions.
ObjectFit
CSS object-fit value.
Overflow
CSS overflow value.
Page header with title, optional description, breadcrumbs, and actions.
PageShell
Full-page layout with optional navigation, header, content, and footer.
Pagination
Pagination controls with page summary and sibling page buttons.
Panel
Bordered content panel with optional section heading.
Popover
Inline popover with trigger content and floating dialog content.
PortfolioShell
Portfolio-oriented page shell with optional nav, hero, content, and footer.
ProgressBar
Accessible progress indicator with tone-colored fill.
QueryParams
RadioGroup
Fieldset of mutually exclusive radio options.
RadioOption
Option rendered inside a RadioGroup.
Resize
CSS resize value.
ResourceController<T>
Reactive controller for loading and refreshing API data.
ResourceSnapshot<T>
Immutable snapshot of an API-backed resource.
ResourceView<T>
Rebuilds when a ResourceController changes.
ResponsiveGrid
Responsive grid that uses auto-fit columns by default.
RootDesign
Global design CSS for root, document, and app-wide selectors.
Row
Horizontal flex container.
SafeArea
Container that pads content away from browser safe-area insets.
ScrollBehavior
CSS scroll-behavior value.
Search form with accessible input and submit handling.
Section
Content section with optional heading, description, and actions.
Select
Select field with options, placeholder, help text, and validation support.
SelectOption
Option rendered inside a Select field.
Shadow
Typed CSS box-shadow value.
Vertical navigation sidebar with active and collapsed states.
SidebarItem
Navigation item rendered by Sidebar.
SizeValue
CSS size value with an explicit unit.
Skeleton
Placeholder loading shape for content that has not loaded yet.
Spacer
Empty flex/grid spacer element.
Spinner
Accessible loading spinner.
Stack
Relative-positioned container for layered content.
StatCard
Metric card for dashboard statistics.
StatefulComponent
Base class for components that own local state or lifecycle resources.
StatelessComponent
Base class for components that only render constructor-provided values.
StateSignal<T>
A tiny reactive value for Flint UI components.
StateSignalListener<T>
Rebuilds its child whenever a StateSignal changes.
StatusBadge
Compact badge for status labels and optional icons.
StyleAnimation
Typed CSS animation shorthand value.
StyleFilter
Typed CSS filter value.
StyleKeyframes
CSS @keyframes animation built from typed style steps.
StyleRule
CSS rule with base styles and common interaction state styles.
StyleSheet
Named stylesheet that compiles class-based style rules to CSS text.
StyleTransform
Typed CSS transform value.
StyleTransition
Typed CSS transition value.
Switch
Checkbox-based switch control with ARIA switch semantics.
TabItem
Tab option rendered by Tabs.
Table
Scrollable data table with loading, empty, and selectable row states.
TableColumn
Column definition used by Table.
TableRowData
Row data rendered by Table.
Tabs
Tablist control for switching between keyed tabs.
Text
Text node and semantic text element helpers.
TextArea
Multiline text input with label, help text, validation, and controller support.
TextDecorationStyle
CSS text-decoration value.
TextEditingController
Mutable text value with listener notifications for controlled inputs.
TextField
Text input field with label, help text, validation, and controller support.
TextTransform
CSS text-transform value.
ThemeToken
Convenience factories for common theme token namespaces.
ThemeTokens
Collection of design token values that compile to CSS variables.
Timeline
Ordered timeline of events with tone-colored markers.
TimelineItem
Event entry rendered by Timeline.
Toast
Toast notification surface with optional message and action content.
ToastService
TokenRef
Reference to a design token CSS variable.
Tooltip
Tooltip content attached to an inline child.
Topbar
Top navigation bar with title, leading content, actions, and user slot.
TransitionTiming
CSS transition timing function.
UsageMeter
Usage summary paired with a progress bar.
WillChange
CSS will-change value.
Wrap
Flex container that wraps child items onto multiple lines.

Enums

AlignItems
CSS align-items values.
BadgeVariant
Visual variants for badges and status pills.
Breakpoint
Responsive breakpoint used by scoped Dart styles.
ButtonVariant
Visual variants for button-like actions.
CardVariant
Visual variants for card-like surfaces.
ComponentSize
Shared component size scale.
CookieSameSite
SameSite policy values for browser cookies.
Display
CSS display values.
FlexDirection
CSS flex-direction values.
ImageDecoding
Browser image decoding strategy.
ImageLoading
Browser image loading strategy.
InputVariant
Visual variants for form inputs.
JustifyContent
CSS justify-content values.
Visual variants for navigation items.
Position
CSS position values.
ResourceStatus
Lifecycle state for an API-backed resource.
TextAlign
CSS text-align values.
ToastPlacement
Tone
Semantic tone used by shared widget theme helpers.

Constants

authSession → const AuthSessionManager
Shared auth session helper backed by browser local storage.
cookies → const Cookies
Shared browser cookie helper.
env → const EnvironmentConfig
flintDocument → const FlintDocument
localStorage → const MemoryStorage
query → const QueryParams
sessionStorage → const MemoryStorage
toast → const ToastService

Properties

clientRouter → ClientRouter
Shared browser API router using the current origin.
final
currentHash → String
no setter
currentPath → String
no setter
currentQuery → String
no setter
currentUri → Uri
no setter
currentUrl → String
no setter

Functions

back() → void
button({Map<String, Object?> props = const {}, List<Object?> children = const []}) → FlintElement
Creates a raw button element.
component(FlintComponent component) → FlintComponentNode
Creates a node that renders component.
consumeCollectedStyleCss() → String
createFlintApp(String selector, {Map<String, FlintPageBuilder>? pages, FlintComponentRegistry? registry, FlintAsyncPageBuilder? resolvePage, List<FlintPageMiddleware> middlewares = const [], List<Object> stylesheets = const [], Object? rootDesign, FlintComponent missingPage(String component)?}) → void
createRoot(String selector) → FlintRoot
createRootForElement(Object? element) → FlintRoot
cssValue(Object? value, {bool unitlessNumber = false}) → String
Converts typed style values into CSS strings.
decodeFlintPagePayload(String value) → Map<String, dynamic>
div({Map<String, Object?> props = const {}, List<Object?> children = const []}) → FlintElement
Creates a raw div element.
forward() → void
fragment(List<Object?> children) → FlintFragment
Creates a fragment node from normalized children.
go(int delta) → void
h(String tag, {Map<String, Object?> props = const {}, List<Object?> children = const []}) → FlintElement
Creates a raw element node with tag, props, and normalized children.
input({Map<String, Object?> props = const {}}) → FlintElement
Creates a raw input element.
joinClassNames(Iterable<String?> values) → String
Joins non-empty CSS class names with spaces.
mergeComponentProps(Map<String, Object?> props, {String? className, Map<String, Object?> defaultStyle = const {}, Map<String, Object?> variantStyle = const {}, DartStyle? dartStyle, Map<String, Object?> style = const {}}) → Map<String, Object?>
Merges component props, classes, inline styles, and scoped Dart styles.
mergeStyles(Map<String, Object?> first, Map<String, Object?> second, [Map<String, Object?> third = const {}, Map<String, Object?> fourth = const {}, Map<String, Object?> fifth = const {}]) → Map<String, Object?>
Combines style maps from left to right, ignoring null values.
normalizeChildren(Object? child, List<Object?> children) → List<FlintNode>
Normalizes a single child and additional children into Flint nodes.
registerRootDesign(RootDesign design) → void
registerStyleSheet(StyleSheet stylesheet) → void
reload() → void
replace(String url, {Object? state}) → void
resetCollectedStyleCss() → void
resolveFieldError({required String? name, String? error, FormErrors? errors}) → String?
Resolves an explicit field error before falling back to errors.
rootStyleToCss(Map<String, Object?> style) → String
Converts a style map into root-level CSS declarations.
span({Map<String, Object?> props = const {}, List<Object?> children = const []}) → FlintElement
Creates a raw span element.
styleToCss(Map<String, Object?> style) → String
Converts a style map into a CSS declaration string.
text(Object? value) → FlintText
Creates a text node from value.
toFlintNode(Object? value) → FlintNode
Converts common values into a renderable Flint node.
token(String name, {Object? fallback}) → TokenRef
Creates a reference to a design token.
useForm(Map<String, Object?> initialValues) → FormController
Creates a FormController initialized with initialValues.

Typedefs

Component = StatefulComponent
Backwards-compatible alias for StatefulComponent.
FlintAsyncPageBuilder = FutureOr<FlintPageBuilder?> Function(String component)
FlintPageBuilder = FlintComponent Function(Map<String, dynamic> props)
Builds a page component from server-provided props.
FlintPageMiddleware = void Function(FlintPageContext context)
FlintStateUpdater = void Function()
Callback used to mutate component state before a rerender is scheduled.
FlintVoidCallback = void Function()
Listener signature used by form and text editing controllers.
JsonModelFactory<T> = T Function(Map<String, dynamic> json)
Builds a typed object from a JSON map returned by a FlintDart API.
LocalStorage = MemoryStorage
Node = FlintNode
Short public alias for FlintNode in app code and examples.
ResourceBuilder<T> = View? Function(ResourceSnapshot<T> snapshot)
Builds UI from the current resource snapshot.
ResourceLoader<T> = Future<T> Function()
Loads data for a ResourceController.
SessionStorage = MemoryStorage
StateSignalBuilder<T> = View? Function(T value)
Builds UI from a StateSignal value.
StateSignalCallback<T> = void Function(T value)
Called when a StateSignal changes.
StateSignalSubscription = void Function()
Cancels a StateSignal.listen subscription.
View = Object?
Return type for component build methods.